diff --git a/packages/material_ui/tool/gen_defaults/temporarily_excluded/generated/input_chip_defaults.g.dart b/packages/material_ui/lib/src/generated/input_chip_defaults_m3.g.dart similarity index 93% rename from packages/material_ui/tool/gen_defaults/temporarily_excluded/generated/input_chip_defaults.g.dart rename to packages/material_ui/lib/src/generated/input_chip_defaults_m3.g.dart index 03ecd1017e8c..40520e6c4091 100644 --- a/packages/material_ui/tool/gen_defaults/temporarily_excluded/generated/input_chip_defaults.g.dart +++ b/packages/material_ui/lib/src/generated/input_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 '../input_chip.dart'; + class _InputChipDefaultsM3 extends ChipThemeData { _InputChipDefaultsM3(this.context, this.isEnabled, this.isSelected) : super( diff --git a/packages/material_ui/lib/src/input_chip.dart b/packages/material_ui/lib/src/input_chip.dart index b92763de1d93..8537ecbf1a22 100644 --- a/packages/material_ui/lib/src/input_chip.dart +++ b/packages/material_ui/lib/src/input_chip.dart @@ -22,6 +22,8 @@ import 'text_theme.dart'; import 'theme.dart'; import 'theme_data.dart'; +part 'generated/input_chip_defaults_m3.g.dart'; + /// A Material Design input chip. /// /// Input chips represent a complex piece of information, such as an entity @@ -275,112 +277,3 @@ class InputChip extends StatelessWidget ); } } - -// BEGIN GENERATED TOKEN PROPERTIES - InputChip - -// 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 _InputChipDefaultsM3 extends ChipThemeData { - _InputChipDefaultsM3(this.context, this.isEnabled, this.isSelected) - : super( - elevation: 0.0, - shape: const RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(8.0))), - showCheckmark: true, - ); - - final BuildContext context; - final bool isEnabled; - final bool isSelected; - late final ColorScheme _colors = Theme.of(context).colorScheme; - late final TextTheme _textTheme = Theme.of(context).textTheme; - - @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 _colors.onSurface.withOpacity(0.12); - } - if (states.contains(WidgetState.disabled)) { - return null; - } - if (states.contains(WidgetState.selected)) { - return _colors.secondaryContainer; - } - return null; - }); - - @override - Color? get shadowColor => Colors.transparent; - - @override - Color? get surfaceTintColor => Colors.transparent; - - @override - Color? get checkmarkColor => isEnabled - ? isSelected - ? _colors.primary - : _colors.onSurfaceVariant - : _colors.onSurface; - - @override - Color? get deleteIconColor => isEnabled - ? isSelected - ? _colors.onSecondaryContainer - : _colors.onSurfaceVariant - : _colors.onSurface; - - @override - BorderSide? get side => !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.primary - : _colors.onSurfaceVariant - : _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 - InputChip 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..b5e16a21b559 100644 --- a/packages/material_ui/tool/gen_defaults/bin/gen_defaults.dart +++ b/packages/material_ui/tool/gen_defaults/bin/gen_defaults.dart @@ -32,7 +32,8 @@ import '../templates/card_template.dart'; // import '../templates/fab_template.dart'; // import '../templates/filter_chip_template.dart'; // import '../templates/icon_button_template.dart'; -// import '../templates/input_chip_template.dart'; +import '../templates/input_chip_template.dart'; + // import '../templates/input_decorator_template.dart'; // import '../templates/list_tile_template.dart'; // import '../templates/menu_template.dart'; @@ -89,7 +90,7 @@ Future main(List args) async { // const FabTemplateM3().generateFile(verbose: verbose); // const FilterChipTemplateM3().generateFile(verbose: verbose); // const IconButtonTemplateM3().generateFile(verbose: verbose); - // const InputChipTemplateM3().generateFile(verbose: verbose); + const InputChipTemplateM3().generateFile(verbose: verbose); // const InputDecoratorTemplateM3().generateFile(verbose: verbose); // const ListTileTemplateM3().generateFile(verbose: verbose); // const MenuTemplateM3().generateFile(verbose: verbose); diff --git a/packages/material_ui/tool/gen_defaults/templates/input_chip_template.dart b/packages/material_ui/tool/gen_defaults/templates/input_chip_template.dart new file mode 100644 index 000000000000..ab6b4096686a --- /dev/null +++ b/packages/material_ui/tool/gen_defaults/templates/input_chip_template.dart @@ -0,0 +1,122 @@ +// 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/input_chip.dart'; +import 'template.dart'; + +class InputChipTemplateM3 extends TokenTemplateM3 { + const InputChipTemplateM3(); + + @override + String get name => 'Input Chip'; + + @override + String get parentFilePath => 'input_chip.dart'; + + // TODO(QuncCccccc): Replace these values if padding tokens become available. + static const double _defaultPadding = 8.0; + static const double _minimumLabelPadding = 4.0; + + @override + String generateContents(String className) => + ''' +class $className extends ChipThemeData { + $className(this.context, this.isEnabled, this.isSelected) + : super( + elevation: ${TokenInputChip.containerElevation}, + shape: ${shape(TokenInputChip.containerShape)}, + showCheckmark: true, + ); + + final BuildContext context; + final bool isEnabled; + final bool isSelected; + late final ColorScheme _colors = Theme.of(context).colorScheme; + late final TextTheme _textTheme = Theme.of(context).textTheme; + + @override + TextStyle? get labelStyle => ${textStyle(TokenInputChip.labelTextType, '_textTheme')}?.copyWith( + color: isEnabled + ? isSelected + ? ${color(TokenInputChip.selectedLabelTextColor)} + : ${color(TokenInputChip.unselectedLabelTextColor)} + : ${color(TokenInputChip.disabledLabelTextColor)}, + ); + + @override + WidgetStateProperty? get color => + WidgetStateProperty.resolveWith((Set states) { + if (states.contains(WidgetState.selected) && states.contains(WidgetState.disabled)) { + return ${colorWithOpacity(TokenInputChip.disabledSelectedContainerColor, TokenInputChip.disabledSelectedContainerOpacity)}; + } + if (states.contains(WidgetState.disabled)) { + return null; + } + if (states.contains(WidgetState.selected)) { + return ${color(TokenInputChip.selectedContainerColor)}; + } + return null; + }); + + @override + Color? get shadowColor => Colors.transparent; + + @override + Color? get surfaceTintColor => Colors.transparent; + + @override + Color? get checkmarkColor => isEnabled + ? isSelected + ? ${color(TokenInputChip.withLeadingIconSelectedLeadingIconColor)} + : ${color(TokenInputChip.withLeadingIconUnselectedLeadingIconColor)} + : ${color(TokenInputChip.withLeadingIconDisabledLeadingIconColor)}; + + @override + Color? get deleteIconColor => isEnabled + ? isSelected + ? ${color(TokenInputChip.withTrailingIconSelectedTrailingIconColor)} + : ${color(TokenInputChip.withTrailingIconUnselectedTrailingIconColor)} + : ${color(TokenInputChip.withTrailingIconDisabledTrailingIconColor)}; + + @override + BorderSide? get side => !isSelected + ? isEnabled + ? ${border(color(TokenInputChip.unselectedOutlineColor), width: TokenInputChip.unselectedOutlineWidth)} + : ${border(colorWithOpacity(TokenInputChip.disabledUnselectedOutlineColor, TokenInputChip.disabledUnselectedOutlineOpacity))} + : const BorderSide(color: Colors.transparent); + + @override + IconThemeData? get iconTheme => IconThemeData( + color: isEnabled + ? isSelected + ? ${color(TokenInputChip.withLeadingIconSelectedLeadingIconColor)} + : ${color(TokenInputChip.withLeadingIconUnselectedLeadingIconColor)} + : ${color(TokenInputChip.withLeadingIconDisabledLeadingIconColor)}, + size: ${TokenInputChip.withLeadingIconLeadingIconSize}, + ); + + @override + EdgeInsetsGeometry? get padding => const EdgeInsets.all(${number(_defaultPadding)}); + + /// 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 ?? ${number(TokenInputChip.labelTextType.fontSize)}; + final double fontSizeRatio = MediaQuery.textScalerOf(context).scale(fontSize) / ${number(TokenInputChip.labelTextType.fontSize)}; + return EdgeInsets.lerp( + const EdgeInsets.symmetric(horizontal: ${number(_defaultPadding)}), + const EdgeInsets.symmetric(horizontal: ${number(_minimumLabelPadding)}), + clampDouble(fontSizeRatio - 1.0, 0.0, 1.0), + )!; + } +} +'''; +} diff --git a/packages/material_ui/tool/gen_defaults/temporarily_excluded/templates/input_chip_template.dart b/packages/material_ui/tool/gen_defaults/temporarily_excluded/templates/input_chip_template.dart deleted file mode 100644 index 4ed345ddb198..000000000000 --- a/packages/material_ui/tool/gen_defaults/temporarily_excluded/templates/input_chip_template.dart +++ /dev/null @@ -1,120 +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 InputChipTemplate extends TokenTemplate { - const InputChipTemplate( - super.blockName, - super.fileName, - super.tokens, { - super.colorSchemePrefix = '_colors.', - super.textThemePrefix = '_textTheme.', - }); - - static const String tokenGroup = 'md.comp.input-chip'; - static const String variant = ''; - - @override - String generate() => - ''' -class _${blockName}DefaultsM3 extends ChipThemeData { - _${blockName}DefaultsM3(this.context, this.isEnabled, this.isSelected) - : super( - elevation: ${elevation("$tokenGroup$variant.container")}, - shape: ${shape("$tokenGroup.container")}, - showCheckmark: true, - ); - - final BuildContext context; - final bool isEnabled; - final bool isSelected; - late final ColorScheme _colors = Theme.of(context).colorScheme; - late final TextTheme _textTheme = Theme.of(context).textTheme; - - @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 ${componentColor("$tokenGroup$variant.disabled.selected.container")}; - } - if (states.contains(WidgetState.disabled)) { - return ${componentColor("$tokenGroup$variant.disabled.container")}; - } - if (states.contains(WidgetState.selected)) { - return ${componentColor("$tokenGroup$variant.selected.container")}; - } - return ${componentColor("$tokenGroup$variant.container")}; - }); - - @override - Color? get shadowColor => ${colorOrTransparent("$tokenGroup.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 => !isSelected - ? isEnabled - ? ${border('$tokenGroup$variant.unselected.outline')} - : ${border('$tokenGroup$variant.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-leading-icon.leading-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 f9185c0b5ef8..218ec1521942 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 @@ -28,7 +28,7 @@ import '../templates/card_template.dart'; // import '../templates/fab_template.dart'; // import '../templates/filter_chip_template.dart'; // import '../templates/icon_button_template.dart'; -// import '../templates/input_chip_template.dart'; +import '../templates/input_chip_template.dart'; // import '../templates/input_decorator_template.dart'; // import '../templates/list_tile_template.dart'; // import '../templates/menu_template.dart'; @@ -524,8 +524,11 @@ void main() { }); test('InputChipTemplateM3 emits M3 InputChip defaults from tokens', () { - // Intentionally empty, will be implemented during migration. See: - // https://github.com/flutter/flutter/issues/187899 + final String contents = _generateContents(const InputChipTemplateM3()); + expect(contents, contains('class _InputChipDefaultsM3 extends ChipThemeData')); + expect(contents, contains('_colors.onSurface.withOpacity(0.12)')); + expect(contents, contains('return _colors.secondaryContainer')); + expect(contents, contains('BorderSide(color: _colors.outlineVariant)')); }); test('InputDecoratorTemplateM3 emits M3 InputDecorator defaults from tokens', () {