57 lines
1.2 KiB
TypeScript
57 lines
1.2 KiB
TypeScript
import { html } from '@design.estate/dees-element';
|
|
import * as plugins from './00plugins.js';
|
|
|
|
import { DeesContextmenu } from './dees-contextmenu.js';
|
|
|
|
export const demoFunc = () => html`
|
|
<style>
|
|
.withMargin {
|
|
display: block;
|
|
margin: 20px;
|
|
}
|
|
</style>
|
|
<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;
|
|
},
|
|
},
|
|
]);
|
|
}}>Right-Click for contextmenu</dees-button>
|
|
<dees-contextmenu class="withMargin"></dees-contextmenu>
|
|
<dees-contextmenu
|
|
class="withMargin"
|
|
.menuItems=${[
|
|
{
|
|
name: 'copy',
|
|
iconName: 'copySolid',
|
|
action: async () => {},
|
|
},
|
|
{
|
|
name: 'edit',
|
|
iconName: 'penToSquare',
|
|
action: async () => {},
|
|
},{
|
|
name: 'paste',
|
|
iconName: 'pasteSolid',
|
|
action: async () => {},
|
|
},
|
|
] as plugins.tsclass.website.IMenuItem[]}
|
|
></dees-contextmenu>
|
|
`; |