Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: [MDS-538] Remove computeLuminace method #188

Merged
merged 1 commit into from
May 31, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 5 additions & 4 deletions lib/src/theme/alert/alert_colors.dart
Original file line number Diff line number Diff line change
Expand Up @@ -2,20 +2,21 @@ import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';

import 'package:moon_design/src/theme/colors.dart';
import 'package:moon_design/src/theme/typography/typography.dart';
import 'package:moon_design/src/utils/color_premul_lerp.dart';

@immutable
class MoonAlertColors extends ThemeExtension<MoonAlertColors> with DiagnosticableTreeMixin {
static final light = MoonAlertColors(
backgroundColor: MoonColors.light.gohan,
borderColor: MoonColors.light.bulma,
outlinedVariantColor: MoonColors.light.bulma,
borderColor: MoonTypography.light.colors.bodySecondary,
outlinedVariantColor: MoonTypography.light.colors.bodyPrimary,
);

static final dark = MoonAlertColors(
backgroundColor: MoonColors.dark.gohan,
borderColor: MoonColors.dark.trunks,
outlinedVariantColor: MoonColors.dark.bulma,
borderColor: MoonTypography.dark.colors.bodySecondary,
outlinedVariantColor: MoonTypography.dark.colors.bodyPrimary,
);

/// Alert background color.
Expand Down
5 changes: 3 additions & 2 deletions lib/src/theme/authcode/authcode_colors.dart
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';

import 'package:moon_design/src/theme/colors.dart';
import 'package:moon_design/src/theme/typography/typography.dart';
import 'package:moon_design/src/utils/color_premul_lerp.dart';

@immutable
Expand All @@ -15,7 +16,7 @@ class MoonAuthCodeColors extends ThemeExtension<MoonAuthCodeColors> with Diagnos
activeFillColor: MoonColors.light.gohan,
inactiveFillColor: MoonColors.light.gohan,
disabledColor: MoonColors.light.beerus,
textColor: MoonColors.light.bulma,
textColor: MoonTypography.light.colors.bodyPrimary,
);

static final dark = MoonAuthCodeColors(
Expand All @@ -27,7 +28,7 @@ class MoonAuthCodeColors extends ThemeExtension<MoonAuthCodeColors> with Diagnos
activeFillColor: MoonColors.dark.gohan,
inactiveFillColor: MoonColors.dark.gohan,
disabledColor: MoonColors.dark.beerus,
textColor: MoonColors.dark.bulma,
textColor: MoonTypography.dark.colors.bodyPrimary,
);

/// Border color of the selected auth input field.
Expand Down
4 changes: 2 additions & 2 deletions lib/src/theme/segmented_control/segmented_control_colors.dart
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,14 @@ class MoonSegmentedControlColors extends ThemeExtension<MoonSegmentedControlColo
backgroundColor: MoonColors.light.goku,
selectedSegmentColor: MoonColors.light.gohan,
textColor: MoonTypography.light.colors.bodyPrimary,
selectedTextColor: MoonColors.light.bulma,
selectedTextColor: MoonTypography.light.colors.bodyPrimary,
);

static final dark = MoonSegmentedControlColors(
backgroundColor: MoonColors.dark.goku,
selectedSegmentColor: MoonColors.dark.gohan,
textColor: MoonTypography.dark.colors.bodyPrimary,
selectedTextColor: MoonColors.dark.bulma,
selectedTextColor: MoonTypography.dark.colors.bodyPrimary,
);

/// Background color of SegmentedControl.
Expand Down
33 changes: 32 additions & 1 deletion lib/src/theme/switch/switch_colors.dart
Original file line number Diff line number Diff line change
Expand Up @@ -2,19 +2,26 @@ import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';

import 'package:moon_design/src/theme/colors.dart';
import 'package:moon_design/src/theme/typography/typography.dart';
import 'package:moon_design/src/utils/color_premul_lerp.dart';

