2021-08-25 11:51:55 +00:00
|
|
|
import { customElement, html, DeesElement, css, cssManager, property } from '@designestate/dees-element';
|
2021-05-05 20:55:49 +00:00
|
|
|
import { DeesForm } from './dees-form';
|
2020-09-13 16:24:48 +00:00
|
|
|
|
2021-02-13 21:52:36 +00:00
|
|
|
declare global {
|
|
|
|
interface HTMLElementTagNameMap {
|
|
|
|
'dees-form-submit': DeesFormSubmit;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2020-09-13 16:24:48 +00:00
|
|
|
@customElement('dees-form-submit')
|
2021-05-05 20:55:49 +00:00
|
|
|
export class DeesFormSubmit extends DeesElement {
|
2021-08-25 11:51:55 +00:00
|
|
|
public static demo = () => html`<dees-form-submit></dees-form-submit>`;
|
|
|
|
|
|
|
|
@property({
|
|
|
|
type: Boolean
|
|
|
|
})
|
|
|
|
public disabled = false;
|
|
|
|
|
2021-08-25 14:09:52 +00:00
|
|
|
@property({
|
|
|
|
type: String
|
|
|
|
})
|
|
|
|
public text: string;
|
|
|
|
|
2021-05-05 20:55:49 +00:00
|
|
|
constructor() {
|
|
|
|
super();
|
|
|
|
}
|
2020-09-13 16:24:48 +00:00
|
|
|
|
2021-05-05 20:55:49 +00:00
|
|
|
public static styles = [cssManager.defaultStyles, css``];
|
2020-09-13 16:24:48 +00:00
|
|
|
|
|
|
|
public render() {
|
2021-08-25 14:10:56 +00:00
|
|
|
return html`<dees-button @click="${this.submit}" .disabled="${this.disabled}">${this.text ? this.text : html`<slot></slot>`}</dees-button> `;
|
2020-09-13 16:24:48 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
public async submit() {
|
2021-08-25 11:51:55 +00:00
|
|
|
if(this.disabled) {
|
|
|
|
return;
|
|
|
|
}
|
2020-09-13 16:24:48 +00:00
|
|
|
const parentElement: DeesForm = this.parentElement as DeesForm;
|
|
|
|
parentElement.gatherAndDispatch();
|
|
|
|
}
|
|
|
|
}
|