@serenity-is/corelib / DateTimeEditor

Class: DateTimeEditor<P>

Defined in: src/ui/editors/datetimeeditor.tsx:12

An editor that renders a date-time input with a date picker and time select.

Extends

• EditorWidget<P>

Type Parameters

P

P extends DateTimeEditorOptions = DateTimeEditorOptions

Widget props type.

Implements

• IStringValue
• IReadOnly

Constructors

Constructor

new DateTimeEditor<P>(props): DateTimeEditor<P>

Defined in: src/ui/editors/datetimeeditor.tsx:30

Creates a date-time editor.

Parameters

props

EditorProps<P>

Widget props.

Returns

DateTimeEditor<P>

Overrides

EditorWidget.constructor

Properties

domNode

readonly domNode: HTMLInputElement

Defined in: src/ui/editors/datetimeeditor.tsx:20

The text input element that backs the editor.

Overrides

EditorWidget.domNode

---

idPrefix

readonly idPrefix: string

Defined in: src/ui/widgets/widget.ts:22

The id prefix used for this widget's child element ids.

Inherited from

EditorWidget.idPrefix

---

options

protected readonly options: WidgetProps<EditorProps<P>>

Defined in: src/ui/widgets/widget.ts:18

The widget's options/props.

Inherited from

EditorWidget.options

---

uniqueName

readonly uniqueName: string

Defined in: src/ui/widgets/widget.ts:20

A unique name for this widget instance, used for event namespacing.

Inherited from

EditorWidget.uniqueName

---

[typeInfo]

static [typeInfo]: EditorTypeInfo<"Serenity.">

Defined in: src/ui/editors/datetimeeditor.tsx:14

Implementation of

IReadOnly.[typeInfo]

Overrides

EditorWidget.[typeInfo]

---

getTimeOptions()

static getTimeOptions: (fromHour, fromMin, toHour, toMin, stepMins) => string[]

Defined in: src/ui/editors/datetimeeditor.tsx:485

Generates a list of time strings at a fixed step.

Parameters

fromHour

number

Start hour.

fromMin

number

Start minute.

toHour

number

End hour.

toMin

number

End minute.

stepMins

number

Step size in minutes.

Returns

string[]

Array of "HH:mm" time strings.

---

isComponent

readonly static isComponent: true = true

Defined in: src/ui/widgets/widget.ts:334

Inherited from

EditorWidget.isComponent

Accessors

element

Get Signature

get element(): Fluent

Defined in: src/ui/widgets/widget.ts:82

Returns a Fluent(this.domNode) object

Returns

Fluent

Inherited from

EditorWidget.element

---

props

Get Signature

get props(): WidgetProps<P>

Defined in: src/ui/widgets/widget.ts:307

Returns the widget's props/options.

Returns

WidgetProps<P>

Inherited from

EditorWidget.props

---

readOnly

Get Signature

get readOnly(): boolean

Defined in: src/ui/editors/editorwidget.ts:42

Returns whether the editor is read-only.

Returns

boolean

True when read-only.

Set Signature

set readOnly(value): void

Defined in: src/ui/editors/editorwidget.ts:48

Sets whether the editor is read-only.

Parameters

value

boolean

Returns

void

Inherited from

EditorWidget.readOnly

---

value

Get Signature

get value(): string

Defined in: src/ui/editors/datetimeeditor.tsx:265

Returns the current date-time value.

Returns

string

The value.

Set Signature

set value(v): void

Defined in: src/ui/editors/datetimeeditor.tsx:315

Sets the date-time value.

Parameters

v

string

The date-time string to set.

Returns

void

---

valueAsDate

Get Signature

get valueAsDate(): Date

Defined in: src/ui/editors/datetimeeditor.tsx:330

Returns the current date-time value as a Date.

Returns

Date

The date-time value.

Set Signature

set valueAsDate(value): void

Defined in: src/ui/editors/datetimeeditor.tsx:345

Sets the date-time value as a Date.

Parameters

value

Date

The date-time value to set.

Returns

void

Methods

addCssClass()

protected addCssClass(): void

Defined in: src/ui/widgets/widget.ts:89

Adds the widget's CSS class to its DOM node.