@immutable
class MoonSwitchColors extends ThemeExtension<MoonSwitchColors> with DiagnosticableTreeMixin {
static final light = MoonSwitchColors(
activeTrackColor: MoonColors.light.piccolo,
inactiveTrackColor: MoonColors.light.beerus,
activeTextColor: MoonTypography.dark.colors.bodyPrimary,
inactiveTextColor: MoonTypography.light.colors.bodyPrimary,
thumbIconColor: MoonTypography.light.colors.bodyPrimary,
thumbColor: MoonColors.light.goten,
);

static final dark = MoonSwitchColors(
activeTrackColor: MoonColors.dark.piccolo,
inactiveTrackColor: MoonColors.dark.beerus,
activeTextColor: MoonTypography.dark.colors.bodyPrimary,
inactiveTextColor: MoonTypography.dark.colors.bodyPrimary,
thumbIconColor: MoonTypography.light.colors.bodyPrimary,
thumbColor: MoonColors.dark.goten,
);

Expand All @@ -24,24 +31,42 @@ class MoonSwitchColors extends ThemeExtension<MoonSwitchColors> with Diagnostica
/// Switch inactive track color.
final Color inactiveTrackColor;

/// Switch thumbColor.
/// Switch active track text color.
final Color activeTextColor;

/// Switch inactive track text color.
final Color inactiveTextColor;

/// Switch icon Color.
final Color thumbIconColor;

/// Switch thumb color.
final Color thumbColor;

const MoonSwitchColors({
required this.activeTrackColor,
required this.inactiveTrackColor,
required this.activeTextColor,
required this.inactiveTextColor,
required this.thumbIconColor,
required this.thumbColor,
});

@override
MoonSwitchColors copyWith({
Color? activeTrackColor,
Color? inactiveTrackColor,
Color? activeTextColor,
Color? inactiveTextColor,
Color? thumbIconColor,
Color? thumbColor,
}) {
return MoonSwitchColors(
activeTrackColor: activeTrackColor ?? this.activeTrackColor,
inactiveTrackColor: inactiveTrackColor ?? this.inactiveTrackColor,
activeTextColor: activeTextColor ?? this.activeTextColor,
inactiveTextColor: inactiveTextColor ?? this.inactiveTextColor,
thumbIconColor: thumbIconColor ?? this.thumbIconColor,
thumbColor: thumbColor ?? this.thumbColor,
);
}
Expand All @@ -53,6 +78,9 @@ class MoonSwitchColors extends ThemeExtension<MoonSwitchColors> with Diagnostica
return MoonSwitchColors(
activeTrackColor: colorPremulLerp(activeTrackColor, other.activeTrackColor, t)!,
inactiveTrackColor: colorPremulLerp(inactiveTrackColor, other.inactiveTrackColor, t)!,
activeTextColor: colorPremulLerp(activeTextColor, other.activeTextColor, t)!,
inactiveTextColor: colorPremulLerp(inactiveTextColor, other.inactiveTextColor, t)!,
thumbIconColor: colorPremulLerp(thumbIconColor, other.thumbIconColor, t)!,
thumbColor: colorPremulLerp(thumbColor, other.thumbColor, t)!,
);
}
Expand All @@ -64,6 +92,9 @@ class MoonSwitchColors extends ThemeExtension<MoonSwitchColors> with Diagnostica
..add(DiagnosticsProperty("type", "MoonSwitchColors"))
..add(ColorProperty("activeTrackColor", activeTrackColor))
..add(ColorProperty("inactiveTrackColor", inactiveTrackColor))
..add(ColorProperty("activeTextColor", activeTextColor))
..add(ColorProperty("inactiveTextColor", inactiveTextColor))
..add(ColorProperty("thumbIconColor", thumbIconColor))
..add(ColorProperty("thumbColor", thumbColor));
}
}
23 changes: 22 additions & 1 deletion lib/src/theme/toast/toast_colors.dart
Original file line number Diff line number Diff line change
Expand Up @@ -2,18 +2,23 @@ import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';

import 'package:moon_design/src/theme/colors.dart';
import 'package:moon_design/src/theme/typography/typography.dart';
import 'package:moon_design/src/utils/color_premul_lerp.dart';

