diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts index b6c60c6897..a62559e35b 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/number/property-editor-ui-number.element.ts @@ -1,26 +1,52 @@ import { css, html } from 'lit'; import { UUITextStyles } from '@umbraco-ui/uui-css/lib'; -import { customElement, property } from 'lit/decorators.js'; +import { customElement, property, state } from 'lit/decorators.js'; +import { ifDefined } from 'lit/directives/if-defined.js'; import { UmbPropertyEditorExtensionElement } from '@umbraco-cms/backoffice/extensions-registry'; import { UmbLitElement } from '@umbraco-cms/internal/lit-element'; +import { DataTypePropertyPresentationModel } from '@umbraco-cms/backoffice/backend-api'; @customElement('umb-property-editor-ui-number') export class UmbPropertyEditorUINumberElement extends UmbLitElement implements UmbPropertyEditorExtensionElement { - - @property() value = ''; + @state() + private _max?: number; + + @state() + private _min?: number; + + @state() + private _step?: number; + @property({ type: Array, attribute: false }) - public config = []; + public set config(config: Array) { + const min = config.find((x) => x.alias === 'min'); + if (min) this._min = min.value; + + const max = config.find((x) => x.alias === 'max'); + if (max) this._max = max.value; + + const step = config.find((x) => x.alias === 'step'); + if (step) this._step = step.value; + } private onInput(e: InputEvent) { this.value = (e.target as HTMLInputElement).value; this.dispatchEvent(new CustomEvent('property-value-change')); } + //TODO: UUI-INPUT needs to handle max, min, and step natively in its input field, maybe make a uui-input-number? + render() { - return html``; + return html``; } static styles = [