Unverified Commit 99961267 authored by Eilidh Southren's avatar Eilidh Southren Committed by GitHub

Add proper disabled values for input chips (#120192)

* add proper disabled values for input chips

* added test
parent cd380633
......@@ -13,7 +13,7 @@ class InputChipTemplate extends TokenTemplate {
@override
String generate() => '''
class _${blockName}DefaultsM3 extends ChipThemeData {
const _${blockName}DefaultsM3(this.context, this.isEnabled)
const _${blockName}DefaultsM3(this.context, this.isEnabled, this.isSelected)
: super(
elevation: ${elevation("$tokenGroup$variant.container")},
shape: ${shape("$tokenGroup.container")},
......@@ -22,6 +22,7 @@ class _${blockName}DefaultsM3 extends ChipThemeData {
final BuildContext context;
final bool isEnabled;
final bool isSelected;
@override
TextStyle? get labelStyle => ${textStyle("$tokenGroup.label-text")};
......@@ -36,7 +37,9 @@ class _${blockName}DefaultsM3 extends ChipThemeData {
Color? get surfaceTintColor => ${colorOrTransparent("$tokenGroup.container.surface-tint-layer.color")};
@override
Color? get selectedColor => ${componentColor("$tokenGroup$variant.selected.container")};
Color? get selectedColor => isEnabled
? ${componentColor("$tokenGroup$variant.selected.container")}
: ${componentColor("$tokenGroup$variant.disabled.selected.container")};
@override
Color? get checkmarkColor => ${color("$tokenGroup.with-icon.selected.icon.color")};
......@@ -48,9 +51,11 @@ class _${blockName}DefaultsM3 extends ChipThemeData {
Color? get deleteIconColor => ${color("$tokenGroup.with-trailing-icon.selected.trailing-icon.color")};
@override
BorderSide? get side => isEnabled
? ${border('$tokenGroup$variant.unselected.outline')}
: ${border('$tokenGroup$variant.disabled.unselected.outline')};
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(
......
......@@ -194,7 +194,7 @@ class InputChip extends StatelessWidget
Widget build(BuildContext context) {
assert(debugCheckHasMaterial(context));
final ChipThemeData? defaults = Theme.of(context).useMaterial3
? _InputChipDefaultsM3(context, isEnabled)
? _InputChipDefaultsM3(context, isEnabled, selected)
: null;
final Widget? resolvedDeleteIcon = deleteIcon
?? (Theme.of(context).useMaterial3 ? const Icon(Icons.clear, size: 18) : null);
......@@ -247,7 +247,7 @@ class InputChip extends StatelessWidget
// Token database version: v0_158
class _InputChipDefaultsM3 extends ChipThemeData {
const _InputChipDefaultsM3(this.context, this.isEnabled)
const _InputChipDefaultsM3(this.context, this.isEnabled, this.isSelected)
: super(
elevation: 0.0,
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(8.0))),
......@@ -256,6 +256,7 @@ class _InputChipDefaultsM3 extends ChipThemeData {
final BuildContext context;
final bool isEnabled;
final bool isSelected;
@override
TextStyle? get labelStyle => Theme.of(context).textTheme.labelLarge;
......@@ -270,7 +271,9 @@ class _InputChipDefaultsM3 extends ChipThemeData {
Color? get surfaceTintColor => Colors.transparent;
@override
Color? get selectedColor => Theme.of(context).colorScheme.secondaryContainer;
Color? get selectedColor => isEnabled
? Theme.of(context).colorScheme.secondaryContainer
: Theme.of(context).colorScheme.onSurface.withOpacity(0.12);
@override
Color? get checkmarkColor => null;
......@@ -282,9 +285,11 @@ class _InputChipDefaultsM3 extends ChipThemeData {
Color? get deleteIconColor => Theme.of(context).colorScheme.onSecondaryContainer;
@override
BorderSide? get side => isEnabled
? BorderSide(color: Theme.of(context).colorScheme.outline)
: BorderSide(color: Theme.of(context).colorScheme.onSurface.withOpacity(0.12));
BorderSide? get side => !isSelected
? isEnabled
? BorderSide(color: Theme.of(context).colorScheme.outline)
: BorderSide(color: Theme.of(context).colorScheme.onSurface.withOpacity(0.12))
: const BorderSide(color: Colors.transparent);
@override
IconThemeData? get iconTheme => IconThemeData(
......
......@@ -13,9 +13,10 @@ Widget wrapForChip({
TextDirection textDirection = TextDirection.ltr,
double textScaleFactor = 1.0,
Brightness brightness = Brightness.light,
bool useMaterial3 = false,
}) {
return MaterialApp(
theme: ThemeData(brightness: brightness),
theme: ThemeData(brightness: brightness, useMaterial3: useMaterial3),
home: Directionality(
textDirection: textDirection,
child: MediaQuery(
......@@ -26,10 +27,14 @@ Widget wrapForChip({
);
}
Widget selectedInputChip({ Color? checkmarkColor }) {
Widget selectedInputChip({
Color? checkmarkColor,
bool enabled = false,
}) {
return InputChip(
label: const Text('InputChip'),
selected: true,
isEnabled: enabled,
showCheckmark: true,
checkmarkColor: checkmarkColor,
);
......@@ -41,9 +46,11 @@ Future<void> pumpCheckmarkChip(
required Widget chip,
Color? themeColor,
Brightness brightness = Brightness.light,
bool useMaterial3 = false,
}) async {
await tester.pumpWidget(
wrapForChip(
useMaterial3: useMaterial3,
brightness: brightness,
child: Builder(
builder: (BuildContext context) {
......@@ -75,6 +82,15 @@ void expectCheckmarkColor(Finder finder, Color color) {
);
}
RenderBox getMaterialBox(WidgetTester tester) {
return tester.firstRenderObject<RenderBox>(
find.descendant(
of: find.byType(InputChip),
matching: find.byType(CustomPaint),
),
);
}
void checkChipMaterialClipBehavior(WidgetTester tester, Clip clipBehavior) {
final Iterable<Material> materials = tester.widgetList<Material>(find.byType(Material));
// There should be two Material widgets, first Material is from the "_wrapForChip" and
......@@ -238,4 +254,28 @@ void main() {
await tester.pumpWidget(wrapForChip(child: const InputChip(label: label, clipBehavior: Clip.antiAlias)));
checkChipMaterialClipBehavior(tester, Clip.antiAlias);
});
testWidgets('Input chip has correct selected color when enabled - M3 defaults', (WidgetTester tester) async {
final ChipThemeData material3ChipDefaults = ThemeData(useMaterial3: true).chipTheme;
await pumpCheckmarkChip(
tester,
chip: selectedInputChip(enabled: true),
useMaterial3: true,
);
final RenderBox materialBox = getMaterialBox(tester);
expect(materialBox, paints..rrect(color: material3ChipDefaults.backgroundColor));
});
testWidgets('Input chip has correct selected color when disabled - M3 defaults', (WidgetTester tester) async {
final ChipThemeData material3ChipDefaults = ThemeData(useMaterial3: true).chipTheme;
await pumpCheckmarkChip(
tester,
chip: selectedInputChip(),
useMaterial3: true,
);
final RenderBox materialBox = getMaterialBox(tester);
expect(materialBox, paints..path(color: material3ChipDefaults.disabledColor));
});
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment