TimeframeSelector

Use the TimeframeSelector to let users select a timeframe by choosing a from and to value or one of the presets for common timeframes.

OverviewPropertiesUsage

TimeframeSelectorProps

Signature:

export declare type TimeframeSelectorProps = <<{ from: ; to: ; }> | <> | , (value: | ) => > & & & & & { /** * Shows the button if set to true. * @defaultValue false */ clearable?: ; /** * The ISODatetime of the earliest datetime that can be configured. * @defaultValue '1677-09-21T00:12:43.145224192Z' */ min?: ; /** * The ISODatetime of the latest datetime that can be configured. * @defaultValue '2262-04-11T23:47:16.854775807Z' */ max?: ; /** * The precision of the time shown in the display value. * @defaultValue */ precision?: | | ; /** * Whether the TimeframeStepper is shown. * @defaultValue true */ stepper?: ; };

Prop Table did not receive data

Prop Table did not receive data

Prop Table did not receive data

TimeframeSelector presets components

TimeframeSelector.Presets

The TimeframeSelector.Presets component is used to render the list of preset items shown in the overlay.

TimeframeSelectorPresetsProps

extends, , ,

Name	Type	Default	Description
children?		-	Children shown inside the presets list.A default list of presets is shown if no children are set.

TimeframeSelector.PresetItem

The TimeframeSelector.PresetItem component is used to render a preset item to the list of presets shown in the overlay. This needs to be used inside the TimeframeSelector.Presets component.

TimeframeSelectorPresetItemProps

extends<>, , ,

Name	Type	Default	Description
value	{ /** Start of the time frame. */ from: ; /** End of the time frame. */ to: ; }	-	The value of the timeframe preset.

TimeframeSelector trigger components

TimeframeSelector.Trigger

The TimeframeSelector.Trigger component is used to render the trigger that opens or closes the overlay.

TimeframeSelectorTriggerProps

Signature:

export declare type TimeframeSelectorTriggerProps = & & & & { /** * The placeholder text displayed in the TimeframeSelector.Trigger. */ placeholder?: ; };

TimeframeSelector.DisplayValue

TimeframeSelectorDisplayValueProps

Signature:

export declare type TimeframeSelectorDisplayValueProps = { children?: | ((customTriggerProps: { displayValue: ; }) => ); };

Name	Type	Default	Description
children?	| ((customTriggerProps: { displayValue: ; }) => )	-

TimeframeSelector.CustomTrigger

TimeframeSelectorCustomTriggerProps

Signature:

export declare type TimeframeSelectorCustomTriggerProps = & & & { /** Elements to be displayed in the CustomTrigger. */ children: | | ((customTriggerProps: { displayValue: ; isInvalid: ; hint: ; }, props: ( & & & (<<<>>> & )) | ) => ); };