@jumoo/processing 17.4.2

package/dist/lang/manifest.js

@@ -0,0 +1,11 @@
+const localizations = [
+    {
+        type: 'localization',
+        alias: 'Jumoo.Processing.Localization.En',
+        name: 'Jumoo Processing translations(en)',
+        weight: 0,
+        meta: { culture: 'en' },
+        js: () => import('./files/en.js'),
+    },
+];
+export const manifests = [...localizations];

package/dist/pipeline/components/background.element.d.ts

@@ -0,0 +1,23 @@
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import { ProcessingMessage } from '../../signalr';
+import { PipelineBackgroundState, PipelineState, ProcessingOptions } from '@jumoo/processing';
+export declare class JumooPipelineBackgroundElement extends UmbLitElement {
+    pipelineId: string | undefined;
+    message: ProcessingMessage | undefined;
+    state: PipelineState | undefined;
+    background: PipelineBackgroundState | null | undefined;
+    _options: ProcessingOptions | undefined;
+    render(): import("lit-html").TemplateResult<1>;
+    private renderBackgroundBanner;
+    private renderProgress;
+    private renderComplete;
+    private renderError;
+    private renderElement;
+    static styles: import("lit").CSSResult;
+}
+export default JumooPipelineBackgroundElement;
+declare global {
+    interface HTMLElementTagNameMap {
+        'jumoo-pipeline-background': JumooPipelineBackgroundElement;
+    }
+}

package/dist/pipeline/components/background.element.js

@@ -0,0 +1,88 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { css, customElement, html, property } from '@umbraco-cms/backoffice/external/lit';
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import { PipelineStatus, } from '@jumoo/processing';
+let JumooPipelineBackgroundElement = class JumooPipelineBackgroundElement extends UmbLitElement {
+    render() {
+        switch (this.state?.status) {
+            case PipelineStatus.COMPLETED:
+                return this.renderComplete();
+            case PipelineStatus.FAILED:
+                return this.renderError();
+            default:
+                return html `${this.renderBackgroundBanner()} ${this.renderProgress()}`;
+        }
+    }
+    renderBackgroundBanner() {
+        return html `<uui-box class="banner">
+			<umb-localize key="jumooProcBackground_running"></umb-localize>
+		</uui-box>`;
+    }
+    renderProgress() {
+        return html `<jumoo-pipeline-progress
+			.progress=${this.state?.progress}
+			.message=${this.message}></jumoo-pipeline-progress>`;
+    }
+    renderComplete() {
+        return !this.background?.completedElement
+            ? html `<uui-box
+						><umb-localize key="jumooProcBackground_completed"></umb-localize
+					></uui-box>
+					<pre>${JSON.stringify(this.state, null, 1)}</pre>`
+            : html `${this.renderElement(this.background.completedElement)}`;
+    }
+    renderError() {
+        return !this.background?.failedElement
+            ? html `<uui-box
+						><umb-localize key="jumooProcBackground_error"></umb-localize
+					></uui-box>
+					<pre>${JSON.stringify(this.state, null, 1)}</pre>`
+            : html `${this.renderElement(this.background.failedElement)}`;
+    }
+    renderElement(element) {
+        return html `<umb-extension-slot
+			type="jumoo-process-step"
+			.filter=${(ext) => ext.elementName === element}
+			.props=${{
+            pipelineId: this.pipelineId,
+            state: this.state,
+            options: this._options,
+        }}></umb-extension-slot>`;
+    }
+};
+JumooPipelineBackgroundElement.styles = css `
+		:host {
+			display: flex;
+			flex-direction: column;
+			height: 100%;
+		}
+
+		.banner {
+			background-color: var(--uui-color-current);
+		}
+	`;
+__decorate([
+    property({ type: String })
+], JumooPipelineBackgroundElement.prototype, "pipelineId", void 0);
+__decorate([
+    property({ type: Object })
+], JumooPipelineBackgroundElement.prototype, "message", void 0);
+__decorate([
+    property({ type: Object })
+], JumooPipelineBackgroundElement.prototype, "state", void 0);
+__decorate([
+    property({ type: Object })
+], JumooPipelineBackgroundElement.prototype, "background", void 0);
+__decorate([
+    property({ type: Object })
+], JumooPipelineBackgroundElement.prototype, "_options", void 0);
+JumooPipelineBackgroundElement = __decorate([
+    customElement('jumoo-pipeline-background')
+], JumooPipelineBackgroundElement);
+export { JumooPipelineBackgroundElement };
+export default JumooPipelineBackgroundElement;