Returns

void

Inherited from

EditorWidget.addCssClass

---

addValidationRule()

Call Signature

addValidationRule(rule, uniqueName?): void

Defined in: src/ui/widgets/widget.ts:142

Adds a validation rule to the widget's DOM node.

Parameters

rule

(input) => string

The validation rule function, or a unique name when the two-argument overload is used.

uniqueName?

string

A unique name for the rule, or the rule function when the two-argument overload is used.

Returns

void

Inherited from

EditorWidget.addValidationRule

Call Signature

addValidationRule(uniqueName, rule): void

Defined in: src/ui/widgets/widget.ts:143

Adds a validation rule to the widget's DOM node.

Parameters

uniqueName

string

A unique name for the rule, or the rule function when the two-argument overload is used.

rule

(input) => string

The validation rule function, or a unique name when the two-argument overload is used.

Returns

void

Inherited from

EditorWidget.addValidationRule

---

afterRender()

protected afterRender(callback): void

Defined in: src/ui/widgets/widget.ts:228

Queues a callback to run after the widget's contents are rendered.

Parameters

callback

() => void

The callback to run after rendering.

Returns

void

Inherited from

EditorWidget.afterRender

---

byId()

protected byId<TElement>(id): Fluent<TElement>

Defined in: src/ui/widgets/widget.ts:154

Finds a child element by its prefix-relative id.

Type Parameters

TElement

TElement extends HTMLElement = HTMLElement

Parameters

id

string

The id relative to the widget's id prefix.

Returns

Fluent<TElement>

A Fluent wrapper for the matching element.

Inherited from

EditorWidget.byId

---

change()

change(handler): void

Defined in: src/ui/widgets/widget.ts:179

Registers a change handler on the widget's DOM node.

Parameters

handler

(e) => void

The change event handler.

Returns

void

Inherited from

EditorWidget.change

---

changeSelect2()

changeSelect2(handler): void

Defined in: src/ui/widgets/widget.ts:188

Registers a change handler that ignores changes originating from combobox setting values.

Parameters

handler

(e) => void

The change event handler.

Returns

void

Inherited from

EditorWidget.changeSelect2

---

createFlatPickrTrigger()

createFlatPickrTrigger(): HTMLElement

Defined in: src/ui/editors/datetimeeditor.tsx:226

Creates the flatpickr trigger button.

Returns

HTMLElement

The trigger element.

---

deferRender()

protected deferRender(): boolean

Defined in: src/ui/widgets/widget.ts:98

Determines whether rendering should be deferred until init is called.

Returns

boolean

True to defer rendering.

Inherited from

EditorWidget.deferRender

---

destroy()

destroy(): void

Defined in: src/ui/editors/datetimeeditor.tsx:176

Cleans up the date-time picker instance.

Returns

void

Overrides

EditorWidget.destroy

---

findById()

protected findById<TElement>(id): TElement

Defined in: src/ui/widgets/widget.ts:163

Finds a child element by its prefix-relative id.

Type Parameters

TElement

TElement extends HTMLElement = HTMLElement

Parameters

id

string

The id relative to the widget's id prefix.

Returns

TElement

The matching element, or null if not found.

Inherited from

EditorWidget.findById

---

get_maxDate()

get_maxDate(): Date

Defined in: src/ui/editors/datetimeeditor.tsx:401

Returns the maximum allowed date-time as a Date.

Returns

Date

The maximum date-time.

---

get_maxValue()

get_maxValue(): string

Defined in: src/ui/editors/datetimeeditor.tsx:369

Returns the maximum allowed date-time value.

Returns

string

The maximum value.

---

get_minDate()

get_minDate(): Date

Defined in: src/ui/editors/datetimeeditor.tsx:385

Returns the minimum allowed date-time as a Date.

Returns

Date

The minimum date-time.

---

get_minValue()

get_minValue(): string

Defined in: src/ui/editors/datetimeeditor.tsx:353

Returns the minimum allowed date-time value.

Returns

string

The minimum value.

---

get_readOnly()

get_readOnly(): boolean

Defined in: src/ui/editors/datetimeeditor.tsx:440

Returns whether the editor is read-only.

