Skip to content

Update Stac parsers and core models #475

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

Merged
divyanshub024 merged 3 commits into from
May 12, 2026
Merged

Update Stac parsers and core models #475

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
c5484cf
Update Stac parsers and core models
divyanshub024 May 12, 2026
97a29d0
Fix mask input formatter rule matching
divyanshub024 May 12, 2026
af8b7e5
Refactor input formatter test for improved readability
divyanshub024 May 12, 2026
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
32 changes: 32 additions & 0 deletions docs/concepts/theming.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -230,3 +230,35 @@ StacButtonStyle(
shape: StacRoundedRectangleBorder(borderRadius: StacBorderRadius.all(8)),
)
```

### Floating Action Button Theme

Use `floatingActionButtonTheme` to customize colors, elevation, shape, icon sizing, and layout constraints for floating action buttons:

```dart
StacFloatingActionButtonThemeData(
backgroundColor: '#95E183',
foregroundColor: '#050608',
elevation: 6,
shape: StacRoundedRectangleBorder(borderRadius: StacBorderRadius.all(16)),
sizeConstraints: StacBoxConstraints(minWidth: 56, minHeight: 56),
)
```

```json
{
"floatingActionButtonTheme": {
"backgroundColor": "#95E183",
"foregroundColor": "#050608",
"elevation": 6,
"shape": {
"type": "roundedRectangleBorder",
"borderRadius": 16
},
"sizeConstraints": {
"minWidth": 56,
"minHeight": 56
}
}
}
```
9 changes: 5 additions & 4 deletions docs/styles/text_style.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,9 @@ The Stac TextStyle classes allow you to style text with fonts, colors, sizes, an
| wordSpacing | `double?` | Spacing between words. |
| textBaseline | `String?` | Baseline alignment. |
| height | `double?` | Line height as multiple of font size. |
| decoration | `String?` | Decoration line: `none`, `underline`, `overline`, `lineThrough`. |
| decorationColor | `String?` | Color for text decorations. |
| decorationStyle | `String?` | Decoration style: solid, dotted, dashed, wavy. |
| decorationStyle | `String?` | Decoration style: `solid`, `double`, `dotted`, `dashed`, `wavy`. |
| decorationThickness | `double?` | Thickness of decorations. |
| fontFamily | `String?` | Font family name. |
| fontFamilyFallback | `List?` | Fallback font families. |
Expand Down Expand Up @@ -124,21 +125,21 @@ StacColumn(
StacText(
data: 'Underlined Text',
style: StacTextStyle(
decoration: StacTextDecoration.underline,
decoration: StacTextDecorationLine.underline,
decorationColor: StacColors.red,
decorationStyle: StacTextDecorationStyle.solid,
),
),
StacText(
data: 'Strikethrough Text',
style: StacTextStyle(
decoration: StacTextDecoration.lineThrough,
decoration: StacTextDecorationLine.lineThrough,
),
),
StacText(
data: 'Wavy Underline',
style: StacTextStyle(
decoration: StacTextDecoration.underline,
decoration: StacTextDecorationLine.underline,
decorationStyle: StacTextDecorationStyle.wavy,
decorationColor: StacColors.blue,
),
Expand Down
18 changes: 17 additions & 1 deletion docs/widgets/dropdown_menu.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,12 @@ export const dropdownMenuPreviewJson = {
},
"hintText": "Please select",
"width": 200,
"inputFormatters": [
{
"type": "deny",
"rule": "\\s"
}
],
"dropdownMenuEntries": [
{
"value": "option1",
Expand Down Expand Up @@ -65,6 +71,7 @@ the [official documentation](https://api.flutter.dev/flutter/material/DropdownMe
| enableFilter | `bool` | Whether to enable filtering. Defaults to `true`. |
| enableSearch | `bool` | Whether to enable search. Defaults to `true`. |
| requestFocusOnTap | `bool` | Whether to request focus on tap. Defaults to `true`. |
| inputFormatters | `List<StacInputFormatter>` | Input formatters for editable dropdown text. Supports `allow`, `deny`, and `mask`. |

## DropdownMenuEntry

Expand Down Expand Up @@ -93,6 +100,9 @@ StacDropdownMenu(
label: StacText(data: 'Select an option'),
hintText: 'Please select',
width: 200,
inputFormatters: [
StacInputFormatter(type: StacInputFormatterType.deny, rule: r'\s'),
],
dropdownMenuEntries: [
StacDropdownMenuEntry(
value: 'option1',
Expand Down Expand Up @@ -125,6 +135,12 @@ StacDropdownMenu(
},
"hintText": "Please select",
"width": 200,
"inputFormatters": [
{
"type": "deny",
"rule": "\\s"
}
],
"dropdownMenuEntries": [
{
"value": "option1",
Expand Down Expand Up @@ -186,4 +202,4 @@ StacDropdownMenu(
/>
</Frame>
</Tab>
</Tabs>
</Tabs>
20 changes: 16 additions & 4 deletions docs/widgets/icon_button.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,11 @@ export const iconButtonPreviewJson = {
},
"style": {
"backgroundColor": "#FFC107",
"foregroundColor": "#000000"
"foregroundColor": "#000000",
"shape": {
"type": "roundedRectangleBorder",
"borderRadius": 8
}
},
"isSelected": false,
"selectedIcon": {
Expand Down Expand Up @@ -95,7 +99,11 @@ StacIconButton(
tooltip: 'Add Item',
enableFeedback: true,
constraints: StacBoxConstraints(minWidth: 48.0, minHeight: 48.0),
style: StacButtonStyle(backgroundColor: StacColors.amber, foregroundColor: StacColors.black),
style: StacButtonStyle(
backgroundColor: StacColors.amber,
foregroundColor: StacColors.black,
shape: StacRoundedRectangleBorder(borderRadius: 8),
),
isSelected: false,
selectedIcon: StacIcon(icon: 'check'),
icon: StacIcon(icon: 'add'),
Expand Down Expand Up @@ -133,7 +141,11 @@ StacIconButton(
},
"style": {
"backgroundColor": "#FFC107",
"foregroundColor": "#000000"
"foregroundColor": "#000000",
"shape": {
"type": "roundedRectangleBorder",
"borderRadius": 8
}
},
"isSelected": false,
"selectedIcon": {
Expand Down Expand Up @@ -179,4 +191,4 @@ StacIconButton(
/>
</Frame>
</Tab>
</Tabs>
</Tabs>
11 changes: 9 additions & 2 deletions docs/widgets/text_field.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,14 @@ The Stac TextField allows you to build a Flutter text field widget using JSON. T
| cursorHeight | `double` | The height of the cursor. |
| cursorColor | `StacColor` | The color of the cursor. |
| hintText | `String` | The hint text to display when the text field is empty. |
| inputFormatters | `List<StacInputFormatter>` | The list of input formatters to apply to the text field. |

## StacInputDecoration

`decoration` supports Flutter input decoration fields such as `labelText`, `hintText`, prefix/suffix content, borders, fill colors, and `floatingLabelBehavior`.

| Property | Type | Description |
|-----------------------|----------|--------------------------------------------------------------------|
| floatingLabelBehavior | `String` | Controls when the label floats. Supported values: `auto`, `always`, `never`. |

## Example

Expand Down Expand Up @@ -121,4 +128,4 @@ StacTextField(
/>
</Frame>
</Tab>
</Tabs>
</Tabs>
72 changes: 57 additions & 15 deletions docs/widgets/text_form_field.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,13 @@ import { PLAYGROUND_BASE_URL } from "/snippets/playground_base.mdx";

export const textFormFieldPreviewJson = {
"type": "textFormField",
"id": "email",
"id": "date",
"autovalidateMode": "onUserInteraction",
"validatorRules": [
"inputFormatters": [
{
"rule": "isEmail",
"message": "Please enter a valid email"
"type": "mask",
"rule": "\\d",
"mask": "##/##/####"
}
],
"style": {
Expand All @@ -21,7 +22,9 @@ export const textFormFieldPreviewJson = {
"height": 1.5
},
"decoration": {
"hintText": "Email",
"labelText": "Date of birth",
"hintText": "DD/MM/YYYY",
"floatingLabelBehavior": "always",
"filled": true,
"fillColor": "#FFFFFF",
"border": {
Expand Down Expand Up @@ -78,21 +81,57 @@ To know more about the TextFormField widget in Flutter, refer to the [official d
| inputFormatters | `List<StacInputFormatter>` | The list of input formatters to apply to the text. Defaults to an empty list. |
| validatorRules | `List<StacFormFieldValidator>` | The list of validator rules to apply to the text. Defaults to an empty list. |

## StacInputDecoration

`decoration` supports Flutter input decoration fields such as `labelText`, `hintText`, `prefixIcon`, `suffixIcon`, borders, fill colors, and `floatingLabelBehavior`.

| Property | Type | Description |
|-----------------------|----------|--------------------------------------------------------------------|
| floatingLabelBehavior | `String` | Controls when the label floats. Supported values: `auto`, `always`, `never`. |

## Input Formatters

Use `inputFormatters` to restrict or transform user input. The supported formatter `type` values are `allow`, `deny`, and `mask`.

| Property | Type | Description |
|----------|----------|-----------------------------------------------------------------------------|
| type | `String` | Formatter type: `allow`, `deny`, or `mask`. |
| rule | `String` | Regular expression used by the formatter. |
| mask | `String` | Mask pattern used when `type` is `mask`; `#` consumes matching input values. |