package/dist/pipeline/components/index.d.ts

@@ -0,0 +1,6 @@
+export * from './progress.element.js';
+export * from './background.element.js';
+export * from './progress.step.element.js';
+export * from './process-error.element.js';
+export * from './pipeline-table.element.js';
+export * from './pipeline-list.element.js';

package/dist/pipeline/components/index.js

@@ -0,0 +1,6 @@
+export * from './progress.element.js';
+export * from './background.element.js';
+export * from './progress.step.element.js';
+export * from './process-error.element.js';
+export * from './pipeline-table.element.js';
+export * from './pipeline-list.element.js';

package/dist/pipeline/components/pipeline-list.element.d.ts

@@ -0,0 +1,32 @@
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import { Pipeline, PipelineStatus } from '../../api';
+export declare class JumooProcessingPipelineList extends UmbLitElement {
+    #private;
+    headline: string;
+    hideDelete: boolean;
+    defaultStatus: PipelineStatus;
+    statuses: PipelineStatus[];
+    _modalPath: string;
+    status: PipelineStatus | undefined;
+    pipelines?: Pipeline[];
+    loading: boolean;
+    constructor();
+    connectedCallback(): void;
+    _setupModalController(): void;
+    getPipelines(): Promise<void>;
+    onViewPipeline(e: CustomEvent): void;
+    onDeletePipeline(e: CustomEvent): Promise<void>;
+    onStatusChange(e: Event): Promise<void>;
+    render(): import("lit-html").TemplateResult<1>;
+    renderRefresh(): import("lit-html").TemplateResult<1>;
+    renderDropdown(): import("lit-html").TemplateResult<1>;
+    renderListPipelines(): import("lit-html").TemplateResult<1>;
+    renderPipeline(pipeline: Pipeline): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult;
+}
+export default JumooProcessingPipelineList;
+declare global {
+    interface HTMLElementTagNameMap {
+        'jumoo-pipeline-list': JumooProcessingPipelineList;
+    }
+}

package/dist/pipeline/components/pipeline-list.element.js

