diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-action/shared/workspace-action-menu/index.ts b/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-action/shared/workspace-action-menu/index.ts new file mode 100644 index 0000000000..02d1af5c38 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-action/shared/workspace-action-menu/index.ts @@ -0,0 +1 @@ +export * from './workspace-action-menu.element.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-action/shared/workspace-action-menu/workspace-action-menu.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-action/shared/workspace-action-menu/workspace-action-menu.element.ts new file mode 100644 index 0000000000..d6ad543e7a --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-action/shared/workspace-action-menu/workspace-action-menu.element.ts @@ -0,0 +1,85 @@ +import type { CSSResultGroup } from '@umbraco-cms/backoffice/external/lit'; +import { css, html, customElement, property, state, repeat, nothing } from '@umbraco-cms/backoffice/external/lit'; +import { UmbTextStyles } from '@umbraco-cms/backoffice/style'; +import type { ManifestWorkspaceAction, ManifestTypes } from '@umbraco-cms/backoffice/extension-registry'; +import { umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry'; +import type { UmbExtensionElementInitializer } from '@umbraco-cms/backoffice/extension-api'; +import { UmbExtensionsElementInitializer } from '@umbraco-cms/backoffice/extension-api'; +import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; + +@customElement('umb-workspace-action-menu') +export class UmbWorkspaceActionMenuElement extends UmbLitElement { + #actionsInitializer?: UmbExtensionsElementInitializer; + #workspacActionAlias: Array = []; + + @property({ type: Array }) + set workspaceActionAlias(alias: Array) { + // If there is an existing initializer, we need to dispose it. + this.#actionsInitializer?.destroy(); + + this.#workspacActionAlias = alias; + + this.#actionsInitializer = new UmbExtensionsElementInitializer( + this, + umbExtensionsRegistry, + 'workspaceAction', // TODO: Stop using string for 'workspaceAction', we need to start using Const. + undefined, //(action) => !!action, //action.meta.propertyEditors.includes(alias), + (ctrls) => { + debugger; + this._actions = ctrls; + }, + 'extensionsInitializer', + ); + } + get workspaceActionAlias() { + return this.#workspacActionAlias; + } + + @state() + private _actions: Array> = []; + + render() { + return this._actions.length > 0 + ? html` + + + + + + + + + ` + : nothing; + } + + static styles: CSSResultGroup = [ + UmbTextStyles, + css` + :host { + --uui-menu-item-flat-structure: 1; + } + #more-symbol { + font-size: 0.6em; + } + + #popover-trigger { + --uui-button-padding-top-factor: 0.5; + --uui-button-padding-bottom-factor: 0.1; + --uui-button-height: 18px; + --uui-button-border-radius: 6px; + } + `, + ]; +} + +declare global { + interface HTMLElementTagNameMap { + 'umb-workspace-action-menu': UmbWorkspaceActionMenuElement; + } +}