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.

Sign up for GitHub

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: Textfield helper Text #531

Merged
merged 2 commits into from
Nov 26, 2024
Merged

fix: Textfield helper Text #531

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
5a379b7
textfield
tilucasoli Nov 26, 2024
83ed552
Update textfield.dart
tilucasoli Nov 26, 2024
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
7 changes: 3 additions & 4 deletions packages/remix/lib/src/components/textfield/textfield.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,8 +52,7 @@ class TextFieldSpec extends Spec<TextFieldSpec>

final Brightness keyboardAppearance;
final Color? autocorrectionTextRectColor;

final FlexBoxSpec textFieldContainer;
final FlexBoxSpec outerContainer;
final FlexBoxSpec container;
final TextStyle? hintTextStyle;
final TextSpec helperText;
Expand Down Expand Up @@ -89,7 +88,7 @@ class TextFieldSpec extends Spec<TextFieldSpec>
Brightness? keyboardAppearance,
this.autocorrectionTextRectColor,
bool? cursorOpacityAnimates,
FlexBoxSpec? textFieldContainer,
FlexBoxSpec? outerContainer,
FlexBoxSpec? container,
this.hintTextStyle,
TextSpec? helperText,
Expand All @@ -114,7 +113,7 @@ class TextFieldSpec extends Spec<TextFieldSpec>
scrollPadding = scrollPadding ?? const EdgeInsets.all(20.0),
clipBehavior = clipBehavior ?? Clip.hardEdge,
keyboardAppearance = keyboardAppearance ?? Brightness.light,
textFieldContainer = textFieldContainer ?? const FlexBoxSpec(),
outerContainer = outerContainer ?? const FlexBoxSpec(),
helperText = helperText ?? const TextSpec(),
container = container ?? const FlexBoxSpec(),
icon = icon ?? const IconSpec(),
Expand Down
38 changes: 18 additions & 20 deletions packages/remix/lib/src/components/textfield/textfield.g.dart
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

16 changes: 8 additions & 8 deletions packages/remix/lib/src/components/textfield/textfield_style.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,9 +79,9 @@ class TextFieldStyle extends SpecStyle<TextFieldSpecUtility> {

final $ = spec.utilities;

final textFieldContainerStyle = $.textFieldContainer.chain
final containerStyle = $.container.chain
..color.white()
..padding.horizontal(12)
..padding.horizontal(10)
..padding.vertical(8)
..borderRadius(6)
..border.all.color.grey.shade300()
Expand All @@ -95,7 +95,7 @@ class TextFieldStyle extends SpecStyle<TextFieldSpecUtility> {
..flex.crossAxisAlignment.center()
..flex.gap(8);

final containerStyle = $.container.flex.chain
final outerContainerStyle = $.outerContainer.flex.chain
..direction.vertical()
..mainAxisSize.min()
..mainAxisAlignment.start()
Expand All @@ -120,11 +120,11 @@ class TextFieldStyle extends SpecStyle<TextFieldSpecUtility> {
..style.fontSize(12)
..wrap.padding.left(12);

final focus = spec.on.focus($.textFieldContainer.border.all.color.black());
final focus = spec.on.focus($.container.border.all.color.black());

return Style.create([
platformSettings(spec).call(),
textFieldContainerStyle,
outerContainerStyle,
$.floatingLabel.off(),
$.selectionColor.black12(),
containerStyle,
Expand All @@ -145,7 +145,7 @@ class TextFieldDarkStyle extends TextFieldStyle {
final $ = spec.utilities;
final cursor = $.cursorColor.grey.shade100();

final textFieldContainerStyle = $.textFieldContainer.chain
final containerStyle = $.container.chain
..color.black()
..border.all.color.grey.shade800()
..shadow.spreadRadius(0)
Expand All @@ -163,12 +163,12 @@ class TextFieldDarkStyle extends TextFieldStyle {
final helperStyle = $.helperText.style.color.grey.shade400();
final icon = $.icon.color.grey.shade300();

final focus = spec.on.focus($.textFieldContainer.border.all.color.white());
final focus = spec.on.focus($.container.border.all.color.white());

return Style.create([
super.makeStyle(spec).call(),
cursor,
textFieldContainerStyle,
containerStyle,
focus,
textStyle,
helperStyle,
Expand Down
8 changes: 4 additions & 4 deletions packages/remix/lib/src/components/textfield/textfield_theme.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ class FortalezaTextFieldStyle extends TextFieldStyle {
Style makeStyle(SpecConfiguration<TextFieldSpecUtility> spec) {
final $ = spec.utilities;

final textFieldContainerStyle = $.textFieldContainer.chain
final containerStyle = $.container.chain
..color.$neutral(1)
..padding.horizontal.$space(3)
..padding.vertical.$space(2)
Expand All @@ -19,7 +19,7 @@ class FortalezaTextFieldStyle extends TextFieldStyle {

final textStyle = [$.style.$text(2), $.style.color.$neutral(12)];

final containerStyle = $.container.flex.gap.$space(2);
final outerContainerStyle = $.outerContainer.flex.gap.$space(2);

final hintStyle = [
$.hintTextStyle.color.$neutral(9),
Expand All @@ -38,7 +38,7 @@ class FortalezaTextFieldStyle extends TextFieldStyle {
final icon = $.icon.color.$accent();

final focus = spec.on.focus(
$.textFieldContainer.chain
$.container.chain
..border.all.color.$accent()
..border.all.width(2),
);
Expand All @@ -47,8 +47,8 @@ class FortalezaTextFieldStyle extends TextFieldStyle {
super.makeStyle(spec).call(),
$.floatingLabel.on(),
$.cursorColor.$neutral(12),
textFieldContainerStyle,
containerStyle,
outerContainerStyle,
...textStyle,
...hintStyle,
...floatingHintStyle,
Expand Down
13 changes: 8 additions & 5 deletions packages/remix/lib/src/components/textfield/textfield_widget.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -507,8 +507,10 @@ class _TextFieldState extends State<TextField>
// }

final style = widget.style ?? context.remix.components.textField;
final configuration =
TextFieldSpecConfiguration(context, TextFieldSpecUtility.self);
final configuration = TextFieldSpecConfiguration(
context,
TextFieldSpecUtility.self,
);

final child = SpecBuilder(
controller: _statesController,
Expand All @@ -519,10 +521,10 @@ class _TextFieldState extends State<TextField>
(_effectiveFocusNode.hasFocus ||
_effectiveController.value.text.isNotEmpty);

return spec.container(
return spec.outerContainer(
direction: Axis.vertical,
children: [
spec.textFieldContainer(
spec.container(
direction: Axis.horizontal,
children: [
if (widget.prefixBuilder != null)
Expand Down Expand Up @@ -618,7 +620,8 @@ class _TextFieldState extends State<TextField>
if (widget.suffix != null) widget.suffix!,
],
),
spec.helperText(widget.helperText ?? ''),
if (widget.helperText != null)
spec.helperText(widget.helperText ?? ''),
],
);
},
Expand Down
Loading