The avatar for @statistikzh
Statistical Office of the Canton of Zurich
Public
Leu - Component Library
Edited
Jul 16, 2024
Insert cell
Insert cell
Insert cell
{
import(`https://esm.sh/@statistikzh/leu@${version}/leu-checkbox-group.js`);
import(`https://esm.sh/@statistikzh/leu@${version}/leu-checkbox.js`);
}
Insert cell
Insert cell
viewof checkboxes = htl.html`<leu-checkbox-group label="Choose one or more options" orientation="${orientation}">
<leu-checkbox value="1" checked>Option 1</leu-checkbox>
<leu-checkbox value="2">Option 2</leu-checkbox>
<leu-checkbox value="3">Option 3</leu-checkbox>
</leu-checkbox-group>`
Insert cell
Insert cell
checkboxes
Insert cell
The orientation of the alignment can be definend with the `orientation` attribute.

```html
<leu-checkbox-group orientation="${orientation}">
```
Insert cell
viewof orientation = Inputs.select(["vertical", "horizontal"])
Insert cell
Insert cell
fonts
Insert cell
theme
Insert cell
import { fonts, theme, version } from "@statistikzh/leu-general"
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more