@immutable
class MoonToastColors extends ThemeExtension<MoonToastColors> with DiagnosticableTreeMixin {
static final light = MoonToastColors(
lightVariantBackgroundColor: MoonColors.light.gohan,
darkVariantBackgroundColor: MoonColors.dark.gohan,
lightVariantTextColor: MoonTypography.light.colors.bodyPrimary,
darkVariantTextColor: MoonTypography.dark.colors.bodyPrimary,
);

static final dark = MoonToastColors(
lightVariantBackgroundColor: MoonColors.dark.gohan,
darkVariantBackgroundColor: MoonColors.light.gohan,
lightVariantTextColor: MoonTypography.dark.colors.bodyPrimary,
darkVariantTextColor: MoonTypography.light.colors.bodyPrimary,
);

/// Toast light variant background color.
Expand All @@ -22,19 +27,31 @@ class MoonToastColors extends ThemeExtension<MoonToastColors> with Diagnosticabl
/// Toast dark variant background color.
final Color darkVariantBackgroundColor;

/// Toast light variant text color.
final Color lightVariantTextColor;

/// Toast dark variant text color.
final Color darkVariantTextColor;

const MoonToastColors({
required this.lightVariantBackgroundColor,
required this.darkVariantBackgroundColor,
required this.lightVariantTextColor,
required this.darkVariantTextColor,
});

@override
MoonToastColors copyWith({
Color? lightVariantBackgroundColor,
Color? darkVariantBackgroundColor,
Color? lightVariantTextColor,
Color? darkVariantTextColor,
}) {
return MoonToastColors(
lightVariantBackgroundColor: lightVariantBackgroundColor ?? this.lightVariantBackgroundColor,
darkVariantBackgroundColor: darkVariantBackgroundColor ?? this.darkVariantBackgroundColor,
lightVariantTextColor: lightVariantTextColor ?? this.lightVariantTextColor,
darkVariantTextColor: darkVariantTextColor ?? this.darkVariantTextColor,
);
}

Expand All @@ -45,6 +62,8 @@ class MoonToastColors extends ThemeExtension<MoonToastColors> with Diagnosticabl
return MoonToastColors(
lightVariantBackgroundColor: colorPremulLerp(lightVariantBackgroundColor, other.lightVariantBackgroundColor, t)!,
darkVariantBackgroundColor: colorPremulLerp(darkVariantBackgroundColor, other.darkVariantBackgroundColor, t)!,
lightVariantTextColor: colorPremulLerp(lightVariantTextColor, other.lightVariantTextColor, t)!,
darkVariantTextColor: colorPremulLerp(darkVariantTextColor, other.darkVariantTextColor, t)!,
);
}

Expand All @@ -54,6 +73,8 @@ class MoonToastColors extends ThemeExtension<MoonToastColors> with Diagnosticabl
properties
..add(DiagnosticsProperty("type", "MoonToastColors"))
..add(ColorProperty("lightVariantBackgroundColor", lightVariantBackgroundColor))
..add(ColorProperty("darkVariantBackgroundColor", darkVariantBackgroundColor));
..add(ColorProperty("darkVariantBackgroundColor", darkVariantBackgroundColor))
..add(ColorProperty("lightVariantTextColor", lightVariantTextColor))
..add(ColorProperty("darkVariantTextColor", darkVariantTextColor));
}
}
18 changes: 4 additions & 14 deletions lib/src/widgets/alert/alert.dart
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import 'package:moon_design/src/theme/colors.dart';
import 'package:moon_design/src/theme/sizes.dart';
import 'package:moon_design/src/theme/theme.dart';
import 'package:moon_design/src/theme/typography/text_styles.dart';
import 'package:moon_design/src/theme/typography/typography.dart';
import 'package:moon_design/src/utils/extensions.dart';
import 'package:moon_design/src/utils/shape_decoration_premul.dart';
import 'package:moon_design/src/utils/squircle/squircle_border.dart';
Expand Down Expand Up @@ -123,17 +124,6 @@ class _MoonAlertState extends State<MoonAlert> with SingleTickerProviderStateMix
AnimationController? _animationController;
Animation<double>? _curvedAnimation;

Color _getElementColor({required Color effectiveBackgroundColor, required Color? elementColor}) {
if (elementColor != null) return elementColor;

final backgroundLuminance = effectiveBackgroundColor.computeLuminance();
if (backgroundLuminance > 0.5) {
return MoonColors.light.bulma;
} else {
return MoonColors.dark.bulma;
}
}

