fix(core): update
This commit is contained in:
@@ -2,6 +2,12 @@ import { customElement, html, DeesElement, property, TemplateResult } from '@des
|
||||
|
||||
import * as domtools from '@designestate/dees-domtools';
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
'dees-button': DeesButton;
|
||||
}
|
||||
}
|
||||
|
||||
@customElement('dees-button')
|
||||
export class DeesButton extends DeesElement {
|
||||
public static demo = () => html`<dees-button></dees-button>`
|
||||
|
@@ -2,6 +2,12 @@ import { customElement, html, LitElement } from 'lit-element';
|
||||
|
||||
import {DeesForm} from './dees-form';
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
'dees-form-submit': DeesFormSubmit;
|
||||
}
|
||||
}
|
||||
|
||||
@customElement('dees-form-submit')
|
||||
export class DeesFormSubmit extends LitElement {
|
||||
|
||||
|
@@ -5,6 +5,12 @@ import { DeesInputText } from './dees-input-text';
|
||||
import { DeesInputQuantitySelector } from './dees-input-quantityselector';
|
||||
import { DeesInputRadio } from './dees-input-radio';
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
'dees-form': DeesForm;
|
||||
}
|
||||
}
|
||||
|
||||
@customElement('dees-form')
|
||||
export class DeesForm extends LitElement {
|
||||
public static demo = () => html`
|
||||
|
47
ts_web/elements/dees-updater.ts
Normal file
47
ts_web/elements/dees-updater.ts
Normal file
@@ -0,0 +1,47 @@
|
||||
import { customElement, LitElement, TemplateResult, html, property } from 'lit-element';
|
||||
|
||||
import * as domtools from '@designestate/dees-domtools';
|
||||
|
||||
|
||||
import './dees-windowlayer';
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
'dees-updater': DeesUpdater;
|
||||
}
|
||||
}
|
||||
|
||||
@customElement('dees-updater')
|
||||
export class DeesUpdater extends LitElement {
|
||||
public static demo = () => html`<dees-updater ></dees-updater>`;
|
||||
|
||||
@property()
|
||||
currentVersion: string;
|
||||
|
||||
@property()
|
||||
updatedVersion: string;
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
domtools.elementBasic.setup();
|
||||
}
|
||||
|
||||
public render(): TemplateResult {
|
||||
return html`
|
||||
${domtools.elementBasic.styles}
|
||||
<style>
|
||||
.modalContainer {
|
||||
background: #333333;
|
||||
margin: auto;
|
||||
height: 200px;
|
||||
width: 800px;
|
||||
margin-top: 80px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
</style>
|
||||
<dees-windowlayer>
|
||||
<div class="modalContainer"></div>
|
||||
</dees-windowlayer>>
|
||||
`;
|
||||
}
|
||||
}
|
50
ts_web/elements/dees-windowlayer.ts
Normal file
50
ts_web/elements/dees-windowlayer.ts
Normal file
@@ -0,0 +1,50 @@
|
||||
import { customElement, LitElement, TemplateResult, html, property } from 'lit-element';
|
||||
|
||||
import * as domtools from '@designestate/dees-domtools';
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
'dees-windowlayer': DeesWindowLayer;
|
||||
}
|
||||
}
|
||||
|
||||
@customElement('dees-windowlayer')
|
||||
export class DeesWindowLayer extends LitElement {
|
||||
public static demo = () => html`<dees-windowlayer></dees-windowlayer>`;
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
domtools.elementBasic.setup();
|
||||
}
|
||||
|
||||
public render(): TemplateResult {
|
||||
return html`
|
||||
${domtools.elementBasic.styles}
|
||||
<style>
|
||||
.windowOverlay {
|
||||
transition: all 1s;
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
background: rgba(0, 0, 0, 0.0);
|
||||
backdrop-filter: blur(0px);
|
||||
}
|
||||
.visible {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
backdrop-filter: blur(3px);
|
||||
}
|
||||
</style>
|
||||
<div class="windowOverlay">
|
||||
<slot></slot>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
firstUpdated() {
|
||||
setTimeout(() => {
|
||||
this.shadowRoot.querySelector('.windowOverlay').classList.add('visible');
|
||||
}, 100);
|
||||
}
|
||||
}
|
@@ -8,3 +8,5 @@ export * from './dees-input-quantityselector';
|
||||
export * from './dees-input-radio';
|
||||
export * from './dees-input-text';
|
||||
export * from './dees-toast';
|
||||
export * from './dees-updater';
|
||||
export * from './dees-windowlayer';
|
||||
|
Reference in New Issue
Block a user