property editor default value
This commit is contained in:
@@ -16,7 +16,7 @@ export class UmbPropertyEditorUICheckboxListElement extends UmbLitElement implem
|
||||
return this.#value;
|
||||
}
|
||||
public set value(value: Array<string>) {
|
||||
this.#value = value || [];
|
||||
this.#value = value ?? [];
|
||||
}
|
||||
|
||||
@property({ type: Array, attribute: false })
|
||||
|
||||
@@ -31,6 +31,7 @@ export class UmbPropertyEditorUIEyeDropperElement extends UmbLitElement implemen
|
||||
this.dispatchEvent(new CustomEvent('property-value-change'));
|
||||
}
|
||||
|
||||
// TODO: This should use the given value:
|
||||
render() {
|
||||
return html`<umb-input-eye-dropper
|
||||
@change="${this._onChange}"
|
||||
|
||||
@@ -30,9 +30,11 @@ export class UmbPropertyEditorUIIconPickerElement extends UmbLitElement implemen
|
||||
}
|
||||
|
||||
private _openModal() {
|
||||
// TODO: Modal should know the current selected one, and bring back the newly selected one.
|
||||
this._modalContext?.open(UMB_ICON_PICKER_MODAL);
|
||||
}
|
||||
|
||||
// TODO: We should show the current picked icon.
|
||||
render() {
|
||||
return html`
|
||||
<uui-button
|
||||
|
||||
@@ -19,7 +19,7 @@ export class UmbPropertyEditorUILabelElement extends UmbLitElement implements Um
|
||||
public config?: UmbDataTypePropertyCollection;
|
||||
|
||||
render() {
|
||||
return html`${this.value}`;
|
||||
return html`${this.value ?? ''}`;
|
||||
}
|
||||
|
||||
static styles = [UUITextStyles];
|
||||
|
||||
@@ -15,7 +15,7 @@ export class UmbPropertyEditorUIMediaPickerElement extends UmbLitElement impleme
|
||||
public get value(): Array<string> {
|
||||
return this._value;
|
||||
}
|
||||
public set value(value: Array<string>) {
|
||||
public set value(value: Array<string> | undefined) {
|
||||
this._value = value || [];
|
||||
}
|
||||
|
||||
|
||||
@@ -77,7 +77,7 @@ export class UmbPropertyEditorUIMultiUrlPickerElement
|
||||
.ignoreUserStartNodes=${this._ignoreUserStartNodes}
|
||||
.max=${this._maxNumber}
|
||||
.min=${this._minNumber}
|
||||
.urls="${this.value}"></umb-input-multi-url>`;
|
||||
.urls="${this.value ?? []}"></umb-input-multi-url>`;
|
||||
}
|
||||
|
||||
static styles = [UUITextStyles];
|
||||
|
||||
@@ -68,7 +68,7 @@ export class UmbPropertyEditorUIMultipleTextStringElement
|
||||
|
||||
render() {
|
||||
return html`<umb-input-multiple-text-string
|
||||
.items="${this.value}"
|
||||
.items="${this.value ?? []}"
|
||||
min="${ifDefined(this._limitMin)}"
|
||||
max="${ifDefined(this._limitMax)}"
|
||||
@change=${this.#onChange}
|
||||
|
||||
@@ -32,7 +32,7 @@ export class UmbPropertyEditorUINumberElement extends UmbLitElement implements U
|
||||
|
||||
render() {
|
||||
return html`<uui-input
|
||||
.value=${this.value}
|
||||
.value=${this.value ?? 0}
|
||||
type="number"
|
||||
max="${ifDefined(this._max)}"
|
||||
min="${ifDefined(this._min)}"
|
||||
|
||||
@@ -19,8 +19,8 @@ export class UmbPropertyEditorUIRadioButtonListElement
|
||||
public get value(): string {
|
||||
return this.#value;
|
||||
}
|
||||
public set value(value: string) {
|
||||
this.#value = value || '';
|
||||
public set value(value: string | undefined) {
|
||||
this.#value = value?.trim() || '';
|
||||
}
|
||||
|
||||
@property({ type: Array, attribute: false })
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import UmbInputSliderElement from '../../../components/input-slider/input-slider.element.js';
|
||||
import { UmbInputSliderElement } from '../../../components/input-slider/input-slider.element.js';
|
||||
import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit';
|
||||
import { UUITextStyles } from '@umbraco-cms/backoffice/external/uui';
|
||||
import { UmbPropertyEditorExtensionElement } from '@umbraco-cms/backoffice/extension-registry';
|
||||
@@ -11,10 +11,12 @@ import type { UmbDataTypePropertyCollection } from '@umbraco-cms/backoffice/comp
|
||||
@customElement('umb-property-editor-ui-slider')
|
||||
export class UmbPropertyEditorUISliderElement extends UmbLitElement implements UmbPropertyEditorExtensionElement {
|
||||
@property()
|
||||
value: {
|
||||
to?: number;
|
||||
from?: number;
|
||||
} = {};
|
||||
value:
|
||||
| {
|
||||
to?: number;
|
||||
from?: number;
|
||||
}
|
||||
| undefined = undefined;
|
||||
|
||||
@state()
|
||||
_enableRange?: boolean;
|
||||
@@ -57,6 +59,7 @@ export class UmbPropertyEditorUISliderElement extends UmbLitElement implements U
|
||||
this.dispatchEvent(new CustomEvent('property-value-change'));
|
||||
}
|
||||
|
||||
// TODO: This does not seem to take current value into account?
|
||||
render() {
|
||||
return html`<umb-input-slider
|
||||
.initVal1="${this._initVal1 ?? 0}"
|
||||
|
||||
@@ -30,7 +30,7 @@ export class UmbPropertyEditorUITextBoxElement extends UmbLitElement implements
|
||||
|
||||
render() {
|
||||
return html`<uui-input
|
||||
.value=${this.value}
|
||||
.value=${this.value ?? ''}
|
||||
type="${this._type}"
|
||||
maxlength="${ifDefined(this._maxChars)}"
|
||||
@input=${this.onInput}></uui-input>`;
|
||||
|
||||
@@ -47,7 +47,7 @@ export class UmbPropertyEditorUITextareaElement extends UmbLitElement implements
|
||||
render() {
|
||||
return html` <uui-textarea
|
||||
label="Textarea"
|
||||
.value=${this.value}
|
||||
.value=${this.value ?? ''}
|
||||
maxlength="${ifDefined(this._maxChars)}"
|
||||
rows="${ifDefined(this._rows)}"
|
||||
@input=${this.onInput}
|
||||
|
||||
@@ -11,7 +11,7 @@ import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
|
||||
@customElement('umb-property-editor-ui-toggle')
|
||||
export class UmbPropertyEditorUIToggleElement extends UmbLitElement implements UmbPropertyEditorExtensionElement {
|
||||
@property()
|
||||
value = false;
|
||||
value: undefined | boolean = undefined;
|
||||
|
||||
@state()
|
||||
_labelOff?: string;
|
||||
@@ -24,7 +24,7 @@ export class UmbPropertyEditorUIToggleElement extends UmbLitElement implements U
|
||||
|
||||
@property({ type: Array, attribute: false })
|
||||
public set config(config: UmbDataTypePropertyCollection) {
|
||||
this.value = config.getValueByAlias('default') ?? false;
|
||||
this.value ??= config.getValueByAlias('default') ?? false;
|
||||
this._labelOff = config.getValueByAlias('labelOff');
|
||||
this._labelOn = config.getValueByAlias('labelOn');
|
||||
this._showLabels = config.getValueByAlias('showLabels');
|
||||
|
||||
@@ -11,8 +11,21 @@ import type { UmbDataTypePropertyCollection } from '@umbraco-cms/backoffice/comp
|
||||
|
||||
@customElement('umb-property-editor-ui-value-type')
|
||||
export class UmbPropertyEditorUIValueTypeElement extends UmbLitElement implements UmbPropertyEditorExtensionElement {
|
||||
private _value: string | undefined = undefined;
|
||||
@property()
|
||||
value = '';
|
||||
public get value(): string | undefined {
|
||||
return this._value;
|
||||
}
|
||||
public set value(value: string | undefined) {
|
||||
this._value = value;
|
||||
|
||||
const selected = this._options.filter((option) => {
|
||||
return (option.selected = option.value === this.value);
|
||||
});
|
||||
if (selected.length === 0) {
|
||||
this._options[0].selected = true;
|
||||
}
|
||||
}
|
||||
|
||||
@state()
|
||||
private _options: Array<Option> = [
|
||||
@@ -25,16 +38,6 @@ export class UmbPropertyEditorUIValueTypeElement extends UmbLitElement implement
|
||||
{ name: 'Long String', value: 'TEXT' },
|
||||
];
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
}
|
||||
|
||||
connectedCallback(): void {
|
||||
super.connectedCallback();
|
||||
const index = this._options.findIndex((option) => option.value === this.value);
|
||||
index > 0 ? (this._options[index].selected = true) : (this._options[0].selected = true);
|
||||
}
|
||||
|
||||
@property({ type: Array, attribute: false })
|
||||
public config?: UmbDataTypePropertyCollection;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user