typo3-typescript-sources 14.3.4 → 14.3.6

package/backend/tests/settings/type/stringlist-test.ts

@@ -0,0 +1,90 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+
+import { StringlistTypeElement } from '@typo3/backend/settings/type/stringlist.js';
+import { expect } from '@open-wc/testing';
+import type { } from 'mocha';
+
+describe('@typo3/backend/settings/type/stringlist', () => {
+  let root: HTMLElement;
+
+  beforeEach((): void => {
+    root = document.createElement('div');
+    document.body.appendChild(root);
+  });
+
+  afterEach((): void => {
+    root.remove();
+    root = null;
+  });
+
+  it('renders one button when the value list is empty', async () => {
+    const element = new StringlistTypeElement;
+    element.formid = 'setting-test';
+    element.value = [];
+    root.appendChild(element);
+    await new Promise((resolve) => setTimeout(resolve, 100));
+
+    const inputs = element.querySelectorAll<HTMLInputElement>('input[type="text"]');
+    expect(inputs).to.have.lengthOf(0);
+
+    const buttons = element.querySelectorAll<HTMLButtonElement>('button');
+    expect(buttons).to.have.lengthOf(1);
+  });
+
+  it('renders one empty input when the value list is a single empty string', async () => {
+    const element = new StringlistTypeElement;
+    element.formid = 'setting-test';
+    element.value = [''];
+    root.appendChild(element);
+    await new Promise((resolve) => setTimeout(resolve, 100));
+
+    const inputs = element.querySelectorAll<HTMLInputElement>('input[type="text"]');
+    expect(inputs).to.have.lengthOf(1);
+    expect(inputs[0].id).to.equal('setting-test');
+  });
+
+  it('hides the remove button when only one row is shown', async () => {
+    const element = new StringlistTypeElement;
+    element.value = [];
+    root.appendChild(element);
+    await new Promise((resolve) => setTimeout(resolve, 100));
+
+    expect(element.querySelectorAll('button')).to.have.lengthOf(1);
+  });
+
+  it('adds a row when the add button is clicked on an empty list', async () => {
+    const element = new StringlistTypeElement;
+    element.value = [];
+    root.appendChild(element);
+    await new Promise((resolve) => setTimeout(resolve, 100));
+
+    const addButton = element.querySelectorAll<HTMLButtonElement>('button:not([disabled])')[0];
+    addButton.click();
+    await new Promise((resolve) => setTimeout(resolve, 100));
+
+    expect(element.value).to.deep.equal(['']);
+    expect(element.querySelectorAll('input[type="text"]')).to.have.lengthOf(1);
+  });
+
+  it('renders per-row controls for each entry when value has multiple entries', async () => {
+    const element = new StringlistTypeElement;
+    element.value = ['/typo3', '/fileadmin'];
+    root.appendChild(element);
+    await new Promise((resolve) => setTimeout(resolve, 100));
+
+    expect(element.querySelectorAll('input[type="text"]')).to.have.lengthOf(2);
+    // Two rows, each with + and - buttons.
+    expect(element.querySelectorAll('button')).to.have.lengthOf(4);
+  });
+});

package/backend/toolbar/system-information-menu.ts

@@ -17,6 +17,7 @@ import Icons from '../icons';
 import PersistentStorage from '../storage/persistent';
 import Viewport from '../viewport';
 import type { AjaxResponse } from '@typo3/core/ajax/ajax-response';