@@ -0,0 +1,178 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m") throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _JumooProcessingPipelineList_pipelinesContext, _JumooProcessingPipelineList_modalController;
+import { css, customElement, html, property, state, when, } from '@umbraco-cms/backoffice/external/lit';
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import { UmbModalRouteRegistrationController } from '@umbraco-cms/backoffice/router';
+import { JUMOO_PIPELINE_WORKSPACE_MODAL, JUMOO_PROCESSING_PIPELINE_ENTITY_TYPE, } from '../workspace/types';
+import { JUMOO_PIPELINES_CONTEXT } from '../pipelines.context';
+import { PipelineStatus } from '../../api';
+let JumooProcessingPipelineList = class JumooProcessingPipelineList extends UmbLitElement {
+    constructor() {
+        super();
+        _JumooProcessingPipelineList_pipelinesContext.set(this, void 0);
+        _JumooProcessingPipelineList_modalController.set(this, void 0);
+        this.headline = 'Processing Pipelines';
+        this.hideDelete = false;
+        this.defaultStatus = PipelineStatus.WAITING;
+        this.statuses = [
+            PipelineStatus.WAITING,
+            PipelineStatus.RUNNING,
+            PipelineStatus.COMPLETED,
+            PipelineStatus.FAILED,
+        ];
+        this._modalPath = '';
+        this.status = PipelineStatus.WAITING;
+        this.loading = true;
+        this.consumeContext(JUMOO_PIPELINES_CONTEXT, (context) => {
+            __classPrivateFieldSet(this, _JumooProcessingPipelineList_pipelinesContext, context, "f");
+        });
+        this._setupModalController();
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.status = this.defaultStatus;
+        this.getPipelines();
+    }
+    _setupModalController() {
+        __classPrivateFieldSet(this, _JumooProcessingPipelineList_modalController, new UmbModalRouteRegistrationController(this, JUMOO_PIPELINE_WORKSPACE_MODAL)
+            .addAdditionalPath(JUMOO_PROCESSING_PIPELINE_ENTITY_TYPE)
+            .onSetup(() => {
+            return {
+                data: {
+                    entityType: JUMOO_PROCESSING_PIPELINE_ENTITY_TYPE,
+                    preset: {},
+                },
+            };
+        })
+            .onSubmit(async () => {
+            await this.getPipelines();
+        })
+            .onReject(async () => {
+            await this.getPipelines();
+        })
+            .observeRouteBuilder((routeBuilder) => {
+            this._modalPath = routeBuilder({});
+        }), "f");
+    }
+    async getPipelines() {
+        this.loading = true;
+        this.pipelines = await __classPrivateFieldGet(this, _JumooProcessingPipelineList_pipelinesContext, "f")?.listPipelines(this.status ?? PipelineStatus.WAITING);
+        this.loading = false;
+    }
+    onViewPipeline(e) {
+        __classPrivateFieldGet(this, _JumooProcessingPipelineList_modalController, "f").open({ alias: e.detail.piplineId }, 'edit/' + e.detail.piplineId);
+    }
+    async onDeletePipeline(e) {
+        await __classPrivateFieldGet(this, _JumooProcessingPipelineList_pipelinesContext, "f")?.clear(e.detail.piplineId);
+        this.getPipelines();
+    }
+    async onStatusChange(e) {
+        const element = e.target;
+        if (!element)
+            return;
+        this.status = element.value;
+        await this.getPipelines();
+    }
+    render() {
+        return html `<uui-box style="--uui-box-default-padding: 0;" .headline=${this.headline}>
+			<div slot="header-actions">
+				Status: ${this.renderDropdown()} ${this.renderRefresh()}
+			</div>
+			${when(this.loading, () => html `<uui-loader-bar
+						animationDuration="1.5"
+						style="color: black"></uui-loader-bar>`, () => this.renderListPipelines())}
+		</uui-box>`;
+    }
+    renderRefresh() {
+        return html `<uui-button @click=${this.getPipelines} label="refresh" compact
+			><uui-icon name="icon-refresh"></uui-icon
+		></uui-button>`;
+    }
+    renderDropdown() {
+        const options = this.statuses.map((status) => {
+            return {
+                name: status,
+                value: status,
+                selected: status === this.status,
+            };
+        });
+        return options.length <= 1
+            ? html `${this.status}`
+            : html `
+					<uui-select
+						.options=${options}
+						@change=${this.onStatusChange}
+						label="status"></uui-select>
+				`;
+    }
+    renderListPipelines() {
+        return !this.pipelines || this.pipelines.length === 0
+            ? html `<div class="emtpy">Nothing with status ${this.status}</div>`
+            : html `<jumoo-pipelines-table
+					.pipelines=${this.pipelines}
+					.hideDelete=${this.hideDelete}
+					@view-pipeline=${this.onViewPipeline}
+					@delete-pipeline=${this.onDeletePipeline}></jumoo-pipelines-table>`;
+    }
+    renderPipeline(pipeline) {
+        return html `
+			<div>${pipeline.alias}</div>
+			<div>${pipeline.state.status}</div>
+			<div>${pipeline.state.currentRequest?.action?.alias}</div>
+		`;
+    }
+};
+_JumooProcessingPipelineList_pipelinesContext = new WeakMap();
+_JumooProcessingPipelineList_modalController = new WeakMap();
+JumooProcessingPipelineList.styles = css `
+		.emtpy {
+			display: flex;
+			justify-content: center;
+			padding: var(--uui-size-space-5);
+		}
+	`;
+__decorate([
+    property({ type: String })
+], JumooProcessingPipelineList.prototype, "headline", void 0);
+__decorate([
+    property({ type: Boolean })
+], JumooProcessingPipelineList.prototype, "hideDelete", void 0);
+__decorate([
+    property({ type: String })
+], JumooProcessingPipelineList.prototype, "defaultStatus", void 0);
+__decorate([
+    property({ type: Array })
+], JumooProcessingPipelineList.prototype, "statuses", void 0);
+__decorate([
+    state()
+], JumooProcessingPipelineList.prototype, "_modalPath", void 0);
+__decorate([
+    state()
+], JumooProcessingPipelineList.prototype, "status", void 0);
+__decorate([
+    state()
+], JumooProcessingPipelineList.prototype, "pipelines", void 0);
+__decorate([
+    state()
+], JumooProcessingPipelineList.prototype, "loading", void 0);
+JumooProcessingPipelineList = __decorate([
+    customElement('jumoo-pipeline-list')
+], JumooProcessingPipelineList);
+export { JumooProcessingPipelineList };
+export default JumooProcessingPipelineList;

