First attempt at getting a prop editor working

This commit is contained in:
Warren Buckley
2023-02-01 11:58:56 +00:00
parent 8aabc9232a
commit 0235e46dcc

View File

@@ -1,6 +1,7 @@
import { html } from 'lit';
import { customElement, property } from 'lit/decorators.js';
import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
import { UmbPropertyValueChangeEvent } from '../..';
import { UmbLitElement } from '@umbraco-cms/element';
/**
@@ -13,11 +14,40 @@ export class UmbPropertyEditorUIDatePickerElement extends UmbLitElement {
@property()
value = '';
private updateValue(e: InputEvent) {
console.log('config', this.config);
const dateField = e.target as HTMLInputElement;
this.value = dateField.value;
this.dispatchEvent(new UmbPropertyValueChangeEvent());
}
@property({ type: Array, attribute: false })
public config = [];
// CONFIG
// Date format string
// if empty = YYYY-MM-DD
// Based on the format string
// We need to change the underlying type for UUI-input
// YYYY-MM-DD = date
// YYYY-MM-DD HH:mm:ss = datetime-local
// HH:mm:ss = time
// HH:mm = time
// Config offset time? (Boolean)
// Copmpares against a global value in Umbraco.Sys.SeverVariables
render() {
return html`<div>umb-property-editor-ui-date-picker</div>`;
return html`
<uui-input type="date" @input=${this.updateValue} .value=${this.value}></uui-input>
<div>
<small>Chosen Value: ${this.value}</small>
</div>`;
}
}