@onlyoffice/docspace-plugin-sdk
Version:
Simple plugin system for onlyoffice docspace
192 lines (191 loc) • 6.34 kB
JavaScript
"use strict";
/**
* (c) Copyright Ascensio System SIA 2026
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*
* @license
*/
Object.defineProperty(exports, "__esModule", { value: true });
exports.FloatingOperationType = void 0;
/**
* @example
*
* Demonstrates a floating operations in button with simulated upload progress,
* allowing users to cancel the process or remove individual operations while
* preventing a new upload until the current one finishes.
*
* ```typescript
* import {
* IFloatingOperationsButton,
* FloatingOperationType,
* Actions,
* IContextMenuItem,
* FilesType,
* } from "@onlyoffice/docspace-plugin-sdk";
*
* const operations = [
* {
* id: "upload-document",
* label: "Uploading document.pdf",
* operation: FloatingOperationType.Upload,
* alert: false,
* completed: false,
* percent: 0,
* // custom icon from assets
* icon: "upload.svg",
* },
* {
* id: "convert-image",
* label: "Converting image.jpg",
* operation: FloatingOperationType.Convert,
* alert: false,
* completed: false,
* percent: 0,
* }
* ]
*
* // flag to check if upload is in progress
* let isUpload = false;
* let intervalId: NodeJS.Timeout | null = null;
*
* export const uploadButton: IFloatingOperationsButton = {
* id: "upload-button",
* operationsCompleted: false,
* operationsAlert: false,
* // show cancel button when there is only one operation left
* showCancelButton: true,
*
* cancelOperation: () => {
* // reset interval and flags
* intervalId && clearInterval(intervalId);
* isUpload = false;
* intervalId = null;
* // send message to remove floating operations from button
* return {
* actions: [Actions.removeFloatingOperationsButton],
* floatingOperationsButtonPropsId: uploadButton.id,
* };
* },
*
* onCancelOperationFromList: (id) => {
* // remove operation from list
* const filteredOps = uploadButton.operations?.filter(
* (op) => op.id !== id
* ) ?? [];
*
* // update operations
* uploadButton.operations = filteredOps;
*
* // send message to update floating operations button
* return {
* actions: [Actions.updateFloatingOperationsButton],
* floatingOperationsButtonProps: uploadButton,
* };
* },
*
* // event on add floating operations in button
* onLoad: (dispatchMessage) => {
* let progress = 0;
* isUpload = true;
*
* // update progress every 400ms
* intervalId = setInterval(() => {
* progress += 5;
*
* // update progress for each operation
* const operations = uploadButton.operations?.map((op) => ({
* ...op,
* percent: progress,
* completed: progress >= 100,
* })) ?? [];
*
* uploadButton.operations = operations;
*
* // update operations completed
* uploadButton.operationsCompleted = progress >= 100;
*
* // send message to update floating operations button
* dispatchMessage({
* actions: [Actions.updateFloatingOperationsButton],
* floatingOperationsButtonProps: uploadButton,
* });
*
* // stop interval if progress is 100
* if (progress >= 100) {
* // reset interval and flags
* intervalId && clearInterval(intervalId);
* isUpload = false;
* intervalId = null;
* }
* }, 400);
* },
* };
*
* export const uploadMenuItem: IContextMenuItem = {
* key: "upload-files",
* label: "Upload with progress",
* icon: "upload.svg",
* fileType: [FilesType.file],
* onClick: () => {
* // if upload is in progress, do not allow to start new upload
* if (isUpload) {
* return;
* }
*
* // Reset operations from previous upload
* uploadButton.operations = structuredClone(operations);
* uploadButton.operationsCompleted = false;
* uploadButton.operationsAlert = false;
*
* // send message to add floating operations in button
* return {
* actions: [Actions.addFloatingOperationsButton],
* floatingOperationsButtonProps: uploadButton,
* };
* },
* };
* ```
*/
/**
* Determines the icon and visual representation of the operation.
*/
var FloatingOperationType;
(function (FloatingOperationType) {
/** File download operation */
FloatingOperationType["Download"] = "download";
/** File conversion operation */
FloatingOperationType["Convert"] = "convert";
/** File copy operation */
FloatingOperationType["Copy"] = "copy";
/** File duplication operation */
FloatingOperationType["Duplicate"] = "duplicate";
/** Mark as read operation */
FloatingOperationType["MarkAsRead"] = "markAsRead";
/** Permanent deletion operation */
FloatingOperationType["DeletePermanently"] = "deletePermanently";
/** Export index operation */
FloatingOperationType["ExportIndex"] = "exportIndex";
/** File move operation */
FloatingOperationType["Move"] = "move";
/** Move to trash operation */
FloatingOperationType["Trash"] = "trash";
/** Other custom operation */
FloatingOperationType["Other"] = "other";
/** File upload operation */
FloatingOperationType["Upload"] = "upload";
/** Delete file version operation */
FloatingOperationType["DeleteVersionFile"] = "deleteVersionFile";
/** Backup operation */
FloatingOperationType["Backup"] = "backup";
})(FloatingOperationType || (exports.FloatingOperationType = FloatingOperationType = {}));