package/dist/pipeline/components/pipeline-table.element.d.ts

@@ -0,0 +1,19 @@
+import { Pipeline } from '@jumoo/processing';
+import { UmbTableColumn, UmbTableConfig } from '@umbraco-cms/backoffice/components';
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+export declare class JumooPipelinesTableElement extends UmbLitElement {
+    #private;
+    pipelines: Pipeline[];
+    hideDelete: boolean;
+    _tableConfig: UmbTableConfig;
+    tableColumns: UmbTableColumn[];
+    filter: any;
+    render(): import("lit-html").TemplateResult<1>;
+    renderActions(pipeline: Pipeline): import("lit-html").TemplateResult<1>;
+}
+export default JumooPipelinesTableElement;
+declare global {
+    interface HTMLElementTagNameMap {
+        'jumoo-pipelines-table': JumooPipelinesTableElement;
+    }
+}

package/dist/pipeline/components/pipeline-table.element.js

@@ -0,0 +1,149 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _JumooPipelinesTableElement_instances, _JumooPipelinesTableElement_onViewPipeline, _JumooPipelinesTableElement_onDeletePipeline;
+import { ProcessingTimeOptions } from '@jumoo/processing';
+import { customElement, html, property, state, when, } from '@umbraco-cms/backoffice/external/lit';
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+let JumooPipelinesTableElement = class JumooPipelinesTableElement extends UmbLitElement {
+    constructor() {
+        super(...arguments);
+        _JumooPipelinesTableElement_instances.add(this);
+        this.pipelines = [];
+        this.hideDelete = false;
+        this._tableConfig = {
+            allowSelection: false,
+            hideIcon: false,
+        };
+        this.tableColumns = [
+            { name: 'Alias', alias: 'alias' },
+            { name: 'Strategy', alias: 'strategy' },
+            { name: 'State', alias: 'state' },
+            { name: 'Action', alias: 'action' },
+            { name: 'Background', alias: 'background' },
+            { name: 'Scheduled', alias: 'scheduled' },
+            { name: 'Actions', alias: 'actions' },
+        ];
+    }
+    render() {
+        const items = this.pipelines
+            .map((pipeline) => {
+            if (!pipeline)
+                return undefined;
+            return {
+                id: pipeline.id,
+                icon: 'icon-layers',
+                data: [
+                    {
+                        columnAlias: 'alias',
+                        value: pipeline.alias,
+                    },
+                    {
+                        columnAlias: 'strategy',
+                        value: pipeline.strategy,
+                    },
+                    {
+                        columnAlias: 'state',
+                        value: pipeline.state.status,
+                    },
+                    {
+                        columnAlias: 'action',
+                        value: pipeline.state.currentRequest?.action?.alias ?? 'no action',
+                    },
+                    {
+                        columnAlias: 'background',
+                        value: html `<umb-icon
+								.name=${when((pipeline.state.backgroundState?.isBackgroundRequest ?? false) == true, () => 'icon-check', () => 'icon-close')}></umb-icon>`,
+                    },
+                    {
+                        columnAlias: 'scheduled',
+                        value: !pipeline.state.schedule
+                            ? ''
+                            : this.localize.date(pipeline.state.schedule, ProcessingTimeOptions),
+                    },
+                    {
+                        columnAlias: 'actions',
+                        value: html `${this.renderActions(pipeline)}`,
+                    },
+                ],
+            };
+        })
+            .filter((item) => item !== undefined);
+        return html `
+			<umb-table
+				.config=${this._tableConfig}
+				.columns=${this.tableColumns}
+				.items=${items}
+				.filter=${this.filter}></umb-table>
+		`;
+    }
+    renderActions(pipeline) {
+        return html `<uui-button-group
+			><uui-button
+				.id=${pipeline.id}
+				label="View"
+				color="positive"
+				look="outline"
+				@click=${__classPrivateFieldGet(this, _JumooPipelinesTableElement_instances, "m", _JumooPipelinesTableElement_onViewPipeline)}
+				>View</uui-button
+			>
+			${this.hideDelete
+            ? ''
+            : html `<uui-button
+							label="Delete"
+							color="danger"
+							look="outline"
+							@click=${() => __classPrivateFieldGet(this, _JumooPipelinesTableElement_instances, "m", _JumooPipelinesTableElement_onDeletePipeline).call(this, pipeline.id)}
+							>Delete</uui-button
+						>`}</uui-button-group
+		>`;
+    }
+};
+_JumooPipelinesTableElement_instances = new WeakSet();
+_JumooPipelinesTableElement_onViewPipeline = function _JumooPipelinesTableElement_onViewPipeline(e) {
+    const element = e.target;
+    if (!element)
+        return;
+    this.dispatchEvent(new CustomEvent('view-pipeline', {
+        composed: true,
+        detail: {
+            piplineId: element.id,
+        },
+    }));
+};
+_JumooPipelinesTableElement_onDeletePipeline = function _JumooPipelinesTableElement_onDeletePipeline(id) {
+    this.dispatchEvent(new CustomEvent('delete-pipeline', {
+        composed: true,
+        detail: {
+            piplineId: id,
+        },
+    }));
+};
+__decorate([
+    property({ type: Array })
+], JumooPipelinesTableElement.prototype, "pipelines", void 0);
+__decorate([
+    property({ type: Boolean })
+], JumooPipelinesTableElement.prototype, "hideDelete", void 0);
+__decorate([
+    state()
+], JumooPipelinesTableElement.prototype, "_tableConfig", void 0);
+__decorate([
+    property({ type: Array })
+], JumooPipelinesTableElement.prototype, "tableColumns", void 0);
+__decorate([
+    state()
+], JumooPipelinesTableElement.prototype, "filter", void 0);
+JumooPipelinesTableElement = __decorate([
+    customElement('jumoo-pipelines-table')
+], JumooPipelinesTableElement);
+export { JumooPipelinesTableElement };
+export default JumooPipelinesTableElement;

