diff --git a/api/js/etemplate/Et2Dialog/Et2Dialog.ts b/api/js/etemplate/Et2Dialog/Et2Dialog.ts index faac1295a5..0a3f8ff4fd 100644 --- a/api/js/etemplate/Et2Dialog/Et2Dialog.ts +++ b/api/js/etemplate/Et2Dialog/Et2Dialog.ts @@ -18,6 +18,9 @@ import {Et2DialogOverlay} from "./Et2DialogOverlay"; import {Et2DialogContent} from "./Et2DialogContent"; import {et2_template} from "../et2_widget_template"; import {etemplate2} from "../etemplate2"; +import {IegwAppLocal} from "../../jsapi/egw_global"; +import interact from "@interactjs/interactjs/index"; +import type {InteractEvent} from "@interactjs/core/InteractEvent"; export interface DialogButton { @@ -323,6 +326,7 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo this._onOpen = this._onOpen.bind(this); this._onClose = this._onClose.bind(this); this._onClick = this._onClick.bind(this); + this._onMoveResize = this._onMoveResize.bind(this); this._adoptTemplateButtons = this._adoptTemplateButtons.bind(this); // Create this here so we have something, otherwise the creator might continue with undefined while we @@ -381,6 +385,7 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo this._button_id = null; this._complete_promise = this._complete_promise || new Promise<[number, Object]>((resolve) => this._completeResolver); + this._setupMoveResize(this._overlayContentNode); // Now consumers can listen for "open" event, though getUpdateComplete().then(...) also works this.dispatchEvent(new Event('open')); } @@ -444,6 +449,39 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo this.close(); } + /** + * Handle moving and resizing + * + * @param event + */ + _onMoveResize(event : InteractEvent) + { + let target = event.target + let x = (parseFloat(target.getAttribute('data-x')) || 0) + let y = (parseFloat(target.getAttribute('data-y')) || 0) + + // update the element's style + target.style.width = event.rect.width + 'px' + target.style.height = event.rect.height + 'px' + + // translate when resizing from top or left edges + if(event.type == "resizemove") + { + x += event.deltaRect.left + y += event.deltaRect.top + } + else + { + x += event.delta.x; + y += event.delta.y; + } + + target.style.transform = 'translate(' + x + 'px,' + y + 'px)' + + target.setAttribute('data-x', x) + target.setAttribute('data-y', y) + } + /** * Returns the values of any widgets in the dialog. This does not include * the buttons, which are only supplied for the callback. @@ -699,6 +737,42 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo } + _setupMoveResize(element) + { + // Quick calculation of min size - dialog is made up of header, content & buttons + let minHeight = 0; + for(let e of element.shadowRoot.querySelector('.overlay').children) + { + minHeight += e.getBoundingClientRect().height + parseFloat(getComputedStyle(e).marginTop) + parseFloat(getComputedStyle(e).marginBottom) + } + + interact(element) + .resizable({ + edges: {bottom: true, right: true}, + listeners: { + move: this._onMoveResize + }, + modifiers: [ + // keep the edges inside the parent + interact.modifiers.restrictEdges({ + outer: 'parent' + }), + + // minimum size + interact.modifiers.restrictSize({ + min: {width: 100, height: minHeight} + }) + ] + }) + + .draggable({ + allowFrom: ".overlay__heading", + listeners: { + move: this._onMoveResize + }, + }); + } + /** * Inject application specific egw object with loaded translations into the dialog * @@ -842,9 +916,9 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo * YES OR NO buttons and submit content back to server * * @param {widget} _senders widget that has been clicked - * @param {String} _dialogMsg message shows in dialog box - * @param {String} _titleMsg message shows as a title of the dialog box - * @param {Bool} _postSubmit true: use postSubmit instead of submit + * @param {string} _dialogMsg message shows in dialog box + * @param {string} _titleMsg message shows as a title of the dialog box + * @param {boolean} _postSubmit true: use postSubmit instead of submit * * @description submit the form contents including the button that has been pressed */ @@ -925,7 +999,7 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo ]; let dialog = new Et2Dialog(_egw_or_appname); dialog.transformAttributes({ - template: egw.webserverUrl + '/api/etemplate.php/api/templates/default/long_task.xet', + template: dialog.egw().webserverUrl + '/api/etemplate.php/api/templates/default/long_task.xet', value: { content: { message: _message @@ -1002,9 +1076,9 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo title: '', buttons: [ // These ones will use the callback, just like normal - {label: egw.lang("Abort"), id: 'dialog[cancel]'}, - {label: egw.lang("Retry"), id: 'dialog[retry]'}, - {label: egw.lang("Skip"), id: 'dialog[skip]', default: true} + {label: dialog.egw().lang("Abort"), id: 'dialog[cancel]'}, + {label: dialog.egw().lang("Retry"), id: 'dialog[retry]'}, + {label: dialog.egw().lang("Skip"), id: 'dialog[skip]', default: true} ], dialog_type: Et2Dialog.ERROR_MESSAGE }); @@ -1033,7 +1107,7 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo log.scrollTop = height; // Update totals - totals.widget.set_value(egw.lang( + totals.widget.set_value(dialog.egw().lang( "Total: %1 Successful: %2 Failed: %3 Skipped: %4", _list.length, totals.success, totals.failed, totals.skipped )); @@ -1049,7 +1123,7 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo // Async request, we'll take the next step in the callback // We can't pass index = 0, it looks like false and causes issues - egw.json(_menuaction, parameters, update, index + 1, true, index + 1).sendRequest(); + dialog.egw().json(_menuaction, parameters, update, index + 1, true, index + 1).sendRequest(); } else { @@ -1089,6 +1163,7 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo } } +//@ts-ignore TS doesn't recognize Et2Dialog as HTMLEntry customElements.define("et2-dialog", Et2Dialog); // make et2_dialog publicly available as we need to call it from templates { diff --git a/api/js/etemplate/Et2Dialog/Et2DialogOverlay.ts b/api/js/etemplate/Et2Dialog/Et2DialogOverlay.ts index ee60a37e86..60f8bfb16f 100644 --- a/api/js/etemplate/Et2Dialog/Et2DialogOverlay.ts +++ b/api/js/etemplate/Et2Dialog/Et2DialogOverlay.ts @@ -31,7 +31,9 @@ export class Et2DialogOverlay extends SlotMixin(LitElement) position: relative; border: 1px solid silver; box-shadow: -2px 1px 9px 3px #b4b4b4; - min-width: 200px + min-width: 250px; + touch-action: none; + box-sizing: border-box; } :host([hidden]) { @@ -41,6 +43,7 @@ export class Et2DialogOverlay extends SlotMixin(LitElement) .overlay { display: flex; flex-direction: column; + height: 100%; } .overlay__header { display: flex; diff --git a/package-lock.json b/package-lock.json index 3334be8c03..6b01567136 100644 --- a/package-lock.json +++ b/package-lock.json @@ -23,12 +23,14 @@ "@shoelace-style/shoelace": "^2.0.0-beta.73", "blueimp-gallery": "^3.4.0", "colortranslator": "^1.9.2", + "interactjs": "^1.10.11", "lit-flatpickr": "^0.3.0", "sortablejs": "^1.14.0" }, "devDependencies": { "@babel/core": "^7.14.6", "@babel/preset-typescript": "^7.14.5", + "@interactjs/interactjs": "^1.10.11", "@open-wc/testing": "^3.0.3", "@rollup/plugin-babel": "^5.3.0", "@rollup/plugin-node-resolve": "^13.0.0", @@ -564,6 +566,192 @@ "@floating-ui/core": "^0.5.0" } }, + "node_modules/@interactjs/actions": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/actions/-/actions-1.10.11.tgz", + "integrity": "sha512-P39zeefr4hkmKx+5nZ+mrH1s0l2YJ3gIHrthXmE81n6MlMa42m0WtHcTms4C5JTTNBP2EEDY+KGgGxSnmJKvUw==", + "dev": true, + "optionalDependencies": { + "@interactjs/interact": "1.10.11" + }, + "peerDependencies": { + "@interactjs/core": "1.10.11", + "@interactjs/utils": "1.10.11" + } + }, + "node_modules/@interactjs/auto-scroll": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/auto-scroll/-/auto-scroll-1.10.11.tgz", + "integrity": "sha512-feHNjhi0EMNLV2nQcEgjYPz2mI54aeSW2RiaoNtFLyBvtXKp0b4DmluwDv6DvuXmUpDwD5g/Hk1gGM2rgl7iqQ==", + "dev": true, + "optionalDependencies": { + "@interactjs/interact": "1.10.11" + }, + "peerDependencies": { + "@interactjs/utils": "1.10.11" + } + }, + "node_modules/@interactjs/auto-start": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/auto-start/-/auto-start-1.10.11.tgz", + "integrity": "sha512-cIg5CcalCPtC6AiGq6j/0hKUtL2MweEpvw12FuB19sz2Q9Dye0J4GliHKhOYvtumNinnvfVAZ4FZMqZEuX7YZA==", + "dev": true, + "optionalDependencies": { + "@interactjs/interact": "1.10.11" + }, + "peerDependencies": { + "@interactjs/core": "1.10.11", + "@interactjs/utils": "1.10.11" + } + }, + "node_modules/@interactjs/core": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/core/-/core-1.10.11.tgz", + "integrity": "sha512-aJ50ccVeszpJt7wPH7Yfqm7f1aG1SA94qd90P0NaESh5/QUXn4CESO6igobo4DFHQ5z+1Rfdl8aphP4JxlH4gw==", + "dev": true, + "peerDependencies": { + "@interactjs/utils": "1.10.11" + } + }, + "node_modules/@interactjs/dev-tools": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/dev-tools/-/dev-tools-1.10.11.tgz", + "integrity": "sha512-BP2FNfMbF7zLuOAUGMkDhCo1e1B0fnqyb9ih/Y8yAIJuoLrZxP/9htbsS1vZOIVZ4UgtrId4cYOwfcAZBMQtmw==", + "dev": true, + "optionalDependencies": { + "@interactjs/interact": "1.10.11" + }, + "peerDependencies": { + "@interactjs/modifiers": "1.10.11", + "@interactjs/utils": "1.10.11" + } + }, + "node_modules/@interactjs/inertia": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/inertia/-/inertia-1.10.11.tgz", + "integrity": "sha512-h+sknCzRqBSyHy4ctPNsq56mxkAMMdwHWD6en7rDEw899gdGKYaXVDVdv1jMfiwNRw0eRFBNoCiol8r3a/a3Jw==", + "dev": true, + "dependencies": { + "@interactjs/offset": "1.10.11" + }, + "optionalDependencies": { + "@interactjs/interact": "1.10.11" + }, + "peerDependencies": { + "@interactjs/core": "1.10.11", + "@interactjs/modifiers": "1.10.11", + "@interactjs/utils": "1.10.11" + } + }, + "node_modules/@interactjs/interact": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/interact/-/interact-1.10.11.tgz", + "integrity": "sha512-0iZJ9l547JuBA/lKxK4ARGYVmMqRSsAdA8gXL1zWe51qEIQq8PyWmMipoi8JbDaL7exC2THKwkXu5uq5ndT+iA==", + "dev": true, + "dependencies": { + "@interactjs/core": "1.10.11", + "@interactjs/types": "1.10.11", + "@interactjs/utils": "1.10.11" + } + }, + "node_modules/@interactjs/interactjs": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/interactjs/-/interactjs-1.10.11.tgz", + "integrity": "sha512-cGOxf6rp3Y8/sk88LhIT0XDn4gCiCzAnUG5Kkj9SAqiUO6BK/9+Wbp1IBkNaPgl/8uG8gNHh/dXBrlBBNcqJAg==", + "dev": true, + "dependencies": { + "@interactjs/actions": "1.10.11", + "@interactjs/auto-scroll": "1.10.11", + "@interactjs/auto-start": "1.10.11", + "@interactjs/core": "1.10.11", + "@interactjs/dev-tools": "1.10.11", + "@interactjs/inertia": "1.10.11", + "@interactjs/interact": "1.10.11", + "@interactjs/modifiers": "1.10.11", + "@interactjs/offset": "1.10.11", + "@interactjs/pointer-events": "1.10.11", + "@interactjs/reflow": "1.10.11", + "@interactjs/utils": "1.10.11" + } + }, + "node_modules/@interactjs/modifiers": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/modifiers/-/modifiers-1.10.11.tgz", + "integrity": "sha512-ltqX1RSqeAIikixlQBlyEUdclT5+rbfIGi3sIdLLYaIZQnltYkWqL9MHKx/w5b+hV+Mc0p5MLUFWJbTdkSCZ9g==", + "dev": true, + "dependencies": { + "@interactjs/snappers": "1.10.11" + }, + "optionalDependencies": { + "@interactjs/interact": "1.10.11" + }, + "peerDependencies": { + "@interactjs/core": "1.10.11", + "@interactjs/utils": "1.10.11" + } + }, + "node_modules/@interactjs/offset": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/offset/-/offset-1.10.11.tgz", + "integrity": "sha512-mBT7eIfy5ivofECiv+VwtEwwIMLV54fT9ujSMWJPduxdSYIHepUWgEf/3zjJknFh6jQc7pqz9dtjvVvyzRCLlQ==", + "dev": true, + "optionalDependencies": { + "@interactjs/interact": "1.10.11" + }, + "peerDependencies": { + "@interactjs/core": "1.10.11", + "@interactjs/utils": "1.10.11" + } + }, + "node_modules/@interactjs/pointer-events": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/pointer-events/-/pointer-events-1.10.11.tgz", + "integrity": "sha512-yBT8JJVMZ+MgBay5l1WAHnL8ch/mZsRfaFahti+QFYeQyRloDtsWmEMDSYI/Onyy9+hS3gN/ge77ArGciZZ0Ow==", + "dev": true, + "optionalDependencies": { + "@interactjs/interact": "1.10.11" + }, + "peerDependencies": { + "@interactjs/core": "1.10.11", + "@interactjs/utils": "1.10.11" + } + }, + "node_modules/@interactjs/reflow": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/reflow/-/reflow-1.10.11.tgz", + "integrity": "sha512-NSCtcCkjImOYSbxzzv2kFqR9t49J8KlhEr9UoePc7GyLbNXsiv3WQ3n0ehZd7CgZXQDiVXnP2UnmIOv5Zd4HQg==", + "dev": true, + "optionalDependencies": { + "@interactjs/interact": "1.10.11" + }, + "peerDependencies": { + "@interactjs/core": "1.10.11", + "@interactjs/utils": "1.10.11" + } + }, + "node_modules/@interactjs/snappers": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/snappers/-/snappers-1.10.11.tgz", + "integrity": "sha512-yYtOMUZ7aFUZ1IYheq9Tj5hZ4J1r5dnaXhLF44WsI/awQ5L0DjZf07GPWof0B+7rZHEVudxyQNbPfFmb+1K94Q==", + "dev": true, + "optionalDependencies": { + "@interactjs/interact": "1.10.11" + }, + "peerDependencies": { + "@interactjs/utils": "1.10.11" + } + }, + "node_modules/@interactjs/types": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/types/-/types-1.10.11.tgz", + "integrity": "sha512-YRsVFWjL8Gkkvlx3qnjeaxW4fnibSJ9791g8BA7Pv5ANByI64WmtR1vU7A2rXcrOn8XvyCEfY0ss1s8NhZP+MA==" + }, + "node_modules/@interactjs/utils": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/utils/-/utils-1.10.11.tgz", + "integrity": "sha512-410ZoxKF+r1roeSelL+WHXfdryUMg5iykC1XwQ3l6XqNw43IMACzyvTH6k6Pwxj7w7x42nce0Qdn1GQ3Y8xyCw==", + "dev": true + }, "node_modules/@lion/button": { "version": "0.16.0", "resolved": "https://registry.npmjs.org/@lion/button/-/button-0.16.0.tgz", @@ -3552,6 +3740,14 @@ "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==", "dev": true }, + "node_modules/interactjs": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/interactjs/-/interactjs-1.10.11.tgz", + "integrity": "sha512-VPUWsGAOPmrZe1YF7Fq/4AIBBZ+3FikZRS8bpzT6VsAfUuhxl/CKJY73IAiZHd3fz9p174CXErn0Qs81XEFICA==", + "dependencies": { + "@interactjs/types": "1.10.11" + } + }, "node_modules/interpret": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.1.0.tgz", @@ -6484,6 +6680,147 @@ "@floating-ui/core": "^0.5.0" } }, + "@interactjs/actions": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/actions/-/actions-1.10.11.tgz", + "integrity": "sha512-P39zeefr4hkmKx+5nZ+mrH1s0l2YJ3gIHrthXmE81n6MlMa42m0WtHcTms4C5JTTNBP2EEDY+KGgGxSnmJKvUw==", + "dev": true, + "requires": { + "@interactjs/interact": "1.10.11" + } + }, + "@interactjs/auto-scroll": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/auto-scroll/-/auto-scroll-1.10.11.tgz", + "integrity": "sha512-feHNjhi0EMNLV2nQcEgjYPz2mI54aeSW2RiaoNtFLyBvtXKp0b4DmluwDv6DvuXmUpDwD5g/Hk1gGM2rgl7iqQ==", + "dev": true, + "requires": { + "@interactjs/interact": "1.10.11" + } + }, + "@interactjs/auto-start": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/auto-start/-/auto-start-1.10.11.tgz", + "integrity": "sha512-cIg5CcalCPtC6AiGq6j/0hKUtL2MweEpvw12FuB19sz2Q9Dye0J4GliHKhOYvtumNinnvfVAZ4FZMqZEuX7YZA==", + "dev": true, + "requires": { + "@interactjs/interact": "1.10.11" + } + }, + "@interactjs/core": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/core/-/core-1.10.11.tgz", + "integrity": "sha512-aJ50ccVeszpJt7wPH7Yfqm7f1aG1SA94qd90P0NaESh5/QUXn4CESO6igobo4DFHQ5z+1Rfdl8aphP4JxlH4gw==", + "dev": true, + "requires": {} + }, + "@interactjs/dev-tools": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/dev-tools/-/dev-tools-1.10.11.tgz", + "integrity": "sha512-BP2FNfMbF7zLuOAUGMkDhCo1e1B0fnqyb9ih/Y8yAIJuoLrZxP/9htbsS1vZOIVZ4UgtrId4cYOwfcAZBMQtmw==", + "dev": true, + "requires": { + "@interactjs/interact": "1.10.11" + } + }, + "@interactjs/inertia": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/inertia/-/inertia-1.10.11.tgz", + "integrity": "sha512-h+sknCzRqBSyHy4ctPNsq56mxkAMMdwHWD6en7rDEw899gdGKYaXVDVdv1jMfiwNRw0eRFBNoCiol8r3a/a3Jw==", + "dev": true, + "requires": { + "@interactjs/interact": "1.10.11", + "@interactjs/offset": "1.10.11" + } + }, + "@interactjs/interact": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/interact/-/interact-1.10.11.tgz", + "integrity": "sha512-0iZJ9l547JuBA/lKxK4ARGYVmMqRSsAdA8gXL1zWe51qEIQq8PyWmMipoi8JbDaL7exC2THKwkXu5uq5ndT+iA==", + "dev": true, + "requires": { + "@interactjs/core": "1.10.11", + "@interactjs/types": "1.10.11", + "@interactjs/utils": "1.10.11" + } + }, + "@interactjs/interactjs": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/interactjs/-/interactjs-1.10.11.tgz", + "integrity": "sha512-cGOxf6rp3Y8/sk88LhIT0XDn4gCiCzAnUG5Kkj9SAqiUO6BK/9+Wbp1IBkNaPgl/8uG8gNHh/dXBrlBBNcqJAg==", + "dev": true, + "requires": { + "@interactjs/actions": "1.10.11", + "@interactjs/auto-scroll": "1.10.11", + "@interactjs/auto-start": "1.10.11", + "@interactjs/core": "1.10.11", + "@interactjs/dev-tools": "1.10.11", + "@interactjs/inertia": "1.10.11", + "@interactjs/interact": "1.10.11", + "@interactjs/modifiers": "1.10.11", + "@interactjs/offset": "1.10.11", + "@interactjs/pointer-events": "1.10.11", + "@interactjs/reflow": "1.10.11", + "@interactjs/utils": "1.10.11" + } + }, + "@interactjs/modifiers": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/modifiers/-/modifiers-1.10.11.tgz", + "integrity": "sha512-ltqX1RSqeAIikixlQBlyEUdclT5+rbfIGi3sIdLLYaIZQnltYkWqL9MHKx/w5b+hV+Mc0p5MLUFWJbTdkSCZ9g==", + "dev": true, + "requires": { + "@interactjs/interact": "1.10.11", + "@interactjs/snappers": "1.10.11" + } + }, + "@interactjs/offset": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/offset/-/offset-1.10.11.tgz", + "integrity": "sha512-mBT7eIfy5ivofECiv+VwtEwwIMLV54fT9ujSMWJPduxdSYIHepUWgEf/3zjJknFh6jQc7pqz9dtjvVvyzRCLlQ==", + "dev": true, + "requires": { + "@interactjs/interact": "1.10.11" + } + }, + "@interactjs/pointer-events": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/pointer-events/-/pointer-events-1.10.11.tgz", + "integrity": "sha512-yBT8JJVMZ+MgBay5l1WAHnL8ch/mZsRfaFahti+QFYeQyRloDtsWmEMDSYI/Onyy9+hS3gN/ge77ArGciZZ0Ow==", + "dev": true, + "requires": { + "@interactjs/interact": "1.10.11" + } + }, + "@interactjs/reflow": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/reflow/-/reflow-1.10.11.tgz", + "integrity": "sha512-NSCtcCkjImOYSbxzzv2kFqR9t49J8KlhEr9UoePc7GyLbNXsiv3WQ3n0ehZd7CgZXQDiVXnP2UnmIOv5Zd4HQg==", + "dev": true, + "requires": { + "@interactjs/interact": "1.10.11" + } + }, + "@interactjs/snappers": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/snappers/-/snappers-1.10.11.tgz", + "integrity": "sha512-yYtOMUZ7aFUZ1IYheq9Tj5hZ4J1r5dnaXhLF44WsI/awQ5L0DjZf07GPWof0B+7rZHEVudxyQNbPfFmb+1K94Q==", + "dev": true, + "requires": { + "@interactjs/interact": "1.10.11" + } + }, + "@interactjs/types": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/types/-/types-1.10.11.tgz", + "integrity": "sha512-YRsVFWjL8Gkkvlx3qnjeaxW4fnibSJ9791g8BA7Pv5ANByI64WmtR1vU7A2rXcrOn8XvyCEfY0ss1s8NhZP+MA==" + }, + "@interactjs/utils": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/@interactjs/utils/-/utils-1.10.11.tgz", + "integrity": "sha512-410ZoxKF+r1roeSelL+WHXfdryUMg5iykC1XwQ3l6XqNw43IMACzyvTH6k6Pwxj7w7x42nce0Qdn1GQ3Y8xyCw==", + "dev": true + }, "@lion/button": { "version": "0.16.0", "resolved": "https://registry.npmjs.org/@lion/button/-/button-0.16.0.tgz", @@ -8853,6 +9190,14 @@ "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==", "dev": true }, + "interactjs": { + "version": "1.10.11", + "resolved": "https://registry.npmjs.org/interactjs/-/interactjs-1.10.11.tgz", + "integrity": "sha512-VPUWsGAOPmrZe1YF7Fq/4AIBBZ+3FikZRS8bpzT6VsAfUuhxl/CKJY73IAiZHd3fz9p174CXErn0Qs81XEFICA==", + "requires": { + "@interactjs/types": "1.10.11" + } + }, "interpret": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.1.0.tgz", @@ -10771,7 +11116,8 @@ "version": "7.5.3", "resolved": "https://registry.npmjs.org/ws/-/ws-7.5.3.tgz", "integrity": "sha512-kQ/dHIzuLrS6Je9+uv81ueZomEwH0qVYstcAQ4/Z93K8zeko9gtAbttJWzoC5ukqXY1PpoouV3+VSOqEAFt5wg==", - "dev": true + "dev": true, + "requires": {} }, "yallist": { "version": "4.0.0", diff --git a/package.json b/package.json index 7b606ef3b5..d0c1ab42c2 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,7 @@ "devDependencies": { "@babel/core": "^7.14.6", "@babel/preset-typescript": "^7.14.5", + "@interactjs/interactjs": "^1.10.11", "@open-wc/testing": "^3.0.3", "@rollup/plugin-babel": "^5.3.0", "@rollup/plugin-node-resolve": "^13.0.0", @@ -64,9 +65,10 @@ "@lion/textarea": "^0.14.0", "@shoelace-style/shoelace": "^2.0.0-beta.73", "blueimp-gallery": "^3.4.0", + "colortranslator": "^1.9.2", + "interactjs": "^1.10.11", "lit-flatpickr": "^0.3.0", - "sortablejs": "^1.14.0", - "colortranslator": "^1.9.2" + "sortablejs": "^1.14.0" }, "engines": { "node": ">=14.0.0"