TextStyle _getTextStyle({required BuildContext context}) {
if (widget.titleTextStyle != null) return widget.titleTextStyle!;

Expand Down Expand Up @@ -215,13 +205,13 @@ class _MoonAlertState extends State<MoonAlert> with SingleTickerProviderStateMix
widget.borderColor ?? context.moonTheme?.alertTheme.colors.borderColor ?? MoonColors.light.bulma;

final Color effectiveLeadingColor =
_getElementColor(effectiveBackgroundColor: effectiveBackgroundColor, elementColor: widget.leadingColor);
widget.leadingColor ?? context.moonTypography?.colors.bodyPrimary ?? MoonTypography.light.colors.bodyPrimary;

final Color effectiveTrailingColor =
_getElementColor(effectiveBackgroundColor: effectiveBackgroundColor, elementColor: widget.trailingColor);
widget.trailingColor ?? context.moonTypography?.colors.bodyPrimary ?? MoonTypography.light.colors.bodyPrimary;

final Color effectiveTextColor =
_getElementColor(effectiveBackgroundColor: effectiveBackgroundColor, elementColor: widget.textColor);
widget.textColor ?? context.moonTypography?.colors.bodyPrimary ?? MoonTypography.light.colors.bodyPrimary;

final EdgeInsetsGeometry effectivePadding =
widget.padding ?? context.moonTheme?.alertTheme.properties.padding ?? EdgeInsets.all(MoonSizes.sizes.x2s);
Expand Down
37 changes: 13 additions & 24 deletions lib/src/widgets/authcode/authcode.dart
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import 'package:moon_design/src/theme/opacity.dart';
import 'package:moon_design/src/theme/sizes.dart';
import 'package:moon_design/src/theme/theme.dart';
import 'package:moon_design/src/theme/typography/text_styles.dart';
import 'package:moon_design/src/theme/typography/typography.dart';
import 'package:moon_design/src/utils/extensions.dart';
import 'package:moon_design/src/utils/shape_decoration_premul.dart';
import 'package:moon_design/src/utils/squircle/squircle_border.dart';
Expand Down Expand Up @@ -309,6 +310,9 @@ class _MoonAuthCodeState extends State<MoonAuthCode> with TickerProviderStateMix
.merge(widget.errorTextStyle)
.copyWith(color: widget.errorTextStyle?.color ?? _effectiveErrorBorderColor);

Color get _resolvedErrorCursorColor =>
_isInErrorMode ? _resolvedErrorTextStyle.color ?? _effectiveErrorBorderColor : _effectiveCursorColor;

void _initializeFields() {
_initializeFocusNode();
_initializeInputList();
Expand Down Expand Up @@ -464,17 +468,6 @@ class _MoonAuthCodeState extends State<MoonAuthCode> with TickerProviderStateMix
return [];
}

Color _getElementColor({required Color effectiveBackgroundColor, required Color? elementColor}) {
if (elementColor != null) return elementColor;

final backgroundLuminance = effectiveBackgroundColor.computeLuminance();
if (backgroundLuminance > 0.5) {
return MoonColors.light.bulma;
} else {
return MoonColors.dark.bulma;
}
}

ShapeBorder _getAuthInputFieldShape({required int elementIndex}) {
final borderSide = BorderSide(
color: _getBorderColorFromIndex(elementIndex),
Expand Down Expand Up @@ -540,9 +533,7 @@ class _MoonAuthCodeState extends State<MoonAuthCode> with TickerProviderStateMix
Padding(
padding: EdgeInsetsDirectional.only(end: i == widget.authInputFieldCount - 1 ? 0 : _effectiveGap),
child: RepaintBoundary(
child: AnimatedContainer(
curve: _animationCurve!,
duration: _animationDuration!,
child: Container(
width: _effectiveWidth,
height: _effectiveHeight,
decoration: ShapeDecorationWithPremultipliedAlpha(
Expand Down Expand Up @@ -582,7 +573,7 @@ class _MoonAuthCodeState extends State<MoonAuthCode> with TickerProviderStateMix
child: CustomPaint(
size: Size(0, cursorHeight),
painter: _CursorPainter(
cursorColor: _effectiveCursorColor,
cursorColor: _resolvedErrorCursorColor,
),
),
),
Expand All @@ -600,7 +591,7 @@ class _MoonAuthCodeState extends State<MoonAuthCode> with TickerProviderStateMix
child: CustomPaint(
size: Size(0, cursorHeight),
painter: _CursorPainter(
cursorColor: _effectiveCursorColor,
cursorColor: _resolvedErrorCursorColor,
),
),
),
Expand Down Expand Up @@ -731,15 +722,13 @@ class _MoonAuthCodeState extends State<MoonAuthCode> with TickerProviderStateMix

_effectiveErrorTextStyle = context.moonTheme?.authCodeTheme.properties.errorTextStyle ?? MoonTextStyles.body.text12;

_effectiveTextColor = _getElementColor(
effectiveBackgroundColor: _effectiveActiveFillColor,
elementColor: widget.textColor,
);
_effectiveTextColor = widget.textColor ??
context.moonTheme?.authCodeTheme.colors.textColor ??
MoonTypography.light.colors.bodyPrimary;

_effectiveCursorColor = _getElementColor(
effectiveBackgroundColor: _effectiveSelectedFillColor,
elementColor: widget.authFieldCursorColor,
);
_effectiveCursorColor = widget.authFieldCursorColor ??
context.moonTheme?.authCodeTheme.colors.textColor ??
MoonTypography.light.colors.bodyPrimary;

_animationDuration ??= widget.animationDuration ??
context.moonTheme?.authCodeTheme.properties.animationDuration ??
Expand Down
Loading