package/dist/pipeline/components/process-error.element.d.ts

@@ -0,0 +1,16 @@
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import { ProcessingErrorDetails } from '@jumoo/processing';
+import { nothing } from '@umbraco-cms/backoffice/external/lit';
+export declare class JumooProcessingErrorElement extends UmbLitElement {
+    #private;
+    error: ProcessingErrorDetails | undefined | null;
+    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    renderError(error: ProcessingErrorDetails): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult;
+}
+export default JumooProcessingErrorElement;
+declare global {
+    interface HTMLElementTagNameMap {
+        'jumoo-processing-error': JumooProcessingErrorElement;
+    }
+}

package/dist/pipeline/components/process-error.element.js

@@ -0,0 +1,93 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _JumooProcessingErrorElement_instances, _JumooProcessingErrorElement_openErrorModal;
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import { JUMOO_PROCESSING_ERROR_MODAL } from '@jumoo/processing';
+import { css, customElement, html, nothing, property, } from '@umbraco-cms/backoffice/external/lit';
+import { UMB_MODAL_MANAGER_CONTEXT } from '@umbraco-cms/backoffice/modal';
+let JumooProcessingErrorElement = class JumooProcessingErrorElement extends UmbLitElement {
+    constructor() {
+        super(...arguments);
+        _JumooProcessingErrorElement_instances.add(this);
+    }
+    render() {
+        return !this.error ? nothing : this.renderError(this.error);
+    }
+    renderError(error) {
+        return html `<div class="error">
+			<div class="header">
+				<uui-icon name="icon-wrong"></uui-icon>
+				<h3>${error.message}</h3>
+			</div>
+			<div class="more">
+				<uui-button @click=${__classPrivateFieldGet(this, _JumooProcessingErrorElement_instances, "m", _JumooProcessingErrorElement_openErrorModal)} look="primary" color="danger"
+					><umb-localize key="jumooProcError_details"></umb-localize
+				></uui-button>
+			</div>
+		</div>`;
+    }
+};
+_JumooProcessingErrorElement_instances = new WeakSet();
+_JumooProcessingErrorElement_openErrorModal = async function _JumooProcessingErrorElement_openErrorModal() {
+    if (!this.error)
+        return;
+    const modalManager = await this.getContext(UMB_MODAL_MANAGER_CONTEXT);
+    if (!modalManager)
+        return;
+    const errorModal = modalManager.open(this, JUMOO_PROCESSING_ERROR_MODAL, {
+        data: {
+            error: this.error,
+        },
+    });
+    const result = await errorModal.onSubmit().catch(() => {
+        // ignore
+    });
+    return result;
+};
+JumooProcessingErrorElement.styles = css `
+		.error {
+			padding: 0;
+			background-color: var(--uui-color-danger);
+			color: var(--uui-color-default-contrast);
+		}
+
+		.error .header {
+			display: flex;
+			gap: var(--uui-size-space-2);
+			align-items: center;
+			padding: var(--uui-size-space-2);
+			border-bottom: 1px solid var(--uui-color-default-contrast);
+		}
+
+		h3 {
+			padding: 0;
+			margin: 0;
+			overflow: auto;
+		}
+
+		uui-icon {
+			font-size: var(--uui-type-h3-size);
+		}
+
+		.error .more {
+			padding: var(--uui-size-space-3);
+			text-align: right;
+		}
+	`;
+__decorate([
+    property({ type: Object })
+], JumooProcessingErrorElement.prototype, "error", void 0);
+JumooProcessingErrorElement = __decorate([
+    customElement('jumoo-processing-error')
+], JumooProcessingErrorElement);
+export { JumooProcessingErrorElement };
+export default JumooProcessingErrorElement;

package/dist/pipeline/components/progress.element.d.ts

@@ -0,0 +1,14 @@
+import { nothing } from '@umbraco-cms/backoffice/external/lit';
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import { ProcessingMessage, ProgressInformation } from '@jumoo/processing';
+export declare class JumooPipelineProgressElement extends UmbLitElement {
+    progress: ProgressInformation | undefined;
+    message: ProcessingMessage | undefined;
+    showPercentage: boolean;
+    private _lastKnownProgress;
+    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    private getLastKnownProgress;
+    private renderMessages;
+    static styles: import("lit").CSSResult;
+}
+export default JumooPipelineProgressElement;