Returns

boolean

True when read-only.

Implementation of

IReadOnly.get_readOnly

---

get_sqlMinMax()

get_sqlMinMax(): boolean

Defined in: src/ui/editors/datetimeeditor.tsx:417

Whether SQL min/max date-time bounds are applied.

Returns

boolean

True when SQL bounds are set.

---

get_value()

get_value(): string

Defined in: src/ui/editors/datetimeeditor.tsx:236

Returns the current date-time value.

Returns

string

The value, or null when empty.

Implementation of

IStringValue.get_value

---

getCssClass()

protected getCssClass(): string

Defined in: src/ui/widgets/widget.ts:106

Returns the CSS class(es) applied to the widget's DOM node.

Returns

string

The space-separated CSS class string.

Inherited from

EditorWidget.getCssClass

---

getCustomAttribute()

protected getCustomAttribute<TAttr>(attrType, inherit): TAttr

Defined in: src/ui/widgets/widget.ts:220

Returns a custom attribute applied to the widget's type.

Type Parameters

TAttr

TAttr extends CustomAttribute

Parameters

attrType

(...args) => TAttr

The attribute type to look up.

inherit

boolean = true

Whether to search inherited types; defaults to true.

Returns

TAttr

The matching attribute, or null.

Inherited from

EditorWidget.getCustomAttribute

---

getFlatpickrOptions()

getFlatpickrOptions(): any

Defined in: src/ui/editors/datetimeeditor.tsx:187

Returns the flatpickr options for this editor.

Returns

any

Flatpickr options.

---

getGridField()

getGridField(): Fluent

Defined in: src/ui/widgets/widget.ts:171

Returns the closest .field element containing the widget's DOM node.

Returns

Fluent

A Fluent wrapper for the grid field.

Inherited from

EditorWidget.getGridField

---

init()

init(): this

Defined in: src/ui/widgets/widget.ts:243

Initializes the widget, rendering its contents if rendering was deferred.

Returns

this

This widget instance.

Inherited from

EditorWidget.init

---

internalRenderContents()

internalRenderContents(): void

Defined in: src/ui/widgets/widget.ts:266

Renders the widget's contents and runs any queued after-render callbacks.

Returns

void

Inherited from

EditorWidget.internalRenderContents

---

legacyTemplateRender()

protected legacyTemplateRender(): boolean

Defined in: src/ui/widgets/widget.ts:291

Renders the widget from a legacy getTemplate string, if defined.

Returns

boolean

True if a legacy template was rendered.

Inherited from

EditorWidget.legacyTemplateRender

---

render()

render(): any

Defined in: src/ui/widgets/widget.ts:253

Returns the main element for this widget or the document fragment. As widgets may get their elements from props unlike regular JSX widgets, this method should not be overridden. Override renderContents() instead.

Returns

any

Inherited from

EditorWidget.render

---

renderContents()

protected renderContents(): any

Defined in: src/ui/widgets/widget.ts:281

Renders the widget's contents. Override this to provide custom content.

Returns

any

The rendered contents.

Inherited from

EditorWidget.renderContents

---

set_maxDate()

set_maxDate(value): void

Defined in: src/ui/editors/datetimeeditor.tsx:409

Sets the maximum allowed date-time as a Date.

Parameters

value

Date

The maximum date-time.

Returns

void

---

set_maxValue()

set_maxValue(value): void

Defined in: src/ui/editors/datetimeeditor.tsx:377

Sets the maximum allowed date-time value.

Parameters

value

string

The maximum value.

Returns

void

---

set_minDate()

set_minDate(value): void

Defined in: src/ui/editors/datetimeeditor.tsx:393

Sets the minimum allowed date-time as a Date.

Parameters

value

Date

The minimum date-time.

Returns

void

---

set_minValue()

set_minValue(value): void

Defined in: src/ui/editors/datetimeeditor.tsx:361

Sets the minimum allowed date-time value.

Parameters

value

string

The minimum value.

Returns

void

---

set_readOnly()

set_readOnly(value): void

Defined in: src/ui/editors/datetimeeditor.tsx:448

Sets whether the editor is read-only.

Parameters

value

boolean