+import '../element/status-indicator-element';
 
 /**
  * Explicit selectors to avoid nesting queries

package/backend/tree/page-position-select.ts

@@ -56,6 +56,21 @@ export class InsertPositionChangeEvent extends CustomEvent<{pageUid: number, pos
     });
   }
 }
+
+export class InsertPositionConfirmEvent extends CustomEvent<{pageUid: number, position: Position}> {
+  static readonly eventName = 'typo3:page-position-select-tree:insert-position-confirm';
+  constructor(pageUid: number, position: Position) {
+    super(InsertPositionConfirmEvent.eventName, {
+      detail: {
+        pageUid: pageUid,
+        position: position,
+      },
+      bubbles: true,
+      composed: true
+    });
+  }
+}
+
 @customElement('typo3-backend-component-page-position-select-tree')
 export class PagePositionSelectTree extends PageTree {
 
@@ -140,6 +155,16 @@ export class PagePositionSelect extends LitElement {
 
   private async handleNodeSelected(event: CustomEvent): Promise<void> {
     const selectedNode: TreeNodeInterface = event.detail.node;
+
+    // Re-selecting the active node confirms it and advances the wizard.
+    if (this.isActivePagePositionNode(selectedNode)) {
+      this.dispatchEvent(new InsertPositionConfirmEvent(
+        this.activePageId,
+        this.insertPosition
+      ));
+      return;
+    }
+
     const [pageUid, insertPosition] = selectedNode.identifier.split('-');
     this.insertPosition = (insertPosition ?? 'inside') as Position;
     this.activePageId = Number(pageUid);

package/backend/wizard/finisher/event-finisher.ts

@@ -0,0 +1,62 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+
+import { html, type TemplateResult } from 'lit';
+import type { FinisherInterface } from '@typo3/backend/wizard/finisher/finisher-interface';
+import type { FinisherConfig } from '@typo3/backend/wizard/finisher/finisher-config';
+
+/**
+ * Event finisher - dispatches the event supplied via `config.data.event` when
+ * the wizard finishes.
+ *
+ * The wizard runs in the top window while backend modules live in content
+ * frames, so the event is broadcast to the top document and every child frame,
+ * where the module that opened the wizard (e.g. the dashboard) can listen for
+ * it on its own document and update in place instead of reloading.
+ */
+export default class EventFinisher implements FinisherInterface {
+  private config!: FinisherConfig;
+
+  public setConfig(config: FinisherConfig): void {
+    this.config = config;
+  }
+
+  async render(): Promise<TemplateResult> {
+    return html`
+      <typo3-backend-alert
+        severity="0"
+        heading="${this.config.labels.successTitle}"
+        message="${this.config.labels.successDescription}"
+        show-icon
+      ></typo3-backend-alert>
+    `;
+  }
+
+  async execute(): Promise<void> {
+    const event = this.config.data.event;
+
+    if (!(event instanceof Event)) {
+      console.warn('Event finisher called without an event to dispatch');
+      return;
+    }
+
+    document.dispatchEvent(event);
+    for (let i = 0; i < window.frames.length; i++) {
+      try {
+        window.frames[i].document.dispatchEvent(event);
+      } catch {
+        // Cross-origin frame, skip
+      }
+    }
+  }
+}

package/backend/wizard/wizard.ts

@@ -14,6 +14,8 @@
 import { html, LitElement, nothing, type PropertyValues, type TemplateResult } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
+import { createRef, ref, type Ref } from 'lit/directives/ref.js';
+import { KeyTypesEnum } from '@typo3/backend/enum/key-types';
 import Modal from '@typo3/backend/modal';
 import '@typo3/backend/element/alert-element';
 import '@typo3/backend/element/icon-element';
