---
title: QuanticTimeframeFacet
slug: latest-search-timeframe-facet
canonical_url: https://docs.coveo.com/en/quantic/latest/reference/search-components/search-timeframe-facet/
collection: quantic
source_format: adoc
---
# QuanticTimeframeFacet

> **Note**
>
> This component was introduced in version `1.6.1`.

The `QuanticTimeframeFacet` component displays dates as relative ranges.

## Example

```html
<c-quantic-timeframe-facet engine-id={engineId} field="Date" label="Indexed Date" is-collapsed with-date-picker>
  <c-quantic-timeframe period="past" unit="year" amount="10" label="Past decade"></c-quantic-timeframe>
</c-quantic-timeframe-facet>
```

## Properties

--
|===
| Property | Attribute | Description | Type | Default

| `engineId` _(required)_
| `engine-id`
a| The ID of the engine instance the component registers to.
| `string`
|

| `facetId`
| `facet-id`
a| A unique identifier for the facet.
| `string`
| Defaults to the `field` value.

| `field` _(required)_
| `field`
a| The index field whose values the facet should use.
| `string`
|

| `label` _(required)_
| `label`
a| The non-localized label for the facet. This label is displayed in the facet header.
| `string`
|

| `withDatePicker`
| `with-date-picker`
a| Whether the facet should display custom range inputs.
| `boolean`
| `false`

| `isCollapsed`
| `is-collapsed`
a| Whether the facet is collapsed.
| `boolean`
| `false`

| `noFilterFacetCount`
| `no-filter-facet-count`
a| Whether not to exclude the parents of folded results when estimating the result count for each facet value.
| `boolean`
| `false`

| `injectionDepth`
| `injection-depth`
a| The maximum number of results to scan in the index to ensure that the facet lists all potential facet values.
Note: A high injectionDepth may negatively impact the facet request performance.
Minimum: `0`
| `number`
| `1000`

| `dependsOn` _(required)_
| `depends-on`
a| This property defines the relationship between this facet and a parent facet, indicating
the specific parent facet that this facet relies on and the selected value required
from that parent facet for this facet to be displayed.
When this property is defined, the facet will only display if the specified `parentFacetId`
has the `expectedValue` selected. If `expectedValue` is omitted or set to `undefined`,
the facet will display as long as any value is selected in the parent facet.
<strong>Supported facets:</strong> Dependencies can only be created on a basic or category facet.
Dependencies on numeric, timeframe, or date facets are not supported.
For example usage and more details, see:
https://docs.coveo.com/en/quantic/latest/usage/display-facet-based-on-selection-of-another-facet/
| `DependsOn`
|

|===
--

## XML configuration file elements

The following XML configuration file elements apply (see [XML Configuration File Elements](https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.reference_configuration_tags)).

--
|===
| Metadata | Value

| `apiVersion` | `53.0`
| `isExposed` | `false`
|===
--

## Associated use cases

This component is also relevant in the following use case:

* [Insight Panel](https://docs.coveo.com/en/quantic/latest/reference/insight-panel-components/insight-panel-timeframe-facet)