diff --git a/packages/material_ui/lib/src/filter_chip.dart b/packages/material_ui/lib/src/filter_chip.dart index f5e2514eeae6..205e2dc80449 100644 --- a/packages/material_ui/lib/src/filter_chip.dart +++ b/packages/material_ui/lib/src/filter_chip.dart @@ -24,6 +24,8 @@ import 'text_theme.dart'; import 'theme.dart'; import 'theme_data.dart'; +part 'generated/filter_chip_defaults_m3.g.dart'; + enum _ChipVariant { flat, elevated } /// A Material Design filter chip. @@ -299,134 +301,3 @@ class FilterChip extends StatelessWidget ); } } - -// BEGIN GENERATED TOKEN PROPERTIES - FilterChip - -// Do not edit by hand. The code between the "BEGIN GENERATED" and -// "END GENERATED" comments are generated from data in the Material -// Design token database by the script: -// dev/tools/gen_defaults/bin/gen_defaults.dart. - -// dart format off -class _FilterChipDefaultsM3 extends ChipThemeData { - _FilterChipDefaultsM3( - this.context, - this.isEnabled, - this.isSelected, - this._chipVariant, - ) : super( - shape: const RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(8.0))), - showCheckmark: true, - ); - - final BuildContext context; - final bool isEnabled; - final bool isSelected; - final _ChipVariant _chipVariant; - late final ColorScheme _colors = Theme.of(context).colorScheme; - late final TextTheme _textTheme = Theme.of(context).textTheme; - - @override - double? get elevation => _chipVariant == _ChipVariant.flat - ? 0.0 - : isEnabled ? 1.0 : 0.0; - - @override - double? get pressElevation => 1.0; - - @override - TextStyle? get labelStyle => _textTheme.labelLarge?.copyWith( - color: isEnabled - ? isSelected - ? _colors.onSecondaryContainer - : _colors.onSurfaceVariant - : _colors.onSurface, - ); - - @override - WidgetStateProperty? get color => - WidgetStateProperty.resolveWith((Set states) { - if (states.contains(WidgetState.selected) && states.contains(WidgetState.disabled)) { - return _chipVariant == _ChipVariant.flat - ? _colors.onSurface.withOpacity(0.12) - : _colors.onSurface.withOpacity(0.12); - } - if (states.contains(WidgetState.disabled)) { - return _chipVariant == _ChipVariant.flat - ? null - : _colors.onSurface.withOpacity(0.12); - } - if (states.contains(WidgetState.selected)) { - return _chipVariant == _ChipVariant.flat - ? _colors.secondaryContainer - : _colors.secondaryContainer; - } - return _chipVariant == _ChipVariant.flat - ? null - : _colors.surfaceContainerLow; - }); - - @override - Color? get shadowColor => _chipVariant == _ChipVariant.flat - ? Colors.transparent - : _colors.shadow; - - @override - Color? get surfaceTintColor => Colors.transparent; - - @override - Color? get checkmarkColor => isEnabled - ? isSelected - ? _colors.onSecondaryContainer - : _colors.primary - : _colors.onSurface; - - @override - Color? get deleteIconColor => isEnabled - ? isSelected - ? _colors.onSecondaryContainer - : _colors.onSurfaceVariant - : _colors.onSurface; - - @override - BorderSide? get side => _chipVariant == _ChipVariant.flat && !isSelected - ? isEnabled - ? BorderSide(color: _colors.outlineVariant) - : BorderSide(color: _colors.onSurface.withOpacity(0.12)) - : const BorderSide(color: Colors.transparent); - - @override - IconThemeData? get iconTheme => IconThemeData( - color: isEnabled - ? isSelected - ? _colors.onSecondaryContainer - : _colors.primary - : _colors.onSurface, - size: 18.0, - ); - - @override - EdgeInsetsGeometry? get padding => const EdgeInsets.all(8.0); - - /// The label padding of the chip scales with the font size specified in the - /// [labelStyle], and the system font size settings that scale font sizes - /// globally. - /// - /// The chip at effective font size 14.0 starts with 8px on each side and as - /// the font size scales up to closer to 28.0, the label padding is linearly - /// interpolated from 8px to 4px. Once the label has a font size of 2 or - /// higher, label padding remains 4px. - @override - EdgeInsetsGeometry? get labelPadding { - final double fontSize = labelStyle?.fontSize ?? 14.0; - final double fontSizeRatio = MediaQuery.textScalerOf(context).scale(fontSize) / 14.0; - return EdgeInsets.lerp( - const EdgeInsets.symmetric(horizontal: 8.0), - const EdgeInsets.symmetric(horizontal: 4.0), - clampDouble(fontSizeRatio - 1.0, 0.0, 1.0), - )!; - } -} -// dart format on - -// END GENERATED TOKEN PROPERTIES - FilterChip diff --git a/packages/material_ui/tool/gen_defaults/temporarily_excluded/generated/filter_chip_defaults.g.dart b/packages/material_ui/lib/src/generated/filter_chip_defaults_m3.g.dart similarity index 94% rename from packages/material_ui/tool/gen_defaults/temporarily_excluded/generated/filter_chip_defaults.g.dart rename to packages/material_ui/lib/src/generated/filter_chip_defaults_m3.g.dart index 3cab87ee8ab9..cacccfc894fa 100644 --- a/packages/material_ui/tool/gen_defaults/temporarily_excluded/generated/filter_chip_defaults.g.dart +++ b/packages/material_ui/lib/src/generated/filter_chip_defaults_m3.g.dart @@ -2,6 +2,11 @@ // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. +// Do not edit by hand. The code is generated from data in the Material +// Design token database by the script: +// packages/material_ui/tool/gen_defaults/bin/gen_defaults.dart. +part of '../filter_chip.dart'; + class _FilterChipDefaultsM3 extends ChipThemeData { _FilterChipDefaultsM3(this.context, this.isEnabled, this.isSelected, this._chipVariant) : super( diff --git a/packages/material_ui/tool/gen_defaults/bin/gen_defaults.dart b/packages/material_ui/tool/gen_defaults/bin/gen_defaults.dart index 849621e5b575..84ad958c2a74 100644 --- a/packages/material_ui/tool/gen_defaults/bin/gen_defaults.dart +++ b/packages/material_ui/tool/gen_defaults/bin/gen_defaults.dart @@ -30,7 +30,8 @@ import '../templates/card_template.dart'; // import '../templates/drawer_template.dart'; // import '../templates/expansion_tile_template.dart'; // import '../templates/fab_template.dart'; -// import '../templates/filter_chip_template.dart'; +import '../templates/filter_chip_template.dart'; + // import '../templates/icon_button_template.dart'; // import '../templates/input_chip_template.dart'; // import '../templates/input_decorator_template.dart'; @@ -87,7 +88,7 @@ Future main(List args) async { // const DrawerTemplateM3().generateFile(verbose: verbose); // const ExpansionTileTemplateM3().generateFile(verbose: verbose); // const FabTemplateM3().generateFile(verbose: verbose); - // const FilterChipTemplateM3().generateFile(verbose: verbose); + const FilterChipTemplateM3().generateFile(verbose: verbose); // const IconButtonTemplateM3().generateFile(verbose: verbose); // const InputChipTemplateM3().generateFile(verbose: verbose); // const InputDecoratorTemplateM3().generateFile(verbose: verbose); diff --git a/packages/material_ui/tool/gen_defaults/templates/filter_chip_template.dart b/packages/material_ui/tool/gen_defaults/templates/filter_chip_template.dart new file mode 100644 index 000000000000..5b8bb4913c63 --- /dev/null +++ b/packages/material_ui/tool/gen_defaults/templates/filter_chip_template.dart @@ -0,0 +1,140 @@ +// Copyright 2013 The Flutter Authors +// Use of this source code is governed by a BSD-style license that can be +// found in the LICENSE file. + +import '../data/filter_chip.dart'; +import 'template.dart'; + +class FilterChipTemplateM3 extends TokenTemplateM3 { + const FilterChipTemplateM3(); + + @override + String get name => 'Filter Chip'; + + @override + String get parentFilePath => 'filter_chip.dart'; + + @override + String generateContents(String className) => + ''' +class $className extends ChipThemeData { + $className( + this.context, + this.isEnabled, + this.isSelected, + this._chipVariant, + ) : super( + shape: ${shape(TokenFilterChip.containerShape)}, + showCheckmark: true, + ); + + final BuildContext context; + final bool isEnabled; + final bool isSelected; + final _ChipVariant _chipVariant; + late final ColorScheme _colors = Theme.of(context).colorScheme; + late final TextTheme _textTheme = Theme.of(context).textTheme; + + @override + double? get elevation => _chipVariant == _ChipVariant.flat + ? ${TokenFilterChip.flatContainerElevation} + : isEnabled ? ${TokenFilterChip.elevatedContainerElevation} : ${TokenFilterChip.elevatedDisabledContainerElevation}; + + @override + double? get pressElevation => ${TokenFilterChip.elevatedPressedContainerElevation}; + + @override + TextStyle? get labelStyle => ${textStyle(TokenFilterChip.labelTextType, '_textTheme')}?.copyWith( + color: isEnabled + ? isSelected + ? ${color(TokenFilterChip.selectedLabelTextColor)} + : ${color(TokenFilterChip.unselectedLabelTextColor)} + : ${color(TokenFilterChip.disabledLabelTextColor)}, + ); + + @override + WidgetStateProperty? get color => + WidgetStateProperty.resolveWith((Set states) { + if (states.contains(WidgetState.selected) && states.contains(WidgetState.disabled)) { + return _chipVariant == _ChipVariant.flat + ? ${colorWithOpacity(TokenFilterChip.flatDisabledSelectedContainerColor, TokenFilterChip.flatDisabledSelectedContainerOpacity)} + : ${colorWithOpacity(TokenFilterChip.elevatedDisabledContainerColor, TokenFilterChip.elevatedDisabledContainerOpacity)}; + } + if (states.contains(WidgetState.disabled)) { + return _chipVariant == _ChipVariant.flat + ? null + : ${colorWithOpacity(TokenFilterChip.elevatedDisabledContainerColor, TokenFilterChip.elevatedDisabledContainerOpacity)}; + } + if (states.contains(WidgetState.selected)) { + return _chipVariant == _ChipVariant.flat + ? ${color(TokenFilterChip.flatSelectedContainerColor)} + : ${color(TokenFilterChip.elevatedSelectedContainerColor)}; + } + return _chipVariant == _ChipVariant.flat + ? null + : ${color(TokenFilterChip.elevatedUnselectedContainerColor)}; + }); + + @override + Color? get shadowColor => _chipVariant == _ChipVariant.flat + ? Colors.transparent + : ${color(TokenFilterChip.elevatedContainerShadowColor)}; + + @override + Color? get surfaceTintColor => Colors.transparent; + + @override + Color? get checkmarkColor => isEnabled + ? isSelected + ? ${color(TokenFilterChip.withLeadingIconSelectedLeadingIconColor)} + : ${color(TokenFilterChip.withLeadingIconUnselectedLeadingIconColor)} + : ${color(TokenFilterChip.withLeadingIconDisabledLeadingIconColor)}; + + @override + Color? get deleteIconColor => isEnabled + ? isSelected + ? ${color(TokenFilterChip.withTrailingIconSelectedTrailingIconColor)} + : ${color(TokenFilterChip.withTrailingIconUnselectedTrailingIconColor)} + : ${color(TokenFilterChip.withTrailingIconDisabledTrailingIconColor)}; + + @override + BorderSide? get side => _chipVariant == _ChipVariant.flat && !isSelected + ? isEnabled + ? ${border(color(TokenFilterChip.flatUnselectedOutlineColor), width: TokenFilterChip.flatUnselectedOutlineWidth)} + : ${border(colorWithOpacity(TokenFilterChip.flatDisabledUnselectedOutlineColor, TokenFilterChip.flatDisabledUnselectedOutlineOpacity))} + : const BorderSide(color: Colors.transparent); + + @override + IconThemeData? get iconTheme => IconThemeData( + color: isEnabled + ? isSelected + ? ${color(TokenFilterChip.withLeadingIconSelectedLeadingIconColor)} + : ${color(TokenFilterChip.withLeadingIconUnselectedLeadingIconColor)} + : ${color(TokenFilterChip.withLeadingIconDisabledLeadingIconColor)}, + size: ${TokenFilterChip.withIconIconSize}, + ); + + @override + EdgeInsetsGeometry? get padding => const EdgeInsets.all(8.0); + + /// The label padding of the chip scales with the font size specified in the + /// [labelStyle], and the system font size settings that scale font sizes + /// globally. + /// + /// The chip at effective font size 14.0 starts with 8px on each side and as + /// the font size scales up to closer to 28.0, the label padding is linearly + /// interpolated from 8px to 4px. Once the label has a font size of 2 or + /// higher, label padding remains 4px. + @override + EdgeInsetsGeometry? get labelPadding { + final double fontSize = labelStyle?.fontSize ?? 14.0; + final double fontSizeRatio = MediaQuery.textScalerOf(context).scale(fontSize) / 14.0; + return EdgeInsets.lerp( + const EdgeInsets.symmetric(horizontal: 8.0), + const EdgeInsets.symmetric(horizontal: 4.0), + clampDouble(fontSizeRatio - 1.0, 0.0, 1.0), + )!; + } +} +'''; +} diff --git a/packages/material_ui/tool/gen_defaults/temporarily_excluded/templates/filter_chip_template.dart b/packages/material_ui/tool/gen_defaults/temporarily_excluded/templates/filter_chip_template.dart deleted file mode 100644 index 4325d5a8dd8c..000000000000 --- a/packages/material_ui/tool/gen_defaults/temporarily_excluded/templates/filter_chip_template.dart +++ /dev/null @@ -1,143 +0,0 @@ -// Copyright 2013 The Flutter Authors -// Use of this source code is governed by a BSD-style license that can be -// found in the LICENSE file. - -import 'template.dart'; - -class FilterChipTemplate extends TokenTemplate { - const FilterChipTemplate( - super.blockName, - super.fileName, - super.tokens, { - super.colorSchemePrefix = '_colors.', - super.textThemePrefix = '_textTheme.', - }); - - static const String tokenGroup = 'md.comp.filter-chip'; - static const String flatVariant = '.flat'; - static const String elevatedVariant = '.elevated'; - - @override - String generate() => - ''' -class _${blockName}DefaultsM3 extends ChipThemeData { - _${blockName}DefaultsM3( - this.context, - this.isEnabled, - this.isSelected, - this._chipVariant, - ) : super( - shape: ${shape("$tokenGroup.container")}, - showCheckmark: true, - ); - - final BuildContext context; - final bool isEnabled; - final bool isSelected; - final _ChipVariant _chipVariant; - late final ColorScheme _colors = Theme.of(context).colorScheme; - late final TextTheme _textTheme = Theme.of(context).textTheme; - - @override - double? get elevation => _chipVariant == _ChipVariant.flat - ? ${elevation("$tokenGroup$flatVariant.container")} - : isEnabled ? ${elevation("$tokenGroup$elevatedVariant.container")} : ${elevation("$tokenGroup$elevatedVariant.disabled.container")}; - - @override - double? get pressElevation => ${elevation("$tokenGroup$elevatedVariant.pressed.container")}; - - @override - TextStyle? get labelStyle => ${textStyle("$tokenGroup.label-text")}?.copyWith( - color: isEnabled - ? isSelected - ? ${color("$tokenGroup.selected.label-text.color")} - : ${color("$tokenGroup.unselected.label-text.color")} - : ${color("$tokenGroup.disabled.label-text.color")}, - ); - - @override - WidgetStateProperty? get color => - WidgetStateProperty.resolveWith((Set states) { - if (states.contains(WidgetState.selected) && states.contains(WidgetState.disabled)) { - return _chipVariant == _ChipVariant.flat - ? ${componentColor("$tokenGroup$flatVariant.disabled.selected.container")} - : ${componentColor("$tokenGroup$elevatedVariant.disabled.container")}; - } - if (states.contains(WidgetState.disabled)) { - return _chipVariant == _ChipVariant.flat - ? ${componentColor("$tokenGroup$flatVariant.disabled.unselected.container")} - : ${componentColor("$tokenGroup$elevatedVariant.disabled.container")}; - } - if (states.contains(WidgetState.selected)) { - return _chipVariant == _ChipVariant.flat - ? ${componentColor("$tokenGroup$flatVariant.selected.container")} - : ${componentColor("$tokenGroup$elevatedVariant.selected.container")}; - } - return _chipVariant == _ChipVariant.flat - ? ${componentColor("$tokenGroup$flatVariant.container")} - : ${componentColor("$tokenGroup$elevatedVariant.unselected.container")}; - }); - - @override - Color? get shadowColor => _chipVariant == _ChipVariant.flat - ? ${colorOrTransparent("$tokenGroup$flatVariant.container.shadow-color")} - : ${colorOrTransparent("$tokenGroup$elevatedVariant.container.shadow-color")}; - - @override - Color? get surfaceTintColor => ${colorOrTransparent("$tokenGroup.container.surface-tint-layer.color")}; - - @override - Color? get checkmarkColor => isEnabled - ? isSelected - ? ${color("$tokenGroup.with-leading-icon.selected.leading-icon.color")} - : ${color("$tokenGroup.with-leading-icon.unselected.leading-icon.color")} - : ${color("$tokenGroup.with-leading-icon.disabled.leading-icon.color")}; - - @override - Color? get deleteIconColor => isEnabled - ? isSelected - ? ${color("$tokenGroup.with-trailing-icon.selected.trailing-icon.color")} - : ${color("$tokenGroup.with-trailing-icon.unselected.trailing-icon.color")} - : ${color("$tokenGroup.with-trailing-icon.disabled.trailing-icon.color")}; - - @override - BorderSide? get side => _chipVariant == _ChipVariant.flat && !isSelected - ? isEnabled - ? ${border('$tokenGroup$flatVariant.unselected.outline')} - : ${border('$tokenGroup$flatVariant.disabled.unselected.outline')} - : const BorderSide(color: Colors.transparent); - - @override - IconThemeData? get iconTheme => IconThemeData( - color: isEnabled - ? isSelected - ? ${color("$tokenGroup.with-leading-icon.selected.leading-icon.color")} - : ${color("$tokenGroup.with-leading-icon.unselected.leading-icon.color")} - : ${color("$tokenGroup.with-leading-icon.disabled.leading-icon.color")}, - size: ${getToken("$tokenGroup.with-icon.icon.size")}, - ); - - @override - EdgeInsetsGeometry? get padding => const EdgeInsets.all(8.0); - - /// The label padding of the chip scales with the font size specified in the - /// [labelStyle], and the system font size settings that scale font sizes - /// globally. - /// - /// The chip at effective font size 14.0 starts with 8px on each side and as - /// the font size scales up to closer to 28.0, the label padding is linearly - /// interpolated from 8px to 4px. Once the label has a font size of 2 or - /// higher, label padding remains 4px. - @override - EdgeInsetsGeometry? get labelPadding { - final double fontSize = labelStyle?.fontSize ?? 14.0; - final double fontSizeRatio = MediaQuery.textScalerOf(context).scale(fontSize) / 14.0; - return EdgeInsets.lerp( - const EdgeInsets.symmetric(horizontal: 8.0), - const EdgeInsets.symmetric(horizontal: 4.0), - clampDouble(fontSizeRatio - 1.0, 0.0, 1.0), - )!; - } -} -'''; -} diff --git a/packages/material_ui/tool/gen_defaults/test/gen_defaults_test.dart b/packages/material_ui/tool/gen_defaults/test/gen_defaults_test.dart index 8ff0ad0ebdc2..1ad5e88a3b5b 100644 --- a/packages/material_ui/tool/gen_defaults/test/gen_defaults_test.dart +++ b/packages/material_ui/tool/gen_defaults/test/gen_defaults_test.dart @@ -26,7 +26,7 @@ import '../templates/card_template.dart'; // import '../templates/drawer_template.dart'; // import '../templates/expansion_tile_template.dart'; // import '../templates/fab_template.dart'; -// import '../templates/filter_chip_template.dart'; +import '../templates/filter_chip_template.dart'; // import '../templates/icon_button_template.dart'; // import '../templates/input_chip_template.dart'; // import '../templates/input_decorator_template.dart'; @@ -515,8 +515,11 @@ void main() { }); test('FilterChipTemplateM3 emits M3 FilterChip defaults from tokens', () { - // Intentionally empty, will be implemented during migration. See: - // https://github.com/flutter/flutter/issues/187899 + final String contents = _generateContents(const FilterChipTemplateM3()); + expect(contents, contains('class _FilterChipDefaultsM3 extends ChipThemeData')); + expect(contents, contains('_colors.onSurface.withOpacity(0.12)')); + expect(contents, contains('_colors.surfaceContainerLow')); + expect(contents, contains('BorderSide(color: _colors.outlineVariant)')); }); test('IconButtonTemplateM3 emits M3 IconButton defaults from tokens', () {