@@ -41,6 +43,7 @@ type DataStoreKey = keyof DataStore;
 export class Wizard extends LitElement {
   @property({ type: Array, attribute: false }) steps: WizardStepInterface[] = [];
   @property({ type: String, attribute: 'confirm-button-label' }) confirmButtonLabel: string;
+  @property({ type: Boolean, attribute: 'skip-summary' }) skipSummary: boolean = false;
   @property({ type: Object, attribute: false }) submissionService: SubmissionServiceInterface;
 
   @state() protected currentStepIndex: number = 0;
@@ -49,6 +52,8 @@ export class Wizard extends LitElement {
   @state() protected allSteps: WizardStepInterface[] = [];
 
   private progressTracker: ProgressTrackerElement | null = null;
+  private readonly primaryButtonRef: Ref<HTMLButtonElement> = createRef();
+  private focusPendingStep: WizardStepInterface | null = null;
 
   override connectedCallback(): void {
     super.connectedCallback();
@@ -144,7 +149,7 @@ export class Wizard extends LitElement {
     return html`
       <div class="wizard">
         <div class="wizard-progress">${this.renderProgressTracker()}</div>
-        <div class="wizard-content" aria-live="polite">${this.currentStep?.render()}</div>
+        <div class="wizard-content" aria-live="polite" @keydown=${this.handleContentKeydown}>${this.currentStep?.render()}</div>
         <div class="wizard-actions">${this.renderWizardButtons()}</div>
       </div>
     `;
@@ -177,7 +182,7 @@ export class Wizard extends LitElement {
     ) {
       this.allSteps = [
         ...this.steps,
-        new ConfirmStep(this),
+        ...(this.skipSummary ? [] : [new ConfirmStep(this)]),
         new FinisherStep(this, this.submissionService),
       ];
 
@@ -188,13 +193,87 @@ export class Wizard extends LitElement {
     }
 
     if (this.currentStep && _changedProperties.has('currentStep')) {
+      // Optional per-step readiness hook (e.g. reinitialising FormEngine).
       if (this.hasAfterRender(this.currentStep)) {
         await this.currentStep.afterRender();
         this.requestUpdate();
       }
+      this.focusPendingStep = this.currentStep;
+    }
+
+    await this.moveFocusIntoStep();
+  }
+
+  /**
+   * Move focus into the current step's content once present. Async steps (e.g.
+   * @lit/task) re-render the wizard when their data settles, so retry on every
+   * update until a focus target is found — no per-step focus wiring required.
+   */
+  private async moveFocusIntoStep(): Promise<void> {
+    const step = this.focusPendingStep;
+    if (!step || step !== this.currentStep) {
+      this.focusPendingStep = null; // no request, or navigated on since
+      return;
+    }
+    await this.updateComplete;
+    if (step === this.currentStep && this.focusStepContent()) {
+      this.focusPendingStep = null;
     }
   }
 
+  /**
+   * Focus the selected radio, otherwise the first form control. Returns whether
+   * focus settled on the step's own content; the primary-button fall back
+   * returns `false` so async content can still claim focus once it renders.
+   */
+  private focusStepContent(): boolean {
+    const content = this.renderRoot.querySelector('.wizard-content');
+    if (content) {
+      // Don't steal focus if the step already has a focus.
+      if (content.contains(this.ownerDocument.activeElement)) {
+        return true;
+      }
+
+      const target = this.findFocusTarget(content);
+      if (target) {
+        // autofocus makes an opening modal <dialog> pick this over the close
+        // button; focus() covers later step transitions.
+        target.setAttribute('autofocus', '');
+        target.focus();
+        return true;
+      }
+    }
+
+    // No focusable content (yet): fall back to the primary button, but not if
+    // focus already rests on an action button (don't steal it on re-renders).
+    const actions = this.renderRoot.querySelector('.wizard-actions');
+    if (!actions?.contains(this.ownerDocument.activeElement)) {
+      this.primaryButtonRef.value?.focus();
+    }
+
+    return false;
+  }
+
+  /**
+   * Explicit autofocus wins, then the selected radio, then the first control
+   * that is enabled and visible. Shadow roots are not pierced — custom
+   * elements take part by declaring autofocus or tabindex="0" on their host.
+   */
+  private findFocusTarget(content: Element): HTMLElement | null {
+    const firstOperable = (selector: string): HTMLElement | null => {
+      for (const element of content.querySelectorAll<HTMLElement>(selector)) {
+        if (!element.matches(':disabled') && element.checkVisibility()) {
+          return element;
+        }
+      }
+      return null;
+    };
+
+    return firstOperable('[autofocus]')
+      ?? firstOperable('input[type="radio"]:checked')
+      ?? firstOperable('input:not([type="hidden"]):not([type="radio"]):not([readonly]), select, button, textarea:not([readonly]), [contenteditable]:not([contenteditable="false"]), [tabindex]:not([tabindex="-1"])');
+  }
+
   private hasAfterRender(step: WizardStepInterface): step is WizardStepInterface & WizardStepAfterRenderInterface {
     return step && typeof (step as any).afterRender === 'function';
   }
@@ -211,6 +290,23 @@ export class Wizard extends LitElement {
     this.tryAutoAdvance();
   };
 
+  /**
+   * Enter inside a bare input advances the wizard, emulating a form submit.
+   * Controls with their own Enter behaviour are left alone: inputs inside a
+   * <form>, search inputs, checkboxes and non-input controls.
+   */
+  private readonly handleContentKeydown = (event: KeyboardEvent): void => {
+    if (event.key !== KeyTypesEnum.ENTER) {
+      return;
+    }
+    const target = event.target;
+    if (!(target instanceof HTMLInputElement) || target.form || target.type === 'search' || target.type === 'checkbox') {
+      return;
+    }
+    event.preventDefault();
+    void this.handleNext();
+  };
+
   private renderWizardButtons(): TemplateResult {
     return html`
       ${this.renderPreviousButton()}
@@ -261,7 +357,7 @@ export class Wizard extends LitElement {
     return html`
       <div>
         ${resetButtonHtml}
-        <button type="button" class="${classMap({ 'btn': true, 'btn-primary': true, 'disabled': !isComplete })}"
+        <button type="button" ${ref(this.primaryButtonRef)} class="${classMap({ 'btn': true, 'btn-primary': true, 'disabled': !isComplete })}"
           @click="${this.handleNext}"
         >
           ${buttonLabel}

package/dashboard/dashboard-wizard.ts

@@ -0,0 +1,86 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+import { customElement, query, state } from 'lit/decorators.js';
+import { html, LitElement, type PropertyValues, type TemplateResult } from 'lit';
+import type { SubmissionServiceInterface } from '@typo3/backend/wizard/finisher/submission-service-interface';
+import type { WizardStepInterface } from '@typo3/backend/wizard/steps/wizard-step-interface';
+import type { DataStore, Wizard } from '@typo3/backend/wizard/wizard';
+import { AutoAdvanceEvent } from '@typo3/backend/wizard/events/auto-advance-event';
+import PresetStep from '@typo3/dashboard/wizard/steps/preset-step';
+import TitleStep from '@typo3/dashboard/wizard/steps/title-step';
+import { DashboardWizardSubmissionService } from '@typo3/dashboard/wizard/finisher/dashboard-wizard-submission-service';
+
+export interface DashboardWizardDataStore extends DataStore {
+  preset?: string;
+  title?: string;
+}
+
+type DashboardWizardDataStoreKey = keyof DashboardWizardDataStore;
+
+export interface DashboardWizardContext {
+  wizard: Wizard;
+  getStoreData: <T extends DashboardWizardDataStoreKey>(key: T) => NoInfer<DashboardWizardDataStore[T]>;
+  setStoreData: <T extends DashboardWizardDataStoreKey>(key: T, value: NoInfer<DashboardWizardDataStore[T]>) => void;
+  clearStoreData: <T extends DashboardWizardDataStoreKey>(key: T) => void;
+  getDataStore: () => Readonly<DashboardWizardDataStore>;
+  dispatchAutoAdvance: () => void;
+}
+
+@customElement('typo3-dashboard-wizard')
+export class DashboardWizard extends LitElement {
+  @state() steps: WizardStepInterface[] = [];
+  @state() submissionService: SubmissionServiceInterface;
+
+  @query('typo3-backend-wizard') wizard!: Wizard;
+
+  private context: DashboardWizardContext;
+
+  protected override firstUpdated(_changedProperties: PropertyValues): void {
+    super.firstUpdated(_changedProperties);
+
+    this.context = {
+      wizard: this.wizard,
+      getStoreData: this.wizard.getStoreData.bind(this.wizard),
+      setStoreData: this.wizard.setStoreData.bind(this.wizard),
+      clearStoreData: this.wizard.clearStoreData.bind(this.wizard),
+      getDataStore: this.wizard.getDataStore.bind(this.wizard),
+      dispatchAutoAdvance: () => this.wizard.dispatchEvent(new AutoAdvanceEvent())
+    };
+
+    this.steps = [
+      new PresetStep(this.context),
+      new TitleStep(this.context),
+    ];
+
+    this.submissionService = new DashboardWizardSubmissionService(this.context);
+  }
+
+  protected override createRenderRoot(): HTMLElement | DocumentFragment {
+    return this;
+  }
+
+  protected override render(): TemplateResult {
+    return html`
+      <typo3-backend-wizard .steps="${this.steps}"
+                            .submissionService="${this.submissionService}"
+                            skip-summary
+      ></typo3-backend-wizard>
+    `;
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    'typo3-dashboard-wizard': DashboardWizard;
+  }
+}

package/dashboard/dashboard.ts

@@ -22,7 +22,7 @@ import '@typo3/backend/element/icon-element';
 import AjaxRequest from '@typo3/core/ajax/ajax-request';
 import ClientStorage from '@typo3/backend/storage/client';
 import { delay } from '@typo3/core/lit-helper';
-import Modal, { type ModalElement } from '@typo3/backend/modal';
+import Modal, { type ModalElement, Size } from '@typo3/backend/modal';
 import { SeverityEnum } from '@typo3/backend/enum/severity';
 import { AjaxResponse } from '@typo3/core/ajax/ajax-response';
 import { Categories, type DataCategoriesInterface, type NewRecordWizardItemSelectedEventInterface } from '@typo3/backend/new-record-wizard';
@@ -49,7 +49,7 @@ interface DashboardInterface {
   widgetPositions: Record<number, DashboardWidgetPosition[]>
 }
 
-interface DashboardPresetInterface {
+export interface DashboardPresetInterface {
   identifier: string;
   title: string;
   description: string;
@@ -154,7 +154,7 @@ class DashboardWidgetRefreshEvent extends Event {
   }
 }
 
-class DashboardAddEvent extends Event {
+export class DashboardAddEvent extends Event {
   static readonly eventName = 'typo3:dashboard:dashboard:add';
 
   constructor(
@@ -446,6 +446,8 @@ export class Dashboard extends LitElement {
     this.mql = window.matchMedia('(prefers-reduced-motion: reduce)');
     this.mqListener(this.mql);
     this.mql.addEventListener('change', this.mqListener);
+
+    document.addEventListener(DashboardAddEvent.eventName, this.relayAddDashboardEvent);
   }
 
   public override disconnectedCallback() {
@@ -456,6 +458,8 @@ export class Dashboard extends LitElement {
 
     this.mql?.removeEventListener('change', this.mqListener);
     this.mql = null;
+
+    document.removeEventListener(DashboardAddEvent.eventName, this.relayAddDashboardEvent);
   }
 
   protected readonly mqListener = (mql: MediaQueryList|MediaQueryListEvent): void => {
@@ -496,6 +500,16 @@ export class Dashboard extends LitElement {
     `;
   }
 
+  /**
+   * Relays the cross-frame add broadcast (dispatched on `document` by the
+   * wizard finisher) onto the element, so it is handled alongside the other
+   * dashboard events. A fresh event is created because an in-flight event
+   * cannot be re-dispatched.
+   */
+  private readonly relayAddDashboardEvent = (event: DashboardAddEvent): void => {
+    this.dispatchEvent(new DashboardAddEvent(event.preset, event.title));
+  };
+
   private async load(): Promise<void> {
     this.loading = true;
     this.dashboards = await this.fetchDashboards();
@@ -514,11 +528,6 @@ export class Dashboard extends LitElement {
     }
   }
 
-  private async fetchPresets(): Promise<DashboardPresetInterface[]> {
-    const data = await this.fetchData(TYPO3.settings.ajaxUrls.dashboard_presets_get);
-    return Object.values(data);
-  }
-
   private async fetchCategories(): Promise<Categories> {
     const data = await this.fetchData(TYPO3.settings.ajaxUrls.dashboard_categories_get);
     return Categories.fromData(data as DataCategoriesInterface);
@@ -538,79 +547,19 @@ export class Dashboard extends LitElement {
   }
 
   private async createDashboard(): Promise<void> {
-    const presets = await this.fetchPresets();
-    const filteredPresets = presets.filter(preset => preset.showInWizard);
-
-    const content = html`
-      <form>
-        <div class="form-group">
-          <label class="form-label" for="dashboard-form-add-title">${labels.get('dashboard.title')}</label>
-          <input class="form-control" id="dashboard-form-add-title" type="text" name="title" required="required">
-        </div>
-        <div class="dashboard-modal-items">
-          ${repeat(filteredPresets, (preset: DashboardPresetInterface) => preset.identifier, (preset: DashboardPresetInterface, index: number) => html`
-            <div class="dashboard-modal-item">
-              <input
-                type="radio"
-                name="preset"
-                value=${preset.identifier}
-                class="dashboard-modal-item-checkbox"
-                id="dashboard-form-add-preset-${preset.identifier}"
-                ?checked=${index === 0}
-              >
-              <label for="dashboard-form-add-preset-${preset.identifier}" class="dashboard-modal-item-block">
-                <span class="dashboard-modal-item-icon">
-                  <typo3-backend-icon identifier=${preset.icon} size="medium"></typo3-backend-icon>
-                </span>
-                <span class="dashboard-modal-item-details">
-                  <span class="dashboard-modal-item-title">${preset.title}</span>
-                  <span class="dashboard-modal-item-description">${preset.description}</span>
-                </span>
-              </label>
-            </div>
-          `)}
-        </div>
-      </form>
-    `;
+    await topLevelModuleImport('@typo3/dashboard/dashboard-wizard.js');
 
     Modal.advanced({
       type: Modal.types.default,
       title: labels.get('dashboard.add'),
-      size: Modal.sizes.medium,
-      severity: SeverityEnum.notice,
-      content,
-      callback: (currentModal: ModalElement): void => {
-
-        currentModal.addEventListener('typo3-modal-shown', (): void => {
-          (currentModal.querySelector('#dashboard-form-add-title') as HTMLInputElement)?.focus();
-        });
-
-        currentModal.querySelector('form').addEventListener('submit', (e: Event): void => {
-          e.preventDefault();
-          const form = e.target as HTMLFormElement;
-          const formData = new FormData(form);
-          this.dispatchEvent(new DashboardAddEvent(
-            formData.get('preset') as string,
-            formData.get('title') as string,
-          ));
-          currentModal.hideModal();
-        });
-
+      size: {
+        width: Size.default,
+        height: Size.small,
       },
-      buttons: [
-        {
-          text: labels.get('dashboard.add.button.close'),
-          btnClass: 'btn-default',
-          name: 'cancel',
-          trigger: (e, modal) => modal.hideModal(),
-        },
-        {
-          text: labels.get('dashboard.add.button.ok'),
-          btnClass: 'btn-primary',
-          name: 'save',
-          trigger: (e, modal) => modal.querySelector('form').requestSubmit(),
-        },
-      ]
+      severity: SeverityEnum.notice,
+      staticBackdrop: true,
+      content: html`<typo3-dashboard-wizard></typo3-dashboard-wizard>`,
+      buttons: [],
     });
   }
 
@@ -1566,6 +1515,9 @@ declare global {
     'typo3-dashboard': Dashboard;
     'typo3-dashboard-widget': DashboardWidget;
   }
+  interface DocumentEventMap {
+    [DashboardAddEvent.eventName]: DashboardAddEvent;
+  }
   interface HTMLElementEventMap {
     [DashboardWidgetContentRenderedEvent.eventName]: DashboardWidgetContentRenderedEvent;
     [DashboardWidgetMoveIntendEvent.eventName]: DashboardWidgetMoveIntendEvent;

package/dashboard/wizard/finisher/dashboard-wizard-submission-service.ts

@@ -0,0 +1,43 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+
+import type { SubmissionServiceInterface } from '@typo3/backend/wizard/finisher/submission-service-interface';
+import type { FinisherResult } from '@typo3/backend/wizard/finisher/finisher-result';
+import type { DashboardWizardContext } from '@typo3/dashboard/dashboard-wizard';
+import { DashboardAddEvent } from '@typo3/dashboard/dashboard';
+import labels from '~labels/dashboard.messages';
+
+export class DashboardWizardSubmissionService implements SubmissionServiceInterface {
+
+  constructor(private readonly context: DashboardWizardContext) {
+  }
+
+  async execute(): Promise<FinisherResult> {
+    const { preset, title } = this.context.getDataStore();
+
+    return {
+      success: true,
+      finisher: {
+        identifier: 'event',
+        module: '@typo3/backend/wizard/finisher/event-finisher.js',
+        data: {
+          event: new DashboardAddEvent(preset ?? '', title ?? ''),
+        },
+        labels: {
+          successTitle: labels.get('dashboard.wizard.success.title'),
+          successDescription: labels.get('dashboard.wizard.success.message'),
+        }
+      }
+    };
+  }
+}