```json
{
"inputFormatters": [
{
"type": "mask",
"rule": "\\d",
"mask": "##/##/####"
}
]
}
```
Comment thread
divyanshub024 marked this conversation as resolved.

## Example

<Tabs sync={false}>
<Tab title="Dart">

```dart
StacTextFormField(
id: 'email',
id: 'date',
autovalidateMode: StacAutovalidateMode.onUserInteraction,
validatorRules: [
StacFormFieldValidator(rule: 'isEmail', message: 'Please enter a valid email'),
inputFormatters: [
StacInputFormatter(
type: StacInputFormatterType.mask,
rule: r'\d',
mask: '##/##/####',
),
],
style: StacTextStyle(fontSize: 16, fontWeight: StacFontWeight.w400, height: 1.5),
decoration: StacInputDecoration(
hintText: 'Email',
labelText: 'Date of birth',
hintText: 'DD/MM/YYYY',
floatingLabelBehavior: 'always',
filled: true,
fillColor: StacColors.white,
border: StacOutlineInputBorder(borderRadius: 8, color: '#24151D29'),
Expand All @@ -106,12 +145,13 @@ StacTextFormField(
```json
{
"type": "textFormField",
"id": "email",
"id": "date",
"autovalidateMode": "onUserInteraction",
"validatorRules": [
"inputFormatters": [
{
"rule": "isEmail",
"message": "Please enter a valid email"
"type": "mask",
"rule": "\\d",
"mask": "##/##/####"
}
],
"style": {
Expand All @@ -120,7 +160,9 @@ StacTextFormField(
"height": 1.5
},
"decoration": {
"hintText": "Email",
"labelText": "Date of birth",
"hintText": "DD/MM/YYYY",
"floatingLabelBehavior": "always",
"filled": true,
"fillColor": "#FFFFFF",
"border": {
Expand Down Expand Up @@ -164,4 +206,4 @@ StacTextFormField(
/>
</Frame>
</Tab>
</Tabs>
</Tabs>
14 changes: 14 additions & 0 deletions packages/stac/lib/src/parsers/foundation/decoration/stac_input_decoration_parser.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ extension StacInputDecorationParser on StacInputDecoration {
icon: icon?.parse(context),
labelText: labelText,
labelStyle: labelStyle?.parse(context),
floatingLabelBehavior: _parseFloatingLabelBehavior(floatingLabelBehavior),
hintText: hintText,
hintStyle: hintStyle?.parse(context),
helperText: helperText,
Expand All @@ -38,3 +39,16 @@ extension StacInputDecorationParser on StacInputDecoration {
);
}
}

FloatingLabelBehavior? _parseFloatingLabelBehavior(String? behavior) {
switch (behavior) {
case 'always':
return FloatingLabelBehavior.always;
case 'never':
return FloatingLabelBehavior.never;
case 'auto':
return FloatingLabelBehavior.auto;
default:
return null;
}
}
2 changes: 2 additions & 0 deletions packages/stac/lib/src/parsers/foundation/forms/stac_input_formatter_type_parser.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,8 @@ extension StacInputFormatterTypeCoreParser on StacInputFormatterType {
return InputFormatterType.allow;
case StacInputFormatterType.deny:
return InputFormatterType.deny;
case StacInputFormatterType.mask:
return InputFormatterType.mask;
}
}
}
17 changes: 17 additions & 0 deletions packages/stac/lib/src/parsers/foundation/text/stac_text_decoration_line_parser.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
import 'package:flutter/painting.dart';
import 'package:stac_core/foundation/text/stac_text_types.dart';

extension StacTextDecorationLineParser on StacTextDecorationLine {
TextDecoration get parse {
switch (this) {
case StacTextDecorationLine.none:
return TextDecoration.none;
case StacTextDecorationLine.underline:
return TextDecoration.underline;
case StacTextDecorationLine.overline:
return TextDecoration.overline;
case StacTextDecorationLine.lineThrough:
return TextDecoration.lineThrough;
}
}
}
2 changes: 2 additions & 0 deletions packages/stac/lib/src/parsers/foundation/text/stac_text_style_parser.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
import 'package:stac/src/parsers/foundation/text/stac_font_style_parser.dart';
import 'package:stac/src/parsers/foundation/text/stac_font_weight_parser.dart';
import 'package:stac/src/parsers/foundation/text/stac_text_baseline_parser.dart';
import 'package:stac/src/parsers/foundation/text/stac_text_decoration_line_parser.dart';
import 'package:stac/src/parsers/foundation/text/stac_text_decoration_style_parser.dart';
import 'package:stac/src/parsers/foundation/text/stac_text_leading_distribution_parser.dart';
import 'package:stac/src/parsers/foundation/text/stac_text_overflow_parser.dart';
Expand Down Expand Up @@ -99,6 +100,7 @@ extension StacTextStyleParser on StacTextStyle {
textBaseline: style.textBaseline?.parse,
height: style.height,
leadingDistribution: style.leadingDistribution?.parse,
decoration: style.decoration?.parse,
decorationColor: style.decorationColor?.toColor(context),
decorationStyle: style.decorationStyle?.parse,
decorationThickness: style.decorationThickness,
Expand Down
2 changes: 1 addition & 1 deletion packages/stac/lib/src/parsers/theme/stac_button_style_parser.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,7 @@ extension StacButtonStyleParser on StacButtonStyle {
maximumSize: maximumSize?.parse,
iconSize: iconSize,
side: side?.parse(context),
// shape: shape?.parse(context),
shape: shape?.parse(context),
padding: padding?.parse,
enabledMouseCursor: enabledMouseCursor?.parse,
disabledMouseCursor: disabledMouseCursor?.parse,
Expand Down
Loading
Loading