Skip to content

Commit

Permalink
feat: [MDS-1173] Add inputFormatters property to AuthCode (#415)
Browse files Browse the repository at this point in the history
Co-authored-by: Birgitt Majas <birgitt.majas@yolo.com>
  • Loading branch information
GittHub-d and Birgitt Majas committed Jun 5, 2024
1 parent 8e4484d commit b1e0102
Show file tree
Hide file tree
Showing 6 changed files with 253 additions and 177 deletions.
11 changes: 5 additions & 6 deletions example/assets/code_snippets/auth_code.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,11 @@ class AuthCode extends StatelessWidget {
height: 95, // To avoid widget jumping with error text, use a fixed-height wrapper.
child: MoonAuthCode(
validator: (String? pin) {
// Matches all numbers.
final RegExp regex = RegExp(r'^\d+$');

return pin != null && pin.length == 4 && !regex.hasMatch(pin)
? 'The input must only contain numbers'
: null;
if (pin != null && pin != '000000' && pin.length == 6) {
return 'The input must be exactly "000000".';
} else {
return null;
}
},
errorBuilder: (BuildContext context, String? errorText) {
return Align(
Expand Down
78 changes: 38 additions & 40 deletions example/lib/src/storybook/common/pages/colors_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -242,48 +242,46 @@ class ColorsPage extends StatelessWidget {
right: 24,
bottom: 16.0,
),
child: SelectionArea(
child: Center(
child: SizedBox(
width: largeScreenWidth,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ConstrainedBox(
constraints: const BoxConstraints(
maxWidth: mediumScreenWidth,
),
child: Column(
children: [
_buildSectionHeader(
context,
ColorsPageSection.header,
),
const SizedBox(height: 24.0),
_buildSectionHeader(
context,
ColorsPageSection.mainColors,
),
_buildMainColorsSection(context),
const SizedBox(height: 48.0),
_buildSectionHeader(
context,
ColorsPageSection.supportiveColors,
),
_buildSupportiveColorsSection(context),
],
),
child: Center(
child: SizedBox(
width: largeScreenWidth,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ConstrainedBox(
constraints: const BoxConstraints(
maxWidth: mediumScreenWidth,
),
ConstrainedBox(
constraints: BoxConstraints(
maxWidth: _getFooterWidth(context),
),
child: const Center(
child: PageFooter(),
),
child: Column(
children: [
_buildSectionHeader(
context,
ColorsPageSection.header,
),
const SizedBox(height: 24.0),
_buildSectionHeader(
context,
ColorsPageSection.mainColors,
),
_buildMainColorsSection(context),
const SizedBox(height: 48.0),
_buildSectionHeader(
context,
ColorsPageSection.supportiveColors,
),
_buildSupportiveColorsSection(context),
],
),
],
),
),
ConstrainedBox(
constraints: BoxConstraints(
maxWidth: _getFooterWidth(context),
),
child: const Center(
child: PageFooter(),
),
),
],
),
),
),
Expand Down
45 changes: 21 additions & 24 deletions example/lib/src/storybook/common/pages/home_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -227,30 +227,27 @@ class HomePage extends StatelessWidget {
right: 24,
bottom: 16.0,
),
child: SelectionArea(
child: Center(
child: SizedBox(
width: largeScreenWidth,
child: Column(
crossAxisAlignment: layoutWidth > mediumScreenWidth
? CrossAxisAlignment.start
: CrossAxisAlignment.center,
children: [
_buildHeaderSection(context, showLogo),
const SizedBox(height: 48.0),
LayoutBuilder(
builder:
(BuildContext context, BoxConstraints constraints) {
return Column(
children: [
_buildCards(context, constraints.maxWidth),
const PageFooter(),
],
);
},
),
],
),
child: Center(
child: SizedBox(
width: largeScreenWidth,
child: Column(
crossAxisAlignment: layoutWidth > mediumScreenWidth
? CrossAxisAlignment.start
: CrossAxisAlignment.center,
children: [
_buildHeaderSection(context, showLogo),
const SizedBox(height: 48.0),
LayoutBuilder(
builder: (BuildContext context, BoxConstraints constraints) {
return Column(
children: [
_buildCards(context, constraints.maxWidth),
const PageFooter(),
],
);
},
),
],
),
),
),
Expand Down
78 changes: 38 additions & 40 deletions example/lib/src/storybook/common/pages/typography_page.dart
Original file line number Diff line number Diff line change
Expand Up @@ -94,47 +94,45 @@ class TypographyPage extends StatelessWidget {
right: 24,
bottom: 16.0,
),
child: SelectionArea(
child: Center(
child: SizedBox(
width: largeScreenWidth,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ConstrainedBox(
constraints: const BoxConstraints(
maxWidth: mediumScreenWidth,
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildSectionHeader(
context,
TypographyPageSection.typography,
),
const SizedBox(height: 48.0),
_buildSectionHeader(
context,
TypographyPageSection.body,
),
_buildTypographyContainer(context, MoonTextStyle.body),
const SizedBox(height: 48.0),
_buildSectionHeader(
context,
TypographyPageSection.heading,
),
_buildTypographyContainer(
context,
MoonTextStyle.heading,
),
const Center(
child: PageFooter(),
),
],
),
child: Center(
child: SizedBox(
width: largeScreenWidth,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ConstrainedBox(
constraints: const BoxConstraints(
maxWidth: mediumScreenWidth,
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildSectionHeader(
context,
TypographyPageSection.typography,
),
const SizedBox(height: 48.0),
_buildSectionHeader(
context,
TypographyPageSection.body,
),
_buildTypographyContainer(context, MoonTextStyle.body),
const SizedBox(height: 48.0),
_buildSectionHeader(
context,
TypographyPageSection.heading,
),
_buildTypographyContainer(
context,
MoonTextStyle.heading,
),
const Center(
child: PageFooter(),
),
],
),
),
],
),
),
),
Expand Down
11 changes: 5 additions & 6 deletions example/lib/src/storybook/stories/primitives/auth_code.dart
Original file line number Diff line number Diff line change
Expand Up @@ -238,12 +238,11 @@ class AuthCodeStory extends StatelessWidget {
obscureText: obscuringKnob,
peekWhenObscuring: peekWhenObscuringKnob,
validator: (String? pin) {
// Matches all numbers
final RegExp regex = RegExp(r'^\d+$');

return pin != null && pin.length == 4 && !regex.hasMatch(pin)
? 'The input must only contain numbers.'
: null;
if (pin != null && pin != '0000' && pin.length == 4) {
return 'The input must be exactly "0000".';
} else {
return null;
}
},
errorBuilder: (BuildContext context, String? errorText) {
return Align(
Expand Down
Loading

0 comments on commit b1e0102

Please sign in to comment.