import { KbqTimeRangeModule } from '@koobiq/components/time-range';Directive for easy using styles of time-range placeholder publicly.
Selector: [kbqTimeRangeTitlePlaceholder]
Component simulates `KbqFormFieldControl` allowing to provide custom content inside `KbqFormField`
Selector: kbq-time-range-title-as-control
Selector: kbq-time-range
| Name | Description |
|---|---|
@Input() arrow: InputSignalWithTransform |
Whether to show popover with arrow |
@Input() availableTimeRangeTypes: InputSignal |
Preset of selectable ranges |
@Input() defaultRangeValue: InputSignal |
provided value of selected range |
@Input() maxDate: InputSignal |
The maximum selectable date. |
@Input() minDate: InputSignal |
The minimum selectable date. |
@Input() nonNullable: InputSignalWithTransform |
Whether component should fallback to default value if null provided |
@Input() optionTemplate: InputSignal |
Customizable option output |
@Input() showRangeAsDefault: InputSignal |
Whether to show range in popover if not provided |
@Input() titleTemplate: InputSignal |
Customizable trigger output |
@Output('valueCorrected')
valueCorrected: OutputEmitterRef |
Emit value update if provided value via formControl wasn't valid |
Represents a time range with optional start and end date-time values. Used as a form value when range in popover change.
| Name | Description |
|---|---|
| fromDate: T | |
| fromTime: T | |
| toDate: T | |
| toTime: T |
Configuration for a custom time range with duration metadata. Defines a time range with its identifier, duration units, and optional fixed date range.
| Name | Description |
|---|---|
| days: number | |
| hours: number | |
| milliseconds: number | |
| minutes: number | |
| months: number | |
| quarters: number | |
| seconds: number | |
| weeks: number | |
| years: number |
Represents a time range with optional start and end date-time values. Used as a range value by default.
type KbqRange = {
startDateTime?: string;
endDateTime?: string;
};
Range type selected
type KbqTimeRangeTypeContext = {
type: KbqTimeRangeType;
};
Main range information. Used for a popover date range selection, when selected type is range, and for trigger information calculation.
type KbqTimeRangeRange = KbqRange & KbqTimeRangeTypeContext;
Default accepted “time‑range” identifiers.
type KbqTimeRangeType = | 'lastMinute'
| 'last5Minutes'
| 'last15Minutes'
| 'last30Minutes'
| 'lastHour'
| 'last24Hours'
| 'last3Days'
| 'last7Days'
| 'last14Days'
| 'last30Days'
| 'last3Months'
| 'last12Months'
| 'allTime'
| 'currentQuarter'
| 'currentYear'
| 'range';
Property representing duration output unit
type KbqTimeRangeTranslationType = Exclude<DurationUnit, 'quarters' | 'milliseconds'> | 'other';
type KbqCustomTimeRangeType = {
/** time range identifier. Used as config key */
type: KbqTimeRangeType | string;
/** Duration metadata */
units: KbqTimeRangeUnits;
/** Property representing duration output unit */
translationType: KbqTimeRangeTranslationType;
/** Custom range of start/end date-times */
range?: KbqRange;
};
Context for a time range trigger, combining range info and type.
type KbqTimeRangeTitleContext = KbqTimeRangeRange & KbqTimeRangeUnits;
Context for a time range trigger customization, combining meta information.
type KbqTimeRangeCustomizableTitleContext = Partial<KbqTimeRangeTitleContext> & {
$implicit: Partial<KbqTimeRangeTitleContext> & { formattedDate: string; popover: KbqPopoverTrigger };
} & { formattedDate: string; popover: KbqPopoverTrigger };
Context for a time range option customization, combining meta information.
type KbqTimeRangeOptionContext = KbqTimeRangeTypeContext &
KbqTimeRangeUnits & { translationType: KbqTimeRangeTranslationType; formattedValue: string };
Preset of selectable time ranges, provided by DI.
const KBQ_DEFAULT_TIME_RANGE_TYPES: InjectionToken<KbqTimeRangeType[]>;
Preset of custom time ranges, provided by DI.
const KBQ_CUSTOM_TIME_RANGE_TYPES: InjectionToken<KbqCustomTimeRangeType[]>;
Time range types in range editor if nothing provided
const defaultTimeRangeTypes: KbqTimeRangeType[];
Localization configuration provider.
const KBQ_TIME_RANGE_LOCALE_CONFIGURATION: InjectionToken<KbqTimeRangeLocaleConfig>;
Utility provider for `KBQ_TIME_RANGE_LOCALE_CONFIGURATION`.
const kbqTimeRangeLocaleConfigurationProvider: (configuration: KbqTimeRangeLocaleConfig) => Provider;
Validates that the 'from' date-time is not greater than the 'to' date-time in a range form. Returns an error if the start date-time occurs after the end date-time.
const rangeValidator: <T>(timeRangeService: KbqTimeRangeService<T>) => ValidatorFn;