Moved the Tiptap toolbar value type to its own UmbTiptapToolbarValue type

Author: leekelleher

src/packages/rte/tiptap/components/input-tiptap/input-tiptap.element.ts

@@ -1,4 +1,4 @@
-import type { UmbTiptapExtensionApi } from '../../extensions/types.js';
+import type { UmbTiptapExtensionApi, UmbTiptapToolbarValue } from '../../extensions/types.js';
 import { css, customElement, html, property, state, when } from '@umbraco-cms/backoffice/external/lit';
 import { loadManifestApi } from '@umbraco-cms/backoffice/extension-api';
 import { umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry';
@@ -75,7 +75,7 @@ export class UmbInputTiptapElement extends UmbFormControlMixin<string, typeof Um
 	private _editor!: Editor;
 
 	@state()
-	_toolbar: string[][][] = [[[]]];
+	_toolbar: UmbTiptapToolbarValue = [[[]]];
 
 	protected override async firstUpdated() {
 		await Promise.all([await this.#loadExtensions(), await this.#loadEditor()]);
@@ -110,7 +110,7 @@ export class UmbInputTiptapElement extends UmbFormControlMixin<string, typeof Um
 		if (maxWidth) this.setAttribute('style', `max-width: ${maxWidth}px;`);
 		if (maxHeight) element.setAttribute('style', `max-height: ${maxHeight}px;`);
 
-		this._toolbar = this.configuration?.getValueByAlias<string[][][]>('toolbar') ?? [[[]]];
+		this._toolbar = this.configuration?.getValueByAlias<UmbTiptapToolbarValue>('toolbar') ?? [[[]]];
 
 		const extensions = this._extensions
 			.map((ext) => ext.getTiptapExtensions({ configuration: this.configuration }))

src/packages/rte/tiptap/components/input-tiptap/tiptap-fixed-menu.element.ts

@@ -1,3 +1,4 @@
+import type { UmbTiptapToolbarValue } from '../../extensions/types.js';
 import { css, customElement, html, map, property, state } from '@umbraco-cms/backoffice/external/lit';
 import { umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry';
 import { UmbExtensionsElementAndApiInitializer } from '@umbraco-cms/backoffice/extension-api';
@@ -27,7 +28,7 @@ export class UmbTiptapFixedMenuElement extends UmbLitElement {
 	configuration?: UmbPropertyEditorConfigCollection;
 
 	@property({ attribute: false })
-	toolbar: Array<Array<Array<string>>> = [[[]]];
+	toolbar: UmbTiptapToolbarValue = [[[]]];
 
 	override connectedCallback(): void {
 		super.connectedCallback();

src/packages/rte/tiptap/extensions/types.ts

@@ -98,3 +98,5 @@ export abstract class UmbTiptapToolbarElementApiBase extends UmbControllerBase i
 		return editor && this.manifest?.meta.alias ? editor?.isActive(this.manifest.meta.alias) : false;
 	}
 }
+
+export type UmbTiptapToolbarValue = Array<Array<Array<string>>>;

src/packages/rte/tiptap/property-editors/property-editor-ui-tiptap-toolbar-configuration.element.ts

@@ -1,17 +1,10 @@
-import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
-import {
-	customElement,
-	css,
-	html,
-	property,
-	state,
-	repeat,
-	nothing,
-	type PropertyValueMap,
-} from '@umbraco-cms/backoffice/external/lit';
-import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import type { UmbTiptapToolbarValue } from '../extensions/types.js';
+import { customElement, css, html, property, state, repeat, nothing } from '@umbraco-cms/backoffice/external/lit';
 import { umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry';
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
 import { UmbPropertyValueChangeEvent, type UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/property-editor';
+import type { PropertyValueMap } from '@umbraco-cms/backoffice/external/lit';
 
 type Extension = {
 	alias: string;
@@ -25,7 +18,7 @@ export class UmbPropertyEditorUiTiptapToolbarConfigurationElement
 	implements UmbPropertyEditorUiElement
 {
 	@property({ attribute: false })
-	set value(value: string[][][] | undefined) {
+	set value(value: UmbTiptapToolbarValue | undefined) {
 		if (!value) {
 			this.#useDefault = true;
 			this.#value = [[[]]];
@@ -36,14 +29,14 @@ export class UmbPropertyEditorUiTiptapToolbarConfigurationElement
 		this.#value = value.map((rows) => rows.map((groups) => [...groups]));
 	}
 
-	get value(): string[][][] {
+	get value(): UmbTiptapToolbarValue {
 		// TODO: This can be optimized with cashing;
 		return this.#value.map((rows) => rows.map((groups) => [...groups]));
 	}
 
 	#useDefault = false;
 
-	#value: string[][][] = [[[]]];
+	#value: UmbTiptapToolbarValue = [[[]]];
 
 	@state()
 	_extensions: Extension[] = [];