diff --git a/CHANGELOG.md b/CHANGELOG.md index 57e0bc8..27d8186 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,8 @@ +## 0.17.1 + +- **FIX**: `ShadInputOTP` text alignment and padding +- **FEAT**: Add `textInputAction` to `ShadInputOTPSlot` + ## 0.17.0 - **FEAT**: Add `ShadInputOTP` and `ShadInputOTPFormField` components. diff --git a/lib/src/components/input_otp.dart b/lib/src/components/input_otp.dart index 425b266..142bd85 100644 --- a/lib/src/components/input_otp.dart +++ b/lib/src/components/input_otp.dart @@ -263,6 +263,7 @@ class ShadInputOTPSlot extends StatefulWidget { this.singleRadius, this.middleRadius, this.initialValue, + this.textInputAction, }); /// {@template ShadInputOTPSlot.focusNode} @@ -339,8 +340,16 @@ class ShadInputOTPSlot extends StatefulWidget { /// {@endtemplate} final BorderRadius? middleRadius; + /// {@template ShadInputOTPSlot.initialValue} + /// The initial value of the slot. + /// {@endtemplate} final String? initialValue; + /// {@template ShadInputOTPSlot.textInputAction} + /// The text input action for the slot, defaults to null + /// {@endtemplate} + final TextInputAction? textInputAction; + @override State createState() => _ShadInputOTPSlotState(); } @@ -457,7 +466,7 @@ class _ShadInputOTPSlotState extends State { final effectivePadding = widget.padding ?? theme.inputOTPTheme.padding ?? - const EdgeInsets.symmetric(horizontal: 12, vertical: 4); + const EdgeInsets.symmetric(vertical: 4); final effectiveWidth = widget.width ?? theme.inputOTPTheme.width ?? 40.0; final effectiveHeight = widget.height ?? theme.inputOTPTheme.height ?? 40.0; @@ -497,6 +506,8 @@ class _ShadInputOTPSlotState extends State { focusNode: focusNode, controller: controller, decoration: effectiveDecoration, + textAlign: TextAlign.center, + textInputAction: widget.textInputAction, onChanged: (v) { // sanitize the text and format it var sanitizedV = v.replaceAll(kInvisibleCharCode, ''); diff --git a/lib/src/theme/themes/default_theme_no_secondary_border_variant.dart b/lib/src/theme/themes/default_theme_no_secondary_border_variant.dart index 9c5220d..e255f8e 100644 --- a/lib/src/theme/themes/default_theme_no_secondary_border_variant.dart +++ b/lib/src/theme/themes/default_theme_no_secondary_border_variant.dart @@ -953,7 +953,7 @@ class ShadDefaultThemeNoSecondaryBorderVariant extends ShadThemeVariant { ), singleRadius: radius, middleRadius: BorderRadius.zero, - padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 4), + padding: const EdgeInsets.symmetric(vertical: 4), decoration: ShadDecoration( disableSecondaryBorder: true, focusedBorder: ShadBorder.all( diff --git a/lib/src/theme/themes/default_theme_variant.dart b/lib/src/theme/themes/default_theme_variant.dart index 9c0f69c..038c881 100644 --- a/lib/src/theme/themes/default_theme_variant.dart +++ b/lib/src/theme/themes/default_theme_variant.dart @@ -919,7 +919,7 @@ class ShadDefaultThemeVariant extends ShadThemeVariant { ), singleRadius: radius, middleRadius: BorderRadius.zero, - padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 4), + padding: const EdgeInsets.symmetric(vertical: 4), decoration: ShadDecoration( disableSecondaryBorder: true, focusedBorder: ShadBorder.all( diff --git a/pubspec.yaml b/pubspec.yaml index 3bfe395..14e2009 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,6 +1,6 @@ name: shadcn_ui description: shadcn-ui ported in Flutter. Awesome UI components for Flutter, fully customizable. -version: 0.17.0 +version: 0.17.1 homepage: https://flutter-shadcn-ui.mariuti.com repository: https://github.com/nank1ro/flutter-shadcn-ui documentation: https://flutter-shadcn-ui.mariuti.com