Skip to content

<mosaica-cluster-filter>

A search box that filters the map by a layer's clusters.

Use <mosaica-cluster-filter> when you want to search a layer's clusters without the field card around it. Set layer to a layer meta.layers lists.

With the box empty, the list offers the layer's top-level clusters, largest first. Typing searches the cluster names at every level. In the list, the arrow keys move between rows, Enter chooses one, and Escape closes the list.

Each row counts the items the filters match in that cluster without applying this layer's own filter, so a cluster the viewer has filtered out still shows its count. Choosing a row filters the map to the cluster's members, and choosing it again removes that filter.

import '@mosaicajs/components/cluster-filter';

Attributes

Attribute Property Type Default Description
layer layer string '' The layer whose clusters are offered, a name meta.layers lists. Unset or unknown, the box shows nothing.
placeholder placeholder string '' Placeholder text for the box, in place of the default.
viewer-url viewerUrl string '' The base URL of the Mosaica viewer server, for the store the element builds: a full URL such as https://maps.example.org, or a path such as /mosaica. Unset, the page's own origin. Read only by the map, the explorer and <mosaica-store>. Changing it builds a new store.
token token string '' A viewer token for the store the element builds. Without token or authorise, only an open server (serve.open) answers. Read only by the map, the explorer and <mosaica-store>. Changing it builds a new store.
artifacts-per-tile artifactsPerTile number | null null The most artifacts one level of a layer shows per map tile, for the store the element builds. Unset, 50, or the server's selection.max_artifacts_per_tile if lower. A value above that maximum is refused. Read only by the map, the explorer and <mosaica-store>. Changing it builds a new store.

Properties

Set as JavaScript properties; they have no attribute.

Property Type Default Description
choose ((cluster: {id: string; name: string | null; path: string; rung: number}) => void) | null null Turns the box into a cluster picker. Choosing a row calls this with the cluster's mosaica_id (as a decimal string), its name, its parents' names as the list shows them, and its level (rung), then empties the box. No filter changes.
store Store | null null The store to use, ahead of one from context or one the element would build. The element never disposes it.
authorise TokenSupplier | null null A function that returns a viewer token, used instead of token and called again before the token expires. A different function builds a new store, so keep it stable across renders. Set it together with viewer-url: a store built from viewer-url alone first sends a request with no token, and is replaced when authorise arrives.
activeStore Store | null read-only The store this element is using, or null if it has none.
source StoreSource read-only Where activeStore came from.

Methods

Method Returns Description
focus(options?: FocusOptions) void Moves focus to the search box.
dispose() void Dispose of the store this element built. Removing the element from the page does not, so call this when you are done with the element. A store you passed in is left to you.

Events

Each bubbles and is composed. Events gives each detail.

Event Fired when
mosaica-clausechange Choosing a row added or removed a member_of clause.

Parts

Styled from outside the element with ::part().

Part Description
entry The search box.
values The list, while it is open.
option One cluster in the list, with data-id and aria-selected while its clause is on.
name A row's name, with data-unnamed if the cluster has none.
path A row's path of parents' names.
value-count A row's exact count.
more The note under the box when nothing matches, or when more match than are listed.
refusal The words "Clusters unavailable", with data-code, if the list was refused.

CSS custom properties

The theme tokens apply to this element.