fix(core): update
This commit is contained in:
parent
a03b095d14
commit
c3df73616f
@ -3,6 +3,6 @@
|
||||
*/
|
||||
export const commitinfo = {
|
||||
name: '@designestate/dees-catalog',
|
||||
version: '1.0.140',
|
||||
version: '1.0.141',
|
||||
description: 'website for lossless.com'
|
||||
}
|
||||
|
@ -29,8 +29,29 @@ export class DeesContextmenu extends DeesElement {
|
||||
margin: 20px;
|
||||
}
|
||||
</style>
|
||||
<dees-button @click=${(eventArg) => {
|
||||
DeesContextmenu.openContextMenuWithOptions(eventArg, []);
|
||||
<dees-button @contextmenu=${(eventArg) => {
|
||||
DeesContextmenu.openContextMenuWithOptions(eventArg, [
|
||||
{
|
||||
name: 'copy',
|
||||
iconName: 'copySolid',
|
||||
action: async () => {
|
||||
return null;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'edit',
|
||||
iconName: 'penToSquare',
|
||||
action: async () => {
|
||||
return null;
|
||||
},
|
||||
},{
|
||||
name: 'paste',
|
||||
iconName: 'pasteSolid',
|
||||
action: async () => {
|
||||
return null;
|
||||
},
|
||||
},
|
||||
]);
|
||||
}}>Hello</dees-button>
|
||||
<dees-contextmenu class="withMargin"></dees-contextmenu>
|
||||
<dees-contextmenu
|
||||
@ -55,13 +76,20 @@ export class DeesContextmenu extends DeesElement {
|
||||
`;
|
||||
|
||||
// STATIC
|
||||
public static openContextMenuWithOptions(eventArg, contextOptions: plugins.tsclass.website.IMenuItem[]) {
|
||||
public static async openContextMenuWithOptions(eventArg: MouseEvent, menuItemsArg: plugins.tsclass.website.IMenuItem[]) {
|
||||
eventArg.preventDefault();
|
||||
const contextMenu = new DeesContextmenu();
|
||||
contextMenu.style.position = 'absolute';
|
||||
contextMenu;
|
||||
const windowLayer = new DeesWindowLayer();
|
||||
windowLayer.append(contextMenu);
|
||||
document.body.append(windowLayer);
|
||||
contextMenu.style.top = `${eventArg.clientY.toString()}px`;
|
||||
contextMenu.style.left = `${eventArg.clientX.toString()}px`;
|
||||
contextMenu.style.opacity = '0';
|
||||
contextMenu.style.transform = 'scale(0.95,0.95)';
|
||||
contextMenu.style.transformOrigin = 'top left';
|
||||
contextMenu.menuItems = menuItemsArg;
|
||||
document.body.append(contextMenu);
|
||||
await domtools.plugins.smartdelay.delayFor(0);
|
||||
contextMenu.style.opacity = '1';
|
||||
contextMenu.style.transform = 'scale(1,1)';
|
||||
}
|
||||
|
||||
@property({
|
||||
@ -78,6 +106,7 @@ export class DeesContextmenu extends DeesElement {
|
||||
css`
|
||||
:host {
|
||||
display: block;
|
||||
transition: all 0.1s;
|
||||
}
|
||||
|
||||
.mainbox {
|
||||
@ -120,7 +149,7 @@ export class DeesContextmenu extends DeesElement {
|
||||
<div class="mainbox">
|
||||
${this.menuItems.map((menuItemArg) => {
|
||||
return html`
|
||||
<div class="menuitem">
|
||||
<div class="menuitem" @click=${() => this.handleClick(menuItemArg)}>
|
||||
<dees-icon .iconFA=${(menuItemArg.iconName as any) || 'minus'}></dees-icon
|
||||
>${menuItemArg.name}
|
||||
</div>
|
||||
@ -136,4 +165,16 @@ export class DeesContextmenu extends DeesElement {
|
||||
mainbox.textContent = 'no menu items present';
|
||||
}
|
||||
}
|
||||
|
||||
public async handleClick(menuItem: plugins.tsclass.website.IMenuItem) {
|
||||
menuItem.action();
|
||||
await this.destroy();
|
||||
}
|
||||
|
||||
public async destroy() {
|
||||
this.style.opacity = '0';
|
||||
this.style.transform = 'scale(0.95,0,95)';
|
||||
await domtools.plugins.smartdelay.delayFor(100);
|
||||
this.parentElement.removeChild(this);
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user