liqkit_ui
Inputs

Toggle Group

LiqToggleGroup is a row of buttons where any subset can be active at the same time — for example, a text-style toolbar where Bold, Italic, and Underline can each be on or off independently.

This is distinct from LiqSegmentedControl, which is mutually exclusive (exactly one segment is selected at a time). Reach for LiqToggleGroup when "none", "one", or "many" are all valid selection states; reach for LiqSegmentedControl when the choice is a strict either/or.

Pass selected (a Set<T>) for the currently active values. Whenever the user taps a segment, the widget hands you the new full set via onChanged — add the value if absent, remove it if present.

Text Style

// ignore_for_file: file_names // hyphenated name required by snippet manifest conventionimport 'package:docs_snippets/src/demo.dart';import 'package:docs_snippets/src/snippet_frame.dart';import 'package:flutter/material.dart' show Icons;import 'package:flutter/widgets.dart';import 'package:liqkit_ui/liqkit_ui.dart';/// Snippet builder consumed by `apps/docs_snippets/lib/src/routes.g.dart`.Widget toggleGroupTextStyleBuilder(BuildContext context) {  return SnippetFrame(    maxWidth: 240,    child: LiqDemo<Set<String>>(      initial: const <String>{'bold'},      builder: (sel, set) {        return LiqToggleGroup<String>(          selected: sel,          onChanged: set,          items: const <LiqToggleGroupItem<String>>[            LiqToggleGroupItem(value: 'bold', icon: Icons.format_bold),            LiqToggleGroupItem(value: 'italic', icon: Icons.format_italic),            LiqToggleGroupItem(              value: 'underline',              icon: Icons.format_underlined,            ),          ],        );      },    ),  );}

Labels

// ignore_for_file: file_names // hyphenated name required by snippet manifest conventionimport 'package:docs_snippets/src/demo.dart';import 'package:docs_snippets/src/snippet_frame.dart';import 'package:flutter/widgets.dart';import 'package:liqkit_ui/liqkit_ui.dart';/// Snippet builder consumed by `apps/docs_snippets/lib/src/routes.g.dart`.Widget toggleGroupLabelsBuilder(BuildContext context) {  return SnippetFrame(    maxWidth: 360,    child: LiqDemo<Set<String>>(      initial: const <String>{'mon', 'wed', 'fri'},      builder: (sel, set) {        return LiqToggleGroup<String>(          selected: sel,          onChanged: set,          items: const <LiqToggleGroupItem<String>>[            LiqToggleGroupItem(value: 'mon', label: 'Mon'),            LiqToggleGroupItem(value: 'tue', label: 'Tue'),            LiqToggleGroupItem(value: 'wed', label: 'Wed'),            LiqToggleGroupItem(value: 'thu', label: 'Thu'),            LiqToggleGroupItem(value: 'fri', label: 'Fri'),          ],        );      },    ),  );}

On this page