FilterChip

import { FilterChip } from "@material";
export component Example inherits Window {
    width: 200px;
    height: 100px;
    background: transparent;
    FilterChip {
        text: "Filter";
        icon: @image-url("../icons/filter.svg");
        width: 100px;
        height: 32px;
    }
}

slint

A FilterChip is a chip that can be toggled on and off to filter content. When selected, it displays a checkmark icon and changes its appearance to indicate the active state.

Properties

checked

bool (in-out) default: false

Whether the filter chip is in the checked (active) state.

enabled

bool default: true

Whether the chip is enabled and can be interacted with.

has-focus

bool default: false

Whether the component has focus.

icon

image default: the empty image

An optional icon displayed on the chip.

text

string default: ""

The text label displayed on the chip.

string default: ""

A tooltip text that appears when hovering over the chip.

Callbacks

clicked()

Invoked when the chip is clicked.

Functions

clear-focus()

Clears the focus from the component.

focus()

Focuses the component.

toggle()

Toggles the filter chip state between checked and unchecked.