Period filter

Select a calendar unit for grouped data.

A period filter selects one calendar unit. Use it when a view can group data by week, month, quarter, or year. Backlit accepts only a unit declared by the filter.

API

filters.period(name: string, units: PeriodUnit[]): PeriodFilterBuilder

The available units are week, month, quarter, and year.

Method	Input	Result
`setLabel`	`string`	Sets the filter-control label.

Basic period filter

import {
  defineFilters,
  defineResource,
  filters,
  section,
} from '@backlit/sdk'

const orders = defineResource('orders', [])
const orderFilters = defineFilters([
  filters.period('period', ['week', 'month', 'quarter']),
])

orders.view(
  'list',
  { filters: orderFilters },
  (_ctx, view) =>
    section('Revenue').setFilters(view.state.filters)
)

export default orders

{
  "kind": "success",
  "status": 200,
  "node": {
    "kind": "view",
    "resource": "orders",
    "name": "list",
    "slots": {
      "content": [
        {
          "kind": "section",
          "title": "Revenue",
          "slots": {
            "content": [],
            "filters": {
              "kind": "filters",
              "resource": "orders",
              "view": "list",
              "keyword": "f",
              "definesResult": true,
              "dependsOnResult": false,
              "filters": [
                {
                  "kind": "period",
                  "name": "period",
                  "label": "",
                  "units": [
                    "week",
                    "month",
                    "quarter"
                  ]
                }
              ]
            }
          }
        }
      ]
    }
  }
}