True to enable read-only mode.

Returns

void

Implementation of

IReadOnly.set_readOnly

---

set_sqlMinMax()

set_sqlMinMax(value): void

Defined in: src/ui/editors/datetimeeditor.tsx:425

Sets whether SQL min/max date-time bounds are applied.

Parameters

value

boolean

True to apply SQL bounds.

Returns

void

---

set_value()

set_value(value): void

Defined in: src/ui/editors/datetimeeditor.tsx:273

Sets the date-time value.

Parameters

value

string

The value to set.

Returns

void

Implementation of

IStringValue.set_value

---

setToNow()

setToNow(triggerChange?): void

Defined in: src/ui/editors/datetimeeditor.tsx:167

Sets the value to the current date and time.

Parameters

triggerChange?

boolean

When true, triggers a change event.

Returns

void

---

syncOrAsyncThen()

protected syncOrAsyncThen<T>(syncMethod, asyncMethod, then): void

Defined in: src/ui/widgets/widget.ts:318

Runs a method synchronously or asynchronously depending on the widget's useAsync flag, then invokes a continuation.

Type Parameters

T

T

Parameters

syncMethod

() => T

The synchronous method to run.

asyncMethod

() => PromiseLike<T>

The asynchronous method to run.

then

(v) => void

The continuation invoked with the result.

Returns

void

Inherited from

EditorWidget.syncOrAsyncThen

---

useIdPrefix()

protected useIdPrefix(): IdPrefixType

Defined in: src/ui/widgets/widget.ts:329

Returns an id prefix helper for resolving child element ids.

Returns

IdPrefixType

An IdPrefixType proxy for this widget's id prefix.

Inherited from

EditorWidget.useIdPrefix

---

create()

static create<TWidget, P>(params): TWidget

Defined in: src/ui/widgets/widget.ts:202

Creates a widget instance from the given params, appending its element to the container and invoking the init/init callbacks.

Type Parameters

TWidget

TWidget extends Widget<P>

P

P

Parameters

params

CreateWidgetParams<TWidget, P>

The widget creation params.

Returns

TWidget

The created widget instance.

Inherited from

EditorWidget.create

---

createDefaultElement()

static createDefaultElement(): HTMLInputElement

Defined in: src/ui/editors/datetimeeditor.tsx:18

Creates the default text input element for the date-time editor.

Returns

HTMLInputElement

The input element.

Overrides

EditorWidget.createDefaultElement

---

getWidgetName()

static getWidgetName(type): string

Defined in: src/ui/widgets/widget.ts:131

Returns the widget name for a type, used for association and unique names.

Parameters

type

Function

The widget type.

Returns

string

The widget name.

Inherited from

EditorWidget.getWidgetName

---

registerClass()

protected static registerClass<TypeName>(typeName, intfAndAttr?): ClassTypeInfo<TypeName>

Defined in: src/ui/widgets/widget.ts:342

Registers this type as a class with the given type name.

Type Parameters

TypeName

TypeName

Parameters

typeName

StringLiteral<TypeName>

The type name to register.

intfAndAttr?

(InterfaceType | AttributeSpecifier)[]

Optional interfaces and attributes.

Returns

ClassTypeInfo<TypeName>

The class type info.

Inherited from

EditorWidget.registerClass

---

registerEditor()

protected static registerEditor<TypeName>(typeName, intfAndAttr?): EditorTypeInfo<TypeName>

Defined in: src/ui/widgets/widget.ts:357

Registers this type as an editor with the given type name.

Type Parameters

TypeName

TypeName

Parameters

typeName

StringLiteral<TypeName>

The type name to register.

intfAndAttr?

(InterfaceType | AttributeSpecifier)[]

Optional interfaces and attributes.

Returns

EditorTypeInfo<TypeName>

The editor type info.

Inherited from

EditorWidget.registerEditor

---

roundToMinutes()

static roundToMinutes(date, minutesStep): Date

Defined in: src/ui/editors/datetimeeditor.tsx:468

Rounds a date to the nearest minute step.

Parameters

date

Date

The date to round.

minutesStep

number

Step size in minutes.

Returns

Date

The rounded date with seconds and milliseconds zeroed.