🐤 Canary

Appearance

Filtering ​

If your documentation grows to a certain size, or you have multiple sources (e.g., a webpage, GitHub, etc.), you'll need to filter the results.

Currently we have two built-in components for filtering.

canary-filter-tabs-glob ​

reference

All providers support this type of filtering.

html
<canary-search slot="mode">
  <canary-filter-tabs-glob slot="head" tabs='[{"name":"Docs","pattern":"getcanary.dev/**"},{"name":"Github","pattern":"github.com/**"}]'> </canary-filter-tabs-glob>
  <canary-search-results slot="body"></canary-search-results>
</canary-search>

canary-filter-tags ​

reference

Two providers support this type of filtering.

  • canary-provider-cloud
    • tags should be defined in our dashboard.
  • canary-provider-pagefind
    • data-pagefind-meta="tag" should be available. Read more about it here.
html
<canary-content>
  <canary-input slot="input"></canary-input>
  <canary-search slot="mode">
    <canary-filter-tags slot="head" tags='"Local,Cloud"'></canary-filter-tags>
    <canary-search-results slot="body"></canary-search-results>
  </canary-search>
</canary-content>