AB Timestamp Range With Timezone Field

Full date-time-range + timezone picker implementation (from/to dates, times, inclusivity, infinity, timezone). Used directly for advanced range UX or wrapped by ab-timestamp / ab-timestamp-with-timezone.

HTML tag: c-e2da2be40181c45b4a000f30a4cf7bb10

When to use

timestamptz range with from/to and timezone
interval bounds with inclusive/infinity flags
low-level range picker (prefer ab-timestamp wrappers when possible)

Props

Prop	Type	Default
`value`	String
`type`	String	`date time range timezone`
`from_date`	String
`to_date`	String
`timezone_value`	String	`UTC`
`pg_data_type`	String	`timestamp with time zone`
`label`	String
`readonly`	Boolean
`enabled`	Boolean	`true`
`infinity_to`	Boolean
`inclusive_from`	Boolean
`inclusive_to`	Boolean
`from_time`	String
`to_time`	String
`date_format`	String	`DD/MM/YYYY HH:mm:ss`
`display_timezone`	String	`UTC`
`pg_timezones`	Array	“
`infinity_from`	Boolean
`display_format`	String
`use_in_basic_view`	Boolean
`label_position`	String
`label_width`	String
`input_field_name`	String	`From date`
`theme`	String
`editing`	Boolean
`formated_value`	String
`clear_button_visible`	Boolean

Rules

Prefer ab-timestamp-with-timezone for a single timestamptz field; prefer ab-timestamp for non-timezone datetime unless range is required.
Bind .value as serialized range string; component also exposes from_date, to_date, from_time, to_time, timezone_value.
Granular *-modified events per part; value-changed when composed .value updates.
type default ‘date time range timezone’; pg_data_type default ‘timestamp with time zone’.

Events

Event	Detail
`value-changed`	String
`from_date-modified`	String
`from_time-modified`	String
`inclusive_from-modified`	Boolean
`infinity_from-modified`	Boolean
`to_date-modified`	String
`to_time-modified`	String
`inclusive_to-modified`	Boolean
`infinity_to-modified`	Boolean
`timezone_value-modified`	String
`formated_value-modified`	String

Methods

Signature	Description
`openEditor()`

What to avoid

Do not use for date-only (ab-date-field) or time-only (ab-time-field). Do not duplicate ab-timestamp wrapper if this tag is used directly.

Example

<c-e2da2be40181c45b4a000f30a4cf7bb10 .label=${'Active period'} .value=${rangeValue} .timezone_value=${'UTC'} @timezone_value-modified=${onTz}></c-e2da2be40181c45b4a000f30a4cf7bb10>