fix(core): update
This commit is contained in:
parent
bcfd3495dd
commit
69e17949f4
@ -3,6 +3,6 @@
|
||||
*/
|
||||
export const commitinfo = {
|
||||
name: '@design.estate/dees-catalog',
|
||||
version: '1.0.188',
|
||||
version: '1.0.189',
|
||||
description: 'website for lossless.com'
|
||||
}
|
||||
|
57
ts_web/elements/dees-contextmenu.demo.ts
Normal file
57
ts_web/elements/dees-contextmenu.demo.ts
Normal file
@ -0,0 +1,57 @@
|
||||
import { html } from '@design.estate/dees-element';
|
||||
import * as plugins from './plugins.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;
|
||||
},
|
||||
},
|
||||
]);
|
||||
}}>Hello</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>
|
||||
`;
|
@ -1,3 +1,4 @@
|
||||
import { demoFunc } from './dees-contextmenu.demo.js';
|
||||
import * as plugins from './plugins.js';
|
||||
import {
|
||||
customElement,
|
||||
@ -23,58 +24,7 @@ declare global {
|
||||
@customElement('dees-contextmenu')
|
||||
export class DeesContextmenu extends DeesElement {
|
||||
// DEMO
|
||||
public static demo = () => 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;
|
||||
},
|
||||
},
|
||||
]);
|
||||
}}>Hello</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>
|
||||
`;
|
||||
public static demo = demoFunc
|
||||
|
||||
// STATIC
|
||||
public static async openContextMenuWithOptions(eventArg: MouseEvent, menuItemsArg: plugins.tsclass.website.IMenuItem[]) {
|
||||
@ -122,7 +72,7 @@ export class DeesContextmenu extends DeesElement {
|
||||
font-size: 14px;
|
||||
width: 200px;
|
||||
border: 1px solid #444;
|
||||
min-height: 40px;
|
||||
min-height: 34px;
|
||||
border-radius: 3px;
|
||||
background: #222;
|
||||
box-shadow: 0px 1px 4px #000;
|
||||
@ -163,15 +113,20 @@ export class DeesContextmenu extends DeesElement {
|
||||
</div>
|
||||
`;
|
||||
})}
|
||||
${this.menuItems.length === 0 ? html`
|
||||
<div class="menuitem" @click=${() => {
|
||||
alert('No menu items...')
|
||||
}}>
|
||||
<dees-icon .iconFA=${'xmark'}></dees-icon
|
||||
>No menu item present...
|
||||
</div>
|
||||
` : html``}
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
public async firstUpdated() {
|
||||
if (!this.menuItems || this.menuItems.length === 0) {
|
||||
const mainbox = this.shadowRoot.querySelector('.mainbox');
|
||||
mainbox.textContent = 'no menu items present';
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
public async handleClick(menuItem: plugins.tsclass.website.IMenuItem) {
|
||||
|
5
ts_web/elements/dees-simple-appdash.demo.ts
Normal file
5
ts_web/elements/dees-simple-appdash.demo.ts
Normal file
@ -0,0 +1,5 @@
|
||||
import { html } from '@design.estate/dees-element';
|
||||
|
||||
export const demoFunc = () => html`
|
||||
<dees-simple-appdash>Hello there</dees-simple-appdash>
|
||||
`;
|
@ -0,0 +1,74 @@
|
||||
import { demoFunc } from './dees-simple-appdash.demo.js';
|
||||
import {
|
||||
customElement,
|
||||
html,
|
||||
DeesElement,
|
||||
property,
|
||||
type TemplateResult,
|
||||
cssManager,
|
||||
css,
|
||||
unsafeCSS,
|
||||
type CSSResult,
|
||||
state,
|
||||
} from '@design.estate/dees-element';
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
'dees-simple-appdash': DeesSimpleAppDash;
|
||||
}
|
||||
}
|
||||
|
||||
@customElement('dees-simple-appdash')
|
||||
export class DeesSimpleAppDash extends DeesElement {
|
||||
// STATIC
|
||||
public static demo = demoFunc;
|
||||
// INSTANCE
|
||||
|
||||
@property()
|
||||
public title = 'Dees Simple Login';
|
||||
|
||||
public static styles = [
|
||||
cssManager.defaultStyles,
|
||||
css`
|
||||
:host {
|
||||
color: ${cssManager.bdTheme('#333', '#fff')};
|
||||
user-select: none;
|
||||
}
|
||||
.appbar {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
height: 40px;
|
||||
width: 100%;
|
||||
background: ${cssManager.bdTheme('#eeeeeb', '#000')};
|
||||
border-bottom: 1px solid ${cssManager.bdTheme('#ccc', '#333')};
|
||||
font-size: 14px;
|
||||
line-height: 40px;
|
||||
font-family: 'Hubot Sans', 'Inter', sans-serif;
|
||||
padding: 0px 16px;
|
||||
}
|
||||
.appcontent {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background: ${cssManager.bdTheme('#eeeeeb', '#000')};
|
||||
}
|
||||
`,
|
||||
];
|
||||
|
||||
public render(): TemplateResult {
|
||||
return html`
|
||||
<div class="appbar">
|
||||
configvault v1.2.3
|
||||
</div>
|
||||
<div class="appcontent">
|
||||
<slot></slot>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
public async firstUpdated(_changedProperties): Promise<void> {
|
||||
const domtools = await this.domtoolsPromise;
|
||||
super.firstUpdated(_changedProperties);
|
||||
}
|
||||
}
|
3
ts_web/elements/dees-simple-login.demo.ts
Normal file
3
ts_web/elements/dees-simple-login.demo.ts
Normal file
@ -0,0 +1,3 @@
|
||||
import { html } from '@design.estate/dees-element';
|
||||
|
||||
export const demoFunc = () => html` <dees-simple-login> Hello there </dees-simple-login> `;
|
@ -1,3 +1,5 @@
|
||||
import { demoFunc } from './dees-simple-login.demo.js';
|
||||
|
||||
import {
|
||||
customElement,
|
||||
html,
|
||||
@ -20,11 +22,7 @@ declare global {
|
||||
@customElement('dees-simple-login')
|
||||
export class DeesSimpleLogin extends DeesElement {
|
||||
// STATIC
|
||||
public static demo = () => html`
|
||||
<dees-simple-login>
|
||||
Hello there
|
||||
</dees-simple-login>
|
||||
`;
|
||||
public static demo = demoFunc
|
||||
// INSTANCE
|
||||
|
||||
@property()
|
||||
|
@ -15,6 +15,7 @@ export * from './dees-input-radio.js';
|
||||
export * from './dees-input-text.js';
|
||||
export * from './dees-mobilenavigation.js';
|
||||
export * from './dees-pdf.js';
|
||||
export * from './dees-simple-appdash.js';
|
||||
export * from './dees-simple-login.js';
|
||||
export * from './dees-speechbubble.js';
|
||||
export * from './dees-spinner.js';
|
||||
|
Loading…
Reference in New Issue
Block a user