Skip to content

Commit 91c7c42

Browse files
docs(readme): document icons-inside layout option
1 parent 46ed45d commit 91c7c42

1 file changed

Lines changed: 9 additions & 0 deletions

File tree

README.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ A toggle button component for Vaadin Flow that supports customizable labels and
1414
* Customizable left and right labels
1515
* Support for icons on both sides via slots
1616
* Optional label highlighting: active-side label uses the primary color, inactive side is dimmed
17+
* Optional icons-inside layout: icons adjacent to the switch, labels on the outer edges
1718
* Theme variants: `SMALL`, `MEDIUM`, `LARGE`, `LONGSWIPE`, `PRIMARY`, `SUCCESS`, `WARNING`, `ERROR`, `CONTRAST`
1819
* `LONGSWIPE` variant produces a wider switch track, optimized for touch interaction; can be combined with size variants
1920
* Fluent API for easy configuration
@@ -129,6 +130,14 @@ FCToggleButton toggle = new FCToggleButton()
129130
.setRightLabel("On")
130131
.withHighlightLabel();
131132

133+
// Icons inside: [label] [icon] [switch] [icon] [label] (default is [icon] [label] [switch] [label] [icon])
134+
FCToggleButton toggle = new FCToggleButton()
135+
.setLeftIcon(new Icon(VaadinIcon.MOON))
136+
.setLeftLabel("Dark")
137+
.setRightLabel("Light")
138+
.setRightIcon(new Icon(VaadinIcon.SUN_O))
139+
.withIconsInside();
140+
132141
// Apply theme variants
133142
toggle.addThemeVariants(FCToggleButtonVariant.PRIMARY);
134143
toggle.addThemeVariants(FCToggleButtonVariant.CONTRAST);

0 commit comments

Comments
 (0)