diff --git a/.github/workflows/ci.yaml b/.github/workflows/ci.yaml index 0ad8ad58..7f2ba7fe 100644 --- a/.github/workflows/ci.yaml +++ b/.github/workflows/ci.yaml @@ -13,8 +13,6 @@ jobs: token: ${{ secrets.GITHUB_TOKEN }} with: flutter-version: "3.44.0" - # DCM requires separately licensed CI credentials. Keep its standalone - # local check, while GitHub Actions uses Dart Analyzer for static checks. run-dcm: false fortal_atlas: diff --git a/README.md b/README.md index 9431a5a6..c08f2e1d 100644 --- a/README.md +++ b/README.md @@ -27,10 +27,7 @@ final style = RemixButtonStyler() .color(Colors.blue) .borderRadiusAll(const Radius.circular(8)) .animate(AnimationConfig.spring(300.ms)) - .onHovered( - RemixButtonStyler() - .color(Colors.blue.shade700) - ); + .onHovered(.color(Colors.blue.shade700)); RemixButton( onPressed: () {}, @@ -46,10 +43,7 @@ final button = RemixButtonStyler() .paddingY(10) .color(Colors.blue) .borderRadiusAll(const Radius.circular(8)) - .onHovered( - RemixButtonStyler() - .color(Colors.blue.shade700) - ) + .onHovered(.color(Colors.blue.shade700)) .animate(AnimationConfig.spring(300.ms)); button( @@ -125,13 +119,8 @@ final button = RemixButtonStyler() .color(Colors.blue) .borderRadiusAll(const Radius.circular(8)) .label(TextStyler().color(Colors.white)) - .onHovered( - RemixButtonStyler() - .color(Colors.blue.shade700), - ) - .onPressed( - RemixButtonStyler().wrap(.scale(x: 0.95, y: 0.95)), - ); + .onHovered(.color(Colors.blue.shade700)) + .onPressed(.scale(0.95)); ``` ### Adding Animation @@ -145,14 +134,8 @@ final style = RemixButtonStyler() .color(Colors.blue) .borderRadiusAll(const Radius.circular(8)) .animate(AnimationConfig.spring(300.ms)) - .onHovered( - RemixButtonStyler() - .color(Colors.blue.shade700), - ) - .onPressed( - RemixButtonStyler() - .wrap(.scale(x: 0.95, y: 0.95)), - ); + .onHovered(.color(Colors.blue.shade700)) + .onPressed(.scale(0.95)); ``` This example animates both the color on hover and the scale on press, creating a smooth interactive experience for your users. @@ -217,9 +200,7 @@ Generated Fortal widgets call the matching `fortal*Styler` internally. Use those final style = fortalButtonStyler(variant: FortalButtonVariant.solid) .borderRadiusAll(const Radius.circular(8)) .paddingX(32) - .onHovered( - RemixButtonStyler().wrap(.scale(x: 1.05, y: 1.05)), - ); + .onHovered(.scale(1.05)); ``` ### Fortal Design Tokens diff --git a/docs.json b/docs.json index dd4f92d8..a8f8ad78 100644 --- a/docs.json +++ b/docs.json @@ -67,6 +67,10 @@ { "title": "Getting Started", "href": "/" + }, + { + "title": "Styler API", + "href": "/styler-api" } ] }, diff --git a/docs/components/button.mdx b/docs/components/button.mdx index b94ee3c1..52d2a4ad 100644 --- a/docs/components/button.mdx +++ b/docs/components/button.mdx @@ -64,15 +64,14 @@ class ButtonExample extends StatelessWidget { ) .wrap(.scale(x: 1, y: 1)) .onPressed( - RemixButtonStyler().wrap(.scale(x: 0.90, y: 0.90)), + .scale(0.90), ) .onHovered( - RemixButtonStyler() - .backgroundColor(const Color(0xFF732D2D)) + .color(const Color(0xFF732D2D)) .animate(AnimationConfig.spring(300.ms)), ) .onFocused( - RemixButtonStyler().backgroundColor(const Color(0xFF732D2D)), + .color(const Color(0xFF732D2D)), ); } @@ -90,10 +89,10 @@ class ButtonExample extends StatelessWidget { .spreadRadius(0), ) .onHovered( - RemixButtonStyler().backgroundColor(const Color(0xFF357857)), + .color(const Color(0xFF357857)), ) .onFocused( - RemixButtonStyler().backgroundColor(const Color(0xFF357857)), + .color(const Color(0xFF357857)), ); } } diff --git a/docs/index.mdx b/docs/index.mdx index 7fbedbf6..5ed3e61d 100644 --- a/docs/index.mdx +++ b/docs/index.mdx @@ -29,10 +29,7 @@ final style = RemixButtonStyler() .color(Colors.blue) .borderRadiusAll(const Radius.circular(8)) .animate(AnimationConfig.spring(300.ms)) - .onHovered( - RemixButtonStyler() - .color(Colors.blue.shade700) - ); + .onHovered(.color(Colors.blue.shade700)); RemixButton( onPressed: () {}, @@ -48,10 +45,7 @@ final button = RemixButtonStyler() .paddingY(10) .color(Colors.blue) .borderRadiusAll(const Radius.circular(8)) - .onHovered( - RemixButtonStyler() - .color(Colors.blue.shade700) - ) + .onHovered(.color(Colors.blue.shade700)) .animate(AnimationConfig.spring(300.ms)); button( @@ -127,13 +121,8 @@ final style = RemixButtonStyler() .color(Colors.blue) .borderRadiusAll(const Radius.circular(8)) .label(TextStyler().color(Colors.white)) - .onHovered( // [!code ++] - RemixButtonStyler() // [!code ++] - .color(Colors.blue.shade700), // [!code ++] - ) // [!code ++] - .onPressed( // [!code ++] - RemixButtonStyler().wrap(.scale(x: 0.95, y: 0.95)), // [!code ++] - ); // [!code ++] + .onHovered(.color(Colors.blue.shade700)) // [!code ++] + .onPressed(.scale(0.95)); // [!code ++] ``` ### Adding Animation @@ -147,14 +136,8 @@ final style = RemixButtonStyler() .color(Colors.blue) .borderRadiusAll(const Radius.circular(8)) .animate(AnimationConfig.spring(300.ms)) // [!code ++] - .onHovered( - RemixButtonStyler() - .color(Colors.blue.shade700), - ) - .onPressed( - RemixButtonStyler() - .wrap(.scale(x: 0.95, y: 0.95)), - ); + .onHovered(.color(Colors.blue.shade700)) + .onPressed(.scale(0.95)); ``` This example animates both the color on hover and the scale on press, creating a smooth interactive experience for your users. @@ -219,9 +202,7 @@ Generated Fortal widgets call the matching `fortal*Styler` internally. Use those final style = fortalButtonStyler(variant: FortalButtonVariant.solid) .borderRadiusAll(const Radius.circular(8)) .paddingX(32) - .onHovered( - RemixButtonStyler().wrap(.scale(x: 1.05, y: 1.05)), - ); + .onHovered(.scale(1.05)); ``` ### Fortal Design Tokens diff --git a/docs/styler-api.mdx b/docs/styler-api.mdx new file mode 100644 index 00000000..4f0f6028 --- /dev/null +++ b/docs/styler-api.mdx @@ -0,0 +1,136 @@ +--- +title: Styler API +description: Factory constructors, fluent methods, contextual shorthand, and Remix styler conventions +--- + +Remix stylers expose matching named factories and fluent methods for canonical +style operations. This symmetry lets a state variant use Dart's contextual dot +shorthand without constructing another styler explicitly: + +```dart +final style = RemixButtonStyler() + .color(Colors.blue) + .onHovered(.color(Colors.indigo)) + .onPressed(.scale(0.97)); +``` + +The following expressions are equivalent: + +```dart +RemixCardStyler.color(Colors.blue) +RemixCardStyler().color(Colors.blue) +``` + +## Factory policy + +| API shape | Policy | +| --- | --- | +| Canonical style operation | Expose both a named factory and a matching fluent method. | +| Direct child styler field | Expose a field factory such as `RemixMenuStyler.trigger(...)`. | +| Primary nested container | Forward one compatible canonical surface from the nested styler. | +| Alias or expanded convenience | Keep it fluent-only and use its canonical operation in contextual shorthand. | +| Styler lifecycle or composition (`animate`, `variants`, `wrap`, `modifier`, `merge`) | Keep it fluent-only because it configures or combines an existing parent styler. | +| Generic variant or callable widget helper | Keep it as an extension method; it operates on an existing styler. | +| Name conflict | Give the component-specific behavior a descriptive name and reserve the canonical name for the generated surface. | + +Factories are generated from each component spec. Do not add public methods +directly to generated `*.g.dart` files. + +### Canonical operations and conveniences + +Canonical operations include APIs such as `color`, `padding`, `borderRadius`, +`scale`, and direct child fields such as `label`. Expanded conveniences and +aliases remain fluent-only. For example, use the canonical factory inside a +variant: + +```dart +final style = RemixCardStyler() + .paddingAll(12) + .backgroundColor(Colors.white) + .onHovered(.padding(EdgeInsetsGeometryMix.all(16))) + .onPressed(.color(Colors.grey.shade100)); +``` + +Here, `paddingAll` expands to `padding`, and `backgroundColor` aliases `color`. +They do not add duplicate named factories. + +Legacy convenience factories map to canonical factories as follows. Their +fluent convenience methods remain available on an existing styler. + +| Legacy convenience factory | Canonical contextual replacement | +| --- | --- | +| `backgroundColor(value)` | `.color(value)` | +| `RemixAccordionStyler.titleColor(value)` | `.title(.color(value))` | +| `titleFontSize(value)` / `titleFontWeight(value)` | `.title(.fontSize(value))` / `.title(.fontWeight(value))` | +| `titleStyle(value)` | `.title(.style(value))` | +| `leadingIconColor(value)` / `leadingIconSize(value)` | `.leadingIcon(.color(value))` / `.leadingIcon(.size(value))` | +| `trailingIconColor(value)` / `trailingIconSize(value)` | `.trailingIcon(.color(value))` / `.trailingIcon(.size(value))` | +| `contentColor(value)` / `contentPadding(value)` / `contentDecoration(value)` | `.content(.color(value))` / `.content(.padding(value))` / `.content(.decoration(value))` | +| `RemixAvatarStyler.square(value)` | `.size(value, value)` | +| `RemixAvatarStyler.foregroundColor(value)` | `.label(.color(value)).iconColor(value)` | +| `RemixBadgeStyler.foregroundColor(value)` | `.label(.color(value))` | +| `RemixCalloutStyler.foregroundColor(value)` | `.icon(.color(value)).textColor(value)` | +| `RemixCalloutStyler.iconSize(value)` | `.icon(.size(value))` | +| `RemixCalloutStyler.textStyle(value)` | `.text(.style(value))` | + +### Forwarded surfaces + +Most visual components forward the canonical surface of their primary `Box` +or `FlexBox` container. A composite root without one clear visual surface, such +as `RemixMenuStyler`, exposes factories for its child fields instead: + +```dart +final style = RemixMenuStyler.trigger( + RemixMenuTriggerStyler.color(Colors.black), +); +``` + +`RemixSelectStyler` stores its popup container as a `FlexBox`, but intentionally +forwards only the compatible `Box` surface. This exposes operations such as +`color`, `padding`, and `scale` without leaking popup layout controls through +the root select styler. + +The upstream forwarded `transform` factory currently accepts `Alignment` +rather than the wider `AlignmentGeometry` accepted by the former handwritten +helpers. Use a direct child styler when a directional alignment is required, +for example `RemixCardStyler.container(BoxStyler(transform: matrix, +transformAlignment: AlignmentDirectional.centerStart))`. + +### Variants and selected state + +Widget-state and selected-state helpers consume the same styler type, so named +factories work contextually for every generated Remix styler: + +```dart +final checkboxStyle = RemixCheckboxStyler() + .onHovered(.color(Colors.grey.shade100)) + .onSelected(.color(Colors.green)); +``` + +## Resolved naming conflicts + +Three legacy helpers used names that now belong to a canonical forwarded +surface. Their component-specific behavior remains available under explicit +names: + +| Styler | Canonical generated API | Component-specific helper | +| --- | --- | --- | +| `RemixTextFieldStyler` | `color` styles the container | `textColor` styles editable text | +| `RemixButtonStyler` | `rotate` transforms the container | `modifierRotate` rotates the complete widget with a modifier | +| `RemixCalloutStyler` | `textStyle(TextStyler)` applies the container text style | `contentTextStyle(TextStyleMix)` styles callout content | + +This keeps contextual shorthand predictable while preserving each specialized +operation without ambiguous overloads. + +## Generation boundary + +`Remix*Styler` classes are generated from `@MixableSpec`. Fortal widget wrapper +classes are source-authored even though they were previously emitted by +`@MixWidget`. Both upstream generators write shared parts for the same library; +during a clean build, the widget generator cannot resolve a Styler that the +spec generator has not yet combined into that library. + +Only the wrapper shell was materialized—the `fortal*Styler` recipes and widget +behavior remain unchanged. This keeps clean builds deterministic and preserves +the former generated constructors and fields. The widget builder can be +re-enabled once upstream generation supports that dependency ordering. diff --git a/packages/demo/pubspec.yaml b/packages/demo/pubspec.yaml index 785e1ab3..5a39b005 100644 --- a/packages/demo/pubspec.yaml +++ b/packages/demo/pubspec.yaml @@ -9,6 +9,8 @@ environment: dependency_overrides: accessibility_tools: ^2.8.0 + # Keep Mix and Atlas on their compatible revision while the generator and + # annotation packages use their published beta through Remix. mix: git: url: https://github.com/btwld/mix.git diff --git a/packages/remix/README.md b/packages/remix/README.md index 9431a5a6..c08f2e1d 100644 --- a/packages/remix/README.md +++ b/packages/remix/README.md @@ -27,10 +27,7 @@ final style = RemixButtonStyler() .color(Colors.blue) .borderRadiusAll(const Radius.circular(8)) .animate(AnimationConfig.spring(300.ms)) - .onHovered( - RemixButtonStyler() - .color(Colors.blue.shade700) - ); + .onHovered(.color(Colors.blue.shade700)); RemixButton( onPressed: () {}, @@ -46,10 +43,7 @@ final button = RemixButtonStyler() .paddingY(10) .color(Colors.blue) .borderRadiusAll(const Radius.circular(8)) - .onHovered( - RemixButtonStyler() - .color(Colors.blue.shade700) - ) + .onHovered(.color(Colors.blue.shade700)) .animate(AnimationConfig.spring(300.ms)); button( @@ -125,13 +119,8 @@ final button = RemixButtonStyler() .color(Colors.blue) .borderRadiusAll(const Radius.circular(8)) .label(TextStyler().color(Colors.white)) - .onHovered( - RemixButtonStyler() - .color(Colors.blue.shade700), - ) - .onPressed( - RemixButtonStyler().wrap(.scale(x: 0.95, y: 0.95)), - ); + .onHovered(.color(Colors.blue.shade700)) + .onPressed(.scale(0.95)); ``` ### Adding Animation @@ -145,14 +134,8 @@ final style = RemixButtonStyler() .color(Colors.blue) .borderRadiusAll(const Radius.circular(8)) .animate(AnimationConfig.spring(300.ms)) - .onHovered( - RemixButtonStyler() - .color(Colors.blue.shade700), - ) - .onPressed( - RemixButtonStyler() - .wrap(.scale(x: 0.95, y: 0.95)), - ); + .onHovered(.color(Colors.blue.shade700)) + .onPressed(.scale(0.95)); ``` This example animates both the color on hover and the scale on press, creating a smooth interactive experience for your users. @@ -217,9 +200,7 @@ Generated Fortal widgets call the matching `fortal*Styler` internally. Use those final style = fortalButtonStyler(variant: FortalButtonVariant.solid) .borderRadiusAll(const Radius.circular(8)) .paddingX(32) - .onHovered( - RemixButtonStyler().wrap(.scale(x: 1.05, y: 1.05)), - ); + .onHovered(.scale(1.05)); ``` ### Fortal Design Tokens diff --git a/packages/remix/analysis_options.yaml b/packages/remix/analysis_options.yaml index 63dd8693..576378dd 100644 --- a/packages/remix/analysis_options.yaml +++ b/packages/remix/analysis_options.yaml @@ -1,62 +1,5 @@ -dart_code_metrics: - extends: - - package:dart_code_metrics_presets/recommended.yaml - - package:dart_code_metrics_presets/metrics_recommended.yaml - metrics-exclude: - - test/** - rules-exclude: - - test/** - rules: - # avoid-collection-mutating-methods: true - newline-before-return: true - prefer-named-boolean-parameters: false - avoid-importing-entrypoint-exports: - only-in-src: true - prefer-match-file-name: false - avoid-suspicious-super-overrides: false - prefer-overriding-parent-equality: false - prefer-correct-callback-field-name: false - prefer-single-widget-per-file: false - match-getter-setter-field-names: false - prefer-dedicated-media-query-methods: false - avoid-shadowing: false - enum-constants-ordering: false - avoid-unsafe-collection-methods: false - prefer-prefixed-global-constants: false - avoid-returning-widgets: false - avoid-unnecessary-overrides: false - move-variable-closer-to-its-usage: false - arguments-ordering: - first: - - key - - spec - last: - - child - - children - - builder - avoid-nested-conditional-expressions: - acceptable-level: 3 - member-ordering: - order: - - public-fields - - private-fields - - constructors - - static-methods - - private-methods - - private-getters - - private-setters - - public-getters - - public-setters - - public-methods - - overridden-public-methods - - overridden-public-getters - - build-method - analyzer: errors: - # TODO: Remove after the remaining @MixableStyler components migrate to - # @MixableSpec(target: Widget.new). - deprecated_member_use: ignore non_constant_identifier_names: ignore linter: diff --git a/packages/remix/build.yaml b/packages/remix/build.yaml index 96cd41c0..d63ff53c 100644 --- a/packages/remix/build.yaml +++ b/packages/remix/build.yaml @@ -5,15 +5,18 @@ targets: enabled: true generate_for: - lib/**/*.dart - mix_generator|styler_generator: + mix_generator|spec_styler_generator: enabled: true generate_for: - lib/**/*.dart + # Remix stylers now come from @MixableSpec. The Fortal widget wrappers + # stay source-authored because a @MixWidget builder cannot resolve a + # Styler generated into the same library during a clean build. + mix_generator|styler_generator: + enabled: false mix_generator|mixable_generator: - enabled: true - generate_for: - - lib/components/**/*.dart + enabled: false mix_generator|mix_widget_generator: - enabled: true - generate_for: - - lib/**/*.dart + enabled: false + mix_generator|modifier_generator: + enabled: false diff --git a/packages/remix/lib/remix.dart b/packages/remix/lib/remix.dart index 0e20293d..c818461f 100644 --- a/packages/remix/lib/remix.dart +++ b/packages/remix/lib/remix.dart @@ -32,3 +32,9 @@ export 'package:naked_ui/naked_ui.dart' show OverlayPositionConfig; /// FORTAL export 'src/fortal/fortal.dart'; + +/// STYLER CONVENIENCES +export 'src/utilities/remix_style.dart' + show RemixBoxStylerAnchors, RemixBoxStylerMixin, RemixBoxStylerConvenience; +export 'src/utilities/selected_mixin.dart' + show SelectedWidgetStateVariantExtension; diff --git a/packages/remix/lib/src/components/accordion/accordion.g.dart b/packages/remix/lib/src/components/accordion/accordion.g.dart index 547754ee..fed0942e 100644 --- a/packages/remix/lib/src/components/accordion/accordion.g.dart +++ b/packages/remix/lib/src/components/accordion/accordion.g.dart @@ -107,148 +107,598 @@ mixin _$RemixAccordionSpec implements Spec, Diagnosticable { typedef _$RemixAccordionSpecMethods = _$RemixAccordionSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixAccordion]. -class FortalAccordion extends StatelessWidget { - const FortalAccordion({ - super.key, - this.variant = .surface, - this.size = .size2, - required this.value, - required this.child, - this.title, - this.leadingIcon, - this.trailingIcon, - this.builder, - this.enabled = true, - this.mouseCursor = SystemMouseCursors.click, - this.enableFeedback = true, - this.autofocus = false, - this.focusNode, - this.onFocusChange, - this.onHoverChange, - this.onPressChange, - this.semanticLabel, - this.transitionBuilder, - }); - - const FortalAccordion.surface({ - super.key, - this.size = .size2, - required this.value, - required this.child, - this.title, - this.leadingIcon, - this.trailingIcon, - this.builder, - this.enabled = true, - this.mouseCursor = SystemMouseCursors.click, - this.enableFeedback = true, - this.autofocus = false, - this.focusNode, - this.onFocusChange, - this.onHoverChange, - this.onPressChange, - this.semanticLabel, - this.transitionBuilder, - }) : variant = FortalAccordionVariant.surface; - - const FortalAccordion.soft({ - super.key, - this.size = .size2, - required this.value, - required this.child, - this.title, - this.leadingIcon, - this.trailingIcon, - this.builder, - this.enabled = true, - this.mouseCursor = SystemMouseCursors.click, - this.enableFeedback = true, - this.autofocus = false, - this.focusNode, - this.onFocusChange, - this.onHoverChange, - this.onPressChange, - this.semanticLabel, - this.transitionBuilder, - }) : variant = FortalAccordionVariant.soft; - - final FortalAccordionVariant variant; - - final FortalAccordionSize size; - - final T value; - - final Widget child; - - final String? title; - - final IconData? leadingIcon; - - final IconData? trailingIcon; - - final NakedAccordionTriggerBuilder? builder; - - final bool enabled; - - final MouseCursor mouseCursor; - - final bool enableFeedback; - - final bool autofocus; - - final FocusNode? focusNode; - - final ValueChanged? onFocusChange; - - final ValueChanged? onHoverChange; - - final ValueChanged? onPressChange; - - final String? semanticLabel; - - final Widget Function(Widget, Animation)? transitionBuilder; +class RemixAccordionStyler + extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $trigger; + final Prop>? $leadingIcon; + final Prop>? $title; + final Prop>? $trailingIcon; + final Prop>? $content; + + const RemixAccordionStyler.create({ + Prop>? trigger, + Prop>? leadingIcon, + Prop>? title, + Prop>? trailingIcon, + Prop>? content, + super.variants, + super.modifier, + super.animation, + }) : $trigger = trigger, + $leadingIcon = leadingIcon, + $title = title, + $trailingIcon = trailingIcon, + $content = content; + + RemixAccordionStyler({ + FlexBoxStyler? trigger, + IconStyler? leadingIcon, + TextStyler? title, + IconStyler? trailingIcon, + BoxStyler? content, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + trigger: Prop.maybeMix(trigger), + leadingIcon: Prop.maybeMix(leadingIcon), + title: Prop.maybeMix(title), + trailingIcon: Prop.maybeMix(trailingIcon), + content: Prop.maybeMix(content), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixAccordionStyler.trigger(FlexBoxStyler value) => + RemixAccordionStyler().trigger(value); + factory RemixAccordionStyler.leadingIcon(IconStyler value) => + RemixAccordionStyler().leadingIcon(value); + factory RemixAccordionStyler.title(TextStyler value) => + RemixAccordionStyler().title(value); + factory RemixAccordionStyler.trailingIcon(IconStyler value) => + RemixAccordionStyler().trailingIcon(value); + factory RemixAccordionStyler.content(BoxStyler value) => + RemixAccordionStyler().content(value); + factory RemixAccordionStyler.color(Color value) => + RemixAccordionStyler().color(value); + factory RemixAccordionStyler.gradient(GradientMix value) => + RemixAccordionStyler().gradient(value); + factory RemixAccordionStyler.border(BoxBorderMix value) => + RemixAccordionStyler().border(value); + factory RemixAccordionStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixAccordionStyler().borderRadius(value); + factory RemixAccordionStyler.elevation(ElevationShadow value) => + RemixAccordionStyler().elevation(value); + factory RemixAccordionStyler.shadow(BoxShadowMix value) => + RemixAccordionStyler().shadow(value); + factory RemixAccordionStyler.shadows(List value) => + RemixAccordionStyler().shadows(value); + factory RemixAccordionStyler.width(double value) => + RemixAccordionStyler().width(value); + factory RemixAccordionStyler.height(double value) => + RemixAccordionStyler().height(value); + factory RemixAccordionStyler.size(double width, double height) => + RemixAccordionStyler().size(width, height); + factory RemixAccordionStyler.minWidth(double value) => + RemixAccordionStyler().minWidth(value); + factory RemixAccordionStyler.maxWidth(double value) => + RemixAccordionStyler().maxWidth(value); + factory RemixAccordionStyler.minHeight(double value) => + RemixAccordionStyler().minHeight(value); + factory RemixAccordionStyler.maxHeight(double value) => + RemixAccordionStyler().maxHeight(value); + factory RemixAccordionStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixAccordionStyler().scale(scale, alignment: alignment); + factory RemixAccordionStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixAccordionStyler().rotate(radians, alignment: alignment); + factory RemixAccordionStyler.translate( + double x, + double y, [ + double z = 0.0, + ]) => RemixAccordionStyler().translate(x, y, z); + factory RemixAccordionStyler.skew(double skewX, double skewY) => + RemixAccordionStyler().skew(skewX, skewY); + factory RemixAccordionStyler.textStyle(TextStyler value) => + RemixAccordionStyler().textStyle(value); + factory RemixAccordionStyler.image(DecorationImageMix value) => + RemixAccordionStyler().image(value); + factory RemixAccordionStyler.shape(ShapeBorderMix value) => + RemixAccordionStyler().shape(value); + factory RemixAccordionStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixAccordionStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixAccordionStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixAccordionStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixAccordionStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixAccordionStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixAccordionStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixAccordionStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixAccordionStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixAccordionStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixAccordionStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixAccordionStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixAccordionStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixAccordionStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixAccordionStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixAccordionStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixAccordionStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixAccordionStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixAccordionStyler.row() => RemixAccordionStyler().row(); + factory RemixAccordionStyler.column() => RemixAccordionStyler().column(); + factory RemixAccordionStyler.alignment(AlignmentGeometry value) => + RemixAccordionStyler().alignment(value); + factory RemixAccordionStyler.padding(EdgeInsetsGeometryMix value) => + RemixAccordionStyler().padding(value); + factory RemixAccordionStyler.margin(EdgeInsetsGeometryMix value) => + RemixAccordionStyler().margin(value); + factory RemixAccordionStyler.constraints(BoxConstraintsMix value) => + RemixAccordionStyler().constraints(value); + factory RemixAccordionStyler.decoration(DecorationMix value) => + RemixAccordionStyler().decoration(value); + factory RemixAccordionStyler.foregroundDecoration(DecorationMix value) => + RemixAccordionStyler().foregroundDecoration(value); + factory RemixAccordionStyler.clipBehavior(Clip value) => + RemixAccordionStyler().clipBehavior(value); + factory RemixAccordionStyler.direction(Axis value) => + RemixAccordionStyler().direction(value); + factory RemixAccordionStyler.mainAxisAlignment(MainAxisAlignment value) => + RemixAccordionStyler().mainAxisAlignment(value); + factory RemixAccordionStyler.crossAxisAlignment(CrossAxisAlignment value) => + RemixAccordionStyler().crossAxisAlignment(value); + factory RemixAccordionStyler.mainAxisSize(MainAxisSize value) => + RemixAccordionStyler().mainAxisSize(value); + factory RemixAccordionStyler.spacing(double value) => + RemixAccordionStyler().spacing(value); + factory RemixAccordionStyler.verticalDirection(VerticalDirection value) => + RemixAccordionStyler().verticalDirection(value); + factory RemixAccordionStyler.textDirection(TextDirection value) => + RemixAccordionStyler().textDirection(value); + factory RemixAccordionStyler.textBaseline(TextBaseline value) => + RemixAccordionStyler().textBaseline(value); + factory RemixAccordionStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixAccordionStyler().transform(value, alignment: alignment); + + RemixAccordionStyler color(Color value) { + return trigger(FlexBoxStyler().color(value)); + } - @override - Widget build(BuildContext context) { - return fortalAccordionStyler( - variant: this.variant, - size: this.size, - ).call( - key: this.key, - value: this.value, - child: this.child, - title: this.title, - leadingIcon: this.leadingIcon, - trailingIcon: this.trailingIcon, - builder: this.builder, - enabled: this.enabled, - mouseCursor: this.mouseCursor, - enableFeedback: this.enableFeedback, - autofocus: this.autofocus, - focusNode: this.focusNode, - onFocusChange: this.onFocusChange, - onHoverChange: this.onHoverChange, - onPressChange: this.onPressChange, - semanticLabel: this.semanticLabel, - transitionBuilder: this.transitionBuilder, + RemixAccordionStyler gradient(GradientMix value) { + return trigger(FlexBoxStyler().gradient(value)); + } + + RemixAccordionStyler border(BoxBorderMix value) { + return trigger(FlexBoxStyler().border(value)); + } + + RemixAccordionStyler borderRadius(BorderRadiusGeometryMix value) { + return trigger(FlexBoxStyler().borderRadius(value)); + } + + RemixAccordionStyler elevation(ElevationShadow value) { + return trigger(FlexBoxStyler().elevation(value)); + } + + RemixAccordionStyler shadow(BoxShadowMix value) { + return trigger(FlexBoxStyler().shadow(value)); + } + + RemixAccordionStyler shadows(List value) { + return trigger(FlexBoxStyler().shadows(value)); + } + + RemixAccordionStyler width(double value) { + return trigger(FlexBoxStyler().width(value)); + } + + RemixAccordionStyler height(double value) { + return trigger(FlexBoxStyler().height(value)); + } + + RemixAccordionStyler size(double width, double height) { + return trigger(FlexBoxStyler().size(width, height)); + } + + RemixAccordionStyler minWidth(double value) { + return trigger(FlexBoxStyler().minWidth(value)); + } + + RemixAccordionStyler maxWidth(double value) { + return trigger(FlexBoxStyler().maxWidth(value)); + } + + RemixAccordionStyler minHeight(double value) { + return trigger(FlexBoxStyler().minHeight(value)); + } + + RemixAccordionStyler maxHeight(double value) { + return trigger(FlexBoxStyler().maxHeight(value)); + } + + RemixAccordionStyler scale(double scale, {Alignment alignment = .center}) { + return trigger(FlexBoxStyler().scale(scale, alignment: alignment)); + } + + RemixAccordionStyler rotate(double radians, {Alignment alignment = .center}) { + return trigger(FlexBoxStyler().rotate(radians, alignment: alignment)); + } + + RemixAccordionStyler translate(double x, double y, [double z = 0.0]) { + return trigger(FlexBoxStyler().translate(x, y, z)); + } + + RemixAccordionStyler skew(double skewX, double skewY) { + return trigger(FlexBoxStyler().skew(skewX, skewY)); + } + + RemixAccordionStyler textStyle(TextStyler value) { + return trigger(FlexBoxStyler().textStyle(value)); + } + + RemixAccordionStyler image(DecorationImageMix value) { + return trigger(FlexBoxStyler().image(value)); + } + + RemixAccordionStyler shape(ShapeBorderMix value) { + return trigger(FlexBoxStyler().shape(value)); + } + + RemixAccordionStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return trigger( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixAccordionStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return trigger( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixAccordionStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return trigger( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixAccordionStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return trigger( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixAccordionStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return trigger( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixAccordionStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return trigger( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixAccordionStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return trigger( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixAccordionStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return trigger( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixAccordionStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return trigger( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixAccordionStyler row() { + return trigger(FlexBoxStyler().row()); + } + + RemixAccordionStyler column() { + return trigger(FlexBoxStyler().column()); + } + + RemixAccordionStyler alignment(AlignmentGeometry value) { + return trigger(FlexBoxStyler().alignment(value)); + } + + RemixAccordionStyler padding(EdgeInsetsGeometryMix value) { + return trigger(FlexBoxStyler().padding(value)); + } + + RemixAccordionStyler margin(EdgeInsetsGeometryMix value) { + return trigger(FlexBoxStyler().margin(value)); + } -mixin _$RemixAccordionStylerMixin on Style, Diagnosticable { - Prop>? get $trigger; - Prop>? get $leadingIcon; - Prop>? get $title; - Prop>? get $trailingIcon; - Prop>? get $content; + RemixAccordionStyler constraints(BoxConstraintsMix value) { + return trigger(FlexBoxStyler().constraints(value)); + } + + RemixAccordionStyler decoration(DecorationMix value) { + return trigger(FlexBoxStyler().decoration(value)); + } + + RemixAccordionStyler foregroundDecoration(DecorationMix value) { + return trigger(FlexBoxStyler().foregroundDecoration(value)); + } + + RemixAccordionStyler clipBehavior(Clip value) { + return trigger(FlexBoxStyler().clipBehavior(value)); + } + + RemixAccordionStyler direction(Axis value) { + return trigger(FlexBoxStyler().direction(value)); + } + + RemixAccordionStyler mainAxisAlignment(MainAxisAlignment value) { + return trigger(FlexBoxStyler().mainAxisAlignment(value)); + } + + RemixAccordionStyler crossAxisAlignment(CrossAxisAlignment value) { + return trigger(FlexBoxStyler().crossAxisAlignment(value)); + } + + RemixAccordionStyler mainAxisSize(MainAxisSize value) { + return trigger(FlexBoxStyler().mainAxisSize(value)); + } + + RemixAccordionStyler spacing(double value) { + return trigger(FlexBoxStyler().spacing(value)); + } + + RemixAccordionStyler verticalDirection(VerticalDirection value) { + return trigger(FlexBoxStyler().verticalDirection(value)); + } + + RemixAccordionStyler textDirection(TextDirection value) { + return trigger(FlexBoxStyler().textDirection(value)); + } + + RemixAccordionStyler textBaseline(TextBaseline value) { + return trigger(FlexBoxStyler().textBaseline(value)); + } + + RemixAccordionStyler transform( + Matrix4 value, { + Alignment alignment = .center, + }) { + return trigger(FlexBoxStyler().transform(value, alignment: alignment)); + } /// Sets the trigger. RemixAccordionStyler trigger(FlexBoxStyler value) { @@ -276,16 +726,19 @@ mixin _$RemixAccordionStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixAccordionStyler animate(AnimationConfig value) { return merge(RemixAccordionStyler(animation: value)); } /// Sets the style variants. + @override RemixAccordionStyler variants(List> value) { return merge(RemixAccordionStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixAccordionStyler wrap(WidgetModifierConfig value) { return merge(RemixAccordionStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/accordion/accordion_spec.dart b/packages/remix/lib/src/components/accordion/accordion_spec.dart index 15b3f871..d1506ebb 100644 --- a/packages/remix/lib/src/components/accordion/accordion_spec.dart +++ b/packages/remix/lib/src/components/accordion/accordion_spec.dart @@ -1,9 +1,10 @@ part of 'accordion.dart'; /// Resolved visual properties for a [RemixAccordion]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixAccordionSpec with _$RemixAccordionSpec { @override + @MixableField(forwardStyler: true) final StyleSpec trigger; @override final StyleSpec leadingIcon; diff --git a/packages/remix/lib/src/components/accordion/accordion_style.dart b/packages/remix/lib/src/components/accordion/accordion_style.dart index dd6d804f..2689dff3 100644 --- a/packages/remix/lib/src/components/accordion/accordion_style.dart +++ b/packages/remix/lib/src/components/accordion/accordion_style.dart @@ -1,136 +1,7 @@ part of 'accordion.dart'; /// Style configuration for [RemixAccordion] trigger, icons, title, and content. -@MixableStyler() -class RemixAccordionStyler - extends RemixFlexContainerStyler - with Diagnosticable, _$RemixAccordionStylerMixin { - @MixableField(setterType: FlexBoxStyler) - final Prop>? $trigger; - @MixableField(setterType: IconStyler) - final Prop>? $leadingIcon; - @MixableField(setterType: TextStyler) - final Prop>? $title; - @MixableField(setterType: IconStyler) - final Prop>? $trailingIcon; - @MixableField(setterType: BoxStyler) - final Prop>? $content; - - const RemixAccordionStyler.create({ - Prop>? trigger, - Prop>? leadingIcon, - Prop>? title, - Prop>? trailingIcon, - Prop>? content, - super.variants, - super.animation, - super.modifier, - }) : $trigger = trigger, - $leadingIcon = leadingIcon, - $title = title, - $trailingIcon = trailingIcon, - $content = content; - - RemixAccordionStyler({ - FlexBoxStyler? trigger, - IconStyler? leadingIcon, - TextStyler? title, - IconStyler? trailingIcon, - BoxStyler? content, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - trigger: Prop.maybeMix(trigger), - leadingIcon: Prop.maybeMix(leadingIcon), - title: Prop.maybeMix(title), - trailingIcon: Prop.maybeMix(trailingIcon), - content: Prop.maybeMix(content), - variants: variants, - animation: animation, - modifier: modifier, - ); - - // -- Factory constructors for convenience -- - - /// Creates a style with the given background color. - factory RemixAccordionStyler.backgroundColor(Color value) => - RemixAccordionStyler().backgroundColor(value); - - /// Creates a style with the given padding. - factory RemixAccordionStyler.padding(EdgeInsetsGeometryMix value) => - RemixAccordionStyler().padding(value); - - /// Creates a style with the given margin. - factory RemixAccordionStyler.margin(EdgeInsetsGeometryMix value) => - RemixAccordionStyler().margin(value); - - /// Creates a style with the given decoration. - factory RemixAccordionStyler.decoration(DecorationMix value) => - RemixAccordionStyler().decoration(value); - - /// Creates a style with the given alignment. - factory RemixAccordionStyler.alignment(Alignment value) => - RemixAccordionStyler().alignment(value); - - /// Creates a style with the given constraints. - factory RemixAccordionStyler.constraints(BoxConstraintsMix value) => - RemixAccordionStyler().constraints(value); - - /// Creates a style with the given border radius. - factory RemixAccordionStyler.borderRadius(BorderRadiusGeometryMix value) => - RemixAccordionStyler().borderRadius(value); - - /// Creates a style with the given spacing. - factory RemixAccordionStyler.spacing(double value) => - RemixAccordionStyler().spacing(value); - - /// Creates a style with the given title color. - factory RemixAccordionStyler.titleColor(Color value) => - RemixAccordionStyler().titleColor(value); - - /// Creates a style with the given title font size. - factory RemixAccordionStyler.titleFontSize(double value) => - RemixAccordionStyler().titleFontSize(value); - - /// Creates a style with the given title font weight. - factory RemixAccordionStyler.titleFontWeight(FontWeight value) => - RemixAccordionStyler().titleFontWeight(value); - - /// Creates a style with the given title style. - factory RemixAccordionStyler.titleStyle(TextStyleMix value) => - RemixAccordionStyler().titleStyle(value); - - /// Creates a style with the given leading icon color. - factory RemixAccordionStyler.leadingIconColor(Color value) => - RemixAccordionStyler().leadingIconColor(value); - - /// Creates a style with the given leading icon size. - factory RemixAccordionStyler.leadingIconSize(double value) => - RemixAccordionStyler().leadingIconSize(value); - - /// Creates a style with the given trailing icon color. - factory RemixAccordionStyler.trailingIconColor(Color value) => - RemixAccordionStyler().trailingIconColor(value); - - /// Creates a style with the given trailing icon size. - factory RemixAccordionStyler.trailingIconSize(double value) => - RemixAccordionStyler().trailingIconSize(value); - - /// Creates a style with the given content color. - factory RemixAccordionStyler.contentColor(Color value) => - RemixAccordionStyler().contentColor(value); - - /// Creates a style with the given content padding. - factory RemixAccordionStyler.contentPadding(EdgeInsetsGeometryMix value) => - RemixAccordionStyler().contentPadding(value); - - /// Creates a style with the given content decoration. - factory RemixAccordionStyler.contentDecoration(DecorationMix value) => - RemixAccordionStyler().contentDecoration(value); - - // -- Convenience instance methods -- - +extension RemixAccordionStylerRemixHelpers on RemixAccordionStyler { /// Sets the background color of the trigger. RemixAccordionStyler backgroundColor(Color value) { return merge( @@ -140,11 +11,6 @@ class RemixAccordionStyler ); } - /// Sets the spacing between items in the trigger. - RemixAccordionStyler spacing(double value) { - return merge(RemixAccordionStyler(trigger: FlexBoxStyler(spacing: value))); - } - /// Sets title color. RemixAccordionStyler titleColor(Color value) { return title(TextStyler(style: TextStyleMix(color: value))); @@ -200,13 +66,6 @@ class RemixAccordionStyler return content(BoxStyler(decoration: value)); } - /// Sets container alignment - RemixAccordionStyler alignment(Alignment value) { - return merge( - RemixAccordionStyler(trigger: FlexBoxStyler(alignment: value)), - ); - } - /// Style when the accordion is expanded. RemixAccordionStyler onExpanded(RemixAccordionStyler value) { return variants([ @@ -298,87 +157,6 @@ class RemixAccordionStyler ); } - // RemixFlexContainerStyler mixin implementations - @override - RemixAccordionStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixAccordionStyler(trigger: FlexBoxStyler(padding: value))); - } - - @override - RemixAccordionStyler color(Color value) { - return merge( - RemixAccordionStyler( - trigger: FlexBoxStyler(decoration: BoxDecorationMix(color: value)), - ), - ); - } - - @override - RemixAccordionStyler size(double width, double height) { - return merge( - RemixAccordionStyler( - trigger: FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: width, - maxWidth: width, - minHeight: height, - maxHeight: height, - ), - ), - ), - ); - } - - @override - RemixAccordionStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixAccordionStyler( - trigger: FlexBoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - - @override - RemixAccordionStyler constraints(BoxConstraintsMix value) { - return merge( - RemixAccordionStyler(trigger: FlexBoxStyler(constraints: value)), - ); - } - - @override - RemixAccordionStyler decoration(DecorationMix value) { - return merge( - RemixAccordionStyler(trigger: FlexBoxStyler(decoration: value)), - ); - } - - @override - RemixAccordionStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixAccordionStyler(trigger: FlexBoxStyler(margin: value))); - } - - @override - RemixAccordionStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixAccordionStyler(trigger: FlexBoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixAccordionStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixAccordionStyler( - trigger: FlexBoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } - - @override RemixAccordionStyler flex(FlexStyler value) { return merge(RemixAccordionStyler(trigger: FlexBoxStyler().flex(value))); } diff --git a/packages/remix/lib/src/components/accordion/fortal_accordion_styles.dart b/packages/remix/lib/src/components/accordion/fortal_accordion_styles.dart index 79dcd0af..7722d016 100644 --- a/packages/remix/lib/src/components/accordion/fortal_accordion_styles.dart +++ b/packages/remix/lib/src/components/accordion/fortal_accordion_styles.dart @@ -7,7 +7,6 @@ enum FortalAccordionSize { size1, size2, size3 } enum FortalAccordionVariant { surface, soft } /// Fortal-themed preset for [RemixAccordion]. -@MixWidget(name: 'FortalAccordion') RemixAccordionStyler fortalAccordionStyler({ FortalAccordionVariant variant = .surface, FortalAccordionSize size = .size2, @@ -97,3 +96,132 @@ RemixAccordionStyler _fortalAccordionSizeStyler(FortalAccordionSize size) { ), }; } + +/// Fortal-themed preset for [RemixAccordion]. +class FortalAccordion extends StatelessWidget { + const FortalAccordion({ + super.key, + this.variant = .surface, + this.size = .size2, + required this.value, + required this.child, + this.title, + this.leadingIcon, + this.trailingIcon, + this.builder, + this.enabled = true, + this.mouseCursor = SystemMouseCursors.click, + this.enableFeedback = true, + this.autofocus = false, + this.focusNode, + this.onFocusChange, + this.onHoverChange, + this.onPressChange, + this.semanticLabel, + this.transitionBuilder, + }); + + const FortalAccordion.surface({ + super.key, + this.size = .size2, + required this.value, + required this.child, + this.title, + this.leadingIcon, + this.trailingIcon, + this.builder, + this.enabled = true, + this.mouseCursor = SystemMouseCursors.click, + this.enableFeedback = true, + this.autofocus = false, + this.focusNode, + this.onFocusChange, + this.onHoverChange, + this.onPressChange, + this.semanticLabel, + this.transitionBuilder, + }) : variant = FortalAccordionVariant.surface; + + const FortalAccordion.soft({ + super.key, + this.size = .size2, + required this.value, + required this.child, + this.title, + this.leadingIcon, + this.trailingIcon, + this.builder, + this.enabled = true, + this.mouseCursor = SystemMouseCursors.click, + this.enableFeedback = true, + this.autofocus = false, + this.focusNode, + this.onFocusChange, + this.onHoverChange, + this.onPressChange, + this.semanticLabel, + this.transitionBuilder, + }) : variant = FortalAccordionVariant.soft; + + final FortalAccordionVariant variant; + + final FortalAccordionSize size; + + final T value; + + final Widget child; + + final String? title; + + final IconData? leadingIcon; + + final IconData? trailingIcon; + + final NakedAccordionTriggerBuilder? builder; + + final bool enabled; + + final MouseCursor mouseCursor; + + final bool enableFeedback; + + final bool autofocus; + + final FocusNode? focusNode; + + final ValueChanged? onFocusChange; + + final ValueChanged? onHoverChange; + + final ValueChanged? onPressChange; + + final String? semanticLabel; + + final Widget Function(Widget, Animation)? transitionBuilder; + + @override + Widget build(BuildContext context) { + return fortalAccordionStyler( + variant: this.variant, + size: this.size, + ).call( + key: this.key, + value: this.value, + title: this.title, + leadingIcon: this.leadingIcon, + trailingIcon: this.trailingIcon, + enabled: this.enabled, + mouseCursor: this.mouseCursor, + enableFeedback: this.enableFeedback, + autofocus: this.autofocus, + focusNode: this.focusNode, + onFocusChange: this.onFocusChange, + onHoverChange: this.onHoverChange, + onPressChange: this.onPressChange, + semanticLabel: this.semanticLabel, + transitionBuilder: this.transitionBuilder, + child: this.child, + builder: this.builder, + ); + } +} diff --git a/packages/remix/lib/src/components/avatar/avatar.g.dart b/packages/remix/lib/src/components/avatar/avatar.g.dart index 26b457e4..c4b83789 100644 --- a/packages/remix/lib/src/components/avatar/avatar.g.dart +++ b/packages/remix/lib/src/components/avatar/avatar.g.dart @@ -91,101 +91,522 @@ mixin _$RemixAvatarSpec implements Spec, Diagnosticable { typedef _$RemixAvatarSpecMethods = _$RemixAvatarSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixAvatar]. -class FortalAvatar extends StatelessWidget { - const FortalAvatar({ - super.key, - this.variant = .soft, - this.size = .size2, - this.backgroundImage, - this.foregroundImage, - this.onBackgroundImageError, - this.onForegroundImageError, - this.child, - this.label, - this.labelBuilder, - this.icon, - this.iconBuilder, - }); - - const FortalAvatar.soft({ - super.key, - this.size = .size2, - this.backgroundImage, - this.foregroundImage, - this.onBackgroundImageError, - this.onForegroundImageError, - this.child, - this.label, - this.labelBuilder, - this.icon, - this.iconBuilder, - }) : variant = FortalAvatarVariant.soft; - - const FortalAvatar.solid({ - super.key, - this.size = .size2, - this.backgroundImage, - this.foregroundImage, - this.onBackgroundImageError, - this.onForegroundImageError, - this.child, - this.label, - this.labelBuilder, - this.icon, - this.iconBuilder, - }) : variant = FortalAvatarVariant.solid; - - final FortalAvatarVariant variant; - - final FortalAvatarSize size; - - final ImageProvider? backgroundImage; - - final ImageProvider? foregroundImage; - - final ImageErrorListener? onBackgroundImageError; - - final ImageErrorListener? onForegroundImageError; - - final Widget? child; - - final String? label; - - final RemixAvatarLabelBuilder? labelBuilder; - - final IconData? icon; - - final RemixAvatarIconBuilder? iconBuilder; +class RemixAvatarStyler extends MixStyler + with + RemixBoxStylerMixin, + LabelStyleMixin, + IconStyleMixin { + final Prop>? $container; + final Prop>? $label; + final Prop>? $icon; + + const RemixAvatarStyler.create({ + Prop>? container, + Prop>? label, + Prop>? icon, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $label = label, + $icon = icon; + + RemixAvatarStyler({ + BoxStyler? container, + TextStyler? label, + IconStyler? icon, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + label: Prop.maybeMix(label), + icon: Prop.maybeMix(icon), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixAvatarStyler.container(BoxStyler value) => + RemixAvatarStyler().container(value); + factory RemixAvatarStyler.label(TextStyler value) => + RemixAvatarStyler().label(value); + factory RemixAvatarStyler.icon(IconStyler value) => + RemixAvatarStyler().icon(value); + factory RemixAvatarStyler.alignment(AlignmentGeometry value) => + RemixAvatarStyler().alignment(value); + factory RemixAvatarStyler.padding(EdgeInsetsGeometryMix value) => + RemixAvatarStyler().padding(value); + factory RemixAvatarStyler.margin(EdgeInsetsGeometryMix value) => + RemixAvatarStyler().margin(value); + factory RemixAvatarStyler.constraints(BoxConstraintsMix value) => + RemixAvatarStyler().constraints(value); + factory RemixAvatarStyler.decoration(DecorationMix value) => + RemixAvatarStyler().decoration(value); + factory RemixAvatarStyler.foregroundDecoration(DecorationMix value) => + RemixAvatarStyler().foregroundDecoration(value); + factory RemixAvatarStyler.clipBehavior(Clip value) => + RemixAvatarStyler().clipBehavior(value); + factory RemixAvatarStyler.color(Color value) => + RemixAvatarStyler().color(value); + factory RemixAvatarStyler.gradient(GradientMix value) => + RemixAvatarStyler().gradient(value); + factory RemixAvatarStyler.border(BoxBorderMix value) => + RemixAvatarStyler().border(value); + factory RemixAvatarStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixAvatarStyler().borderRadius(value); + factory RemixAvatarStyler.elevation(ElevationShadow value) => + RemixAvatarStyler().elevation(value); + factory RemixAvatarStyler.shadow(BoxShadowMix value) => + RemixAvatarStyler().shadow(value); + factory RemixAvatarStyler.shadows(List value) => + RemixAvatarStyler().shadows(value); + factory RemixAvatarStyler.width(double value) => + RemixAvatarStyler().width(value); + factory RemixAvatarStyler.height(double value) => + RemixAvatarStyler().height(value); + factory RemixAvatarStyler.size(double width, double height) => + RemixAvatarStyler().size(width, height); + factory RemixAvatarStyler.minWidth(double value) => + RemixAvatarStyler().minWidth(value); + factory RemixAvatarStyler.maxWidth(double value) => + RemixAvatarStyler().maxWidth(value); + factory RemixAvatarStyler.minHeight(double value) => + RemixAvatarStyler().minHeight(value); + factory RemixAvatarStyler.maxHeight(double value) => + RemixAvatarStyler().maxHeight(value); + factory RemixAvatarStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixAvatarStyler().scale(scale, alignment: alignment); + factory RemixAvatarStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixAvatarStyler().rotate(radians, alignment: alignment); + factory RemixAvatarStyler.translate(double x, double y, [double z = 0.0]) => + RemixAvatarStyler().translate(x, y, z); + factory RemixAvatarStyler.skew(double skewX, double skewY) => + RemixAvatarStyler().skew(skewX, skewY); + factory RemixAvatarStyler.textStyle(TextStyler value) => + RemixAvatarStyler().textStyle(value); + factory RemixAvatarStyler.image(DecorationImageMix value) => + RemixAvatarStyler().image(value); + factory RemixAvatarStyler.shape(ShapeBorderMix value) => + RemixAvatarStyler().shape(value); + factory RemixAvatarStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixAvatarStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixAvatarStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixAvatarStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixAvatarStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixAvatarStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixAvatarStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixAvatarStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixAvatarStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixAvatarStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixAvatarStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixAvatarStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixAvatarStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixAvatarStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixAvatarStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixAvatarStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixAvatarStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixAvatarStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixAvatarStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixAvatarStyler().transform(value, alignment: alignment); + + RemixAvatarStyler alignment(AlignmentGeometry value) { + return container(BoxStyler().alignment(value)); + } - @override - Widget build(BuildContext context) { - return fortalAvatarStyler(variant: this.variant, size: this.size).call( - key: this.key, - backgroundImage: this.backgroundImage, - foregroundImage: this.foregroundImage, - onBackgroundImageError: this.onBackgroundImageError, - onForegroundImageError: this.onForegroundImageError, - child: this.child, - label: this.label, - labelBuilder: this.labelBuilder, - icon: this.icon, - iconBuilder: this.iconBuilder, + RemixAvatarStyler padding(EdgeInsetsGeometryMix value) { + return container(BoxStyler().padding(value)); + } + + RemixAvatarStyler margin(EdgeInsetsGeometryMix value) { + return container(BoxStyler().margin(value)); + } + + RemixAvatarStyler constraints(BoxConstraintsMix value) { + return container(BoxStyler().constraints(value)); + } + + RemixAvatarStyler decoration(DecorationMix value) { + return container(BoxStyler().decoration(value)); + } + + RemixAvatarStyler foregroundDecoration(DecorationMix value) { + return container(BoxStyler().foregroundDecoration(value)); + } + + RemixAvatarStyler clipBehavior(Clip value) { + return container(BoxStyler().clipBehavior(value)); + } + + RemixAvatarStyler color(Color value) { + return container(BoxStyler().color(value)); + } + + RemixAvatarStyler gradient(GradientMix value) { + return container(BoxStyler().gradient(value)); + } + + RemixAvatarStyler border(BoxBorderMix value) { + return container(BoxStyler().border(value)); + } + + RemixAvatarStyler borderRadius(BorderRadiusGeometryMix value) { + return container(BoxStyler().borderRadius(value)); + } + + RemixAvatarStyler elevation(ElevationShadow value) { + return container(BoxStyler().elevation(value)); + } + + RemixAvatarStyler shadow(BoxShadowMix value) { + return container(BoxStyler().shadow(value)); + } + + RemixAvatarStyler shadows(List value) { + return container(BoxStyler().shadows(value)); + } + + RemixAvatarStyler width(double value) { + return container(BoxStyler().width(value)); + } + + RemixAvatarStyler height(double value) { + return container(BoxStyler().height(value)); + } + + RemixAvatarStyler size(double width, double height) { + return container(BoxStyler().size(width, height)); + } + + RemixAvatarStyler minWidth(double value) { + return container(BoxStyler().minWidth(value)); + } + + RemixAvatarStyler maxWidth(double value) { + return container(BoxStyler().maxWidth(value)); + } + + RemixAvatarStyler minHeight(double value) { + return container(BoxStyler().minHeight(value)); + } + + RemixAvatarStyler maxHeight(double value) { + return container(BoxStyler().maxHeight(value)); + } + + RemixAvatarStyler scale(double scale, {Alignment alignment = .center}) { + return container(BoxStyler().scale(scale, alignment: alignment)); + } + + RemixAvatarStyler rotate(double radians, {Alignment alignment = .center}) { + return container(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixAvatarStyler translate(double x, double y, [double z = 0.0]) { + return container(BoxStyler().translate(x, y, z)); + } + + RemixAvatarStyler skew(double skewX, double skewY) { + return container(BoxStyler().skew(skewX, skewY)); + } + + RemixAvatarStyler textStyle(TextStyler value) { + return container(BoxStyler().textStyle(value)); + } + + RemixAvatarStyler image(DecorationImageMix value) { + return container(BoxStyler().image(value)); + } + + RemixAvatarStyler shape(ShapeBorderMix value) { + return container(BoxStyler().shape(value)); + } + + RemixAvatarStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixAvatarStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixAvatarStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixAvatarStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixAvatarStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixAvatarStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixAvatarStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixAvatarStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixAvatarStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } -mixin _$RemixAvatarStylerMixin on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $label; - Prop>? get $icon; + RemixAvatarStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(BoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixAvatarStyler container(BoxStyler value) { @@ -193,26 +614,31 @@ mixin _$RemixAvatarStylerMixin on Style, Diagnosticable { } /// Sets the label. + @override RemixAvatarStyler label(TextStyler value) { return merge(RemixAvatarStyler(label: value)); } /// Sets the icon. + @override RemixAvatarStyler icon(IconStyler value) { return merge(RemixAvatarStyler(icon: value)); } /// Sets the animation configuration. + @override RemixAvatarStyler animate(AnimationConfig value) { return merge(RemixAvatarStyler(animation: value)); } /// Sets the style variants. + @override RemixAvatarStyler variants(List> value) { return merge(RemixAvatarStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixAvatarStyler wrap(WidgetModifierConfig value) { return merge(RemixAvatarStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/avatar/avatar_spec.dart b/packages/remix/lib/src/components/avatar/avatar_spec.dart index 651b39f0..9b4e64a3 100644 --- a/packages/remix/lib/src/components/avatar/avatar_spec.dart +++ b/packages/remix/lib/src/components/avatar/avatar_spec.dart @@ -1,9 +1,12 @@ part of 'avatar.dart'; /// Resolved visual properties for a [RemixAvatar]. -@MixableSpec() +@MixableSpec( + extraStylerMixins: [RemixBoxStylerMixin, LabelStyleMixin, IconStyleMixin], +) class RemixAvatarSpec with _$RemixAvatarSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; @override final StyleSpec label; diff --git a/packages/remix/lib/src/components/avatar/avatar_style.dart b/packages/remix/lib/src/components/avatar/avatar_style.dart index 116902b7..490d1fa6 100644 --- a/packages/remix/lib/src/components/avatar/avatar_style.dart +++ b/packages/remix/lib/src/components/avatar/avatar_style.dart @@ -1,92 +1,7 @@ part of 'avatar.dart'; /// Style configuration for [RemixAvatar] container, label, and fallback icon. -@MixableStyler() -class RemixAvatarStyler - extends RemixContainerStyler - with - LabelStyleMixin, - IconStyleMixin, - Diagnosticable, - _$RemixAvatarStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $container; - @MixableField(setterType: TextStyler) - final Prop>? $label; - @MixableField(setterType: IconStyler) - final Prop>? $icon; - - const RemixAvatarStyler.create({ - Prop>? container, - Prop>? label, - Prop>? icon, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $label = label, - $icon = icon; - - RemixAvatarStyler({ - BoxStyler? container, - TextStyler? label, - IconStyler? icon, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - label: Prop.maybeMix(label), - icon: Prop.maybeMix(icon), - variants: variants, - animation: animation, - modifier: modifier, - ); - - // -- Factory constructors for convenience -- - - /// Creates a style with the given foreground color (text and icon). - factory RemixAvatarStyler.foregroundColor(Color value) => - RemixAvatarStyler().foregroundColor(value); - - /// Creates a style with the given background color. - factory RemixAvatarStyler.backgroundColor(Color value) => - RemixAvatarStyler().backgroundColor(value); - - /// Creates a style with the given padding. - factory RemixAvatarStyler.padding(EdgeInsetsGeometryMix value) => - RemixAvatarStyler().padding(value); - - /// Creates a style with the given margin. - factory RemixAvatarStyler.margin(EdgeInsetsGeometryMix value) => - RemixAvatarStyler().margin(value); - - /// Creates a style with the given decoration. - factory RemixAvatarStyler.decoration(DecorationMix value) => - RemixAvatarStyler().decoration(value); - - /// Creates a style with the given alignment. - factory RemixAvatarStyler.alignment(Alignment value) => - RemixAvatarStyler().alignment(value); - - /// Creates a style with the given constraints. - factory RemixAvatarStyler.constraints(BoxConstraintsMix value) => - RemixAvatarStyler().constraints(value); - - /// Creates a style with a square size. - factory RemixAvatarStyler.square(double size) => - RemixAvatarStyler().square(size); - - /// Creates a style with the given border radius. - factory RemixAvatarStyler.borderRadius(BorderRadiusGeometryMix radius) => - RemixAvatarStyler().borderRadius(radius); - - /// Creates a style with the given clip behavior. - factory RemixAvatarStyler.clipBehavior(Clip clip) => - RemixAvatarStyler().clipBehavior(clip); - - // -- Instance methods -- - +extension RemixAvatarStylerRemixHelpers on RemixAvatarStyler { /// Sets the foreground color (text and icon) of the avatar. RemixAvatarStyler foregroundColor(Color value) { return labelColor(value).iconColor(value); @@ -118,58 +33,6 @@ class RemixAvatarStyler ); } - /// Sets background color - RemixAvatarStyler color(Color value) { - return merge( - RemixAvatarStyler( - container: BoxStyler(decoration: BoxDecorationMix(color: value)), - ), - ); - } - - /// Sets border radius - RemixAvatarStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixAvatarStyler( - container: BoxStyler( - decoration: BoxDecorationMix(borderRadius: radius, shape: .rectangle), - ), - ), - ); - } - - // Additional convenience methods that delegate to container - - /// Sets padding - RemixAvatarStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixAvatarStyler(container: BoxStyler(padding: value))); - } - - /// Sets margin - RemixAvatarStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixAvatarStyler(container: BoxStyler(margin: value))); - } - - /// Sets container alignment - RemixAvatarStyler alignment(Alignment value) { - return merge(RemixAvatarStyler(container: BoxStyler(alignment: value))); - } - - /// Sets decoration - RemixAvatarStyler decoration(DecorationMix value) { - return merge(RemixAvatarStyler(container: BoxStyler(decoration: value))); - } - - /// Sets constraints - RemixAvatarStyler constraints(BoxConstraintsMix value) { - return merge(RemixAvatarStyler(container: BoxStyler(constraints: value))); - } - - /// Sets the clip behavior for the avatar container. - RemixAvatarStyler clipBehavior(Clip clip) { - return merge(RemixAvatarStyler(container: BoxStyler(clipBehavior: clip))); - } - /// Creates a [RemixAvatar] widget with this style applied. RemixAvatar call({ Key? key, @@ -197,49 +60,4 @@ class RemixAvatarStyler child: child, ); } - - @override - RemixAvatarStyler label(TextStyler value) { - return merge(RemixAvatarStyler(label: value)); - } - - // Instance methods (chainable) - - /// Sets avatar size with width and height - @override - RemixAvatarStyler size(double width, double height) { - return merge( - RemixAvatarStyler( - container: BoxStyler( - constraints: BoxConstraintsMix( - minWidth: width, - maxWidth: width, - minHeight: height, - maxHeight: height, - ), - ), - ), - ); - } - - // Abstract method implementations for mixins (only missing ones) - - @override - RemixAvatarStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixAvatarStyler(container: BoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixAvatarStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixAvatarStyler( - container: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } } diff --git a/packages/remix/lib/src/components/avatar/fortal_avatar_styles.dart b/packages/remix/lib/src/components/avatar/fortal_avatar_styles.dart index 48948071..48e58a00 100644 --- a/packages/remix/lib/src/components/avatar/fortal_avatar_styles.dart +++ b/packages/remix/lib/src/components/avatar/fortal_avatar_styles.dart @@ -7,7 +7,6 @@ enum FortalAvatarSize { size1, size2, size3, size4 } enum FortalAvatarVariant { soft, solid } /// Fortal-themed preset for [RemixAvatar]. -@MixWidget(name: 'FortalAvatar') RemixAvatarStyler fortalAvatarStyler({ FortalAvatarVariant variant = .soft, FortalAvatarSize size = .size2, @@ -61,3 +60,87 @@ RemixAvatarStyler _fortalAvatarSizeStyler(FortalAvatarSize size) { .labelStyle(FortalTokens.text4.mix()), }; } + +/// Fortal-themed preset for [RemixAvatar]. +class FortalAvatar extends StatelessWidget { + const FortalAvatar({ + super.key, + this.variant = .soft, + this.size = .size2, + this.backgroundImage, + this.foregroundImage, + this.onBackgroundImageError, + this.onForegroundImageError, + this.child, + this.label, + this.labelBuilder, + this.icon, + this.iconBuilder, + }); + + const FortalAvatar.soft({ + super.key, + this.size = .size2, + this.backgroundImage, + this.foregroundImage, + this.onBackgroundImageError, + this.onForegroundImageError, + this.child, + this.label, + this.labelBuilder, + this.icon, + this.iconBuilder, + }) : variant = FortalAvatarVariant.soft; + + const FortalAvatar.solid({ + super.key, + this.size = .size2, + this.backgroundImage, + this.foregroundImage, + this.onBackgroundImageError, + this.onForegroundImageError, + this.child, + this.label, + this.labelBuilder, + this.icon, + this.iconBuilder, + }) : variant = FortalAvatarVariant.solid; + + final FortalAvatarVariant variant; + + final FortalAvatarSize size; + + final ImageProvider? backgroundImage; + + final ImageProvider? foregroundImage; + + final ImageErrorListener? onBackgroundImageError; + + final ImageErrorListener? onForegroundImageError; + + final Widget? child; + + final String? label; + + final RemixAvatarLabelBuilder? labelBuilder; + + final IconData? icon; + + final RemixAvatarIconBuilder? iconBuilder; + + @override + Widget build(BuildContext context) { + return fortalAvatarStyler(variant: this.variant, size: this.size).call( + key: this.key, + backgroundImage: this.backgroundImage, + foregroundImage: this.foregroundImage, + onBackgroundImageError: this.onBackgroundImageError, + onForegroundImageError: this.onForegroundImageError, + label: this.label, + labelBuilder: this.labelBuilder, + icon: this.icon, + iconBuilder: this.iconBuilder, + child: this.child, + ); + } +} diff --git a/packages/remix/lib/src/components/badge/badge.g.dart b/packages/remix/lib/src/components/badge/badge.g.dart index ebaf45b9..bb960c2d 100644 --- a/packages/remix/lib/src/components/badge/badge.g.dart +++ b/packages/remix/lib/src/components/badge/badge.g.dart @@ -86,80 +86,514 @@ mixin _$RemixBadgeSpec implements Spec, Diagnosticable { typedef _$RemixBadgeSpecMethods = _$RemixBadgeSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixBadge]. -class FortalBadge extends StatelessWidget { - const FortalBadge({ - super.key, - this.variant = .solid, - this.size = .size2, - this.label, - this.child, - this.labelBuilder, - }); - - const FortalBadge.solid({ - super.key, - this.size = .size2, - this.label, - this.child, - this.labelBuilder, - }) : variant = FortalBadgeVariant.solid; - - const FortalBadge.soft({ - super.key, - this.size = .size2, - this.label, - this.child, - this.labelBuilder, - }) : variant = FortalBadgeVariant.soft; - - const FortalBadge.surface({ - super.key, - this.size = .size2, - this.label, - this.child, - this.labelBuilder, - }) : variant = FortalBadgeVariant.surface; - - const FortalBadge.outline({ - super.key, - this.size = .size2, - this.label, - this.child, - this.labelBuilder, - }) : variant = FortalBadgeVariant.outline; - - final FortalBadgeVariant variant; - - final FortalBadgeSize size; - - final String? label; - - final Widget? child; - - final RemixBadgeLabelBuilder? labelBuilder; - - @override - Widget build(BuildContext context) { - return fortalBadgeStyler(variant: this.variant, size: this.size).call( - key: this.key, - label: this.label, - child: this.child, - labelBuilder: this.labelBuilder, +class RemixBadgeStyler extends MixStyler + with + RemixBoxStylerMixin, + LabelStyleMixin { + final Prop>? $container; + final Prop>? $label; + + const RemixBadgeStyler.create({ + Prop>? container, + Prop>? label, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $label = label; + + RemixBadgeStyler({ + BoxStyler? container, + TextStyler? label, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + label: Prop.maybeMix(label), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixBadgeStyler.container(BoxStyler value) => + RemixBadgeStyler().container(value); + factory RemixBadgeStyler.label(TextStyler value) => + RemixBadgeStyler().label(value); + factory RemixBadgeStyler.alignment(AlignmentGeometry value) => + RemixBadgeStyler().alignment(value); + factory RemixBadgeStyler.padding(EdgeInsetsGeometryMix value) => + RemixBadgeStyler().padding(value); + factory RemixBadgeStyler.margin(EdgeInsetsGeometryMix value) => + RemixBadgeStyler().margin(value); + factory RemixBadgeStyler.constraints(BoxConstraintsMix value) => + RemixBadgeStyler().constraints(value); + factory RemixBadgeStyler.decoration(DecorationMix value) => + RemixBadgeStyler().decoration(value); + factory RemixBadgeStyler.foregroundDecoration(DecorationMix value) => + RemixBadgeStyler().foregroundDecoration(value); + factory RemixBadgeStyler.clipBehavior(Clip value) => + RemixBadgeStyler().clipBehavior(value); + factory RemixBadgeStyler.color(Color value) => + RemixBadgeStyler().color(value); + factory RemixBadgeStyler.gradient(GradientMix value) => + RemixBadgeStyler().gradient(value); + factory RemixBadgeStyler.border(BoxBorderMix value) => + RemixBadgeStyler().border(value); + factory RemixBadgeStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixBadgeStyler().borderRadius(value); + factory RemixBadgeStyler.elevation(ElevationShadow value) => + RemixBadgeStyler().elevation(value); + factory RemixBadgeStyler.shadow(BoxShadowMix value) => + RemixBadgeStyler().shadow(value); + factory RemixBadgeStyler.shadows(List value) => + RemixBadgeStyler().shadows(value); + factory RemixBadgeStyler.width(double value) => + RemixBadgeStyler().width(value); + factory RemixBadgeStyler.height(double value) => + RemixBadgeStyler().height(value); + factory RemixBadgeStyler.size(double width, double height) => + RemixBadgeStyler().size(width, height); + factory RemixBadgeStyler.minWidth(double value) => + RemixBadgeStyler().minWidth(value); + factory RemixBadgeStyler.maxWidth(double value) => + RemixBadgeStyler().maxWidth(value); + factory RemixBadgeStyler.minHeight(double value) => + RemixBadgeStyler().minHeight(value); + factory RemixBadgeStyler.maxHeight(double value) => + RemixBadgeStyler().maxHeight(value); + factory RemixBadgeStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixBadgeStyler().scale(scale, alignment: alignment); + factory RemixBadgeStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixBadgeStyler().rotate(radians, alignment: alignment); + factory RemixBadgeStyler.translate(double x, double y, [double z = 0.0]) => + RemixBadgeStyler().translate(x, y, z); + factory RemixBadgeStyler.skew(double skewX, double skewY) => + RemixBadgeStyler().skew(skewX, skewY); + factory RemixBadgeStyler.textStyle(TextStyler value) => + RemixBadgeStyler().textStyle(value); + factory RemixBadgeStyler.image(DecorationImageMix value) => + RemixBadgeStyler().image(value); + factory RemixBadgeStyler.shape(ShapeBorderMix value) => + RemixBadgeStyler().shape(value); + factory RemixBadgeStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixBadgeStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixBadgeStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixBadgeStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixBadgeStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixBadgeStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixBadgeStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixBadgeStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixBadgeStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixBadgeStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixBadgeStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixBadgeStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixBadgeStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixBadgeStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixBadgeStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixBadgeStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixBadgeStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixBadgeStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixBadgeStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixBadgeStyler().transform(value, alignment: alignment); + + RemixBadgeStyler alignment(AlignmentGeometry value) { + return container(BoxStyler().alignment(value)); + } + + RemixBadgeStyler padding(EdgeInsetsGeometryMix value) { + return container(BoxStyler().padding(value)); + } + + RemixBadgeStyler margin(EdgeInsetsGeometryMix value) { + return container(BoxStyler().margin(value)); + } + + RemixBadgeStyler constraints(BoxConstraintsMix value) { + return container(BoxStyler().constraints(value)); + } + + RemixBadgeStyler decoration(DecorationMix value) { + return container(BoxStyler().decoration(value)); + } + + RemixBadgeStyler foregroundDecoration(DecorationMix value) { + return container(BoxStyler().foregroundDecoration(value)); + } + + RemixBadgeStyler clipBehavior(Clip value) { + return container(BoxStyler().clipBehavior(value)); + } + + RemixBadgeStyler color(Color value) { + return container(BoxStyler().color(value)); + } + + RemixBadgeStyler gradient(GradientMix value) { + return container(BoxStyler().gradient(value)); + } + + RemixBadgeStyler border(BoxBorderMix value) { + return container(BoxStyler().border(value)); + } + + RemixBadgeStyler borderRadius(BorderRadiusGeometryMix value) { + return container(BoxStyler().borderRadius(value)); + } + + RemixBadgeStyler elevation(ElevationShadow value) { + return container(BoxStyler().elevation(value)); + } + + RemixBadgeStyler shadow(BoxShadowMix value) { + return container(BoxStyler().shadow(value)); + } + + RemixBadgeStyler shadows(List value) { + return container(BoxStyler().shadows(value)); + } + + RemixBadgeStyler width(double value) { + return container(BoxStyler().width(value)); + } + + RemixBadgeStyler height(double value) { + return container(BoxStyler().height(value)); + } + + RemixBadgeStyler size(double width, double height) { + return container(BoxStyler().size(width, height)); + } + + RemixBadgeStyler minWidth(double value) { + return container(BoxStyler().minWidth(value)); + } + + RemixBadgeStyler maxWidth(double value) { + return container(BoxStyler().maxWidth(value)); + } + + RemixBadgeStyler minHeight(double value) { + return container(BoxStyler().minHeight(value)); + } + + RemixBadgeStyler maxHeight(double value) { + return container(BoxStyler().maxHeight(value)); + } + + RemixBadgeStyler scale(double scale, {Alignment alignment = .center}) { + return container(BoxStyler().scale(scale, alignment: alignment)); + } + + RemixBadgeStyler rotate(double radians, {Alignment alignment = .center}) { + return container(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixBadgeStyler translate(double x, double y, [double z = 0.0]) { + return container(BoxStyler().translate(x, y, z)); + } + + RemixBadgeStyler skew(double skewX, double skewY) { + return container(BoxStyler().skew(skewX, skewY)); + } + + RemixBadgeStyler textStyle(TextStyler value) { + return container(BoxStyler().textStyle(value)); + } + + RemixBadgeStyler image(DecorationImageMix value) { + return container(BoxStyler().image(value)); + } + + RemixBadgeStyler shape(ShapeBorderMix value) { + return container(BoxStyler().shape(value)); + } + + RemixBadgeStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixBadgeStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixBadgeStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixBadgeStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixBadgeStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixBadgeStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixBadgeStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixBadgeStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixBadgeStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } -mixin _$RemixBadgeStylerMixin on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $label; + RemixBadgeStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(BoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixBadgeStyler container(BoxStyler value) { @@ -167,21 +601,25 @@ mixin _$RemixBadgeStylerMixin on Style, Diagnosticable { } /// Sets the label. + @override RemixBadgeStyler label(TextStyler value) { return merge(RemixBadgeStyler(label: value)); } /// Sets the animation configuration. + @override RemixBadgeStyler animate(AnimationConfig value) { return merge(RemixBadgeStyler(animation: value)); } /// Sets the style variants. + @override RemixBadgeStyler variants(List> value) { return merge(RemixBadgeStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixBadgeStyler wrap(WidgetModifierConfig value) { return merge(RemixBadgeStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/badge/badge_spec.dart b/packages/remix/lib/src/components/badge/badge_spec.dart index de31537e..aaf5290d 100644 --- a/packages/remix/lib/src/components/badge/badge_spec.dart +++ b/packages/remix/lib/src/components/badge/badge_spec.dart @@ -1,9 +1,10 @@ part of 'badge.dart'; /// Resolved visual properties for a [RemixBadge]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin, LabelStyleMixin]) class RemixBadgeSpec with _$RemixBadgeSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; @override final StyleSpec label; diff --git a/packages/remix/lib/src/components/badge/badge_style.dart b/packages/remix/lib/src/components/badge/badge_style.dart index 909210d7..2f164659 100644 --- a/packages/remix/lib/src/components/badge/badge_style.dart +++ b/packages/remix/lib/src/components/badge/badge_style.dart @@ -1,73 +1,7 @@ part of 'badge.dart'; /// Style configuration for [RemixBadge] container and label text. -@MixableStyler() -class RemixBadgeStyler - extends RemixContainerStyler - with - LabelStyleMixin, - Diagnosticable, - _$RemixBadgeStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $container; - @MixableField(setterType: TextStyler) - final Prop>? $label; - - const RemixBadgeStyler.create({ - Prop>? container, - Prop>? label, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $label = label; - - RemixBadgeStyler({ - BoxStyler? container, - TextStyler? label, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - label: Prop.maybeMix(label), - variants: variants, - animation: animation, - modifier: modifier, - ); - - // -- Factory constructors for convenience -- - - /// Creates a style with the given background color. - factory RemixBadgeStyler.backgroundColor(Color value) => - RemixBadgeStyler().backgroundColor(value); - - /// Creates a style with the given foreground color (text). - factory RemixBadgeStyler.foregroundColor(Color value) => - RemixBadgeStyler().foregroundColor(value); - - /// Creates a style with the given padding. - factory RemixBadgeStyler.padding(EdgeInsetsGeometryMix value) => - RemixBadgeStyler().padding(value); - - /// Creates a style with the given margin. - factory RemixBadgeStyler.margin(EdgeInsetsGeometryMix value) => - RemixBadgeStyler().margin(value); - - /// Creates a style with the given decoration. - factory RemixBadgeStyler.decoration(DecorationMix value) => - RemixBadgeStyler().decoration(value); - - /// Creates a style with the given alignment. - factory RemixBadgeStyler.alignment(Alignment value) => - RemixBadgeStyler().alignment(value); - - /// Creates a style with the given constraints. - factory RemixBadgeStyler.constraints(BoxConstraintsMix value) => - RemixBadgeStyler().constraints(value); - - // Instance methods (chainable) - +extension RemixBadgeStylerRemixHelpers on RemixBadgeStyler { /// Sets background color RemixBadgeStyler backgroundColor(Color value) { return merge( @@ -82,39 +16,6 @@ class RemixBadgeStyler return labelColor(value); } - /// Sets border radius - RemixBadgeStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixBadgeStyler( - container: BoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - - /// Sets padding - RemixBadgeStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixBadgeStyler(container: BoxStyler(padding: value))); - } - - // Additional convenience methods that delegate to container - - /// Sets margin - RemixBadgeStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixBadgeStyler(container: BoxStyler(margin: value))); - } - - /// Sets decoration - RemixBadgeStyler decoration(DecorationMix value) { - return merge(RemixBadgeStyler(container: BoxStyler(decoration: value))); - } - - /// Sets container alignment - RemixBadgeStyler alignment(Alignment value) { - return merge(RemixBadgeStyler(container: BoxStyler(alignment: value))); - } - /// Creates a [RemixBadge] widget with this style applied. RemixBadge call({ Key? key, @@ -130,36 +31,4 @@ class RemixBadgeStyler child: child, ); } - - @override - RemixBadgeStyler label(TextStyler value) { - return merge(RemixBadgeStyler(label: value)); - } - - /// Sets constraints - @override - RemixBadgeStyler constraints(BoxConstraintsMix value) { - return merge(RemixBadgeStyler(container: BoxStyler(constraints: value))); - } - - // Abstract method implementations for mixins - - @override - RemixBadgeStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixBadgeStyler(container: BoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixBadgeStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixBadgeStyler( - container: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } } diff --git a/packages/remix/lib/src/components/badge/fortal_badge_styles.dart b/packages/remix/lib/src/components/badge/fortal_badge_styles.dart index fd38a117..8cca5226 100644 --- a/packages/remix/lib/src/components/badge/fortal_badge_styles.dart +++ b/packages/remix/lib/src/components/badge/fortal_badge_styles.dart @@ -7,7 +7,6 @@ enum FortalBadgeSize { size1, size2, size3 } enum FortalBadgeVariant { solid, soft, surface, outline } /// Fortal-themed preset for [RemixBadge]. -@MixWidget(name: 'FortalBadge') RemixBadgeStyler fortalBadgeStyler({ FortalBadgeVariant variant = .solid, FortalBadgeSize size = .size2, @@ -81,3 +80,67 @@ RemixBadgeStyler _fortalBadgeSizeStyler(FortalBadgeSize size) { ), }; } + +/// Fortal-themed preset for [RemixBadge]. +class FortalBadge extends StatelessWidget { + const FortalBadge({ + super.key, + this.variant = .solid, + this.size = .size2, + this.label, + this.child, + this.labelBuilder, + }); + + const FortalBadge.solid({ + super.key, + this.size = .size2, + this.label, + this.child, + this.labelBuilder, + }) : variant = FortalBadgeVariant.solid; + + const FortalBadge.soft({ + super.key, + this.size = .size2, + this.label, + this.child, + this.labelBuilder, + }) : variant = FortalBadgeVariant.soft; + + const FortalBadge.surface({ + super.key, + this.size = .size2, + this.label, + this.child, + this.labelBuilder, + }) : variant = FortalBadgeVariant.surface; + + const FortalBadge.outline({ + super.key, + this.size = .size2, + this.label, + this.child, + this.labelBuilder, + }) : variant = FortalBadgeVariant.outline; + + final FortalBadgeVariant variant; + + final FortalBadgeSize size; + + final String? label; + + final Widget? child; + + final RemixBadgeLabelBuilder? labelBuilder; + + @override + Widget build(BuildContext context) { + return fortalBadgeStyler(variant: this.variant, size: this.size).call( + key: this.key, + label: this.label, + labelBuilder: this.labelBuilder, + child: this.child, + ); + } +} diff --git a/packages/remix/lib/src/components/button/button.g.dart b/packages/remix/lib/src/components/button/button.g.dart index 2d344c80..19a2ea3b 100644 --- a/packages/remix/lib/src/components/button/button.g.dart +++ b/packages/remix/lib/src/components/button/button.g.dart @@ -101,231 +101,595 @@ mixin _$RemixButtonSpec implements Spec, Diagnosticable { typedef _$RemixButtonSpecMethods = _$RemixButtonSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed button style and widget presets. -class FortalButton extends StatelessWidget { - const FortalButton({ - super.key, - this.variant = .solid, - this.size = .size2, - required this.label, - this.leadingIcon, - this.trailingIcon, - this.textBuilder, - this.leadingIconBuilder, - this.trailingIconBuilder, - this.loadingBuilder, - this.loading = false, - this.enabled = true, - this.onPressed, - this.onLongPress, - this.focusNode, - this.autofocus = false, - this.enableFeedback = true, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - this.mouseCursor = SystemMouseCursors.click, - }); - - /// High-emphasis filled button. - const FortalButton.solid({ - super.key, - this.size = .size2, - required this.label, - this.leadingIcon, - this.trailingIcon, - this.textBuilder, - this.leadingIconBuilder, - this.trailingIconBuilder, - this.loadingBuilder, - this.loading = false, - this.enabled = true, - this.onPressed, - this.onLongPress, - this.focusNode, - this.autofocus = false, - this.enableFeedback = true, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalButtonVariant.solid; - - /// Low-emphasis filled button. - const FortalButton.soft({ - super.key, - this.size = .size2, - required this.label, - this.leadingIcon, - this.trailingIcon, - this.textBuilder, - this.leadingIconBuilder, - this.trailingIconBuilder, - this.loadingBuilder, - this.loading = false, - this.enabled = true, - this.onPressed, - this.onLongPress, - this.focusNode, - this.autofocus = false, - this.enableFeedback = true, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalButtonVariant.soft; - - /// Subtle surface button with a border. - const FortalButton.surface({ - super.key, - this.size = .size2, - required this.label, - this.leadingIcon, - this.trailingIcon, - this.textBuilder, - this.leadingIconBuilder, - this.trailingIconBuilder, - this.loadingBuilder, - this.loading = false, - this.enabled = true, - this.onPressed, - this.onLongPress, - this.focusNode, - this.autofocus = false, - this.enableFeedback = true, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalButtonVariant.surface; - - /// Transparent button with an outline. - const FortalButton.outline({ - super.key, - this.size = .size2, - required this.label, - this.leadingIcon, - this.trailingIcon, - this.textBuilder, - this.leadingIconBuilder, - this.trailingIconBuilder, - this.loadingBuilder, - this.loading = false, - this.enabled = true, - this.onPressed, - this.onLongPress, - this.focusNode, - this.autofocus = false, - this.enableFeedback = true, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalButtonVariant.outline; - - /// Transparent button without a persistent border. - const FortalButton.ghost({ - super.key, - this.size = .size2, - required this.label, - this.leadingIcon, - this.trailingIcon, - this.textBuilder, - this.leadingIconBuilder, - this.trailingIconBuilder, - this.loadingBuilder, - this.loading = false, - this.enabled = true, - this.onPressed, - this.onLongPress, - this.focusNode, - this.autofocus = false, - this.enableFeedback = true, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalButtonVariant.ghost; - - final FortalButtonVariant variant; - - final FortalButtonSize size; - - final String label; - - final IconData? leadingIcon; - - final IconData? trailingIcon; - - final RemixButtonTextBuilder? textBuilder; - - final RemixButtonIconBuilder? leadingIconBuilder; - - final RemixButtonIconBuilder? trailingIconBuilder; - - final RemixButtonLoadingBuilder? loadingBuilder; - - final bool loading; - - final bool enabled; - - final VoidCallback? onPressed; - - final VoidCallback? onLongPress; - - final FocusNode? focusNode; - - final bool autofocus; - - final bool enableFeedback; - - final String? semanticLabel; - - final String? semanticHint; - - final bool excludeSemantics; - - final MouseCursor mouseCursor; +class RemixButtonStyler extends MixStyler + with + RemixBoxStylerMixin, + LabelStyleMixin, + IconStyleMixin, + SpinnerStyleMixin { + final Prop>? $container; + final Prop>? $label; + final Prop>? $icon; + final Prop>? $spinner; + final Prop? $iconAlignment; + + const RemixButtonStyler.create({ + Prop>? container, + Prop>? label, + Prop>? icon, + Prop>? spinner, + Prop? iconAlignment, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $label = label, + $icon = icon, + $spinner = spinner, + $iconAlignment = iconAlignment; + + RemixButtonStyler({ + FlexBoxStyler? container, + TextStyler? label, + IconStyler? icon, + RemixSpinnerStyler? spinner, + IconAlignment? iconAlignment, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + label: Prop.maybeMix(label), + icon: Prop.maybeMix(icon), + spinner: Prop.maybeMix(spinner), + iconAlignment: Prop.maybe(iconAlignment), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixButtonStyler.container(FlexBoxStyler value) => + RemixButtonStyler().container(value); + factory RemixButtonStyler.label(TextStyler value) => + RemixButtonStyler().label(value); + factory RemixButtonStyler.icon(IconStyler value) => + RemixButtonStyler().icon(value); + factory RemixButtonStyler.spinner(RemixSpinnerStyler value) => + RemixButtonStyler().spinner(value); + factory RemixButtonStyler.iconAlignment(IconAlignment value) => + RemixButtonStyler().iconAlignment(value); + factory RemixButtonStyler.color(Color value) => + RemixButtonStyler().color(value); + factory RemixButtonStyler.gradient(GradientMix value) => + RemixButtonStyler().gradient(value); + factory RemixButtonStyler.border(BoxBorderMix value) => + RemixButtonStyler().border(value); + factory RemixButtonStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixButtonStyler().borderRadius(value); + factory RemixButtonStyler.elevation(ElevationShadow value) => + RemixButtonStyler().elevation(value); + factory RemixButtonStyler.shadow(BoxShadowMix value) => + RemixButtonStyler().shadow(value); + factory RemixButtonStyler.shadows(List value) => + RemixButtonStyler().shadows(value); + factory RemixButtonStyler.width(double value) => + RemixButtonStyler().width(value); + factory RemixButtonStyler.height(double value) => + RemixButtonStyler().height(value); + factory RemixButtonStyler.size(double width, double height) => + RemixButtonStyler().size(width, height); + factory RemixButtonStyler.minWidth(double value) => + RemixButtonStyler().minWidth(value); + factory RemixButtonStyler.maxWidth(double value) => + RemixButtonStyler().maxWidth(value); + factory RemixButtonStyler.minHeight(double value) => + RemixButtonStyler().minHeight(value); + factory RemixButtonStyler.maxHeight(double value) => + RemixButtonStyler().maxHeight(value); + factory RemixButtonStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixButtonStyler().scale(scale, alignment: alignment); + factory RemixButtonStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixButtonStyler().rotate(radians, alignment: alignment); + factory RemixButtonStyler.translate(double x, double y, [double z = 0.0]) => + RemixButtonStyler().translate(x, y, z); + factory RemixButtonStyler.skew(double skewX, double skewY) => + RemixButtonStyler().skew(skewX, skewY); + factory RemixButtonStyler.textStyle(TextStyler value) => + RemixButtonStyler().textStyle(value); + factory RemixButtonStyler.image(DecorationImageMix value) => + RemixButtonStyler().image(value); + factory RemixButtonStyler.shape(ShapeBorderMix value) => + RemixButtonStyler().shape(value); + factory RemixButtonStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixButtonStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixButtonStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixButtonStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixButtonStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixButtonStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixButtonStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixButtonStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixButtonStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixButtonStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixButtonStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixButtonStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixButtonStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixButtonStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixButtonStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixButtonStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixButtonStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixButtonStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixButtonStyler.row() => RemixButtonStyler().row(); + factory RemixButtonStyler.column() => RemixButtonStyler().column(); + factory RemixButtonStyler.alignment(AlignmentGeometry value) => + RemixButtonStyler().alignment(value); + factory RemixButtonStyler.padding(EdgeInsetsGeometryMix value) => + RemixButtonStyler().padding(value); + factory RemixButtonStyler.margin(EdgeInsetsGeometryMix value) => + RemixButtonStyler().margin(value); + factory RemixButtonStyler.constraints(BoxConstraintsMix value) => + RemixButtonStyler().constraints(value); + factory RemixButtonStyler.decoration(DecorationMix value) => + RemixButtonStyler().decoration(value); + factory RemixButtonStyler.foregroundDecoration(DecorationMix value) => + RemixButtonStyler().foregroundDecoration(value); + factory RemixButtonStyler.clipBehavior(Clip value) => + RemixButtonStyler().clipBehavior(value); + factory RemixButtonStyler.direction(Axis value) => + RemixButtonStyler().direction(value); + factory RemixButtonStyler.mainAxisAlignment(MainAxisAlignment value) => + RemixButtonStyler().mainAxisAlignment(value); + factory RemixButtonStyler.crossAxisAlignment(CrossAxisAlignment value) => + RemixButtonStyler().crossAxisAlignment(value); + factory RemixButtonStyler.mainAxisSize(MainAxisSize value) => + RemixButtonStyler().mainAxisSize(value); + factory RemixButtonStyler.spacing(double value) => + RemixButtonStyler().spacing(value); + factory RemixButtonStyler.verticalDirection(VerticalDirection value) => + RemixButtonStyler().verticalDirection(value); + factory RemixButtonStyler.textDirection(TextDirection value) => + RemixButtonStyler().textDirection(value); + factory RemixButtonStyler.textBaseline(TextBaseline value) => + RemixButtonStyler().textBaseline(value); + factory RemixButtonStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixButtonStyler().transform(value, alignment: alignment); + + RemixButtonStyler color(Color value) { + return container(FlexBoxStyler().color(value)); + } - @override - Widget build(BuildContext context) { - return fortalButtonStyler(variant: this.variant, size: this.size).call( - key: this.key, - label: this.label, - leadingIcon: this.leadingIcon, - trailingIcon: this.trailingIcon, - textBuilder: this.textBuilder, - leadingIconBuilder: this.leadingIconBuilder, - trailingIconBuilder: this.trailingIconBuilder, - loadingBuilder: this.loadingBuilder, - loading: this.loading, - enabled: this.enabled, - onPressed: this.onPressed, - onLongPress: this.onLongPress, - focusNode: this.focusNode, - autofocus: this.autofocus, - enableFeedback: this.enableFeedback, - semanticLabel: this.semanticLabel, - semanticHint: this.semanticHint, - excludeSemantics: this.excludeSemantics, - mouseCursor: this.mouseCursor, + RemixButtonStyler gradient(GradientMix value) { + return container(FlexBoxStyler().gradient(value)); + } + + RemixButtonStyler border(BoxBorderMix value) { + return container(FlexBoxStyler().border(value)); + } + + RemixButtonStyler borderRadius(BorderRadiusGeometryMix value) { + return container(FlexBoxStyler().borderRadius(value)); + } + + RemixButtonStyler elevation(ElevationShadow value) { + return container(FlexBoxStyler().elevation(value)); + } + + RemixButtonStyler shadow(BoxShadowMix value) { + return container(FlexBoxStyler().shadow(value)); + } + + RemixButtonStyler shadows(List value) { + return container(FlexBoxStyler().shadows(value)); + } + + RemixButtonStyler width(double value) { + return container(FlexBoxStyler().width(value)); + } + + RemixButtonStyler height(double value) { + return container(FlexBoxStyler().height(value)); + } + + RemixButtonStyler size(double width, double height) { + return container(FlexBoxStyler().size(width, height)); + } + + RemixButtonStyler minWidth(double value) { + return container(FlexBoxStyler().minWidth(value)); + } + + RemixButtonStyler maxWidth(double value) { + return container(FlexBoxStyler().maxWidth(value)); + } + + RemixButtonStyler minHeight(double value) { + return container(FlexBoxStyler().minHeight(value)); + } + + RemixButtonStyler maxHeight(double value) { + return container(FlexBoxStyler().maxHeight(value)); + } + + RemixButtonStyler scale(double scale, {Alignment alignment = .center}) { + return container(FlexBoxStyler().scale(scale, alignment: alignment)); + } + + RemixButtonStyler rotate(double radians, {Alignment alignment = .center}) { + return container(FlexBoxStyler().rotate(radians, alignment: alignment)); + } + + RemixButtonStyler translate(double x, double y, [double z = 0.0]) { + return container(FlexBoxStyler().translate(x, y, z)); + } + + RemixButtonStyler skew(double skewX, double skewY) { + return container(FlexBoxStyler().skew(skewX, skewY)); + } + + RemixButtonStyler textStyle(TextStyler value) { + return container(FlexBoxStyler().textStyle(value)); + } + + RemixButtonStyler image(DecorationImageMix value) { + return container(FlexBoxStyler().image(value)); + } + + RemixButtonStyler shape(ShapeBorderMix value) { + return container(FlexBoxStyler().shape(value)); + } + + RemixButtonStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixButtonStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } -mixin _$RemixButtonStylerMixin on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $label; - Prop>? get $icon; - Prop>? get $spinner; - Prop? get $iconAlignment; + RemixButtonStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixButtonStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixButtonStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixButtonStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixButtonStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixButtonStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixButtonStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixButtonStyler row() { + return container(FlexBoxStyler().row()); + } + + RemixButtonStyler column() { + return container(FlexBoxStyler().column()); + } + + RemixButtonStyler alignment(AlignmentGeometry value) { + return container(FlexBoxStyler().alignment(value)); + } + + RemixButtonStyler padding(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().padding(value)); + } + + RemixButtonStyler margin(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().margin(value)); + } + + RemixButtonStyler constraints(BoxConstraintsMix value) { + return container(FlexBoxStyler().constraints(value)); + } + + RemixButtonStyler decoration(DecorationMix value) { + return container(FlexBoxStyler().decoration(value)); + } + + RemixButtonStyler foregroundDecoration(DecorationMix value) { + return container(FlexBoxStyler().foregroundDecoration(value)); + } + + RemixButtonStyler clipBehavior(Clip value) { + return container(FlexBoxStyler().clipBehavior(value)); + } + + RemixButtonStyler direction(Axis value) { + return container(FlexBoxStyler().direction(value)); + } + + RemixButtonStyler mainAxisAlignment(MainAxisAlignment value) { + return container(FlexBoxStyler().mainAxisAlignment(value)); + } + + RemixButtonStyler crossAxisAlignment(CrossAxisAlignment value) { + return container(FlexBoxStyler().crossAxisAlignment(value)); + } + + RemixButtonStyler mainAxisSize(MainAxisSize value) { + return container(FlexBoxStyler().mainAxisSize(value)); + } + + RemixButtonStyler spacing(double value) { + return container(FlexBoxStyler().spacing(value)); + } + + RemixButtonStyler verticalDirection(VerticalDirection value) { + return container(FlexBoxStyler().verticalDirection(value)); + } + + RemixButtonStyler textDirection(TextDirection value) { + return container(FlexBoxStyler().textDirection(value)); + } + + RemixButtonStyler textBaseline(TextBaseline value) { + return container(FlexBoxStyler().textBaseline(value)); + } + + RemixButtonStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(FlexBoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixButtonStyler container(FlexBoxStyler value) { @@ -333,16 +697,19 @@ mixin _$RemixButtonStylerMixin on Style, Diagnosticable { } /// Sets the label. + @override RemixButtonStyler label(TextStyler value) { return merge(RemixButtonStyler(label: value)); } /// Sets the icon. + @override RemixButtonStyler icon(IconStyler value) { return merge(RemixButtonStyler(icon: value)); } /// Sets the spinner. + @override RemixButtonStyler spinner(RemixSpinnerStyler value) { return merge(RemixButtonStyler(spinner: value)); } @@ -353,16 +720,19 @@ mixin _$RemixButtonStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixButtonStyler animate(AnimationConfig value) { return merge(RemixButtonStyler(animation: value)); } /// Sets the style variants. + @override RemixButtonStyler variants(List> value) { return merge(RemixButtonStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixButtonStyler wrap(WidgetModifierConfig value) { return merge(RemixButtonStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/button/button_spec.dart b/packages/remix/lib/src/components/button/button_spec.dart index 02eacde1..de227d47 100644 --- a/packages/remix/lib/src/components/button/button_spec.dart +++ b/packages/remix/lib/src/components/button/button_spec.dart @@ -54,14 +54,21 @@ part of 'button.dart'; /// - [RemixButtonStyler] for the styling API /// - [RemixButton] for the widget implementation /// - [Spec] for the base specification pattern -@MixableSpec() +@MixableSpec( + extraStylerMixins: [ + RemixBoxStylerMixin, + LabelStyleMixin, + IconStyleMixin, + SpinnerStyleMixin, + ], +) class RemixButtonSpec with _$RemixButtonSpec { /// Styling specification for the button's container. /// /// Controls the button's layout, background, borders, padding, /// and other visual container properties. Uses [FlexBoxSpec] /// to support flexible layout arrangements. - @MixableField(ignoreSetter: true, skipFactory: true) + @MixableField(forwardStyler: true) @override final StyleSpec container; @@ -69,7 +76,6 @@ class RemixButtonSpec with _$RemixButtonSpec { /// /// Defines typography, color, and text-specific properties /// when the button displays text content. - @MixableField(ignoreSetter: true, skipFactory: true) @override final StyleSpec label; @@ -77,7 +83,6 @@ class RemixButtonSpec with _$RemixButtonSpec { /// /// Controls icon size, color, and positioning when an icon /// is displayed alongside or instead of text. - @MixableField(ignoreSetter: true, skipFactory: true) @override final StyleSpec icon; @@ -85,7 +90,6 @@ class RemixButtonSpec with _$RemixButtonSpec { /// /// Defines the appearance of the spinner shown during /// asynchronous operations when the button is in loading state. - @MixableField(ignoreSetter: true, skipFactory: true) @override final StyleSpec spinner; diff --git a/packages/remix/lib/src/components/button/button_style.dart b/packages/remix/lib/src/components/button/button_style.dart index c8c0a89f..5f7c4127 100644 --- a/packages/remix/lib/src/components/button/button_style.dart +++ b/packages/remix/lib/src/components/button/button_style.dart @@ -5,74 +5,7 @@ part of 'button.dart'; /// Use this class to style the button container, label, icons, and loading /// spinner. It supports Mix variants and widget state variants for focused, /// hovered, pressed, disabled, and loading states. -@MixableStyler() -class RemixButtonStyler extends MixStyler - with - LabelStyleMixin, - IconStyleMixin, - SpinnerStyleMixin, - _$RemixButtonStylerMixin { - /// Style applied to the button's outer layout and decoration. - @MixableField(setterType: FlexBoxStyler) - final Prop>? $container; - - /// Style applied to the button label. - @MixableField(setterType: TextStyler) - final Prop>? $label; - - /// Style applied to leading and trailing icons. - @MixableField(setterType: IconStyler) - final Prop>? $icon; - - /// Style applied to the loading spinner. - @MixableField(setterType: RemixSpinnerStyler) - final Prop>? $spinner; - - /// Alignment used when rendering an icon next to the label. - final Prop? $iconAlignment; - - /// Creates a button style from raw Mix properties. - const RemixButtonStyler.create({ - Prop>? container, - Prop>? label, - Prop>? icon, - Prop>? spinner, - Prop? iconAlignment, - super.variants, - super.modifier, - super.animation, - }) : $container = container, - $label = label, - $icon = icon, - $spinner = spinner, - $iconAlignment = iconAlignment; - - /// Creates a button style from plain Dart values and Mix stylers. - RemixButtonStyler({ - FlexBoxStyler? container, - TextStyler? label, - IconStyler? icon, - RemixSpinnerStyler? spinner, - IconAlignment? iconAlignment, - AnimationConfig? animation, - WidgetModifierConfig? modifier, - List>? variants, - }) : this.create( - container: Prop.maybeMix(container), - label: Prop.maybeMix(label), - icon: Prop.maybeMix(icon), - spinner: Prop.maybeMix(spinner), - iconAlignment: Prop.maybe(iconAlignment), - variants: variants, - modifier: modifier, - animation: animation, - ); - - /// Creates a button style that only sets [IconAlignment]. - factory RemixButtonStyler.iconAlignment(IconAlignment value) { - return RemixButtonStyler().iconAlignment(value); - } - +extension RemixButtonStylerRemixHelpers on RemixButtonStyler { /// Creates a [RemixButton] widget with this style applied. RemixButton call({ Key? key, @@ -121,10 +54,6 @@ class RemixButtonStyler extends MixStyler } extension RemixButtonStyleContainerHelpers on RemixButtonStyler { - RemixButtonStyler padding(EdgeInsetsGeometryMix value) { - return container(FlexBoxStyler(padding: value)); - } - RemixButtonStyler paddingTop(double value) { return padding(EdgeInsetsGeometryMix.top(value)); } @@ -192,10 +121,6 @@ extension RemixButtonStyleContainerHelpers on RemixButtonStyler { ); } - RemixButtonStyler margin(EdgeInsetsGeometryMix value) { - return container(FlexBoxStyler(margin: value)); - } - RemixButtonStyler marginTop(double value) { return margin(EdgeInsetsGeometryMix.top(value)); } @@ -263,22 +188,6 @@ extension RemixButtonStyleContainerHelpers on RemixButtonStyler { ); } - RemixButtonStyler decoration(DecorationMix value) { - return container(FlexBoxStyler(decoration: value)); - } - - RemixButtonStyler foregroundDecoration(DecorationMix value) { - return container(FlexBoxStyler(foregroundDecoration: value)); - } - - RemixButtonStyler alignment(AlignmentGeometry value) { - return container(FlexBoxStyler(alignment: value)); - } - - RemixButtonStyler constraints(BoxConstraintsMix value) { - return container(FlexBoxStyler(constraints: value)); - } - RemixButtonStyler constraintsOnly({ double? width, double? height, @@ -297,34 +206,6 @@ extension RemixButtonStyleContainerHelpers on RemixButtonStyler { ); } - RemixButtonStyler width(double value) { - return constraints(BoxConstraintsMix.width(value)); - } - - RemixButtonStyler height(double value) { - return constraints(BoxConstraintsMix.height(value)); - } - - RemixButtonStyler minWidth(double value) { - return constraints(BoxConstraintsMix.minWidth(value)); - } - - RemixButtonStyler maxWidth(double value) { - return constraints(BoxConstraintsMix.maxWidth(value)); - } - - RemixButtonStyler minHeight(double value) { - return constraints(BoxConstraintsMix.minHeight(value)); - } - - RemixButtonStyler maxHeight(double value) { - return constraints(BoxConstraintsMix.maxHeight(value)); - } - - RemixButtonStyler size(double width, double height) { - return constraintsOnly(width: width, height: height); - } - RemixButtonStyler minimumSize(Size value) { return constraintsOnly(minWidth: value.width, minHeight: value.height); } @@ -346,98 +227,29 @@ extension RemixButtonStyleContainerHelpers on RemixButtonStyler { return container(FlexBoxStyler().flex(value)); } - RemixButtonStyler direction(Axis value) { - return container(FlexBoxStyler(direction: value)); - } - - RemixButtonStyler mainAxisAlignment(MainAxisAlignment value) { - return container(FlexBoxStyler(mainAxisAlignment: value)); - } - - RemixButtonStyler crossAxisAlignment(CrossAxisAlignment value) { - return container(FlexBoxStyler(crossAxisAlignment: value)); - } - - RemixButtonStyler mainAxisSize(MainAxisSize value) { - return container(FlexBoxStyler(mainAxisSize: value)); - } - - RemixButtonStyler verticalDirection(VerticalDirection value) { - return container(FlexBoxStyler(verticalDirection: value)); - } - - RemixButtonStyler textDirection(TextDirection value) { - return container(FlexBoxStyler(textDirection: value)); - } - - RemixButtonStyler textBaseline(TextBaseline value) { - return container(FlexBoxStyler(textBaseline: value)); - } - - RemixButtonStyler spacing(double value) { - return container(FlexBoxStyler(spacing: value)); - } - - RemixButtonStyler row() { - return direction(.horizontal); - } - - RemixButtonStyler column() { - return direction(.vertical); - } - - RemixButtonStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, + /// Rotates the complete button with a widget modifier. + /// + /// Use [RemixButtonStyler.rotate] for the generated container transform + /// shortcut. + RemixButtonStyler modifierRotate( + double radians, { + Alignment alignment = .center, }) { - return container( - FlexBoxStyler(transform: value, transformAlignment: alignment), - ); - } - - RemixButtonStyler rotate(double radians, {Alignment alignment = .center}) { return wrap(.rotate(radians: radians, alignment: alignment)); } - RemixButtonStyler scale(double value, {Alignment alignment = .center}) { - return transform( - Matrix4.diagonal3Values(value, value, 1.0), - alignment: alignment, - ); - } - - RemixButtonStyler translate(double x, double y, [double z = 0.0]) { - return transform(Matrix4.translationValues(x, y, z)); - } - - RemixButtonStyler skew(double skewX, double skewY) { - final matrix = Matrix4.identity() - ..setEntry(0, 1, skewX) - ..setEntry(1, 0, skewY); - - return transform(matrix); - } - RemixButtonStyler transformReset() { return transform(Matrix4.identity()); } } extension RemixButtonStyleDecorationHelpers on RemixButtonStyler { - RemixButtonStyler color(Color value) { - return decoration(BoxDecorationMix(color: value)); - } - RemixButtonStyler backgroundColor(Color value) => color(value); RemixButtonStyler foregroundColor(Color value) { return label(.color(value)).icon(.color(value)); } - RemixButtonStyler border(BoxBorderMix value) { - return decoration(BoxDecorationMix(border: value)); - } - RemixButtonStyler borderTop({ Color? color, double? width, @@ -584,10 +396,6 @@ extension RemixButtonStyleDecorationHelpers on RemixButtonStyler { ); } - RemixButtonStyler borderRadius(BorderRadiusGeometryMix value) { - return decoration(BoxDecorationMix(borderRadius: value)); - } - RemixButtonStyler borderRadiusAll(Radius radius) { return borderRadius(BorderRadiusGeometryMix.all(radius)); } @@ -692,14 +500,6 @@ extension RemixButtonStyleDecorationHelpers on RemixButtonStyler { return borderRadius(BorderRadiusGeometryMix.bottomEnd(.circular(radius))); } - RemixButtonStyler shadow(BoxShadowMix value) { - return decoration(BoxDecorationMix(boxShadow: [value])); - } - - RemixButtonStyler shadows(List value) { - return decoration(BoxDecorationMix(boxShadow: value)); - } - RemixButtonStyler shadowOnly({ Color? color, Offset? offset, @@ -720,26 +520,10 @@ extension RemixButtonStyleDecorationHelpers on RemixButtonStyler { return shadows(value); } - RemixButtonStyler elevation(ElevationShadow value) { - return container(FlexBoxStyler().elevation(value)); - } - RemixButtonStyler boxElevation(ElevationShadow value) { return elevation(value); } - RemixButtonStyler gradient(GradientMix value) { - return container(FlexBoxStyler().gradient(value)); - } - - RemixButtonStyler image(DecorationImageMix value) { - return container(FlexBoxStyler().image(value)); - } - - RemixButtonStyler shape(ShapeBorderMix value) { - return decoration(ShapeDecorationMix(shape: value)); - } - RemixButtonStyler shapeCircle({BorderSideMix? side}) { return shape(CircleBorderMix(side: side)); } @@ -823,168 +607,4 @@ extension RemixButtonStyleDecorationHelpers on RemixButtonStyler { RoundedSuperellipseBorderMix(borderRadius: borderRadius, side: side), ); } - - RemixButtonStyler backgroundImage( - ImageProvider image, { - BoxFit? fit, - AlignmentGeometry? alignment, - ImageRepeat repeat = .noRepeat, - }) { - return container( - FlexBoxStyler().backgroundImage( - image, - fit: fit, - alignment: alignment, - repeat: repeat, - ), - ); - } - - RemixButtonStyler backgroundImageUrl( - String url, { - BoxFit? fit, - AlignmentGeometry? alignment, - ImageRepeat repeat = .noRepeat, - }) { - return backgroundImage( - NetworkImage(url), - fit: fit, - alignment: alignment, - repeat: repeat, - ); - } - - RemixButtonStyler backgroundImageAsset( - String path, { - BoxFit? fit, - AlignmentGeometry? alignment, - ImageRepeat repeat = .noRepeat, - }) { - return backgroundImage( - AssetImage(path), - fit: fit, - alignment: alignment, - repeat: repeat, - ); - } - - RemixButtonStyler foregroundLinearGradient({ - required List colors, - List? stops, - AlignmentGeometry? begin, - AlignmentGeometry? end, - TileMode? tileMode, - }) { - return container( - FlexBoxStyler().foregroundLinearGradient( - colors: colors, - stops: stops, - begin: begin, - end: end, - tileMode: tileMode, - ), - ); - } - - RemixButtonStyler foregroundRadialGradient({ - required List colors, - List? stops, - AlignmentGeometry? center, - double? radius, - AlignmentGeometry? focal, - double? focalRadius, - TileMode? tileMode, - }) { - return container( - FlexBoxStyler().foregroundRadialGradient( - colors: colors, - stops: stops, - center: center, - radius: radius, - focal: focal, - focalRadius: focalRadius, - tileMode: tileMode, - ), - ); - } - - RemixButtonStyler foregroundSweepGradient({ - required List colors, - List? stops, - AlignmentGeometry? center, - double? startAngle, - double? endAngle, - TileMode? tileMode, - }) { - return container( - FlexBoxStyler().foregroundSweepGradient( - colors: colors, - stops: stops, - center: center, - startAngle: startAngle, - endAngle: endAngle, - tileMode: tileMode, - ), - ); - } - - RemixButtonStyler linearGradient({ - required List colors, - List? stops, - AlignmentGeometry? begin, - AlignmentGeometry? end, - TileMode? tileMode, - }) { - return container( - FlexBoxStyler().linearGradient( - colors: colors, - stops: stops, - begin: begin, - end: end, - tileMode: tileMode, - ), - ); - } - - RemixButtonStyler radialGradient({ - required List colors, - List? stops, - AlignmentGeometry? center, - double? radius, - AlignmentGeometry? focal, - double? focalRadius, - TileMode? tileMode, - }) { - return container( - FlexBoxStyler().radialGradient( - colors: colors, - stops: stops, - center: center, - radius: radius, - focal: focal, - focalRadius: focalRadius, - tileMode: tileMode, - ), - ); - } - - RemixButtonStyler sweepGradient({ - required List colors, - List? stops, - AlignmentGeometry? center, - double? startAngle, - double? endAngle, - TileMode? tileMode, - }) { - return container( - FlexBoxStyler().sweepGradient( - colors: colors, - stops: stops, - center: center, - startAngle: startAngle, - endAngle: endAngle, - tileMode: tileMode, - ), - ); - } } diff --git a/packages/remix/lib/src/components/button/button_widget.dart b/packages/remix/lib/src/components/button/button_widget.dart index 995fb9b2..647f8439 100644 --- a/packages/remix/lib/src/components/button/button_widget.dart +++ b/packages/remix/lib/src/components/button/button_widget.dart @@ -89,7 +89,7 @@ class RemixButton extends StatelessWidget { /// Protocol and inspection tooling should project this effective style so /// it observes the same layout defaults as [build]. static RemixButtonStyler composeStyle(RemixButtonStyler style) => - .new().mainAxisSize(.min).merge(style); + .mainAxisSize(.min).merge(style); static final styleFrom = RemixButtonStyler.new; diff --git a/packages/remix/lib/src/components/button/fortal_button_styles.dart b/packages/remix/lib/src/components/button/fortal_button_styles.dart index 60aa5d40..cda88506 100644 --- a/packages/remix/lib/src/components/button/fortal_button_styles.dart +++ b/packages/remix/lib/src/components/button/fortal_button_styles.dart @@ -34,7 +34,6 @@ enum FortalButtonVariant { } /// Fortal-themed button style and widget presets. -@MixWidget(name: 'FortalButton') RemixButtonStyler fortalButtonStyler({ FortalButtonVariant variant = .solid, FortalButtonSize size = .size2, @@ -237,3 +236,215 @@ RemixButtonStyler _fortalButtonSizeStyler(FortalButtonSize size) { .spinner(.size(24.0)), }; } + +/// Fortal-themed button style and widget presets. +class FortalButton extends StatelessWidget { + const FortalButton({ + super.key, + this.variant = .solid, + this.size = .size2, + required this.label, + this.leadingIcon, + this.trailingIcon, + this.textBuilder, + this.leadingIconBuilder, + this.trailingIconBuilder, + this.loadingBuilder, + this.loading = false, + this.enabled = true, + this.onPressed, + this.onLongPress, + this.focusNode, + this.autofocus = false, + this.enableFeedback = true, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + this.mouseCursor = SystemMouseCursors.click, + }); + + /// High-emphasis filled button. + const FortalButton.solid({ + super.key, + this.size = .size2, + required this.label, + this.leadingIcon, + this.trailingIcon, + this.textBuilder, + this.leadingIconBuilder, + this.trailingIconBuilder, + this.loadingBuilder, + this.loading = false, + this.enabled = true, + this.onPressed, + this.onLongPress, + this.focusNode, + this.autofocus = false, + this.enableFeedback = true, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalButtonVariant.solid; + + /// Low-emphasis filled button. + const FortalButton.soft({ + super.key, + this.size = .size2, + required this.label, + this.leadingIcon, + this.trailingIcon, + this.textBuilder, + this.leadingIconBuilder, + this.trailingIconBuilder, + this.loadingBuilder, + this.loading = false, + this.enabled = true, + this.onPressed, + this.onLongPress, + this.focusNode, + this.autofocus = false, + this.enableFeedback = true, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalButtonVariant.soft; + + /// Subtle surface button with a border. + const FortalButton.surface({ + super.key, + this.size = .size2, + required this.label, + this.leadingIcon, + this.trailingIcon, + this.textBuilder, + this.leadingIconBuilder, + this.trailingIconBuilder, + this.loadingBuilder, + this.loading = false, + this.enabled = true, + this.onPressed, + this.onLongPress, + this.focusNode, + this.autofocus = false, + this.enableFeedback = true, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalButtonVariant.surface; + + /// Transparent button with an outline. + const FortalButton.outline({ + super.key, + this.size = .size2, + required this.label, + this.leadingIcon, + this.trailingIcon, + this.textBuilder, + this.leadingIconBuilder, + this.trailingIconBuilder, + this.loadingBuilder, + this.loading = false, + this.enabled = true, + this.onPressed, + this.onLongPress, + this.focusNode, + this.autofocus = false, + this.enableFeedback = true, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalButtonVariant.outline; + + /// Transparent button without a persistent border. + const FortalButton.ghost({ + super.key, + this.size = .size2, + required this.label, + this.leadingIcon, + this.trailingIcon, + this.textBuilder, + this.leadingIconBuilder, + this.trailingIconBuilder, + this.loadingBuilder, + this.loading = false, + this.enabled = true, + this.onPressed, + this.onLongPress, + this.focusNode, + this.autofocus = false, + this.enableFeedback = true, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalButtonVariant.ghost; + + final FortalButtonVariant variant; + + final FortalButtonSize size; + + final String label; + + final IconData? leadingIcon; + + final IconData? trailingIcon; + + final RemixButtonTextBuilder? textBuilder; + + final RemixButtonIconBuilder? leadingIconBuilder; + + final RemixButtonIconBuilder? trailingIconBuilder; + + final RemixButtonLoadingBuilder? loadingBuilder; + + final bool loading; + + final bool enabled; + + final VoidCallback? onPressed; + + final VoidCallback? onLongPress; + + final FocusNode? focusNode; + + final bool autofocus; + + final bool enableFeedback; + + final String? semanticLabel; + + final String? semanticHint; + + final bool excludeSemantics; + + final MouseCursor mouseCursor; + + @override + Widget build(BuildContext context) { + return fortalButtonStyler(variant: this.variant, size: this.size).call( + key: this.key, + label: this.label, + leadingIcon: this.leadingIcon, + trailingIcon: this.trailingIcon, + textBuilder: this.textBuilder, + leadingIconBuilder: this.leadingIconBuilder, + trailingIconBuilder: this.trailingIconBuilder, + loadingBuilder: this.loadingBuilder, + loading: this.loading, + enabled: this.enabled, + onPressed: this.onPressed, + onLongPress: this.onLongPress, + focusNode: this.focusNode, + autofocus: this.autofocus, + enableFeedback: this.enableFeedback, + semanticLabel: this.semanticLabel, + semanticHint: this.semanticHint, + excludeSemantics: this.excludeSemantics, + mouseCursor: this.mouseCursor, + ); + } +} diff --git a/packages/remix/lib/src/components/callout/callout.g.dart b/packages/remix/lib/src/components/callout/callout.g.dart index a4835334..60f78d6e 100644 --- a/packages/remix/lib/src/components/callout/callout.g.dart +++ b/packages/remix/lib/src/components/callout/callout.g.dart @@ -91,71 +91,579 @@ mixin _$RemixCalloutSpec implements Spec, Diagnosticable { typedef _$RemixCalloutSpecMethods = _$RemixCalloutSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixCallout]. -class FortalCallout extends StatelessWidget { - const FortalCallout({ - super.key, - this.variant = .surface, - this.size = .size2, - this.text, - this.icon, - this.child, - }); - - const FortalCallout.outline({ - super.key, - this.size = .size2, - this.text, - this.icon, - this.child, - }) : variant = FortalCalloutVariant.outline; - - const FortalCallout.surface({ - super.key, - this.size = .size2, - this.text, - this.icon, - this.child, - }) : variant = FortalCalloutVariant.surface; - - const FortalCallout.soft({ - super.key, - this.size = .size2, - this.text, - this.icon, - this.child, - }) : variant = FortalCalloutVariant.soft; - - final FortalCalloutVariant variant; - - final FortalCalloutSize size; - - final String? text; - - final IconData? icon; - - final Widget? child; - - @override - Widget build(BuildContext context) { - return fortalCalloutStyler( - variant: this.variant, - size: this.size, - ).call(key: this.key, text: this.text, icon: this.icon, child: this.child); +class RemixCalloutStyler extends MixStyler + with + RemixBoxStylerMixin, + IconStyleMixin { + final Prop>? $container; + final Prop>? $text; + final Prop>? $icon; + + const RemixCalloutStyler.create({ + Prop>? container, + Prop>? text, + Prop>? icon, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $text = text, + $icon = icon; + + RemixCalloutStyler({ + FlexBoxStyler? container, + TextStyler? text, + IconStyler? icon, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + text: Prop.maybeMix(text), + icon: Prop.maybeMix(icon), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixCalloutStyler.container(FlexBoxStyler value) => + RemixCalloutStyler().container(value); + factory RemixCalloutStyler.text(TextStyler value) => + RemixCalloutStyler().text(value); + factory RemixCalloutStyler.icon(IconStyler value) => + RemixCalloutStyler().icon(value); + factory RemixCalloutStyler.color(Color value) => + RemixCalloutStyler().color(value); + factory RemixCalloutStyler.gradient(GradientMix value) => + RemixCalloutStyler().gradient(value); + factory RemixCalloutStyler.border(BoxBorderMix value) => + RemixCalloutStyler().border(value); + factory RemixCalloutStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixCalloutStyler().borderRadius(value); + factory RemixCalloutStyler.elevation(ElevationShadow value) => + RemixCalloutStyler().elevation(value); + factory RemixCalloutStyler.shadow(BoxShadowMix value) => + RemixCalloutStyler().shadow(value); + factory RemixCalloutStyler.shadows(List value) => + RemixCalloutStyler().shadows(value); + factory RemixCalloutStyler.width(double value) => + RemixCalloutStyler().width(value); + factory RemixCalloutStyler.height(double value) => + RemixCalloutStyler().height(value); + factory RemixCalloutStyler.size(double width, double height) => + RemixCalloutStyler().size(width, height); + factory RemixCalloutStyler.minWidth(double value) => + RemixCalloutStyler().minWidth(value); + factory RemixCalloutStyler.maxWidth(double value) => + RemixCalloutStyler().maxWidth(value); + factory RemixCalloutStyler.minHeight(double value) => + RemixCalloutStyler().minHeight(value); + factory RemixCalloutStyler.maxHeight(double value) => + RemixCalloutStyler().maxHeight(value); + factory RemixCalloutStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixCalloutStyler().scale(scale, alignment: alignment); + factory RemixCalloutStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixCalloutStyler().rotate(radians, alignment: alignment); + factory RemixCalloutStyler.translate(double x, double y, [double z = 0.0]) => + RemixCalloutStyler().translate(x, y, z); + factory RemixCalloutStyler.skew(double skewX, double skewY) => + RemixCalloutStyler().skew(skewX, skewY); + factory RemixCalloutStyler.textStyle(TextStyler value) => + RemixCalloutStyler().textStyle(value); + factory RemixCalloutStyler.image(DecorationImageMix value) => + RemixCalloutStyler().image(value); + factory RemixCalloutStyler.shape(ShapeBorderMix value) => + RemixCalloutStyler().shape(value); + factory RemixCalloutStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixCalloutStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixCalloutStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixCalloutStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixCalloutStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixCalloutStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixCalloutStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixCalloutStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixCalloutStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixCalloutStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixCalloutStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixCalloutStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixCalloutStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixCalloutStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixCalloutStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixCalloutStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixCalloutStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixCalloutStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixCalloutStyler.row() => RemixCalloutStyler().row(); + factory RemixCalloutStyler.column() => RemixCalloutStyler().column(); + factory RemixCalloutStyler.alignment(AlignmentGeometry value) => + RemixCalloutStyler().alignment(value); + factory RemixCalloutStyler.padding(EdgeInsetsGeometryMix value) => + RemixCalloutStyler().padding(value); + factory RemixCalloutStyler.margin(EdgeInsetsGeometryMix value) => + RemixCalloutStyler().margin(value); + factory RemixCalloutStyler.constraints(BoxConstraintsMix value) => + RemixCalloutStyler().constraints(value); + factory RemixCalloutStyler.decoration(DecorationMix value) => + RemixCalloutStyler().decoration(value); + factory RemixCalloutStyler.foregroundDecoration(DecorationMix value) => + RemixCalloutStyler().foregroundDecoration(value); + factory RemixCalloutStyler.clipBehavior(Clip value) => + RemixCalloutStyler().clipBehavior(value); + factory RemixCalloutStyler.direction(Axis value) => + RemixCalloutStyler().direction(value); + factory RemixCalloutStyler.mainAxisAlignment(MainAxisAlignment value) => + RemixCalloutStyler().mainAxisAlignment(value); + factory RemixCalloutStyler.crossAxisAlignment(CrossAxisAlignment value) => + RemixCalloutStyler().crossAxisAlignment(value); + factory RemixCalloutStyler.mainAxisSize(MainAxisSize value) => + RemixCalloutStyler().mainAxisSize(value); + factory RemixCalloutStyler.spacing(double value) => + RemixCalloutStyler().spacing(value); + factory RemixCalloutStyler.verticalDirection(VerticalDirection value) => + RemixCalloutStyler().verticalDirection(value); + factory RemixCalloutStyler.textDirection(TextDirection value) => + RemixCalloutStyler().textDirection(value); + factory RemixCalloutStyler.textBaseline(TextBaseline value) => + RemixCalloutStyler().textBaseline(value); + factory RemixCalloutStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixCalloutStyler().transform(value, alignment: alignment); + + RemixCalloutStyler color(Color value) { + return container(FlexBoxStyler().color(value)); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixCalloutStyler gradient(GradientMix value) { + return container(FlexBoxStyler().gradient(value)); + } + + RemixCalloutStyler border(BoxBorderMix value) { + return container(FlexBoxStyler().border(value)); + } + + RemixCalloutStyler borderRadius(BorderRadiusGeometryMix value) { + return container(FlexBoxStyler().borderRadius(value)); + } + + RemixCalloutStyler elevation(ElevationShadow value) { + return container(FlexBoxStyler().elevation(value)); + } + + RemixCalloutStyler shadow(BoxShadowMix value) { + return container(FlexBoxStyler().shadow(value)); + } + + RemixCalloutStyler shadows(List value) { + return container(FlexBoxStyler().shadows(value)); + } + + RemixCalloutStyler width(double value) { + return container(FlexBoxStyler().width(value)); + } + + RemixCalloutStyler height(double value) { + return container(FlexBoxStyler().height(value)); + } + + RemixCalloutStyler size(double width, double height) { + return container(FlexBoxStyler().size(width, height)); + } + + RemixCalloutStyler minWidth(double value) { + return container(FlexBoxStyler().minWidth(value)); + } -mixin _$RemixCalloutStylerMixin on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $text; - Prop>? get $icon; + RemixCalloutStyler maxWidth(double value) { + return container(FlexBoxStyler().maxWidth(value)); + } + + RemixCalloutStyler minHeight(double value) { + return container(FlexBoxStyler().minHeight(value)); + } + + RemixCalloutStyler maxHeight(double value) { + return container(FlexBoxStyler().maxHeight(value)); + } + + RemixCalloutStyler scale(double scale, {Alignment alignment = .center}) { + return container(FlexBoxStyler().scale(scale, alignment: alignment)); + } + + RemixCalloutStyler rotate(double radians, {Alignment alignment = .center}) { + return container(FlexBoxStyler().rotate(radians, alignment: alignment)); + } + + RemixCalloutStyler translate(double x, double y, [double z = 0.0]) { + return container(FlexBoxStyler().translate(x, y, z)); + } + + RemixCalloutStyler skew(double skewX, double skewY) { + return container(FlexBoxStyler().skew(skewX, skewY)); + } + + RemixCalloutStyler textStyle(TextStyler value) { + return container(FlexBoxStyler().textStyle(value)); + } + + RemixCalloutStyler image(DecorationImageMix value) { + return container(FlexBoxStyler().image(value)); + } + + RemixCalloutStyler shape(ShapeBorderMix value) { + return container(FlexBoxStyler().shape(value)); + } + + RemixCalloutStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixCalloutStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixCalloutStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixCalloutStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixCalloutStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixCalloutStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixCalloutStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixCalloutStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixCalloutStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixCalloutStyler row() { + return container(FlexBoxStyler().row()); + } + + RemixCalloutStyler column() { + return container(FlexBoxStyler().column()); + } + + RemixCalloutStyler alignment(AlignmentGeometry value) { + return container(FlexBoxStyler().alignment(value)); + } + + RemixCalloutStyler padding(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().padding(value)); + } + + RemixCalloutStyler margin(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().margin(value)); + } + + RemixCalloutStyler constraints(BoxConstraintsMix value) { + return container(FlexBoxStyler().constraints(value)); + } + + RemixCalloutStyler decoration(DecorationMix value) { + return container(FlexBoxStyler().decoration(value)); + } + + RemixCalloutStyler foregroundDecoration(DecorationMix value) { + return container(FlexBoxStyler().foregroundDecoration(value)); + } + + RemixCalloutStyler clipBehavior(Clip value) { + return container(FlexBoxStyler().clipBehavior(value)); + } + + RemixCalloutStyler direction(Axis value) { + return container(FlexBoxStyler().direction(value)); + } + + RemixCalloutStyler mainAxisAlignment(MainAxisAlignment value) { + return container(FlexBoxStyler().mainAxisAlignment(value)); + } + + RemixCalloutStyler crossAxisAlignment(CrossAxisAlignment value) { + return container(FlexBoxStyler().crossAxisAlignment(value)); + } + + RemixCalloutStyler mainAxisSize(MainAxisSize value) { + return container(FlexBoxStyler().mainAxisSize(value)); + } + + RemixCalloutStyler spacing(double value) { + return container(FlexBoxStyler().spacing(value)); + } + + RemixCalloutStyler verticalDirection(VerticalDirection value) { + return container(FlexBoxStyler().verticalDirection(value)); + } + + RemixCalloutStyler textDirection(TextDirection value) { + return container(FlexBoxStyler().textDirection(value)); + } + + RemixCalloutStyler textBaseline(TextBaseline value) { + return container(FlexBoxStyler().textBaseline(value)); + } + + RemixCalloutStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(FlexBoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixCalloutStyler container(FlexBoxStyler value) { @@ -168,21 +676,25 @@ mixin _$RemixCalloutStylerMixin on Style, Diagnosticable { } /// Sets the icon. + @override RemixCalloutStyler icon(IconStyler value) { return merge(RemixCalloutStyler(icon: value)); } /// Sets the animation configuration. + @override RemixCalloutStyler animate(AnimationConfig value) { return merge(RemixCalloutStyler(animation: value)); } /// Sets the style variants. + @override RemixCalloutStyler variants(List> value) { return merge(RemixCalloutStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixCalloutStyler wrap(WidgetModifierConfig value) { return merge(RemixCalloutStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/callout/callout_spec.dart b/packages/remix/lib/src/components/callout/callout_spec.dart index 7909435f..47ec79c3 100644 --- a/packages/remix/lib/src/components/callout/callout_spec.dart +++ b/packages/remix/lib/src/components/callout/callout_spec.dart @@ -1,9 +1,10 @@ part of 'callout.dart'; /// Resolved visual values for a [RemixCallout]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin, IconStyleMixin]) class RemixCalloutSpec with _$RemixCalloutSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; @override final StyleSpec text; diff --git a/packages/remix/lib/src/components/callout/callout_style.dart b/packages/remix/lib/src/components/callout/callout_style.dart index a736fcde..5f50bda8 100644 --- a/packages/remix/lib/src/components/callout/callout_style.dart +++ b/packages/remix/lib/src/components/callout/callout_style.dart @@ -1,104 +1,7 @@ part of 'callout.dart'; /// Style configuration for [RemixCallout] layout, icon, and text. -@MixableStyler() -class RemixCalloutStyler - extends RemixFlexContainerStyler - with - IconStyleMixin, - StyledTextStyleMixin, - Diagnosticable, - _$RemixCalloutStylerMixin { - @MixableField(setterType: FlexBoxStyler) - final Prop>? $container; - @MixableField(setterType: TextStyler) - final Prop>? $text; - @MixableField(setterType: IconStyler) - final Prop>? $icon; - - const RemixCalloutStyler.create({ - Prop>? container, - Prop>? text, - Prop>? icon, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $text = text, - $icon = icon; - - RemixCalloutStyler({ - FlexBoxStyler? container, - TextStyler? text, - IconStyler? icon, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - text: Prop.maybeMix(text), - icon: Prop.maybeMix(icon), - variants: variants, - animation: animation, - modifier: modifier, - ); - - // -- Factory constructors for convenience -- - - /// Creates a style with the given background color. - factory RemixCalloutStyler.backgroundColor(Color value) => - RemixCalloutStyler().backgroundColor(value); - - /// Creates a style with the given foreground color (icon and text). - factory RemixCalloutStyler.foregroundColor(Color value) => - RemixCalloutStyler().foregroundColor(value); - - /// Creates a style with the given padding. - factory RemixCalloutStyler.padding(EdgeInsetsGeometryMix value) => - RemixCalloutStyler().padding(value); - - /// Creates a style with the given margin. - factory RemixCalloutStyler.margin(EdgeInsetsGeometryMix value) => - RemixCalloutStyler().margin(value); - - /// Creates a style with the given decoration. - factory RemixCalloutStyler.decoration(DecorationMix value) => - RemixCalloutStyler().decoration(value); - - /// Creates a style with the given alignment. - factory RemixCalloutStyler.alignment(Alignment value) => - RemixCalloutStyler().alignment(value); - - /// Creates a style with the given spacing. - factory RemixCalloutStyler.spacing(double value) => - RemixCalloutStyler().spacing(value); - - /// Creates a style with the given constraints. - factory RemixCalloutStyler.constraints(BoxConstraintsMix value) => - RemixCalloutStyler().constraints(value); - - /// Creates a style with the given shape. - factory RemixCalloutStyler.shape(ShapeBorderMix value) => - RemixCalloutStyler().shape(value); - - /// Creates a style with the given icon size. - factory RemixCalloutStyler.iconSize(double value) => - RemixCalloutStyler().iconSize(value); - - /// Creates a style with the given text style. - factory RemixCalloutStyler.textStyle(TextStyleMix value) => - RemixCalloutStyler().textStyle(value); - - /// Sets container padding - RemixCalloutStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixCalloutStyler(container: FlexBoxStyler(padding: value))); - } - - /// Sets container margin - RemixCalloutStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixCalloutStyler(container: FlexBoxStyler(margin: value))); - } - +extension RemixCalloutStylerRemixHelpers on RemixCalloutStyler { /// Sets container background color RemixCalloutStyler backgroundColor(Color value) { return merge( @@ -113,43 +16,49 @@ class RemixCalloutStyler return iconColor(value).textColor(value); } - /// Sets the shape of the callout. - RemixCalloutStyler shape(ShapeBorderMix value) { - return merge( - RemixCalloutStyler( - container: FlexBoxStyler(decoration: ShapeDecorationMix(shape: value)), - ), - ); + /// Sets the callout content text style. + RemixCalloutStyler contentTextStyle(TextStyleMix value) { + return text(TextStyler(style: value)); } - /// Sets container border radius - RemixCalloutStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixCalloutStyler( - container: FlexBoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); + RemixCalloutStyler textColor(Color value) { + return text(TextStyler(style: TextStyleMix(color: value))); } - /// Sets container decoration - RemixCalloutStyler decoration(DecorationMix value) { - return merge( - RemixCalloutStyler(container: FlexBoxStyler(decoration: value)), - ); + RemixCalloutStyler fontSize(double value) { + return text(TextStyler(style: TextStyleMix(fontSize: value))); } - /// Sets container alignment - RemixCalloutStyler alignment(Alignment value) { - return merge( - RemixCalloutStyler(container: FlexBoxStyler(alignment: value)), - ); + RemixCalloutStyler fontWeight(FontWeight value) { + return text(TextStyler(style: TextStyleMix(fontWeight: value))); + } + + RemixCalloutStyler fontStyle(FontStyle value) { + return text(TextStyler(style: TextStyleMix(fontStyle: value))); + } + + RemixCalloutStyler letterSpacing(double value) { + return text(TextStyler(style: TextStyleMix(letterSpacing: value))); + } + + RemixCalloutStyler textDecoration(TextDecoration value) { + return text(TextStyler(style: TextStyleMix(decoration: value))); } - /// Sets flex spacing - RemixCalloutStyler spacing(double value) { - return merge(RemixCalloutStyler(container: FlexBoxStyler(spacing: value))); + RemixCalloutStyler fontFamily(String value) { + return text(TextStyler(style: TextStyleMix(fontFamily: value))); + } + + RemixCalloutStyler textHeight(double value) { + return text(TextStyler(style: TextStyleMix(height: value))); + } + + RemixCalloutStyler wordSpacing(double value) { + return text(TextStyler(style: TextStyleMix(wordSpacing: value))); + } + + RemixCalloutStyler textDecorationColor(Color value) { + return text(TextStyler(style: TextStyleMix(decorationColor: value))); } /// Creates a [RemixCallout] widget with this style applied. @@ -163,42 +72,6 @@ class RemixCalloutStyler ); } - @override - RemixCalloutStyler constraints(BoxConstraintsMix value) { - return merge( - RemixCalloutStyler(container: FlexBoxStyler(constraints: value)), - ); - } - - @override - RemixCalloutStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixCalloutStyler(container: FlexBoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixCalloutStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixCalloutStyler( - container: FlexBoxStyler( - transform: value, - transformAlignment: alignment, - ), - ), - ); - } - - @override - RemixCalloutStyler color(Color value) { - return backgroundColor(value); - } - - // FlexStyleMixin implementation - @override RemixCalloutStyler flex(FlexStyler value) { return merge(RemixCalloutStyler(container: FlexBoxStyler().flex(value))); } diff --git a/packages/remix/lib/src/components/callout/fortal_callout_styles.dart b/packages/remix/lib/src/components/callout/fortal_callout_styles.dart index 9adec9d5..c5129ad5 100644 --- a/packages/remix/lib/src/components/callout/fortal_callout_styles.dart +++ b/packages/remix/lib/src/components/callout/fortal_callout_styles.dart @@ -7,7 +7,6 @@ enum FortalCalloutSize { size1, size2, size3 } enum FortalCalloutVariant { outline, surface, soft } /// Fortal-themed preset for [RemixCallout]. -@MixWidget(name: 'FortalCallout') RemixCalloutStyler fortalCalloutStyler({ FortalCalloutVariant variant = .surface, FortalCalloutSize size = .size2, @@ -93,3 +92,57 @@ RemixCalloutStyler _fortalCalloutSizeStyler(FortalCalloutSize size) { ), }; } + +/// Fortal-themed preset for [RemixCallout]. +class FortalCallout extends StatelessWidget { + const FortalCallout({ + super.key, + this.variant = .surface, + this.size = .size2, + this.text, + this.icon, + this.child, + }); + + const FortalCallout.outline({ + super.key, + this.size = .size2, + this.text, + this.icon, + this.child, + }) : variant = FortalCalloutVariant.outline; + + const FortalCallout.surface({ + super.key, + this.size = .size2, + this.text, + this.icon, + this.child, + }) : variant = FortalCalloutVariant.surface; + + const FortalCallout.soft({ + super.key, + this.size = .size2, + this.text, + this.icon, + this.child, + }) : variant = FortalCalloutVariant.soft; + + final FortalCalloutVariant variant; + + final FortalCalloutSize size; + + final String? text; + + final IconData? icon; + + final Widget? child; + + @override + Widget build(BuildContext context) { + return fortalCalloutStyler( + variant: this.variant, + size: this.size, + ).call(key: this.key, text: this.text, icon: this.icon, child: this.child); + } +} diff --git a/packages/remix/lib/src/components/card/card.g.dart b/packages/remix/lib/src/components/card/card.g.dart index 06db9bd1..e001fed8 100644 --- a/packages/remix/lib/src/components/card/card.g.dart +++ b/packages/remix/lib/src/components/card/card.g.dart @@ -74,48 +74,503 @@ mixin _$RemixCardSpec implements Spec, Diagnosticable { typedef _$RemixCardSpecMethods = _$RemixCardSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixCard]. -class FortalCard extends StatelessWidget { - const FortalCard({ - super.key, - this.variant = .surface, - this.size = .size2, - this.child, - }); +class RemixCardStyler extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $container; + + const RemixCardStyler.create({ + Prop>? container, + super.variants, + super.modifier, + super.animation, + }) : $container = container; + + RemixCardStyler({ + BoxStyler? container, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixCardStyler.container(BoxStyler value) => + RemixCardStyler().container(value); + factory RemixCardStyler.alignment(AlignmentGeometry value) => + RemixCardStyler().alignment(value); + factory RemixCardStyler.padding(EdgeInsetsGeometryMix value) => + RemixCardStyler().padding(value); + factory RemixCardStyler.margin(EdgeInsetsGeometryMix value) => + RemixCardStyler().margin(value); + factory RemixCardStyler.constraints(BoxConstraintsMix value) => + RemixCardStyler().constraints(value); + factory RemixCardStyler.decoration(DecorationMix value) => + RemixCardStyler().decoration(value); + factory RemixCardStyler.foregroundDecoration(DecorationMix value) => + RemixCardStyler().foregroundDecoration(value); + factory RemixCardStyler.clipBehavior(Clip value) => + RemixCardStyler().clipBehavior(value); + factory RemixCardStyler.color(Color value) => RemixCardStyler().color(value); + factory RemixCardStyler.gradient(GradientMix value) => + RemixCardStyler().gradient(value); + factory RemixCardStyler.border(BoxBorderMix value) => + RemixCardStyler().border(value); + factory RemixCardStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixCardStyler().borderRadius(value); + factory RemixCardStyler.elevation(ElevationShadow value) => + RemixCardStyler().elevation(value); + factory RemixCardStyler.shadow(BoxShadowMix value) => + RemixCardStyler().shadow(value); + factory RemixCardStyler.shadows(List value) => + RemixCardStyler().shadows(value); + factory RemixCardStyler.width(double value) => RemixCardStyler().width(value); + factory RemixCardStyler.height(double value) => + RemixCardStyler().height(value); + factory RemixCardStyler.size(double width, double height) => + RemixCardStyler().size(width, height); + factory RemixCardStyler.minWidth(double value) => + RemixCardStyler().minWidth(value); + factory RemixCardStyler.maxWidth(double value) => + RemixCardStyler().maxWidth(value); + factory RemixCardStyler.minHeight(double value) => + RemixCardStyler().minHeight(value); + factory RemixCardStyler.maxHeight(double value) => + RemixCardStyler().maxHeight(value); + factory RemixCardStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixCardStyler().scale(scale, alignment: alignment); + factory RemixCardStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixCardStyler().rotate(radians, alignment: alignment); + factory RemixCardStyler.translate(double x, double y, [double z = 0.0]) => + RemixCardStyler().translate(x, y, z); + factory RemixCardStyler.skew(double skewX, double skewY) => + RemixCardStyler().skew(skewX, skewY); + factory RemixCardStyler.textStyle(TextStyler value) => + RemixCardStyler().textStyle(value); + factory RemixCardStyler.image(DecorationImageMix value) => + RemixCardStyler().image(value); + factory RemixCardStyler.shape(ShapeBorderMix value) => + RemixCardStyler().shape(value); + factory RemixCardStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixCardStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixCardStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixCardStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixCardStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixCardStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixCardStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixCardStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixCardStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixCardStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixCardStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixCardStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixCardStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixCardStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixCardStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixCardStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixCardStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixCardStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixCardStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixCardStyler().transform(value, alignment: alignment); + + RemixCardStyler alignment(AlignmentGeometry value) { + return container(BoxStyler().alignment(value)); + } - const FortalCard.surface({super.key, this.size = .size2, this.child}) - : variant = FortalCardVariant.surface; + RemixCardStyler padding(EdgeInsetsGeometryMix value) { + return container(BoxStyler().padding(value)); + } - const FortalCard.classic({super.key, this.size = .size2, this.child}) - : variant = FortalCardVariant.classic; + RemixCardStyler margin(EdgeInsetsGeometryMix value) { + return container(BoxStyler().margin(value)); + } - const FortalCard.ghost({super.key, this.size = .size2, this.child}) - : variant = FortalCardVariant.ghost; + RemixCardStyler constraints(BoxConstraintsMix value) { + return container(BoxStyler().constraints(value)); + } - final FortalCardVariant variant; + RemixCardStyler decoration(DecorationMix value) { + return container(BoxStyler().decoration(value)); + } - final FortalCardSize size; + RemixCardStyler foregroundDecoration(DecorationMix value) { + return container(BoxStyler().foregroundDecoration(value)); + } - final Widget? child; + RemixCardStyler clipBehavior(Clip value) { + return container(BoxStyler().clipBehavior(value)); + } - @override - Widget build(BuildContext context) { - return fortalCardStyler( - variant: this.variant, - size: this.size, - ).call(key: this.key, child: this.child); + RemixCardStyler color(Color value) { + return container(BoxStyler().color(value)); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixCardStyler gradient(GradientMix value) { + return container(BoxStyler().gradient(value)); + } + + RemixCardStyler border(BoxBorderMix value) { + return container(BoxStyler().border(value)); + } + + RemixCardStyler borderRadius(BorderRadiusGeometryMix value) { + return container(BoxStyler().borderRadius(value)); + } -mixin _$RemixCardStylerMixin on Style, Diagnosticable { - Prop>? get $container; + RemixCardStyler elevation(ElevationShadow value) { + return container(BoxStyler().elevation(value)); + } + + RemixCardStyler shadow(BoxShadowMix value) { + return container(BoxStyler().shadow(value)); + } + + RemixCardStyler shadows(List value) { + return container(BoxStyler().shadows(value)); + } + + RemixCardStyler width(double value) { + return container(BoxStyler().width(value)); + } + + RemixCardStyler height(double value) { + return container(BoxStyler().height(value)); + } + + RemixCardStyler size(double width, double height) { + return container(BoxStyler().size(width, height)); + } + + RemixCardStyler minWidth(double value) { + return container(BoxStyler().minWidth(value)); + } + + RemixCardStyler maxWidth(double value) { + return container(BoxStyler().maxWidth(value)); + } + + RemixCardStyler minHeight(double value) { + return container(BoxStyler().minHeight(value)); + } + + RemixCardStyler maxHeight(double value) { + return container(BoxStyler().maxHeight(value)); + } + + RemixCardStyler scale(double scale, {Alignment alignment = .center}) { + return container(BoxStyler().scale(scale, alignment: alignment)); + } + + RemixCardStyler rotate(double radians, {Alignment alignment = .center}) { + return container(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixCardStyler translate(double x, double y, [double z = 0.0]) { + return container(BoxStyler().translate(x, y, z)); + } + + RemixCardStyler skew(double skewX, double skewY) { + return container(BoxStyler().skew(skewX, skewY)); + } + + RemixCardStyler textStyle(TextStyler value) { + return container(BoxStyler().textStyle(value)); + } + + RemixCardStyler image(DecorationImageMix value) { + return container(BoxStyler().image(value)); + } + + RemixCardStyler shape(ShapeBorderMix value) { + return container(BoxStyler().shape(value)); + } + + RemixCardStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixCardStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixCardStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixCardStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixCardStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixCardStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixCardStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixCardStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixCardStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixCardStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(BoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixCardStyler container(BoxStyler value) { @@ -123,16 +578,19 @@ mixin _$RemixCardStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixCardStyler animate(AnimationConfig value) { return merge(RemixCardStyler(animation: value)); } /// Sets the style variants. + @override RemixCardStyler variants(List> value) { return merge(RemixCardStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixCardStyler wrap(WidgetModifierConfig value) { return merge(RemixCardStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/card/card_spec.dart b/packages/remix/lib/src/components/card/card_spec.dart index ee64f82d..f9567e84 100644 --- a/packages/remix/lib/src/components/card/card_spec.dart +++ b/packages/remix/lib/src/components/card/card_spec.dart @@ -1,9 +1,10 @@ part of 'card.dart'; /// Resolved visual properties for a [RemixCard]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixCardSpec with _$RemixCardSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; const RemixCardSpec({StyleSpec? container}) diff --git a/packages/remix/lib/src/components/card/card_style.dart b/packages/remix/lib/src/components/card/card_style.dart index 6ec86aed..c523763a 100644 --- a/packages/remix/lib/src/components/card/card_style.dart +++ b/packages/remix/lib/src/components/card/card_style.dart @@ -1,138 +1,12 @@ part of 'card.dart'; /// Style configuration for a [RemixCard] container. -@MixableStyler() -class RemixCardStyler - extends RemixContainerStyler - with Diagnosticable, _$RemixCardStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $container; - - const RemixCardStyler.create({ - Prop>? container, - super.variants, - super.animation, - super.modifier, - }) : $container = container; - - RemixCardStyler({ - BoxStyler? container, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - variants: variants, - animation: animation, - modifier: modifier, - ); - - // -- Factory constructors for convenience -- - - /// Creates a style with the given padding. - factory RemixCardStyler.padding(EdgeInsetsGeometryMix value) => - RemixCardStyler().padding(value); - - /// Creates a style with the given margin. - factory RemixCardStyler.margin(EdgeInsetsGeometryMix value) => - RemixCardStyler().margin(value); - - /// Creates a style with the given border radius. - factory RemixCardStyler.borderRadius(BorderRadiusGeometryMix radius) => - RemixCardStyler().borderRadius(radius); - - /// Creates a style with the given alignment. - factory RemixCardStyler.alignment(Alignment value) => - RemixCardStyler().alignment(value); - - /// Creates a style with the given decoration. - factory RemixCardStyler.decoration(DecorationMix value) => - RemixCardStyler().decoration(value); - - /// Creates a style with the given background color. - factory RemixCardStyler.backgroundColor(Color value) => - RemixCardStyler().backgroundColor(value); - - /// Creates a style with the given constraints. - factory RemixCardStyler.constraints(BoxConstraintsMix value) => - RemixCardStyler().constraints(value); - - /// Creates a style with the given shape. - factory RemixCardStyler.shape(ShapeBorderMix value) => - RemixCardStyler().shape(value); - - /// Sets container padding - RemixCardStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixCardStyler(container: BoxStyler(padding: value))); - } - +extension RemixCardStylerRemixHelpers on RemixCardStyler { /// Sets the card background color. RemixCardStyler backgroundColor(Color value) => color(value); - /// Sets container border radius - RemixCardStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixCardStyler( - container: BoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - - /// Sets container margin - RemixCardStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixCardStyler(container: BoxStyler(margin: value))); - } - - /// Sets container alignment - RemixCardStyler alignment(Alignment value) { - return merge(RemixCardStyler(container: BoxStyler(alignment: value))); - } - - /// Sets the shape of the card. - RemixCardStyler shape(ShapeBorderMix value) { - return merge( - RemixCardStyler( - container: BoxStyler(decoration: ShapeDecorationMix(shape: value)), - ), - ); - } - /// Creates a [RemixCard] widget with this style applied. RemixCard call({Key? key, Widget? child}) { return RemixCard(key: key, style: this, child: child); } - - /// Sets container decoration - @override - RemixCardStyler decoration(DecorationMix value) { - return merge(RemixCardStyler(container: BoxStyler(decoration: value))); - } - - // Abstract method implementations for mixins - - @override - RemixCardStyler constraints(BoxConstraintsMix value) { - return merge(RemixCardStyler(container: BoxStyler(constraints: value))); - } - - @override - RemixCardStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixCardStyler(container: BoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixCardStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixCardStyler( - container: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } } diff --git a/packages/remix/lib/src/components/card/fortal_card_styles.dart b/packages/remix/lib/src/components/card/fortal_card_styles.dart index 5dfd0297..45541bf0 100644 --- a/packages/remix/lib/src/components/card/fortal_card_styles.dart +++ b/packages/remix/lib/src/components/card/fortal_card_styles.dart @@ -7,7 +7,6 @@ enum FortalCardSize { size1, size2, size3 } enum FortalCardVariant { surface, classic, ghost } /// Fortal-themed preset for [RemixCard]. -@MixWidget(name: 'FortalCard') RemixCardStyler fortalCardStyler({ FortalCardVariant variant = .surface, FortalCardSize size = .size2, @@ -61,3 +60,36 @@ RemixCardStyler _fortalCardSizeStyler(FortalCardSize size) { .size3 => RemixCardStyler().paddingAll(FortalTokens.space6()), }; } + +/// Fortal-themed preset for [RemixCard]. +class FortalCard extends StatelessWidget { + const FortalCard({ + super.key, + this.variant = .surface, + this.size = .size2, + this.child, + }); + + const FortalCard.surface({super.key, this.size = .size2, this.child}) + : variant = FortalCardVariant.surface; + + const FortalCard.classic({super.key, this.size = .size2, this.child}) + : variant = FortalCardVariant.classic; + + const FortalCard.ghost({super.key, this.size = .size2, this.child}) + : variant = FortalCardVariant.ghost; + + final FortalCardVariant variant; + + final FortalCardSize size; + + final Widget? child; + + @override + Widget build(BuildContext context) { + return fortalCardStyler( + variant: this.variant, + size: this.size, + ).call(key: this.key, child: this.child); + } +} diff --git a/packages/remix/lib/src/components/checkbox/checkbox.dart b/packages/remix/lib/src/components/checkbox/checkbox.dart index fc632129..a59a9582 100644 --- a/packages/remix/lib/src/components/checkbox/checkbox.dart +++ b/packages/remix/lib/src/components/checkbox/checkbox.dart @@ -8,7 +8,6 @@ import 'package:mix_annotations/mix_annotations.dart'; import 'package:naked_ui/naked_ui.dart'; import '../../fortal/fortal.dart'; -import '../../style/style.dart'; import '../../utilities/remix_style.dart'; import '../../utilities/selected_mixin.dart'; diff --git a/packages/remix/lib/src/components/checkbox/checkbox.g.dart b/packages/remix/lib/src/components/checkbox/checkbox.g.dart index 8aa2ad0f..0b44fb4e 100644 --- a/packages/remix/lib/src/components/checkbox/checkbox.g.dart +++ b/packages/remix/lib/src/components/checkbox/checkbox.g.dart @@ -86,120 +86,516 @@ mixin _$RemixCheckboxSpec implements Spec, Diagnosticable { typedef _$RemixCheckboxSpecMethods = _$RemixCheckboxSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixCheckbox]. -class FortalCheckbox extends StatelessWidget { - const FortalCheckbox({ - super.key, - this.variant = .surface, - this.size = .size2, - required this.selected, - this.onChanged, - this.enabled = true, - this.tristate = false, - this.checkedIcon = Icons.check_rounded, - this.uncheckedIcon, - this.indeterminateIcon = Icons.horizontal_rule, - this.focusNode, - this.autofocus = false, - this.enableFeedback = true, - this.semanticLabel, - this.mouseCursor = SystemMouseCursors.click, - }); - - /// Surface treatment with neutral border. - const FortalCheckbox.surface({ - super.key, - this.size = .size2, - required this.selected, - this.onChanged, - this.enabled = true, - this.tristate = false, - this.checkedIcon = Icons.check_rounded, - this.uncheckedIcon, - this.indeterminateIcon = Icons.horizontal_rule, - this.focusNode, - this.autofocus = false, - this.enableFeedback = true, - this.semanticLabel, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalCheckboxVariant.surface; - - /// Soft accent treatment. - const FortalCheckbox.soft({ - super.key, - this.size = .size2, - required this.selected, - this.onChanged, - this.enabled = true, - this.tristate = false, - this.checkedIcon = Icons.check_rounded, - this.uncheckedIcon, - this.indeterminateIcon = Icons.horizontal_rule, - this.focusNode, - this.autofocus = false, - this.enableFeedback = true, - this.semanticLabel, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalCheckboxVariant.soft; - - final FortalCheckboxVariant variant; - - final FortalCheckboxSize size; - - final bool? selected; - - final ValueChanged? onChanged; - - final bool enabled; - - final bool tristate; - - final IconData checkedIcon; - - final IconData? uncheckedIcon; - - final IconData indeterminateIcon; - - final FocusNode? focusNode; - - final bool autofocus; - - final bool enableFeedback; - - final String? semanticLabel; - - final MouseCursor mouseCursor; +class RemixCheckboxStyler + extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $container; + final Prop>? $indicator; + + const RemixCheckboxStyler.create({ + Prop>? container, + Prop>? indicator, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $indicator = indicator; + + RemixCheckboxStyler({ + BoxStyler? container, + IconStyler? indicator, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + indicator: Prop.maybeMix(indicator), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixCheckboxStyler.container(BoxStyler value) => + RemixCheckboxStyler().container(value); + factory RemixCheckboxStyler.indicator(IconStyler value) => + RemixCheckboxStyler().indicator(value); + factory RemixCheckboxStyler.alignment(AlignmentGeometry value) => + RemixCheckboxStyler().alignment(value); + factory RemixCheckboxStyler.padding(EdgeInsetsGeometryMix value) => + RemixCheckboxStyler().padding(value); + factory RemixCheckboxStyler.margin(EdgeInsetsGeometryMix value) => + RemixCheckboxStyler().margin(value); + factory RemixCheckboxStyler.constraints(BoxConstraintsMix value) => + RemixCheckboxStyler().constraints(value); + factory RemixCheckboxStyler.decoration(DecorationMix value) => + RemixCheckboxStyler().decoration(value); + factory RemixCheckboxStyler.foregroundDecoration(DecorationMix value) => + RemixCheckboxStyler().foregroundDecoration(value); + factory RemixCheckboxStyler.clipBehavior(Clip value) => + RemixCheckboxStyler().clipBehavior(value); + factory RemixCheckboxStyler.color(Color value) => + RemixCheckboxStyler().color(value); + factory RemixCheckboxStyler.gradient(GradientMix value) => + RemixCheckboxStyler().gradient(value); + factory RemixCheckboxStyler.border(BoxBorderMix value) => + RemixCheckboxStyler().border(value); + factory RemixCheckboxStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixCheckboxStyler().borderRadius(value); + factory RemixCheckboxStyler.elevation(ElevationShadow value) => + RemixCheckboxStyler().elevation(value); + factory RemixCheckboxStyler.shadow(BoxShadowMix value) => + RemixCheckboxStyler().shadow(value); + factory RemixCheckboxStyler.shadows(List value) => + RemixCheckboxStyler().shadows(value); + factory RemixCheckboxStyler.width(double value) => + RemixCheckboxStyler().width(value); + factory RemixCheckboxStyler.height(double value) => + RemixCheckboxStyler().height(value); + factory RemixCheckboxStyler.size(double width, double height) => + RemixCheckboxStyler().size(width, height); + factory RemixCheckboxStyler.minWidth(double value) => + RemixCheckboxStyler().minWidth(value); + factory RemixCheckboxStyler.maxWidth(double value) => + RemixCheckboxStyler().maxWidth(value); + factory RemixCheckboxStyler.minHeight(double value) => + RemixCheckboxStyler().minHeight(value); + factory RemixCheckboxStyler.maxHeight(double value) => + RemixCheckboxStyler().maxHeight(value); + factory RemixCheckboxStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixCheckboxStyler().scale(scale, alignment: alignment); + factory RemixCheckboxStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixCheckboxStyler().rotate(radians, alignment: alignment); + factory RemixCheckboxStyler.translate(double x, double y, [double z = 0.0]) => + RemixCheckboxStyler().translate(x, y, z); + factory RemixCheckboxStyler.skew(double skewX, double skewY) => + RemixCheckboxStyler().skew(skewX, skewY); + factory RemixCheckboxStyler.textStyle(TextStyler value) => + RemixCheckboxStyler().textStyle(value); + factory RemixCheckboxStyler.image(DecorationImageMix value) => + RemixCheckboxStyler().image(value); + factory RemixCheckboxStyler.shape(ShapeBorderMix value) => + RemixCheckboxStyler().shape(value); + factory RemixCheckboxStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixCheckboxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixCheckboxStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixCheckboxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixCheckboxStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixCheckboxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixCheckboxStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixCheckboxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixCheckboxStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixCheckboxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixCheckboxStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixCheckboxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixCheckboxStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixCheckboxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixCheckboxStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixCheckboxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixCheckboxStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixCheckboxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixCheckboxStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixCheckboxStyler().transform(value, alignment: alignment); + + RemixCheckboxStyler alignment(AlignmentGeometry value) { + return container(BoxStyler().alignment(value)); + } - @override - Widget build(BuildContext context) { - return fortalCheckboxStyler(variant: this.variant, size: this.size).call( - key: this.key, - selected: this.selected, - onChanged: this.onChanged, - enabled: this.enabled, - tristate: this.tristate, - checkedIcon: this.checkedIcon, - uncheckedIcon: this.uncheckedIcon, - indeterminateIcon: this.indeterminateIcon, - focusNode: this.focusNode, - autofocus: this.autofocus, - enableFeedback: this.enableFeedback, - semanticLabel: this.semanticLabel, - mouseCursor: this.mouseCursor, + RemixCheckboxStyler padding(EdgeInsetsGeometryMix value) { + return container(BoxStyler().padding(value)); + } + + RemixCheckboxStyler margin(EdgeInsetsGeometryMix value) { + return container(BoxStyler().margin(value)); + } + + RemixCheckboxStyler constraints(BoxConstraintsMix value) { + return container(BoxStyler().constraints(value)); + } + + RemixCheckboxStyler decoration(DecorationMix value) { + return container(BoxStyler().decoration(value)); + } + + RemixCheckboxStyler foregroundDecoration(DecorationMix value) { + return container(BoxStyler().foregroundDecoration(value)); + } + + RemixCheckboxStyler clipBehavior(Clip value) { + return container(BoxStyler().clipBehavior(value)); + } + + RemixCheckboxStyler color(Color value) { + return container(BoxStyler().color(value)); + } + + RemixCheckboxStyler gradient(GradientMix value) { + return container(BoxStyler().gradient(value)); + } + + RemixCheckboxStyler border(BoxBorderMix value) { + return container(BoxStyler().border(value)); + } + + RemixCheckboxStyler borderRadius(BorderRadiusGeometryMix value) { + return container(BoxStyler().borderRadius(value)); + } + + RemixCheckboxStyler elevation(ElevationShadow value) { + return container(BoxStyler().elevation(value)); + } + + RemixCheckboxStyler shadow(BoxShadowMix value) { + return container(BoxStyler().shadow(value)); + } + + RemixCheckboxStyler shadows(List value) { + return container(BoxStyler().shadows(value)); + } + + RemixCheckboxStyler width(double value) { + return container(BoxStyler().width(value)); + } + + RemixCheckboxStyler height(double value) { + return container(BoxStyler().height(value)); + } + + RemixCheckboxStyler size(double width, double height) { + return container(BoxStyler().size(width, height)); + } + + RemixCheckboxStyler minWidth(double value) { + return container(BoxStyler().minWidth(value)); + } + + RemixCheckboxStyler maxWidth(double value) { + return container(BoxStyler().maxWidth(value)); + } + + RemixCheckboxStyler minHeight(double value) { + return container(BoxStyler().minHeight(value)); + } + + RemixCheckboxStyler maxHeight(double value) { + return container(BoxStyler().maxHeight(value)); + } + + RemixCheckboxStyler scale(double scale, {Alignment alignment = .center}) { + return container(BoxStyler().scale(scale, alignment: alignment)); + } + + RemixCheckboxStyler rotate(double radians, {Alignment alignment = .center}) { + return container(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixCheckboxStyler translate(double x, double y, [double z = 0.0]) { + return container(BoxStyler().translate(x, y, z)); + } + + RemixCheckboxStyler skew(double skewX, double skewY) { + return container(BoxStyler().skew(skewX, skewY)); + } + + RemixCheckboxStyler textStyle(TextStyler value) { + return container(BoxStyler().textStyle(value)); + } + + RemixCheckboxStyler image(DecorationImageMix value) { + return container(BoxStyler().image(value)); + } + + RemixCheckboxStyler shape(ShapeBorderMix value) { + return container(BoxStyler().shape(value)); + } + + RemixCheckboxStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixCheckboxStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixCheckboxStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixCheckboxStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixCheckboxStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixCheckboxStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixCheckboxStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixCheckboxStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixCheckboxStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } -mixin _$RemixCheckboxStylerMixin on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $indicator; + RemixCheckboxStyler transform( + Matrix4 value, { + Alignment alignment = .center, + }) { + return container(BoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixCheckboxStyler container(BoxStyler value) { @@ -212,16 +608,19 @@ mixin _$RemixCheckboxStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixCheckboxStyler animate(AnimationConfig value) { return merge(RemixCheckboxStyler(animation: value)); } /// Sets the style variants. + @override RemixCheckboxStyler variants(List> value) { return merge(RemixCheckboxStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixCheckboxStyler wrap(WidgetModifierConfig value) { return merge(RemixCheckboxStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/checkbox/checkbox_spec.dart b/packages/remix/lib/src/components/checkbox/checkbox_spec.dart index 98a6bb86..2c6691d9 100644 --- a/packages/remix/lib/src/components/checkbox/checkbox_spec.dart +++ b/packages/remix/lib/src/components/checkbox/checkbox_spec.dart @@ -53,7 +53,7 @@ part of 'checkbox.dart'; /// - [RemixCheckboxStyler] for the styling API /// - [RemixCheckbox] for the widget implementation /// - [Spec] for the base specification pattern -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixCheckboxSpec with _$RemixCheckboxSpec { /// Styling specification for the checkbox box container. /// @@ -61,6 +61,7 @@ class RemixCheckboxSpec with _$RemixCheckboxSpec { /// background color, border, size, and shape. This is the visual /// element that users click to toggle the checkbox state. @override + @MixableField(forwardStyler: true) final StyleSpec container; /// Styling specification for the checkbox indicator icon. diff --git a/packages/remix/lib/src/components/checkbox/checkbox_style.dart b/packages/remix/lib/src/components/checkbox/checkbox_style.dart index f508aaf3..4cdd63a7 100644 --- a/packages/remix/lib/src/components/checkbox/checkbox_style.dart +++ b/packages/remix/lib/src/components/checkbox/checkbox_style.dart @@ -1,70 +1,12 @@ part of 'checkbox.dart'; /// Style configuration for [RemixCheckbox] container and indicator icon. -@MixableStyler() -class RemixCheckboxStyler - extends RemixContainerStyler - with - IconStyleMixin, - SelectedWidgetStateVariantMixin, - Diagnosticable, - _$RemixCheckboxStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $container; - @MixableField(setterType: IconStyler) - final Prop>? $indicator; - - const RemixCheckboxStyler.create({ - Prop>? container, - Prop>? indicator, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $indicator = indicator; - - RemixCheckboxStyler({ - BoxStyler? container, - IconStyler? indicator, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - indicator: Prop.maybeMix(indicator), - variants: variants, - animation: animation, - modifier: modifier, - ); - - /// Sets the shape of the checkbox. - RemixCheckboxStyler shape(ShapeBorderMix value) { - return merge( - RemixCheckboxStyler( - container: BoxStyler(decoration: ShapeDecorationMix(shape: value)), - ), - ); - } - - /// Sets checkbox border on the container. - RemixCheckboxStyler border(BoxBorderMix value) { - return merge( - RemixCheckboxStyler( - container: BoxStyler(decoration: BoxDecorationMix(border: value)), - ), - ); - } - +extension RemixCheckboxStylerRemixHelpers on RemixCheckboxStyler { /// Sets indicator color. RemixCheckboxStyler indicatorColor(Color value) { return merge(RemixCheckboxStyler(indicator: IconStyler(color: value))); } - /// Sets container alignment. - RemixCheckboxStyler alignment(Alignment value) { - return merge(RemixCheckboxStyler(container: BoxStyler(alignment: value))); - } - RemixCheckboxStyler onIndeterminate(RemixCheckboxStyler value) { return variant( ContextVariant( @@ -131,77 +73,43 @@ class RemixCheckboxStyler ); } - @override RemixCheckboxStyler icon(IconStyler value) { return merge(RemixCheckboxStyler(indicator: value)); } - /// Sets container padding. - @override - RemixCheckboxStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixCheckboxStyler(container: BoxStyler(padding: value))); - } + RemixCheckboxStyler iconColor(Color value) => icon(IconStyler(color: value)); - /// Sets checkbox size with separate width and height. - @override - RemixCheckboxStyler size(double width, double height) { - return merge( - RemixCheckboxStyler( - container: BoxStyler( - constraints: BoxConstraintsMix( - minWidth: width, - maxWidth: width, - minHeight: height, - maxHeight: height, - ), - ), - ), - ); + RemixCheckboxStyler iconSize(double value) => icon(IconStyler(size: value)); + + RemixCheckboxStyler iconOpacity(double value) { + return icon(IconStyler(opacity: value)); } - /// Sets border radius on the outer container. - @override - RemixCheckboxStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixCheckboxStyler( - container: BoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); + RemixCheckboxStyler iconWeight(double value) { + return icon(IconStyler(weight: value)); } - @override - RemixCheckboxStyler constraints(BoxConstraintsMix value) { - return merge(RemixCheckboxStyler(container: BoxStyler(constraints: value))); + RemixCheckboxStyler iconGrade(double value) => icon(IconStyler(grade: value)); + + RemixCheckboxStyler iconFill(double value) => icon(IconStyler(fill: value)); + + RemixCheckboxStyler iconOpticalSize(double value) { + return icon(IconStyler(opticalSize: value)); } - @override - RemixCheckboxStyler decoration(DecorationMix value) { - return merge(RemixCheckboxStyler(container: BoxStyler(decoration: value))); + RemixCheckboxStyler iconBlendMode(BlendMode value) { + return icon(IconStyler(blendMode: value)); } - @override - RemixCheckboxStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixCheckboxStyler(container: BoxStyler(margin: value))); + RemixCheckboxStyler iconTextDirection(TextDirection value) { + return icon(IconStyler(textDirection: value)); } - @override - RemixCheckboxStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixCheckboxStyler(container: BoxStyler(foregroundDecoration: value)), - ); + RemixCheckboxStyler iconShadows(List value) { + return icon(IconStyler(shadows: value)); } - @override - RemixCheckboxStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixCheckboxStyler( - container: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); + RemixCheckboxStyler iconShadow(ShadowMix value) { + return icon(IconStyler(shadows: [value])); } } diff --git a/packages/remix/lib/src/components/checkbox/fortal_checkbox_styles.dart b/packages/remix/lib/src/components/checkbox/fortal_checkbox_styles.dart index f7fbd69b..52b5562d 100644 --- a/packages/remix/lib/src/components/checkbox/fortal_checkbox_styles.dart +++ b/packages/remix/lib/src/components/checkbox/fortal_checkbox_styles.dart @@ -22,7 +22,6 @@ enum FortalCheckboxVariant { } /// Fortal-themed preset for [RemixCheckbox]. -@MixWidget(name: 'FortalCheckbox') RemixCheckboxStyler fortalCheckboxStyler({ FortalCheckboxVariant variant = .surface, FortalCheckboxSize size = .size2, @@ -112,3 +111,107 @@ RemixCheckboxStyler _fortalCheckboxSizeStyler(FortalCheckboxSize size) { ), }; } + +/// Fortal-themed preset for [RemixCheckbox]. +class FortalCheckbox extends StatelessWidget { + const FortalCheckbox({ + super.key, + this.variant = .surface, + this.size = .size2, + required this.selected, + this.onChanged, + this.enabled = true, + this.tristate = false, + this.checkedIcon = Icons.check_rounded, + this.uncheckedIcon, + this.indeterminateIcon = Icons.horizontal_rule, + this.focusNode, + this.autofocus = false, + this.enableFeedback = true, + this.semanticLabel, + this.mouseCursor = SystemMouseCursors.click, + }); + + /// Surface treatment with neutral border. + const FortalCheckbox.surface({ + super.key, + this.size = .size2, + required this.selected, + this.onChanged, + this.enabled = true, + this.tristate = false, + this.checkedIcon = Icons.check_rounded, + this.uncheckedIcon, + this.indeterminateIcon = Icons.horizontal_rule, + this.focusNode, + this.autofocus = false, + this.enableFeedback = true, + this.semanticLabel, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalCheckboxVariant.surface; + + /// Soft accent treatment. + const FortalCheckbox.soft({ + super.key, + this.size = .size2, + required this.selected, + this.onChanged, + this.enabled = true, + this.tristate = false, + this.checkedIcon = Icons.check_rounded, + this.uncheckedIcon, + this.indeterminateIcon = Icons.horizontal_rule, + this.focusNode, + this.autofocus = false, + this.enableFeedback = true, + this.semanticLabel, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalCheckboxVariant.soft; + + final FortalCheckboxVariant variant; + + final FortalCheckboxSize size; + + final bool? selected; + + final ValueChanged? onChanged; + + final bool enabled; + + final bool tristate; + + final IconData checkedIcon; + + final IconData? uncheckedIcon; + + final IconData indeterminateIcon; + + final FocusNode? focusNode; + + final bool autofocus; + + final bool enableFeedback; + + final String? semanticLabel; + + final MouseCursor mouseCursor; + + @override + Widget build(BuildContext context) { + return fortalCheckboxStyler(variant: this.variant, size: this.size).call( + key: this.key, + selected: this.selected, + onChanged: this.onChanged, + enabled: this.enabled, + tristate: this.tristate, + checkedIcon: this.checkedIcon, + uncheckedIcon: this.uncheckedIcon, + indeterminateIcon: this.indeterminateIcon, + focusNode: this.focusNode, + autofocus: this.autofocus, + enableFeedback: this.enableFeedback, + semanticLabel: this.semanticLabel, + mouseCursor: this.mouseCursor, + ); + } +} diff --git a/packages/remix/lib/src/components/dialog/dialog.g.dart b/packages/remix/lib/src/components/dialog/dialog.g.dart index 4ebc557b..2dd41f8e 100644 --- a/packages/remix/lib/src/components/dialog/dialog.g.dart +++ b/packages/remix/lib/src/components/dialog/dialog.g.dart @@ -96,56 +96,526 @@ mixin _$RemixDialogSpec implements Spec, Diagnosticable { typedef _$RemixDialogSpecMethods = _$RemixDialogSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixDialog]. -class FortalDialog extends StatelessWidget { - const FortalDialog({ - super.key, - this.child, - this.title, - this.description, - this.actions, - this.modal = true, - this.semanticLabel, - }); +class RemixDialogStyler extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $container; + final Prop>? $title; + final Prop>? $description; + final Prop>? $actions; + + const RemixDialogStyler.create({ + Prop>? container, + Prop>? title, + Prop>? description, + Prop>? actions, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $title = title, + $description = description, + $actions = actions; + + RemixDialogStyler({ + BoxStyler? container, + TextStyler? title, + TextStyler? description, + FlexBoxStyler? actions, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + title: Prop.maybeMix(title), + description: Prop.maybeMix(description), + actions: Prop.maybeMix(actions), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixDialogStyler.container(BoxStyler value) => + RemixDialogStyler().container(value); + factory RemixDialogStyler.title(TextStyler value) => + RemixDialogStyler().title(value); + factory RemixDialogStyler.description(TextStyler value) => + RemixDialogStyler().description(value); + factory RemixDialogStyler.actions(FlexBoxStyler value) => + RemixDialogStyler().actions(value); + factory RemixDialogStyler.alignment(AlignmentGeometry value) => + RemixDialogStyler().alignment(value); + factory RemixDialogStyler.padding(EdgeInsetsGeometryMix value) => + RemixDialogStyler().padding(value); + factory RemixDialogStyler.margin(EdgeInsetsGeometryMix value) => + RemixDialogStyler().margin(value); + factory RemixDialogStyler.constraints(BoxConstraintsMix value) => + RemixDialogStyler().constraints(value); + factory RemixDialogStyler.decoration(DecorationMix value) => + RemixDialogStyler().decoration(value); + factory RemixDialogStyler.foregroundDecoration(DecorationMix value) => + RemixDialogStyler().foregroundDecoration(value); + factory RemixDialogStyler.clipBehavior(Clip value) => + RemixDialogStyler().clipBehavior(value); + factory RemixDialogStyler.color(Color value) => + RemixDialogStyler().color(value); + factory RemixDialogStyler.gradient(GradientMix value) => + RemixDialogStyler().gradient(value); + factory RemixDialogStyler.border(BoxBorderMix value) => + RemixDialogStyler().border(value); + factory RemixDialogStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixDialogStyler().borderRadius(value); + factory RemixDialogStyler.elevation(ElevationShadow value) => + RemixDialogStyler().elevation(value); + factory RemixDialogStyler.shadow(BoxShadowMix value) => + RemixDialogStyler().shadow(value); + factory RemixDialogStyler.shadows(List value) => + RemixDialogStyler().shadows(value); + factory RemixDialogStyler.width(double value) => + RemixDialogStyler().width(value); + factory RemixDialogStyler.height(double value) => + RemixDialogStyler().height(value); + factory RemixDialogStyler.size(double width, double height) => + RemixDialogStyler().size(width, height); + factory RemixDialogStyler.minWidth(double value) => + RemixDialogStyler().minWidth(value); + factory RemixDialogStyler.maxWidth(double value) => + RemixDialogStyler().maxWidth(value); + factory RemixDialogStyler.minHeight(double value) => + RemixDialogStyler().minHeight(value); + factory RemixDialogStyler.maxHeight(double value) => + RemixDialogStyler().maxHeight(value); + factory RemixDialogStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixDialogStyler().scale(scale, alignment: alignment); + factory RemixDialogStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixDialogStyler().rotate(radians, alignment: alignment); + factory RemixDialogStyler.translate(double x, double y, [double z = 0.0]) => + RemixDialogStyler().translate(x, y, z); + factory RemixDialogStyler.skew(double skewX, double skewY) => + RemixDialogStyler().skew(skewX, skewY); + factory RemixDialogStyler.textStyle(TextStyler value) => + RemixDialogStyler().textStyle(value); + factory RemixDialogStyler.image(DecorationImageMix value) => + RemixDialogStyler().image(value); + factory RemixDialogStyler.shape(ShapeBorderMix value) => + RemixDialogStyler().shape(value); + factory RemixDialogStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixDialogStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixDialogStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixDialogStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixDialogStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixDialogStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixDialogStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixDialogStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixDialogStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixDialogStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixDialogStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixDialogStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixDialogStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixDialogStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixDialogStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixDialogStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixDialogStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixDialogStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixDialogStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixDialogStyler().transform(value, alignment: alignment); + + RemixDialogStyler alignment(AlignmentGeometry value) { + return container(BoxStyler().alignment(value)); + } + + RemixDialogStyler padding(EdgeInsetsGeometryMix value) { + return container(BoxStyler().padding(value)); + } - final Widget? child; + RemixDialogStyler margin(EdgeInsetsGeometryMix value) { + return container(BoxStyler().margin(value)); + } + + RemixDialogStyler constraints(BoxConstraintsMix value) { + return container(BoxStyler().constraints(value)); + } - final String? title; + RemixDialogStyler decoration(DecorationMix value) { + return container(BoxStyler().decoration(value)); + } - final String? description; + RemixDialogStyler foregroundDecoration(DecorationMix value) { + return container(BoxStyler().foregroundDecoration(value)); + } - final List? actions; + RemixDialogStyler clipBehavior(Clip value) { + return container(BoxStyler().clipBehavior(value)); + } - final bool modal; + RemixDialogStyler color(Color value) { + return container(BoxStyler().color(value)); + } - final String? semanticLabel; + RemixDialogStyler gradient(GradientMix value) { + return container(BoxStyler().gradient(value)); + } - @override - Widget build(BuildContext context) { - return fortalDialogStyler().call( - key: this.key, - child: this.child, - title: this.title, - description: this.description, - actions: this.actions, - modal: this.modal, - semanticLabel: this.semanticLabel, + RemixDialogStyler border(BoxBorderMix value) { + return container(BoxStyler().border(value)); + } + + RemixDialogStyler borderRadius(BorderRadiusGeometryMix value) { + return container(BoxStyler().borderRadius(value)); + } + + RemixDialogStyler elevation(ElevationShadow value) { + return container(BoxStyler().elevation(value)); + } + + RemixDialogStyler shadow(BoxShadowMix value) { + return container(BoxStyler().shadow(value)); + } + + RemixDialogStyler shadows(List value) { + return container(BoxStyler().shadows(value)); + } + + RemixDialogStyler width(double value) { + return container(BoxStyler().width(value)); + } + + RemixDialogStyler height(double value) { + return container(BoxStyler().height(value)); + } + + RemixDialogStyler size(double width, double height) { + return container(BoxStyler().size(width, height)); + } + + RemixDialogStyler minWidth(double value) { + return container(BoxStyler().minWidth(value)); + } + + RemixDialogStyler maxWidth(double value) { + return container(BoxStyler().maxWidth(value)); + } + + RemixDialogStyler minHeight(double value) { + return container(BoxStyler().minHeight(value)); + } + + RemixDialogStyler maxHeight(double value) { + return container(BoxStyler().maxHeight(value)); + } + + RemixDialogStyler scale(double scale, {Alignment alignment = .center}) { + return container(BoxStyler().scale(scale, alignment: alignment)); + } + + RemixDialogStyler rotate(double radians, {Alignment alignment = .center}) { + return container(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixDialogStyler translate(double x, double y, [double z = 0.0]) { + return container(BoxStyler().translate(x, y, z)); + } + + RemixDialogStyler skew(double skewX, double skewY) { + return container(BoxStyler().skew(skewX, skewY)); + } + + RemixDialogStyler textStyle(TextStyler value) { + return container(BoxStyler().textStyle(value)); + } + + RemixDialogStyler image(DecorationImageMix value) { + return container(BoxStyler().image(value)); + } + + RemixDialogStyler shape(ShapeBorderMix value) { + return container(BoxStyler().shape(value)); + } + + RemixDialogStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixDialogStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixDialogStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixDialogStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixDialogStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixDialogStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixDialogStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixDialogStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } -mixin _$RemixDialogStylerMixin on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $title; - Prop>? get $description; - Prop>? get $actions; + RemixDialogStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixDialogStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(BoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixDialogStyler container(BoxStyler value) { @@ -168,16 +638,19 @@ mixin _$RemixDialogStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixDialogStyler animate(AnimationConfig value) { return merge(RemixDialogStyler(animation: value)); } /// Sets the style variants. + @override RemixDialogStyler variants(List> value) { return merge(RemixDialogStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixDialogStyler wrap(WidgetModifierConfig value) { return merge(RemixDialogStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/dialog/dialog_spec.dart b/packages/remix/lib/src/components/dialog/dialog_spec.dart index f53eb384..cf098be0 100644 --- a/packages/remix/lib/src/components/dialog/dialog_spec.dart +++ b/packages/remix/lib/src/components/dialog/dialog_spec.dart @@ -1,9 +1,10 @@ part of 'dialog.dart'; /// Resolved visual properties for a [RemixDialog]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixDialogSpec with _$RemixDialogSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; @override final StyleSpec title; diff --git a/packages/remix/lib/src/components/dialog/dialog_style.dart b/packages/remix/lib/src/components/dialog/dialog_style.dart index f062be0d..bdb1c113 100644 --- a/packages/remix/lib/src/components/dialog/dialog_style.dart +++ b/packages/remix/lib/src/components/dialog/dialog_style.dart @@ -1,54 +1,7 @@ part of 'dialog.dart'; /// Style configuration for [RemixDialog] container, title, description, and actions. -@MixableStyler() -class RemixDialogStyler - extends RemixContainerStyler - with Diagnosticable, _$RemixDialogStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $container; - @MixableField(setterType: TextStyler) - final Prop>? $title; - @MixableField(setterType: TextStyler) - final Prop>? $description; - @MixableField(setterType: FlexBoxStyler) - final Prop>? $actions; - const RemixDialogStyler.create({ - Prop>? container, - Prop>? title, - Prop>? description, - Prop>? actions, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $title = title, - $description = description, - $actions = actions; - - RemixDialogStyler({ - BoxStyler? container, - TextStyler? title, - TextStyler? description, - FlexBoxStyler? actions, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - title: Prop.maybeMix(title), - description: Prop.maybeMix(description), - actions: Prop.maybeMix(actions), - variants: variants, - animation: animation, - modifier: modifier, - ); - - /// Sets container alignment - RemixDialogStyler alignment(Alignment value) { - return merge(RemixDialogStyler(container: BoxStyler(alignment: value))); - } - +extension RemixDialogStylerRemixHelpers on RemixDialogStyler { /// Sets the background color of the dialog. RemixDialogStyler backgroundColor(Color value) { return merge( @@ -58,15 +11,6 @@ class RemixDialogStyler ); } - /// Sets the shape of the dialog. - RemixDialogStyler shape(ShapeBorderMix value) { - return merge( - RemixDialogStyler( - container: BoxStyler(decoration: ShapeDecorationMix(shape: value)), - ), - ); - } - /// Creates a [RemixDialog] widget with this style applied. RemixDialog call({ Key? key, @@ -88,85 +32,4 @@ class RemixDialogStyler child: child, ); } - - // RemixContainerStyler mixin implementations - @override - RemixDialogStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixDialogStyler(container: BoxStyler(padding: value))); - } - - /// Delegates to [backgroundColor]. - @override - RemixDialogStyler color(Color value) => backgroundColor(value); - - @override - RemixDialogStyler size(double width, double height) { - return merge( - RemixDialogStyler( - container: BoxStyler( - constraints: BoxConstraintsMix( - minWidth: width, - maxWidth: width, - minHeight: height, - maxHeight: height, - ), - ), - ), - ); - } - - @override - RemixDialogStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixDialogStyler( - container: BoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - - @override - RemixDialogStyler constraints(BoxConstraintsMix value) { - return merge(RemixDialogStyler(container: BoxStyler(constraints: value))); - } - - @override - RemixDialogStyler decoration(DecorationMix value) { - return merge(RemixDialogStyler(container: BoxStyler(decoration: value))); - } - - @override - RemixDialogStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixDialogStyler(container: BoxStyler(margin: value))); - } - - @override - RemixDialogStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixDialogStyler(container: BoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixDialogStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixDialogStyler( - container: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } - - /// Sets the shadow/elevation of the dialog. - @override - RemixDialogStyler shadow(BoxShadowMix value) { - return merge( - RemixDialogStyler( - container: BoxStyler(decoration: BoxDecorationMix(boxShadow: [value])), - ), - ); - } } diff --git a/packages/remix/lib/src/components/dialog/fortal_dialog_styles.dart b/packages/remix/lib/src/components/dialog/fortal_dialog_styles.dart index 33cde460..08ad3b5e 100644 --- a/packages/remix/lib/src/components/dialog/fortal_dialog_styles.dart +++ b/packages/remix/lib/src/components/dialog/fortal_dialog_styles.dart @@ -1,7 +1,6 @@ part of 'dialog.dart'; /// Fortal-themed preset for [RemixDialog]. -@MixWidget(name: 'FortalDialog') RemixDialogStyler fortalDialogStyler() { return RemixDialogStyler() .title( @@ -40,3 +39,41 @@ RemixDialogStyler fortalDialogStyler() { .spreadRadius(0), ); } + +/// Fortal-themed preset for [RemixDialog]. +class FortalDialog extends StatelessWidget { + const FortalDialog({ + super.key, + this.child, + this.title, + this.description, + this.actions, + this.modal = true, + this.semanticLabel, + }); + + final Widget? child; + + final String? title; + + final String? description; + + final List? actions; + + final bool modal; + + final String? semanticLabel; + + @override + Widget build(BuildContext context) { + return fortalDialogStyler().call( + key: this.key, + title: this.title, + description: this.description, + actions: this.actions, + modal: this.modal, + semanticLabel: this.semanticLabel, + child: this.child, + ); + } +} diff --git a/packages/remix/lib/src/components/divider/divider.g.dart b/packages/remix/lib/src/components/divider/divider.g.dart index 75eef282..fec37347 100644 --- a/packages/remix/lib/src/components/divider/divider.g.dart +++ b/packages/remix/lib/src/components/divider/divider.g.dart @@ -74,27 +74,505 @@ mixin _$RemixDividerSpec implements Spec, Diagnosticable { typedef _$RemixDividerSpecMethods = _$RemixDividerSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixDivider]. -class FortalDivider extends StatelessWidget { - const FortalDivider({super.key, this.size = .size1}); +class RemixDividerStyler extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $container; + + const RemixDividerStyler.create({ + Prop>? container, + super.variants, + super.modifier, + super.animation, + }) : $container = container; + + RemixDividerStyler({ + BoxStyler? container, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixDividerStyler.container(BoxStyler value) => + RemixDividerStyler().container(value); + factory RemixDividerStyler.alignment(AlignmentGeometry value) => + RemixDividerStyler().alignment(value); + factory RemixDividerStyler.padding(EdgeInsetsGeometryMix value) => + RemixDividerStyler().padding(value); + factory RemixDividerStyler.margin(EdgeInsetsGeometryMix value) => + RemixDividerStyler().margin(value); + factory RemixDividerStyler.constraints(BoxConstraintsMix value) => + RemixDividerStyler().constraints(value); + factory RemixDividerStyler.decoration(DecorationMix value) => + RemixDividerStyler().decoration(value); + factory RemixDividerStyler.foregroundDecoration(DecorationMix value) => + RemixDividerStyler().foregroundDecoration(value); + factory RemixDividerStyler.clipBehavior(Clip value) => + RemixDividerStyler().clipBehavior(value); + factory RemixDividerStyler.color(Color value) => + RemixDividerStyler().color(value); + factory RemixDividerStyler.gradient(GradientMix value) => + RemixDividerStyler().gradient(value); + factory RemixDividerStyler.border(BoxBorderMix value) => + RemixDividerStyler().border(value); + factory RemixDividerStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixDividerStyler().borderRadius(value); + factory RemixDividerStyler.elevation(ElevationShadow value) => + RemixDividerStyler().elevation(value); + factory RemixDividerStyler.shadow(BoxShadowMix value) => + RemixDividerStyler().shadow(value); + factory RemixDividerStyler.shadows(List value) => + RemixDividerStyler().shadows(value); + factory RemixDividerStyler.width(double value) => + RemixDividerStyler().width(value); + factory RemixDividerStyler.height(double value) => + RemixDividerStyler().height(value); + factory RemixDividerStyler.size(double width, double height) => + RemixDividerStyler().size(width, height); + factory RemixDividerStyler.minWidth(double value) => + RemixDividerStyler().minWidth(value); + factory RemixDividerStyler.maxWidth(double value) => + RemixDividerStyler().maxWidth(value); + factory RemixDividerStyler.minHeight(double value) => + RemixDividerStyler().minHeight(value); + factory RemixDividerStyler.maxHeight(double value) => + RemixDividerStyler().maxHeight(value); + factory RemixDividerStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixDividerStyler().scale(scale, alignment: alignment); + factory RemixDividerStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixDividerStyler().rotate(radians, alignment: alignment); + factory RemixDividerStyler.translate(double x, double y, [double z = 0.0]) => + RemixDividerStyler().translate(x, y, z); + factory RemixDividerStyler.skew(double skewX, double skewY) => + RemixDividerStyler().skew(skewX, skewY); + factory RemixDividerStyler.textStyle(TextStyler value) => + RemixDividerStyler().textStyle(value); + factory RemixDividerStyler.image(DecorationImageMix value) => + RemixDividerStyler().image(value); + factory RemixDividerStyler.shape(ShapeBorderMix value) => + RemixDividerStyler().shape(value); + factory RemixDividerStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixDividerStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixDividerStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixDividerStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixDividerStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixDividerStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixDividerStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixDividerStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixDividerStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixDividerStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixDividerStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixDividerStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixDividerStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixDividerStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixDividerStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixDividerStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixDividerStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixDividerStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixDividerStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixDividerStyler().transform(value, alignment: alignment); + + RemixDividerStyler alignment(AlignmentGeometry value) { + return container(BoxStyler().alignment(value)); + } - final FortalDividerSize size; + RemixDividerStyler padding(EdgeInsetsGeometryMix value) { + return container(BoxStyler().padding(value)); + } - @override - Widget build(BuildContext context) { - return fortalDividerStyler(size: this.size).call(key: this.key); + RemixDividerStyler margin(EdgeInsetsGeometryMix value) { + return container(BoxStyler().margin(value)); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixDividerStyler constraints(BoxConstraintsMix value) { + return container(BoxStyler().constraints(value)); + } + + RemixDividerStyler decoration(DecorationMix value) { + return container(BoxStyler().decoration(value)); + } + + RemixDividerStyler foregroundDecoration(DecorationMix value) { + return container(BoxStyler().foregroundDecoration(value)); + } + + RemixDividerStyler clipBehavior(Clip value) { + return container(BoxStyler().clipBehavior(value)); + } + + RemixDividerStyler color(Color value) { + return container(BoxStyler().color(value)); + } + + RemixDividerStyler gradient(GradientMix value) { + return container(BoxStyler().gradient(value)); + } + + RemixDividerStyler border(BoxBorderMix value) { + return container(BoxStyler().border(value)); + } + + RemixDividerStyler borderRadius(BorderRadiusGeometryMix value) { + return container(BoxStyler().borderRadius(value)); + } + + RemixDividerStyler elevation(ElevationShadow value) { + return container(BoxStyler().elevation(value)); + } + + RemixDividerStyler shadow(BoxShadowMix value) { + return container(BoxStyler().shadow(value)); + } + + RemixDividerStyler shadows(List value) { + return container(BoxStyler().shadows(value)); + } + + RemixDividerStyler width(double value) { + return container(BoxStyler().width(value)); + } + + RemixDividerStyler height(double value) { + return container(BoxStyler().height(value)); + } + + RemixDividerStyler size(double width, double height) { + return container(BoxStyler().size(width, height)); + } + + RemixDividerStyler minWidth(double value) { + return container(BoxStyler().minWidth(value)); + } + + RemixDividerStyler maxWidth(double value) { + return container(BoxStyler().maxWidth(value)); + } + + RemixDividerStyler minHeight(double value) { + return container(BoxStyler().minHeight(value)); + } + + RemixDividerStyler maxHeight(double value) { + return container(BoxStyler().maxHeight(value)); + } + + RemixDividerStyler scale(double scale, {Alignment alignment = .center}) { + return container(BoxStyler().scale(scale, alignment: alignment)); + } -mixin _$RemixDividerStylerMixin on Style, Diagnosticable { - Prop>? get $container; + RemixDividerStyler rotate(double radians, {Alignment alignment = .center}) { + return container(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixDividerStyler translate(double x, double y, [double z = 0.0]) { + return container(BoxStyler().translate(x, y, z)); + } + + RemixDividerStyler skew(double skewX, double skewY) { + return container(BoxStyler().skew(skewX, skewY)); + } + + RemixDividerStyler textStyle(TextStyler value) { + return container(BoxStyler().textStyle(value)); + } + + RemixDividerStyler image(DecorationImageMix value) { + return container(BoxStyler().image(value)); + } + + RemixDividerStyler shape(ShapeBorderMix value) { + return container(BoxStyler().shape(value)); + } + + RemixDividerStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixDividerStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixDividerStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixDividerStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixDividerStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixDividerStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixDividerStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixDividerStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixDividerStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixDividerStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(BoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixDividerStyler container(BoxStyler value) { @@ -102,16 +580,19 @@ mixin _$RemixDividerStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixDividerStyler animate(AnimationConfig value) { return merge(RemixDividerStyler(animation: value)); } /// Sets the style variants. + @override RemixDividerStyler variants(List> value) { return merge(RemixDividerStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixDividerStyler wrap(WidgetModifierConfig value) { return merge(RemixDividerStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/divider/divider_spec.dart b/packages/remix/lib/src/components/divider/divider_spec.dart index 93191ba4..acffcbdd 100644 --- a/packages/remix/lib/src/components/divider/divider_spec.dart +++ b/packages/remix/lib/src/components/divider/divider_spec.dart @@ -1,9 +1,10 @@ part of 'divider.dart'; /// Resolved visual values for a [RemixDivider]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixDividerSpec with _$RemixDividerSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; const RemixDividerSpec({StyleSpec? container}) diff --git a/packages/remix/lib/src/components/divider/divider_style.dart b/packages/remix/lib/src/components/divider/divider_style.dart index 8e8bc301..7b6f6819 100644 --- a/packages/remix/lib/src/components/divider/divider_style.dart +++ b/packages/remix/lib/src/components/divider/divider_style.dart @@ -1,41 +1,7 @@ part of 'divider.dart'; /// Style configuration for a [RemixDivider] container. -@MixableStyler() -class RemixDividerStyler - extends RemixContainerStyler - with Diagnosticable, _$RemixDividerStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $container; - - const RemixDividerStyler.create({ - Prop>? container, - super.variants, - super.animation, - super.modifier, - }) : $container = container; - - RemixDividerStyler({ - BoxStyler? container, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - variants: variants, - animation: animation, - modifier: modifier, - ); - - /// Sets divider color - RemixDividerStyler color(Color value) { - return merge( - RemixDividerStyler( - container: BoxStyler(decoration: BoxDecorationMix(color: value)), - ), - ); - } - +extension RemixDividerStylerRemixHelpers on RemixDividerStyler { /// Sets divider thickness (height for horizontal, width for vertical) RemixDividerStyler thickness(double value) { return merge( @@ -47,55 +13,8 @@ class RemixDividerStyler ); } - /// Sets container padding - RemixDividerStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixDividerStyler(container: BoxStyler(padding: value))); - } - - /// Sets container margin - RemixDividerStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixDividerStyler(container: BoxStyler(margin: value))); - } - - /// Sets container alignment - RemixDividerStyler alignment(Alignment value) { - return merge(RemixDividerStyler(container: BoxStyler(alignment: value))); - } - /// Creates a [RemixDivider] widget with this style applied. RemixDivider call({Key? key}) { return RemixDivider(key: key, style: this); } - - /// Sets container decoration - @override - RemixDividerStyler decoration(DecorationMix value) { - return merge(RemixDividerStyler(container: BoxStyler(decoration: value))); - } - - // Abstract method implementations for mixins - - @override - RemixDividerStyler constraints(BoxConstraintsMix value) { - return merge(RemixDividerStyler(container: BoxStyler(constraints: value))); - } - - @override - RemixDividerStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixDividerStyler(container: BoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixDividerStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixDividerStyler( - container: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } } diff --git a/packages/remix/lib/src/components/divider/fortal_divider_styles.dart b/packages/remix/lib/src/components/divider/fortal_divider_styles.dart index 1f9296dc..8d19c641 100644 --- a/packages/remix/lib/src/components/divider/fortal_divider_styles.dart +++ b/packages/remix/lib/src/components/divider/fortal_divider_styles.dart @@ -13,7 +13,6 @@ enum FortalDividerSize { } /// Fortal-themed preset for [RemixDivider]. -@MixWidget(name: 'FortalDivider') RemixDividerStyler fortalDividerStyler({FortalDividerSize size = .size1}) { return RemixDividerStyler() .color(FortalTokens.gray6()) @@ -27,3 +26,15 @@ RemixDividerStyler _fortalDividerSizeStyler(FortalDividerSize size) { .size3 => RemixDividerStyler().thickness(3.0), }; } + +/// Fortal-themed preset for [RemixDivider]. +class FortalDivider extends StatelessWidget { + const FortalDivider({super.key, this.size = .size1}); + + final FortalDividerSize size; + + @override + Widget build(BuildContext context) { + return fortalDividerStyler(size: this.size).call(key: this.key); + } +} diff --git a/packages/remix/lib/src/components/icon_button/fortal_icon_button_styles.dart b/packages/remix/lib/src/components/icon_button/fortal_icon_button_styles.dart index 9a3db59a..c9bec245 100644 --- a/packages/remix/lib/src/components/icon_button/fortal_icon_button_styles.dart +++ b/packages/remix/lib/src/components/icon_button/fortal_icon_button_styles.dart @@ -7,7 +7,6 @@ enum FortalIconButtonSize { size1, size2, size3, size4 } enum FortalIconButtonVariant { solid, soft, surface, outline, ghost } /// Fortal-themed preset for [RemixIconButton]. -@MixWidget(name: 'FortalIconButton') RemixIconButtonStyler fortalIconButtonStyler({ FortalIconButtonVariant variant = .solid, FortalIconButtonSize size = .size2, @@ -208,3 +207,174 @@ RemixIconButtonStyler _fortalIconButtonSizeStyler(FortalIconButtonSize size) { .spinner(RemixSpinnerStyler(size: 24.0)), }; } + +/// Fortal-themed preset for [RemixIconButton]. +class FortalIconButton extends StatelessWidget { + const FortalIconButton({ + super.key, + this.variant = .solid, + this.size = .size2, + required this.icon, + this.iconBuilder, + this.loadingBuilder, + this.loading = false, + this.enabled = true, + this.enableFeedback = true, + this.onPressed, + this.onLongPress, + this.focusNode, + this.autofocus = false, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + this.mouseCursor = SystemMouseCursors.click, + }); + + const FortalIconButton.solid({ + super.key, + this.size = .size2, + required this.icon, + this.iconBuilder, + this.loadingBuilder, + this.loading = false, + this.enabled = true, + this.enableFeedback = true, + this.onPressed, + this.onLongPress, + this.focusNode, + this.autofocus = false, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalIconButtonVariant.solid; + + const FortalIconButton.soft({ + super.key, + this.size = .size2, + required this.icon, + this.iconBuilder, + this.loadingBuilder, + this.loading = false, + this.enabled = true, + this.enableFeedback = true, + this.onPressed, + this.onLongPress, + this.focusNode, + this.autofocus = false, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalIconButtonVariant.soft; + + const FortalIconButton.surface({ + super.key, + this.size = .size2, + required this.icon, + this.iconBuilder, + this.loadingBuilder, + this.loading = false, + this.enabled = true, + this.enableFeedback = true, + this.onPressed, + this.onLongPress, + this.focusNode, + this.autofocus = false, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalIconButtonVariant.surface; + + const FortalIconButton.outline({ + super.key, + this.size = .size2, + required this.icon, + this.iconBuilder, + this.loadingBuilder, + this.loading = false, + this.enabled = true, + this.enableFeedback = true, + this.onPressed, + this.onLongPress, + this.focusNode, + this.autofocus = false, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalIconButtonVariant.outline; + + const FortalIconButton.ghost({ + super.key, + this.size = .size2, + required this.icon, + this.iconBuilder, + this.loadingBuilder, + this.loading = false, + this.enabled = true, + this.enableFeedback = true, + this.onPressed, + this.onLongPress, + this.focusNode, + this.autofocus = false, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalIconButtonVariant.ghost; + + final FortalIconButtonVariant variant; + + final FortalIconButtonSize size; + + final IconData icon; + + final RemixIconButtonIconBuilder? iconBuilder; + + final RemixIconButtonLoadingBuilder? loadingBuilder; + + final bool loading; + + final bool enabled; + + final bool enableFeedback; + + final VoidCallback? onPressed; + + final VoidCallback? onLongPress; + + final FocusNode? focusNode; + + final bool autofocus; + + final String? semanticLabel; + + final String? semanticHint; + + final bool excludeSemantics; + + final MouseCursor mouseCursor; + + @override + Widget build(BuildContext context) { + return fortalIconButtonStyler(variant: this.variant, size: this.size).call( + key: this.key, + icon: this.icon, + iconBuilder: this.iconBuilder, + loadingBuilder: this.loadingBuilder, + loading: this.loading, + enabled: this.enabled, + enableFeedback: this.enableFeedback, + onPressed: this.onPressed, + onLongPress: this.onLongPress, + focusNode: this.focusNode, + autofocus: this.autofocus, + semanticLabel: this.semanticLabel, + semanticHint: this.semanticHint, + excludeSemantics: this.excludeSemantics, + mouseCursor: this.mouseCursor, + ); + } +} diff --git a/packages/remix/lib/src/components/icon_button/icon_button.g.dart b/packages/remix/lib/src/components/icon_button/icon_button.g.dart index 22a0e7a3..ab633ab2 100644 --- a/packages/remix/lib/src/components/icon_button/icon_button.g.dart +++ b/packages/remix/lib/src/components/icon_button/icon_button.g.dart @@ -92,189 +92,531 @@ mixin _$RemixIconButtonSpec typedef _$RemixIconButtonSpecMethods = _$RemixIconButtonSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixIconButton]. -class FortalIconButton extends StatelessWidget { - const FortalIconButton({ - super.key, - this.variant = .solid, - this.size = .size2, - required this.icon, - this.iconBuilder, - this.loadingBuilder, - this.loading = false, - this.enabled = true, - this.enableFeedback = true, - this.onPressed, - this.onLongPress, - this.focusNode, - this.autofocus = false, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - this.mouseCursor = SystemMouseCursors.click, - }); - - const FortalIconButton.solid({ - super.key, - this.size = .size2, - required this.icon, - this.iconBuilder, - this.loadingBuilder, - this.loading = false, - this.enabled = true, - this.enableFeedback = true, - this.onPressed, - this.onLongPress, - this.focusNode, - this.autofocus = false, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalIconButtonVariant.solid; - - const FortalIconButton.soft({ - super.key, - this.size = .size2, - required this.icon, - this.iconBuilder, - this.loadingBuilder, - this.loading = false, - this.enabled = true, - this.enableFeedback = true, - this.onPressed, - this.onLongPress, - this.focusNode, - this.autofocus = false, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalIconButtonVariant.soft; - - const FortalIconButton.surface({ - super.key, - this.size = .size2, - required this.icon, - this.iconBuilder, - this.loadingBuilder, - this.loading = false, - this.enabled = true, - this.enableFeedback = true, - this.onPressed, - this.onLongPress, - this.focusNode, - this.autofocus = false, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalIconButtonVariant.surface; - - const FortalIconButton.outline({ - super.key, - this.size = .size2, - required this.icon, - this.iconBuilder, - this.loadingBuilder, - this.loading = false, - this.enabled = true, - this.enableFeedback = true, - this.onPressed, - this.onLongPress, - this.focusNode, - this.autofocus = false, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalIconButtonVariant.outline; - - const FortalIconButton.ghost({ - super.key, - this.size = .size2, - required this.icon, - this.iconBuilder, - this.loadingBuilder, - this.loading = false, - this.enabled = true, - this.enableFeedback = true, - this.onPressed, - this.onLongPress, - this.focusNode, - this.autofocus = false, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalIconButtonVariant.ghost; - - final FortalIconButtonVariant variant; - - final FortalIconButtonSize size; - - final IconData icon; - - final RemixIconButtonIconBuilder? iconBuilder; - - final RemixIconButtonLoadingBuilder? loadingBuilder; - - final bool loading; - - final bool enabled; - - final bool enableFeedback; - - final VoidCallback? onPressed; - - final VoidCallback? onLongPress; - - final FocusNode? focusNode; - - final bool autofocus; - - final String? semanticLabel; - - final String? semanticHint; - - final bool excludeSemantics; - - final MouseCursor mouseCursor; +class RemixIconButtonStyler + extends MixStyler + with + RemixBoxStylerMixin, + IconStyleMixin { + final Prop>? $container; + final Prop>? $icon; + final Prop>? $spinner; + + const RemixIconButtonStyler.create({ + Prop>? container, + Prop>? icon, + Prop>? spinner, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $icon = icon, + $spinner = spinner; + + RemixIconButtonStyler({ + BoxStyler? container, + IconStyler? icon, + RemixSpinnerStyler? spinner, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + icon: Prop.maybeMix(icon), + spinner: Prop.maybeMix(spinner), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixIconButtonStyler.container(BoxStyler value) => + RemixIconButtonStyler().container(value); + factory RemixIconButtonStyler.icon(IconStyler value) => + RemixIconButtonStyler().icon(value); + factory RemixIconButtonStyler.spinner(RemixSpinnerStyler value) => + RemixIconButtonStyler().spinner(value); + factory RemixIconButtonStyler.alignment(AlignmentGeometry value) => + RemixIconButtonStyler().alignment(value); + factory RemixIconButtonStyler.padding(EdgeInsetsGeometryMix value) => + RemixIconButtonStyler().padding(value); + factory RemixIconButtonStyler.margin(EdgeInsetsGeometryMix value) => + RemixIconButtonStyler().margin(value); + factory RemixIconButtonStyler.constraints(BoxConstraintsMix value) => + RemixIconButtonStyler().constraints(value); + factory RemixIconButtonStyler.decoration(DecorationMix value) => + RemixIconButtonStyler().decoration(value); + factory RemixIconButtonStyler.foregroundDecoration(DecorationMix value) => + RemixIconButtonStyler().foregroundDecoration(value); + factory RemixIconButtonStyler.clipBehavior(Clip value) => + RemixIconButtonStyler().clipBehavior(value); + factory RemixIconButtonStyler.color(Color value) => + RemixIconButtonStyler().color(value); + factory RemixIconButtonStyler.gradient(GradientMix value) => + RemixIconButtonStyler().gradient(value); + factory RemixIconButtonStyler.border(BoxBorderMix value) => + RemixIconButtonStyler().border(value); + factory RemixIconButtonStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixIconButtonStyler().borderRadius(value); + factory RemixIconButtonStyler.elevation(ElevationShadow value) => + RemixIconButtonStyler().elevation(value); + factory RemixIconButtonStyler.shadow(BoxShadowMix value) => + RemixIconButtonStyler().shadow(value); + factory RemixIconButtonStyler.shadows(List value) => + RemixIconButtonStyler().shadows(value); + factory RemixIconButtonStyler.width(double value) => + RemixIconButtonStyler().width(value); + factory RemixIconButtonStyler.height(double value) => + RemixIconButtonStyler().height(value); + factory RemixIconButtonStyler.size(double width, double height) => + RemixIconButtonStyler().size(width, height); + factory RemixIconButtonStyler.minWidth(double value) => + RemixIconButtonStyler().minWidth(value); + factory RemixIconButtonStyler.maxWidth(double value) => + RemixIconButtonStyler().maxWidth(value); + factory RemixIconButtonStyler.minHeight(double value) => + RemixIconButtonStyler().minHeight(value); + factory RemixIconButtonStyler.maxHeight(double value) => + RemixIconButtonStyler().maxHeight(value); + factory RemixIconButtonStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixIconButtonStyler().scale(scale, alignment: alignment); + factory RemixIconButtonStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixIconButtonStyler().rotate(radians, alignment: alignment); + factory RemixIconButtonStyler.translate( + double x, + double y, [ + double z = 0.0, + ]) => RemixIconButtonStyler().translate(x, y, z); + factory RemixIconButtonStyler.skew(double skewX, double skewY) => + RemixIconButtonStyler().skew(skewX, skewY); + factory RemixIconButtonStyler.textStyle(TextStyler value) => + RemixIconButtonStyler().textStyle(value); + factory RemixIconButtonStyler.image(DecorationImageMix value) => + RemixIconButtonStyler().image(value); + factory RemixIconButtonStyler.shape(ShapeBorderMix value) => + RemixIconButtonStyler().shape(value); + factory RemixIconButtonStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixIconButtonStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixIconButtonStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixIconButtonStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixIconButtonStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixIconButtonStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixIconButtonStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixIconButtonStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixIconButtonStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixIconButtonStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixIconButtonStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixIconButtonStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixIconButtonStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixIconButtonStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixIconButtonStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixIconButtonStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixIconButtonStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixIconButtonStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixIconButtonStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixIconButtonStyler().transform(value, alignment: alignment); + + RemixIconButtonStyler alignment(AlignmentGeometry value) { + return container(BoxStyler().alignment(value)); + } - @override - Widget build(BuildContext context) { - return fortalIconButtonStyler(variant: this.variant, size: this.size).call( - key: this.key, - icon: this.icon, - iconBuilder: this.iconBuilder, - loadingBuilder: this.loadingBuilder, - loading: this.loading, - enabled: this.enabled, - enableFeedback: this.enableFeedback, - onPressed: this.onPressed, - onLongPress: this.onLongPress, - focusNode: this.focusNode, - autofocus: this.autofocus, - semanticLabel: this.semanticLabel, - semanticHint: this.semanticHint, - excludeSemantics: this.excludeSemantics, - mouseCursor: this.mouseCursor, + RemixIconButtonStyler padding(EdgeInsetsGeometryMix value) { + return container(BoxStyler().padding(value)); + } + + RemixIconButtonStyler margin(EdgeInsetsGeometryMix value) { + return container(BoxStyler().margin(value)); + } + + RemixIconButtonStyler constraints(BoxConstraintsMix value) { + return container(BoxStyler().constraints(value)); + } + + RemixIconButtonStyler decoration(DecorationMix value) { + return container(BoxStyler().decoration(value)); + } + + RemixIconButtonStyler foregroundDecoration(DecorationMix value) { + return container(BoxStyler().foregroundDecoration(value)); + } + + RemixIconButtonStyler clipBehavior(Clip value) { + return container(BoxStyler().clipBehavior(value)); + } + + RemixIconButtonStyler color(Color value) { + return container(BoxStyler().color(value)); + } + + RemixIconButtonStyler gradient(GradientMix value) { + return container(BoxStyler().gradient(value)); + } + + RemixIconButtonStyler border(BoxBorderMix value) { + return container(BoxStyler().border(value)); + } + + RemixIconButtonStyler borderRadius(BorderRadiusGeometryMix value) { + return container(BoxStyler().borderRadius(value)); + } + + RemixIconButtonStyler elevation(ElevationShadow value) { + return container(BoxStyler().elevation(value)); + } + + RemixIconButtonStyler shadow(BoxShadowMix value) { + return container(BoxStyler().shadow(value)); + } + + RemixIconButtonStyler shadows(List value) { + return container(BoxStyler().shadows(value)); + } + + RemixIconButtonStyler width(double value) { + return container(BoxStyler().width(value)); + } + + RemixIconButtonStyler height(double value) { + return container(BoxStyler().height(value)); + } + + RemixIconButtonStyler size(double width, double height) { + return container(BoxStyler().size(width, height)); + } + + RemixIconButtonStyler minWidth(double value) { + return container(BoxStyler().minWidth(value)); + } + + RemixIconButtonStyler maxWidth(double value) { + return container(BoxStyler().maxWidth(value)); + } + + RemixIconButtonStyler minHeight(double value) { + return container(BoxStyler().minHeight(value)); + } + + RemixIconButtonStyler maxHeight(double value) { + return container(BoxStyler().maxHeight(value)); + } + + RemixIconButtonStyler scale(double scale, {Alignment alignment = .center}) { + return container(BoxStyler().scale(scale, alignment: alignment)); + } + + RemixIconButtonStyler rotate( + double radians, { + Alignment alignment = .center, + }) { + return container(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixIconButtonStyler translate(double x, double y, [double z = 0.0]) { + return container(BoxStyler().translate(x, y, z)); + } + + RemixIconButtonStyler skew(double skewX, double skewY) { + return container(BoxStyler().skew(skewX, skewY)); + } + + RemixIconButtonStyler textStyle(TextStyler value) { + return container(BoxStyler().textStyle(value)); + } + + RemixIconButtonStyler image(DecorationImageMix value) { + return container(BoxStyler().image(value)); + } + + RemixIconButtonStyler shape(ShapeBorderMix value) { + return container(BoxStyler().shape(value)); + } + + RemixIconButtonStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixIconButtonStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixIconButtonStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } -mixin _$RemixIconButtonStylerMixin - on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $icon; - Prop>? get $spinner; + RemixIconButtonStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixIconButtonStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixIconButtonStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixIconButtonStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixIconButtonStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixIconButtonStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixIconButtonStyler transform( + Matrix4 value, { + Alignment alignment = .center, + }) { + return container(BoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixIconButtonStyler container(BoxStyler value) { @@ -282,6 +624,7 @@ mixin _$RemixIconButtonStylerMixin } /// Sets the icon. + @override RemixIconButtonStyler icon(IconStyler value) { return merge(RemixIconButtonStyler(icon: value)); } @@ -292,11 +635,13 @@ mixin _$RemixIconButtonStylerMixin } /// Sets the animation configuration. + @override RemixIconButtonStyler animate(AnimationConfig value) { return merge(RemixIconButtonStyler(animation: value)); } /// Sets the style variants. + @override RemixIconButtonStyler variants( List> value, ) { @@ -304,6 +649,7 @@ mixin _$RemixIconButtonStylerMixin } /// Wraps with a widget modifier. + @override RemixIconButtonStyler wrap(WidgetModifierConfig value) { return merge(RemixIconButtonStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/icon_button/icon_button_spec.dart b/packages/remix/lib/src/components/icon_button/icon_button_spec.dart index 1f93339b..467c248f 100644 --- a/packages/remix/lib/src/components/icon_button/icon_button_spec.dart +++ b/packages/remix/lib/src/components/icon_button/icon_button_spec.dart @@ -1,9 +1,10 @@ part of 'icon_button.dart'; /// Resolved visual properties for a [RemixIconButton]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin, IconStyleMixin]) class RemixIconButtonSpec with _$RemixIconButtonSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; @override final StyleSpec icon; diff --git a/packages/remix/lib/src/components/icon_button/icon_button_style.dart b/packages/remix/lib/src/components/icon_button/icon_button_style.dart index 67c2a056..d166e485 100644 --- a/packages/remix/lib/src/components/icon_button/icon_button_style.dart +++ b/packages/remix/lib/src/components/icon_button/icon_button_style.dart @@ -1,58 +1,7 @@ part of 'icon_button.dart'; /// Style configuration for [RemixIconButton] container, icon, and loading spinner. -@MixableStyler() -class RemixIconButtonStyler - extends RemixContainerStyler - with - IconStyleMixin, - Diagnosticable, - _$RemixIconButtonStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $container; - @MixableField(setterType: IconStyler) - final Prop>? $icon; - @MixableField(setterType: RemixSpinnerStyler) - final Prop>? $spinner; - - const RemixIconButtonStyler.create({ - Prop>? container, - Prop>? icon, - Prop>? spinner, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $icon = icon, - $spinner = spinner; - - RemixIconButtonStyler({ - BoxStyler? container, - IconStyler? icon, - RemixSpinnerStyler? spinner, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - icon: Prop.maybeMix(icon), - spinner: Prop.maybeMix(spinner), - variants: variants, - animation: animation, - modifier: modifier, - ); - - // Instance methods (chainable) - - /// Sets background color - RemixIconButtonStyler color(Color value) { - return merge( - RemixIconButtonStyler( - container: BoxStyler(decoration: BoxDecorationMix(color: value)), - ), - ); - } - +extension RemixIconButtonStylerRemixHelpers on RemixIconButtonStyler { /// Sets the background color of the icon button container. RemixIconButtonStyler backgroundColor(Color value) { return color(value); @@ -63,22 +12,6 @@ class RemixIconButtonStyler return iconColor(value); } - /// Sets padding - RemixIconButtonStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixIconButtonStyler(container: BoxStyler(padding: value))); - } - - /// Sets border radius - RemixIconButtonStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixIconButtonStyler( - container: BoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - /// Sets size (width and height - icon buttons are square) RemixIconButtonStyler iconButtonSize(double size) { return merge( @@ -95,15 +28,6 @@ class RemixIconButtonStyler ); } - /// Sets border - RemixIconButtonStyler border(BoxBorderMix value) { - return merge( - RemixIconButtonStyler( - container: BoxStyler(decoration: BoxDecorationMix(border: value)), - ), - ); - } - /// Sets the minimum size of the icon button. RemixIconButtonStyler minimumSize(Size value) { return merge( @@ -124,66 +48,6 @@ class RemixIconButtonStyler ); } - /// Sets the shape of the icon button. - RemixIconButtonStyler shape(ShapeBorderMix value) { - return merge( - RemixIconButtonStyler( - container: BoxStyler(decoration: ShapeDecorationMix(shape: value)), - ), - ); - } - - // Additional convenience methods - - /// Sets margin - RemixIconButtonStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixIconButtonStyler(container: BoxStyler(margin: value))); - } - - /// Sets container alignment - RemixIconButtonStyler alignment(Alignment value) { - return merge(RemixIconButtonStyler(container: BoxStyler(alignment: value))); - } - - /// Sets decoration - RemixIconButtonStyler decoration(DecorationMix value) { - return merge( - RemixIconButtonStyler(container: BoxStyler(decoration: value)), - ); - } - - /// Sets icon color - RemixIconButtonStyler iconColor(Color value) { - return icon(IconStyler(color: value)); - } - - /// Sets icon size - RemixIconButtonStyler iconSize(double value) { - return merge(RemixIconButtonStyler(icon: IconStyler(size: value))); - } - - /// Sets width - RemixIconButtonStyler width(double value) { - return merge( - RemixIconButtonStyler( - container: BoxStyler( - constraints: BoxConstraintsMix(minWidth: value, maxWidth: value), - ), - ), - ); - } - - /// Sets height - RemixIconButtonStyler height(double value) { - return merge( - RemixIconButtonStyler( - container: BoxStyler( - constraints: BoxConstraintsMix(minHeight: value, maxHeight: value), - ), - ), - ); - } - RemixIconButton call({ Key? key, required IconData icon, @@ -220,43 +84,4 @@ class RemixIconButtonStyler style: this, ); } - - /// Sets the shadow of the icon button. - @override - RemixIconButtonStyler shadow(BoxShadowMix value) { - return merge( - RemixIconButtonStyler( - container: BoxStyler(decoration: BoxDecorationMix(boxShadow: [value])), - ), - ); - } - - /// Sets constraints - @override - RemixIconButtonStyler constraints(BoxConstraintsMix value) { - return merge( - RemixIconButtonStyler(container: BoxStyler(constraints: value)), - ); - } - - // Abstract method implementations for mixins - - @override - RemixIconButtonStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixIconButtonStyler(container: BoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixIconButtonStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixIconButtonStyler( - container: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } } diff --git a/packages/remix/lib/src/components/menu/fortal_menu_styles.dart b/packages/remix/lib/src/components/menu/fortal_menu_styles.dart index 70584502..91b62d67 100644 --- a/packages/remix/lib/src/components/menu/fortal_menu_styles.dart +++ b/packages/remix/lib/src/components/menu/fortal_menu_styles.dart @@ -19,7 +19,6 @@ enum FortalMenuVariant { } /// Fortal-themed preset for [RemixMenu]. -@MixWidget(name: 'FortalMenu') RemixMenuStyler fortalMenuStyler({ FortalMenuVariant variant = .solid, FortalMenuSize size = .size2, @@ -191,3 +190,119 @@ RemixMenuItemStyler _fortalMenuItemSizeStyler(FortalMenuSize size) { ), }; } + +/// Fortal-themed preset for [RemixMenu]. +class FortalMenu extends StatelessWidget { + const FortalMenu({ + super.key, + this.variant = .solid, + this.size = .size2, + required this.trigger, + required this.items, + this.controller, + this.onSelected, + this.onOpen, + this.onClose, + this.onCanceled, + this.onOpenRequested, + this.onCloseRequested, + this.consumeOutsideTaps = true, + this.useRootOverlay = false, + this.closeOnClickOutside = true, + this.triggerFocusNode, + this.positioning = const OverlayPositionConfig(), + }); + + /// High-emphasis menu trigger and item hover treatment. + const FortalMenu.solid({ + super.key, + this.size = .size2, + required this.trigger, + required this.items, + this.controller, + this.onSelected, + this.onOpen, + this.onClose, + this.onCanceled, + this.onOpenRequested, + this.onCloseRequested, + this.consumeOutsideTaps = true, + this.useRootOverlay = false, + this.closeOnClickOutside = true, + this.triggerFocusNode, + this.positioning = const OverlayPositionConfig(), + }) : variant = FortalMenuVariant.solid; + + /// Subtle accent-backed menu trigger and item hover treatment. + const FortalMenu.soft({ + super.key, + this.size = .size2, + required this.trigger, + required this.items, + this.controller, + this.onSelected, + this.onOpen, + this.onClose, + this.onCanceled, + this.onOpenRequested, + this.onCloseRequested, + this.consumeOutsideTaps = true, + this.useRootOverlay = false, + this.closeOnClickOutside = true, + this.triggerFocusNode, + this.positioning = const OverlayPositionConfig(), + }) : variant = FortalMenuVariant.soft; + + final FortalMenuVariant variant; + + final FortalMenuSize size; + + final RemixMenuTrigger trigger; + + final List> items; + + final MenuController? controller; + + final ValueChanged? onSelected; + + final VoidCallback? onOpen; + + final VoidCallback? onClose; + + final VoidCallback? onCanceled; + + final RawMenuAnchorOpenRequestedCallback? onOpenRequested; + + final RawMenuAnchorCloseRequestedCallback? onCloseRequested; + + final bool consumeOutsideTaps; + + final bool useRootOverlay; + + final bool closeOnClickOutside; + + final FocusNode? triggerFocusNode; + + final OverlayPositionConfig positioning; + + @override + Widget build(BuildContext context) { + return fortalMenuStyler(variant: this.variant, size: this.size).call( + key: this.key, + trigger: this.trigger, + items: this.items, + controller: this.controller, + onSelected: this.onSelected, + onOpen: this.onOpen, + onClose: this.onClose, + onCanceled: this.onCanceled, + onOpenRequested: this.onOpenRequested, + onCloseRequested: this.onCloseRequested, + consumeOutsideTaps: this.consumeOutsideTaps, + useRootOverlay: this.useRootOverlay, + closeOnClickOutside: this.closeOnClickOutside, + triggerFocusNode: this.triggerFocusNode, + positioning: this.positioning, + ); + } +} diff --git a/packages/remix/lib/src/components/menu/menu.g.dart b/packages/remix/lib/src/components/menu/menu.g.dart index aefde4ca..46978fca 100644 --- a/packages/remix/lib/src/components/menu/menu.g.dart +++ b/packages/remix/lib/src/components/menu/menu.g.dart @@ -270,134 +270,590 @@ mixin _$RemixMenuItemSpec implements Spec, Diagnosticable { typedef _$RemixMenuItemSpecMethods = _$RemixMenuItemSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixMenu]. -class FortalMenu extends StatelessWidget { - const FortalMenu({ - super.key, - this.variant = .solid, - this.size = .size2, - required this.trigger, - required this.items, - this.controller, - this.onSelected, - this.onOpen, - this.onClose, - this.onCanceled, - this.onOpenRequested, - this.onCloseRequested, - this.consumeOutsideTaps = true, - this.useRootOverlay = false, - this.closeOnClickOutside = true, - this.triggerFocusNode, - this.positioning = const OverlayPositionConfig(), - }); - - /// High-emphasis menu trigger and item hover treatment. - const FortalMenu.solid({ - super.key, - this.size = .size2, - required this.trigger, - required this.items, - this.controller, - this.onSelected, - this.onOpen, - this.onClose, - this.onCanceled, - this.onOpenRequested, - this.onCloseRequested, - this.consumeOutsideTaps = true, - this.useRootOverlay = false, - this.closeOnClickOutside = true, - this.triggerFocusNode, - this.positioning = const OverlayPositionConfig(), - }) : variant = FortalMenuVariant.solid; - - /// Subtle accent-backed menu trigger and item hover treatment. - const FortalMenu.soft({ - super.key, - this.size = .size2, - required this.trigger, - required this.items, - this.controller, - this.onSelected, - this.onOpen, - this.onClose, - this.onCanceled, - this.onOpenRequested, - this.onCloseRequested, - this.consumeOutsideTaps = true, - this.useRootOverlay = false, - this.closeOnClickOutside = true, - this.triggerFocusNode, - this.positioning = const OverlayPositionConfig(), - }) : variant = FortalMenuVariant.soft; - - final FortalMenuVariant variant; - - final FortalMenuSize size; - - final RemixMenuTrigger trigger; - - final List> items; - - final MenuController? controller; - - final ValueChanged? onSelected; - - final VoidCallback? onOpen; - - final VoidCallback? onClose; - - final VoidCallback? onCanceled; - - final RawMenuAnchorOpenRequestedCallback? onOpenRequested; - - final RawMenuAnchorCloseRequestedCallback? onCloseRequested; - - final bool consumeOutsideTaps; - - final bool useRootOverlay; - - final bool closeOnClickOutside; - - final FocusNode? triggerFocusNode; - - final OverlayPositionConfig positioning; - - @override - Widget build(BuildContext context) { - return fortalMenuStyler(variant: this.variant, size: this.size).call( - key: this.key, - trigger: this.trigger, - items: this.items, - controller: this.controller, - onSelected: this.onSelected, - onOpen: this.onOpen, - onClose: this.onClose, - onCanceled: this.onCanceled, - onOpenRequested: this.onOpenRequested, - onCloseRequested: this.onCloseRequested, - consumeOutsideTaps: this.consumeOutsideTaps, - useRootOverlay: this.useRootOverlay, - closeOnClickOutside: this.closeOnClickOutside, - triggerFocusNode: this.triggerFocusNode, - positioning: this.positioning, +class RemixMenuTriggerStyler + extends MixStyler + with + RemixBoxStylerMixin, + LabelStyleMixin, + IconStyleMixin { + final Prop>? $container; + final Prop>? $label; + final Prop>? $icon; + + const RemixMenuTriggerStyler.create({ + Prop>? container, + Prop>? label, + Prop>? icon, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $label = label, + $icon = icon; + + RemixMenuTriggerStyler({ + FlexBoxStyler? container, + TextStyler? label, + IconStyler? icon, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + label: Prop.maybeMix(label), + icon: Prop.maybeMix(icon), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixMenuTriggerStyler.container(FlexBoxStyler value) => + RemixMenuTriggerStyler().container(value); + factory RemixMenuTriggerStyler.label(TextStyler value) => + RemixMenuTriggerStyler().label(value); + factory RemixMenuTriggerStyler.icon(IconStyler value) => + RemixMenuTriggerStyler().icon(value); + factory RemixMenuTriggerStyler.color(Color value) => + RemixMenuTriggerStyler().color(value); + factory RemixMenuTriggerStyler.gradient(GradientMix value) => + RemixMenuTriggerStyler().gradient(value); + factory RemixMenuTriggerStyler.border(BoxBorderMix value) => + RemixMenuTriggerStyler().border(value); + factory RemixMenuTriggerStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixMenuTriggerStyler().borderRadius(value); + factory RemixMenuTriggerStyler.elevation(ElevationShadow value) => + RemixMenuTriggerStyler().elevation(value); + factory RemixMenuTriggerStyler.shadow(BoxShadowMix value) => + RemixMenuTriggerStyler().shadow(value); + factory RemixMenuTriggerStyler.shadows(List value) => + RemixMenuTriggerStyler().shadows(value); + factory RemixMenuTriggerStyler.width(double value) => + RemixMenuTriggerStyler().width(value); + factory RemixMenuTriggerStyler.height(double value) => + RemixMenuTriggerStyler().height(value); + factory RemixMenuTriggerStyler.size(double width, double height) => + RemixMenuTriggerStyler().size(width, height); + factory RemixMenuTriggerStyler.minWidth(double value) => + RemixMenuTriggerStyler().minWidth(value); + factory RemixMenuTriggerStyler.maxWidth(double value) => + RemixMenuTriggerStyler().maxWidth(value); + factory RemixMenuTriggerStyler.minHeight(double value) => + RemixMenuTriggerStyler().minHeight(value); + factory RemixMenuTriggerStyler.maxHeight(double value) => + RemixMenuTriggerStyler().maxHeight(value); + factory RemixMenuTriggerStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixMenuTriggerStyler().scale(scale, alignment: alignment); + factory RemixMenuTriggerStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixMenuTriggerStyler().rotate(radians, alignment: alignment); + factory RemixMenuTriggerStyler.translate( + double x, + double y, [ + double z = 0.0, + ]) => RemixMenuTriggerStyler().translate(x, y, z); + factory RemixMenuTriggerStyler.skew(double skewX, double skewY) => + RemixMenuTriggerStyler().skew(skewX, skewY); + factory RemixMenuTriggerStyler.textStyle(TextStyler value) => + RemixMenuTriggerStyler().textStyle(value); + factory RemixMenuTriggerStyler.image(DecorationImageMix value) => + RemixMenuTriggerStyler().image(value); + factory RemixMenuTriggerStyler.shape(ShapeBorderMix value) => + RemixMenuTriggerStyler().shape(value); + factory RemixMenuTriggerStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixMenuTriggerStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixMenuTriggerStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixMenuTriggerStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixMenuTriggerStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixMenuTriggerStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixMenuTriggerStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixMenuTriggerStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixMenuTriggerStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixMenuTriggerStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixMenuTriggerStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixMenuTriggerStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixMenuTriggerStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixMenuTriggerStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixMenuTriggerStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixMenuTriggerStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixMenuTriggerStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixMenuTriggerStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixMenuTriggerStyler.row() => RemixMenuTriggerStyler().row(); + factory RemixMenuTriggerStyler.column() => RemixMenuTriggerStyler().column(); + factory RemixMenuTriggerStyler.alignment(AlignmentGeometry value) => + RemixMenuTriggerStyler().alignment(value); + factory RemixMenuTriggerStyler.padding(EdgeInsetsGeometryMix value) => + RemixMenuTriggerStyler().padding(value); + factory RemixMenuTriggerStyler.margin(EdgeInsetsGeometryMix value) => + RemixMenuTriggerStyler().margin(value); + factory RemixMenuTriggerStyler.constraints(BoxConstraintsMix value) => + RemixMenuTriggerStyler().constraints(value); + factory RemixMenuTriggerStyler.decoration(DecorationMix value) => + RemixMenuTriggerStyler().decoration(value); + factory RemixMenuTriggerStyler.foregroundDecoration(DecorationMix value) => + RemixMenuTriggerStyler().foregroundDecoration(value); + factory RemixMenuTriggerStyler.clipBehavior(Clip value) => + RemixMenuTriggerStyler().clipBehavior(value); + factory RemixMenuTriggerStyler.direction(Axis value) => + RemixMenuTriggerStyler().direction(value); + factory RemixMenuTriggerStyler.mainAxisAlignment(MainAxisAlignment value) => + RemixMenuTriggerStyler().mainAxisAlignment(value); + factory RemixMenuTriggerStyler.crossAxisAlignment(CrossAxisAlignment value) => + RemixMenuTriggerStyler().crossAxisAlignment(value); + factory RemixMenuTriggerStyler.mainAxisSize(MainAxisSize value) => + RemixMenuTriggerStyler().mainAxisSize(value); + factory RemixMenuTriggerStyler.spacing(double value) => + RemixMenuTriggerStyler().spacing(value); + factory RemixMenuTriggerStyler.verticalDirection(VerticalDirection value) => + RemixMenuTriggerStyler().verticalDirection(value); + factory RemixMenuTriggerStyler.textDirection(TextDirection value) => + RemixMenuTriggerStyler().textDirection(value); + factory RemixMenuTriggerStyler.textBaseline(TextBaseline value) => + RemixMenuTriggerStyler().textBaseline(value); + factory RemixMenuTriggerStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixMenuTriggerStyler().transform(value, alignment: alignment); + + RemixMenuTriggerStyler color(Color value) { + return container(FlexBoxStyler().color(value)); + } + + RemixMenuTriggerStyler gradient(GradientMix value) { + return container(FlexBoxStyler().gradient(value)); + } + + RemixMenuTriggerStyler border(BoxBorderMix value) { + return container(FlexBoxStyler().border(value)); + } + + RemixMenuTriggerStyler borderRadius(BorderRadiusGeometryMix value) { + return container(FlexBoxStyler().borderRadius(value)); + } + + RemixMenuTriggerStyler elevation(ElevationShadow value) { + return container(FlexBoxStyler().elevation(value)); + } + + RemixMenuTriggerStyler shadow(BoxShadowMix value) { + return container(FlexBoxStyler().shadow(value)); + } + + RemixMenuTriggerStyler shadows(List value) { + return container(FlexBoxStyler().shadows(value)); + } + + RemixMenuTriggerStyler width(double value) { + return container(FlexBoxStyler().width(value)); + } + + RemixMenuTriggerStyler height(double value) { + return container(FlexBoxStyler().height(value)); + } + + RemixMenuTriggerStyler size(double width, double height) { + return container(FlexBoxStyler().size(width, height)); + } + + RemixMenuTriggerStyler minWidth(double value) { + return container(FlexBoxStyler().minWidth(value)); + } + + RemixMenuTriggerStyler maxWidth(double value) { + return container(FlexBoxStyler().maxWidth(value)); + } + + RemixMenuTriggerStyler minHeight(double value) { + return container(FlexBoxStyler().minHeight(value)); + } + + RemixMenuTriggerStyler maxHeight(double value) { + return container(FlexBoxStyler().maxHeight(value)); + } + + RemixMenuTriggerStyler scale(double scale, {Alignment alignment = .center}) { + return container(FlexBoxStyler().scale(scale, alignment: alignment)); + } + + RemixMenuTriggerStyler rotate( + double radians, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().rotate(radians, alignment: alignment)); + } + + RemixMenuTriggerStyler translate(double x, double y, [double z = 0.0]) { + return container(FlexBoxStyler().translate(x, y, z)); + } + + RemixMenuTriggerStyler skew(double skewX, double skewY) { + return container(FlexBoxStyler().skew(skewX, skewY)); + } + + RemixMenuTriggerStyler textStyle(TextStyler value) { + return container(FlexBoxStyler().textStyle(value)); + } + + RemixMenuTriggerStyler image(DecorationImageMix value) { + return container(FlexBoxStyler().image(value)); + } + + RemixMenuTriggerStyler shape(ShapeBorderMix value) { + return container(FlexBoxStyler().shape(value)); + } + + RemixMenuTriggerStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixMenuTriggerStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixMenuTriggerStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixMenuTriggerStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixMenuTriggerStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixMenuTriggerStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixMenuTriggerStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixMenuTriggerStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixMenuTriggerStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixMenuTriggerStyler row() { + return container(FlexBoxStyler().row()); + } + + RemixMenuTriggerStyler column() { + return container(FlexBoxStyler().column()); + } + + RemixMenuTriggerStyler alignment(AlignmentGeometry value) { + return container(FlexBoxStyler().alignment(value)); + } + + RemixMenuTriggerStyler padding(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().padding(value)); + } + + RemixMenuTriggerStyler margin(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().margin(value)); + } + + RemixMenuTriggerStyler constraints(BoxConstraintsMix value) { + return container(FlexBoxStyler().constraints(value)); + } -mixin _$RemixMenuTriggerStylerMixin - on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $label; - Prop>? get $icon; + RemixMenuTriggerStyler decoration(DecorationMix value) { + return container(FlexBoxStyler().decoration(value)); + } + + RemixMenuTriggerStyler foregroundDecoration(DecorationMix value) { + return container(FlexBoxStyler().foregroundDecoration(value)); + } + + RemixMenuTriggerStyler clipBehavior(Clip value) { + return container(FlexBoxStyler().clipBehavior(value)); + } + + RemixMenuTriggerStyler direction(Axis value) { + return container(FlexBoxStyler().direction(value)); + } + + RemixMenuTriggerStyler mainAxisAlignment(MainAxisAlignment value) { + return container(FlexBoxStyler().mainAxisAlignment(value)); + } + + RemixMenuTriggerStyler crossAxisAlignment(CrossAxisAlignment value) { + return container(FlexBoxStyler().crossAxisAlignment(value)); + } + + RemixMenuTriggerStyler mainAxisSize(MainAxisSize value) { + return container(FlexBoxStyler().mainAxisSize(value)); + } + + RemixMenuTriggerStyler spacing(double value) { + return container(FlexBoxStyler().spacing(value)); + } + + RemixMenuTriggerStyler verticalDirection(VerticalDirection value) { + return container(FlexBoxStyler().verticalDirection(value)); + } + + RemixMenuTriggerStyler textDirection(TextDirection value) { + return container(FlexBoxStyler().textDirection(value)); + } + + RemixMenuTriggerStyler textBaseline(TextBaseline value) { + return container(FlexBoxStyler().textBaseline(value)); + } + + RemixMenuTriggerStyler transform( + Matrix4 value, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixMenuTriggerStyler container(FlexBoxStyler value) { @@ -405,21 +861,25 @@ mixin _$RemixMenuTriggerStylerMixin } /// Sets the label. + @override RemixMenuTriggerStyler label(TextStyler value) { return merge(RemixMenuTriggerStyler(label: value)); } /// Sets the icon. + @override RemixMenuTriggerStyler icon(IconStyler value) { return merge(RemixMenuTriggerStyler(icon: value)); } /// Sets the animation configuration. + @override RemixMenuTriggerStyler animate(AnimationConfig value) { return merge(RemixMenuTriggerStyler(animation: value)); } /// Sets the style variants. + @override RemixMenuTriggerStyler variants( List> value, ) { @@ -427,6 +887,7 @@ mixin _$RemixMenuTriggerStylerMixin } /// Wraps with a widget modifier. + @override RemixMenuTriggerStyler wrap(WidgetModifierConfig value) { return merge(RemixMenuTriggerStyler(modifier: value)); } @@ -485,11 +946,51 @@ mixin _$RemixMenuTriggerStylerMixin ]; } -mixin _$RemixMenuStylerMixin on Style, Diagnosticable { - Prop>? get $trigger; - Prop>? get $overlay; - Prop>? get $item; - Prop>? get $divider; +class RemixMenuStyler extends MixStyler { + final Prop>? $trigger; + final Prop>? $overlay; + final Prop>? $item; + final Prop>? $divider; + + const RemixMenuStyler.create({ + Prop>? trigger, + Prop>? overlay, + Prop>? item, + Prop>? divider, + super.variants, + super.modifier, + super.animation, + }) : $trigger = trigger, + $overlay = overlay, + $item = item, + $divider = divider; + + RemixMenuStyler({ + RemixMenuTriggerStyler? trigger, + FlexBoxStyler? overlay, + RemixMenuItemStyler? item, + RemixDividerStyler? divider, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + trigger: Prop.maybeMix(trigger), + overlay: Prop.maybeMix(overlay), + item: Prop.maybeMix(item), + divider: Prop.maybeMix(divider), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixMenuStyler.trigger(RemixMenuTriggerStyler value) => + RemixMenuStyler().trigger(value); + factory RemixMenuStyler.overlay(FlexBoxStyler value) => + RemixMenuStyler().overlay(value); + factory RemixMenuStyler.item(RemixMenuItemStyler value) => + RemixMenuStyler().item(value); + factory RemixMenuStyler.divider(RemixDividerStyler value) => + RemixMenuStyler().divider(value); /// Sets the trigger. RemixMenuStyler trigger(RemixMenuTriggerStyler value) { @@ -512,16 +1013,19 @@ mixin _$RemixMenuStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixMenuStyler animate(AnimationConfig value) { return merge(RemixMenuStyler(animation: value)); } /// Sets the style variants. + @override RemixMenuStyler variants(List> value) { return merge(RemixMenuStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixMenuStyler wrap(WidgetModifierConfig value) { return merge(RemixMenuStyler(modifier: value)); } @@ -584,11 +1088,585 @@ mixin _$RemixMenuStylerMixin on Style, Diagnosticable { ]; } -mixin _$RemixMenuItemStylerMixin on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $label; - Prop>? get $leadingIcon; - Prop>? get $trailingIcon; +class RemixMenuItemStyler + extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $container; + final Prop>? $label; + final Prop>? $leadingIcon; + final Prop>? $trailingIcon; + + const RemixMenuItemStyler.create({ + Prop>? container, + Prop>? label, + Prop>? leadingIcon, + Prop>? trailingIcon, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $label = label, + $leadingIcon = leadingIcon, + $trailingIcon = trailingIcon; + + RemixMenuItemStyler({ + FlexBoxStyler? container, + TextStyler? label, + IconStyler? leadingIcon, + IconStyler? trailingIcon, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + label: Prop.maybeMix(label), + leadingIcon: Prop.maybeMix(leadingIcon), + trailingIcon: Prop.maybeMix(trailingIcon), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixMenuItemStyler.container(FlexBoxStyler value) => + RemixMenuItemStyler().container(value); + factory RemixMenuItemStyler.label(TextStyler value) => + RemixMenuItemStyler().label(value); + factory RemixMenuItemStyler.leadingIcon(IconStyler value) => + RemixMenuItemStyler().leadingIcon(value); + factory RemixMenuItemStyler.trailingIcon(IconStyler value) => + RemixMenuItemStyler().trailingIcon(value); + factory RemixMenuItemStyler.color(Color value) => + RemixMenuItemStyler().color(value); + factory RemixMenuItemStyler.gradient(GradientMix value) => + RemixMenuItemStyler().gradient(value); + factory RemixMenuItemStyler.border(BoxBorderMix value) => + RemixMenuItemStyler().border(value); + factory RemixMenuItemStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixMenuItemStyler().borderRadius(value); + factory RemixMenuItemStyler.elevation(ElevationShadow value) => + RemixMenuItemStyler().elevation(value); + factory RemixMenuItemStyler.shadow(BoxShadowMix value) => + RemixMenuItemStyler().shadow(value); + factory RemixMenuItemStyler.shadows(List value) => + RemixMenuItemStyler().shadows(value); + factory RemixMenuItemStyler.width(double value) => + RemixMenuItemStyler().width(value); + factory RemixMenuItemStyler.height(double value) => + RemixMenuItemStyler().height(value); + factory RemixMenuItemStyler.size(double width, double height) => + RemixMenuItemStyler().size(width, height); + factory RemixMenuItemStyler.minWidth(double value) => + RemixMenuItemStyler().minWidth(value); + factory RemixMenuItemStyler.maxWidth(double value) => + RemixMenuItemStyler().maxWidth(value); + factory RemixMenuItemStyler.minHeight(double value) => + RemixMenuItemStyler().minHeight(value); + factory RemixMenuItemStyler.maxHeight(double value) => + RemixMenuItemStyler().maxHeight(value); + factory RemixMenuItemStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixMenuItemStyler().scale(scale, alignment: alignment); + factory RemixMenuItemStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixMenuItemStyler().rotate(radians, alignment: alignment); + factory RemixMenuItemStyler.translate(double x, double y, [double z = 0.0]) => + RemixMenuItemStyler().translate(x, y, z); + factory RemixMenuItemStyler.skew(double skewX, double skewY) => + RemixMenuItemStyler().skew(skewX, skewY); + factory RemixMenuItemStyler.textStyle(TextStyler value) => + RemixMenuItemStyler().textStyle(value); + factory RemixMenuItemStyler.image(DecorationImageMix value) => + RemixMenuItemStyler().image(value); + factory RemixMenuItemStyler.shape(ShapeBorderMix value) => + RemixMenuItemStyler().shape(value); + factory RemixMenuItemStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixMenuItemStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixMenuItemStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixMenuItemStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixMenuItemStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixMenuItemStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixMenuItemStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixMenuItemStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixMenuItemStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixMenuItemStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixMenuItemStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixMenuItemStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixMenuItemStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixMenuItemStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixMenuItemStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixMenuItemStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixMenuItemStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixMenuItemStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixMenuItemStyler.row() => RemixMenuItemStyler().row(); + factory RemixMenuItemStyler.column() => RemixMenuItemStyler().column(); + factory RemixMenuItemStyler.alignment(AlignmentGeometry value) => + RemixMenuItemStyler().alignment(value); + factory RemixMenuItemStyler.padding(EdgeInsetsGeometryMix value) => + RemixMenuItemStyler().padding(value); + factory RemixMenuItemStyler.margin(EdgeInsetsGeometryMix value) => + RemixMenuItemStyler().margin(value); + factory RemixMenuItemStyler.constraints(BoxConstraintsMix value) => + RemixMenuItemStyler().constraints(value); + factory RemixMenuItemStyler.decoration(DecorationMix value) => + RemixMenuItemStyler().decoration(value); + factory RemixMenuItemStyler.foregroundDecoration(DecorationMix value) => + RemixMenuItemStyler().foregroundDecoration(value); + factory RemixMenuItemStyler.clipBehavior(Clip value) => + RemixMenuItemStyler().clipBehavior(value); + factory RemixMenuItemStyler.direction(Axis value) => + RemixMenuItemStyler().direction(value); + factory RemixMenuItemStyler.mainAxisAlignment(MainAxisAlignment value) => + RemixMenuItemStyler().mainAxisAlignment(value); + factory RemixMenuItemStyler.crossAxisAlignment(CrossAxisAlignment value) => + RemixMenuItemStyler().crossAxisAlignment(value); + factory RemixMenuItemStyler.mainAxisSize(MainAxisSize value) => + RemixMenuItemStyler().mainAxisSize(value); + factory RemixMenuItemStyler.spacing(double value) => + RemixMenuItemStyler().spacing(value); + factory RemixMenuItemStyler.verticalDirection(VerticalDirection value) => + RemixMenuItemStyler().verticalDirection(value); + factory RemixMenuItemStyler.textDirection(TextDirection value) => + RemixMenuItemStyler().textDirection(value); + factory RemixMenuItemStyler.textBaseline(TextBaseline value) => + RemixMenuItemStyler().textBaseline(value); + factory RemixMenuItemStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixMenuItemStyler().transform(value, alignment: alignment); + + RemixMenuItemStyler color(Color value) { + return container(FlexBoxStyler().color(value)); + } + + RemixMenuItemStyler gradient(GradientMix value) { + return container(FlexBoxStyler().gradient(value)); + } + + RemixMenuItemStyler border(BoxBorderMix value) { + return container(FlexBoxStyler().border(value)); + } + + RemixMenuItemStyler borderRadius(BorderRadiusGeometryMix value) { + return container(FlexBoxStyler().borderRadius(value)); + } + + RemixMenuItemStyler elevation(ElevationShadow value) { + return container(FlexBoxStyler().elevation(value)); + } + + RemixMenuItemStyler shadow(BoxShadowMix value) { + return container(FlexBoxStyler().shadow(value)); + } + + RemixMenuItemStyler shadows(List value) { + return container(FlexBoxStyler().shadows(value)); + } + + RemixMenuItemStyler width(double value) { + return container(FlexBoxStyler().width(value)); + } + + RemixMenuItemStyler height(double value) { + return container(FlexBoxStyler().height(value)); + } + + RemixMenuItemStyler size(double width, double height) { + return container(FlexBoxStyler().size(width, height)); + } + + RemixMenuItemStyler minWidth(double value) { + return container(FlexBoxStyler().minWidth(value)); + } + + RemixMenuItemStyler maxWidth(double value) { + return container(FlexBoxStyler().maxWidth(value)); + } + + RemixMenuItemStyler minHeight(double value) { + return container(FlexBoxStyler().minHeight(value)); + } + + RemixMenuItemStyler maxHeight(double value) { + return container(FlexBoxStyler().maxHeight(value)); + } + + RemixMenuItemStyler scale(double scale, {Alignment alignment = .center}) { + return container(FlexBoxStyler().scale(scale, alignment: alignment)); + } + + RemixMenuItemStyler rotate(double radians, {Alignment alignment = .center}) { + return container(FlexBoxStyler().rotate(radians, alignment: alignment)); + } + + RemixMenuItemStyler translate(double x, double y, [double z = 0.0]) { + return container(FlexBoxStyler().translate(x, y, z)); + } + + RemixMenuItemStyler skew(double skewX, double skewY) { + return container(FlexBoxStyler().skew(skewX, skewY)); + } + + RemixMenuItemStyler textStyle(TextStyler value) { + return container(FlexBoxStyler().textStyle(value)); + } + + RemixMenuItemStyler image(DecorationImageMix value) { + return container(FlexBoxStyler().image(value)); + } + + RemixMenuItemStyler shape(ShapeBorderMix value) { + return container(FlexBoxStyler().shape(value)); + } + + RemixMenuItemStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixMenuItemStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixMenuItemStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixMenuItemStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixMenuItemStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixMenuItemStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixMenuItemStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixMenuItemStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixMenuItemStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixMenuItemStyler row() { + return container(FlexBoxStyler().row()); + } + + RemixMenuItemStyler column() { + return container(FlexBoxStyler().column()); + } + + RemixMenuItemStyler alignment(AlignmentGeometry value) { + return container(FlexBoxStyler().alignment(value)); + } + + RemixMenuItemStyler padding(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().padding(value)); + } + + RemixMenuItemStyler margin(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().margin(value)); + } + + RemixMenuItemStyler constraints(BoxConstraintsMix value) { + return container(FlexBoxStyler().constraints(value)); + } + + RemixMenuItemStyler decoration(DecorationMix value) { + return container(FlexBoxStyler().decoration(value)); + } + + RemixMenuItemStyler foregroundDecoration(DecorationMix value) { + return container(FlexBoxStyler().foregroundDecoration(value)); + } + + RemixMenuItemStyler clipBehavior(Clip value) { + return container(FlexBoxStyler().clipBehavior(value)); + } + + RemixMenuItemStyler direction(Axis value) { + return container(FlexBoxStyler().direction(value)); + } + + RemixMenuItemStyler mainAxisAlignment(MainAxisAlignment value) { + return container(FlexBoxStyler().mainAxisAlignment(value)); + } + + RemixMenuItemStyler crossAxisAlignment(CrossAxisAlignment value) { + return container(FlexBoxStyler().crossAxisAlignment(value)); + } + + RemixMenuItemStyler mainAxisSize(MainAxisSize value) { + return container(FlexBoxStyler().mainAxisSize(value)); + } + + RemixMenuItemStyler spacing(double value) { + return container(FlexBoxStyler().spacing(value)); + } + + RemixMenuItemStyler verticalDirection(VerticalDirection value) { + return container(FlexBoxStyler().verticalDirection(value)); + } + + RemixMenuItemStyler textDirection(TextDirection value) { + return container(FlexBoxStyler().textDirection(value)); + } + + RemixMenuItemStyler textBaseline(TextBaseline value) { + return container(FlexBoxStyler().textBaseline(value)); + } + + RemixMenuItemStyler transform( + Matrix4 value, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixMenuItemStyler container(FlexBoxStyler value) { @@ -611,16 +1689,19 @@ mixin _$RemixMenuItemStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixMenuItemStyler animate(AnimationConfig value) { return merge(RemixMenuItemStyler(animation: value)); } /// Sets the style variants. + @override RemixMenuItemStyler variants(List> value) { return merge(RemixMenuItemStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixMenuItemStyler wrap(WidgetModifierConfig value) { return merge(RemixMenuItemStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/menu/menu_spec.dart b/packages/remix/lib/src/components/menu/menu_spec.dart index 275afdae..815adbec 100644 --- a/packages/remix/lib/src/components/menu/menu_spec.dart +++ b/packages/remix/lib/src/components/menu/menu_spec.dart @@ -4,10 +4,13 @@ part of 'menu.dart'; /// /// This spec styles the trigger content only. The interactive trigger behavior /// is provided by the underlying Naked menu button. -@MixableSpec() +@MixableSpec( + extraStylerMixins: [RemixBoxStylerMixin, LabelStyleMixin, IconStyleMixin], +) class RemixMenuTriggerSpec with _$RemixMenuTriggerSpec { /// Layout and decoration for the trigger content row. @override + @MixableField(forwardStyler: true) final StyleSpec container; /// Text style for the trigger label. @@ -63,10 +66,11 @@ class RemixMenuSpec with _$RemixMenuSpec { } /// Resolved visual properties for a [RemixMenuItem]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixMenuItemSpec with _$RemixMenuItemSpec { /// Layout and decoration for the item row. @override + @MixableField(forwardStyler: true) final StyleSpec container; /// Text style for the item label. diff --git a/packages/remix/lib/src/components/menu/menu_style.dart b/packages/remix/lib/src/components/menu/menu_style.dart index 740857e1..0a050b07 100644 --- a/packages/remix/lib/src/components/menu/menu_style.dart +++ b/packages/remix/lib/src/components/menu/menu_style.dart @@ -4,144 +4,7 @@ part of 'menu.dart'; /// /// Naked menu behavior wraps the trigger in a button; this style only controls /// the visible trigger content. -@MixableStyler() -class RemixMenuTriggerStyler - extends - RemixFlexContainerStyler - with - LabelStyleMixin, - IconStyleMixin, - Diagnosticable, - _$RemixMenuTriggerStylerMixin { - @MixableField(setterType: FlexBoxStyler) - final Prop>? $container; - @MixableField(setterType: TextStyler) - final Prop>? $label; - @MixableField(setterType: IconStyler) - final Prop>? $icon; - - const RemixMenuTriggerStyler.create({ - Prop>? container, - Prop>? label, - Prop>? icon, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $label = label, - $icon = icon; - - RemixMenuTriggerStyler({ - FlexBoxStyler? container, - TextStyler? label, - IconStyler? icon, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - label: Prop.maybeMix(label), - icon: Prop.maybeMix(icon), - variants: variants, - animation: animation, - modifier: modifier, - ); - - RemixMenuTriggerStyler alignment(Alignment value) { - return merge( - RemixMenuTriggerStyler(container: FlexBoxStyler(alignment: value)), - ); - } - - @override - RemixMenuTriggerStyler padding(EdgeInsetsGeometryMix value) { - return merge( - RemixMenuTriggerStyler(container: FlexBoxStyler(padding: value)), - ); - } - - @override - RemixMenuTriggerStyler color(Color value) { - return merge( - RemixMenuTriggerStyler( - container: FlexBoxStyler(decoration: BoxDecorationMix(color: value)), - ), - ); - } - - @override - RemixMenuTriggerStyler size(double width, double height) { - return merge( - RemixMenuTriggerStyler( - container: FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: width, - maxWidth: width, - minHeight: height, - maxHeight: height, - ), - ), - ), - ); - } - - @override - RemixMenuTriggerStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixMenuTriggerStyler( - container: FlexBoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - - @override - RemixMenuTriggerStyler constraints(BoxConstraintsMix value) { - return merge( - RemixMenuTriggerStyler(container: FlexBoxStyler(constraints: value)), - ); - } - - @override - RemixMenuTriggerStyler decoration(DecorationMix value) { - return merge( - RemixMenuTriggerStyler(container: FlexBoxStyler(decoration: value)), - ); - } - - @override - RemixMenuTriggerStyler margin(EdgeInsetsGeometryMix value) { - return merge( - RemixMenuTriggerStyler(container: FlexBoxStyler(margin: value)), - ); - } - - @override - RemixMenuTriggerStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixMenuTriggerStyler( - container: FlexBoxStyler(foregroundDecoration: value), - ), - ); - } - - @override - RemixMenuTriggerStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixMenuTriggerStyler( - container: FlexBoxStyler( - transform: value, - transformAlignment: alignment, - ), - ), - ); - } - - @override +extension RemixMenuTriggerStylerRemixHelpers on RemixMenuTriggerStyler { RemixMenuTriggerStyler flex(FlexStyler value) { return merge( RemixMenuTriggerStyler(container: FlexBoxStyler().flex(value)), @@ -150,56 +13,7 @@ class RemixMenuTriggerStyler } /// Style configuration for [RemixMenu] trigger, overlay, items, and dividers. -@MixableStyler() -class RemixMenuStyler extends RemixStyler - with Diagnosticable, _$RemixMenuStylerMixin { - /// Trigger styling (resolved into spec) - @MixableField(setterType: RemixMenuTriggerStyler) - final Prop>? $trigger; - - /// Overlay styling (resolved into spec) - @MixableField(setterType: FlexBoxStyler) - final Prop>? $overlay; - - /// Default item style resolved by each item against its own widget state. - @MixableField(setterType: RemixMenuItemStyler) - final Prop>? $item; - - /// Default divider style for separators in the overlay. - @MixableField(setterType: RemixDividerStyler) - final Prop>? $divider; - - const RemixMenuStyler.create({ - Prop>? trigger, - Prop>? overlay, - Prop>? item, - Prop>? divider, - super.variants, - super.animation, - super.modifier, - }) : $trigger = trigger, - $overlay = overlay, - $item = item, - $divider = divider; - - RemixMenuStyler({ - RemixMenuTriggerStyler? trigger, - FlexBoxStyler? overlay, - RemixMenuItemStyler? item, - RemixDividerStyler? divider, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - trigger: Prop.maybeMix(trigger), - overlay: Prop.maybeMix(overlay), - item: Prop.maybeMix(item), - divider: Prop.maybeMix(divider), - variants: variants, - animation: animation, - modifier: modifier, - ); - +extension RemixMenuStylerRemixHelpers on RemixMenuStyler { /// Creates a [RemixMenu] widget with this style applied. /// /// Example: @@ -251,143 +65,7 @@ class RemixMenuStyler extends RemixStyler } /// Style configuration for an item in a [RemixMenu]. -@MixableStyler() -class RemixMenuItemStyler - extends RemixFlexContainerStyler - with Diagnosticable, _$RemixMenuItemStylerMixin { - @MixableField(setterType: FlexBoxStyler) - final Prop>? $container; - @MixableField(setterType: TextStyler) - final Prop>? $label; - @MixableField(setterType: IconStyler) - final Prop>? $leadingIcon; - @MixableField(setterType: IconStyler) - final Prop>? $trailingIcon; - - const RemixMenuItemStyler.create({ - Prop>? container, - Prop>? label, - Prop>? leadingIcon, - Prop>? trailingIcon, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $label = label, - $leadingIcon = leadingIcon, - $trailingIcon = trailingIcon; - - RemixMenuItemStyler({ - FlexBoxStyler? container, - TextStyler? label, - IconStyler? leadingIcon, - IconStyler? trailingIcon, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - label: Prop.maybeMix(label), - leadingIcon: Prop.maybeMix(leadingIcon), - trailingIcon: Prop.maybeMix(trailingIcon), - variants: variants, - animation: animation, - modifier: modifier, - ); - - /// Sets container alignment - RemixMenuItemStyler alignment(Alignment value) { - return merge( - RemixMenuItemStyler(container: FlexBoxStyler(alignment: value)), - ); - } - - // RemixFlexContainerStyler mixin implementations - @override - RemixMenuItemStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixMenuItemStyler(container: FlexBoxStyler(padding: value))); - } - - @override - RemixMenuItemStyler color(Color value) { - return merge( - RemixMenuItemStyler( - container: FlexBoxStyler(decoration: BoxDecorationMix(color: value)), - ), - ); - } - - @override - RemixMenuItemStyler size(double width, double height) { - return merge( - RemixMenuItemStyler( - container: FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: width, - maxWidth: width, - minHeight: height, - maxHeight: height, - ), - ), - ), - ); - } - - @override - RemixMenuItemStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixMenuItemStyler( - container: FlexBoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - - @override - RemixMenuItemStyler constraints(BoxConstraintsMix value) { - return merge( - RemixMenuItemStyler(container: FlexBoxStyler(constraints: value)), - ); - } - - @override - RemixMenuItemStyler decoration(DecorationMix value) { - return merge( - RemixMenuItemStyler(container: FlexBoxStyler(decoration: value)), - ); - } - - @override - RemixMenuItemStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixMenuItemStyler(container: FlexBoxStyler(margin: value))); - } - - @override - RemixMenuItemStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixMenuItemStyler( - container: FlexBoxStyler(foregroundDecoration: value), - ), - ); - } - - @override - RemixMenuItemStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixMenuItemStyler( - container: FlexBoxStyler( - transform: value, - transformAlignment: alignment, - ), - ), - ); - } - - @override +extension RemixMenuItemStylerRemixHelpers on RemixMenuItemStyler { RemixMenuItemStyler flex(FlexStyler value) { return merge(RemixMenuItemStyler(container: FlexBoxStyler().flex(value))); } diff --git a/packages/remix/lib/src/components/popover/fortal_popover_styles.dart b/packages/remix/lib/src/components/popover/fortal_popover_styles.dart index 5754df39..8955a1fb 100644 --- a/packages/remix/lib/src/components/popover/fortal_popover_styles.dart +++ b/packages/remix/lib/src/components/popover/fortal_popover_styles.dart @@ -1,7 +1,6 @@ part of 'popover.dart'; /// Fortal-themed preset for [RemixPopover]. -@MixWidget(name: 'FortalPopover') RemixPopoverStyler fortalPopoverStyler() { return RemixPopoverStyler() .paddingAll(FortalTokens.space4()) @@ -21,3 +20,73 @@ RemixPopoverStyler fortalPopoverStyler() { .spreadRadius(0), ); } + +/// Fortal-themed preset for [RemixPopover]. +class FortalPopover extends StatelessWidget { + const FortalPopover({ + super.key, + required this.popoverChild, + required this.child, + this.positioning = const OverlayPositionConfig(), + this.consumeOutsideTaps = true, + this.useRootOverlay = false, + this.openOnTap = true, + this.triggerFocusNode, + this.onOpen, + this.onClose, + this.onOpenRequested, + this.onCloseRequested, + this.controller, + this.semanticLabel, + this.excludeSemantics = false, + }); + + final Widget popoverChild; + + final Widget child; + + final OverlayPositionConfig positioning; + + final bool consumeOutsideTaps; + + final bool useRootOverlay; + + final bool openOnTap; + + final FocusNode? triggerFocusNode; + + final VoidCallback? onOpen; + + final VoidCallback? onClose; + + final RawMenuAnchorOpenRequestedCallback? onOpenRequested; + + final RawMenuAnchorCloseRequestedCallback? onCloseRequested; + + final MenuController? controller; + + final String? semanticLabel; + + final bool excludeSemantics; + + @override + Widget build(BuildContext context) { + return fortalPopoverStyler().call( + key: this.key, + popoverChild: this.popoverChild, + child: this.child, + positioning: this.positioning, + consumeOutsideTaps: this.consumeOutsideTaps, + useRootOverlay: this.useRootOverlay, + openOnTap: this.openOnTap, + triggerFocusNode: this.triggerFocusNode, + onOpen: this.onOpen, + onClose: this.onClose, + onOpenRequested: this.onOpenRequested, + onCloseRequested: this.onCloseRequested, + controller: this.controller, + semanticLabel: this.semanticLabel, + excludeSemantics: this.excludeSemantics, + ); + } +} diff --git a/packages/remix/lib/src/components/popover/popover.g.dart b/packages/remix/lib/src/components/popover/popover.g.dart index c38e5219..f6e66372 100644 --- a/packages/remix/lib/src/components/popover/popover.g.dart +++ b/packages/remix/lib/src/components/popover/popover.g.dart @@ -74,85 +74,505 @@ mixin _$RemixPopoverSpec implements Spec, Diagnosticable { typedef _$RemixPopoverSpecMethods = _$RemixPopoverSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixPopover]. -class FortalPopover extends StatelessWidget { - const FortalPopover({ - super.key, - required this.popoverChild, - required this.child, - this.positioning = const OverlayPositionConfig(), - this.consumeOutsideTaps = true, - this.useRootOverlay = false, - this.openOnTap = true, - this.triggerFocusNode, - this.onOpen, - this.onClose, - this.onOpenRequested, - this.onCloseRequested, - this.controller, - this.semanticLabel, - this.excludeSemantics = false, - }); +class RemixPopoverStyler extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $container; + + const RemixPopoverStyler.create({ + Prop>? container, + super.variants, + super.modifier, + super.animation, + }) : $container = container; + + RemixPopoverStyler({ + BoxStyler? container, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixPopoverStyler.container(BoxStyler value) => + RemixPopoverStyler().container(value); + factory RemixPopoverStyler.alignment(AlignmentGeometry value) => + RemixPopoverStyler().alignment(value); + factory RemixPopoverStyler.padding(EdgeInsetsGeometryMix value) => + RemixPopoverStyler().padding(value); + factory RemixPopoverStyler.margin(EdgeInsetsGeometryMix value) => + RemixPopoverStyler().margin(value); + factory RemixPopoverStyler.constraints(BoxConstraintsMix value) => + RemixPopoverStyler().constraints(value); + factory RemixPopoverStyler.decoration(DecorationMix value) => + RemixPopoverStyler().decoration(value); + factory RemixPopoverStyler.foregroundDecoration(DecorationMix value) => + RemixPopoverStyler().foregroundDecoration(value); + factory RemixPopoverStyler.clipBehavior(Clip value) => + RemixPopoverStyler().clipBehavior(value); + factory RemixPopoverStyler.color(Color value) => + RemixPopoverStyler().color(value); + factory RemixPopoverStyler.gradient(GradientMix value) => + RemixPopoverStyler().gradient(value); + factory RemixPopoverStyler.border(BoxBorderMix value) => + RemixPopoverStyler().border(value); + factory RemixPopoverStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixPopoverStyler().borderRadius(value); + factory RemixPopoverStyler.elevation(ElevationShadow value) => + RemixPopoverStyler().elevation(value); + factory RemixPopoverStyler.shadow(BoxShadowMix value) => + RemixPopoverStyler().shadow(value); + factory RemixPopoverStyler.shadows(List value) => + RemixPopoverStyler().shadows(value); + factory RemixPopoverStyler.width(double value) => + RemixPopoverStyler().width(value); + factory RemixPopoverStyler.height(double value) => + RemixPopoverStyler().height(value); + factory RemixPopoverStyler.size(double width, double height) => + RemixPopoverStyler().size(width, height); + factory RemixPopoverStyler.minWidth(double value) => + RemixPopoverStyler().minWidth(value); + factory RemixPopoverStyler.maxWidth(double value) => + RemixPopoverStyler().maxWidth(value); + factory RemixPopoverStyler.minHeight(double value) => + RemixPopoverStyler().minHeight(value); + factory RemixPopoverStyler.maxHeight(double value) => + RemixPopoverStyler().maxHeight(value); + factory RemixPopoverStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixPopoverStyler().scale(scale, alignment: alignment); + factory RemixPopoverStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixPopoverStyler().rotate(radians, alignment: alignment); + factory RemixPopoverStyler.translate(double x, double y, [double z = 0.0]) => + RemixPopoverStyler().translate(x, y, z); + factory RemixPopoverStyler.skew(double skewX, double skewY) => + RemixPopoverStyler().skew(skewX, skewY); + factory RemixPopoverStyler.textStyle(TextStyler value) => + RemixPopoverStyler().textStyle(value); + factory RemixPopoverStyler.image(DecorationImageMix value) => + RemixPopoverStyler().image(value); + factory RemixPopoverStyler.shape(ShapeBorderMix value) => + RemixPopoverStyler().shape(value); + factory RemixPopoverStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixPopoverStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixPopoverStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixPopoverStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixPopoverStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixPopoverStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixPopoverStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixPopoverStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixPopoverStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixPopoverStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixPopoverStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixPopoverStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixPopoverStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixPopoverStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixPopoverStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixPopoverStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixPopoverStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixPopoverStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixPopoverStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixPopoverStyler().transform(value, alignment: alignment); + + RemixPopoverStyler alignment(AlignmentGeometry value) { + return container(BoxStyler().alignment(value)); + } - final Widget popoverChild; + RemixPopoverStyler padding(EdgeInsetsGeometryMix value) { + return container(BoxStyler().padding(value)); + } - final Widget child; + RemixPopoverStyler margin(EdgeInsetsGeometryMix value) { + return container(BoxStyler().margin(value)); + } - final OverlayPositionConfig positioning; + RemixPopoverStyler constraints(BoxConstraintsMix value) { + return container(BoxStyler().constraints(value)); + } - final bool consumeOutsideTaps; + RemixPopoverStyler decoration(DecorationMix value) { + return container(BoxStyler().decoration(value)); + } - final bool useRootOverlay; + RemixPopoverStyler foregroundDecoration(DecorationMix value) { + return container(BoxStyler().foregroundDecoration(value)); + } + + RemixPopoverStyler clipBehavior(Clip value) { + return container(BoxStyler().clipBehavior(value)); + } - final bool openOnTap; + RemixPopoverStyler color(Color value) { + return container(BoxStyler().color(value)); + } - final FocusNode? triggerFocusNode; + RemixPopoverStyler gradient(GradientMix value) { + return container(BoxStyler().gradient(value)); + } - final VoidCallback? onOpen; + RemixPopoverStyler border(BoxBorderMix value) { + return container(BoxStyler().border(value)); + } - final VoidCallback? onClose; + RemixPopoverStyler borderRadius(BorderRadiusGeometryMix value) { + return container(BoxStyler().borderRadius(value)); + } - final RawMenuAnchorOpenRequestedCallback? onOpenRequested; + RemixPopoverStyler elevation(ElevationShadow value) { + return container(BoxStyler().elevation(value)); + } - final RawMenuAnchorCloseRequestedCallback? onCloseRequested; + RemixPopoverStyler shadow(BoxShadowMix value) { + return container(BoxStyler().shadow(value)); + } - final MenuController? controller; + RemixPopoverStyler shadows(List value) { + return container(BoxStyler().shadows(value)); + } - final String? semanticLabel; + RemixPopoverStyler width(double value) { + return container(BoxStyler().width(value)); + } - final bool excludeSemantics; + RemixPopoverStyler height(double value) { + return container(BoxStyler().height(value)); + } - @override - Widget build(BuildContext context) { - return fortalPopoverStyler().call( - key: this.key, - popoverChild: this.popoverChild, - child: this.child, - positioning: this.positioning, - consumeOutsideTaps: this.consumeOutsideTaps, - useRootOverlay: this.useRootOverlay, - openOnTap: this.openOnTap, - triggerFocusNode: this.triggerFocusNode, - onOpen: this.onOpen, - onClose: this.onClose, - onOpenRequested: this.onOpenRequested, - onCloseRequested: this.onCloseRequested, - controller: this.controller, - semanticLabel: this.semanticLabel, - excludeSemantics: this.excludeSemantics, + RemixPopoverStyler size(double width, double height) { + return container(BoxStyler().size(width, height)); + } + + RemixPopoverStyler minWidth(double value) { + return container(BoxStyler().minWidth(value)); + } + + RemixPopoverStyler maxWidth(double value) { + return container(BoxStyler().maxWidth(value)); + } + + RemixPopoverStyler minHeight(double value) { + return container(BoxStyler().minHeight(value)); + } + + RemixPopoverStyler maxHeight(double value) { + return container(BoxStyler().maxHeight(value)); + } + + RemixPopoverStyler scale(double scale, {Alignment alignment = .center}) { + return container(BoxStyler().scale(scale, alignment: alignment)); + } + + RemixPopoverStyler rotate(double radians, {Alignment alignment = .center}) { + return container(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixPopoverStyler translate(double x, double y, [double z = 0.0]) { + return container(BoxStyler().translate(x, y, z)); + } + + RemixPopoverStyler skew(double skewX, double skewY) { + return container(BoxStyler().skew(skewX, skewY)); + } + + RemixPopoverStyler textStyle(TextStyler value) { + return container(BoxStyler().textStyle(value)); + } + + RemixPopoverStyler image(DecorationImageMix value) { + return container(BoxStyler().image(value)); + } + + RemixPopoverStyler shape(ShapeBorderMix value) { + return container(BoxStyler().shape(value)); + } + + RemixPopoverStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixPopoverStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixPopoverStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixPopoverStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixPopoverStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixPopoverStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixPopoverStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixPopoverStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } -mixin _$RemixPopoverStylerMixin on Style, Diagnosticable { - Prop>? get $container; + RemixPopoverStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixPopoverStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(BoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixPopoverStyler container(BoxStyler value) { @@ -160,16 +580,19 @@ mixin _$RemixPopoverStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixPopoverStyler animate(AnimationConfig value) { return merge(RemixPopoverStyler(animation: value)); } /// Sets the style variants. + @override RemixPopoverStyler variants(List> value) { return merge(RemixPopoverStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixPopoverStyler wrap(WidgetModifierConfig value) { return merge(RemixPopoverStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/popover/popover_spec.dart b/packages/remix/lib/src/components/popover/popover_spec.dart index a70598b9..e238e403 100644 --- a/packages/remix/lib/src/components/popover/popover_spec.dart +++ b/packages/remix/lib/src/components/popover/popover_spec.dart @@ -1,9 +1,10 @@ part of 'popover.dart'; /// Resolved visual properties for a [RemixPopover] overlay. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixPopoverSpec with _$RemixPopoverSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; const RemixPopoverSpec({StyleSpec? container}) diff --git a/packages/remix/lib/src/components/popover/popover_style.dart b/packages/remix/lib/src/components/popover/popover_style.dart index 2aba4a8f..a0bf3185 100644 --- a/packages/remix/lib/src/components/popover/popover_style.dart +++ b/packages/remix/lib/src/components/popover/popover_style.dart @@ -1,60 +1,7 @@ part of 'popover.dart'; /// Style configuration for a [RemixPopover] overlay container. -@MixableStyler() -class RemixPopoverStyler - extends RemixContainerStyler - with Diagnosticable, _$RemixPopoverStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $container; - - const RemixPopoverStyler.create({ - Prop>? container, - super.variants, - super.animation, - super.modifier, - }) : $container = container; - - RemixPopoverStyler({ - BoxStyler? container, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - variants: variants, - animation: animation, - modifier: modifier, - ); - - /// Creates a style with the given padding. - factory RemixPopoverStyler.padding(EdgeInsetsGeometryMix value) => - RemixPopoverStyler().padding(value); - - /// Creates a style with the given margin. - factory RemixPopoverStyler.margin(EdgeInsetsGeometryMix value) => - RemixPopoverStyler().margin(value); - - /// Creates a style with the given border radius. - factory RemixPopoverStyler.borderRadius(BorderRadiusGeometryMix value) => - RemixPopoverStyler().borderRadius(value); - - /// Creates a style with the given alignment. - factory RemixPopoverStyler.alignment(Alignment value) => - RemixPopoverStyler().alignment(value); - - /// Creates a style with the given decoration. - factory RemixPopoverStyler.decoration(DecorationMix value) => - RemixPopoverStyler().decoration(value); - - /// Creates a style with the given background color. - factory RemixPopoverStyler.backgroundColor(Color value) => - RemixPopoverStyler().backgroundColor(value); - - /// Creates a style with the given constraints. - factory RemixPopoverStyler.constraints(BoxConstraintsMix value) => - RemixPopoverStyler().constraints(value); - +extension RemixPopoverStylerRemixHelpers on RemixPopoverStyler { /// Sets the popover background color. RemixPopoverStyler backgroundColor(Color value) => color(value); @@ -95,55 +42,4 @@ class RemixPopoverStyler child: child, ); } - - /// Sets the overlay container alignment. - @override - RemixPopoverStyler alignment(Alignment value) { - return merge(RemixPopoverStyler(container: BoxStyler(alignment: value))); - } - - /// Sets padding inside the overlay container. - @override - RemixPopoverStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixPopoverStyler(container: BoxStyler(padding: value))); - } - - /// Sets margin around the overlay container. - @override - RemixPopoverStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixPopoverStyler(container: BoxStyler(margin: value))); - } - - /// Sets the overlay container decoration. - @override - RemixPopoverStyler decoration(DecorationMix value) { - return merge(RemixPopoverStyler(container: BoxStyler(decoration: value))); - } - - /// Sets constraints on the overlay container. - @override - RemixPopoverStyler constraints(BoxConstraintsMix value) { - return merge(RemixPopoverStyler(container: BoxStyler(constraints: value))); - } - - /// Sets a foreground decoration on the overlay container. - @override - RemixPopoverStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixPopoverStyler(container: BoxStyler(foregroundDecoration: value)), - ); - } - - /// Applies a transform to the overlay container. - @override - RemixPopoverStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixPopoverStyler( - container: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } } diff --git a/packages/remix/lib/src/components/progress/fortal_progress_styles.dart b/packages/remix/lib/src/components/progress/fortal_progress_styles.dart index 2a7bb79a..56715336 100644 --- a/packages/remix/lib/src/components/progress/fortal_progress_styles.dart +++ b/packages/remix/lib/src/components/progress/fortal_progress_styles.dart @@ -7,7 +7,6 @@ enum FortalProgressSize { size1, size2, size3 } enum FortalProgressVariant { surface, soft } /// Fortal-themed preset for [RemixProgress]. -@MixWidget(name: 'FortalProgress') RemixProgressStyler fortalProgressStyler({ FortalProgressVariant variant = .surface, FortalProgressSize size = .size2, @@ -89,3 +88,39 @@ RemixProgressStyler _fortalProgressSizeStyler(FortalProgressSize size) { ), }; } + +/// Fortal-themed preset for [RemixProgress]. +class FortalProgress extends StatelessWidget { + const FortalProgress({ + super.key, + this.variant = .surface, + this.size = .size2, + required this.value, + }); + + const FortalProgress.surface({ + super.key, + this.size = .size2, + required this.value, + }) : variant = FortalProgressVariant.surface; + + const FortalProgress.soft({ + super.key, + this.size = .size2, + required this.value, + }) : variant = FortalProgressVariant.soft; + + final FortalProgressVariant variant; + + final FortalProgressSize size; + + final double value; + + @override + Widget build(BuildContext context) { + return fortalProgressStyler( + variant: this.variant, + size: this.size, + ).call(key: this.key, value: this.value); + } +} diff --git a/packages/remix/lib/src/components/progress/progress.g.dart b/packages/remix/lib/src/components/progress/progress.g.dart index f35a7bf6..5aa173e7 100644 --- a/packages/remix/lib/src/components/progress/progress.g.dart +++ b/packages/remix/lib/src/components/progress/progress.g.dart @@ -96,54 +96,530 @@ mixin _$RemixProgressSpec implements Spec, Diagnosticable { typedef _$RemixProgressSpecMethods = _$RemixProgressSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixProgress]. -class FortalProgress extends StatelessWidget { - const FortalProgress({ - super.key, - this.variant = .surface, - this.size = .size2, - required this.value, - }); +class RemixProgressStyler + extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $container; + final Prop>? $track; + final Prop>? $indicator; + final Prop>? $trackContainer; + + const RemixProgressStyler.create({ + Prop>? container, + Prop>? track, + Prop>? indicator, + Prop>? trackContainer, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $track = track, + $indicator = indicator, + $trackContainer = trackContainer; + + RemixProgressStyler({ + BoxStyler? container, + BoxStyler? track, + BoxStyler? indicator, + BoxStyler? trackContainer, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + track: Prop.maybeMix(track), + indicator: Prop.maybeMix(indicator), + trackContainer: Prop.maybeMix(trackContainer), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixProgressStyler.container(BoxStyler value) => + RemixProgressStyler().container(value); + factory RemixProgressStyler.track(BoxStyler value) => + RemixProgressStyler().track(value); + factory RemixProgressStyler.indicator(BoxStyler value) => + RemixProgressStyler().indicator(value); + factory RemixProgressStyler.trackContainer(BoxStyler value) => + RemixProgressStyler().trackContainer(value); + factory RemixProgressStyler.alignment(AlignmentGeometry value) => + RemixProgressStyler().alignment(value); + factory RemixProgressStyler.padding(EdgeInsetsGeometryMix value) => + RemixProgressStyler().padding(value); + factory RemixProgressStyler.margin(EdgeInsetsGeometryMix value) => + RemixProgressStyler().margin(value); + factory RemixProgressStyler.constraints(BoxConstraintsMix value) => + RemixProgressStyler().constraints(value); + factory RemixProgressStyler.decoration(DecorationMix value) => + RemixProgressStyler().decoration(value); + factory RemixProgressStyler.foregroundDecoration(DecorationMix value) => + RemixProgressStyler().foregroundDecoration(value); + factory RemixProgressStyler.clipBehavior(Clip value) => + RemixProgressStyler().clipBehavior(value); + factory RemixProgressStyler.color(Color value) => + RemixProgressStyler().color(value); + factory RemixProgressStyler.gradient(GradientMix value) => + RemixProgressStyler().gradient(value); + factory RemixProgressStyler.border(BoxBorderMix value) => + RemixProgressStyler().border(value); + factory RemixProgressStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixProgressStyler().borderRadius(value); + factory RemixProgressStyler.elevation(ElevationShadow value) => + RemixProgressStyler().elevation(value); + factory RemixProgressStyler.shadow(BoxShadowMix value) => + RemixProgressStyler().shadow(value); + factory RemixProgressStyler.shadows(List value) => + RemixProgressStyler().shadows(value); + factory RemixProgressStyler.width(double value) => + RemixProgressStyler().width(value); + factory RemixProgressStyler.height(double value) => + RemixProgressStyler().height(value); + factory RemixProgressStyler.size(double width, double height) => + RemixProgressStyler().size(width, height); + factory RemixProgressStyler.minWidth(double value) => + RemixProgressStyler().minWidth(value); + factory RemixProgressStyler.maxWidth(double value) => + RemixProgressStyler().maxWidth(value); + factory RemixProgressStyler.minHeight(double value) => + RemixProgressStyler().minHeight(value); + factory RemixProgressStyler.maxHeight(double value) => + RemixProgressStyler().maxHeight(value); + factory RemixProgressStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixProgressStyler().scale(scale, alignment: alignment); + factory RemixProgressStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixProgressStyler().rotate(radians, alignment: alignment); + factory RemixProgressStyler.translate(double x, double y, [double z = 0.0]) => + RemixProgressStyler().translate(x, y, z); + factory RemixProgressStyler.skew(double skewX, double skewY) => + RemixProgressStyler().skew(skewX, skewY); + factory RemixProgressStyler.textStyle(TextStyler value) => + RemixProgressStyler().textStyle(value); + factory RemixProgressStyler.image(DecorationImageMix value) => + RemixProgressStyler().image(value); + factory RemixProgressStyler.shape(ShapeBorderMix value) => + RemixProgressStyler().shape(value); + factory RemixProgressStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixProgressStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixProgressStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixProgressStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixProgressStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixProgressStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixProgressStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixProgressStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixProgressStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixProgressStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixProgressStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixProgressStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixProgressStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixProgressStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixProgressStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixProgressStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixProgressStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixProgressStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixProgressStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixProgressStyler().transform(value, alignment: alignment); + + RemixProgressStyler alignment(AlignmentGeometry value) { + return container(BoxStyler().alignment(value)); + } + + RemixProgressStyler padding(EdgeInsetsGeometryMix value) { + return container(BoxStyler().padding(value)); + } - const FortalProgress.surface({ - super.key, - this.size = .size2, - required this.value, - }) : variant = FortalProgressVariant.surface; + RemixProgressStyler margin(EdgeInsetsGeometryMix value) { + return container(BoxStyler().margin(value)); + } - const FortalProgress.soft({ - super.key, - this.size = .size2, - required this.value, - }) : variant = FortalProgressVariant.soft; + RemixProgressStyler constraints(BoxConstraintsMix value) { + return container(BoxStyler().constraints(value)); + } - final FortalProgressVariant variant; + RemixProgressStyler decoration(DecorationMix value) { + return container(BoxStyler().decoration(value)); + } - final FortalProgressSize size; + RemixProgressStyler foregroundDecoration(DecorationMix value) { + return container(BoxStyler().foregroundDecoration(value)); + } - final double value; + RemixProgressStyler clipBehavior(Clip value) { + return container(BoxStyler().clipBehavior(value)); + } - @override - Widget build(BuildContext context) { - return fortalProgressStyler( - variant: this.variant, - size: this.size, - ).call(key: this.key, value: this.value); + RemixProgressStyler color(Color value) { + return container(BoxStyler().color(value)); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixProgressStyler gradient(GradientMix value) { + return container(BoxStyler().gradient(value)); + } + + RemixProgressStyler border(BoxBorderMix value) { + return container(BoxStyler().border(value)); + } + + RemixProgressStyler borderRadius(BorderRadiusGeometryMix value) { + return container(BoxStyler().borderRadius(value)); + } + + RemixProgressStyler elevation(ElevationShadow value) { + return container(BoxStyler().elevation(value)); + } + + RemixProgressStyler shadow(BoxShadowMix value) { + return container(BoxStyler().shadow(value)); + } + + RemixProgressStyler shadows(List value) { + return container(BoxStyler().shadows(value)); + } + + RemixProgressStyler width(double value) { + return container(BoxStyler().width(value)); + } + + RemixProgressStyler height(double value) { + return container(BoxStyler().height(value)); + } + + RemixProgressStyler size(double width, double height) { + return container(BoxStyler().size(width, height)); + } + + RemixProgressStyler minWidth(double value) { + return container(BoxStyler().minWidth(value)); + } + + RemixProgressStyler maxWidth(double value) { + return container(BoxStyler().maxWidth(value)); + } + + RemixProgressStyler minHeight(double value) { + return container(BoxStyler().minHeight(value)); + } + + RemixProgressStyler maxHeight(double value) { + return container(BoxStyler().maxHeight(value)); + } + + RemixProgressStyler scale(double scale, {Alignment alignment = .center}) { + return container(BoxStyler().scale(scale, alignment: alignment)); + } + + RemixProgressStyler rotate(double radians, {Alignment alignment = .center}) { + return container(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixProgressStyler translate(double x, double y, [double z = 0.0]) { + return container(BoxStyler().translate(x, y, z)); + } + + RemixProgressStyler skew(double skewX, double skewY) { + return container(BoxStyler().skew(skewX, skewY)); + } + + RemixProgressStyler textStyle(TextStyler value) { + return container(BoxStyler().textStyle(value)); + } + + RemixProgressStyler image(DecorationImageMix value) { + return container(BoxStyler().image(value)); + } + + RemixProgressStyler shape(ShapeBorderMix value) { + return container(BoxStyler().shape(value)); + } + + RemixProgressStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixProgressStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixProgressStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixProgressStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixProgressStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixProgressStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } -mixin _$RemixProgressStylerMixin on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $track; - Prop>? get $indicator; - Prop>? get $trackContainer; + RemixProgressStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixProgressStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixProgressStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixProgressStyler transform( + Matrix4 value, { + Alignment alignment = .center, + }) { + return container(BoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixProgressStyler container(BoxStyler value) { @@ -166,16 +642,19 @@ mixin _$RemixProgressStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixProgressStyler animate(AnimationConfig value) { return merge(RemixProgressStyler(animation: value)); } /// Sets the style variants. + @override RemixProgressStyler variants(List> value) { return merge(RemixProgressStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixProgressStyler wrap(WidgetModifierConfig value) { return merge(RemixProgressStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/progress/progress_spec.dart b/packages/remix/lib/src/components/progress/progress_spec.dart index e207efa4..3bec0686 100644 --- a/packages/remix/lib/src/components/progress/progress_spec.dart +++ b/packages/remix/lib/src/components/progress/progress_spec.dart @@ -1,9 +1,10 @@ part of 'progress.dart'; /// Resolved visual values for a [RemixProgress]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixProgressSpec with _$RemixProgressSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; @override final StyleSpec track; diff --git a/packages/remix/lib/src/components/progress/progress_style.dart b/packages/remix/lib/src/components/progress/progress_style.dart index 0939808b..4601dc58 100644 --- a/packages/remix/lib/src/components/progress/progress_style.dart +++ b/packages/remix/lib/src/components/progress/progress_style.dart @@ -4,61 +4,7 @@ part of 'progress.dart'; /// /// Use this class to style the progress container, track, indicator, and track /// layout container. -@MixableStyler() -class RemixProgressStyler - extends RemixContainerStyler - with Diagnosticable, _$RemixProgressStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $container; - @MixableField(setterType: BoxStyler) - final Prop>? $track; - @MixableField(setterType: BoxStyler) - final Prop>? $indicator; - @MixableField(setterType: BoxStyler) - final Prop>? $trackContainer; - - const RemixProgressStyler.create({ - Prop>? container, - Prop>? track, - Prop>? indicator, - Prop>? trackContainer, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $track = track, - $indicator = indicator, - $trackContainer = trackContainer; - - RemixProgressStyler({ - BoxStyler? container, - BoxStyler? track, - BoxStyler? indicator, - BoxStyler? trackContainer, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - track: Prop.maybeMix(track), - indicator: Prop.maybeMix(indicator), - trackContainer: Prop.maybeMix(trackContainer), - variants: variants, - animation: animation, - modifier: modifier, - ); - - /// Sets progress height - RemixProgressStyler height(double value) { - return merge( - RemixProgressStyler( - container: BoxStyler( - constraints: BoxConstraintsMix(minHeight: value, maxHeight: value), - ), - ), - ); - } - +extension RemixProgressStylerRemixHelpers on RemixProgressStyler { /// Sets track color RemixProgressStyler trackColor(Color value) { return merge( @@ -68,17 +14,6 @@ class RemixProgressStyler ); } - /// Sets progress width - RemixProgressStyler width(double value) { - return merge( - RemixProgressStyler( - container: BoxStyler( - constraints: BoxConstraintsMix(minWidth: value, maxWidth: value), - ), - ), - ); - } - /// Sets fill color RemixProgressStyler indicatorColor(Color value) { return merge( @@ -88,54 +23,8 @@ class RemixProgressStyler ); } - /// Sets container alignment - RemixProgressStyler alignment(Alignment value) { - return merge(RemixProgressStyler(container: BoxStyler(alignment: value))); - } - /// Creates a [RemixProgress] widget with this style applied. RemixProgress call({Key? key, required double value}) { return RemixProgress(key: key, value: value, style: this); } - - // Abstract method implementations for mixins - - @override - RemixProgressStyler constraints(BoxConstraintsMix value) { - return merge(RemixProgressStyler(container: BoxStyler(constraints: value))); - } - - @override - RemixProgressStyler decoration(DecorationMix value) { - return merge(RemixProgressStyler(container: BoxStyler(decoration: value))); - } - - @override - RemixProgressStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixProgressStyler(container: BoxStyler(margin: value))); - } - - @override - RemixProgressStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixProgressStyler(container: BoxStyler(padding: value))); - } - - @override - RemixProgressStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixProgressStyler(container: BoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixProgressStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixProgressStyler( - container: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } } diff --git a/packages/remix/lib/src/components/radio/fortal_radio_styles.dart b/packages/remix/lib/src/components/radio/fortal_radio_styles.dart index a4304361..25c86569 100644 --- a/packages/remix/lib/src/components/radio/fortal_radio_styles.dart +++ b/packages/remix/lib/src/components/radio/fortal_radio_styles.dart @@ -22,7 +22,6 @@ enum FortalRadioVariant { } /// Fortal-themed preset for [RemixRadio]. -@MixWidget(name: 'FortalRadio') RemixRadioStyler fortalRadioStyler({ FortalRadioVariant variant = .surface, FortalRadioSize size = .size2, @@ -114,3 +113,71 @@ RemixRadioStyler _fortalRadioSizeStyler(FortalRadioSize size) { ), }; } + +/// Fortal-themed preset for [RemixRadio]. +class FortalRadio extends StatelessWidget { + const FortalRadio({ + super.key, + this.variant = .surface, + this.size = .size2, + required this.value, + this.enabled = true, + this.toggleable = false, + this.mouseCursor, + this.focusNode, + this.autofocus = false, + }); + + /// Surface treatment with neutral border. + const FortalRadio.surface({ + super.key, + this.size = .size2, + required this.value, + this.enabled = true, + this.toggleable = false, + this.mouseCursor, + this.focusNode, + this.autofocus = false, + }) : variant = FortalRadioVariant.surface; + + /// Soft accent treatment. + const FortalRadio.soft({ + super.key, + this.size = .size2, + required this.value, + this.enabled = true, + this.toggleable = false, + this.mouseCursor, + this.focusNode, + this.autofocus = false, + }) : variant = FortalRadioVariant.soft; + + final FortalRadioVariant variant; + + final FortalRadioSize size; + + final T value; + + final bool enabled; + + final bool toggleable; + + final MouseCursor? mouseCursor; + + final FocusNode? focusNode; + + final bool autofocus; + + @override + Widget build(BuildContext context) { + return fortalRadioStyler(variant: this.variant, size: this.size).call( + key: this.key, + value: this.value, + enabled: this.enabled, + toggleable: this.toggleable, + mouseCursor: this.mouseCursor, + focusNode: this.focusNode, + autofocus: this.autofocus, + ); + } +} diff --git a/packages/remix/lib/src/components/radio/radio.g.dart b/packages/remix/lib/src/components/radio/radio.g.dart index 726202e6..4f9a7586 100644 --- a/packages/remix/lib/src/components/radio/radio.g.dart +++ b/packages/remix/lib/src/components/radio/radio.g.dart @@ -86,84 +86,512 @@ mixin _$RemixRadioSpec implements Spec, Diagnosticable { typedef _$RemixRadioSpecMethods = _$RemixRadioSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixRadio]. -class FortalRadio extends StatelessWidget { - const FortalRadio({ - super.key, - this.variant = .surface, - this.size = .size2, - required this.value, - this.enabled = true, - this.toggleable = false, - this.mouseCursor, - this.focusNode, - this.autofocus = false, - }); - - /// Surface treatment with neutral border. - const FortalRadio.surface({ - super.key, - this.size = .size2, - required this.value, - this.enabled = true, - this.toggleable = false, - this.mouseCursor, - this.focusNode, - this.autofocus = false, - }) : variant = FortalRadioVariant.surface; - - /// Soft accent treatment. - const FortalRadio.soft({ - super.key, - this.size = .size2, - required this.value, - this.enabled = true, - this.toggleable = false, - this.mouseCursor, - this.focusNode, - this.autofocus = false, - }) : variant = FortalRadioVariant.soft; - - final FortalRadioVariant variant; - - final FortalRadioSize size; - - final T value; - - final bool enabled; - - final bool toggleable; - - final MouseCursor? mouseCursor; - - final FocusNode? focusNode; - - final bool autofocus; - - @override - Widget build(BuildContext context) { - return fortalRadioStyler(variant: this.variant, size: this.size).call( - key: this.key, - value: this.value, - enabled: this.enabled, - toggleable: this.toggleable, - mouseCursor: this.mouseCursor, - focusNode: this.focusNode, - autofocus: this.autofocus, +class RemixRadioStyler extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $container; + final Prop>? $indicator; + + const RemixRadioStyler.create({ + Prop>? container, + Prop>? indicator, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $indicator = indicator; + + RemixRadioStyler({ + BoxStyler? container, + BoxStyler? indicator, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + indicator: Prop.maybeMix(indicator), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixRadioStyler.container(BoxStyler value) => + RemixRadioStyler().container(value); + factory RemixRadioStyler.indicator(BoxStyler value) => + RemixRadioStyler().indicator(value); + factory RemixRadioStyler.alignment(AlignmentGeometry value) => + RemixRadioStyler().alignment(value); + factory RemixRadioStyler.padding(EdgeInsetsGeometryMix value) => + RemixRadioStyler().padding(value); + factory RemixRadioStyler.margin(EdgeInsetsGeometryMix value) => + RemixRadioStyler().margin(value); + factory RemixRadioStyler.constraints(BoxConstraintsMix value) => + RemixRadioStyler().constraints(value); + factory RemixRadioStyler.decoration(DecorationMix value) => + RemixRadioStyler().decoration(value); + factory RemixRadioStyler.foregroundDecoration(DecorationMix value) => + RemixRadioStyler().foregroundDecoration(value); + factory RemixRadioStyler.clipBehavior(Clip value) => + RemixRadioStyler().clipBehavior(value); + factory RemixRadioStyler.color(Color value) => + RemixRadioStyler().color(value); + factory RemixRadioStyler.gradient(GradientMix value) => + RemixRadioStyler().gradient(value); + factory RemixRadioStyler.border(BoxBorderMix value) => + RemixRadioStyler().border(value); + factory RemixRadioStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixRadioStyler().borderRadius(value); + factory RemixRadioStyler.elevation(ElevationShadow value) => + RemixRadioStyler().elevation(value); + factory RemixRadioStyler.shadow(BoxShadowMix value) => + RemixRadioStyler().shadow(value); + factory RemixRadioStyler.shadows(List value) => + RemixRadioStyler().shadows(value); + factory RemixRadioStyler.width(double value) => + RemixRadioStyler().width(value); + factory RemixRadioStyler.height(double value) => + RemixRadioStyler().height(value); + factory RemixRadioStyler.size(double width, double height) => + RemixRadioStyler().size(width, height); + factory RemixRadioStyler.minWidth(double value) => + RemixRadioStyler().minWidth(value); + factory RemixRadioStyler.maxWidth(double value) => + RemixRadioStyler().maxWidth(value); + factory RemixRadioStyler.minHeight(double value) => + RemixRadioStyler().minHeight(value); + factory RemixRadioStyler.maxHeight(double value) => + RemixRadioStyler().maxHeight(value); + factory RemixRadioStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixRadioStyler().scale(scale, alignment: alignment); + factory RemixRadioStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixRadioStyler().rotate(radians, alignment: alignment); + factory RemixRadioStyler.translate(double x, double y, [double z = 0.0]) => + RemixRadioStyler().translate(x, y, z); + factory RemixRadioStyler.skew(double skewX, double skewY) => + RemixRadioStyler().skew(skewX, skewY); + factory RemixRadioStyler.textStyle(TextStyler value) => + RemixRadioStyler().textStyle(value); + factory RemixRadioStyler.image(DecorationImageMix value) => + RemixRadioStyler().image(value); + factory RemixRadioStyler.shape(ShapeBorderMix value) => + RemixRadioStyler().shape(value); + factory RemixRadioStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixRadioStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixRadioStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixRadioStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixRadioStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixRadioStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixRadioStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixRadioStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixRadioStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixRadioStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixRadioStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixRadioStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixRadioStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixRadioStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixRadioStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixRadioStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixRadioStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixRadioStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixRadioStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixRadioStyler().transform(value, alignment: alignment); + + RemixRadioStyler alignment(AlignmentGeometry value) { + return container(BoxStyler().alignment(value)); + } + + RemixRadioStyler padding(EdgeInsetsGeometryMix value) { + return container(BoxStyler().padding(value)); + } + + RemixRadioStyler margin(EdgeInsetsGeometryMix value) { + return container(BoxStyler().margin(value)); + } + + RemixRadioStyler constraints(BoxConstraintsMix value) { + return container(BoxStyler().constraints(value)); + } + + RemixRadioStyler decoration(DecorationMix value) { + return container(BoxStyler().decoration(value)); + } + + RemixRadioStyler foregroundDecoration(DecorationMix value) { + return container(BoxStyler().foregroundDecoration(value)); + } + + RemixRadioStyler clipBehavior(Clip value) { + return container(BoxStyler().clipBehavior(value)); + } + + RemixRadioStyler color(Color value) { + return container(BoxStyler().color(value)); + } + + RemixRadioStyler gradient(GradientMix value) { + return container(BoxStyler().gradient(value)); + } + + RemixRadioStyler border(BoxBorderMix value) { + return container(BoxStyler().border(value)); + } + + RemixRadioStyler borderRadius(BorderRadiusGeometryMix value) { + return container(BoxStyler().borderRadius(value)); + } + + RemixRadioStyler elevation(ElevationShadow value) { + return container(BoxStyler().elevation(value)); + } + + RemixRadioStyler shadow(BoxShadowMix value) { + return container(BoxStyler().shadow(value)); + } + + RemixRadioStyler shadows(List value) { + return container(BoxStyler().shadows(value)); + } + + RemixRadioStyler width(double value) { + return container(BoxStyler().width(value)); + } + + RemixRadioStyler height(double value) { + return container(BoxStyler().height(value)); + } + + RemixRadioStyler size(double width, double height) { + return container(BoxStyler().size(width, height)); + } + + RemixRadioStyler minWidth(double value) { + return container(BoxStyler().minWidth(value)); + } + + RemixRadioStyler maxWidth(double value) { + return container(BoxStyler().maxWidth(value)); + } + + RemixRadioStyler minHeight(double value) { + return container(BoxStyler().minHeight(value)); + } + + RemixRadioStyler maxHeight(double value) { + return container(BoxStyler().maxHeight(value)); + } + + RemixRadioStyler scale(double scale, {Alignment alignment = .center}) { + return container(BoxStyler().scale(scale, alignment: alignment)); + } + + RemixRadioStyler rotate(double radians, {Alignment alignment = .center}) { + return container(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixRadioStyler translate(double x, double y, [double z = 0.0]) { + return container(BoxStyler().translate(x, y, z)); + } + + RemixRadioStyler skew(double skewX, double skewY) { + return container(BoxStyler().skew(skewX, skewY)); + } + + RemixRadioStyler textStyle(TextStyler value) { + return container(BoxStyler().textStyle(value)); + } + + RemixRadioStyler image(DecorationImageMix value) { + return container(BoxStyler().image(value)); + } + + RemixRadioStyler shape(ShapeBorderMix value) { + return container(BoxStyler().shape(value)); + } + + RemixRadioStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixRadioStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixRadioStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } -mixin _$RemixRadioStylerMixin on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $indicator; + RemixRadioStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixRadioStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixRadioStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixRadioStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixRadioStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixRadioStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixRadioStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(BoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixRadioStyler container(BoxStyler value) { @@ -176,16 +604,19 @@ mixin _$RemixRadioStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixRadioStyler animate(AnimationConfig value) { return merge(RemixRadioStyler(animation: value)); } /// Sets the style variants. + @override RemixRadioStyler variants(List> value) { return merge(RemixRadioStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixRadioStyler wrap(WidgetModifierConfig value) { return merge(RemixRadioStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/radio/radio_spec.dart b/packages/remix/lib/src/components/radio/radio_spec.dart index 6fa2c143..83544233 100644 --- a/packages/remix/lib/src/components/radio/radio_spec.dart +++ b/packages/remix/lib/src/components/radio/radio_spec.dart @@ -5,9 +5,10 @@ part of 'radio.dart'; /// The spec is populated by [RemixRadioStyler] and consumed by the widget when /// building the control. It provides two [StyleSpec] segments representing the /// container (outer ring) and the indicator fill shown when the radio is selected. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixRadioSpec with _$RemixRadioSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; @override final StyleSpec indicator; diff --git a/packages/remix/lib/src/components/radio/radio_style.dart b/packages/remix/lib/src/components/radio/radio_style.dart index b63715fe..69721c7d 100644 --- a/packages/remix/lib/src/components/radio/radio_style.dart +++ b/packages/remix/lib/src/components/radio/radio_style.dart @@ -1,46 +1,7 @@ part of 'radio.dart'; /// Style configuration for [RemixRadio] container and selected indicator. -@MixableStyler() -class RemixRadioStyler - extends RemixContainerStyler - with - SelectedWidgetStateVariantMixin, - Diagnosticable, - _$RemixRadioStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $container; - @MixableField(setterType: BoxStyler) - final Prop>? $indicator; - - const RemixRadioStyler.create({ - Prop>? container, - Prop>? indicator, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $indicator = indicator; - - RemixRadioStyler({ - BoxStyler? container, - BoxStyler? indicator, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - indicator: Prop.maybeMix(indicator), - variants: variants, - animation: animation, - modifier: modifier, - ); - - /// Sets container alignment. - RemixRadioStyler alignment(Alignment value) { - return merge(RemixRadioStyler(container: BoxStyler(alignment: value))); - } - +extension RemixRadioStylerRemixHelpers on RemixRadioStyler { /// Creates a RemixRadio widget with this style applied. RemixRadio call({ Key? key, @@ -80,74 +41,4 @@ class RemixRadioStyler ), ); } - - /// Convenience for applying padding around the control. - @override - RemixRadioStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixRadioStyler(container: BoxStyler(padding: value))); - } - - /// Convenience for applying margin around the control. - @override - RemixRadioStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixRadioStyler(container: BoxStyler(margin: value))); - } - - /// Sets container size using explicit constraints. - @override - RemixRadioStyler size(double width, double height) { - return merge( - RemixRadioStyler( - container: BoxStyler( - constraints: BoxConstraintsMix( - minWidth: width, - maxWidth: width, - minHeight: height, - maxHeight: height, - ), - ), - ), - ); - } - - /// Sets border radius on the outer container. - @override - RemixRadioStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixRadioStyler( - container: BoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - - @override - RemixRadioStyler constraints(BoxConstraintsMix value) { - return merge(RemixRadioStyler(container: BoxStyler(constraints: value))); - } - - @override - RemixRadioStyler decoration(DecorationMix value) { - return merge(RemixRadioStyler(container: BoxStyler(decoration: value))); - } - - @override - RemixRadioStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixRadioStyler(container: BoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixRadioStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixRadioStyler( - container: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } } diff --git a/packages/remix/lib/src/components/select/fortal_select_styles.dart b/packages/remix/lib/src/components/select/fortal_select_styles.dart index 94a5189c..7ab148b5 100644 --- a/packages/remix/lib/src/components/select/fortal_select_styles.dart +++ b/packages/remix/lib/src/components/select/fortal_select_styles.dart @@ -25,7 +25,6 @@ enum FortalSelectVariant { } /// Fortal-themed preset for [RemixSelect]. -@MixWidget(name: 'FortalSelect') RemixSelectStyler fortalSelectStyler({ FortalSelectVariant variant = .surface, FortalSelectSize size = .size2, @@ -186,3 +185,130 @@ RemixSelectMenuItemStyler _fortalSelectMenuItemSizeStyler( .size3 => RemixSelectMenuItemStyler().paddingX(10.0).height(28.0), }; } + +/// Fortal-themed preset for [RemixSelect]. +class FortalSelect extends StatelessWidget { + const FortalSelect({ + super.key, + this.variant = .surface, + this.size = .size2, + required this.trigger, + required this.items, + this.selectedValue, + this.positioning = const OverlayPositionConfig( + targetAnchor: .bottomCenter, + followerAnchor: .topCenter, + ), + this.onChanged, + this.onOpen, + this.onClose, + this.enabled = true, + this.closeOnSelect = true, + this.semanticLabel, + this.focusNode, + }); + + /// Surface-backed trigger with border. + const FortalSelect.surface({ + super.key, + this.size = .size2, + required this.trigger, + required this.items, + this.selectedValue, + this.positioning = const OverlayPositionConfig( + targetAnchor: .bottomCenter, + followerAnchor: .topCenter, + ), + this.onChanged, + this.onOpen, + this.onClose, + this.enabled = true, + this.closeOnSelect = true, + this.semanticLabel, + this.focusNode, + }) : variant = FortalSelectVariant.surface; + + /// Soft accent trigger. + const FortalSelect.soft({ + super.key, + this.size = .size2, + required this.trigger, + required this.items, + this.selectedValue, + this.positioning = const OverlayPositionConfig( + targetAnchor: .bottomCenter, + followerAnchor: .topCenter, + ), + this.onChanged, + this.onOpen, + this.onClose, + this.enabled = true, + this.closeOnSelect = true, + this.semanticLabel, + this.focusNode, + }) : variant = FortalSelectVariant.soft; + + /// Transparent trigger. + const FortalSelect.ghost({ + super.key, + this.size = .size2, + required this.trigger, + required this.items, + this.selectedValue, + this.positioning = const OverlayPositionConfig( + targetAnchor: .bottomCenter, + followerAnchor: .topCenter, + ), + this.onChanged, + this.onOpen, + this.onClose, + this.enabled = true, + this.closeOnSelect = true, + this.semanticLabel, + this.focusNode, + }) : variant = FortalSelectVariant.ghost; + + final FortalSelectVariant variant; + + final FortalSelectSize size; + + final RemixSelectTrigger trigger; + + final List> items; + + final T? selectedValue; + + final OverlayPositionConfig positioning; + + final ValueChanged? onChanged; + + final VoidCallback? onOpen; + + final VoidCallback? onClose; + + final bool enabled; + + final bool closeOnSelect; + + final String? semanticLabel; + + final FocusNode? focusNode; + + @override + Widget build(BuildContext context) { + return fortalSelectStyler(variant: this.variant, size: this.size).call( + key: this.key, + trigger: this.trigger, + items: this.items, + selectedValue: this.selectedValue, + positioning: this.positioning, + onChanged: this.onChanged, + onOpen: this.onOpen, + onClose: this.onClose, + enabled: this.enabled, + closeOnSelect: this.closeOnSelect, + semanticLabel: this.semanticLabel, + focusNode: this.focusNode, + ); + } +} diff --git a/packages/remix/lib/src/components/select/select.g.dart b/packages/remix/lib/src/components/select/select.g.dart index 8aab49de..cb6adc52 100644 --- a/packages/remix/lib/src/components/select/select.g.dart +++ b/packages/remix/lib/src/components/select/select.g.dart @@ -261,148 +261,520 @@ mixin _$RemixSelectMenuItemSpec typedef _$RemixSelectMenuItemSpecMethods = _$RemixSelectMenuItemSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixSelect]. -class FortalSelect extends StatelessWidget { - const FortalSelect({ - super.key, - this.variant = .surface, - this.size = .size2, - required this.trigger, - required this.items, - this.selectedValue, - this.positioning = const OverlayPositionConfig( - targetAnchor: .bottomCenter, - followerAnchor: .topCenter, - ), - this.onChanged, - this.onOpen, - this.onClose, - this.enabled = true, - this.closeOnSelect = true, - this.semanticLabel, - this.focusNode, - }); - - /// Surface-backed trigger with border. - const FortalSelect.surface({ - super.key, - this.size = .size2, - required this.trigger, - required this.items, - this.selectedValue, - this.positioning = const OverlayPositionConfig( - targetAnchor: .bottomCenter, - followerAnchor: .topCenter, - ), - this.onChanged, - this.onOpen, - this.onClose, - this.enabled = true, - this.closeOnSelect = true, - this.semanticLabel, - this.focusNode, - }) : variant = FortalSelectVariant.surface; - - /// Soft accent trigger. - const FortalSelect.soft({ - super.key, - this.size = .size2, - required this.trigger, - required this.items, - this.selectedValue, - this.positioning = const OverlayPositionConfig( - targetAnchor: .bottomCenter, - followerAnchor: .topCenter, - ), - this.onChanged, - this.onOpen, - this.onClose, - this.enabled = true, - this.closeOnSelect = true, - this.semanticLabel, - this.focusNode, - }) : variant = FortalSelectVariant.soft; - - /// Transparent trigger. - const FortalSelect.ghost({ - super.key, - this.size = .size2, - required this.trigger, - required this.items, - this.selectedValue, - this.positioning = const OverlayPositionConfig( - targetAnchor: .bottomCenter, - followerAnchor: .topCenter, - ), - this.onChanged, - this.onOpen, - this.onClose, - this.enabled = true, - this.closeOnSelect = true, - this.semanticLabel, - this.focusNode, - }) : variant = FortalSelectVariant.ghost; - - final FortalSelectVariant variant; - - final FortalSelectSize size; - - final RemixSelectTrigger trigger; - - final List> items; - - final T? selectedValue; - - final OverlayPositionConfig positioning; - - final ValueChanged? onChanged; - - final VoidCallback? onOpen; - - final VoidCallback? onClose; - - final bool enabled; - - final bool closeOnSelect; - - final String? semanticLabel; - - final FocusNode? focusNode; - - @override - Widget build(BuildContext context) { - return fortalSelectStyler(variant: this.variant, size: this.size).call( - key: this.key, - trigger: this.trigger, - items: this.items, - selectedValue: this.selectedValue, - positioning: this.positioning, - onChanged: this.onChanged, - onOpen: this.onOpen, - onClose: this.onClose, - enabled: this.enabled, - closeOnSelect: this.closeOnSelect, - semanticLabel: this.semanticLabel, - focusNode: this.focusNode, +class RemixSelectStyler extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $trigger; + final Prop>? $menuContainer; + final Prop>? $item; + + const RemixSelectStyler.create({ + Prop>? trigger, + Prop>? menuContainer, + Prop>? item, + super.variants, + super.modifier, + super.animation, + }) : $trigger = trigger, + $menuContainer = menuContainer, + $item = item; + + RemixSelectStyler({ + RemixSelectTriggerStyler? trigger, + FlexBoxStyler? menuContainer, + RemixSelectMenuItemStyler? item, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + trigger: Prop.maybeMix(trigger), + menuContainer: Prop.maybeMix(menuContainer), + item: Prop.maybeMix(item), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixSelectStyler.trigger(RemixSelectTriggerStyler value) => + RemixSelectStyler().trigger(value); + factory RemixSelectStyler.menuContainer(FlexBoxStyler value) => + RemixSelectStyler().menuContainer(value); + factory RemixSelectStyler.item(RemixSelectMenuItemStyler value) => + RemixSelectStyler().item(value); + factory RemixSelectStyler.alignment(AlignmentGeometry value) => + RemixSelectStyler().alignment(value); + factory RemixSelectStyler.padding(EdgeInsetsGeometryMix value) => + RemixSelectStyler().padding(value); + factory RemixSelectStyler.margin(EdgeInsetsGeometryMix value) => + RemixSelectStyler().margin(value); + factory RemixSelectStyler.constraints(BoxConstraintsMix value) => + RemixSelectStyler().constraints(value); + factory RemixSelectStyler.decoration(DecorationMix value) => + RemixSelectStyler().decoration(value); + factory RemixSelectStyler.foregroundDecoration(DecorationMix value) => + RemixSelectStyler().foregroundDecoration(value); + factory RemixSelectStyler.clipBehavior(Clip value) => + RemixSelectStyler().clipBehavior(value); + factory RemixSelectStyler.color(Color value) => + RemixSelectStyler().color(value); + factory RemixSelectStyler.gradient(GradientMix value) => + RemixSelectStyler().gradient(value); + factory RemixSelectStyler.border(BoxBorderMix value) => + RemixSelectStyler().border(value); + factory RemixSelectStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixSelectStyler().borderRadius(value); + factory RemixSelectStyler.elevation(ElevationShadow value) => + RemixSelectStyler().elevation(value); + factory RemixSelectStyler.shadow(BoxShadowMix value) => + RemixSelectStyler().shadow(value); + factory RemixSelectStyler.shadows(List value) => + RemixSelectStyler().shadows(value); + factory RemixSelectStyler.width(double value) => + RemixSelectStyler().width(value); + factory RemixSelectStyler.height(double value) => + RemixSelectStyler().height(value); + factory RemixSelectStyler.size(double width, double height) => + RemixSelectStyler().size(width, height); + factory RemixSelectStyler.minWidth(double value) => + RemixSelectStyler().minWidth(value); + factory RemixSelectStyler.maxWidth(double value) => + RemixSelectStyler().maxWidth(value); + factory RemixSelectStyler.minHeight(double value) => + RemixSelectStyler().minHeight(value); + factory RemixSelectStyler.maxHeight(double value) => + RemixSelectStyler().maxHeight(value); + factory RemixSelectStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixSelectStyler().scale(scale, alignment: alignment); + factory RemixSelectStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixSelectStyler().rotate(radians, alignment: alignment); + factory RemixSelectStyler.translate(double x, double y, [double z = 0.0]) => + RemixSelectStyler().translate(x, y, z); + factory RemixSelectStyler.skew(double skewX, double skewY) => + RemixSelectStyler().skew(skewX, skewY); + factory RemixSelectStyler.textStyle(TextStyler value) => + RemixSelectStyler().textStyle(value); + factory RemixSelectStyler.image(DecorationImageMix value) => + RemixSelectStyler().image(value); + factory RemixSelectStyler.shape(ShapeBorderMix value) => + RemixSelectStyler().shape(value); + factory RemixSelectStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSelectStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSelectStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSelectStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSelectStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSelectStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSelectStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixSelectStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixSelectStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixSelectStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixSelectStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixSelectStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixSelectStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixSelectStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixSelectStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixSelectStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixSelectStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixSelectStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixSelectStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixSelectStyler().transform(value, alignment: alignment); + + RemixSelectStyler alignment(AlignmentGeometry value) { + return menuContainer(FlexBoxStyler().alignment(value)); + } + + RemixSelectStyler padding(EdgeInsetsGeometryMix value) { + return menuContainer(FlexBoxStyler().padding(value)); + } + + RemixSelectStyler margin(EdgeInsetsGeometryMix value) { + return menuContainer(FlexBoxStyler().margin(value)); + } + + RemixSelectStyler constraints(BoxConstraintsMix value) { + return menuContainer(FlexBoxStyler().constraints(value)); + } + + RemixSelectStyler decoration(DecorationMix value) { + return menuContainer(FlexBoxStyler().decoration(value)); + } + + RemixSelectStyler foregroundDecoration(DecorationMix value) { + return menuContainer(FlexBoxStyler().foregroundDecoration(value)); + } + + RemixSelectStyler clipBehavior(Clip value) { + return menuContainer(FlexBoxStyler().clipBehavior(value)); + } + + RemixSelectStyler color(Color value) { + return menuContainer(FlexBoxStyler().color(value)); + } + + RemixSelectStyler gradient(GradientMix value) { + return menuContainer(FlexBoxStyler().gradient(value)); + } + + RemixSelectStyler border(BoxBorderMix value) { + return menuContainer(FlexBoxStyler().border(value)); + } + + RemixSelectStyler borderRadius(BorderRadiusGeometryMix value) { + return menuContainer(FlexBoxStyler().borderRadius(value)); + } + + RemixSelectStyler elevation(ElevationShadow value) { + return menuContainer(FlexBoxStyler().elevation(value)); + } + + RemixSelectStyler shadow(BoxShadowMix value) { + return menuContainer(FlexBoxStyler().shadow(value)); + } + + RemixSelectStyler shadows(List value) { + return menuContainer(FlexBoxStyler().shadows(value)); + } + + RemixSelectStyler width(double value) { + return menuContainer(FlexBoxStyler().width(value)); + } + + RemixSelectStyler height(double value) { + return menuContainer(FlexBoxStyler().height(value)); + } + + RemixSelectStyler size(double width, double height) { + return menuContainer(FlexBoxStyler().size(width, height)); + } + + RemixSelectStyler minWidth(double value) { + return menuContainer(FlexBoxStyler().minWidth(value)); + } + + RemixSelectStyler maxWidth(double value) { + return menuContainer(FlexBoxStyler().maxWidth(value)); + } + + RemixSelectStyler minHeight(double value) { + return menuContainer(FlexBoxStyler().minHeight(value)); + } + + RemixSelectStyler maxHeight(double value) { + return menuContainer(FlexBoxStyler().maxHeight(value)); + } + + RemixSelectStyler scale(double scale, {Alignment alignment = .center}) { + return menuContainer(FlexBoxStyler().scale(scale, alignment: alignment)); + } + + RemixSelectStyler rotate(double radians, {Alignment alignment = .center}) { + return menuContainer(FlexBoxStyler().rotate(radians, alignment: alignment)); + } + + RemixSelectStyler translate(double x, double y, [double z = 0.0]) { + return menuContainer(FlexBoxStyler().translate(x, y, z)); + } + + RemixSelectStyler skew(double skewX, double skewY) { + return menuContainer(FlexBoxStyler().skew(skewX, skewY)); + } + + RemixSelectStyler textStyle(TextStyler value) { + return menuContainer(FlexBoxStyler().textStyle(value)); + } + + RemixSelectStyler image(DecorationImageMix value) { + return menuContainer(FlexBoxStyler().image(value)); + } + + RemixSelectStyler shape(ShapeBorderMix value) { + return menuContainer(FlexBoxStyler().shape(value)); + } + + RemixSelectStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return menuContainer( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixSelectStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return menuContainer( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixSelectStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return menuContainer( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } -mixin _$RemixSelectStylerMixin on Style, Diagnosticable { - Prop>? get $menuContainer; - Prop>? get $trigger; - Prop>? get $item; + RemixSelectStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return menuContainer( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } - /// Sets the menuContainer. - RemixSelectStyler menuContainer(FlexBoxStyler value) { - return merge(RemixSelectStyler(menuContainer: value)); + RemixSelectStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return menuContainer( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixSelectStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return menuContainer( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixSelectStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return menuContainer( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixSelectStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return menuContainer( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixSelectStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return menuContainer( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixSelectStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return menuContainer( + FlexBoxStyler().transform(value, alignment: alignment), + ); } /// Sets the trigger. @@ -410,22 +782,30 @@ mixin _$RemixSelectStylerMixin on Style, Diagnosticable { return merge(RemixSelectStyler(trigger: value)); } + /// Sets the menuContainer. + RemixSelectStyler menuContainer(FlexBoxStyler value) { + return merge(RemixSelectStyler(menuContainer: value)); + } + /// Sets the item. RemixSelectStyler item(RemixSelectMenuItemStyler value) { return merge(RemixSelectStyler(item: value)); } /// Sets the animation configuration. + @override RemixSelectStyler animate(AnimationConfig value) { return merge(RemixSelectStyler(animation: value)); } /// Sets the style variants. + @override RemixSelectStyler variants(List> value) { return merge(RemixSelectStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixSelectStyler wrap(WidgetModifierConfig value) { return merge(RemixSelectStyler(modifier: value)); } @@ -439,8 +819,8 @@ mixin _$RemixSelectStylerMixin on Style, Diagnosticable { @override RemixSelectStyler merge(RemixSelectStyler? other) { return RemixSelectStyler.create( - menuContainer: MixOps.merge($menuContainer, other?.$menuContainer), trigger: MixOps.merge($trigger, other?.$trigger), + menuContainer: MixOps.merge($menuContainer, other?.$menuContainer), item: MixOps.merge($item, other?.$item), variants: MixOps.mergeVariants($variants, other?.$variants), modifier: MixOps.mergeModifier($modifier, other?.$modifier), @@ -452,8 +832,8 @@ mixin _$RemixSelectStylerMixin on Style, Diagnosticable { @override StyleSpec resolve(BuildContext context) { final spec = RemixSelectSpec( - menuContainer: MixOps.resolve(context, $menuContainer), trigger: MixOps.resolve(context, $trigger), + menuContainer: MixOps.resolve(context, $menuContainer), item: MixOps.resolve(context, $item), ); @@ -468,15 +848,15 @@ mixin _$RemixSelectStylerMixin on Style, Diagnosticable { void debugFillProperties(DiagnosticPropertiesBuilder properties) { super.debugFillProperties(properties); properties - ..add(DiagnosticsProperty('menuContainer', $menuContainer)) ..add(DiagnosticsProperty('trigger', $trigger)) + ..add(DiagnosticsProperty('menuContainer', $menuContainer)) ..add(DiagnosticsProperty('item', $item)); } @override List get props => [ - $menuContainer, $trigger, + $menuContainer, $item, $animation, $modifier, @@ -484,11 +864,593 @@ mixin _$RemixSelectStylerMixin on Style, Diagnosticable { ]; } -mixin _$RemixSelectTriggerStylerMixin - on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $label; - Prop>? get $icon; +class RemixSelectTriggerStyler + extends MixStyler + with + RemixBoxStylerMixin, + LabelStyleMixin, + IconStyleMixin { + final Prop>? $container; + final Prop>? $label; + final Prop>? $icon; + + const RemixSelectTriggerStyler.create({ + Prop>? container, + Prop>? label, + Prop>? icon, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $label = label, + $icon = icon; + + RemixSelectTriggerStyler({ + FlexBoxStyler? container, + TextStyler? label, + IconStyler? icon, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + label: Prop.maybeMix(label), + icon: Prop.maybeMix(icon), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixSelectTriggerStyler.container(FlexBoxStyler value) => + RemixSelectTriggerStyler().container(value); + factory RemixSelectTriggerStyler.label(TextStyler value) => + RemixSelectTriggerStyler().label(value); + factory RemixSelectTriggerStyler.icon(IconStyler value) => + RemixSelectTriggerStyler().icon(value); + factory RemixSelectTriggerStyler.color(Color value) => + RemixSelectTriggerStyler().color(value); + factory RemixSelectTriggerStyler.gradient(GradientMix value) => + RemixSelectTriggerStyler().gradient(value); + factory RemixSelectTriggerStyler.border(BoxBorderMix value) => + RemixSelectTriggerStyler().border(value); + factory RemixSelectTriggerStyler.borderRadius( + BorderRadiusGeometryMix value, + ) => RemixSelectTriggerStyler().borderRadius(value); + factory RemixSelectTriggerStyler.elevation(ElevationShadow value) => + RemixSelectTriggerStyler().elevation(value); + factory RemixSelectTriggerStyler.shadow(BoxShadowMix value) => + RemixSelectTriggerStyler().shadow(value); + factory RemixSelectTriggerStyler.shadows(List value) => + RemixSelectTriggerStyler().shadows(value); + factory RemixSelectTriggerStyler.width(double value) => + RemixSelectTriggerStyler().width(value); + factory RemixSelectTriggerStyler.height(double value) => + RemixSelectTriggerStyler().height(value); + factory RemixSelectTriggerStyler.size(double width, double height) => + RemixSelectTriggerStyler().size(width, height); + factory RemixSelectTriggerStyler.minWidth(double value) => + RemixSelectTriggerStyler().minWidth(value); + factory RemixSelectTriggerStyler.maxWidth(double value) => + RemixSelectTriggerStyler().maxWidth(value); + factory RemixSelectTriggerStyler.minHeight(double value) => + RemixSelectTriggerStyler().minHeight(value); + factory RemixSelectTriggerStyler.maxHeight(double value) => + RemixSelectTriggerStyler().maxHeight(value); + factory RemixSelectTriggerStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixSelectTriggerStyler().scale(scale, alignment: alignment); + factory RemixSelectTriggerStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixSelectTriggerStyler().rotate(radians, alignment: alignment); + factory RemixSelectTriggerStyler.translate( + double x, + double y, [ + double z = 0.0, + ]) => RemixSelectTriggerStyler().translate(x, y, z); + factory RemixSelectTriggerStyler.skew(double skewX, double skewY) => + RemixSelectTriggerStyler().skew(skewX, skewY); + factory RemixSelectTriggerStyler.textStyle(TextStyler value) => + RemixSelectTriggerStyler().textStyle(value); + factory RemixSelectTriggerStyler.image(DecorationImageMix value) => + RemixSelectTriggerStyler().image(value); + factory RemixSelectTriggerStyler.shape(ShapeBorderMix value) => + RemixSelectTriggerStyler().shape(value); + factory RemixSelectTriggerStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSelectTriggerStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSelectTriggerStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSelectTriggerStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSelectTriggerStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSelectTriggerStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSelectTriggerStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixSelectTriggerStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixSelectTriggerStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixSelectTriggerStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixSelectTriggerStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixSelectTriggerStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixSelectTriggerStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixSelectTriggerStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixSelectTriggerStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixSelectTriggerStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixSelectTriggerStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixSelectTriggerStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixSelectTriggerStyler.row() => RemixSelectTriggerStyler().row(); + factory RemixSelectTriggerStyler.column() => + RemixSelectTriggerStyler().column(); + factory RemixSelectTriggerStyler.alignment(AlignmentGeometry value) => + RemixSelectTriggerStyler().alignment(value); + factory RemixSelectTriggerStyler.padding(EdgeInsetsGeometryMix value) => + RemixSelectTriggerStyler().padding(value); + factory RemixSelectTriggerStyler.margin(EdgeInsetsGeometryMix value) => + RemixSelectTriggerStyler().margin(value); + factory RemixSelectTriggerStyler.constraints(BoxConstraintsMix value) => + RemixSelectTriggerStyler().constraints(value); + factory RemixSelectTriggerStyler.decoration(DecorationMix value) => + RemixSelectTriggerStyler().decoration(value); + factory RemixSelectTriggerStyler.foregroundDecoration(DecorationMix value) => + RemixSelectTriggerStyler().foregroundDecoration(value); + factory RemixSelectTriggerStyler.clipBehavior(Clip value) => + RemixSelectTriggerStyler().clipBehavior(value); + factory RemixSelectTriggerStyler.direction(Axis value) => + RemixSelectTriggerStyler().direction(value); + factory RemixSelectTriggerStyler.mainAxisAlignment(MainAxisAlignment value) => + RemixSelectTriggerStyler().mainAxisAlignment(value); + factory RemixSelectTriggerStyler.crossAxisAlignment( + CrossAxisAlignment value, + ) => RemixSelectTriggerStyler().crossAxisAlignment(value); + factory RemixSelectTriggerStyler.mainAxisSize(MainAxisSize value) => + RemixSelectTriggerStyler().mainAxisSize(value); + factory RemixSelectTriggerStyler.spacing(double value) => + RemixSelectTriggerStyler().spacing(value); + factory RemixSelectTriggerStyler.verticalDirection(VerticalDirection value) => + RemixSelectTriggerStyler().verticalDirection(value); + factory RemixSelectTriggerStyler.textDirection(TextDirection value) => + RemixSelectTriggerStyler().textDirection(value); + factory RemixSelectTriggerStyler.textBaseline(TextBaseline value) => + RemixSelectTriggerStyler().textBaseline(value); + factory RemixSelectTriggerStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixSelectTriggerStyler().transform(value, alignment: alignment); + + RemixSelectTriggerStyler color(Color value) { + return container(FlexBoxStyler().color(value)); + } + + RemixSelectTriggerStyler gradient(GradientMix value) { + return container(FlexBoxStyler().gradient(value)); + } + + RemixSelectTriggerStyler border(BoxBorderMix value) { + return container(FlexBoxStyler().border(value)); + } + + RemixSelectTriggerStyler borderRadius(BorderRadiusGeometryMix value) { + return container(FlexBoxStyler().borderRadius(value)); + } + + RemixSelectTriggerStyler elevation(ElevationShadow value) { + return container(FlexBoxStyler().elevation(value)); + } + + RemixSelectTriggerStyler shadow(BoxShadowMix value) { + return container(FlexBoxStyler().shadow(value)); + } + + RemixSelectTriggerStyler shadows(List value) { + return container(FlexBoxStyler().shadows(value)); + } + + RemixSelectTriggerStyler width(double value) { + return container(FlexBoxStyler().width(value)); + } + + RemixSelectTriggerStyler height(double value) { + return container(FlexBoxStyler().height(value)); + } + + RemixSelectTriggerStyler size(double width, double height) { + return container(FlexBoxStyler().size(width, height)); + } + + RemixSelectTriggerStyler minWidth(double value) { + return container(FlexBoxStyler().minWidth(value)); + } + + RemixSelectTriggerStyler maxWidth(double value) { + return container(FlexBoxStyler().maxWidth(value)); + } + + RemixSelectTriggerStyler minHeight(double value) { + return container(FlexBoxStyler().minHeight(value)); + } + + RemixSelectTriggerStyler maxHeight(double value) { + return container(FlexBoxStyler().maxHeight(value)); + } + + RemixSelectTriggerStyler scale( + double scale, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().scale(scale, alignment: alignment)); + } + + RemixSelectTriggerStyler rotate( + double radians, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().rotate(radians, alignment: alignment)); + } + + RemixSelectTriggerStyler translate(double x, double y, [double z = 0.0]) { + return container(FlexBoxStyler().translate(x, y, z)); + } + + RemixSelectTriggerStyler skew(double skewX, double skewY) { + return container(FlexBoxStyler().skew(skewX, skewY)); + } + + RemixSelectTriggerStyler textStyle(TextStyler value) { + return container(FlexBoxStyler().textStyle(value)); + } + + RemixSelectTriggerStyler image(DecorationImageMix value) { + return container(FlexBoxStyler().image(value)); + } + + RemixSelectTriggerStyler shape(ShapeBorderMix value) { + return container(FlexBoxStyler().shape(value)); + } + + RemixSelectTriggerStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixSelectTriggerStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixSelectTriggerStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixSelectTriggerStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixSelectTriggerStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixSelectTriggerStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixSelectTriggerStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixSelectTriggerStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixSelectTriggerStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixSelectTriggerStyler row() { + return container(FlexBoxStyler().row()); + } + + RemixSelectTriggerStyler column() { + return container(FlexBoxStyler().column()); + } + + RemixSelectTriggerStyler alignment(AlignmentGeometry value) { + return container(FlexBoxStyler().alignment(value)); + } + + RemixSelectTriggerStyler padding(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().padding(value)); + } + + RemixSelectTriggerStyler margin(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().margin(value)); + } + + RemixSelectTriggerStyler constraints(BoxConstraintsMix value) { + return container(FlexBoxStyler().constraints(value)); + } + + RemixSelectTriggerStyler decoration(DecorationMix value) { + return container(FlexBoxStyler().decoration(value)); + } + + RemixSelectTriggerStyler foregroundDecoration(DecorationMix value) { + return container(FlexBoxStyler().foregroundDecoration(value)); + } + + RemixSelectTriggerStyler clipBehavior(Clip value) { + return container(FlexBoxStyler().clipBehavior(value)); + } + + RemixSelectTriggerStyler direction(Axis value) { + return container(FlexBoxStyler().direction(value)); + } + + RemixSelectTriggerStyler mainAxisAlignment(MainAxisAlignment value) { + return container(FlexBoxStyler().mainAxisAlignment(value)); + } + + RemixSelectTriggerStyler crossAxisAlignment(CrossAxisAlignment value) { + return container(FlexBoxStyler().crossAxisAlignment(value)); + } + + RemixSelectTriggerStyler mainAxisSize(MainAxisSize value) { + return container(FlexBoxStyler().mainAxisSize(value)); + } + + RemixSelectTriggerStyler spacing(double value) { + return container(FlexBoxStyler().spacing(value)); + } + + RemixSelectTriggerStyler verticalDirection(VerticalDirection value) { + return container(FlexBoxStyler().verticalDirection(value)); + } + + RemixSelectTriggerStyler textDirection(TextDirection value) { + return container(FlexBoxStyler().textDirection(value)); + } + + RemixSelectTriggerStyler textBaseline(TextBaseline value) { + return container(FlexBoxStyler().textBaseline(value)); + } + + RemixSelectTriggerStyler transform( + Matrix4 value, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixSelectTriggerStyler container(FlexBoxStyler value) { @@ -496,21 +1458,25 @@ mixin _$RemixSelectTriggerStylerMixin } /// Sets the label. + @override RemixSelectTriggerStyler label(TextStyler value) { return merge(RemixSelectTriggerStyler(label: value)); } /// Sets the icon. + @override RemixSelectTriggerStyler icon(IconStyler value) { return merge(RemixSelectTriggerStyler(icon: value)); } /// Sets the animation configuration. + @override RemixSelectTriggerStyler animate(AnimationConfig value) { return merge(RemixSelectTriggerStyler(animation: value)); } /// Sets the style variants. + @override RemixSelectTriggerStyler variants( List> value, ) { @@ -518,6 +1484,7 @@ mixin _$RemixSelectTriggerStylerMixin } /// Wraps with a widget modifier. + @override RemixSelectTriggerStyler wrap(WidgetModifierConfig value) { return merge(RemixSelectTriggerStyler(modifier: value)); } @@ -576,11 +1543,594 @@ mixin _$RemixSelectTriggerStylerMixin ]; } -mixin _$RemixSelectMenuItemStylerMixin - on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $text; - Prop>? get $icon; +class RemixSelectMenuItemStyler + extends MixStyler + with + RemixBoxStylerMixin, + IconStyleMixin { + final Prop>? $container; + final Prop>? $text; + final Prop>? $icon; + + const RemixSelectMenuItemStyler.create({ + Prop>? container, + Prop>? text, + Prop>? icon, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $text = text, + $icon = icon; + + RemixSelectMenuItemStyler({ + FlexBoxStyler? container, + TextStyler? text, + IconStyler? icon, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + text: Prop.maybeMix(text), + icon: Prop.maybeMix(icon), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixSelectMenuItemStyler.container(FlexBoxStyler value) => + RemixSelectMenuItemStyler().container(value); + factory RemixSelectMenuItemStyler.text(TextStyler value) => + RemixSelectMenuItemStyler().text(value); + factory RemixSelectMenuItemStyler.icon(IconStyler value) => + RemixSelectMenuItemStyler().icon(value); + factory RemixSelectMenuItemStyler.color(Color value) => + RemixSelectMenuItemStyler().color(value); + factory RemixSelectMenuItemStyler.gradient(GradientMix value) => + RemixSelectMenuItemStyler().gradient(value); + factory RemixSelectMenuItemStyler.border(BoxBorderMix value) => + RemixSelectMenuItemStyler().border(value); + factory RemixSelectMenuItemStyler.borderRadius( + BorderRadiusGeometryMix value, + ) => RemixSelectMenuItemStyler().borderRadius(value); + factory RemixSelectMenuItemStyler.elevation(ElevationShadow value) => + RemixSelectMenuItemStyler().elevation(value); + factory RemixSelectMenuItemStyler.shadow(BoxShadowMix value) => + RemixSelectMenuItemStyler().shadow(value); + factory RemixSelectMenuItemStyler.shadows(List value) => + RemixSelectMenuItemStyler().shadows(value); + factory RemixSelectMenuItemStyler.width(double value) => + RemixSelectMenuItemStyler().width(value); + factory RemixSelectMenuItemStyler.height(double value) => + RemixSelectMenuItemStyler().height(value); + factory RemixSelectMenuItemStyler.size(double width, double height) => + RemixSelectMenuItemStyler().size(width, height); + factory RemixSelectMenuItemStyler.minWidth(double value) => + RemixSelectMenuItemStyler().minWidth(value); + factory RemixSelectMenuItemStyler.maxWidth(double value) => + RemixSelectMenuItemStyler().maxWidth(value); + factory RemixSelectMenuItemStyler.minHeight(double value) => + RemixSelectMenuItemStyler().minHeight(value); + factory RemixSelectMenuItemStyler.maxHeight(double value) => + RemixSelectMenuItemStyler().maxHeight(value); + factory RemixSelectMenuItemStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixSelectMenuItemStyler().scale(scale, alignment: alignment); + factory RemixSelectMenuItemStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixSelectMenuItemStyler().rotate(radians, alignment: alignment); + factory RemixSelectMenuItemStyler.translate( + double x, + double y, [ + double z = 0.0, + ]) => RemixSelectMenuItemStyler().translate(x, y, z); + factory RemixSelectMenuItemStyler.skew(double skewX, double skewY) => + RemixSelectMenuItemStyler().skew(skewX, skewY); + factory RemixSelectMenuItemStyler.textStyle(TextStyler value) => + RemixSelectMenuItemStyler().textStyle(value); + factory RemixSelectMenuItemStyler.image(DecorationImageMix value) => + RemixSelectMenuItemStyler().image(value); + factory RemixSelectMenuItemStyler.shape(ShapeBorderMix value) => + RemixSelectMenuItemStyler().shape(value); + factory RemixSelectMenuItemStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSelectMenuItemStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSelectMenuItemStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSelectMenuItemStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSelectMenuItemStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSelectMenuItemStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSelectMenuItemStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixSelectMenuItemStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixSelectMenuItemStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixSelectMenuItemStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixSelectMenuItemStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixSelectMenuItemStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixSelectMenuItemStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixSelectMenuItemStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixSelectMenuItemStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixSelectMenuItemStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixSelectMenuItemStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixSelectMenuItemStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixSelectMenuItemStyler.row() => RemixSelectMenuItemStyler().row(); + factory RemixSelectMenuItemStyler.column() => + RemixSelectMenuItemStyler().column(); + factory RemixSelectMenuItemStyler.alignment(AlignmentGeometry value) => + RemixSelectMenuItemStyler().alignment(value); + factory RemixSelectMenuItemStyler.padding(EdgeInsetsGeometryMix value) => + RemixSelectMenuItemStyler().padding(value); + factory RemixSelectMenuItemStyler.margin(EdgeInsetsGeometryMix value) => + RemixSelectMenuItemStyler().margin(value); + factory RemixSelectMenuItemStyler.constraints(BoxConstraintsMix value) => + RemixSelectMenuItemStyler().constraints(value); + factory RemixSelectMenuItemStyler.decoration(DecorationMix value) => + RemixSelectMenuItemStyler().decoration(value); + factory RemixSelectMenuItemStyler.foregroundDecoration(DecorationMix value) => + RemixSelectMenuItemStyler().foregroundDecoration(value); + factory RemixSelectMenuItemStyler.clipBehavior(Clip value) => + RemixSelectMenuItemStyler().clipBehavior(value); + factory RemixSelectMenuItemStyler.direction(Axis value) => + RemixSelectMenuItemStyler().direction(value); + factory RemixSelectMenuItemStyler.mainAxisAlignment( + MainAxisAlignment value, + ) => RemixSelectMenuItemStyler().mainAxisAlignment(value); + factory RemixSelectMenuItemStyler.crossAxisAlignment( + CrossAxisAlignment value, + ) => RemixSelectMenuItemStyler().crossAxisAlignment(value); + factory RemixSelectMenuItemStyler.mainAxisSize(MainAxisSize value) => + RemixSelectMenuItemStyler().mainAxisSize(value); + factory RemixSelectMenuItemStyler.spacing(double value) => + RemixSelectMenuItemStyler().spacing(value); + factory RemixSelectMenuItemStyler.verticalDirection( + VerticalDirection value, + ) => RemixSelectMenuItemStyler().verticalDirection(value); + factory RemixSelectMenuItemStyler.textDirection(TextDirection value) => + RemixSelectMenuItemStyler().textDirection(value); + factory RemixSelectMenuItemStyler.textBaseline(TextBaseline value) => + RemixSelectMenuItemStyler().textBaseline(value); + factory RemixSelectMenuItemStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixSelectMenuItemStyler().transform(value, alignment: alignment); + + RemixSelectMenuItemStyler color(Color value) { + return container(FlexBoxStyler().color(value)); + } + + RemixSelectMenuItemStyler gradient(GradientMix value) { + return container(FlexBoxStyler().gradient(value)); + } + + RemixSelectMenuItemStyler border(BoxBorderMix value) { + return container(FlexBoxStyler().border(value)); + } + + RemixSelectMenuItemStyler borderRadius(BorderRadiusGeometryMix value) { + return container(FlexBoxStyler().borderRadius(value)); + } + + RemixSelectMenuItemStyler elevation(ElevationShadow value) { + return container(FlexBoxStyler().elevation(value)); + } + + RemixSelectMenuItemStyler shadow(BoxShadowMix value) { + return container(FlexBoxStyler().shadow(value)); + } + + RemixSelectMenuItemStyler shadows(List value) { + return container(FlexBoxStyler().shadows(value)); + } + + RemixSelectMenuItemStyler width(double value) { + return container(FlexBoxStyler().width(value)); + } + + RemixSelectMenuItemStyler height(double value) { + return container(FlexBoxStyler().height(value)); + } + + RemixSelectMenuItemStyler size(double width, double height) { + return container(FlexBoxStyler().size(width, height)); + } + + RemixSelectMenuItemStyler minWidth(double value) { + return container(FlexBoxStyler().minWidth(value)); + } + + RemixSelectMenuItemStyler maxWidth(double value) { + return container(FlexBoxStyler().maxWidth(value)); + } + + RemixSelectMenuItemStyler minHeight(double value) { + return container(FlexBoxStyler().minHeight(value)); + } + + RemixSelectMenuItemStyler maxHeight(double value) { + return container(FlexBoxStyler().maxHeight(value)); + } + + RemixSelectMenuItemStyler scale( + double scale, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().scale(scale, alignment: alignment)); + } + + RemixSelectMenuItemStyler rotate( + double radians, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().rotate(radians, alignment: alignment)); + } + + RemixSelectMenuItemStyler translate(double x, double y, [double z = 0.0]) { + return container(FlexBoxStyler().translate(x, y, z)); + } + + RemixSelectMenuItemStyler skew(double skewX, double skewY) { + return container(FlexBoxStyler().skew(skewX, skewY)); + } + + RemixSelectMenuItemStyler textStyle(TextStyler value) { + return container(FlexBoxStyler().textStyle(value)); + } + + RemixSelectMenuItemStyler image(DecorationImageMix value) { + return container(FlexBoxStyler().image(value)); + } + + RemixSelectMenuItemStyler shape(ShapeBorderMix value) { + return container(FlexBoxStyler().shape(value)); + } + + RemixSelectMenuItemStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixSelectMenuItemStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixSelectMenuItemStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixSelectMenuItemStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixSelectMenuItemStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixSelectMenuItemStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixSelectMenuItemStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixSelectMenuItemStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixSelectMenuItemStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixSelectMenuItemStyler row() { + return container(FlexBoxStyler().row()); + } + + RemixSelectMenuItemStyler column() { + return container(FlexBoxStyler().column()); + } + + RemixSelectMenuItemStyler alignment(AlignmentGeometry value) { + return container(FlexBoxStyler().alignment(value)); + } + + RemixSelectMenuItemStyler padding(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().padding(value)); + } + + RemixSelectMenuItemStyler margin(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().margin(value)); + } + + RemixSelectMenuItemStyler constraints(BoxConstraintsMix value) { + return container(FlexBoxStyler().constraints(value)); + } + + RemixSelectMenuItemStyler decoration(DecorationMix value) { + return container(FlexBoxStyler().decoration(value)); + } + + RemixSelectMenuItemStyler foregroundDecoration(DecorationMix value) { + return container(FlexBoxStyler().foregroundDecoration(value)); + } + + RemixSelectMenuItemStyler clipBehavior(Clip value) { + return container(FlexBoxStyler().clipBehavior(value)); + } + + RemixSelectMenuItemStyler direction(Axis value) { + return container(FlexBoxStyler().direction(value)); + } + + RemixSelectMenuItemStyler mainAxisAlignment(MainAxisAlignment value) { + return container(FlexBoxStyler().mainAxisAlignment(value)); + } + + RemixSelectMenuItemStyler crossAxisAlignment(CrossAxisAlignment value) { + return container(FlexBoxStyler().crossAxisAlignment(value)); + } + + RemixSelectMenuItemStyler mainAxisSize(MainAxisSize value) { + return container(FlexBoxStyler().mainAxisSize(value)); + } + + RemixSelectMenuItemStyler spacing(double value) { + return container(FlexBoxStyler().spacing(value)); + } + + RemixSelectMenuItemStyler verticalDirection(VerticalDirection value) { + return container(FlexBoxStyler().verticalDirection(value)); + } + + RemixSelectMenuItemStyler textDirection(TextDirection value) { + return container(FlexBoxStyler().textDirection(value)); + } + + RemixSelectMenuItemStyler textBaseline(TextBaseline value) { + return container(FlexBoxStyler().textBaseline(value)); + } + + RemixSelectMenuItemStyler transform( + Matrix4 value, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixSelectMenuItemStyler container(FlexBoxStyler value) { @@ -593,16 +2143,19 @@ mixin _$RemixSelectMenuItemStylerMixin } /// Sets the icon. + @override RemixSelectMenuItemStyler icon(IconStyler value) { return merge(RemixSelectMenuItemStyler(icon: value)); } /// Sets the animation configuration. + @override RemixSelectMenuItemStyler animate(AnimationConfig value) { return merge(RemixSelectMenuItemStyler(animation: value)); } /// Sets the style variants. + @override RemixSelectMenuItemStyler variants( List> value, ) { @@ -610,6 +2163,7 @@ mixin _$RemixSelectMenuItemStylerMixin } /// Wraps with a widget modifier. + @override RemixSelectMenuItemStyler wrap(WidgetModifierConfig value) { return merge(RemixSelectMenuItemStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/select/select_spec.dart b/packages/remix/lib/src/components/select/select_spec.dart index 043404c8..18506226 100644 --- a/packages/remix/lib/src/components/select/select_spec.dart +++ b/packages/remix/lib/src/components/select/select_spec.dart @@ -1,11 +1,12 @@ part of 'select.dart'; /// Resolved visual values for a [RemixSelect]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixSelectSpec with _$RemixSelectSpec { @override final StyleSpec trigger; @override + @MixableField(forwardStyler: true, stylerSurface: BoxSpec) final StyleSpec menuContainer; @override final StyleSpec item; @@ -20,9 +21,12 @@ class RemixSelectSpec with _$RemixSelectSpec { } /// Resolved visual values for the select trigger. -@MixableSpec() +@MixableSpec( + extraStylerMixins: [RemixBoxStylerMixin, LabelStyleMixin, IconStyleMixin], +) class RemixSelectTriggerSpec with _$RemixSelectTriggerSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; @override final StyleSpec label; @@ -39,9 +43,10 @@ class RemixSelectTriggerSpec with _$RemixSelectTriggerSpec { } /// Resolved visual values for a select menu item. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin, IconStyleMixin]) class RemixSelectMenuItemSpec with _$RemixSelectMenuItemSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; @override final StyleSpec text; diff --git a/packages/remix/lib/src/components/select/select_style.dart b/packages/remix/lib/src/components/select/select_style.dart index bcef4683..1db11fb9 100644 --- a/packages/remix/lib/src/components/select/select_style.dart +++ b/packages/remix/lib/src/components/select/select_style.dart @@ -1,43 +1,7 @@ part of 'select.dart'; /// Style configuration for [RemixSelect] trigger and menu overlay. -@MixableStyler() -class RemixSelectStyler extends RemixStyler - with Diagnosticable, _$RemixSelectStylerMixin { - @MixableField(setterType: FlexBoxStyler) - final Prop>? $menuContainer; - @MixableField(setterType: RemixSelectTriggerStyler) - final Prop>? $trigger; - @MixableField(setterType: RemixSelectMenuItemStyler) - final Prop>? $item; - - const RemixSelectStyler.create({ - Prop>? menuContainer, - Prop>? trigger, - Prop>? item, - super.variants, - super.animation, - super.modifier, - }) : $menuContainer = menuContainer, - $trigger = trigger, - $item = item; - - RemixSelectStyler({ - FlexBoxStyler? menuContainer, - RemixSelectTriggerStyler? trigger, - RemixSelectMenuItemStyler? item, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - menuContainer: Prop.maybeMix(menuContainer), - trigger: Prop.maybeMix(trigger), - item: Prop.maybeMix(item), - variants: variants, - animation: animation, - modifier: modifier, - ); - +extension RemixSelectStylerRemixHelpers on RemixSelectStyler { /// Creates a [RemixSelect] widget with this style applied. /// /// Example: @@ -86,142 +50,10 @@ class RemixSelectStyler extends RemixStyler style: this, ); } - - // Abstract method implementations for mixins (delegating to menuContainer) - - RemixSelectStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixSelectStyler( - menuContainer: FlexBoxStyler(foregroundDecoration: value), - ), - ); - } - - RemixSelectStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixSelectStyler( - menuContainer: FlexBoxStyler( - transform: value, - transformAlignment: alignment, - ), - ), - ); - } } /// Style configuration for the visible [RemixSelect] trigger. -@MixableStyler() -class RemixSelectTriggerStyler - extends - RemixFlexContainerStyler< - RemixSelectTriggerSpec, - RemixSelectTriggerStyler - > - with - LabelStyleMixin, - IconStyleMixin, - Diagnosticable, - _$RemixSelectTriggerStylerMixin { - @MixableField(setterType: FlexBoxStyler) - final Prop>? $container; - @MixableField(setterType: TextStyler) - final Prop>? $label; - @MixableField(setterType: IconStyler) - final Prop>? $icon; - - const RemixSelectTriggerStyler.create({ - Prop>? container, - Prop>? label, - Prop>? icon, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $label = label, - $icon = icon; - - RemixSelectTriggerStyler({ - FlexBoxStyler? container, - TextStyler? label, - IconStyler? icon, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - label: Prop.maybeMix(label), - icon: Prop.maybeMix(icon), - variants: variants, - animation: animation, - modifier: modifier, - ); - - /// Sets container alignment - RemixSelectTriggerStyler alignment(Alignment value) { - return merge( - RemixSelectTriggerStyler(container: FlexBoxStyler(alignment: value)), - ); - } - - // Abstract method implementations for mixins - - @override - RemixSelectTriggerStyler constraints(BoxConstraintsMix value) { - return merge( - RemixSelectTriggerStyler(container: FlexBoxStyler(constraints: value)), - ); - } - - @override - RemixSelectTriggerStyler decoration(DecorationMix value) { - return merge( - RemixSelectTriggerStyler(container: FlexBoxStyler(decoration: value)), - ); - } - - @override - RemixSelectTriggerStyler margin(EdgeInsetsGeometryMix value) { - return merge( - RemixSelectTriggerStyler(container: FlexBoxStyler(margin: value)), - ); - } - - @override - RemixSelectTriggerStyler padding(EdgeInsetsGeometryMix value) { - return merge( - RemixSelectTriggerStyler(container: FlexBoxStyler(padding: value)), - ); - } - - @override - RemixSelectTriggerStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixSelectTriggerStyler( - container: FlexBoxStyler(foregroundDecoration: value), - ), - ); - } - - @override - RemixSelectTriggerStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixSelectTriggerStyler( - container: FlexBoxStyler( - transform: value, - transformAlignment: alignment, - ), - ), - ); - } - - // FlexStyleMixin implementation - @override +extension RemixSelectTriggerStylerRemixHelpers on RemixSelectTriggerStyler { RemixSelectTriggerStyler flex(FlexStyler value) { return merge( RemixSelectTriggerStyler(container: FlexBoxStyler().flex(value)), @@ -230,121 +62,56 @@ class RemixSelectTriggerStyler } /// Style configuration for an item in a [RemixSelect] menu. -@MixableStyler() -class RemixSelectMenuItemStyler - extends - RemixFlexContainerStyler< - RemixSelectMenuItemSpec, - RemixSelectMenuItemStyler - > - with - LabelStyleMixin, - IconStyleMixin, - Diagnosticable, - _$RemixSelectMenuItemStylerMixin { - @MixableField(setterType: FlexBoxStyler) - final Prop>? $container; - @MixableField(setterType: TextStyler) - final Prop>? $text; - @MixableField(setterType: IconStyler) - final Prop>? $icon; +extension RemixSelectMenuItemStylerRemixHelpers on RemixSelectMenuItemStyler { + /// Sets label styling (delegates to text for consistency with mixin) + RemixSelectMenuItemStyler label(TextStyler value) { + return text(value); + } - const RemixSelectMenuItemStyler.create({ - Prop>? container, - Prop>? text, - Prop>? icon, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $text = text, - $icon = icon; + RemixSelectMenuItemStyler labelStyle(TextStyleMix value) { + return label(TextStyler(style: value)); + } - RemixSelectMenuItemStyler({ - FlexBoxStyler? container, - TextStyler? text, - IconStyler? icon, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - text: Prop.maybeMix(text), - icon: Prop.maybeMix(icon), - variants: variants, - animation: animation, - modifier: modifier, - ); + RemixSelectMenuItemStyler labelColor(Color value) { + return label(TextStyler(style: TextStyleMix(color: value))); + } - /// Sets container alignment - RemixSelectMenuItemStyler alignment(Alignment value) { - return merge( - RemixSelectMenuItemStyler(container: FlexBoxStyler(alignment: value)), - ); + RemixSelectMenuItemStyler labelFontSize(double value) { + return label(TextStyler(style: TextStyleMix(fontSize: value))); } - /// Sets label styling (delegates to text for consistency with mixin) - @override - RemixSelectMenuItemStyler label(TextStyler value) { - return text(value); + RemixSelectMenuItemStyler labelFontWeight(FontWeight value) { + return label(TextStyler(style: TextStyleMix(fontWeight: value))); } - // Abstract method implementations for mixins + RemixSelectMenuItemStyler labelFontStyle(FontStyle value) { + return label(TextStyler(style: TextStyleMix(fontStyle: value))); + } - @override - RemixSelectMenuItemStyler constraints(BoxConstraintsMix value) { - return merge( - RemixSelectMenuItemStyler(container: FlexBoxStyler(constraints: value)), - ); + RemixSelectMenuItemStyler labelLetterSpacing(double value) { + return label(TextStyler(style: TextStyleMix(letterSpacing: value))); } - @override - RemixSelectMenuItemStyler decoration(DecorationMix value) { - return merge( - RemixSelectMenuItemStyler(container: FlexBoxStyler(decoration: value)), - ); + RemixSelectMenuItemStyler labelDecoration(TextDecoration value) { + return label(TextStyler(style: TextStyleMix(decoration: value))); } - @override - RemixSelectMenuItemStyler margin(EdgeInsetsGeometryMix value) { - return merge( - RemixSelectMenuItemStyler(container: FlexBoxStyler(margin: value)), - ); + RemixSelectMenuItemStyler labelFontFamily(String value) { + return label(TextStyler(style: TextStyleMix(fontFamily: value))); } - @override - RemixSelectMenuItemStyler padding(EdgeInsetsGeometryMix value) { - return merge( - RemixSelectMenuItemStyler(container: FlexBoxStyler(padding: value)), - ); + RemixSelectMenuItemStyler labelHeight(double value) { + return label(TextStyler(style: TextStyleMix(height: value))); } - @override - RemixSelectMenuItemStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixSelectMenuItemStyler( - container: FlexBoxStyler(foregroundDecoration: value), - ), - ); + RemixSelectMenuItemStyler labelWordSpacing(double value) { + return label(TextStyler(style: TextStyleMix(wordSpacing: value))); } - @override - RemixSelectMenuItemStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixSelectMenuItemStyler( - container: FlexBoxStyler( - transform: value, - transformAlignment: alignment, - ), - ), - ); + RemixSelectMenuItemStyler labelDecorationColor(Color value) { + return label(TextStyler(style: TextStyleMix(decorationColor: value))); } - // FlexStyleMixin implementation - @override RemixSelectMenuItemStyler flex(FlexStyler value) { return merge( RemixSelectMenuItemStyler(container: FlexBoxStyler().flex(value)), diff --git a/packages/remix/lib/src/components/slider/fortal_slider_styles.dart b/packages/remix/lib/src/components/slider/fortal_slider_styles.dart index 1126befa..fec8890a 100644 --- a/packages/remix/lib/src/components/slider/fortal_slider_styles.dart +++ b/packages/remix/lib/src/components/slider/fortal_slider_styles.dart @@ -22,7 +22,6 @@ enum FortalSliderVariant { } /// Fortal-themed preset for [RemixSlider]. -@MixWidget(name: 'FortalSlider') RemixSliderStyler fortalSliderStyler({ FortalSliderVariant variant = .surface, FortalSliderSize size = .size2, @@ -96,3 +95,101 @@ RemixSliderStyler _fortalSliderSizeStyler(FortalSliderSize size) { ), }; } + +/// Fortal-themed preset for [RemixSlider]. +class FortalSlider extends StatelessWidget { + const FortalSlider({ + super.key, + this.variant = .surface, + this.size = .size2, + required this.value, + this.onChanged, + this.onChangeStart, + this.onChangeEnd, + this.min = 0.0, + this.max = 1.0, + this.enabled = true, + this.enableFeedback = true, + this.focusNode, + this.autofocus = false, + this.snapDivisions, + }); + + /// Neutral track with the active accent indicator. + const FortalSlider.surface({ + super.key, + this.size = .size2, + required this.value, + this.onChanged, + this.onChangeStart, + this.onChangeEnd, + this.min = 0.0, + this.max = 1.0, + this.enabled = true, + this.enableFeedback = true, + this.focusNode, + this.autofocus = false, + this.snapDivisions, + }) : variant = FortalSliderVariant.surface; + + /// Softer accent treatment for lower-emphasis controls. + const FortalSlider.soft({ + super.key, + this.size = .size2, + required this.value, + this.onChanged, + this.onChangeStart, + this.onChangeEnd, + this.min = 0.0, + this.max = 1.0, + this.enabled = true, + this.enableFeedback = true, + this.focusNode, + this.autofocus = false, + this.snapDivisions, + }) : variant = FortalSliderVariant.soft; + + final FortalSliderVariant variant; + + final FortalSliderSize size; + + final double value; + + final ValueChanged? onChanged; + + final ValueChanged? onChangeStart; + + final ValueChanged? onChangeEnd; + + final double min; + + final double max; + + final bool enabled; + + final bool enableFeedback; + + final FocusNode? focusNode; + + final bool autofocus; + + final int? snapDivisions; + + @override + Widget build(BuildContext context) { + return fortalSliderStyler(variant: this.variant, size: this.size).call( + key: this.key, + value: this.value, + onChanged: this.onChanged, + onChangeStart: this.onChangeStart, + onChangeEnd: this.onChangeEnd, + min: this.min, + max: this.max, + enabled: this.enabled, + enableFeedback: this.enableFeedback, + focusNode: this.focusNode, + autofocus: this.autofocus, + snapDivisions: this.snapDivisions, + ); + } +} diff --git a/packages/remix/lib/src/components/slider/slider.g.dart b/packages/remix/lib/src/components/slider/slider.g.dart index ae6f2717..5ed4d404 100644 --- a/packages/remix/lib/src/components/slider/slider.g.dart +++ b/packages/remix/lib/src/components/slider/slider.g.dart @@ -107,117 +107,533 @@ mixin _$RemixSliderSpec implements Spec, Diagnosticable { typedef _$RemixSliderSpecMethods = _$RemixSliderSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixSlider]. -class FortalSlider extends StatelessWidget { - const FortalSlider({ - super.key, - this.variant = .surface, - this.size = .size2, - required this.value, - this.onChanged, - this.onChangeStart, - this.onChangeEnd, - this.min = 0.0, - this.max = 1.0, - this.enabled = true, - this.enableFeedback = true, - this.focusNode, - this.autofocus = false, - this.snapDivisions, - }); - - /// Neutral track with the active accent indicator. - const FortalSlider.surface({ - super.key, - this.size = .size2, - required this.value, - this.onChanged, - this.onChangeStart, - this.onChangeEnd, - this.min = 0.0, - this.max = 1.0, - this.enabled = true, - this.enableFeedback = true, - this.focusNode, - this.autofocus = false, - this.snapDivisions, - }) : variant = FortalSliderVariant.surface; - - /// Softer accent treatment for lower-emphasis controls. - const FortalSlider.soft({ - super.key, - this.size = .size2, - required this.value, - this.onChanged, - this.onChangeStart, - this.onChangeEnd, - this.min = 0.0, - this.max = 1.0, - this.enabled = true, - this.enableFeedback = true, - this.focusNode, - this.autofocus = false, - this.snapDivisions, - }) : variant = FortalSliderVariant.soft; - - final FortalSliderVariant variant; - - final FortalSliderSize size; - - final double value; - - final ValueChanged? onChanged; - - final ValueChanged? onChangeStart; - - final ValueChanged? onChangeEnd; - - final double min; - - final double max; - - final bool enabled; - - final bool enableFeedback; - - final FocusNode? focusNode; - - final bool autofocus; - - final int? snapDivisions; +class RemixSliderStyler extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $thumb; + final Prop? $trackColor; + final Prop? $trackWidth; + final Prop? $rangeColor; + final Prop? $rangeWidth; + + const RemixSliderStyler.create({ + Prop>? thumb, + Prop? trackColor, + Prop? trackWidth, + Prop? rangeColor, + Prop? rangeWidth, + super.variants, + super.modifier, + super.animation, + }) : $thumb = thumb, + $trackColor = trackColor, + $trackWidth = trackWidth, + $rangeColor = rangeColor, + $rangeWidth = rangeWidth; + + RemixSliderStyler({ + BoxStyler? thumb, + Color? trackColor, + double? trackWidth, + Color? rangeColor, + double? rangeWidth, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + thumb: Prop.maybeMix(thumb), + trackColor: Prop.maybe(trackColor), + trackWidth: Prop.maybe(trackWidth), + rangeColor: Prop.maybe(rangeColor), + rangeWidth: Prop.maybe(rangeWidth), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixSliderStyler.thumb(BoxStyler value) => + RemixSliderStyler().thumb(value); + factory RemixSliderStyler.trackColor(Color value) => + RemixSliderStyler().trackColor(value); + factory RemixSliderStyler.trackWidth(double value) => + RemixSliderStyler().trackWidth(value); + factory RemixSliderStyler.rangeColor(Color value) => + RemixSliderStyler().rangeColor(value); + factory RemixSliderStyler.rangeWidth(double value) => + RemixSliderStyler().rangeWidth(value); + factory RemixSliderStyler.alignment(AlignmentGeometry value) => + RemixSliderStyler().alignment(value); + factory RemixSliderStyler.padding(EdgeInsetsGeometryMix value) => + RemixSliderStyler().padding(value); + factory RemixSliderStyler.margin(EdgeInsetsGeometryMix value) => + RemixSliderStyler().margin(value); + factory RemixSliderStyler.constraints(BoxConstraintsMix value) => + RemixSliderStyler().constraints(value); + factory RemixSliderStyler.decoration(DecorationMix value) => + RemixSliderStyler().decoration(value); + factory RemixSliderStyler.foregroundDecoration(DecorationMix value) => + RemixSliderStyler().foregroundDecoration(value); + factory RemixSliderStyler.clipBehavior(Clip value) => + RemixSliderStyler().clipBehavior(value); + factory RemixSliderStyler.color(Color value) => + RemixSliderStyler().color(value); + factory RemixSliderStyler.gradient(GradientMix value) => + RemixSliderStyler().gradient(value); + factory RemixSliderStyler.border(BoxBorderMix value) => + RemixSliderStyler().border(value); + factory RemixSliderStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixSliderStyler().borderRadius(value); + factory RemixSliderStyler.elevation(ElevationShadow value) => + RemixSliderStyler().elevation(value); + factory RemixSliderStyler.shadow(BoxShadowMix value) => + RemixSliderStyler().shadow(value); + factory RemixSliderStyler.shadows(List value) => + RemixSliderStyler().shadows(value); + factory RemixSliderStyler.width(double value) => + RemixSliderStyler().width(value); + factory RemixSliderStyler.height(double value) => + RemixSliderStyler().height(value); + factory RemixSliderStyler.size(double width, double height) => + RemixSliderStyler().size(width, height); + factory RemixSliderStyler.minWidth(double value) => + RemixSliderStyler().minWidth(value); + factory RemixSliderStyler.maxWidth(double value) => + RemixSliderStyler().maxWidth(value); + factory RemixSliderStyler.minHeight(double value) => + RemixSliderStyler().minHeight(value); + factory RemixSliderStyler.maxHeight(double value) => + RemixSliderStyler().maxHeight(value); + factory RemixSliderStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixSliderStyler().scale(scale, alignment: alignment); + factory RemixSliderStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixSliderStyler().rotate(radians, alignment: alignment); + factory RemixSliderStyler.translate(double x, double y, [double z = 0.0]) => + RemixSliderStyler().translate(x, y, z); + factory RemixSliderStyler.skew(double skewX, double skewY) => + RemixSliderStyler().skew(skewX, skewY); + factory RemixSliderStyler.textStyle(TextStyler value) => + RemixSliderStyler().textStyle(value); + factory RemixSliderStyler.image(DecorationImageMix value) => + RemixSliderStyler().image(value); + factory RemixSliderStyler.shape(ShapeBorderMix value) => + RemixSliderStyler().shape(value); + factory RemixSliderStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSliderStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSliderStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSliderStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSliderStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSliderStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSliderStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixSliderStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixSliderStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixSliderStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixSliderStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixSliderStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixSliderStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixSliderStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixSliderStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixSliderStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixSliderStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixSliderStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixSliderStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixSliderStyler().transform(value, alignment: alignment); + + RemixSliderStyler alignment(AlignmentGeometry value) { + return thumb(BoxStyler().alignment(value)); + } - @override - Widget build(BuildContext context) { - return fortalSliderStyler(variant: this.variant, size: this.size).call( - key: this.key, - value: this.value, - onChanged: this.onChanged, - onChangeStart: this.onChangeStart, - onChangeEnd: this.onChangeEnd, - min: this.min, - max: this.max, - enabled: this.enabled, - enableFeedback: this.enableFeedback, - focusNode: this.focusNode, - autofocus: this.autofocus, - snapDivisions: this.snapDivisions, + RemixSliderStyler padding(EdgeInsetsGeometryMix value) { + return thumb(BoxStyler().padding(value)); + } + + RemixSliderStyler margin(EdgeInsetsGeometryMix value) { + return thumb(BoxStyler().margin(value)); + } + + RemixSliderStyler constraints(BoxConstraintsMix value) { + return thumb(BoxStyler().constraints(value)); + } + + RemixSliderStyler decoration(DecorationMix value) { + return thumb(BoxStyler().decoration(value)); + } + + RemixSliderStyler foregroundDecoration(DecorationMix value) { + return thumb(BoxStyler().foregroundDecoration(value)); + } + + RemixSliderStyler clipBehavior(Clip value) { + return thumb(BoxStyler().clipBehavior(value)); + } + + RemixSliderStyler color(Color value) { + return thumb(BoxStyler().color(value)); + } + + RemixSliderStyler gradient(GradientMix value) { + return thumb(BoxStyler().gradient(value)); + } + + RemixSliderStyler border(BoxBorderMix value) { + return thumb(BoxStyler().border(value)); + } + + RemixSliderStyler borderRadius(BorderRadiusGeometryMix value) { + return thumb(BoxStyler().borderRadius(value)); + } + + RemixSliderStyler elevation(ElevationShadow value) { + return thumb(BoxStyler().elevation(value)); + } + + RemixSliderStyler shadow(BoxShadowMix value) { + return thumb(BoxStyler().shadow(value)); + } + + RemixSliderStyler shadows(List value) { + return thumb(BoxStyler().shadows(value)); + } + + RemixSliderStyler width(double value) { + return thumb(BoxStyler().width(value)); + } + + RemixSliderStyler height(double value) { + return thumb(BoxStyler().height(value)); + } + + RemixSliderStyler size(double width, double height) { + return thumb(BoxStyler().size(width, height)); + } + + RemixSliderStyler minWidth(double value) { + return thumb(BoxStyler().minWidth(value)); + } + + RemixSliderStyler maxWidth(double value) { + return thumb(BoxStyler().maxWidth(value)); + } + + RemixSliderStyler minHeight(double value) { + return thumb(BoxStyler().minHeight(value)); + } + + RemixSliderStyler maxHeight(double value) { + return thumb(BoxStyler().maxHeight(value)); + } + + RemixSliderStyler scale(double scale, {Alignment alignment = .center}) { + return thumb(BoxStyler().scale(scale, alignment: alignment)); + } + + RemixSliderStyler rotate(double radians, {Alignment alignment = .center}) { + return thumb(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixSliderStyler translate(double x, double y, [double z = 0.0]) { + return thumb(BoxStyler().translate(x, y, z)); + } + + RemixSliderStyler skew(double skewX, double skewY) { + return thumb(BoxStyler().skew(skewX, skewY)); + } + + RemixSliderStyler textStyle(TextStyler value) { + return thumb(BoxStyler().textStyle(value)); + } + + RemixSliderStyler image(DecorationImageMix value) { + return thumb(BoxStyler().image(value)); + } + + RemixSliderStyler shape(ShapeBorderMix value) { + return thumb(BoxStyler().shape(value)); + } + + RemixSliderStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return thumb( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixSliderStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return thumb( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixSliderStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return thumb( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } -mixin _$RemixSliderStylerMixin on Style, Diagnosticable { - Prop>? get $thumb; - Prop? get $trackColor; - Prop? get $trackWidth; - Prop? get $rangeColor; - Prop? get $rangeWidth; + RemixSliderStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return thumb( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixSliderStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return thumb( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixSliderStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return thumb( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixSliderStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return thumb( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixSliderStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return thumb( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixSliderStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return thumb( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixSliderStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return thumb(BoxStyler().transform(value, alignment: alignment)); + } /// Sets the thumb. RemixSliderStyler thumb(BoxStyler value) { @@ -245,16 +661,19 @@ mixin _$RemixSliderStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixSliderStyler animate(AnimationConfig value) { return merge(RemixSliderStyler(animation: value)); } /// Sets the style variants. + @override RemixSliderStyler variants(List> value) { return merge(RemixSliderStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixSliderStyler wrap(WidgetModifierConfig value) { return merge(RemixSliderStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/slider/slider_spec.dart b/packages/remix/lib/src/components/slider/slider_spec.dart index 40cfa983..4eab825b 100644 --- a/packages/remix/lib/src/components/slider/slider_spec.dart +++ b/packages/remix/lib/src/components/slider/slider_spec.dart @@ -10,7 +10,7 @@ const Color _defaultRangeColor = MixColors.black; /// /// A slider spec contains the thumb box style plus the track and range colors /// and stroke widths used when painting the control. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixSliderSpec with _$RemixSliderSpec { /// Default thumb size used when the thumb style does not resolve a size. static const Size defaultThumbSize = _remixSliderDefaultThumbSize; @@ -21,6 +21,7 @@ class RemixSliderSpec with _$RemixSliderSpec { /// Resolved style for the slider thumb. @override + @MixableField(forwardStyler: true) final StyleSpec thumb; /// Color of the unfilled slider track. diff --git a/packages/remix/lib/src/components/slider/slider_style.dart b/packages/remix/lib/src/components/slider/slider_style.dart index f62fd478..83100997 100644 --- a/packages/remix/lib/src/components/slider/slider_style.dart +++ b/packages/remix/lib/src/components/slider/slider_style.dart @@ -5,54 +5,7 @@ part of 'slider.dart'; /// Use this class to customize the thumb, track, and filled range. It supports /// Mix variants and widget state variants such as disabled, hovered, focused, /// and pressed states. -@MixableStyler() -class RemixSliderStyler - extends RemixContainerStyler - with Diagnosticable, _$RemixSliderStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $thumb; - final Prop? $trackColor; - final Prop? $trackWidth; - final Prop? $rangeColor; - final Prop? $rangeWidth; - - /// Creates a slider style from raw Mix properties. - const RemixSliderStyler.create({ - Prop>? thumb, - Prop? trackColor, - Prop? trackWidth, - Prop? rangeColor, - Prop? rangeWidth, - super.variants, - super.animation, - super.modifier, - }) : $thumb = thumb, - $trackColor = trackColor, - $trackWidth = trackWidth, - $rangeColor = rangeColor, - $rangeWidth = rangeWidth; - - /// Creates a slider style from plain Dart values and Mix stylers. - RemixSliderStyler({ - BoxStyler? thumb, - Color? trackColor, - double? trackWidth, - Color? rangeColor, - double? rangeWidth, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - thumb: Prop.maybeMix(thumb), - trackColor: trackColor != null ? Prop.value(trackColor) : null, - trackWidth: trackWidth != null ? Prop.value(trackWidth) : null, - rangeColor: rangeColor != null ? Prop.value(rangeColor) : null, - rangeWidth: rangeWidth != null ? Prop.value(rangeWidth) : null, - variants: variants, - animation: animation, - modifier: modifier, - ); - +extension RemixSliderStylerRemixHelpers on RemixSliderStyler { /// Sets thumb color RemixSliderStyler thumbColor(Color value) { return merge( @@ -62,21 +15,6 @@ class RemixSliderStyler ); } - /// Sets track color (background rail) - RemixSliderStyler trackColor(Color value) { - return merge(RemixSliderStyler(trackColor: value)); - } - - /// Sets range color (filled progress portion) - RemixSliderStyler rangeColor(Color value) { - return merge(RemixSliderStyler(rangeColor: value)); - } - - /// Sets thumb styling - RemixSliderStyler thumb(BoxStyler value) { - return merge(RemixSliderStyler(thumb: value)); - } - /// Sets thumb to a fixed [size]. RemixSliderStyler thumbSize(Size size) { return merge( @@ -86,11 +24,6 @@ class RemixSliderStyler ); } - /// Sets thumb alignment - RemixSliderStyler alignment(Alignment value) { - return merge(RemixSliderStyler(thumb: BoxStyler(alignment: value))); - } - /// Sets stroke width for both track and range. RemixSliderStyler thickness(double value) { return merge(RemixSliderStyler(trackWidth: value, rangeWidth: value)); @@ -150,78 +83,4 @@ class RemixSliderStyler style: this, ); } - - // RemixContainerStyler mixin implementations - @override - RemixSliderStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixSliderStyler(thumb: BoxStyler(padding: value))); - } - - @override - RemixSliderStyler color(Color value) { - return merge( - RemixSliderStyler( - thumb: BoxStyler(decoration: BoxDecorationMix(color: value)), - ), - ); - } - - @override - RemixSliderStyler size(double width, double height) { - return merge( - RemixSliderStyler( - thumb: BoxStyler( - constraints: BoxConstraintsMix( - minWidth: width, - maxWidth: width, - minHeight: height, - maxHeight: height, - ), - ), - ), - ); - } - - @override - RemixSliderStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixSliderStyler( - thumb: BoxStyler(decoration: BoxDecorationMix(borderRadius: radius)), - ), - ); - } - - @override - RemixSliderStyler constraints(BoxConstraintsMix value) { - return merge(RemixSliderStyler(thumb: BoxStyler(constraints: value))); - } - - @override - RemixSliderStyler decoration(DecorationMix value) { - return merge(RemixSliderStyler(thumb: BoxStyler(decoration: value))); - } - - @override - RemixSliderStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixSliderStyler(thumb: BoxStyler(margin: value))); - } - - @override - RemixSliderStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixSliderStyler(thumb: BoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixSliderStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixSliderStyler( - thumb: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } } diff --git a/packages/remix/lib/src/components/spinner/fortal_spinner_styles.dart b/packages/remix/lib/src/components/spinner/fortal_spinner_styles.dart index 88081ad4..d4f46191 100644 --- a/packages/remix/lib/src/components/spinner/fortal_spinner_styles.dart +++ b/packages/remix/lib/src/components/spinner/fortal_spinner_styles.dart @@ -4,7 +4,6 @@ part of 'spinner.dart'; enum FortalSpinnerSize { size1, size2, size3 } /// Fortal-themed preset for [RemixSpinner]. -@MixWidget(name: 'FortalSpinner') RemixSpinnerStyler fortalSpinnerStyler({FortalSpinnerSize size = .size2}) { return RemixSpinnerStyler( indicatorColor: FortalTokens.accent9(), @@ -19,3 +18,15 @@ RemixSpinnerStyler _fortalSpinnerSizeStyler(FortalSpinnerSize size) { .size3 => RemixSpinnerStyler(size: 24.0, strokeWidth: 2.5), }; } + +/// Fortal-themed preset for [RemixSpinner]. +class FortalSpinner extends StatelessWidget { + const FortalSpinner({super.key, this.size = .size2}); + + final FortalSpinnerSize size; + + @override + Widget build(BuildContext context) { + return fortalSpinnerStyler(size: this.size).call(key: this.key); + } +} diff --git a/packages/remix/lib/src/components/spinner/spinner.g.dart b/packages/remix/lib/src/components/spinner/spinner.g.dart index 1ac2059e..d62a549c 100644 --- a/packages/remix/lib/src/components/spinner/spinner.g.dart +++ b/packages/remix/lib/src/components/spinner/spinner.g.dart @@ -117,32 +117,69 @@ mixin _$RemixSpinnerSpec implements Spec, Diagnosticable { typedef _$RemixSpinnerSpecMethods = _$RemixSpinnerSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixSpinner]. -class FortalSpinner extends StatelessWidget { - const FortalSpinner({super.key, this.size = .size2}); - - final FortalSpinnerSize size; - - @override - Widget build(BuildContext context) { - return fortalSpinnerStyler(size: this.size).call(key: this.key); - } -} - -// ************************************************************************** -// StylerGenerator -// ************************************************************************** - -mixin _$RemixSpinnerStylerMixin on Style, Diagnosticable { - Prop? get $size; - Prop? get $strokeWidth; - Prop? get $indicatorColor; - Prop? get $trackColor; - Prop? get $trackStrokeWidth; - Prop? get $duration; +class RemixSpinnerStyler + extends MixStyler { + final Prop? $size; + final Prop? $strokeWidth; + final Prop? $indicatorColor; + final Prop? $trackColor; + final Prop? $trackStrokeWidth; + final Prop? $duration; + + const RemixSpinnerStyler.create({ + Prop? size, + Prop? strokeWidth, + Prop? indicatorColor, + Prop? trackColor, + Prop? trackStrokeWidth, + Prop? duration, + super.variants, + super.modifier, + super.animation, + }) : $size = size, + $strokeWidth = strokeWidth, + $indicatorColor = indicatorColor, + $trackColor = trackColor, + $trackStrokeWidth = trackStrokeWidth, + $duration = duration; + + RemixSpinnerStyler({ + double? size, + double? strokeWidth, + Color? indicatorColor, + Color? trackColor, + double? trackStrokeWidth, + Duration? duration, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + size: Prop.maybe(size), + strokeWidth: Prop.maybe(strokeWidth), + indicatorColor: Prop.maybe(indicatorColor), + trackColor: Prop.maybe(trackColor), + trackStrokeWidth: Prop.maybe(trackStrokeWidth), + duration: Prop.maybe(duration), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixSpinnerStyler.size(double value) => + RemixSpinnerStyler().size(value); + factory RemixSpinnerStyler.strokeWidth(double value) => + RemixSpinnerStyler().strokeWidth(value); + factory RemixSpinnerStyler.indicatorColor(Color value) => + RemixSpinnerStyler().indicatorColor(value); + factory RemixSpinnerStyler.trackColor(Color value) => + RemixSpinnerStyler().trackColor(value); + factory RemixSpinnerStyler.trackStrokeWidth(double value) => + RemixSpinnerStyler().trackStrokeWidth(value); + factory RemixSpinnerStyler.duration(Duration value) => + RemixSpinnerStyler().duration(value); /// Sets the size. RemixSpinnerStyler size(double value) { @@ -175,16 +212,19 @@ mixin _$RemixSpinnerStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixSpinnerStyler animate(AnimationConfig value) { return merge(RemixSpinnerStyler(animation: value)); } /// Sets the style variants. + @override RemixSpinnerStyler variants(List> value) { return merge(RemixSpinnerStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixSpinnerStyler wrap(WidgetModifierConfig value) { return merge(RemixSpinnerStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/spinner/spinner_style.dart b/packages/remix/lib/src/components/spinner/spinner_style.dart index cf990a70..e04c3cbe 100644 --- a/packages/remix/lib/src/components/spinner/spinner_style.dart +++ b/packages/remix/lib/src/components/spinner/spinner_style.dart @@ -4,80 +4,7 @@ part of 'spinner.dart'; /// /// Use this class to customize spinner size, stroke widths, colors, duration, /// and Mix variants. -@MixableStyler() -class RemixSpinnerStyler - extends RemixStyler - with Diagnosticable, _$RemixSpinnerStylerMixin { - @MixableField() - final Prop? $size; - @MixableField() - final Prop? $strokeWidth; - @MixableField() - final Prop? $indicatorColor; - @MixableField() - final Prop? $trackColor; - @MixableField() - final Prop? $trackStrokeWidth; - @MixableField() - final Prop? $duration; - - const RemixSpinnerStyler.create({ - Prop? size, - Prop? strokeWidth, - Prop? indicatorColor, - Prop? trackColor, - Prop? trackStrokeWidth, - Prop? duration, - super.variants, - super.animation, - super.modifier, - }) : $size = size, - $strokeWidth = strokeWidth, - $indicatorColor = indicatorColor, - $trackColor = trackColor, - $trackStrokeWidth = trackStrokeWidth, - $duration = duration; - - RemixSpinnerStyler({ - double? size, - double? strokeWidth, - Color? indicatorColor, - Color? trackColor, - double? trackStrokeWidth, - Duration? duration, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - size: Prop.maybe(size), - strokeWidth: Prop.maybe(strokeWidth), - indicatorColor: Prop.maybe(indicatorColor), - trackColor: Prop.maybe(trackColor), - trackStrokeWidth: Prop.maybe(trackStrokeWidth), - duration: Prop.maybe(duration), - variants: variants, - animation: animation, - modifier: modifier, - ); - - factory RemixSpinnerStyler.duration(Duration value) => - RemixSpinnerStyler().duration(value); - - factory RemixSpinnerStyler.indicatorColor(Color value) => - RemixSpinnerStyler().indicatorColor(value); - - factory RemixSpinnerStyler.size(double value) => - RemixSpinnerStyler().size(value); - - factory RemixSpinnerStyler.strokeWidth(double value) => - RemixSpinnerStyler().strokeWidth(value); - - factory RemixSpinnerStyler.trackColor(Color value) => - RemixSpinnerStyler().trackColor(value); - - factory RemixSpinnerStyler.trackStrokeWidth(double value) => - RemixSpinnerStyler().trackStrokeWidth(value); - +extension RemixSpinnerStylerRemixHelpers on RemixSpinnerStyler { RemixSpinner call({Key? key}) { return RemixSpinner(key: key, style: this); } diff --git a/packages/remix/lib/src/components/switch/fortal_switch_styles.dart b/packages/remix/lib/src/components/switch/fortal_switch_styles.dart index 873e6ac3..218e52a2 100644 --- a/packages/remix/lib/src/components/switch/fortal_switch_styles.dart +++ b/packages/remix/lib/src/components/switch/fortal_switch_styles.dart @@ -22,7 +22,6 @@ enum FortalSwitchVariant { } /// Fortal-themed preset for [RemixSwitch]. -@MixWidget(name: 'FortalSwitch') RemixSwitchStyler fortalSwitchStyler({ FortalSwitchVariant variant = .surface, FortalSwitchSize size = .size2, @@ -114,3 +113,83 @@ RemixSwitchStyler _fortalSwitchSizeStyler(FortalSwitchSize size) { ), }; } + +/// Fortal-themed preset for [RemixSwitch]. +class FortalSwitch extends StatelessWidget { + const FortalSwitch({ + super.key, + this.variant = .surface, + this.size = .size2, + required this.selected, + this.onChanged, + this.enabled = true, + this.enableFeedback = true, + this.focusNode, + this.autofocus = false, + this.semanticLabel, + this.mouseCursor = SystemMouseCursors.click, + }); + + /// Surface treatment with a visible border. + const FortalSwitch.surface({ + super.key, + this.size = .size2, + required this.selected, + this.onChanged, + this.enabled = true, + this.enableFeedback = true, + this.focusNode, + this.autofocus = false, + this.semanticLabel, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalSwitchVariant.surface; + + /// Softer accent treatment. + const FortalSwitch.soft({ + super.key, + this.size = .size2, + required this.selected, + this.onChanged, + this.enabled = true, + this.enableFeedback = true, + this.focusNode, + this.autofocus = false, + this.semanticLabel, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalSwitchVariant.soft; + + final FortalSwitchVariant variant; + + final FortalSwitchSize size; + + final bool selected; + + final ValueChanged? onChanged; + + final bool enabled; + + final bool enableFeedback; + + final FocusNode? focusNode; + + final bool autofocus; + + final String? semanticLabel; + + final MouseCursor mouseCursor; + + @override + Widget build(BuildContext context) { + return fortalSwitchStyler(variant: this.variant, size: this.size).call( + key: this.key, + selected: this.selected, + onChanged: this.onChanged, + enabled: this.enabled, + enableFeedback: this.enableFeedback, + focusNode: this.focusNode, + autofocus: this.autofocus, + semanticLabel: this.semanticLabel, + mouseCursor: this.mouseCursor, + ); + } +} diff --git a/packages/remix/lib/src/components/switch/switch.g.dart b/packages/remix/lib/src/components/switch/switch.g.dart index f5ad4c09..22b60941 100644 --- a/packages/remix/lib/src/components/switch/switch.g.dart +++ b/packages/remix/lib/src/components/switch/switch.g.dart @@ -86,96 +86,512 @@ mixin _$RemixSwitchSpec implements Spec, Diagnosticable { typedef _$RemixSwitchSpecMethods = _$RemixSwitchSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixSwitch]. -class FortalSwitch extends StatelessWidget { - const FortalSwitch({ - super.key, - this.variant = .surface, - this.size = .size2, - required this.selected, - this.onChanged, - this.enabled = true, - this.enableFeedback = true, - this.focusNode, - this.autofocus = false, - this.semanticLabel, - this.mouseCursor = SystemMouseCursors.click, - }); - - /// Surface treatment with a visible border. - const FortalSwitch.surface({ - super.key, - this.size = .size2, - required this.selected, - this.onChanged, - this.enabled = true, - this.enableFeedback = true, - this.focusNode, - this.autofocus = false, - this.semanticLabel, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalSwitchVariant.surface; - - /// Softer accent treatment. - const FortalSwitch.soft({ - super.key, - this.size = .size2, - required this.selected, - this.onChanged, - this.enabled = true, - this.enableFeedback = true, - this.focusNode, - this.autofocus = false, - this.semanticLabel, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalSwitchVariant.soft; - - final FortalSwitchVariant variant; - - final FortalSwitchSize size; - - final bool selected; - - final ValueChanged? onChanged; - - final bool enabled; - - final bool enableFeedback; - - final FocusNode? focusNode; - - final bool autofocus; - - final String? semanticLabel; - - final MouseCursor mouseCursor; - - @override - Widget build(BuildContext context) { - return fortalSwitchStyler(variant: this.variant, size: this.size).call( - key: this.key, - selected: this.selected, - onChanged: this.onChanged, - enabled: this.enabled, - enableFeedback: this.enableFeedback, - focusNode: this.focusNode, - autofocus: this.autofocus, - semanticLabel: this.semanticLabel, - mouseCursor: this.mouseCursor, +class RemixSwitchStyler extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $container; + final Prop>? $thumb; + + const RemixSwitchStyler.create({ + Prop>? container, + Prop>? thumb, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $thumb = thumb; + + RemixSwitchStyler({ + BoxStyler? container, + BoxStyler? thumb, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + thumb: Prop.maybeMix(thumb), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixSwitchStyler.container(BoxStyler value) => + RemixSwitchStyler().container(value); + factory RemixSwitchStyler.thumb(BoxStyler value) => + RemixSwitchStyler().thumb(value); + factory RemixSwitchStyler.alignment(AlignmentGeometry value) => + RemixSwitchStyler().alignment(value); + factory RemixSwitchStyler.padding(EdgeInsetsGeometryMix value) => + RemixSwitchStyler().padding(value); + factory RemixSwitchStyler.margin(EdgeInsetsGeometryMix value) => + RemixSwitchStyler().margin(value); + factory RemixSwitchStyler.constraints(BoxConstraintsMix value) => + RemixSwitchStyler().constraints(value); + factory RemixSwitchStyler.decoration(DecorationMix value) => + RemixSwitchStyler().decoration(value); + factory RemixSwitchStyler.foregroundDecoration(DecorationMix value) => + RemixSwitchStyler().foregroundDecoration(value); + factory RemixSwitchStyler.clipBehavior(Clip value) => + RemixSwitchStyler().clipBehavior(value); + factory RemixSwitchStyler.color(Color value) => + RemixSwitchStyler().color(value); + factory RemixSwitchStyler.gradient(GradientMix value) => + RemixSwitchStyler().gradient(value); + factory RemixSwitchStyler.border(BoxBorderMix value) => + RemixSwitchStyler().border(value); + factory RemixSwitchStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixSwitchStyler().borderRadius(value); + factory RemixSwitchStyler.elevation(ElevationShadow value) => + RemixSwitchStyler().elevation(value); + factory RemixSwitchStyler.shadow(BoxShadowMix value) => + RemixSwitchStyler().shadow(value); + factory RemixSwitchStyler.shadows(List value) => + RemixSwitchStyler().shadows(value); + factory RemixSwitchStyler.width(double value) => + RemixSwitchStyler().width(value); + factory RemixSwitchStyler.height(double value) => + RemixSwitchStyler().height(value); + factory RemixSwitchStyler.size(double width, double height) => + RemixSwitchStyler().size(width, height); + factory RemixSwitchStyler.minWidth(double value) => + RemixSwitchStyler().minWidth(value); + factory RemixSwitchStyler.maxWidth(double value) => + RemixSwitchStyler().maxWidth(value); + factory RemixSwitchStyler.minHeight(double value) => + RemixSwitchStyler().minHeight(value); + factory RemixSwitchStyler.maxHeight(double value) => + RemixSwitchStyler().maxHeight(value); + factory RemixSwitchStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixSwitchStyler().scale(scale, alignment: alignment); + factory RemixSwitchStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixSwitchStyler().rotate(radians, alignment: alignment); + factory RemixSwitchStyler.translate(double x, double y, [double z = 0.0]) => + RemixSwitchStyler().translate(x, y, z); + factory RemixSwitchStyler.skew(double skewX, double skewY) => + RemixSwitchStyler().skew(skewX, skewY); + factory RemixSwitchStyler.textStyle(TextStyler value) => + RemixSwitchStyler().textStyle(value); + factory RemixSwitchStyler.image(DecorationImageMix value) => + RemixSwitchStyler().image(value); + factory RemixSwitchStyler.shape(ShapeBorderMix value) => + RemixSwitchStyler().shape(value); + factory RemixSwitchStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSwitchStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSwitchStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSwitchStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSwitchStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixSwitchStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixSwitchStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixSwitchStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixSwitchStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixSwitchStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixSwitchStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixSwitchStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixSwitchStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixSwitchStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixSwitchStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixSwitchStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixSwitchStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixSwitchStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixSwitchStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixSwitchStyler().transform(value, alignment: alignment); + + RemixSwitchStyler alignment(AlignmentGeometry value) { + return container(BoxStyler().alignment(value)); + } + + RemixSwitchStyler padding(EdgeInsetsGeometryMix value) { + return container(BoxStyler().padding(value)); + } + + RemixSwitchStyler margin(EdgeInsetsGeometryMix value) { + return container(BoxStyler().margin(value)); + } + + RemixSwitchStyler constraints(BoxConstraintsMix value) { + return container(BoxStyler().constraints(value)); + } + + RemixSwitchStyler decoration(DecorationMix value) { + return container(BoxStyler().decoration(value)); + } + + RemixSwitchStyler foregroundDecoration(DecorationMix value) { + return container(BoxStyler().foregroundDecoration(value)); + } + + RemixSwitchStyler clipBehavior(Clip value) { + return container(BoxStyler().clipBehavior(value)); + } + + RemixSwitchStyler color(Color value) { + return container(BoxStyler().color(value)); + } + + RemixSwitchStyler gradient(GradientMix value) { + return container(BoxStyler().gradient(value)); + } + + RemixSwitchStyler border(BoxBorderMix value) { + return container(BoxStyler().border(value)); + } + + RemixSwitchStyler borderRadius(BorderRadiusGeometryMix value) { + return container(BoxStyler().borderRadius(value)); + } + + RemixSwitchStyler elevation(ElevationShadow value) { + return container(BoxStyler().elevation(value)); + } + + RemixSwitchStyler shadow(BoxShadowMix value) { + return container(BoxStyler().shadow(value)); + } + + RemixSwitchStyler shadows(List value) { + return container(BoxStyler().shadows(value)); + } + + RemixSwitchStyler width(double value) { + return container(BoxStyler().width(value)); + } + + RemixSwitchStyler height(double value) { + return container(BoxStyler().height(value)); + } + + RemixSwitchStyler size(double width, double height) { + return container(BoxStyler().size(width, height)); + } + + RemixSwitchStyler minWidth(double value) { + return container(BoxStyler().minWidth(value)); + } + + RemixSwitchStyler maxWidth(double value) { + return container(BoxStyler().maxWidth(value)); + } + + RemixSwitchStyler minHeight(double value) { + return container(BoxStyler().minHeight(value)); + } + + RemixSwitchStyler maxHeight(double value) { + return container(BoxStyler().maxHeight(value)); + } + + RemixSwitchStyler scale(double scale, {Alignment alignment = .center}) { + return container(BoxStyler().scale(scale, alignment: alignment)); + } + + RemixSwitchStyler rotate(double radians, {Alignment alignment = .center}) { + return container(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixSwitchStyler translate(double x, double y, [double z = 0.0]) { + return container(BoxStyler().translate(x, y, z)); + } + + RemixSwitchStyler skew(double skewX, double skewY) { + return container(BoxStyler().skew(skewX, skewY)); + } + + RemixSwitchStyler textStyle(TextStyler value) { + return container(BoxStyler().textStyle(value)); + } + + RemixSwitchStyler image(DecorationImageMix value) { + return container(BoxStyler().image(value)); + } + + RemixSwitchStyler shape(ShapeBorderMix value) { + return container(BoxStyler().shape(value)); + } + + RemixSwitchStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixSwitchStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixSwitchStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } -mixin _$RemixSwitchStylerMixin on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $thumb; + RemixSwitchStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixSwitchStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixSwitchStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixSwitchStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixSwitchStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixSwitchStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixSwitchStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(BoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixSwitchStyler container(BoxStyler value) { @@ -188,16 +604,19 @@ mixin _$RemixSwitchStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixSwitchStyler animate(AnimationConfig value) { return merge(RemixSwitchStyler(animation: value)); } /// Sets the style variants. + @override RemixSwitchStyler variants(List> value) { return merge(RemixSwitchStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixSwitchStyler wrap(WidgetModifierConfig value) { return merge(RemixSwitchStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/switch/switch_spec.dart b/packages/remix/lib/src/components/switch/switch_spec.dart index 3145ba97..536abfa2 100644 --- a/packages/remix/lib/src/components/switch/switch_spec.dart +++ b/packages/remix/lib/src/components/switch/switch_spec.dart @@ -1,9 +1,10 @@ part of 'switch.dart'; /// Resolved visual values for a [RemixSwitch]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixSwitchSpec with _$RemixSwitchSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; @override final StyleSpec thumb; diff --git a/packages/remix/lib/src/components/switch/switch_style.dart b/packages/remix/lib/src/components/switch/switch_style.dart index 9a8f3228..ca372baa 100644 --- a/packages/remix/lib/src/components/switch/switch_style.dart +++ b/packages/remix/lib/src/components/switch/switch_style.dart @@ -4,41 +4,7 @@ part of 'switch.dart'; /// /// Use this class to style the switch track and thumb, including selected, /// focused, disabled, hovered, and pressed state variants. -@MixableStyler() -class RemixSwitchStyler - extends RemixContainerStyler - with - SelectedWidgetStateVariantMixin, - Diagnosticable, - _$RemixSwitchStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $container; - @MixableField(setterType: BoxStyler) - final Prop>? $thumb; - - const RemixSwitchStyler.create({ - Prop>? container, - Prop>? thumb, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $thumb = thumb; - - RemixSwitchStyler({ - BoxStyler? container, - BoxStyler? thumb, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - thumb: Prop.maybeMix(thumb), - variants: variants, - animation: animation, - modifier: modifier, - ); - +extension RemixSwitchStylerRemixHelpers on RemixSwitchStyler { /// Sets thumb color RemixSwitchStyler thumbColor(Color value) { return merge( @@ -53,11 +19,6 @@ class RemixSwitchStyler return color(value); } - /// Sets container alignment - RemixSwitchStyler alignment(Alignment value) { - return merge(RemixSwitchStyler(container: BoxStyler(alignment: value))); - } - /// Creates a [RemixSwitch] widget with this style applied. /// /// Example: @@ -96,45 +57,4 @@ class RemixSwitchStyler style: this, ); } - - // Abstract method implementations for mixins - - @override - RemixSwitchStyler constraints(BoxConstraintsMix value) { - return merge(RemixSwitchStyler(container: BoxStyler(constraints: value))); - } - - @override - RemixSwitchStyler decoration(DecorationMix value) { - return merge(RemixSwitchStyler(container: BoxStyler(decoration: value))); - } - - @override - RemixSwitchStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixSwitchStyler(container: BoxStyler(margin: value))); - } - - @override - RemixSwitchStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixSwitchStyler(container: BoxStyler(padding: value))); - } - - @override - RemixSwitchStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixSwitchStyler(container: BoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixSwitchStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixSwitchStyler( - container: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } } diff --git a/packages/remix/lib/src/components/tabs/fortal_tabs_styles.dart b/packages/remix/lib/src/components/tabs/fortal_tabs_styles.dart index bbca7f6c..bea03455 100644 --- a/packages/remix/lib/src/components/tabs/fortal_tabs_styles.dart +++ b/packages/remix/lib/src/components/tabs/fortal_tabs_styles.dart @@ -1,7 +1,6 @@ part of 'tabs.dart'; /// Fortal-themed preset for [RemixTabBar]. -@MixWidget(name: 'FortalTabBar') RemixTabBarStyler fortalTabBarStyler() { return RemixTabBarStyler().container( FlexBoxStyler() @@ -12,13 +11,11 @@ RemixTabBarStyler fortalTabBarStyler() { } /// Fortal-themed preset for [RemixTabView]. -@MixWidget(name: 'FortalTabView') RemixTabViewStyler fortalTabViewStyler() { return RemixTabViewStyler().paddingAll(FortalTokens.space3()); } /// Fortal-themed preset for [RemixTab]. -@MixWidget(name: 'FortalTab') RemixTabStyler fortalTabStyler() { return RemixTabStyler() .label(TextStyler().color(FortalTokens.gray12())) @@ -53,3 +50,103 @@ RemixTabStyler fortalTabStyler() { ) .padding(EdgeInsetsMix.symmetric(vertical: 6.0, horizontal: 12.0)); } + +/// Fortal-themed preset for [RemixTabBar]. +class FortalTabBar extends StatelessWidget { + const FortalTabBar({super.key, required this.child}); + + final Widget child; + + @override + Widget build(BuildContext context) { + return fortalTabBarStyler().call(key: this.key, child: this.child); + } +} + +/// Fortal-themed preset for [RemixTabView]. +class FortalTabView extends StatelessWidget { + const FortalTabView({super.key, required this.tabId, required this.child}); + + final String tabId; + + final Widget child; + + @override + Widget build(BuildContext context) { + return fortalTabViewStyler().call( + key: this.key, + tabId: this.tabId, + child: this.child, + ); + } +} + +/// Fortal-themed preset for [RemixTab]. +class FortalTab extends StatelessWidget { + const FortalTab({ + super.key, + required this.tabId, + this.child, + this.label, + this.icon, + this.enabled = true, + this.mouseCursor = SystemMouseCursors.click, + this.enableFeedback = true, + this.focusNode, + this.autofocus = false, + this.onFocusChange, + this.onHoverChange, + this.onPressChange, + this.builder, + this.semanticLabel, + }); + + final String tabId; + + final Widget? child; + + final String? label; + + final IconData? icon; + + final bool enabled; + + final MouseCursor mouseCursor; + + final bool enableFeedback; + + final FocusNode? focusNode; + + final bool autofocus; + + final ValueChanged? onFocusChange; + + final ValueChanged? onHoverChange; + + final ValueChanged? onPressChange; + + final ValueWidgetBuilder? builder; + + final String? semanticLabel; + + @override + Widget build(BuildContext context) { + return fortalTabStyler().call( + key: this.key, + tabId: this.tabId, + label: this.label, + icon: this.icon, + enabled: this.enabled, + mouseCursor: this.mouseCursor, + enableFeedback: this.enableFeedback, + focusNode: this.focusNode, + autofocus: this.autofocus, + onFocusChange: this.onFocusChange, + onHoverChange: this.onHoverChange, + onPressChange: this.onPressChange, + semanticLabel: this.semanticLabel, + child: this.child, + builder: this.builder, + ); + } +} diff --git a/packages/remix/lib/src/components/tabs/tabs.g.dart b/packages/remix/lib/src/components/tabs/tabs.g.dart index 36936bb0..df2bdac5 100644 --- a/packages/remix/lib/src/components/tabs/tabs.g.dart +++ b/packages/remix/lib/src/components/tabs/tabs.g.dart @@ -225,115 +225,563 @@ mixin _$RemixTabViewSpec implements Spec, Diagnosticable { typedef _$RemixTabViewSpecMethods = _$RemixTabViewSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixTabBar]. -class FortalTabBar extends StatelessWidget { - const FortalTabBar({super.key, required this.child}); +class RemixTabBarStyler extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $container; + + const RemixTabBarStyler.create({ + Prop>? container, + super.variants, + super.modifier, + super.animation, + }) : $container = container; + + RemixTabBarStyler({ + FlexBoxStyler? container, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixTabBarStyler.container(FlexBoxStyler value) => + RemixTabBarStyler().container(value); + factory RemixTabBarStyler.color(Color value) => + RemixTabBarStyler().color(value); + factory RemixTabBarStyler.gradient(GradientMix value) => + RemixTabBarStyler().gradient(value); + factory RemixTabBarStyler.border(BoxBorderMix value) => + RemixTabBarStyler().border(value); + factory RemixTabBarStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixTabBarStyler().borderRadius(value); + factory RemixTabBarStyler.elevation(ElevationShadow value) => + RemixTabBarStyler().elevation(value); + factory RemixTabBarStyler.shadow(BoxShadowMix value) => + RemixTabBarStyler().shadow(value); + factory RemixTabBarStyler.shadows(List value) => + RemixTabBarStyler().shadows(value); + factory RemixTabBarStyler.width(double value) => + RemixTabBarStyler().width(value); + factory RemixTabBarStyler.height(double value) => + RemixTabBarStyler().height(value); + factory RemixTabBarStyler.size(double width, double height) => + RemixTabBarStyler().size(width, height); + factory RemixTabBarStyler.minWidth(double value) => + RemixTabBarStyler().minWidth(value); + factory RemixTabBarStyler.maxWidth(double value) => + RemixTabBarStyler().maxWidth(value); + factory RemixTabBarStyler.minHeight(double value) => + RemixTabBarStyler().minHeight(value); + factory RemixTabBarStyler.maxHeight(double value) => + RemixTabBarStyler().maxHeight(value); + factory RemixTabBarStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixTabBarStyler().scale(scale, alignment: alignment); + factory RemixTabBarStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixTabBarStyler().rotate(radians, alignment: alignment); + factory RemixTabBarStyler.translate(double x, double y, [double z = 0.0]) => + RemixTabBarStyler().translate(x, y, z); + factory RemixTabBarStyler.skew(double skewX, double skewY) => + RemixTabBarStyler().skew(skewX, skewY); + factory RemixTabBarStyler.textStyle(TextStyler value) => + RemixTabBarStyler().textStyle(value); + factory RemixTabBarStyler.image(DecorationImageMix value) => + RemixTabBarStyler().image(value); + factory RemixTabBarStyler.shape(ShapeBorderMix value) => + RemixTabBarStyler().shape(value); + factory RemixTabBarStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTabBarStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTabBarStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTabBarStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTabBarStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTabBarStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTabBarStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixTabBarStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixTabBarStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixTabBarStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixTabBarStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixTabBarStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixTabBarStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixTabBarStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixTabBarStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixTabBarStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixTabBarStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixTabBarStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixTabBarStyler.row() => RemixTabBarStyler().row(); + factory RemixTabBarStyler.column() => RemixTabBarStyler().column(); + factory RemixTabBarStyler.alignment(AlignmentGeometry value) => + RemixTabBarStyler().alignment(value); + factory RemixTabBarStyler.padding(EdgeInsetsGeometryMix value) => + RemixTabBarStyler().padding(value); + factory RemixTabBarStyler.margin(EdgeInsetsGeometryMix value) => + RemixTabBarStyler().margin(value); + factory RemixTabBarStyler.constraints(BoxConstraintsMix value) => + RemixTabBarStyler().constraints(value); + factory RemixTabBarStyler.decoration(DecorationMix value) => + RemixTabBarStyler().decoration(value); + factory RemixTabBarStyler.foregroundDecoration(DecorationMix value) => + RemixTabBarStyler().foregroundDecoration(value); + factory RemixTabBarStyler.clipBehavior(Clip value) => + RemixTabBarStyler().clipBehavior(value); + factory RemixTabBarStyler.direction(Axis value) => + RemixTabBarStyler().direction(value); + factory RemixTabBarStyler.mainAxisAlignment(MainAxisAlignment value) => + RemixTabBarStyler().mainAxisAlignment(value); + factory RemixTabBarStyler.crossAxisAlignment(CrossAxisAlignment value) => + RemixTabBarStyler().crossAxisAlignment(value); + factory RemixTabBarStyler.mainAxisSize(MainAxisSize value) => + RemixTabBarStyler().mainAxisSize(value); + factory RemixTabBarStyler.spacing(double value) => + RemixTabBarStyler().spacing(value); + factory RemixTabBarStyler.verticalDirection(VerticalDirection value) => + RemixTabBarStyler().verticalDirection(value); + factory RemixTabBarStyler.textDirection(TextDirection value) => + RemixTabBarStyler().textDirection(value); + factory RemixTabBarStyler.textBaseline(TextBaseline value) => + RemixTabBarStyler().textBaseline(value); + factory RemixTabBarStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixTabBarStyler().transform(value, alignment: alignment); + + RemixTabBarStyler color(Color value) { + return container(FlexBoxStyler().color(value)); + } - final Widget child; + RemixTabBarStyler gradient(GradientMix value) { + return container(FlexBoxStyler().gradient(value)); + } - @override - Widget build(BuildContext context) { - return fortalTabBarStyler().call(key: this.key, child: this.child); + RemixTabBarStyler border(BoxBorderMix value) { + return container(FlexBoxStyler().border(value)); } -} -/// Fortal-themed preset for [RemixTabView]. -class FortalTabView extends StatelessWidget { - const FortalTabView({super.key, required this.tabId, required this.child}); + RemixTabBarStyler borderRadius(BorderRadiusGeometryMix value) { + return container(FlexBoxStyler().borderRadius(value)); + } - final String tabId; + RemixTabBarStyler elevation(ElevationShadow value) { + return container(FlexBoxStyler().elevation(value)); + } - final Widget child; + RemixTabBarStyler shadow(BoxShadowMix value) { + return container(FlexBoxStyler().shadow(value)); + } - @override - Widget build(BuildContext context) { - return fortalTabViewStyler().call( - key: this.key, - tabId: this.tabId, - child: this.child, - ); + RemixTabBarStyler shadows(List value) { + return container(FlexBoxStyler().shadows(value)); } -} -/// Fortal-themed preset for [RemixTab]. -class FortalTab extends StatelessWidget { - const FortalTab({ - super.key, - required this.tabId, - this.child, - this.label, - this.icon, - this.enabled = true, - this.mouseCursor = SystemMouseCursors.click, - this.enableFeedback = true, - this.focusNode, - this.autofocus = false, - this.onFocusChange, - this.onHoverChange, - this.onPressChange, - this.builder, - this.semanticLabel, - }); + RemixTabBarStyler width(double value) { + return container(FlexBoxStyler().width(value)); + } - final String tabId; + RemixTabBarStyler height(double value) { + return container(FlexBoxStyler().height(value)); + } - final Widget? child; + RemixTabBarStyler size(double width, double height) { + return container(FlexBoxStyler().size(width, height)); + } - final String? label; + RemixTabBarStyler minWidth(double value) { + return container(FlexBoxStyler().minWidth(value)); + } - final IconData? icon; + RemixTabBarStyler maxWidth(double value) { + return container(FlexBoxStyler().maxWidth(value)); + } - final bool enabled; + RemixTabBarStyler minHeight(double value) { + return container(FlexBoxStyler().minHeight(value)); + } - final MouseCursor mouseCursor; + RemixTabBarStyler maxHeight(double value) { + return container(FlexBoxStyler().maxHeight(value)); + } - final bool enableFeedback; + RemixTabBarStyler scale(double scale, {Alignment alignment = .center}) { + return container(FlexBoxStyler().scale(scale, alignment: alignment)); + } - final FocusNode? focusNode; + RemixTabBarStyler rotate(double radians, {Alignment alignment = .center}) { + return container(FlexBoxStyler().rotate(radians, alignment: alignment)); + } - final bool autofocus; + RemixTabBarStyler translate(double x, double y, [double z = 0.0]) { + return container(FlexBoxStyler().translate(x, y, z)); + } - final ValueChanged? onFocusChange; + RemixTabBarStyler skew(double skewX, double skewY) { + return container(FlexBoxStyler().skew(skewX, skewY)); + } - final ValueChanged? onHoverChange; + RemixTabBarStyler textStyle(TextStyler value) { + return container(FlexBoxStyler().textStyle(value)); + } - final ValueChanged? onPressChange; + RemixTabBarStyler image(DecorationImageMix value) { + return container(FlexBoxStyler().image(value)); + } - final ValueWidgetBuilder? builder; + RemixTabBarStyler shape(ShapeBorderMix value) { + return container(FlexBoxStyler().shape(value)); + } - final String? semanticLabel; + RemixTabBarStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } - @override - Widget build(BuildContext context) { - return fortalTabStyler().call( - key: this.key, - tabId: this.tabId, - child: this.child, - label: this.label, - icon: this.icon, - enabled: this.enabled, - mouseCursor: this.mouseCursor, - enableFeedback: this.enableFeedback, - focusNode: this.focusNode, - autofocus: this.autofocus, - onFocusChange: this.onFocusChange, - onHoverChange: this.onHoverChange, - onPressChange: this.onPressChange, - builder: this.builder, - semanticLabel: this.semanticLabel, + RemixTabBarStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixTabBarStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixTabBarStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixTabBarStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixTabBarStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixTabBarStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } -mixin _$RemixTabBarStylerMixin on Style, Diagnosticable { - Prop>? get $container; + RemixTabBarStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixTabBarStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixTabBarStyler row() { + return container(FlexBoxStyler().row()); + } + + RemixTabBarStyler column() { + return container(FlexBoxStyler().column()); + } + + RemixTabBarStyler alignment(AlignmentGeometry value) { + return container(FlexBoxStyler().alignment(value)); + } + + RemixTabBarStyler padding(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().padding(value)); + } + + RemixTabBarStyler margin(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().margin(value)); + } + + RemixTabBarStyler constraints(BoxConstraintsMix value) { + return container(FlexBoxStyler().constraints(value)); + } + + RemixTabBarStyler decoration(DecorationMix value) { + return container(FlexBoxStyler().decoration(value)); + } + + RemixTabBarStyler foregroundDecoration(DecorationMix value) { + return container(FlexBoxStyler().foregroundDecoration(value)); + } + + RemixTabBarStyler clipBehavior(Clip value) { + return container(FlexBoxStyler().clipBehavior(value)); + } + + RemixTabBarStyler direction(Axis value) { + return container(FlexBoxStyler().direction(value)); + } + + RemixTabBarStyler mainAxisAlignment(MainAxisAlignment value) { + return container(FlexBoxStyler().mainAxisAlignment(value)); + } + + RemixTabBarStyler crossAxisAlignment(CrossAxisAlignment value) { + return container(FlexBoxStyler().crossAxisAlignment(value)); + } + + RemixTabBarStyler mainAxisSize(MainAxisSize value) { + return container(FlexBoxStyler().mainAxisSize(value)); + } + + RemixTabBarStyler spacing(double value) { + return container(FlexBoxStyler().spacing(value)); + } + + RemixTabBarStyler verticalDirection(VerticalDirection value) { + return container(FlexBoxStyler().verticalDirection(value)); + } + + RemixTabBarStyler textDirection(TextDirection value) { + return container(FlexBoxStyler().textDirection(value)); + } + + RemixTabBarStyler textBaseline(TextBaseline value) { + return container(FlexBoxStyler().textBaseline(value)); + } + + RemixTabBarStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(FlexBoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixTabBarStyler container(FlexBoxStyler value) { @@ -341,16 +789,19 @@ mixin _$RemixTabBarStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixTabBarStyler animate(AnimationConfig value) { return merge(RemixTabBarStyler(animation: value)); } /// Sets the style variants. + @override RemixTabBarStyler variants(List> value) { return merge(RemixTabBarStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixTabBarStyler wrap(WidgetModifierConfig value) { return merge(RemixTabBarStyler(modifier: value)); } @@ -395,73 +846,571 @@ mixin _$RemixTabBarStylerMixin on Style, Diagnosticable { List get props => [$container, $animation, $modifier, $variants]; } -mixin _$RemixTabViewStylerMixin on Style, Diagnosticable { - Prop>? get $container; +class RemixTabStyler extends MixStyler + with + RemixBoxStylerMixin, + LabelStyleMixin, + IconStyleMixin { + final Prop>? $container; + final Prop>? $label; + final Prop>? $icon; + + const RemixTabStyler.create({ + Prop>? container, + Prop>? label, + Prop>? icon, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $label = label, + $icon = icon; + + RemixTabStyler({ + FlexBoxStyler? container, + TextStyler? label, + IconStyler? icon, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + label: Prop.maybeMix(label), + icon: Prop.maybeMix(icon), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixTabStyler.container(FlexBoxStyler value) => + RemixTabStyler().container(value); + factory RemixTabStyler.label(TextStyler value) => + RemixTabStyler().label(value); + factory RemixTabStyler.icon(IconStyler value) => RemixTabStyler().icon(value); + factory RemixTabStyler.color(Color value) => RemixTabStyler().color(value); + factory RemixTabStyler.gradient(GradientMix value) => + RemixTabStyler().gradient(value); + factory RemixTabStyler.border(BoxBorderMix value) => + RemixTabStyler().border(value); + factory RemixTabStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixTabStyler().borderRadius(value); + factory RemixTabStyler.elevation(ElevationShadow value) => + RemixTabStyler().elevation(value); + factory RemixTabStyler.shadow(BoxShadowMix value) => + RemixTabStyler().shadow(value); + factory RemixTabStyler.shadows(List value) => + RemixTabStyler().shadows(value); + factory RemixTabStyler.width(double value) => RemixTabStyler().width(value); + factory RemixTabStyler.height(double value) => RemixTabStyler().height(value); + factory RemixTabStyler.size(double width, double height) => + RemixTabStyler().size(width, height); + factory RemixTabStyler.minWidth(double value) => + RemixTabStyler().minWidth(value); + factory RemixTabStyler.maxWidth(double value) => + RemixTabStyler().maxWidth(value); + factory RemixTabStyler.minHeight(double value) => + RemixTabStyler().minHeight(value); + factory RemixTabStyler.maxHeight(double value) => + RemixTabStyler().maxHeight(value); + factory RemixTabStyler.scale(double scale, {Alignment alignment = .center}) => + RemixTabStyler().scale(scale, alignment: alignment); + factory RemixTabStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixTabStyler().rotate(radians, alignment: alignment); + factory RemixTabStyler.translate(double x, double y, [double z = 0.0]) => + RemixTabStyler().translate(x, y, z); + factory RemixTabStyler.skew(double skewX, double skewY) => + RemixTabStyler().skew(skewX, skewY); + factory RemixTabStyler.textStyle(TextStyler value) => + RemixTabStyler().textStyle(value); + factory RemixTabStyler.image(DecorationImageMix value) => + RemixTabStyler().image(value); + factory RemixTabStyler.shape(ShapeBorderMix value) => + RemixTabStyler().shape(value); + factory RemixTabStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTabStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTabStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTabStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTabStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTabStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTabStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixTabStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixTabStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixTabStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixTabStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixTabStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixTabStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixTabStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixTabStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixTabStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixTabStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixTabStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixTabStyler.row() => RemixTabStyler().row(); + factory RemixTabStyler.column() => RemixTabStyler().column(); + factory RemixTabStyler.alignment(AlignmentGeometry value) => + RemixTabStyler().alignment(value); + factory RemixTabStyler.padding(EdgeInsetsGeometryMix value) => + RemixTabStyler().padding(value); + factory RemixTabStyler.margin(EdgeInsetsGeometryMix value) => + RemixTabStyler().margin(value); + factory RemixTabStyler.constraints(BoxConstraintsMix value) => + RemixTabStyler().constraints(value); + factory RemixTabStyler.decoration(DecorationMix value) => + RemixTabStyler().decoration(value); + factory RemixTabStyler.foregroundDecoration(DecorationMix value) => + RemixTabStyler().foregroundDecoration(value); + factory RemixTabStyler.clipBehavior(Clip value) => + RemixTabStyler().clipBehavior(value); + factory RemixTabStyler.direction(Axis value) => + RemixTabStyler().direction(value); + factory RemixTabStyler.mainAxisAlignment(MainAxisAlignment value) => + RemixTabStyler().mainAxisAlignment(value); + factory RemixTabStyler.crossAxisAlignment(CrossAxisAlignment value) => + RemixTabStyler().crossAxisAlignment(value); + factory RemixTabStyler.mainAxisSize(MainAxisSize value) => + RemixTabStyler().mainAxisSize(value); + factory RemixTabStyler.spacing(double value) => + RemixTabStyler().spacing(value); + factory RemixTabStyler.verticalDirection(VerticalDirection value) => + RemixTabStyler().verticalDirection(value); + factory RemixTabStyler.textDirection(TextDirection value) => + RemixTabStyler().textDirection(value); + factory RemixTabStyler.textBaseline(TextBaseline value) => + RemixTabStyler().textBaseline(value); + factory RemixTabStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixTabStyler().transform(value, alignment: alignment); + + RemixTabStyler color(Color value) { + return container(FlexBoxStyler().color(value)); + } - /// Sets the container. - RemixTabViewStyler container(BoxStyler value) { - return merge(RemixTabViewStyler(container: value)); + RemixTabStyler gradient(GradientMix value) { + return container(FlexBoxStyler().gradient(value)); } - /// Sets the animation configuration. - RemixTabViewStyler animate(AnimationConfig value) { - return merge(RemixTabViewStyler(animation: value)); + RemixTabStyler border(BoxBorderMix value) { + return container(FlexBoxStyler().border(value)); } - /// Sets the style variants. - RemixTabViewStyler variants(List> value) { - return merge(RemixTabViewStyler(variants: value)); + RemixTabStyler borderRadius(BorderRadiusGeometryMix value) { + return container(FlexBoxStyler().borderRadius(value)); } - /// Wraps with a widget modifier. - RemixTabViewStyler wrap(WidgetModifierConfig value) { - return merge(RemixTabViewStyler(modifier: value)); + RemixTabStyler elevation(ElevationShadow value) { + return container(FlexBoxStyler().elevation(value)); } - /// Sets the widget modifier. - RemixTabViewStyler modifier(WidgetModifierConfig value) { - return merge(RemixTabViewStyler(modifier: value)); + RemixTabStyler shadow(BoxShadowMix value) { + return container(FlexBoxStyler().shadow(value)); } - /// Merges with another [RemixTabViewStyler]. - @override - RemixTabViewStyler merge(RemixTabViewStyler? other) { - return RemixTabViewStyler.create( - container: MixOps.merge($container, other?.$container), - variants: MixOps.mergeVariants($variants, other?.$variants), - modifier: MixOps.mergeModifier($modifier, other?.$modifier), - animation: MixOps.mergeAnimation($animation, other?.$animation), + RemixTabStyler shadows(List value) { + return container(FlexBoxStyler().shadows(value)); + } + + RemixTabStyler width(double value) { + return container(FlexBoxStyler().width(value)); + } + + RemixTabStyler height(double value) { + return container(FlexBoxStyler().height(value)); + } + + RemixTabStyler size(double width, double height) { + return container(FlexBoxStyler().size(width, height)); + } + + RemixTabStyler minWidth(double value) { + return container(FlexBoxStyler().minWidth(value)); + } + + RemixTabStyler maxWidth(double value) { + return container(FlexBoxStyler().maxWidth(value)); + } + + RemixTabStyler minHeight(double value) { + return container(FlexBoxStyler().minHeight(value)); + } + + RemixTabStyler maxHeight(double value) { + return container(FlexBoxStyler().maxHeight(value)); + } + + RemixTabStyler scale(double scale, {Alignment alignment = .center}) { + return container(FlexBoxStyler().scale(scale, alignment: alignment)); + } + + RemixTabStyler rotate(double radians, {Alignment alignment = .center}) { + return container(FlexBoxStyler().rotate(radians, alignment: alignment)); + } + + RemixTabStyler translate(double x, double y, [double z = 0.0]) { + return container(FlexBoxStyler().translate(x, y, z)); + } + + RemixTabStyler skew(double skewX, double skewY) { + return container(FlexBoxStyler().skew(skewX, skewY)); + } + + RemixTabStyler textStyle(TextStyler value) { + return container(FlexBoxStyler().textStyle(value)); + } + + RemixTabStyler image(DecorationImageMix value) { + return container(FlexBoxStyler().image(value)); + } + + RemixTabStyler shape(ShapeBorderMix value) { + return container(FlexBoxStyler().shape(value)); + } + + RemixTabStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } - /// Resolves to [StyleSpec] using [context]. - @override - StyleSpec resolve(BuildContext context) { - final spec = RemixTabViewSpec( - container: MixOps.resolve(context, $container), + RemixTabStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); + } - return StyleSpec( - spec: spec, - animation: $animation, - widgetModifiers: $modifier?.resolve(context), + RemixTabStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } - @override - void debugFillProperties(DiagnosticPropertiesBuilder properties) { - super.debugFillProperties(properties); - properties.add(DiagnosticsProperty('container', $container)); + RemixTabStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); } - @override - List get props => [$container, $animation, $modifier, $variants]; -} + RemixTabStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixTabStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixTabStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixTabStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixTabStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } -mixin _$RemixTabStylerMixin on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $label; - Prop>? get $icon; + RemixTabStyler row() { + return container(FlexBoxStyler().row()); + } + + RemixTabStyler column() { + return container(FlexBoxStyler().column()); + } + + RemixTabStyler alignment(AlignmentGeometry value) { + return container(FlexBoxStyler().alignment(value)); + } + + RemixTabStyler padding(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().padding(value)); + } + + RemixTabStyler margin(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().margin(value)); + } + + RemixTabStyler constraints(BoxConstraintsMix value) { + return container(FlexBoxStyler().constraints(value)); + } + + RemixTabStyler decoration(DecorationMix value) { + return container(FlexBoxStyler().decoration(value)); + } + + RemixTabStyler foregroundDecoration(DecorationMix value) { + return container(FlexBoxStyler().foregroundDecoration(value)); + } + + RemixTabStyler clipBehavior(Clip value) { + return container(FlexBoxStyler().clipBehavior(value)); + } + + RemixTabStyler direction(Axis value) { + return container(FlexBoxStyler().direction(value)); + } + + RemixTabStyler mainAxisAlignment(MainAxisAlignment value) { + return container(FlexBoxStyler().mainAxisAlignment(value)); + } + + RemixTabStyler crossAxisAlignment(CrossAxisAlignment value) { + return container(FlexBoxStyler().crossAxisAlignment(value)); + } + + RemixTabStyler mainAxisSize(MainAxisSize value) { + return container(FlexBoxStyler().mainAxisSize(value)); + } + + RemixTabStyler spacing(double value) { + return container(FlexBoxStyler().spacing(value)); + } + + RemixTabStyler verticalDirection(VerticalDirection value) { + return container(FlexBoxStyler().verticalDirection(value)); + } + + RemixTabStyler textDirection(TextDirection value) { + return container(FlexBoxStyler().textDirection(value)); + } + + RemixTabStyler textBaseline(TextBaseline value) { + return container(FlexBoxStyler().textBaseline(value)); + } + + RemixTabStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(FlexBoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixTabStyler container(FlexBoxStyler value) { @@ -469,26 +1418,31 @@ mixin _$RemixTabStylerMixin on Style, Diagnosticable { } /// Sets the label. + @override RemixTabStyler label(TextStyler value) { return merge(RemixTabStyler(label: value)); } /// Sets the icon. + @override RemixTabStyler icon(IconStyler value) { return merge(RemixTabStyler(icon: value)); } /// Sets the animation configuration. + @override RemixTabStyler animate(AnimationConfig value) { return merge(RemixTabStyler(animation: value)); } /// Sets the style variants. + @override RemixTabStyler variants(List> value) { return merge(RemixTabStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixTabStyler wrap(WidgetModifierConfig value) { return merge(RemixTabStyler(modifier: value)); } @@ -546,3 +1500,563 @@ mixin _$RemixTabStylerMixin on Style, Diagnosticable { $variants, ]; } + +class RemixTabViewStyler extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $container; + + const RemixTabViewStyler.create({ + Prop>? container, + super.variants, + super.modifier, + super.animation, + }) : $container = container; + + RemixTabViewStyler({ + BoxStyler? container, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixTabViewStyler.container(BoxStyler value) => + RemixTabViewStyler().container(value); + factory RemixTabViewStyler.alignment(AlignmentGeometry value) => + RemixTabViewStyler().alignment(value); + factory RemixTabViewStyler.padding(EdgeInsetsGeometryMix value) => + RemixTabViewStyler().padding(value); + factory RemixTabViewStyler.margin(EdgeInsetsGeometryMix value) => + RemixTabViewStyler().margin(value); + factory RemixTabViewStyler.constraints(BoxConstraintsMix value) => + RemixTabViewStyler().constraints(value); + factory RemixTabViewStyler.decoration(DecorationMix value) => + RemixTabViewStyler().decoration(value); + factory RemixTabViewStyler.foregroundDecoration(DecorationMix value) => + RemixTabViewStyler().foregroundDecoration(value); + factory RemixTabViewStyler.clipBehavior(Clip value) => + RemixTabViewStyler().clipBehavior(value); + factory RemixTabViewStyler.color(Color value) => + RemixTabViewStyler().color(value); + factory RemixTabViewStyler.gradient(GradientMix value) => + RemixTabViewStyler().gradient(value); + factory RemixTabViewStyler.border(BoxBorderMix value) => + RemixTabViewStyler().border(value); + factory RemixTabViewStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixTabViewStyler().borderRadius(value); + factory RemixTabViewStyler.elevation(ElevationShadow value) => + RemixTabViewStyler().elevation(value); + factory RemixTabViewStyler.shadow(BoxShadowMix value) => + RemixTabViewStyler().shadow(value); + factory RemixTabViewStyler.shadows(List value) => + RemixTabViewStyler().shadows(value); + factory RemixTabViewStyler.width(double value) => + RemixTabViewStyler().width(value); + factory RemixTabViewStyler.height(double value) => + RemixTabViewStyler().height(value); + factory RemixTabViewStyler.size(double width, double height) => + RemixTabViewStyler().size(width, height); + factory RemixTabViewStyler.minWidth(double value) => + RemixTabViewStyler().minWidth(value); + factory RemixTabViewStyler.maxWidth(double value) => + RemixTabViewStyler().maxWidth(value); + factory RemixTabViewStyler.minHeight(double value) => + RemixTabViewStyler().minHeight(value); + factory RemixTabViewStyler.maxHeight(double value) => + RemixTabViewStyler().maxHeight(value); + factory RemixTabViewStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixTabViewStyler().scale(scale, alignment: alignment); + factory RemixTabViewStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixTabViewStyler().rotate(radians, alignment: alignment); + factory RemixTabViewStyler.translate(double x, double y, [double z = 0.0]) => + RemixTabViewStyler().translate(x, y, z); + factory RemixTabViewStyler.skew(double skewX, double skewY) => + RemixTabViewStyler().skew(skewX, skewY); + factory RemixTabViewStyler.textStyle(TextStyler value) => + RemixTabViewStyler().textStyle(value); + factory RemixTabViewStyler.image(DecorationImageMix value) => + RemixTabViewStyler().image(value); + factory RemixTabViewStyler.shape(ShapeBorderMix value) => + RemixTabViewStyler().shape(value); + factory RemixTabViewStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTabViewStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTabViewStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTabViewStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTabViewStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTabViewStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTabViewStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixTabViewStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixTabViewStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixTabViewStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixTabViewStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixTabViewStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixTabViewStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixTabViewStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixTabViewStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixTabViewStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixTabViewStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixTabViewStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixTabViewStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixTabViewStyler().transform(value, alignment: alignment); + + RemixTabViewStyler alignment(AlignmentGeometry value) { + return container(BoxStyler().alignment(value)); + } + + RemixTabViewStyler padding(EdgeInsetsGeometryMix value) { + return container(BoxStyler().padding(value)); + } + + RemixTabViewStyler margin(EdgeInsetsGeometryMix value) { + return container(BoxStyler().margin(value)); + } + + RemixTabViewStyler constraints(BoxConstraintsMix value) { + return container(BoxStyler().constraints(value)); + } + + RemixTabViewStyler decoration(DecorationMix value) { + return container(BoxStyler().decoration(value)); + } + + RemixTabViewStyler foregroundDecoration(DecorationMix value) { + return container(BoxStyler().foregroundDecoration(value)); + } + + RemixTabViewStyler clipBehavior(Clip value) { + return container(BoxStyler().clipBehavior(value)); + } + + RemixTabViewStyler color(Color value) { + return container(BoxStyler().color(value)); + } + + RemixTabViewStyler gradient(GradientMix value) { + return container(BoxStyler().gradient(value)); + } + + RemixTabViewStyler border(BoxBorderMix value) { + return container(BoxStyler().border(value)); + } + + RemixTabViewStyler borderRadius(BorderRadiusGeometryMix value) { + return container(BoxStyler().borderRadius(value)); + } + + RemixTabViewStyler elevation(ElevationShadow value) { + return container(BoxStyler().elevation(value)); + } + + RemixTabViewStyler shadow(BoxShadowMix value) { + return container(BoxStyler().shadow(value)); + } + + RemixTabViewStyler shadows(List value) { + return container(BoxStyler().shadows(value)); + } + + RemixTabViewStyler width(double value) { + return container(BoxStyler().width(value)); + } + + RemixTabViewStyler height(double value) { + return container(BoxStyler().height(value)); + } + + RemixTabViewStyler size(double width, double height) { + return container(BoxStyler().size(width, height)); + } + + RemixTabViewStyler minWidth(double value) { + return container(BoxStyler().minWidth(value)); + } + + RemixTabViewStyler maxWidth(double value) { + return container(BoxStyler().maxWidth(value)); + } + + RemixTabViewStyler minHeight(double value) { + return container(BoxStyler().minHeight(value)); + } + + RemixTabViewStyler maxHeight(double value) { + return container(BoxStyler().maxHeight(value)); + } + + RemixTabViewStyler scale(double scale, {Alignment alignment = .center}) { + return container(BoxStyler().scale(scale, alignment: alignment)); + } + + RemixTabViewStyler rotate(double radians, {Alignment alignment = .center}) { + return container(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixTabViewStyler translate(double x, double y, [double z = 0.0]) { + return container(BoxStyler().translate(x, y, z)); + } + + RemixTabViewStyler skew(double skewX, double skewY) { + return container(BoxStyler().skew(skewX, skewY)); + } + + RemixTabViewStyler textStyle(TextStyler value) { + return container(BoxStyler().textStyle(value)); + } + + RemixTabViewStyler image(DecorationImageMix value) { + return container(BoxStyler().image(value)); + } + + RemixTabViewStyler shape(ShapeBorderMix value) { + return container(BoxStyler().shape(value)); + } + + RemixTabViewStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixTabViewStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixTabViewStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixTabViewStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixTabViewStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixTabViewStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixTabViewStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixTabViewStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixTabViewStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixTabViewStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(BoxStyler().transform(value, alignment: alignment)); + } + + /// Sets the container. + RemixTabViewStyler container(BoxStyler value) { + return merge(RemixTabViewStyler(container: value)); + } + + /// Sets the animation configuration. + @override + RemixTabViewStyler animate(AnimationConfig value) { + return merge(RemixTabViewStyler(animation: value)); + } + + /// Sets the style variants. + @override + RemixTabViewStyler variants(List> value) { + return merge(RemixTabViewStyler(variants: value)); + } + + /// Wraps with a widget modifier. + @override + RemixTabViewStyler wrap(WidgetModifierConfig value) { + return merge(RemixTabViewStyler(modifier: value)); + } + + /// Sets the widget modifier. + RemixTabViewStyler modifier(WidgetModifierConfig value) { + return merge(RemixTabViewStyler(modifier: value)); + } + + /// Merges with another [RemixTabViewStyler]. + @override + RemixTabViewStyler merge(RemixTabViewStyler? other) { + return RemixTabViewStyler.create( + container: MixOps.merge($container, other?.$container), + variants: MixOps.mergeVariants($variants, other?.$variants), + modifier: MixOps.mergeModifier($modifier, other?.$modifier), + animation: MixOps.mergeAnimation($animation, other?.$animation), + ); + } + + /// Resolves to [StyleSpec] using [context]. + @override + StyleSpec resolve(BuildContext context) { + final spec = RemixTabViewSpec( + container: MixOps.resolve(context, $container), + ); + + return StyleSpec( + spec: spec, + animation: $animation, + widgetModifiers: $modifier?.resolve(context), + ); + } + + @override + void debugFillProperties(DiagnosticPropertiesBuilder properties) { + super.debugFillProperties(properties); + properties.add(DiagnosticsProperty('container', $container)); + } + + @override + List get props => [$container, $animation, $modifier, $variants]; +} diff --git a/packages/remix/lib/src/components/tabs/tabs_spec.dart b/packages/remix/lib/src/components/tabs/tabs_spec.dart index 0440f75d..3f4de2ca 100644 --- a/packages/remix/lib/src/components/tabs/tabs_spec.dart +++ b/packages/remix/lib/src/components/tabs/tabs_spec.dart @@ -1,9 +1,10 @@ part of 'tabs.dart'; /// Resolved visual values for a [RemixTabBar]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixTabBarSpec with _$RemixTabBarSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; const RemixTabBarSpec({StyleSpec? container}) @@ -11,9 +12,12 @@ class RemixTabBarSpec with _$RemixTabBarSpec { } /// Resolved visual values for an individual [RemixTab]. -@MixableSpec() +@MixableSpec( + extraStylerMixins: [RemixBoxStylerMixin, LabelStyleMixin, IconStyleMixin], +) class RemixTabSpec with _$RemixTabSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; @override final StyleSpec label; @@ -30,9 +34,10 @@ class RemixTabSpec with _$RemixTabSpec { } /// Resolved visual values for a [RemixTabView]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixTabViewSpec with _$RemixTabViewSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; const RemixTabViewSpec({StyleSpec? container}) diff --git a/packages/remix/lib/src/components/tabs/tabs_style.dart b/packages/remix/lib/src/components/tabs/tabs_style.dart index f37dc427..e54702ea 100644 --- a/packages/remix/lib/src/components/tabs/tabs_style.dart +++ b/packages/remix/lib/src/components/tabs/tabs_style.dart @@ -3,125 +3,12 @@ part of 'tabs.dart'; /// Style builder for [RemixTabBar]. /// /// Use this class to style the flex container that lays out tab triggers. -@MixableStyler() -class RemixTabBarStyler - extends RemixFlexContainerStyler - with Diagnosticable, _$RemixTabBarStylerMixin { - @MixableField(setterType: FlexBoxStyler) - final Prop>? $container; - - const RemixTabBarStyler.create({ - Prop>? container, - super.variants, - super.animation, - super.modifier, - }) : $container = container; - - RemixTabBarStyler({ - FlexBoxStyler? container, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - variants: variants, - animation: animation, - modifier: modifier, - ); - - /// Sets container alignment - RemixTabBarStyler alignment(Alignment value) { - return merge(RemixTabBarStyler(container: FlexBoxStyler(alignment: value))); - } - +extension RemixTabBarStylerRemixHelpers on RemixTabBarStyler { /// Creates a [RemixTabBar] widget with this style applied. RemixTabBar call({Key? key, required Widget child}) { return RemixTabBar(key: key, style: this, child: child); } - @override - RemixTabBarStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixTabBarStyler(container: FlexBoxStyler(padding: value))); - } - - @override - RemixTabBarStyler color(Color value) { - return merge( - RemixTabBarStyler( - container: FlexBoxStyler(decoration: BoxDecorationMix(color: value)), - ), - ); - } - - @override - RemixTabBarStyler size(double width, double height) { - return merge( - RemixTabBarStyler( - container: FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: width, - maxWidth: width, - minHeight: height, - maxHeight: height, - ), - ), - ), - ); - } - - @override - RemixTabBarStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixTabBarStyler( - container: FlexBoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - - @override - RemixTabBarStyler constraints(BoxConstraintsMix value) { - return merge( - RemixTabBarStyler(container: FlexBoxStyler(constraints: value)), - ); - } - - @override - RemixTabBarStyler decoration(DecorationMix value) { - return merge( - RemixTabBarStyler(container: FlexBoxStyler(decoration: value)), - ); - } - - @override - RemixTabBarStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixTabBarStyler(container: FlexBoxStyler(margin: value))); - } - - @override - RemixTabBarStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixTabBarStyler(container: FlexBoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixTabBarStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixTabBarStyler( - container: FlexBoxStyler( - transform: value, - transformAlignment: alignment, - ), - ), - ); - } - - @override RemixTabBarStyler flex(FlexStyler value) { return merge(RemixTabBarStyler(container: FlexBoxStyler().flex(value))); } @@ -131,157 +18,18 @@ class RemixTabBarStyler /// /// Use this class to style the content container associated with a selected /// tab. -@MixableStyler() -class RemixTabViewStyler - extends RemixContainerStyler - with - SelectedWidgetStateVariantMixin, - Diagnosticable, - _$RemixTabViewStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $container; - - const RemixTabViewStyler.create({ - Prop>? container, - super.variants, - super.animation, - super.modifier, - }) : $container = container; - - RemixTabViewStyler({ - BoxStyler? container, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - variants: variants, - animation: animation, - modifier: modifier, - ); - - /// Sets container alignment - RemixTabViewStyler alignment(Alignment value) { - return merge(RemixTabViewStyler(container: BoxStyler(alignment: value))); - } - +extension RemixTabViewStylerRemixHelpers on RemixTabViewStyler { /// Creates a [RemixTabView] widget with this style applied. RemixTabView call({Key? key, required String tabId, required Widget child}) { return RemixTabView(key: key, tabId: tabId, style: this, child: child); } - - @override - RemixTabViewStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixTabViewStyler(container: BoxStyler(padding: value))); - } - - @override - RemixTabViewStyler color(Color value) { - return merge( - RemixTabViewStyler( - container: BoxStyler(decoration: BoxDecorationMix(color: value)), - ), - ); - } - - @override - RemixTabViewStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixTabViewStyler( - container: BoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - - @override - RemixTabViewStyler constraints(BoxConstraintsMix value) { - return merge(RemixTabViewStyler(container: BoxStyler(constraints: value))); - } - - @override - RemixTabViewStyler decoration(DecorationMix value) { - return merge(RemixTabViewStyler(container: BoxStyler(decoration: value))); - } - - @override - RemixTabViewStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixTabViewStyler(container: BoxStyler(margin: value))); - } - - @override - RemixTabViewStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixTabViewStyler(container: BoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixTabViewStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixTabViewStyler( - container: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } } /// Style builder for [RemixTab]. /// /// Use this class to style an individual tab trigger, including its container, /// label, icon, and selected state. -@MixableStyler() -class RemixTabStyler - extends RemixFlexContainerStyler - with - LabelStyleMixin, - IconStyleMixin, - SelectedWidgetStateVariantMixin, - Diagnosticable, - _$RemixTabStylerMixin { - @MixableField(setterType: FlexBoxStyler) - final Prop>? $container; - @MixableField(setterType: TextStyler) - final Prop>? $label; - @MixableField(setterType: IconStyler) - final Prop>? $icon; - - const RemixTabStyler.create({ - Prop>? container, - Prop>? label, - Prop>? icon, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $label = label, - $icon = icon; - - RemixTabStyler({ - FlexBoxStyler? container, - TextStyler? label, - IconStyler? icon, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - label: Prop.maybeMix(label), - icon: Prop.maybeMix(icon), - variants: variants, - animation: animation, - modifier: modifier, - ); - - /// Sets container alignment - RemixTabStyler alignment(Alignment value) { - return merge(RemixTabStyler(container: FlexBoxStyler(alignment: value))); - } - +extension RemixTabStylerRemixHelpers on RemixTabStyler { /// Creates a [RemixTab] widget with this style applied. RemixTab call({ Key? key, @@ -320,60 +68,7 @@ class RemixTabStyler ); } - // Mixin implementations - delegate to container - @override RemixTabStyler flex(FlexStyler value) { return merge(RemixTabStyler(container: FlexBoxStyler().flex(value))); } - - @override - RemixTabStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixTabStyler(container: FlexBoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixTabStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixTabStyler( - container: FlexBoxStyler( - transform: value, - transformAlignment: alignment, - ), - ), - ); - } - - @override - RemixTabStyler color(Color value) { - return merge( - RemixTabStyler( - container: FlexBoxStyler(decoration: BoxDecorationMix(color: value)), - ), - ); - } - - @override - RemixTabStyler constraints(BoxConstraintsMix value) { - return merge(RemixTabStyler(container: FlexBoxStyler(constraints: value))); - } - - @override - RemixTabStyler decoration(DecorationMix value) { - return merge(RemixTabStyler(container: FlexBoxStyler(decoration: value))); - } - - @override - RemixTabStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixTabStyler(container: FlexBoxStyler(margin: value))); - } - - @override - RemixTabStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixTabStyler(container: FlexBoxStyler(padding: value))); - } } diff --git a/packages/remix/lib/src/components/textfield/fortal_textfield_styles.dart b/packages/remix/lib/src/components/textfield/fortal_textfield_styles.dart index 82a7866d..bcae8df4 100644 --- a/packages/remix/lib/src/components/textfield/fortal_textfield_styles.dart +++ b/packages/remix/lib/src/components/textfield/fortal_textfield_styles.dart @@ -22,7 +22,6 @@ enum FortalTextFieldVariant { } /// Fortal-themed preset for [RemixTextField]. -@MixWidget(name: 'FortalTextField') RemixTextFieldStyler fortalTextFieldStyler({ FortalTextFieldVariant variant = .surface, FortalTextFieldSize size = .size2, @@ -162,3 +161,377 @@ RemixTextFieldStyler _fortalTextFieldSizeStyler(FortalTextFieldSize size) { ).borderRadiusAll(FortalTokens.radius4()).paddingAll(16.0), }; } + +/// Fortal-themed preset for [RemixTextField]. +class FortalTextField extends StatelessWidget { + const FortalTextField({ + super.key, + this.variant = .surface, + this.size = .size2, + this.controller, + this.focusNode, + this.label, + this.hintText, + this.helperText, + this.error = false, + this.keyboardType, + this.textInputAction, + this.textCapitalization = .none, + this.textDirection, + this.obscureText = false, + this.enabled = true, + this.readOnly = false, + this.autofocus = false, + this.maxLines = 1, + this.minLines, + this.expands = false, + this.maxLength, + this.maxLengthEnforcement, + this.onChanged, + this.onEditingComplete, + this.onSubmitted, + this.onAppPrivateCommand, + this.inputFormatters, + this.showCursor, + this.obscuringCharacter = '•', + this.autocorrect = true, + this.enableSuggestions = true, + this.smartDashesType, + this.smartQuotesType, + this.dragStartBehavior = .start, + this.enableInteractiveSelection = true, + this.selectionControls, + this.onTap, + this.onTapOutside, + this.onPressUpOutside, + this.onTapAlwaysCalled = false, + this.scrollController, + this.scrollPhysics, + this.autofillHints, + this.contentInsertionConfiguration, + this.clipBehavior = .hardEdge, + this.restorationId, + this.stylusHandwritingEnabled = true, + this.enableIMEPersonalizedLearning = true, + this.contextMenuBuilder, + this.spellCheckConfiguration, + this.magnifierConfiguration, + this.canRequestFocus = true, + this.ignorePointers, + this.undoController, + this.groupId = EditableText, + this.leading, + this.trailing, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + }); + + /// Surface treatment with neutral border and text colors. + const FortalTextField.surface({ + super.key, + this.size = .size2, + this.controller, + this.focusNode, + this.label, + this.hintText, + this.helperText, + this.error = false, + this.keyboardType, + this.textInputAction, + this.textCapitalization = .none, + this.textDirection, + this.obscureText = false, + this.enabled = true, + this.readOnly = false, + this.autofocus = false, + this.maxLines = 1, + this.minLines, + this.expands = false, + this.maxLength, + this.maxLengthEnforcement, + this.onChanged, + this.onEditingComplete, + this.onSubmitted, + this.onAppPrivateCommand, + this.inputFormatters, + this.showCursor, + this.obscuringCharacter = '•', + this.autocorrect = true, + this.enableSuggestions = true, + this.smartDashesType, + this.smartQuotesType, + this.dragStartBehavior = .start, + this.enableInteractiveSelection = true, + this.selectionControls, + this.onTap, + this.onTapOutside, + this.onPressUpOutside, + this.onTapAlwaysCalled = false, + this.scrollController, + this.scrollPhysics, + this.autofillHints, + this.contentInsertionConfiguration, + this.clipBehavior = .hardEdge, + this.restorationId, + this.stylusHandwritingEnabled = true, + this.enableIMEPersonalizedLearning = true, + this.contextMenuBuilder, + this.spellCheckConfiguration, + this.magnifierConfiguration, + this.canRequestFocus = true, + this.ignorePointers, + this.undoController, + this.groupId = EditableText, + this.leading, + this.trailing, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + }) : variant = FortalTextFieldVariant.surface; + + /// Soft accent treatment. + const FortalTextField.soft({ + super.key, + this.size = .size2, + this.controller, + this.focusNode, + this.label, + this.hintText, + this.helperText, + this.error = false, + this.keyboardType, + this.textInputAction, + this.textCapitalization = .none, + this.textDirection, + this.obscureText = false, + this.enabled = true, + this.readOnly = false, + this.autofocus = false, + this.maxLines = 1, + this.minLines, + this.expands = false, + this.maxLength, + this.maxLengthEnforcement, + this.onChanged, + this.onEditingComplete, + this.onSubmitted, + this.onAppPrivateCommand, + this.inputFormatters, + this.showCursor, + this.obscuringCharacter = '•', + this.autocorrect = true, + this.enableSuggestions = true, + this.smartDashesType, + this.smartQuotesType, + this.dragStartBehavior = .start, + this.enableInteractiveSelection = true, + this.selectionControls, + this.onTap, + this.onTapOutside, + this.onPressUpOutside, + this.onTapAlwaysCalled = false, + this.scrollController, + this.scrollPhysics, + this.autofillHints, + this.contentInsertionConfiguration, + this.clipBehavior = .hardEdge, + this.restorationId, + this.stylusHandwritingEnabled = true, + this.enableIMEPersonalizedLearning = true, + this.contextMenuBuilder, + this.spellCheckConfiguration, + this.magnifierConfiguration, + this.canRequestFocus = true, + this.ignorePointers, + this.undoController, + this.groupId = EditableText, + this.leading, + this.trailing, + this.semanticLabel, + this.semanticHint, + this.excludeSemantics = false, + }) : variant = FortalTextFieldVariant.soft; + + final FortalTextFieldVariant variant; + + final FortalTextFieldSize size; + + final TextEditingController? controller; + + final FocusNode? focusNode; + + final String? label; + + final String? hintText; + + final String? helperText; + + final bool error; + + final TextInputType? keyboardType; + + final TextInputAction? textInputAction; + + final TextCapitalization textCapitalization; + + final TextDirection? textDirection; + + final bool obscureText; + + final bool enabled; + + final bool readOnly; + + final bool autofocus; + + final int? maxLines; + + final int? minLines; + + final bool expands; + + final int? maxLength; + + final MaxLengthEnforcement? maxLengthEnforcement; + + final ValueChanged? onChanged; + + final VoidCallback? onEditingComplete; + + final ValueChanged? onSubmitted; + + final AppPrivateCommandCallback? onAppPrivateCommand; + + final List? inputFormatters; + + final bool? showCursor; + + final String obscuringCharacter; + + final bool autocorrect; + + final bool enableSuggestions; + + final SmartDashesType? smartDashesType; + + final SmartQuotesType? smartQuotesType; + + final DragStartBehavior dragStartBehavior; + + final bool enableInteractiveSelection; + + final TextSelectionControls? selectionControls; + + final GestureTapCallback? onTap; + + final TapRegionCallback? onTapOutside; + + final TapRegionUpCallback? onPressUpOutside; + + final bool onTapAlwaysCalled; + + final ScrollController? scrollController; + + final ScrollPhysics? scrollPhysics; + + final Iterable? autofillHints; + + final ContentInsertionConfiguration? contentInsertionConfiguration; + + final Clip clipBehavior; + + final String? restorationId; + + final bool stylusHandwritingEnabled; + + final bool enableIMEPersonalizedLearning; + + final EditableTextContextMenuBuilder? contextMenuBuilder; + + final SpellCheckConfiguration? spellCheckConfiguration; + + final TextMagnifierConfiguration? magnifierConfiguration; + + final bool canRequestFocus; + + final bool? ignorePointers; + + final UndoHistoryController? undoController; + + final Object groupId; + + final Widget? leading; + + final Widget? trailing; + + final String? semanticLabel; + + final String? semanticHint; + + final bool excludeSemantics; + + @override + Widget build(BuildContext context) { + return fortalTextFieldStyler(variant: this.variant, size: this.size).call( + key: this.key, + controller: this.controller, + focusNode: this.focusNode, + label: this.label, + hintText: this.hintText, + helperText: this.helperText, + error: this.error, + keyboardType: this.keyboardType, + textInputAction: this.textInputAction, + textCapitalization: this.textCapitalization, + textDirection: this.textDirection, + obscureText: this.obscureText, + enabled: this.enabled, + readOnly: this.readOnly, + autofocus: this.autofocus, + maxLines: this.maxLines, + minLines: this.minLines, + expands: this.expands, + maxLength: this.maxLength, + maxLengthEnforcement: this.maxLengthEnforcement, + onChanged: this.onChanged, + onEditingComplete: this.onEditingComplete, + onSubmitted: this.onSubmitted, + onAppPrivateCommand: this.onAppPrivateCommand, + inputFormatters: this.inputFormatters, + showCursor: this.showCursor, + obscuringCharacter: this.obscuringCharacter, + autocorrect: this.autocorrect, + enableSuggestions: this.enableSuggestions, + smartDashesType: this.smartDashesType, + smartQuotesType: this.smartQuotesType, + dragStartBehavior: this.dragStartBehavior, + enableInteractiveSelection: this.enableInteractiveSelection, + selectionControls: this.selectionControls, + onTap: this.onTap, + onTapOutside: this.onTapOutside, + onPressUpOutside: this.onPressUpOutside, + onTapAlwaysCalled: this.onTapAlwaysCalled, + scrollController: this.scrollController, + scrollPhysics: this.scrollPhysics, + autofillHints: this.autofillHints, + contentInsertionConfiguration: this.contentInsertionConfiguration, + clipBehavior: this.clipBehavior, + restorationId: this.restorationId, + stylusHandwritingEnabled: this.stylusHandwritingEnabled, + enableIMEPersonalizedLearning: this.enableIMEPersonalizedLearning, + contextMenuBuilder: this.contextMenuBuilder, + spellCheckConfiguration: this.spellCheckConfiguration, + magnifierConfiguration: this.magnifierConfiguration, + canRequestFocus: this.canRequestFocus, + ignorePointers: this.ignorePointers, + undoController: this.undoController, + groupId: this.groupId, + leading: this.leading, + trailing: this.trailing, + semanticLabel: this.semanticLabel, + semanticHint: this.semanticHint, + excludeSemantics: this.excludeSemantics, + ); + } +} diff --git a/packages/remix/lib/src/components/textfield/textfield.g.dart b/packages/remix/lib/src/components/textfield/textfield.g.dart index 069cf72f..461223e8 100644 --- a/packages/remix/lib/src/components/textfield/textfield.g.dart +++ b/packages/remix/lib/src/components/textfield/textfield.g.dart @@ -190,404 +190,677 @@ mixin _$RemixTextFieldSpec implements Spec, Diagnosticable { typedef _$RemixTextFieldSpecMethods = _$RemixTextFieldSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixTextField]. -class FortalTextField extends StatelessWidget { - const FortalTextField({ - super.key, - this.variant = .surface, - this.size = .size2, - this.controller, - this.focusNode, - this.label, - this.hintText, - this.helperText, - this.error = false, - this.keyboardType, - this.textInputAction, - this.textCapitalization = .none, - this.textDirection, - this.obscureText = false, - this.enabled = true, - this.readOnly = false, - this.autofocus = false, - this.maxLines = 1, - this.minLines, - this.expands = false, - this.maxLength, - this.maxLengthEnforcement, - this.onChanged, - this.onEditingComplete, - this.onSubmitted, - this.onAppPrivateCommand, - this.inputFormatters, - this.showCursor, - this.obscuringCharacter = '•', - this.autocorrect = true, - this.enableSuggestions = true, - this.smartDashesType, - this.smartQuotesType, - this.dragStartBehavior = .start, - this.enableInteractiveSelection = true, - this.selectionControls, - this.onTap, - this.onTapOutside, - this.onPressUpOutside, - this.onTapAlwaysCalled = false, - this.scrollController, - this.scrollPhysics, - this.autofillHints, - this.contentInsertionConfiguration, - this.clipBehavior = .hardEdge, - this.restorationId, - this.stylusHandwritingEnabled = true, - this.enableIMEPersonalizedLearning = true, - this.contextMenuBuilder, - this.spellCheckConfiguration, - this.magnifierConfiguration, - this.canRequestFocus = true, - this.ignorePointers, - this.undoController, - this.groupId = EditableText, - this.leading, - this.trailing, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - }); - - /// Surface treatment with neutral border and text colors. - const FortalTextField.surface({ - super.key, - this.size = .size2, - this.controller, - this.focusNode, - this.label, - this.hintText, - this.helperText, - this.error = false, - this.keyboardType, - this.textInputAction, - this.textCapitalization = .none, - this.textDirection, - this.obscureText = false, - this.enabled = true, - this.readOnly = false, - this.autofocus = false, - this.maxLines = 1, - this.minLines, - this.expands = false, - this.maxLength, - this.maxLengthEnforcement, - this.onChanged, - this.onEditingComplete, - this.onSubmitted, - this.onAppPrivateCommand, - this.inputFormatters, - this.showCursor, - this.obscuringCharacter = '•', - this.autocorrect = true, - this.enableSuggestions = true, - this.smartDashesType, - this.smartQuotesType, - this.dragStartBehavior = .start, - this.enableInteractiveSelection = true, - this.selectionControls, - this.onTap, - this.onTapOutside, - this.onPressUpOutside, - this.onTapAlwaysCalled = false, - this.scrollController, - this.scrollPhysics, - this.autofillHints, - this.contentInsertionConfiguration, - this.clipBehavior = .hardEdge, - this.restorationId, - this.stylusHandwritingEnabled = true, - this.enableIMEPersonalizedLearning = true, - this.contextMenuBuilder, - this.spellCheckConfiguration, - this.magnifierConfiguration, - this.canRequestFocus = true, - this.ignorePointers, - this.undoController, - this.groupId = EditableText, - this.leading, - this.trailing, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - }) : variant = FortalTextFieldVariant.surface; - - /// Soft accent treatment. - const FortalTextField.soft({ - super.key, - this.size = .size2, - this.controller, - this.focusNode, - this.label, - this.hintText, - this.helperText, - this.error = false, - this.keyboardType, - this.textInputAction, - this.textCapitalization = .none, - this.textDirection, - this.obscureText = false, - this.enabled = true, - this.readOnly = false, - this.autofocus = false, - this.maxLines = 1, - this.minLines, - this.expands = false, - this.maxLength, - this.maxLengthEnforcement, - this.onChanged, - this.onEditingComplete, - this.onSubmitted, - this.onAppPrivateCommand, - this.inputFormatters, - this.showCursor, - this.obscuringCharacter = '•', - this.autocorrect = true, - this.enableSuggestions = true, - this.smartDashesType, - this.smartQuotesType, - this.dragStartBehavior = .start, - this.enableInteractiveSelection = true, - this.selectionControls, - this.onTap, - this.onTapOutside, - this.onPressUpOutside, - this.onTapAlwaysCalled = false, - this.scrollController, - this.scrollPhysics, - this.autofillHints, - this.contentInsertionConfiguration, - this.clipBehavior = .hardEdge, - this.restorationId, - this.stylusHandwritingEnabled = true, - this.enableIMEPersonalizedLearning = true, - this.contextMenuBuilder, - this.spellCheckConfiguration, - this.magnifierConfiguration, - this.canRequestFocus = true, - this.ignorePointers, - this.undoController, - this.groupId = EditableText, - this.leading, - this.trailing, - this.semanticLabel, - this.semanticHint, - this.excludeSemantics = false, - }) : variant = FortalTextFieldVariant.soft; - - final FortalTextFieldVariant variant; - - final FortalTextFieldSize size; - - final TextEditingController? controller; - - final FocusNode? focusNode; - - final String? label; - - final String? hintText; - - final String? helperText; - - final bool error; - - final TextInputType? keyboardType; - - final TextInputAction? textInputAction; - - final TextCapitalization textCapitalization; - - final TextDirection? textDirection; - - final bool obscureText; - - final bool enabled; - - final bool readOnly; +class RemixTextFieldStyler + extends MixStyler + with + RemixBoxStylerMixin, + LabelStyleMixin { + final Prop>? $text; + final Prop>? $hintText; + final Prop? $textAlign; + final Prop? $cursorWidth; + final Prop? $cursorHeight; + final Prop? $cursorRadius; + final Prop? $cursorColor; + final Prop? $selectionHeightStyle; + final Prop? $selectionWidthStyle; + final Prop? $scrollPadding; + final Prop? $keyboardAppearance; + final Prop? $cursorOpacityAnimates; + final Prop>? $container; + final Prop>? $layout; + final Prop>? $helperText; + final Prop>? $label; + + const RemixTextFieldStyler.create({ + Prop>? text, + Prop>? hintText, + Prop? textAlign, + Prop? cursorWidth, + Prop? cursorHeight, + Prop? cursorRadius, + Prop? cursorColor, + Prop? selectionHeightStyle, + Prop? selectionWidthStyle, + Prop? scrollPadding, + Prop? keyboardAppearance, + Prop? cursorOpacityAnimates, + Prop>? container, + Prop>? layout, + Prop>? helperText, + Prop>? label, + super.variants, + super.modifier, + super.animation, + }) : $text = text, + $hintText = hintText, + $textAlign = textAlign, + $cursorWidth = cursorWidth, + $cursorHeight = cursorHeight, + $cursorRadius = cursorRadius, + $cursorColor = cursorColor, + $selectionHeightStyle = selectionHeightStyle, + $selectionWidthStyle = selectionWidthStyle, + $scrollPadding = scrollPadding, + $keyboardAppearance = keyboardAppearance, + $cursorOpacityAnimates = cursorOpacityAnimates, + $container = container, + $layout = layout, + $helperText = helperText, + $label = label; + + RemixTextFieldStyler({ + TextStyler? text, + TextStyler? hintText, + TextAlign? textAlign, + double? cursorWidth, + double? cursorHeight, + Radius? cursorRadius, + Color? cursorColor, + BoxHeightStyle? selectionHeightStyle, + BoxWidthStyle? selectionWidthStyle, + EdgeInsets? scrollPadding, + Brightness? keyboardAppearance, + bool? cursorOpacityAnimates, + FlexBoxStyler? container, + FlexBoxStyler? layout, + TextStyler? helperText, + TextStyler? label, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + text: Prop.maybeMix(text), + hintText: Prop.maybeMix(hintText), + textAlign: Prop.maybe(textAlign), + cursorWidth: Prop.maybe(cursorWidth), + cursorHeight: Prop.maybe(cursorHeight), + cursorRadius: Prop.maybe(cursorRadius), + cursorColor: Prop.maybe(cursorColor), + selectionHeightStyle: Prop.maybe(selectionHeightStyle), + selectionWidthStyle: Prop.maybe(selectionWidthStyle), + scrollPadding: Prop.maybe(scrollPadding), + keyboardAppearance: Prop.maybe(keyboardAppearance), + cursorOpacityAnimates: Prop.maybe(cursorOpacityAnimates), + container: Prop.maybeMix(container), + layout: Prop.maybeMix(layout), + helperText: Prop.maybeMix(helperText), + label: Prop.maybeMix(label), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixTextFieldStyler.text(TextStyler value) => + RemixTextFieldStyler().text(value); + factory RemixTextFieldStyler.hintText(TextStyler value) => + RemixTextFieldStyler().hintText(value); + factory RemixTextFieldStyler.textAlign(TextAlign value) => + RemixTextFieldStyler().textAlign(value); + factory RemixTextFieldStyler.cursorWidth(double value) => + RemixTextFieldStyler().cursorWidth(value); + factory RemixTextFieldStyler.cursorHeight(double value) => + RemixTextFieldStyler().cursorHeight(value); + factory RemixTextFieldStyler.cursorRadius(Radius value) => + RemixTextFieldStyler().cursorRadius(value); + factory RemixTextFieldStyler.cursorColor(Color value) => + RemixTextFieldStyler().cursorColor(value); + factory RemixTextFieldStyler.selectionHeightStyle(BoxHeightStyle value) => + RemixTextFieldStyler().selectionHeightStyle(value); + factory RemixTextFieldStyler.selectionWidthStyle(BoxWidthStyle value) => + RemixTextFieldStyler().selectionWidthStyle(value); + factory RemixTextFieldStyler.scrollPadding(EdgeInsets value) => + RemixTextFieldStyler().scrollPadding(value); + factory RemixTextFieldStyler.keyboardAppearance(Brightness value) => + RemixTextFieldStyler().keyboardAppearance(value); + factory RemixTextFieldStyler.cursorOpacityAnimates(bool value) => + RemixTextFieldStyler().cursorOpacityAnimates(value); + factory RemixTextFieldStyler.container(FlexBoxStyler value) => + RemixTextFieldStyler().container(value); + factory RemixTextFieldStyler.layout(FlexBoxStyler value) => + RemixTextFieldStyler().layout(value); + factory RemixTextFieldStyler.helperText(TextStyler value) => + RemixTextFieldStyler().helperText(value); + factory RemixTextFieldStyler.label(TextStyler value) => + RemixTextFieldStyler().label(value); + factory RemixTextFieldStyler.color(Color value) => + RemixTextFieldStyler().color(value); + factory RemixTextFieldStyler.gradient(GradientMix value) => + RemixTextFieldStyler().gradient(value); + factory RemixTextFieldStyler.border(BoxBorderMix value) => + RemixTextFieldStyler().border(value); + factory RemixTextFieldStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixTextFieldStyler().borderRadius(value); + factory RemixTextFieldStyler.elevation(ElevationShadow value) => + RemixTextFieldStyler().elevation(value); + factory RemixTextFieldStyler.shadow(BoxShadowMix value) => + RemixTextFieldStyler().shadow(value); + factory RemixTextFieldStyler.shadows(List value) => + RemixTextFieldStyler().shadows(value); + factory RemixTextFieldStyler.width(double value) => + RemixTextFieldStyler().width(value); + factory RemixTextFieldStyler.height(double value) => + RemixTextFieldStyler().height(value); + factory RemixTextFieldStyler.size(double width, double height) => + RemixTextFieldStyler().size(width, height); + factory RemixTextFieldStyler.minWidth(double value) => + RemixTextFieldStyler().minWidth(value); + factory RemixTextFieldStyler.maxWidth(double value) => + RemixTextFieldStyler().maxWidth(value); + factory RemixTextFieldStyler.minHeight(double value) => + RemixTextFieldStyler().minHeight(value); + factory RemixTextFieldStyler.maxHeight(double value) => + RemixTextFieldStyler().maxHeight(value); + factory RemixTextFieldStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixTextFieldStyler().scale(scale, alignment: alignment); + factory RemixTextFieldStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixTextFieldStyler().rotate(radians, alignment: alignment); + factory RemixTextFieldStyler.translate( + double x, + double y, [ + double z = 0.0, + ]) => RemixTextFieldStyler().translate(x, y, z); + factory RemixTextFieldStyler.skew(double skewX, double skewY) => + RemixTextFieldStyler().skew(skewX, skewY); + factory RemixTextFieldStyler.textStyle(TextStyler value) => + RemixTextFieldStyler().textStyle(value); + factory RemixTextFieldStyler.image(DecorationImageMix value) => + RemixTextFieldStyler().image(value); + factory RemixTextFieldStyler.shape(ShapeBorderMix value) => + RemixTextFieldStyler().shape(value); + factory RemixTextFieldStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTextFieldStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTextFieldStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTextFieldStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTextFieldStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTextFieldStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTextFieldStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixTextFieldStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixTextFieldStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixTextFieldStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixTextFieldStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixTextFieldStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixTextFieldStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixTextFieldStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixTextFieldStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixTextFieldStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixTextFieldStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixTextFieldStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixTextFieldStyler.row() => RemixTextFieldStyler().row(); + factory RemixTextFieldStyler.column() => RemixTextFieldStyler().column(); + factory RemixTextFieldStyler.alignment(AlignmentGeometry value) => + RemixTextFieldStyler().alignment(value); + factory RemixTextFieldStyler.padding(EdgeInsetsGeometryMix value) => + RemixTextFieldStyler().padding(value); + factory RemixTextFieldStyler.margin(EdgeInsetsGeometryMix value) => + RemixTextFieldStyler().margin(value); + factory RemixTextFieldStyler.constraints(BoxConstraintsMix value) => + RemixTextFieldStyler().constraints(value); + factory RemixTextFieldStyler.decoration(DecorationMix value) => + RemixTextFieldStyler().decoration(value); + factory RemixTextFieldStyler.foregroundDecoration(DecorationMix value) => + RemixTextFieldStyler().foregroundDecoration(value); + factory RemixTextFieldStyler.clipBehavior(Clip value) => + RemixTextFieldStyler().clipBehavior(value); + factory RemixTextFieldStyler.direction(Axis value) => + RemixTextFieldStyler().direction(value); + factory RemixTextFieldStyler.mainAxisAlignment(MainAxisAlignment value) => + RemixTextFieldStyler().mainAxisAlignment(value); + factory RemixTextFieldStyler.crossAxisAlignment(CrossAxisAlignment value) => + RemixTextFieldStyler().crossAxisAlignment(value); + factory RemixTextFieldStyler.mainAxisSize(MainAxisSize value) => + RemixTextFieldStyler().mainAxisSize(value); + factory RemixTextFieldStyler.spacing(double value) => + RemixTextFieldStyler().spacing(value); + factory RemixTextFieldStyler.verticalDirection(VerticalDirection value) => + RemixTextFieldStyler().verticalDirection(value); + factory RemixTextFieldStyler.textDirection(TextDirection value) => + RemixTextFieldStyler().textDirection(value); + factory RemixTextFieldStyler.textBaseline(TextBaseline value) => + RemixTextFieldStyler().textBaseline(value); + factory RemixTextFieldStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixTextFieldStyler().transform(value, alignment: alignment); + + RemixTextFieldStyler color(Color value) { + return container(FlexBoxStyler().color(value)); + } - final bool autofocus; + RemixTextFieldStyler gradient(GradientMix value) { + return container(FlexBoxStyler().gradient(value)); + } - final int? maxLines; + RemixTextFieldStyler border(BoxBorderMix value) { + return container(FlexBoxStyler().border(value)); + } - final int? minLines; + RemixTextFieldStyler borderRadius(BorderRadiusGeometryMix value) { + return container(FlexBoxStyler().borderRadius(value)); + } - final bool expands; + RemixTextFieldStyler elevation(ElevationShadow value) { + return container(FlexBoxStyler().elevation(value)); + } - final int? maxLength; + RemixTextFieldStyler shadow(BoxShadowMix value) { + return container(FlexBoxStyler().shadow(value)); + } - final MaxLengthEnforcement? maxLengthEnforcement; + RemixTextFieldStyler shadows(List value) { + return container(FlexBoxStyler().shadows(value)); + } - final ValueChanged? onChanged; + RemixTextFieldStyler width(double value) { + return container(FlexBoxStyler().width(value)); + } - final VoidCallback? onEditingComplete; + RemixTextFieldStyler height(double value) { + return container(FlexBoxStyler().height(value)); + } - final ValueChanged? onSubmitted; + RemixTextFieldStyler size(double width, double height) { + return container(FlexBoxStyler().size(width, height)); + } - final AppPrivateCommandCallback? onAppPrivateCommand; + RemixTextFieldStyler minWidth(double value) { + return container(FlexBoxStyler().minWidth(value)); + } - final List? inputFormatters; + RemixTextFieldStyler maxWidth(double value) { + return container(FlexBoxStyler().maxWidth(value)); + } - final bool? showCursor; + RemixTextFieldStyler minHeight(double value) { + return container(FlexBoxStyler().minHeight(value)); + } - final String obscuringCharacter; + RemixTextFieldStyler maxHeight(double value) { + return container(FlexBoxStyler().maxHeight(value)); + } - final bool autocorrect; + RemixTextFieldStyler scale(double scale, {Alignment alignment = .center}) { + return container(FlexBoxStyler().scale(scale, alignment: alignment)); + } - final bool enableSuggestions; + RemixTextFieldStyler rotate(double radians, {Alignment alignment = .center}) { + return container(FlexBoxStyler().rotate(radians, alignment: alignment)); + } - final SmartDashesType? smartDashesType; + RemixTextFieldStyler translate(double x, double y, [double z = 0.0]) { + return container(FlexBoxStyler().translate(x, y, z)); + } - final SmartQuotesType? smartQuotesType; + RemixTextFieldStyler skew(double skewX, double skewY) { + return container(FlexBoxStyler().skew(skewX, skewY)); + } - final DragStartBehavior dragStartBehavior; + RemixTextFieldStyler textStyle(TextStyler value) { + return container(FlexBoxStyler().textStyle(value)); + } - final bool enableInteractiveSelection; + RemixTextFieldStyler image(DecorationImageMix value) { + return container(FlexBoxStyler().image(value)); + } - final TextSelectionControls? selectionControls; + RemixTextFieldStyler shape(ShapeBorderMix value) { + return container(FlexBoxStyler().shape(value)); + } - final GestureTapCallback? onTap; + RemixTextFieldStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } - final TapRegionCallback? onTapOutside; + RemixTextFieldStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } - final TapRegionUpCallback? onPressUpOutside; + RemixTextFieldStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } - final bool onTapAlwaysCalled; + RemixTextFieldStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } - final ScrollController? scrollController; + RemixTextFieldStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } - final ScrollPhysics? scrollPhysics; + RemixTextFieldStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } - final Iterable? autofillHints; + RemixTextFieldStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } - final ContentInsertionConfiguration? contentInsertionConfiguration; + RemixTextFieldStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } - final Clip clipBehavior; + RemixTextFieldStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } - final String? restorationId; + RemixTextFieldStyler row() { + return container(FlexBoxStyler().row()); + } - final bool stylusHandwritingEnabled; + RemixTextFieldStyler column() { + return container(FlexBoxStyler().column()); + } - final bool enableIMEPersonalizedLearning; + RemixTextFieldStyler alignment(AlignmentGeometry value) { + return container(FlexBoxStyler().alignment(value)); + } - final EditableTextContextMenuBuilder? contextMenuBuilder; + RemixTextFieldStyler padding(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().padding(value)); + } - final SpellCheckConfiguration? spellCheckConfiguration; + RemixTextFieldStyler margin(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().margin(value)); + } - final TextMagnifierConfiguration? magnifierConfiguration; + RemixTextFieldStyler constraints(BoxConstraintsMix value) { + return container(FlexBoxStyler().constraints(value)); + } - final bool canRequestFocus; + RemixTextFieldStyler decoration(DecorationMix value) { + return container(FlexBoxStyler().decoration(value)); + } - final bool? ignorePointers; + RemixTextFieldStyler foregroundDecoration(DecorationMix value) { + return container(FlexBoxStyler().foregroundDecoration(value)); + } - final UndoHistoryController? undoController; + RemixTextFieldStyler clipBehavior(Clip value) { + return container(FlexBoxStyler().clipBehavior(value)); + } - final Object groupId; + RemixTextFieldStyler direction(Axis value) { + return container(FlexBoxStyler().direction(value)); + } - final Widget? leading; + RemixTextFieldStyler mainAxisAlignment(MainAxisAlignment value) { + return container(FlexBoxStyler().mainAxisAlignment(value)); + } - final Widget? trailing; + RemixTextFieldStyler crossAxisAlignment(CrossAxisAlignment value) { + return container(FlexBoxStyler().crossAxisAlignment(value)); + } - final String? semanticLabel; + RemixTextFieldStyler mainAxisSize(MainAxisSize value) { + return container(FlexBoxStyler().mainAxisSize(value)); + } - final String? semanticHint; + RemixTextFieldStyler spacing(double value) { + return container(FlexBoxStyler().spacing(value)); + } - final bool excludeSemantics; + RemixTextFieldStyler verticalDirection(VerticalDirection value) { + return container(FlexBoxStyler().verticalDirection(value)); + } - @override - Widget build(BuildContext context) { - return fortalTextFieldStyler(variant: this.variant, size: this.size).call( - key: this.key, - controller: this.controller, - focusNode: this.focusNode, - label: this.label, - hintText: this.hintText, - helperText: this.helperText, - error: this.error, - keyboardType: this.keyboardType, - textInputAction: this.textInputAction, - textCapitalization: this.textCapitalization, - textDirection: this.textDirection, - obscureText: this.obscureText, - enabled: this.enabled, - readOnly: this.readOnly, - autofocus: this.autofocus, - maxLines: this.maxLines, - minLines: this.minLines, - expands: this.expands, - maxLength: this.maxLength, - maxLengthEnforcement: this.maxLengthEnforcement, - onChanged: this.onChanged, - onEditingComplete: this.onEditingComplete, - onSubmitted: this.onSubmitted, - onAppPrivateCommand: this.onAppPrivateCommand, - inputFormatters: this.inputFormatters, - showCursor: this.showCursor, - obscuringCharacter: this.obscuringCharacter, - autocorrect: this.autocorrect, - enableSuggestions: this.enableSuggestions, - smartDashesType: this.smartDashesType, - smartQuotesType: this.smartQuotesType, - dragStartBehavior: this.dragStartBehavior, - enableInteractiveSelection: this.enableInteractiveSelection, - selectionControls: this.selectionControls, - onTap: this.onTap, - onTapOutside: this.onTapOutside, - onPressUpOutside: this.onPressUpOutside, - onTapAlwaysCalled: this.onTapAlwaysCalled, - scrollController: this.scrollController, - scrollPhysics: this.scrollPhysics, - autofillHints: this.autofillHints, - contentInsertionConfiguration: this.contentInsertionConfiguration, - clipBehavior: this.clipBehavior, - restorationId: this.restorationId, - stylusHandwritingEnabled: this.stylusHandwritingEnabled, - enableIMEPersonalizedLearning: this.enableIMEPersonalizedLearning, - contextMenuBuilder: this.contextMenuBuilder, - spellCheckConfiguration: this.spellCheckConfiguration, - magnifierConfiguration: this.magnifierConfiguration, - canRequestFocus: this.canRequestFocus, - ignorePointers: this.ignorePointers, - undoController: this.undoController, - groupId: this.groupId, - leading: this.leading, - trailing: this.trailing, - semanticLabel: this.semanticLabel, - semanticHint: this.semanticHint, - excludeSemantics: this.excludeSemantics, - ); + RemixTextFieldStyler textDirection(TextDirection value) { + return container(FlexBoxStyler().textDirection(value)); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixTextFieldStyler textBaseline(TextBaseline value) { + return container(FlexBoxStyler().textBaseline(value)); + } -mixin _$RemixTextFieldStylerMixin on Style, Diagnosticable { - Prop>? get $text; - Prop>? get $hintText; - Prop? get $textAlign; - Prop? get $cursorWidth; - Prop? get $cursorHeight; - Prop? get $cursorRadius; - Prop? get $cursorColor; - Prop? get $cursorOpacityAnimates; - Prop? get $selectionHeightStyle; - Prop? get $selectionWidthStyle; - Prop? get $scrollPadding; - Prop? get $keyboardAppearance; - Prop>? get $container; - Prop>? get $layout; - Prop>? get $helperText; - Prop>? get $label; + RemixTextFieldStyler transform( + Matrix4 value, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().transform(value, alignment: alignment)); + } /// Sets the text. RemixTextFieldStyler text(TextStyler value) { @@ -624,11 +897,6 @@ mixin _$RemixTextFieldStylerMixin on Style, Diagnosticable { return merge(RemixTextFieldStyler(cursorColor: value)); } - /// Sets the cursorOpacityAnimates. - RemixTextFieldStyler cursorOpacityAnimates(bool value) { - return merge(RemixTextFieldStyler(cursorOpacityAnimates: value)); - } - /// Sets the selectionHeightStyle. RemixTextFieldStyler selectionHeightStyle(BoxHeightStyle value) { return merge(RemixTextFieldStyler(selectionHeightStyle: value)); @@ -649,6 +917,11 @@ mixin _$RemixTextFieldStylerMixin on Style, Diagnosticable { return merge(RemixTextFieldStyler(keyboardAppearance: value)); } + /// Sets the cursorOpacityAnimates. + RemixTextFieldStyler cursorOpacityAnimates(bool value) { + return merge(RemixTextFieldStyler(cursorOpacityAnimates: value)); + } + /// Sets the container. RemixTextFieldStyler container(FlexBoxStyler value) { return merge(RemixTextFieldStyler(container: value)); @@ -665,21 +938,25 @@ mixin _$RemixTextFieldStylerMixin on Style, Diagnosticable { } /// Sets the label. + @override RemixTextFieldStyler label(TextStyler value) { return merge(RemixTextFieldStyler(label: value)); } /// Sets the animation configuration. + @override RemixTextFieldStyler animate(AnimationConfig value) { return merge(RemixTextFieldStyler(animation: value)); } /// Sets the style variants. + @override RemixTextFieldStyler variants(List> value) { return merge(RemixTextFieldStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixTextFieldStyler wrap(WidgetModifierConfig value) { return merge(RemixTextFieldStyler(modifier: value)); } @@ -700,10 +977,6 @@ mixin _$RemixTextFieldStylerMixin on Style, Diagnosticable { cursorHeight: MixOps.merge($cursorHeight, other?.$cursorHeight), cursorRadius: MixOps.merge($cursorRadius, other?.$cursorRadius), cursorColor: MixOps.merge($cursorColor, other?.$cursorColor), - cursorOpacityAnimates: MixOps.merge( - $cursorOpacityAnimates, - other?.$cursorOpacityAnimates, - ), selectionHeightStyle: MixOps.merge( $selectionHeightStyle, other?.$selectionHeightStyle, @@ -717,6 +990,10 @@ mixin _$RemixTextFieldStylerMixin on Style, Diagnosticable { $keyboardAppearance, other?.$keyboardAppearance, ), + cursorOpacityAnimates: MixOps.merge( + $cursorOpacityAnimates, + other?.$cursorOpacityAnimates, + ), container: MixOps.merge($container, other?.$container), layout: MixOps.merge($layout, other?.$layout), helperText: MixOps.merge($helperText, other?.$helperText), @@ -738,11 +1015,11 @@ mixin _$RemixTextFieldStylerMixin on Style, Diagnosticable { cursorHeight: MixOps.resolve(context, $cursorHeight), cursorRadius: MixOps.resolve(context, $cursorRadius), cursorColor: MixOps.resolve(context, $cursorColor), - cursorOpacityAnimates: MixOps.resolve(context, $cursorOpacityAnimates), selectionHeightStyle: MixOps.resolve(context, $selectionHeightStyle), selectionWidthStyle: MixOps.resolve(context, $selectionWidthStyle), scrollPadding: MixOps.resolve(context, $scrollPadding), keyboardAppearance: MixOps.resolve(context, $keyboardAppearance), + cursorOpacityAnimates: MixOps.resolve(context, $cursorOpacityAnimates), container: MixOps.resolve(context, $container), layout: MixOps.resolve(context, $layout), helperText: MixOps.resolve(context, $helperText), @@ -767,13 +1044,13 @@ mixin _$RemixTextFieldStylerMixin on Style, Diagnosticable { ..add(DiagnosticsProperty('cursorHeight', $cursorHeight)) ..add(DiagnosticsProperty('cursorRadius', $cursorRadius)) ..add(DiagnosticsProperty('cursorColor', $cursorColor)) - ..add( - DiagnosticsProperty('cursorOpacityAnimates', $cursorOpacityAnimates), - ) ..add(DiagnosticsProperty('selectionHeightStyle', $selectionHeightStyle)) ..add(DiagnosticsProperty('selectionWidthStyle', $selectionWidthStyle)) ..add(DiagnosticsProperty('scrollPadding', $scrollPadding)) ..add(DiagnosticsProperty('keyboardAppearance', $keyboardAppearance)) + ..add( + DiagnosticsProperty('cursorOpacityAnimates', $cursorOpacityAnimates), + ) ..add(DiagnosticsProperty('container', $container)) ..add(DiagnosticsProperty('layout', $layout)) ..add(DiagnosticsProperty('helperText', $helperText)) @@ -789,11 +1066,11 @@ mixin _$RemixTextFieldStylerMixin on Style, Diagnosticable { $cursorHeight, $cursorRadius, $cursorColor, - $cursorOpacityAnimates, $selectionHeightStyle, $selectionWidthStyle, $scrollPadding, $keyboardAppearance, + $cursorOpacityAnimates, $container, $layout, $helperText, diff --git a/packages/remix/lib/src/components/textfield/textfield_spec.dart b/packages/remix/lib/src/components/textfield/textfield_spec.dart index 81a2f470..7c82f5b9 100644 --- a/packages/remix/lib/src/components/textfield/textfield_spec.dart +++ b/packages/remix/lib/src/components/textfield/textfield_spec.dart @@ -49,7 +49,7 @@ part of 'textfield.dart'; /// - [RemixTextFieldStyler] for the styling API /// - [RemixTextField] for the widget implementation /// - [Spec] for the base specification pattern -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin, LabelStyleMixin]) class RemixTextFieldSpec with _$RemixTextFieldSpec { /// Styling specification for the input text. /// @@ -140,6 +140,7 @@ class RemixTextFieldSpec with _$RemixTextFieldSpec { /// and other visual container properties. Uses [FlexBoxSpec] /// to support flexible layout arrangements. @override + @MixableField(forwardStyler: true) final StyleSpec container; /// Styling specification for the vertical layout that wraps the label, diff --git a/packages/remix/lib/src/components/textfield/textfield_style.dart b/packages/remix/lib/src/components/textfield/textfield_style.dart index 538ea999..df2ce800 100644 --- a/packages/remix/lib/src/components/textfield/textfield_style.dart +++ b/packages/remix/lib/src/components/textfield/textfield_style.dart @@ -4,129 +4,12 @@ part of 'textfield.dart'; /// /// Use this class to style the text field container, text, hint text, helper /// text, label, cursor, selection behavior, and spacing. -@MixableStyler() -class RemixTextFieldStyler - extends RemixFlexContainerStyler - with - LabelStyleMixin, - Diagnosticable, - _$RemixTextFieldStylerMixin { - @MixableField(setterType: TextStyler) - final Prop>? $text; - @MixableField(setterType: TextStyler) - final Prop>? $hintText; - @MixableField() - final Prop? $textAlign; - @MixableField() - final Prop? $cursorWidth; - @MixableField() - final Prop? $cursorHeight; - @MixableField() - final Prop? $cursorRadius; - @MixableField() - final Prop? $cursorColor; - @MixableField() - final Prop? $cursorOpacityAnimates; - @MixableField() - final Prop? $selectionHeightStyle; - @MixableField() - final Prop? $selectionWidthStyle; - @MixableField() - final Prop? $scrollPadding; - @MixableField() - final Prop? $keyboardAppearance; - @MixableField(setterType: FlexBoxStyler) - final Prop>? $container; - @MixableField(setterType: FlexBoxStyler) - final Prop>? $layout; - @MixableField(setterType: TextStyler) - final Prop>? $helperText; - @MixableField(setterType: TextStyler) - final Prop>? $label; - - const RemixTextFieldStyler.create({ - Prop>? text, - Prop>? hintText, - Prop? textAlign, - Prop? cursorWidth, - Prop? cursorHeight, - Prop? cursorRadius, - Prop? cursorColor, - Prop? cursorOpacityAnimates, - Prop? selectionHeightStyle, - Prop? selectionWidthStyle, - Prop? scrollPadding, - Prop? keyboardAppearance, - Prop>? container, - Prop>? layout, - Prop>? helperText, - Prop>? label, - super.variants, - super.animation, - super.modifier, - }) : $text = text, - $hintText = hintText, - $textAlign = textAlign, - $cursorWidth = cursorWidth, - $cursorHeight = cursorHeight, - $cursorRadius = cursorRadius, - $cursorColor = cursorColor, - $cursorOpacityAnimates = cursorOpacityAnimates, - $selectionHeightStyle = selectionHeightStyle, - $selectionWidthStyle = selectionWidthStyle, - $scrollPadding = scrollPadding, - $keyboardAppearance = keyboardAppearance, - $container = container, - $layout = layout, - $helperText = helperText, - $label = label; - - RemixTextFieldStyler({ - TextStyler? text, - TextStyler? hintText, - TextAlign? textAlign, - double? cursorWidth, - double? cursorHeight, - Radius? cursorRadius, - Color? cursorColor, - bool? cursorOpacityAnimates, - BoxHeightStyle? selectionHeightStyle, - BoxWidthStyle? selectionWidthStyle, - EdgeInsets? scrollPadding, - Brightness? keyboardAppearance, - FlexBoxStyler? container, - FlexBoxStyler? layout, - TextStyler? helperText, - TextStyler? label, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - text: Prop.maybeMix(text), - hintText: Prop.maybeMix(hintText), - textAlign: Prop.maybe(textAlign), - cursorWidth: Prop.maybe(cursorWidth), - cursorHeight: Prop.maybe(cursorHeight), - cursorRadius: Prop.maybe(cursorRadius), - cursorColor: Prop.maybe(cursorColor), - cursorOpacityAnimates: Prop.maybe(cursorOpacityAnimates), - selectionHeightStyle: Prop.maybe(selectionHeightStyle), - selectionWidthStyle: Prop.maybe(selectionWidthStyle), - scrollPadding: Prop.maybe(scrollPadding), - keyboardAppearance: Prop.maybe(keyboardAppearance), - container: Prop.maybeMix(container), - layout: Prop.maybeMix(layout), - helperText: Prop.maybeMix(helperText), - label: Prop.maybeMix(label), - variants: variants, - animation: animation, - modifier: modifier, - ); - - // Instance methods (chainable) - - /// Sets text color - RemixTextFieldStyler color(Color value) { +extension RemixTextFieldStylerRemixHelpers on RemixTextFieldStyler { + /// Sets the editable text color. + /// + /// Use [RemixTextFieldStyler.color] for the generated container color + /// shortcut. + RemixTextFieldStyler textColor(Color value) { return merge( RemixTextFieldStyler( text: TextStyler(style: TextStyleMix(color: value)), @@ -143,65 +26,6 @@ class RemixTextFieldStyler ); } - /// Sets container that wraps editable text area - RemixTextFieldStyler container(FlexBoxStyler value) { - return merge(RemixTextFieldStyler(container: value)); - } - - /// Sets border radius - RemixTextFieldStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixTextFieldStyler( - container: FlexBoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - - /// Sets padding - RemixTextFieldStyler padding(EdgeInsetsGeometryMix value) { - return merge( - RemixTextFieldStyler(container: FlexBoxStyler(padding: value)), - ); - } - - /// Sets border - RemixTextFieldStyler border(BoxBorderMix value) { - return merge( - RemixTextFieldStyler( - container: FlexBoxStyler(decoration: BoxDecorationMix(border: value)), - ), - ); - } - - /// Sets width - RemixTextFieldStyler width(double value) { - return merge( - RemixTextFieldStyler( - container: FlexBoxStyler( - constraints: BoxConstraintsMix(minWidth: value, maxWidth: value), - ), - ), - ); - } - - /// Sets height - RemixTextFieldStyler height(double value) { - return merge( - RemixTextFieldStyler( - container: FlexBoxStyler( - constraints: BoxConstraintsMix(minHeight: value, maxHeight: value), - ), - ), - ); - } - - /// Sets cursor color - RemixTextFieldStyler cursorColor(Color value) { - return merge(RemixTextFieldStyler(cursorColor: value)); - } - /// Sets hint text color RemixTextFieldStyler hintColor(Color value) { return merge( @@ -211,56 +35,6 @@ class RemixTextFieldStyler ); } - /// Sets hint text color - RemixTextFieldStyler hintText(TextStyler value) { - return merge(RemixTextFieldStyler(hintText: value)); - } - - // Additional convenience methods that delegate to container - - /// Sets margin - RemixTextFieldStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixTextFieldStyler(container: FlexBoxStyler(margin: value))); - } - - /// Sets flex spacing - RemixTextFieldStyler spacing(double value) { - return merge( - RemixTextFieldStyler(container: FlexBoxStyler(spacing: value)), - ); - } - - /// Sets decoration - RemixTextFieldStyler decoration(DecorationMix value) { - return merge( - RemixTextFieldStyler(container: FlexBoxStyler(decoration: value)), - ); - } - - /// Sets container alignment - RemixTextFieldStyler alignment(Alignment value) { - return merge( - RemixTextFieldStyler(container: FlexBoxStyler(alignment: value)), - ); - } - - /// Sets constraints - RemixTextFieldStyler constraints(BoxConstraintsMix value) { - return merge( - RemixTextFieldStyler(container: FlexBoxStyler(constraints: value)), - ); - } - - /// Sets text alignment - RemixTextFieldStyler textAlign(TextAlign value) { - return merge(RemixTextFieldStyler(textAlign: value)); - } - - /// Sets helper text - RemixTextFieldStyler helperText(TextStyler value) { - return merge(RemixTextFieldStyler(helperText: value)); - } - /// Creates a [RemixTextField] widget with this style applied. /// /// Example: @@ -398,40 +172,6 @@ class RemixTextFieldStyler ); } - /// Sets label text - @override - RemixTextFieldStyler label(TextStyler value) { - return merge(RemixTextFieldStyler(label: value)); - } - - // Abstract method implementations for mixins - - @override - RemixTextFieldStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixTextFieldStyler( - container: FlexBoxStyler(foregroundDecoration: value), - ), - ); - } - - @override - RemixTextFieldStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixTextFieldStyler( - container: FlexBoxStyler( - transform: value, - transformAlignment: alignment, - ), - ), - ); - } - - // FlexStyleMixin implementation - @override RemixTextFieldStyler flex(FlexStyler value) { return merge(RemixTextFieldStyler(container: FlexBoxStyler().flex(value))); } diff --git a/packages/remix/lib/src/components/toggle/fortal_toggle_styles.dart b/packages/remix/lib/src/components/toggle/fortal_toggle_styles.dart index a58b41e4..a2c1a01f 100644 --- a/packages/remix/lib/src/components/toggle/fortal_toggle_styles.dart +++ b/packages/remix/lib/src/components/toggle/fortal_toggle_styles.dart @@ -7,7 +7,6 @@ enum FortalToggleSize { size1, size2, size3 } enum FortalToggleVariant { ghost, outline } /// Fortal-themed preset for [RemixToggle]. -@MixWidget(name: 'FortalToggle') RemixToggleStyler fortalToggleStyler({ FortalToggleVariant variant = .ghost, FortalToggleSize size = .size2, @@ -99,3 +98,93 @@ RemixToggleStyler _fortalToggleSizeStyler(FortalToggleSize size) { ), }; } + +/// Fortal-themed preset for [RemixToggle]. +class FortalToggle extends StatelessWidget { + const FortalToggle({ + super.key, + this.variant = .ghost, + this.size = .size2, + required this.selected, + this.onChanged, + this.enabled = true, + this.label, + this.icon, + this.enableFeedback = true, + this.focusNode, + this.autofocus = false, + this.semanticLabel, + this.mouseCursor = SystemMouseCursors.click, + }); + + const FortalToggle.ghost({ + super.key, + this.size = .size2, + required this.selected, + this.onChanged, + this.enabled = true, + this.label, + this.icon, + this.enableFeedback = true, + this.focusNode, + this.autofocus = false, + this.semanticLabel, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalToggleVariant.ghost; + + const FortalToggle.outline({ + super.key, + this.size = .size2, + required this.selected, + this.onChanged, + this.enabled = true, + this.label, + this.icon, + this.enableFeedback = true, + this.focusNode, + this.autofocus = false, + this.semanticLabel, + this.mouseCursor = SystemMouseCursors.click, + }) : variant = FortalToggleVariant.outline; + + final FortalToggleVariant variant; + + final FortalToggleSize size; + + final bool selected; + + final ValueChanged? onChanged; + + final bool enabled; + + final String? label; + + final IconData? icon; + + final bool enableFeedback; + + final FocusNode? focusNode; + + final bool autofocus; + + final String? semanticLabel; + + final MouseCursor mouseCursor; + + @override + Widget build(BuildContext context) { + return fortalToggleStyler(variant: this.variant, size: this.size).call( + key: this.key, + selected: this.selected, + onChanged: this.onChanged, + enabled: this.enabled, + label: this.label, + icon: this.icon, + enableFeedback: this.enableFeedback, + focusNode: this.focusNode, + autofocus: this.autofocus, + semanticLabel: this.semanticLabel, + mouseCursor: this.mouseCursor, + ); + } +} diff --git a/packages/remix/lib/src/components/toggle/toggle.g.dart b/packages/remix/lib/src/components/toggle/toggle.g.dart index 51c604ef..d1314fa6 100644 --- a/packages/remix/lib/src/components/toggle/toggle.g.dart +++ b/packages/remix/lib/src/components/toggle/toggle.g.dart @@ -91,107 +91,580 @@ mixin _$RemixToggleSpec implements Spec, Diagnosticable { typedef _$RemixToggleSpecMethods = _$RemixToggleSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixToggle]. -class FortalToggle extends StatelessWidget { - const FortalToggle({ - super.key, - this.variant = .ghost, - this.size = .size2, - required this.selected, - this.onChanged, - this.enabled = true, - this.label, - this.icon, - this.enableFeedback = true, - this.focusNode, - this.autofocus = false, - this.semanticLabel, - this.mouseCursor = SystemMouseCursors.click, - }); - - const FortalToggle.ghost({ - super.key, - this.size = .size2, - required this.selected, - this.onChanged, - this.enabled = true, - this.label, - this.icon, - this.enableFeedback = true, - this.focusNode, - this.autofocus = false, - this.semanticLabel, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalToggleVariant.ghost; - - const FortalToggle.outline({ - super.key, - this.size = .size2, - required this.selected, - this.onChanged, - this.enabled = true, - this.label, - this.icon, - this.enableFeedback = true, - this.focusNode, - this.autofocus = false, - this.semanticLabel, - this.mouseCursor = SystemMouseCursors.click, - }) : variant = FortalToggleVariant.outline; - - final FortalToggleVariant variant; - - final FortalToggleSize size; - - final bool selected; - - final ValueChanged? onChanged; - - final bool enabled; - - final String? label; - - final IconData? icon; - - final bool enableFeedback; - - final FocusNode? focusNode; - - final bool autofocus; - - final String? semanticLabel; - - final MouseCursor mouseCursor; +class RemixToggleStyler extends MixStyler + with + RemixBoxStylerMixin, + LabelStyleMixin, + IconStyleMixin { + final Prop>? $container; + final Prop>? $label; + final Prop>? $icon; + + const RemixToggleStyler.create({ + Prop>? container, + Prop>? label, + Prop>? icon, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $label = label, + $icon = icon; + + RemixToggleStyler({ + FlexBoxStyler? container, + TextStyler? label, + IconStyler? icon, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + label: Prop.maybeMix(label), + icon: Prop.maybeMix(icon), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixToggleStyler.container(FlexBoxStyler value) => + RemixToggleStyler().container(value); + factory RemixToggleStyler.label(TextStyler value) => + RemixToggleStyler().label(value); + factory RemixToggleStyler.icon(IconStyler value) => + RemixToggleStyler().icon(value); + factory RemixToggleStyler.color(Color value) => + RemixToggleStyler().color(value); + factory RemixToggleStyler.gradient(GradientMix value) => + RemixToggleStyler().gradient(value); + factory RemixToggleStyler.border(BoxBorderMix value) => + RemixToggleStyler().border(value); + factory RemixToggleStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixToggleStyler().borderRadius(value); + factory RemixToggleStyler.elevation(ElevationShadow value) => + RemixToggleStyler().elevation(value); + factory RemixToggleStyler.shadow(BoxShadowMix value) => + RemixToggleStyler().shadow(value); + factory RemixToggleStyler.shadows(List value) => + RemixToggleStyler().shadows(value); + factory RemixToggleStyler.width(double value) => + RemixToggleStyler().width(value); + factory RemixToggleStyler.height(double value) => + RemixToggleStyler().height(value); + factory RemixToggleStyler.size(double width, double height) => + RemixToggleStyler().size(width, height); + factory RemixToggleStyler.minWidth(double value) => + RemixToggleStyler().minWidth(value); + factory RemixToggleStyler.maxWidth(double value) => + RemixToggleStyler().maxWidth(value); + factory RemixToggleStyler.minHeight(double value) => + RemixToggleStyler().minHeight(value); + factory RemixToggleStyler.maxHeight(double value) => + RemixToggleStyler().maxHeight(value); + factory RemixToggleStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixToggleStyler().scale(scale, alignment: alignment); + factory RemixToggleStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixToggleStyler().rotate(radians, alignment: alignment); + factory RemixToggleStyler.translate(double x, double y, [double z = 0.0]) => + RemixToggleStyler().translate(x, y, z); + factory RemixToggleStyler.skew(double skewX, double skewY) => + RemixToggleStyler().skew(skewX, skewY); + factory RemixToggleStyler.textStyle(TextStyler value) => + RemixToggleStyler().textStyle(value); + factory RemixToggleStyler.image(DecorationImageMix value) => + RemixToggleStyler().image(value); + factory RemixToggleStyler.shape(ShapeBorderMix value) => + RemixToggleStyler().shape(value); + factory RemixToggleStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixToggleStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixToggleStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixToggleStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixToggleStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixToggleStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixToggleStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixToggleStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixToggleStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixToggleStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixToggleStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixToggleStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixToggleStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixToggleStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixToggleStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixToggleStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixToggleStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixToggleStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixToggleStyler.row() => RemixToggleStyler().row(); + factory RemixToggleStyler.column() => RemixToggleStyler().column(); + factory RemixToggleStyler.alignment(AlignmentGeometry value) => + RemixToggleStyler().alignment(value); + factory RemixToggleStyler.padding(EdgeInsetsGeometryMix value) => + RemixToggleStyler().padding(value); + factory RemixToggleStyler.margin(EdgeInsetsGeometryMix value) => + RemixToggleStyler().margin(value); + factory RemixToggleStyler.constraints(BoxConstraintsMix value) => + RemixToggleStyler().constraints(value); + factory RemixToggleStyler.decoration(DecorationMix value) => + RemixToggleStyler().decoration(value); + factory RemixToggleStyler.foregroundDecoration(DecorationMix value) => + RemixToggleStyler().foregroundDecoration(value); + factory RemixToggleStyler.clipBehavior(Clip value) => + RemixToggleStyler().clipBehavior(value); + factory RemixToggleStyler.direction(Axis value) => + RemixToggleStyler().direction(value); + factory RemixToggleStyler.mainAxisAlignment(MainAxisAlignment value) => + RemixToggleStyler().mainAxisAlignment(value); + factory RemixToggleStyler.crossAxisAlignment(CrossAxisAlignment value) => + RemixToggleStyler().crossAxisAlignment(value); + factory RemixToggleStyler.mainAxisSize(MainAxisSize value) => + RemixToggleStyler().mainAxisSize(value); + factory RemixToggleStyler.spacing(double value) => + RemixToggleStyler().spacing(value); + factory RemixToggleStyler.verticalDirection(VerticalDirection value) => + RemixToggleStyler().verticalDirection(value); + factory RemixToggleStyler.textDirection(TextDirection value) => + RemixToggleStyler().textDirection(value); + factory RemixToggleStyler.textBaseline(TextBaseline value) => + RemixToggleStyler().textBaseline(value); + factory RemixToggleStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixToggleStyler().transform(value, alignment: alignment); + + RemixToggleStyler color(Color value) { + return container(FlexBoxStyler().color(value)); + } - @override - Widget build(BuildContext context) { - return fortalToggleStyler(variant: this.variant, size: this.size).call( - key: this.key, - selected: this.selected, - onChanged: this.onChanged, - enabled: this.enabled, - label: this.label, - icon: this.icon, - enableFeedback: this.enableFeedback, - focusNode: this.focusNode, - autofocus: this.autofocus, - semanticLabel: this.semanticLabel, - mouseCursor: this.mouseCursor, + RemixToggleStyler gradient(GradientMix value) { + return container(FlexBoxStyler().gradient(value)); + } + + RemixToggleStyler border(BoxBorderMix value) { + return container(FlexBoxStyler().border(value)); + } + + RemixToggleStyler borderRadius(BorderRadiusGeometryMix value) { + return container(FlexBoxStyler().borderRadius(value)); + } + + RemixToggleStyler elevation(ElevationShadow value) { + return container(FlexBoxStyler().elevation(value)); + } + + RemixToggleStyler shadow(BoxShadowMix value) { + return container(FlexBoxStyler().shadow(value)); + } + + RemixToggleStyler shadows(List value) { + return container(FlexBoxStyler().shadows(value)); + } + + RemixToggleStyler width(double value) { + return container(FlexBoxStyler().width(value)); + } + + RemixToggleStyler height(double value) { + return container(FlexBoxStyler().height(value)); + } + + RemixToggleStyler size(double width, double height) { + return container(FlexBoxStyler().size(width, height)); + } + + RemixToggleStyler minWidth(double value) { + return container(FlexBoxStyler().minWidth(value)); + } + + RemixToggleStyler maxWidth(double value) { + return container(FlexBoxStyler().maxWidth(value)); + } + + RemixToggleStyler minHeight(double value) { + return container(FlexBoxStyler().minHeight(value)); + } + + RemixToggleStyler maxHeight(double value) { + return container(FlexBoxStyler().maxHeight(value)); + } + + RemixToggleStyler scale(double scale, {Alignment alignment = .center}) { + return container(FlexBoxStyler().scale(scale, alignment: alignment)); + } + + RemixToggleStyler rotate(double radians, {Alignment alignment = .center}) { + return container(FlexBoxStyler().rotate(radians, alignment: alignment)); + } + + RemixToggleStyler translate(double x, double y, [double z = 0.0]) { + return container(FlexBoxStyler().translate(x, y, z)); + } + + RemixToggleStyler skew(double skewX, double skewY) { + return container(FlexBoxStyler().skew(skewX, skewY)); + } + + RemixToggleStyler textStyle(TextStyler value) { + return container(FlexBoxStyler().textStyle(value)); + } + + RemixToggleStyler image(DecorationImageMix value) { + return container(FlexBoxStyler().image(value)); + } + + RemixToggleStyler shape(ShapeBorderMix value) { + return container(FlexBoxStyler().shape(value)); + } + + RemixToggleStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixToggleStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixToggleStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } -mixin _$RemixToggleStylerMixin on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $label; - Prop>? get $icon; + RemixToggleStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixToggleStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixToggleStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixToggleStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixToggleStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixToggleStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixToggleStyler row() { + return container(FlexBoxStyler().row()); + } + + RemixToggleStyler column() { + return container(FlexBoxStyler().column()); + } + + RemixToggleStyler alignment(AlignmentGeometry value) { + return container(FlexBoxStyler().alignment(value)); + } + + RemixToggleStyler padding(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().padding(value)); + } + + RemixToggleStyler margin(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().margin(value)); + } + + RemixToggleStyler constraints(BoxConstraintsMix value) { + return container(FlexBoxStyler().constraints(value)); + } + + RemixToggleStyler decoration(DecorationMix value) { + return container(FlexBoxStyler().decoration(value)); + } + + RemixToggleStyler foregroundDecoration(DecorationMix value) { + return container(FlexBoxStyler().foregroundDecoration(value)); + } + + RemixToggleStyler clipBehavior(Clip value) { + return container(FlexBoxStyler().clipBehavior(value)); + } + + RemixToggleStyler direction(Axis value) { + return container(FlexBoxStyler().direction(value)); + } + + RemixToggleStyler mainAxisAlignment(MainAxisAlignment value) { + return container(FlexBoxStyler().mainAxisAlignment(value)); + } + + RemixToggleStyler crossAxisAlignment(CrossAxisAlignment value) { + return container(FlexBoxStyler().crossAxisAlignment(value)); + } + + RemixToggleStyler mainAxisSize(MainAxisSize value) { + return container(FlexBoxStyler().mainAxisSize(value)); + } + + RemixToggleStyler spacing(double value) { + return container(FlexBoxStyler().spacing(value)); + } + + RemixToggleStyler verticalDirection(VerticalDirection value) { + return container(FlexBoxStyler().verticalDirection(value)); + } + + RemixToggleStyler textDirection(TextDirection value) { + return container(FlexBoxStyler().textDirection(value)); + } + + RemixToggleStyler textBaseline(TextBaseline value) { + return container(FlexBoxStyler().textBaseline(value)); + } + + RemixToggleStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(FlexBoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixToggleStyler container(FlexBoxStyler value) { @@ -199,26 +672,31 @@ mixin _$RemixToggleStylerMixin on Style, Diagnosticable { } /// Sets the label. + @override RemixToggleStyler label(TextStyler value) { return merge(RemixToggleStyler(label: value)); } /// Sets the icon. + @override RemixToggleStyler icon(IconStyler value) { return merge(RemixToggleStyler(icon: value)); } /// Sets the animation configuration. + @override RemixToggleStyler animate(AnimationConfig value) { return merge(RemixToggleStyler(animation: value)); } /// Sets the style variants. + @override RemixToggleStyler variants(List> value) { return merge(RemixToggleStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixToggleStyler wrap(WidgetModifierConfig value) { return merge(RemixToggleStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/toggle/toggle_spec.dart b/packages/remix/lib/src/components/toggle/toggle_spec.dart index 7c775ede..68ff3ab5 100644 --- a/packages/remix/lib/src/components/toggle/toggle_spec.dart +++ b/packages/remix/lib/src/components/toggle/toggle_spec.dart @@ -1,9 +1,12 @@ part of 'toggle.dart'; /// Resolved visual properties for a [RemixToggle]. -@MixableSpec() +@MixableSpec( + extraStylerMixins: [RemixBoxStylerMixin, LabelStyleMixin, IconStyleMixin], +) class RemixToggleSpec with _$RemixToggleSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; @override final StyleSpec label; diff --git a/packages/remix/lib/src/components/toggle/toggle_style.dart b/packages/remix/lib/src/components/toggle/toggle_style.dart index 59f34cc9..7210cfea 100644 --- a/packages/remix/lib/src/components/toggle/toggle_style.dart +++ b/packages/remix/lib/src/components/toggle/toggle_style.dart @@ -1,49 +1,7 @@ part of 'toggle.dart'; /// Style configuration for [RemixToggle] container, label, icon, and states. -@MixableStyler() -class RemixToggleStyler - extends RemixFlexContainerStyler - with - LabelStyleMixin, - IconStyleMixin, - SelectedWidgetStateVariantMixin, - Diagnosticable, - _$RemixToggleStylerMixin { - @MixableField(setterType: FlexBoxStyler) - final Prop>? $container; - @MixableField(setterType: TextStyler) - final Prop>? $label; - @MixableField(setterType: IconStyler) - final Prop>? $icon; - - const RemixToggleStyler.create({ - Prop>? container, - Prop>? label, - Prop>? icon, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $label = label, - $icon = icon; - - RemixToggleStyler({ - FlexBoxStyler? container, - TextStyler? label, - IconStyler? icon, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - label: Prop.maybeMix(label), - icon: Prop.maybeMix(icon), - variants: variants, - animation: animation, - modifier: modifier, - ); - +extension RemixToggleStylerRemixHelpers on RemixToggleStyler { /// Sets the background color. RemixToggleStyler backgroundColor(Color value) { return merge( @@ -58,20 +16,6 @@ class RemixToggleStyler return labelColor(value).iconColor(value); } - /// Sets the shape of the toggle. - RemixToggleStyler shape(ShapeBorderMix value) { - return merge( - RemixToggleStyler( - container: FlexBoxStyler(decoration: ShapeDecorationMix(shape: value)), - ), - ); - } - - /// Sets item spacing between icon and label. - RemixToggleStyler spacing(double value) { - return merge(RemixToggleStyler(container: FlexBoxStyler(spacing: value))); - } - /// Creates a [RemixToggle] widget with this style applied. RemixToggle call({ Key? key, @@ -102,59 +46,6 @@ class RemixToggleStyler ); } - /// Sets container alignment. - @override - RemixToggleStyler alignment(Alignment value) { - return merge(RemixToggleStyler(container: FlexBoxStyler(alignment: value))); - } - - @override - RemixToggleStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixToggleStyler(container: FlexBoxStyler(padding: value))); - } - - @override - RemixToggleStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixToggleStyler(container: FlexBoxStyler(margin: value))); - } - - @override - RemixToggleStyler decoration(DecorationMix value) { - return merge( - RemixToggleStyler(container: FlexBoxStyler(decoration: value)), - ); - } - - @override - RemixToggleStyler constraints(BoxConstraintsMix value) { - return merge( - RemixToggleStyler(container: FlexBoxStyler(constraints: value)), - ); - } - - @override - RemixToggleStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixToggleStyler(container: FlexBoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixToggleStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixToggleStyler( - container: FlexBoxStyler( - transform: value, - transformAlignment: alignment, - ), - ), - ); - } - - @override RemixToggleStyler flex(FlexStyler value) { return merge(RemixToggleStyler(container: FlexBoxStyler().flex(value))); } diff --git a/packages/remix/lib/src/components/toggle_group/fortal_toggle_group_styles.dart b/packages/remix/lib/src/components/toggle_group/fortal_toggle_group_styles.dart index db4e8253..2a11539b 100644 --- a/packages/remix/lib/src/components/toggle_group/fortal_toggle_group_styles.dart +++ b/packages/remix/lib/src/components/toggle_group/fortal_toggle_group_styles.dart @@ -7,7 +7,6 @@ enum FortalToggleGroupSize { size1, size2, size3 } enum FortalToggleGroupVariant { soft, surface } /// Fortal-themed segmented-control preset for [RemixToggleGroup]. -@MixWidget(name: 'FortalToggleGroup') RemixToggleGroupStyler fortalToggleGroupStyler({ FortalToggleGroupVariant variant = .soft, FortalToggleGroupSize size = .size2, @@ -98,3 +97,84 @@ RemixToggleGroupStyler _fortalToggleGroupSizeStyler( ), }; } + +/// Fortal-themed segmented-control preset for [RemixToggleGroup]. +class FortalToggleGroup extends StatelessWidget { + const FortalToggleGroup({ + super.key, + this.variant = .soft, + this.size = .size2, + required this.items, + required this.selectedValue, + this.onChanged, + this.enabled = true, + this.orientation = .horizontal, + this.loop = true, + this.semanticLabel, + this.excludeSemantics = false, + }); + + const FortalToggleGroup.soft({ + super.key, + this.size = .size2, + required this.items, + required this.selectedValue, + this.onChanged, + this.enabled = true, + this.orientation = .horizontal, + this.loop = true, + this.semanticLabel, + this.excludeSemantics = false, + }) : variant = FortalToggleGroupVariant.soft; + + const FortalToggleGroup.surface({ + super.key, + this.size = .size2, + required this.items, + required this.selectedValue, + this.onChanged, + this.enabled = true, + this.orientation = .horizontal, + this.loop = true, + this.semanticLabel, + this.excludeSemantics = false, + }) : variant = FortalToggleGroupVariant.surface; + + final FortalToggleGroupVariant variant; + + final FortalToggleGroupSize size; + + final List> items; + + final T? selectedValue; + + final ValueChanged? onChanged; + + final bool enabled; + + final Axis orientation; + + final bool loop; + + final String? semanticLabel; + + final bool excludeSemantics; + + @override + Widget build(BuildContext context) { + return fortalToggleGroupStyler( + variant: this.variant, + size: this.size, + ).call( + key: this.key, + items: this.items, + selectedValue: this.selectedValue, + onChanged: this.onChanged, + enabled: this.enabled, + orientation: this.orientation, + loop: this.loop, + semanticLabel: this.semanticLabel, + excludeSemantics: this.excludeSemantics, + ); + } +} diff --git a/packages/remix/lib/src/components/toggle_group/toggle_group.g.dart b/packages/remix/lib/src/components/toggle_group/toggle_group.g.dart index e5716a6f..c98391cc 100644 --- a/packages/remix/lib/src/components/toggle_group/toggle_group.g.dart +++ b/packages/remix/lib/src/components/toggle_group/toggle_group.g.dart @@ -172,98 +172,580 @@ mixin _$RemixToggleGroupItemSpec typedef _$RemixToggleGroupItemSpecMethods = _$RemixToggleGroupItemSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed segmented-control preset for [RemixToggleGroup]. -class FortalToggleGroup extends StatelessWidget { - const FortalToggleGroup({ - super.key, - this.variant = .soft, - this.size = .size2, - required this.items, - required this.selectedValue, - this.onChanged, - this.enabled = true, - this.orientation = .horizontal, - this.loop = true, - this.semanticLabel, - this.excludeSemantics = false, - }); - - const FortalToggleGroup.soft({ - super.key, - this.size = .size2, - required this.items, - required this.selectedValue, - this.onChanged, - this.enabled = true, - this.orientation = .horizontal, - this.loop = true, - this.semanticLabel, - this.excludeSemantics = false, - }) : variant = FortalToggleGroupVariant.soft; - - const FortalToggleGroup.surface({ - super.key, - this.size = .size2, - required this.items, - required this.selectedValue, - this.onChanged, - this.enabled = true, - this.orientation = .horizontal, - this.loop = true, - this.semanticLabel, - this.excludeSemantics = false, - }) : variant = FortalToggleGroupVariant.surface; - - final FortalToggleGroupVariant variant; - - final FortalToggleGroupSize size; - - final List> items; - - final T? selectedValue; - - final ValueChanged? onChanged; - - final bool enabled; - - final Axis orientation; - - final bool loop; - - final String? semanticLabel; - - final bool excludeSemantics; - - @override - Widget build(BuildContext context) { - return fortalToggleGroupStyler( - variant: this.variant, - size: this.size, - ).call( - key: this.key, - items: this.items, - selectedValue: this.selectedValue, - onChanged: this.onChanged, - enabled: this.enabled, - orientation: this.orientation, - loop: this.loop, - semanticLabel: this.semanticLabel, - excludeSemantics: this.excludeSemantics, +class RemixToggleGroupStyler + extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $container; + final Prop>? $item; + + const RemixToggleGroupStyler.create({ + Prop>? container, + Prop>? item, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $item = item; + + RemixToggleGroupStyler({ + FlexBoxStyler? container, + RemixToggleGroupItemStyler? item, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + item: Prop.maybeMix(item), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixToggleGroupStyler.container(FlexBoxStyler value) => + RemixToggleGroupStyler().container(value); + factory RemixToggleGroupStyler.item(RemixToggleGroupItemStyler value) => + RemixToggleGroupStyler().item(value); + factory RemixToggleGroupStyler.color(Color value) => + RemixToggleGroupStyler().color(value); + factory RemixToggleGroupStyler.gradient(GradientMix value) => + RemixToggleGroupStyler().gradient(value); + factory RemixToggleGroupStyler.border(BoxBorderMix value) => + RemixToggleGroupStyler().border(value); + factory RemixToggleGroupStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixToggleGroupStyler().borderRadius(value); + factory RemixToggleGroupStyler.elevation(ElevationShadow value) => + RemixToggleGroupStyler().elevation(value); + factory RemixToggleGroupStyler.shadow(BoxShadowMix value) => + RemixToggleGroupStyler().shadow(value); + factory RemixToggleGroupStyler.shadows(List value) => + RemixToggleGroupStyler().shadows(value); + factory RemixToggleGroupStyler.width(double value) => + RemixToggleGroupStyler().width(value); + factory RemixToggleGroupStyler.height(double value) => + RemixToggleGroupStyler().height(value); + factory RemixToggleGroupStyler.size(double width, double height) => + RemixToggleGroupStyler().size(width, height); + factory RemixToggleGroupStyler.minWidth(double value) => + RemixToggleGroupStyler().minWidth(value); + factory RemixToggleGroupStyler.maxWidth(double value) => + RemixToggleGroupStyler().maxWidth(value); + factory RemixToggleGroupStyler.minHeight(double value) => + RemixToggleGroupStyler().minHeight(value); + factory RemixToggleGroupStyler.maxHeight(double value) => + RemixToggleGroupStyler().maxHeight(value); + factory RemixToggleGroupStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixToggleGroupStyler().scale(scale, alignment: alignment); + factory RemixToggleGroupStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixToggleGroupStyler().rotate(radians, alignment: alignment); + factory RemixToggleGroupStyler.translate( + double x, + double y, [ + double z = 0.0, + ]) => RemixToggleGroupStyler().translate(x, y, z); + factory RemixToggleGroupStyler.skew(double skewX, double skewY) => + RemixToggleGroupStyler().skew(skewX, skewY); + factory RemixToggleGroupStyler.textStyle(TextStyler value) => + RemixToggleGroupStyler().textStyle(value); + factory RemixToggleGroupStyler.image(DecorationImageMix value) => + RemixToggleGroupStyler().image(value); + factory RemixToggleGroupStyler.shape(ShapeBorderMix value) => + RemixToggleGroupStyler().shape(value); + factory RemixToggleGroupStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixToggleGroupStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixToggleGroupStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixToggleGroupStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixToggleGroupStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixToggleGroupStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixToggleGroupStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixToggleGroupStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixToggleGroupStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixToggleGroupStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixToggleGroupStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixToggleGroupStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixToggleGroupStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixToggleGroupStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixToggleGroupStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixToggleGroupStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixToggleGroupStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixToggleGroupStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixToggleGroupStyler.row() => RemixToggleGroupStyler().row(); + factory RemixToggleGroupStyler.column() => RemixToggleGroupStyler().column(); + factory RemixToggleGroupStyler.alignment(AlignmentGeometry value) => + RemixToggleGroupStyler().alignment(value); + factory RemixToggleGroupStyler.padding(EdgeInsetsGeometryMix value) => + RemixToggleGroupStyler().padding(value); + factory RemixToggleGroupStyler.margin(EdgeInsetsGeometryMix value) => + RemixToggleGroupStyler().margin(value); + factory RemixToggleGroupStyler.constraints(BoxConstraintsMix value) => + RemixToggleGroupStyler().constraints(value); + factory RemixToggleGroupStyler.decoration(DecorationMix value) => + RemixToggleGroupStyler().decoration(value); + factory RemixToggleGroupStyler.foregroundDecoration(DecorationMix value) => + RemixToggleGroupStyler().foregroundDecoration(value); + factory RemixToggleGroupStyler.clipBehavior(Clip value) => + RemixToggleGroupStyler().clipBehavior(value); + factory RemixToggleGroupStyler.direction(Axis value) => + RemixToggleGroupStyler().direction(value); + factory RemixToggleGroupStyler.mainAxisAlignment(MainAxisAlignment value) => + RemixToggleGroupStyler().mainAxisAlignment(value); + factory RemixToggleGroupStyler.crossAxisAlignment(CrossAxisAlignment value) => + RemixToggleGroupStyler().crossAxisAlignment(value); + factory RemixToggleGroupStyler.mainAxisSize(MainAxisSize value) => + RemixToggleGroupStyler().mainAxisSize(value); + factory RemixToggleGroupStyler.spacing(double value) => + RemixToggleGroupStyler().spacing(value); + factory RemixToggleGroupStyler.verticalDirection(VerticalDirection value) => + RemixToggleGroupStyler().verticalDirection(value); + factory RemixToggleGroupStyler.textDirection(TextDirection value) => + RemixToggleGroupStyler().textDirection(value); + factory RemixToggleGroupStyler.textBaseline(TextBaseline value) => + RemixToggleGroupStyler().textBaseline(value); + factory RemixToggleGroupStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixToggleGroupStyler().transform(value, alignment: alignment); + + RemixToggleGroupStyler color(Color value) { + return container(FlexBoxStyler().color(value)); + } + + RemixToggleGroupStyler gradient(GradientMix value) { + return container(FlexBoxStyler().gradient(value)); + } + + RemixToggleGroupStyler border(BoxBorderMix value) { + return container(FlexBoxStyler().border(value)); + } + + RemixToggleGroupStyler borderRadius(BorderRadiusGeometryMix value) { + return container(FlexBoxStyler().borderRadius(value)); + } + + RemixToggleGroupStyler elevation(ElevationShadow value) { + return container(FlexBoxStyler().elevation(value)); + } + + RemixToggleGroupStyler shadow(BoxShadowMix value) { + return container(FlexBoxStyler().shadow(value)); + } + + RemixToggleGroupStyler shadows(List value) { + return container(FlexBoxStyler().shadows(value)); + } + + RemixToggleGroupStyler width(double value) { + return container(FlexBoxStyler().width(value)); + } + + RemixToggleGroupStyler height(double value) { + return container(FlexBoxStyler().height(value)); + } + + RemixToggleGroupStyler size(double width, double height) { + return container(FlexBoxStyler().size(width, height)); + } + + RemixToggleGroupStyler minWidth(double value) { + return container(FlexBoxStyler().minWidth(value)); + } + + RemixToggleGroupStyler maxWidth(double value) { + return container(FlexBoxStyler().maxWidth(value)); + } + + RemixToggleGroupStyler minHeight(double value) { + return container(FlexBoxStyler().minHeight(value)); + } + + RemixToggleGroupStyler maxHeight(double value) { + return container(FlexBoxStyler().maxHeight(value)); + } + + RemixToggleGroupStyler scale(double scale, {Alignment alignment = .center}) { + return container(FlexBoxStyler().scale(scale, alignment: alignment)); + } + + RemixToggleGroupStyler rotate( + double radians, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().rotate(radians, alignment: alignment)); + } + + RemixToggleGroupStyler translate(double x, double y, [double z = 0.0]) { + return container(FlexBoxStyler().translate(x, y, z)); + } + + RemixToggleGroupStyler skew(double skewX, double skewY) { + return container(FlexBoxStyler().skew(skewX, skewY)); + } + + RemixToggleGroupStyler textStyle(TextStyler value) { + return container(FlexBoxStyler().textStyle(value)); + } + + RemixToggleGroupStyler image(DecorationImageMix value) { + return container(FlexBoxStyler().image(value)); + } + + RemixToggleGroupStyler shape(ShapeBorderMix value) { + return container(FlexBoxStyler().shape(value)); + } + + RemixToggleGroupStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixToggleGroupStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } -mixin _$RemixToggleGroupStylerMixin - on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $item; + RemixToggleGroupStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixToggleGroupStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixToggleGroupStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixToggleGroupStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixToggleGroupStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixToggleGroupStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixToggleGroupStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixToggleGroupStyler row() { + return container(FlexBoxStyler().row()); + } + + RemixToggleGroupStyler column() { + return container(FlexBoxStyler().column()); + } + + RemixToggleGroupStyler alignment(AlignmentGeometry value) { + return container(FlexBoxStyler().alignment(value)); + } + + RemixToggleGroupStyler padding(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().padding(value)); + } + + RemixToggleGroupStyler margin(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().margin(value)); + } + + RemixToggleGroupStyler constraints(BoxConstraintsMix value) { + return container(FlexBoxStyler().constraints(value)); + } + + RemixToggleGroupStyler decoration(DecorationMix value) { + return container(FlexBoxStyler().decoration(value)); + } + + RemixToggleGroupStyler foregroundDecoration(DecorationMix value) { + return container(FlexBoxStyler().foregroundDecoration(value)); + } + + RemixToggleGroupStyler clipBehavior(Clip value) { + return container(FlexBoxStyler().clipBehavior(value)); + } + + RemixToggleGroupStyler direction(Axis value) { + return container(FlexBoxStyler().direction(value)); + } + + RemixToggleGroupStyler mainAxisAlignment(MainAxisAlignment value) { + return container(FlexBoxStyler().mainAxisAlignment(value)); + } + + RemixToggleGroupStyler crossAxisAlignment(CrossAxisAlignment value) { + return container(FlexBoxStyler().crossAxisAlignment(value)); + } + + RemixToggleGroupStyler mainAxisSize(MainAxisSize value) { + return container(FlexBoxStyler().mainAxisSize(value)); + } + + RemixToggleGroupStyler spacing(double value) { + return container(FlexBoxStyler().spacing(value)); + } + + RemixToggleGroupStyler verticalDirection(VerticalDirection value) { + return container(FlexBoxStyler().verticalDirection(value)); + } + + RemixToggleGroupStyler textDirection(TextDirection value) { + return container(FlexBoxStyler().textDirection(value)); + } + + RemixToggleGroupStyler textBaseline(TextBaseline value) { + return container(FlexBoxStyler().textBaseline(value)); + } + + RemixToggleGroupStyler transform( + Matrix4 value, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixToggleGroupStyler container(FlexBoxStyler value) { @@ -276,11 +758,13 @@ mixin _$RemixToggleGroupStylerMixin } /// Sets the animation configuration. + @override RemixToggleGroupStyler animate(AnimationConfig value) { return merge(RemixToggleGroupStyler(animation: value)); } /// Sets the style variants. + @override RemixToggleGroupStyler variants( List> value, ) { @@ -288,6 +772,7 @@ mixin _$RemixToggleGroupStylerMixin } /// Wraps with a widget modifier. + @override RemixToggleGroupStyler wrap(WidgetModifierConfig value) { return merge(RemixToggleGroupStyler(modifier: value)); } @@ -342,11 +827,597 @@ mixin _$RemixToggleGroupStylerMixin ]; } -mixin _$RemixToggleGroupItemStylerMixin - on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $label; - Prop>? get $icon; +class RemixToggleGroupItemStyler + extends MixStyler + with + RemixBoxStylerMixin, + LabelStyleMixin, + IconStyleMixin { + final Prop>? $container; + final Prop>? $label; + final Prop>? $icon; + + const RemixToggleGroupItemStyler.create({ + Prop>? container, + Prop>? label, + Prop>? icon, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $label = label, + $icon = icon; + + RemixToggleGroupItemStyler({ + FlexBoxStyler? container, + TextStyler? label, + IconStyler? icon, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + label: Prop.maybeMix(label), + icon: Prop.maybeMix(icon), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixToggleGroupItemStyler.container(FlexBoxStyler value) => + RemixToggleGroupItemStyler().container(value); + factory RemixToggleGroupItemStyler.label(TextStyler value) => + RemixToggleGroupItemStyler().label(value); + factory RemixToggleGroupItemStyler.icon(IconStyler value) => + RemixToggleGroupItemStyler().icon(value); + factory RemixToggleGroupItemStyler.color(Color value) => + RemixToggleGroupItemStyler().color(value); + factory RemixToggleGroupItemStyler.gradient(GradientMix value) => + RemixToggleGroupItemStyler().gradient(value); + factory RemixToggleGroupItemStyler.border(BoxBorderMix value) => + RemixToggleGroupItemStyler().border(value); + factory RemixToggleGroupItemStyler.borderRadius( + BorderRadiusGeometryMix value, + ) => RemixToggleGroupItemStyler().borderRadius(value); + factory RemixToggleGroupItemStyler.elevation(ElevationShadow value) => + RemixToggleGroupItemStyler().elevation(value); + factory RemixToggleGroupItemStyler.shadow(BoxShadowMix value) => + RemixToggleGroupItemStyler().shadow(value); + factory RemixToggleGroupItemStyler.shadows(List value) => + RemixToggleGroupItemStyler().shadows(value); + factory RemixToggleGroupItemStyler.width(double value) => + RemixToggleGroupItemStyler().width(value); + factory RemixToggleGroupItemStyler.height(double value) => + RemixToggleGroupItemStyler().height(value); + factory RemixToggleGroupItemStyler.size(double width, double height) => + RemixToggleGroupItemStyler().size(width, height); + factory RemixToggleGroupItemStyler.minWidth(double value) => + RemixToggleGroupItemStyler().minWidth(value); + factory RemixToggleGroupItemStyler.maxWidth(double value) => + RemixToggleGroupItemStyler().maxWidth(value); + factory RemixToggleGroupItemStyler.minHeight(double value) => + RemixToggleGroupItemStyler().minHeight(value); + factory RemixToggleGroupItemStyler.maxHeight(double value) => + RemixToggleGroupItemStyler().maxHeight(value); + factory RemixToggleGroupItemStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixToggleGroupItemStyler().scale(scale, alignment: alignment); + factory RemixToggleGroupItemStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixToggleGroupItemStyler().rotate(radians, alignment: alignment); + factory RemixToggleGroupItemStyler.translate( + double x, + double y, [ + double z = 0.0, + ]) => RemixToggleGroupItemStyler().translate(x, y, z); + factory RemixToggleGroupItemStyler.skew(double skewX, double skewY) => + RemixToggleGroupItemStyler().skew(skewX, skewY); + factory RemixToggleGroupItemStyler.textStyle(TextStyler value) => + RemixToggleGroupItemStyler().textStyle(value); + factory RemixToggleGroupItemStyler.image(DecorationImageMix value) => + RemixToggleGroupItemStyler().image(value); + factory RemixToggleGroupItemStyler.shape(ShapeBorderMix value) => + RemixToggleGroupItemStyler().shape(value); + factory RemixToggleGroupItemStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixToggleGroupItemStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixToggleGroupItemStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixToggleGroupItemStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixToggleGroupItemStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixToggleGroupItemStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixToggleGroupItemStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixToggleGroupItemStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixToggleGroupItemStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixToggleGroupItemStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixToggleGroupItemStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixToggleGroupItemStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixToggleGroupItemStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixToggleGroupItemStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixToggleGroupItemStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixToggleGroupItemStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixToggleGroupItemStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixToggleGroupItemStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixToggleGroupItemStyler.row() => + RemixToggleGroupItemStyler().row(); + factory RemixToggleGroupItemStyler.column() => + RemixToggleGroupItemStyler().column(); + factory RemixToggleGroupItemStyler.alignment(AlignmentGeometry value) => + RemixToggleGroupItemStyler().alignment(value); + factory RemixToggleGroupItemStyler.padding(EdgeInsetsGeometryMix value) => + RemixToggleGroupItemStyler().padding(value); + factory RemixToggleGroupItemStyler.margin(EdgeInsetsGeometryMix value) => + RemixToggleGroupItemStyler().margin(value); + factory RemixToggleGroupItemStyler.constraints(BoxConstraintsMix value) => + RemixToggleGroupItemStyler().constraints(value); + factory RemixToggleGroupItemStyler.decoration(DecorationMix value) => + RemixToggleGroupItemStyler().decoration(value); + factory RemixToggleGroupItemStyler.foregroundDecoration( + DecorationMix value, + ) => RemixToggleGroupItemStyler().foregroundDecoration(value); + factory RemixToggleGroupItemStyler.clipBehavior(Clip value) => + RemixToggleGroupItemStyler().clipBehavior(value); + factory RemixToggleGroupItemStyler.direction(Axis value) => + RemixToggleGroupItemStyler().direction(value); + factory RemixToggleGroupItemStyler.mainAxisAlignment( + MainAxisAlignment value, + ) => RemixToggleGroupItemStyler().mainAxisAlignment(value); + factory RemixToggleGroupItemStyler.crossAxisAlignment( + CrossAxisAlignment value, + ) => RemixToggleGroupItemStyler().crossAxisAlignment(value); + factory RemixToggleGroupItemStyler.mainAxisSize(MainAxisSize value) => + RemixToggleGroupItemStyler().mainAxisSize(value); + factory RemixToggleGroupItemStyler.spacing(double value) => + RemixToggleGroupItemStyler().spacing(value); + factory RemixToggleGroupItemStyler.verticalDirection( + VerticalDirection value, + ) => RemixToggleGroupItemStyler().verticalDirection(value); + factory RemixToggleGroupItemStyler.textDirection(TextDirection value) => + RemixToggleGroupItemStyler().textDirection(value); + factory RemixToggleGroupItemStyler.textBaseline(TextBaseline value) => + RemixToggleGroupItemStyler().textBaseline(value); + factory RemixToggleGroupItemStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixToggleGroupItemStyler().transform(value, alignment: alignment); + + RemixToggleGroupItemStyler color(Color value) { + return container(FlexBoxStyler().color(value)); + } + + RemixToggleGroupItemStyler gradient(GradientMix value) { + return container(FlexBoxStyler().gradient(value)); + } + + RemixToggleGroupItemStyler border(BoxBorderMix value) { + return container(FlexBoxStyler().border(value)); + } + + RemixToggleGroupItemStyler borderRadius(BorderRadiusGeometryMix value) { + return container(FlexBoxStyler().borderRadius(value)); + } + + RemixToggleGroupItemStyler elevation(ElevationShadow value) { + return container(FlexBoxStyler().elevation(value)); + } + + RemixToggleGroupItemStyler shadow(BoxShadowMix value) { + return container(FlexBoxStyler().shadow(value)); + } + + RemixToggleGroupItemStyler shadows(List value) { + return container(FlexBoxStyler().shadows(value)); + } + + RemixToggleGroupItemStyler width(double value) { + return container(FlexBoxStyler().width(value)); + } + + RemixToggleGroupItemStyler height(double value) { + return container(FlexBoxStyler().height(value)); + } + + RemixToggleGroupItemStyler size(double width, double height) { + return container(FlexBoxStyler().size(width, height)); + } + + RemixToggleGroupItemStyler minWidth(double value) { + return container(FlexBoxStyler().minWidth(value)); + } + + RemixToggleGroupItemStyler maxWidth(double value) { + return container(FlexBoxStyler().maxWidth(value)); + } + + RemixToggleGroupItemStyler minHeight(double value) { + return container(FlexBoxStyler().minHeight(value)); + } + + RemixToggleGroupItemStyler maxHeight(double value) { + return container(FlexBoxStyler().maxHeight(value)); + } + + RemixToggleGroupItemStyler scale( + double scale, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().scale(scale, alignment: alignment)); + } + + RemixToggleGroupItemStyler rotate( + double radians, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().rotate(radians, alignment: alignment)); + } + + RemixToggleGroupItemStyler translate(double x, double y, [double z = 0.0]) { + return container(FlexBoxStyler().translate(x, y, z)); + } + + RemixToggleGroupItemStyler skew(double skewX, double skewY) { + return container(FlexBoxStyler().skew(skewX, skewY)); + } + + RemixToggleGroupItemStyler textStyle(TextStyler value) { + return container(FlexBoxStyler().textStyle(value)); + } + + RemixToggleGroupItemStyler image(DecorationImageMix value) { + return container(FlexBoxStyler().image(value)); + } + + RemixToggleGroupItemStyler shape(ShapeBorderMix value) { + return container(FlexBoxStyler().shape(value)); + } + + RemixToggleGroupItemStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixToggleGroupItemStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixToggleGroupItemStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + FlexBoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixToggleGroupItemStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixToggleGroupItemStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixToggleGroupItemStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixToggleGroupItemStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixToggleGroupItemStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixToggleGroupItemStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + FlexBoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixToggleGroupItemStyler row() { + return container(FlexBoxStyler().row()); + } + + RemixToggleGroupItemStyler column() { + return container(FlexBoxStyler().column()); + } + + RemixToggleGroupItemStyler alignment(AlignmentGeometry value) { + return container(FlexBoxStyler().alignment(value)); + } + + RemixToggleGroupItemStyler padding(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().padding(value)); + } + + RemixToggleGroupItemStyler margin(EdgeInsetsGeometryMix value) { + return container(FlexBoxStyler().margin(value)); + } + + RemixToggleGroupItemStyler constraints(BoxConstraintsMix value) { + return container(FlexBoxStyler().constraints(value)); + } + + RemixToggleGroupItemStyler decoration(DecorationMix value) { + return container(FlexBoxStyler().decoration(value)); + } + + RemixToggleGroupItemStyler foregroundDecoration(DecorationMix value) { + return container(FlexBoxStyler().foregroundDecoration(value)); + } + + RemixToggleGroupItemStyler clipBehavior(Clip value) { + return container(FlexBoxStyler().clipBehavior(value)); + } + + RemixToggleGroupItemStyler direction(Axis value) { + return container(FlexBoxStyler().direction(value)); + } + + RemixToggleGroupItemStyler mainAxisAlignment(MainAxisAlignment value) { + return container(FlexBoxStyler().mainAxisAlignment(value)); + } + + RemixToggleGroupItemStyler crossAxisAlignment(CrossAxisAlignment value) { + return container(FlexBoxStyler().crossAxisAlignment(value)); + } + + RemixToggleGroupItemStyler mainAxisSize(MainAxisSize value) { + return container(FlexBoxStyler().mainAxisSize(value)); + } + + RemixToggleGroupItemStyler spacing(double value) { + return container(FlexBoxStyler().spacing(value)); + } + + RemixToggleGroupItemStyler verticalDirection(VerticalDirection value) { + return container(FlexBoxStyler().verticalDirection(value)); + } + + RemixToggleGroupItemStyler textDirection(TextDirection value) { + return container(FlexBoxStyler().textDirection(value)); + } + + RemixToggleGroupItemStyler textBaseline(TextBaseline value) { + return container(FlexBoxStyler().textBaseline(value)); + } + + RemixToggleGroupItemStyler transform( + Matrix4 value, { + Alignment alignment = .center, + }) { + return container(FlexBoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixToggleGroupItemStyler container(FlexBoxStyler value) { @@ -354,21 +1425,25 @@ mixin _$RemixToggleGroupItemStylerMixin } /// Sets the label. + @override RemixToggleGroupItemStyler label(TextStyler value) { return merge(RemixToggleGroupItemStyler(label: value)); } /// Sets the icon. + @override RemixToggleGroupItemStyler icon(IconStyler value) { return merge(RemixToggleGroupItemStyler(icon: value)); } /// Sets the animation configuration. + @override RemixToggleGroupItemStyler animate(AnimationConfig value) { return merge(RemixToggleGroupItemStyler(animation: value)); } /// Sets the style variants. + @override RemixToggleGroupItemStyler variants( List> value, ) { @@ -376,6 +1451,7 @@ mixin _$RemixToggleGroupItemStylerMixin } /// Wraps with a widget modifier. + @override RemixToggleGroupItemStyler wrap(WidgetModifierConfig value) { return merge(RemixToggleGroupItemStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/toggle_group/toggle_group_spec.dart b/packages/remix/lib/src/components/toggle_group/toggle_group_spec.dart index 8e9e4995..aa42bd7b 100644 --- a/packages/remix/lib/src/components/toggle_group/toggle_group_spec.dart +++ b/packages/remix/lib/src/components/toggle_group/toggle_group_spec.dart @@ -1,10 +1,11 @@ part of 'toggle_group.dart'; /// Resolved visual properties for a [RemixToggleGroup]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixToggleGroupSpec with _$RemixToggleGroupSpec { /// Layout and decoration for the group container. @override + @MixableField(forwardStyler: true) final StyleSpec container; /// Default visual style for every option in the group. @@ -19,10 +20,13 @@ class RemixToggleGroupSpec with _$RemixToggleGroupSpec { } /// Resolved visual properties for an item in a [RemixToggleGroup]. -@MixableSpec() +@MixableSpec( + extraStylerMixins: [RemixBoxStylerMixin, LabelStyleMixin, IconStyleMixin], +) class RemixToggleGroupItemSpec with _$RemixToggleGroupItemSpec { /// Layout and decoration for the item content. @override + @MixableField(forwardStyler: true) final StyleSpec container; /// Text style for the optional label. diff --git a/packages/remix/lib/src/components/toggle_group/toggle_group_style.dart b/packages/remix/lib/src/components/toggle_group/toggle_group_style.dart index 7f011357..6c04d788 100644 --- a/packages/remix/lib/src/components/toggle_group/toggle_group_style.dart +++ b/packages/remix/lib/src/components/toggle_group/toggle_group_style.dart @@ -1,52 +1,7 @@ part of 'toggle_group.dart'; /// Style configuration for a [RemixToggleGroup] container and its items. -@MixableStyler() -class RemixToggleGroupStyler extends Style - with - VariantStyleMixin, - WidgetModifierStyleMixin, - AnimationStyleMixin, - BorderStyleMixin, - BorderRadiusStyleMixin, - ShadowStyleMixin, - DecorationStyleMixin, - SpacingStyleMixin, - TransformStyleMixin, - ConstraintStyleMixin, - FlexStyleMixin, - Diagnosticable, - _$RemixToggleGroupStylerMixin { - @MixableField(setterType: FlexBoxStyler) - final Prop>? $container; - - @MixableField(setterType: RemixToggleGroupItemStyler) - final Prop>? $item; - - const RemixToggleGroupStyler.create({ - Prop>? container, - Prop>? item, - List>? variants, - AnimationConfig? animation, - WidgetModifierConfig? modifier, - }) : $container = container, - $item = item, - super(variants: variants, animation: animation, modifier: modifier); - - RemixToggleGroupStyler({ - FlexBoxStyler? container, - RemixToggleGroupItemStyler? item, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - item: Prop.maybeMix(item), - variants: variants, - animation: animation, - modifier: modifier, - ); - +extension RemixToggleGroupStylerRemixHelpers on RemixToggleGroupStyler { /// Sets the group background color. RemixToggleGroupStyler backgroundColor(Color value) => color(value); @@ -76,101 +31,6 @@ class RemixToggleGroupStyler extends Style ); } - RemixToggleGroupStyler alignment(Alignment value) { - return merge( - RemixToggleGroupStyler(container: FlexBoxStyler(alignment: value)), - ); - } - - @override - RemixToggleGroupStyler padding(EdgeInsetsGeometryMix value) { - return merge( - RemixToggleGroupStyler(container: FlexBoxStyler(padding: value)), - ); - } - - @override - RemixToggleGroupStyler color(Color value) { - return merge( - RemixToggleGroupStyler( - container: FlexBoxStyler(decoration: BoxDecorationMix(color: value)), - ), - ); - } - - @override - RemixToggleGroupStyler size(double width, double height) { - return merge( - RemixToggleGroupStyler( - container: FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: width, - maxWidth: width, - minHeight: height, - maxHeight: height, - ), - ), - ), - ); - } - - @override - RemixToggleGroupStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixToggleGroupStyler( - container: FlexBoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - - @override - RemixToggleGroupStyler constraints(BoxConstraintsMix value) { - return merge( - RemixToggleGroupStyler(container: FlexBoxStyler(constraints: value)), - ); - } - - @override - RemixToggleGroupStyler decoration(DecorationMix value) { - return merge( - RemixToggleGroupStyler(container: FlexBoxStyler(decoration: value)), - ); - } - - @override - RemixToggleGroupStyler margin(EdgeInsetsGeometryMix value) { - return merge( - RemixToggleGroupStyler(container: FlexBoxStyler(margin: value)), - ); - } - - @override - RemixToggleGroupStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixToggleGroupStyler( - container: FlexBoxStyler(foregroundDecoration: value), - ), - ); - } - - @override - RemixToggleGroupStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixToggleGroupStyler( - container: FlexBoxStyler( - transform: value, - transformAlignment: alignment, - ), - ), - ); - } - - @override RemixToggleGroupStyler flex(FlexStyler value) { return merge( RemixToggleGroupStyler(container: FlexBoxStyler().flex(value)), @@ -179,169 +39,15 @@ class RemixToggleGroupStyler extends Style } /// Style configuration for an option in a [RemixToggleGroup]. -@MixableStyler() -class RemixToggleGroupItemStyler - extends - RemixFlexContainerStyler< - RemixToggleGroupItemSpec, - RemixToggleGroupItemStyler - > - with - LabelStyleMixin, - IconStyleMixin, - SelectedWidgetStateVariantMixin< - RemixToggleGroupItemSpec, - RemixToggleGroupItemStyler - >, - Diagnosticable, - _$RemixToggleGroupItemStylerMixin { - @MixableField(setterType: FlexBoxStyler) - final Prop>? $container; - - @MixableField(setterType: TextStyler) - final Prop>? $label; - - @MixableField(setterType: IconStyler) - final Prop>? $icon; - - const RemixToggleGroupItemStyler.create({ - Prop>? container, - Prop>? label, - Prop>? icon, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $label = label, - $icon = icon; - - RemixToggleGroupItemStyler({ - FlexBoxStyler? container, - TextStyler? label, - IconStyler? icon, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - label: Prop.maybeMix(label), - icon: Prop.maybeMix(icon), - variants: variants, - animation: animation, - modifier: modifier, - ); - +extension RemixToggleGroupItemStylerRemixHelpers on RemixToggleGroupItemStyler { /// Sets the item background color. - RemixToggleGroupItemStyler backgroundColor(Color value) { - return merge( - RemixToggleGroupItemStyler( - container: FlexBoxStyler(decoration: BoxDecorationMix(color: value)), - ), - ); - } + RemixToggleGroupItemStyler backgroundColor(Color value) => color(value); /// Sets the item foreground color for both label and icon. RemixToggleGroupItemStyler foregroundColor(Color value) { return labelColor(value).iconColor(value); } - /// Sets spacing between the optional icon and label. - RemixToggleGroupItemStyler spacing(double value) { - return merge( - RemixToggleGroupItemStyler(container: FlexBoxStyler(spacing: value)), - ); - } - - @override - RemixToggleGroupItemStyler alignment(Alignment value) { - return merge( - RemixToggleGroupItemStyler(container: FlexBoxStyler(alignment: value)), - ); - } - - @override - RemixToggleGroupItemStyler padding(EdgeInsetsGeometryMix value) { - return merge( - RemixToggleGroupItemStyler(container: FlexBoxStyler(padding: value)), - ); - } - - @override - RemixToggleGroupItemStyler color(Color value) => backgroundColor(value); - - @override - RemixToggleGroupItemStyler size(double width, double height) { - return merge( - RemixToggleGroupItemStyler( - container: FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: width, - maxWidth: width, - minHeight: height, - maxHeight: height, - ), - ), - ), - ); - } - - @override - RemixToggleGroupItemStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixToggleGroupItemStyler( - container: FlexBoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - - @override - RemixToggleGroupItemStyler constraints(BoxConstraintsMix value) { - return merge( - RemixToggleGroupItemStyler(container: FlexBoxStyler(constraints: value)), - ); - } - - @override - RemixToggleGroupItemStyler decoration(DecorationMix value) { - return merge( - RemixToggleGroupItemStyler(container: FlexBoxStyler(decoration: value)), - ); - } - - @override - RemixToggleGroupItemStyler margin(EdgeInsetsGeometryMix value) { - return merge( - RemixToggleGroupItemStyler(container: FlexBoxStyler(margin: value)), - ); - } - - @override - RemixToggleGroupItemStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixToggleGroupItemStyler( - container: FlexBoxStyler(foregroundDecoration: value), - ), - ); - } - - @override - RemixToggleGroupItemStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixToggleGroupItemStyler( - container: FlexBoxStyler( - transform: value, - transformAlignment: alignment, - ), - ), - ); - } - - @override RemixToggleGroupItemStyler flex(FlexStyler value) { return merge( RemixToggleGroupItemStyler(container: FlexBoxStyler().flex(value)), diff --git a/packages/remix/lib/src/components/tooltip/fortal_tooltip_styles.dart b/packages/remix/lib/src/components/tooltip/fortal_tooltip_styles.dart index 496476a0..bb19c53a 100644 --- a/packages/remix/lib/src/components/tooltip/fortal_tooltip_styles.dart +++ b/packages/remix/lib/src/components/tooltip/fortal_tooltip_styles.dart @@ -1,7 +1,6 @@ part of 'tooltip.dart'; /// Fortal-themed preset for [RemixTooltip]. -@MixWidget(name: 'FortalTooltip') RemixTooltipStyler fortalTooltipStyler() { return RemixTooltipStyler() .borderRadiusAll(FortalTokens.radius2()) @@ -13,3 +12,33 @@ RemixTooltipStyler fortalTooltipStyler() { ) .backgroundColor(FortalTokens.gray11()); } + +/// Fortal-themed preset for [RemixTooltip]. +class FortalTooltip extends StatelessWidget { + const FortalTooltip({ + super.key, + required this.tooltipChild, + required this.child, + this.tooltipSemantics, + this.positioning = const OverlayPositionConfig(), + }); + + final Widget tooltipChild; + + final Widget child; + + final String? tooltipSemantics; + + final OverlayPositionConfig positioning; + + @override + Widget build(BuildContext context) { + return fortalTooltipStyler().call( + key: this.key, + tooltipChild: this.tooltipChild, + tooltipSemantics: this.tooltipSemantics, + positioning: this.positioning, + child: this.child, + ); + } +} diff --git a/packages/remix/lib/src/components/tooltip/tooltip.g.dart b/packages/remix/lib/src/components/tooltip/tooltip.g.dart index ffb47a2f..5215206b 100644 --- a/packages/remix/lib/src/components/tooltip/tooltip.g.dart +++ b/packages/remix/lib/src/components/tooltip/tooltip.g.dart @@ -111,49 +111,533 @@ mixin _$RemixTooltipSpec implements Spec, Diagnosticable { typedef _$RemixTooltipSpecMethods = _$RemixTooltipSpec; // ignore: unused_element // ************************************************************************** -// MixWidgetGenerator +// SpecStylerGenerator // ************************************************************************** -/// Fortal-themed preset for [RemixTooltip]. -class FortalTooltip extends StatelessWidget { - const FortalTooltip({ - super.key, - required this.tooltipChild, - required this.child, - this.tooltipSemantics, - this.positioning = const OverlayPositionConfig(), - }); +class RemixTooltipStyler extends MixStyler + with RemixBoxStylerMixin { + final Prop>? $container; + final Prop>? $label; + final Prop? $waitDuration; + final Prop? $showDuration; + final Prop? $dismissDuration; + + const RemixTooltipStyler.create({ + Prop>? container, + Prop>? label, + Prop? waitDuration, + Prop? showDuration, + Prop? dismissDuration, + super.variants, + super.modifier, + super.animation, + }) : $container = container, + $label = label, + $waitDuration = waitDuration, + $showDuration = showDuration, + $dismissDuration = dismissDuration; + + RemixTooltipStyler({ + BoxStyler? container, + TextStyler? label, + Duration? waitDuration, + Duration? showDuration, + Duration? dismissDuration, + AnimationConfig? animation, + WidgetModifierConfig? modifier, + List>? variants, + }) : this.create( + container: Prop.maybeMix(container), + label: Prop.maybeMix(label), + waitDuration: Prop.maybe(waitDuration), + showDuration: Prop.maybe(showDuration), + dismissDuration: Prop.maybe(dismissDuration), + variants: variants, + modifier: modifier, + animation: animation, + ); + + factory RemixTooltipStyler.container(BoxStyler value) => + RemixTooltipStyler().container(value); + factory RemixTooltipStyler.label(TextStyler value) => + RemixTooltipStyler().label(value); + factory RemixTooltipStyler.waitDuration(Duration value) => + RemixTooltipStyler().waitDuration(value); + factory RemixTooltipStyler.showDuration(Duration value) => + RemixTooltipStyler().showDuration(value); + factory RemixTooltipStyler.dismissDuration(Duration value) => + RemixTooltipStyler().dismissDuration(value); + factory RemixTooltipStyler.alignment(AlignmentGeometry value) => + RemixTooltipStyler().alignment(value); + factory RemixTooltipStyler.padding(EdgeInsetsGeometryMix value) => + RemixTooltipStyler().padding(value); + factory RemixTooltipStyler.margin(EdgeInsetsGeometryMix value) => + RemixTooltipStyler().margin(value); + factory RemixTooltipStyler.constraints(BoxConstraintsMix value) => + RemixTooltipStyler().constraints(value); + factory RemixTooltipStyler.decoration(DecorationMix value) => + RemixTooltipStyler().decoration(value); + factory RemixTooltipStyler.foregroundDecoration(DecorationMix value) => + RemixTooltipStyler().foregroundDecoration(value); + factory RemixTooltipStyler.clipBehavior(Clip value) => + RemixTooltipStyler().clipBehavior(value); + factory RemixTooltipStyler.color(Color value) => + RemixTooltipStyler().color(value); + factory RemixTooltipStyler.gradient(GradientMix value) => + RemixTooltipStyler().gradient(value); + factory RemixTooltipStyler.border(BoxBorderMix value) => + RemixTooltipStyler().border(value); + factory RemixTooltipStyler.borderRadius(BorderRadiusGeometryMix value) => + RemixTooltipStyler().borderRadius(value); + factory RemixTooltipStyler.elevation(ElevationShadow value) => + RemixTooltipStyler().elevation(value); + factory RemixTooltipStyler.shadow(BoxShadowMix value) => + RemixTooltipStyler().shadow(value); + factory RemixTooltipStyler.shadows(List value) => + RemixTooltipStyler().shadows(value); + factory RemixTooltipStyler.width(double value) => + RemixTooltipStyler().width(value); + factory RemixTooltipStyler.height(double value) => + RemixTooltipStyler().height(value); + factory RemixTooltipStyler.size(double width, double height) => + RemixTooltipStyler().size(width, height); + factory RemixTooltipStyler.minWidth(double value) => + RemixTooltipStyler().minWidth(value); + factory RemixTooltipStyler.maxWidth(double value) => + RemixTooltipStyler().maxWidth(value); + factory RemixTooltipStyler.minHeight(double value) => + RemixTooltipStyler().minHeight(value); + factory RemixTooltipStyler.maxHeight(double value) => + RemixTooltipStyler().maxHeight(value); + factory RemixTooltipStyler.scale( + double scale, { + Alignment alignment = .center, + }) => RemixTooltipStyler().scale(scale, alignment: alignment); + factory RemixTooltipStyler.rotate( + double radians, { + Alignment alignment = .center, + }) => RemixTooltipStyler().rotate(radians, alignment: alignment); + factory RemixTooltipStyler.translate(double x, double y, [double z = 0.0]) => + RemixTooltipStyler().translate(x, y, z); + factory RemixTooltipStyler.skew(double skewX, double skewY) => + RemixTooltipStyler().skew(skewX, skewY); + factory RemixTooltipStyler.textStyle(TextStyler value) => + RemixTooltipStyler().textStyle(value); + factory RemixTooltipStyler.image(DecorationImageMix value) => + RemixTooltipStyler().image(value); + factory RemixTooltipStyler.shape(ShapeBorderMix value) => + RemixTooltipStyler().shape(value); + factory RemixTooltipStyler.backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTooltipStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTooltipStyler.backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTooltipStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTooltipStyler.backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) => RemixTooltipStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ); + factory RemixTooltipStyler.linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixTooltipStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixTooltipStyler.radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixTooltipStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixTooltipStyler.sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixTooltipStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixTooltipStyler.foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) => RemixTooltipStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ); + factory RemixTooltipStyler.foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) => RemixTooltipStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ); + factory RemixTooltipStyler.foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) => RemixTooltipStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ); + factory RemixTooltipStyler.transform( + Matrix4 value, { + Alignment alignment = .center, + }) => RemixTooltipStyler().transform(value, alignment: alignment); + + RemixTooltipStyler alignment(AlignmentGeometry value) { + return container(BoxStyler().alignment(value)); + } - final Widget tooltipChild; + RemixTooltipStyler padding(EdgeInsetsGeometryMix value) { + return container(BoxStyler().padding(value)); + } - final Widget child; + RemixTooltipStyler margin(EdgeInsetsGeometryMix value) { + return container(BoxStyler().margin(value)); + } - final String? tooltipSemantics; + RemixTooltipStyler constraints(BoxConstraintsMix value) { + return container(BoxStyler().constraints(value)); + } - final OverlayPositionConfig positioning; + RemixTooltipStyler decoration(DecorationMix value) { + return container(BoxStyler().decoration(value)); + } - @override - Widget build(BuildContext context) { - return fortalTooltipStyler().call( - key: this.key, - tooltipChild: this.tooltipChild, - child: this.child, - tooltipSemantics: this.tooltipSemantics, - positioning: this.positioning, + RemixTooltipStyler foregroundDecoration(DecorationMix value) { + return container(BoxStyler().foregroundDecoration(value)); + } + + RemixTooltipStyler clipBehavior(Clip value) { + return container(BoxStyler().clipBehavior(value)); + } + + RemixTooltipStyler color(Color value) { + return container(BoxStyler().color(value)); + } + + RemixTooltipStyler gradient(GradientMix value) { + return container(BoxStyler().gradient(value)); + } + + RemixTooltipStyler border(BoxBorderMix value) { + return container(BoxStyler().border(value)); + } + + RemixTooltipStyler borderRadius(BorderRadiusGeometryMix value) { + return container(BoxStyler().borderRadius(value)); + } + + RemixTooltipStyler elevation(ElevationShadow value) { + return container(BoxStyler().elevation(value)); + } + + RemixTooltipStyler shadow(BoxShadowMix value) { + return container(BoxStyler().shadow(value)); + } + + RemixTooltipStyler shadows(List value) { + return container(BoxStyler().shadows(value)); + } + + RemixTooltipStyler width(double value) { + return container(BoxStyler().width(value)); + } + + RemixTooltipStyler height(double value) { + return container(BoxStyler().height(value)); + } + + RemixTooltipStyler size(double width, double height) { + return container(BoxStyler().size(width, height)); + } + + RemixTooltipStyler minWidth(double value) { + return container(BoxStyler().minWidth(value)); + } + + RemixTooltipStyler maxWidth(double value) { + return container(BoxStyler().maxWidth(value)); + } + + RemixTooltipStyler minHeight(double value) { + return container(BoxStyler().minHeight(value)); + } + + RemixTooltipStyler maxHeight(double value) { + return container(BoxStyler().maxHeight(value)); + } + + RemixTooltipStyler scale(double scale, {Alignment alignment = .center}) { + return container(BoxStyler().scale(scale, alignment: alignment)); + } + + RemixTooltipStyler rotate(double radians, {Alignment alignment = .center}) { + return container(BoxStyler().rotate(radians, alignment: alignment)); + } + + RemixTooltipStyler translate(double x, double y, [double z = 0.0]) { + return container(BoxStyler().translate(x, y, z)); + } + + RemixTooltipStyler skew(double skewX, double skewY) { + return container(BoxStyler().skew(skewX, skewY)); + } + + RemixTooltipStyler textStyle(TextStyler value) { + return container(BoxStyler().textStyle(value)); + } + + RemixTooltipStyler image(DecorationImageMix value) { + return container(BoxStyler().image(value)); + } + + RemixTooltipStyler shape(ShapeBorderMix value) { + return container(BoxStyler().shape(value)); + } + + RemixTooltipStyler backgroundImage( + ImageProvider image, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImage( + image, + fit: fit, + alignment: alignment, + repeat: repeat, + ), ); } -} -// ************************************************************************** -// StylerGenerator -// ************************************************************************** + RemixTooltipStyler backgroundImageUrl( + String url, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageUrl( + url, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } + + RemixTooltipStyler backgroundImageAsset( + String path, { + BoxFit? fit, + AlignmentGeometry? alignment, + ImageRepeat repeat = .noRepeat, + }) { + return container( + BoxStyler().backgroundImageAsset( + path, + fit: fit, + alignment: alignment, + repeat: repeat, + ), + ); + } -mixin _$RemixTooltipStylerMixin on Style, Diagnosticable { - Prop>? get $container; - Prop>? get $label; - Prop? get $waitDuration; - Prop? get $showDuration; - Prop? get $dismissDuration; + RemixTooltipStyler linearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().linearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixTooltipStyler radialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().radialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixTooltipStyler sweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().sweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixTooltipStyler foregroundLinearGradient({ + required List colors, + List? stops, + AlignmentGeometry? begin, + AlignmentGeometry? end, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundLinearGradient( + colors: colors, + stops: stops, + begin: begin, + end: end, + tileMode: tileMode, + ), + ); + } + + RemixTooltipStyler foregroundRadialGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? radius, + AlignmentGeometry? focal, + double? focalRadius, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundRadialGradient( + colors: colors, + stops: stops, + center: center, + radius: radius, + focal: focal, + focalRadius: focalRadius, + tileMode: tileMode, + ), + ); + } + + RemixTooltipStyler foregroundSweepGradient({ + required List colors, + List? stops, + AlignmentGeometry? center, + double? startAngle, + double? endAngle, + TileMode? tileMode, + }) { + return container( + BoxStyler().foregroundSweepGradient( + colors: colors, + stops: stops, + center: center, + startAngle: startAngle, + endAngle: endAngle, + tileMode: tileMode, + ), + ); + } + + RemixTooltipStyler transform(Matrix4 value, {Alignment alignment = .center}) { + return container(BoxStyler().transform(value, alignment: alignment)); + } /// Sets the container. RemixTooltipStyler container(BoxStyler value) { @@ -181,16 +665,19 @@ mixin _$RemixTooltipStylerMixin on Style, Diagnosticable { } /// Sets the animation configuration. + @override RemixTooltipStyler animate(AnimationConfig value) { return merge(RemixTooltipStyler(animation: value)); } /// Sets the style variants. + @override RemixTooltipStyler variants(List> value) { return merge(RemixTooltipStyler(variants: value)); } /// Wraps with a widget modifier. + @override RemixTooltipStyler wrap(WidgetModifierConfig value) { return merge(RemixTooltipStyler(modifier: value)); } diff --git a/packages/remix/lib/src/components/tooltip/tooltip_spec.dart b/packages/remix/lib/src/components/tooltip/tooltip_spec.dart index 9d76f239..136a7bba 100644 --- a/packages/remix/lib/src/components/tooltip/tooltip_spec.dart +++ b/packages/remix/lib/src/components/tooltip/tooltip_spec.dart @@ -1,9 +1,10 @@ part of 'tooltip.dart'; /// Resolved visual values for a [RemixTooltip]. -@MixableSpec() +@MixableSpec(extraStylerMixins: [RemixBoxStylerMixin]) class RemixTooltipSpec with _$RemixTooltipSpec { @override + @MixableField(forwardStyler: true) final StyleSpec container; @override final StyleSpec label; diff --git a/packages/remix/lib/src/components/tooltip/tooltip_style.dart b/packages/remix/lib/src/components/tooltip/tooltip_style.dart index 6ba74f9a..e473bcf4 100644 --- a/packages/remix/lib/src/components/tooltip/tooltip_style.dart +++ b/packages/remix/lib/src/components/tooltip/tooltip_style.dart @@ -4,61 +4,7 @@ part of 'tooltip.dart'; /// /// Use this class to style tooltip container, label, wait duration, and show /// duration. -@MixableStyler() -class RemixTooltipStyler - extends RemixContainerStyler - with Diagnosticable, _$RemixTooltipStylerMixin { - @MixableField(setterType: BoxStyler) - final Prop>? $container; - @MixableField(setterType: TextStyler) - final Prop>? $label; - @MixableField() - final Prop? $waitDuration; - @MixableField() - final Prop? $showDuration; - @MixableField() - final Prop? $dismissDuration; - - const RemixTooltipStyler.create({ - Prop>? container, - Prop>? label, - Prop? waitDuration, - Prop? showDuration, - Prop? dismissDuration, - super.variants, - super.animation, - super.modifier, - }) : $container = container, - $label = label, - $waitDuration = waitDuration, - $showDuration = showDuration, - $dismissDuration = dismissDuration; - - RemixTooltipStyler({ - BoxStyler? container, - TextStyler? label, - Duration? waitDuration, - Duration? showDuration, - Duration? dismissDuration, - AnimationConfig? animation, - List>? variants, - WidgetModifierConfig? modifier, - }) : this.create( - container: Prop.maybeMix(container), - label: Prop.maybeMix(label), - waitDuration: Prop.maybe(waitDuration), - showDuration: Prop.maybe(showDuration), - dismissDuration: Prop.maybe(dismissDuration), - variants: variants, - animation: animation, - modifier: modifier, - ); - - /// Sets container alignment - RemixTooltipStyler alignment(Alignment value) { - return merge(RemixTooltipStyler(container: BoxStyler(alignment: value))); - } - +extension RemixTooltipStylerRemixHelpers on RemixTooltipStyler { /// Sets tooltip container background color. RemixTooltipStyler backgroundColor(Color value) => color(value); @@ -79,70 +25,4 @@ class RemixTooltipStyler child: child, ); } - - /// Sets container padding - @override - RemixTooltipStyler padding(EdgeInsetsGeometryMix value) { - return merge(RemixTooltipStyler(container: BoxStyler(padding: value))); - } - - /// Sets container margin - @override - RemixTooltipStyler margin(EdgeInsetsGeometryMix value) { - return merge(RemixTooltipStyler(container: BoxStyler(margin: value))); - } - - /// Sets container background color - @override - RemixTooltipStyler color(Color value) { - return merge( - RemixTooltipStyler( - container: BoxStyler(decoration: BoxDecorationMix(color: value)), - ), - ); - } - - /// Sets container border radius - @override - RemixTooltipStyler borderRadius(BorderRadiusGeometryMix radius) { - return merge( - RemixTooltipStyler( - container: BoxStyler( - decoration: BoxDecorationMix(borderRadius: radius), - ), - ), - ); - } - - /// Sets container decoration - @override - RemixTooltipStyler decoration(DecorationMix value) { - return merge(RemixTooltipStyler(container: BoxStyler(decoration: value))); - } - - // Abstract method implementations for mixins - - @override - RemixTooltipStyler constraints(BoxConstraintsMix value) { - return merge(RemixTooltipStyler(container: BoxStyler(constraints: value))); - } - - @override - RemixTooltipStyler foregroundDecoration(DecorationMix value) { - return merge( - RemixTooltipStyler(container: BoxStyler(foregroundDecoration: value)), - ); - } - - @override - RemixTooltipStyler transform( - Matrix4 value, { - AlignmentGeometry alignment = Alignment.center, - }) { - return merge( - RemixTooltipStyler( - container: BoxStyler(transform: value, transformAlignment: alignment), - ), - ); - } } diff --git a/packages/remix/lib/src/utilities/remix_style.dart b/packages/remix/lib/src/utilities/remix_style.dart index 9608ea1b..58ca4246 100644 --- a/packages/remix/lib/src/utilities/remix_style.dart +++ b/packages/remix/lib/src/utilities/remix_style.dart @@ -42,102 +42,514 @@ class RemixStyleSpecBuilder> extends StatelessWidget { } } -/// Base abstract class for all Remix component styles. -/// -/// Provides universal mixins that all components share: -/// - [VariantStyleMixin] for style variants -/// - [WidgetStateVariantMixin] for widget-state variants -/// - [WidgetModifierStyleMixin] for widget modifiers -/// - [AnimationStyleMixin] for animations -/// -/// Usage: Extend this class for basic component styles. -/// ```dart -/// class MyStyle extends RemixStyler { -/// // your implementation -/// } -/// ``` -abstract class RemixStyler, T extends RemixStyler> - extends Style - with - VariantStyleMixin, - WidgetStateVariantMixin, - WidgetModifierStyleMixin, - AnimationStyleMixin { - const RemixStyler({super.variants, super.animation, super.modifier}); -} +/// Canonical Box-style anchors supplied by a forwarded nested styler. +abstract interface class RemixBoxStylerAnchors> { + T padding(EdgeInsetsGeometryMix value); + + T margin(EdgeInsetsGeometryMix value); + + T constraints(BoxConstraintsMix value); + + T border(BoxBorderMix value); + + T borderRadius(BorderRadiusGeometryMix value); -/// Abstract class for container-based component styles. -/// -/// Extends [RemixStyler] with container-specific mixins: -/// - [BorderStyleMixin] for border styling -/// - [BorderRadiusStyleMixin] for border radius -/// - [ShadowStyleMixin] for shadows -/// - [DecorationStyleMixin] for background decorations -/// - [SpacingStyleMixin] for padding and margin -/// - [TransformStyleMixin] for transformations -/// - [ConstraintStyleMixin] for size constraints -/// -/// Usage: Extend this class for component styles that use BoxSpec containers. -/// ```dart -/// class MyStyle extends RemixContainerStyler { -/// // your implementation -/// } -/// ``` -abstract class RemixContainerStyler< - S extends Spec, - T extends RemixContainerStyler -> - extends RemixStyler - with - BorderStyleMixin, - BorderRadiusStyleMixin, - ShadowStyleMixin, - DecorationStyleMixin, - SpacingStyleMixin, - TransformStyleMixin, - ConstraintStyleMixin { - const RemixContainerStyler({super.variants, super.animation, super.modifier}); - - T alignment(Alignment value); + T shape(ShapeBorderMix value); + + T decoration(DecorationMix value); + + T transform(Matrix4 value, {Alignment alignment = .center}); } -/// Abstract class for flex container-based component styles. -/// -/// Extends [RemixStyler] with container-specific mixins and flex layout mixins: -/// - [BorderStyleMixin] for border styling -/// - [BorderRadiusStyleMixin] for border radius -/// - [ShadowStyleMixin] for shadows -/// - [DecorationStyleMixin] for background decorations -/// - [SpacingStyleMixin] for padding and margin -/// - [TransformStyleMixin] for transformations -/// - [ConstraintStyleMixin] for size constraints -/// - [FlexStyleMixin] for flex layout properties -/// -/// Usage: Extend this class for component styles that use FlexBoxSpec containers. -/// ```dart -/// class MyStyle extends RemixFlexContainerStyler { -/// // your implementation -/// } -/// ``` -abstract class RemixFlexContainerStyler< - S extends Spec, - T extends RemixFlexContainerStyler -> - extends RemixStyler - with - BorderStyleMixin, - BorderRadiusStyleMixin, - ShadowStyleMixin, - DecorationStyleMixin, - SpacingStyleMixin, - TransformStyleMixin, - ConstraintStyleMixin, - FlexStyleMixin { - const RemixFlexContainerStyler({ - super.variants, - super.animation, - super.modifier, - }); +/// Marks generated Remix stylers that forward a Box-compatible surface. +mixin RemixBoxStylerMixin> + implements RemixBoxStylerAnchors {} + +/// Fluent-only Box conveniences retained alongside generated canonical APIs. +extension RemixBoxStylerConvenience> + on RemixBoxStylerAnchors { + T paddingTop(double value) => padding(EdgeInsetsGeometryMix.top(value)); + + T paddingBottom(double value) => padding(EdgeInsetsGeometryMix.bottom(value)); + + T paddingLeft(double value) => padding(EdgeInsetsGeometryMix.left(value)); + + T paddingRight(double value) => padding(EdgeInsetsGeometryMix.right(value)); + + T paddingX(double value) => padding(EdgeInsetsGeometryMix.horizontal(value)); + + T paddingY(double value) => padding(EdgeInsetsGeometryMix.vertical(value)); + + T paddingAll(double value) => padding(EdgeInsetsGeometryMix.all(value)); + + T paddingStart(double value) => padding(EdgeInsetsGeometryMix.start(value)); + + T paddingEnd(double value) => padding(EdgeInsetsGeometryMix.end(value)); + + T paddingOnly({ + double? horizontal, + double? vertical, + double? start, + double? end, + double? left, + double? right, + double? top, + double? bottom, + }) { + final resolvedLeft = left ?? horizontal; + final resolvedRight = right ?? horizontal; + final resolvedTop = top ?? vertical; + final resolvedBottom = bottom ?? vertical; + + if (start != null || end != null) { + return padding( + EdgeInsetsGeometryMix.directional( + start: start ?? resolvedLeft, + end: end ?? resolvedRight, + top: resolvedTop, + bottom: resolvedBottom, + ), + ); + } + + return padding( + EdgeInsetsGeometryMix.only( + left: resolvedLeft, + right: resolvedRight, + top: resolvedTop, + bottom: resolvedBottom, + ), + ); + } + + T marginTop(double value) => margin(EdgeInsetsGeometryMix.top(value)); + + T marginBottom(double value) => margin(EdgeInsetsGeometryMix.bottom(value)); + + T marginLeft(double value) => margin(EdgeInsetsGeometryMix.left(value)); + + T marginRight(double value) => margin(EdgeInsetsGeometryMix.right(value)); + + T marginX(double value) => margin(EdgeInsetsGeometryMix.horizontal(value)); + + T marginY(double value) => margin(EdgeInsetsGeometryMix.vertical(value)); + + T marginAll(double value) => margin(EdgeInsetsGeometryMix.all(value)); + + T marginStart(double value) => margin(EdgeInsetsGeometryMix.start(value)); + + T marginEnd(double value) => margin(EdgeInsetsGeometryMix.end(value)); + + T marginOnly({ + double? horizontal, + double? vertical, + double? start, + double? end, + double? left, + double? right, + double? top, + double? bottom, + }) { + final resolvedLeft = left ?? horizontal; + final resolvedRight = right ?? horizontal; + final resolvedTop = top ?? vertical; + final resolvedBottom = bottom ?? vertical; + + if (start != null || end != null) { + return margin( + EdgeInsetsGeometryMix.directional( + start: start ?? resolvedLeft, + end: end ?? resolvedRight, + top: resolvedTop, + bottom: resolvedBottom, + ), + ); + } + + return margin( + EdgeInsetsGeometryMix.only( + left: resolvedLeft, + right: resolvedRight, + top: resolvedTop, + bottom: resolvedBottom, + ), + ); + } + + T constraintsOnly({ + double? width, + double? height, + double? minWidth, + double? maxWidth, + double? minHeight, + double? maxHeight, + }) { + return constraints( + BoxConstraintsMix( + minWidth: minWidth ?? width, + maxWidth: maxWidth ?? width, + minHeight: minHeight ?? height, + maxHeight: maxHeight ?? height, + ), + ); + } + + T borderTop({ + Color? color, + double? width, + BorderStyle? style, + double? strokeAlign, + }) => border( + BorderMix.top( + BorderSideMix( + color: color, + strokeAlign: strokeAlign, + style: style, + width: width, + ), + ), + ); + + T borderBottom({ + Color? color, + double? width, + BorderStyle? style, + double? strokeAlign, + }) => border( + BorderMix.bottom( + BorderSideMix( + color: color, + strokeAlign: strokeAlign, + style: style, + width: width, + ), + ), + ); + + T borderLeft({ + Color? color, + double? width, + BorderStyle? style, + double? strokeAlign, + }) => border( + BorderMix.left( + BorderSideMix( + color: color, + strokeAlign: strokeAlign, + style: style, + width: width, + ), + ), + ); + + T borderRight({ + Color? color, + double? width, + BorderStyle? style, + double? strokeAlign, + }) => border( + BorderMix.right( + BorderSideMix( + color: color, + strokeAlign: strokeAlign, + style: style, + width: width, + ), + ), + ); + + T borderStart({ + Color? color, + double? width, + BorderStyle? style, + double? strokeAlign, + }) => border( + BorderDirectionalMix.start( + BorderSideMix( + color: color, + strokeAlign: strokeAlign, + style: style, + width: width, + ), + ), + ); + + T borderEnd({ + Color? color, + double? width, + BorderStyle? style, + double? strokeAlign, + }) => border( + BorderDirectionalMix.end( + BorderSideMix( + color: color, + strokeAlign: strokeAlign, + style: style, + width: width, + ), + ), + ); + + T borderVertical({ + Color? color, + double? width, + BorderStyle? style, + double? strokeAlign, + }) => border( + BorderMix.vertical( + BorderSideMix( + color: color, + strokeAlign: strokeAlign, + style: style, + width: width, + ), + ), + ); + + T borderHorizontal({ + Color? color, + double? width, + BorderStyle? style, + double? strokeAlign, + }) => border( + BorderMix.horizontal( + BorderSideMix( + color: color, + strokeAlign: strokeAlign, + style: style, + width: width, + ), + ), + ); + + T borderAll({ + Color? color, + double? width, + BorderStyle? style, + double? strokeAlign, + }) => border( + BorderMix.all( + BorderSideMix( + color: color, + strokeAlign: strokeAlign, + style: style, + width: width, + ), + ), + ); + + T borderRadiusAll(Radius radius) { + return borderRadius(BorderRadiusGeometryMix.all(radius)); + } + + T borderRadiusTop(Radius radius) { + return borderRadius(BorderRadiusGeometryMix.top(radius)); + } + + T borderRadiusBottom(Radius radius) { + return borderRadius(BorderRadiusGeometryMix.bottom(radius)); + } + + T borderRadiusLeft(Radius radius) { + return borderRadius(BorderRadiusGeometryMix.left(radius)); + } + + T borderRadiusRight(Radius radius) { + return borderRadius(BorderRadiusGeometryMix.right(radius)); + } + + T borderRadiusTopLeft(Radius radius) { + return borderRadius(BorderRadiusGeometryMix.topLeft(radius)); + } + + T borderRadiusTopRight(Radius radius) { + return borderRadius(BorderRadiusGeometryMix.topRight(radius)); + } + + T borderRadiusBottomLeft(Radius radius) { + return borderRadius(BorderRadiusGeometryMix.bottomLeft(radius)); + } + + T borderRadiusBottomRight(Radius radius) { + return borderRadius(BorderRadiusGeometryMix.bottomRight(radius)); + } + + T borderRadiusTopStart(Radius radius) { + return borderRadius(BorderRadiusGeometryMix.topStart(radius)); + } + + T borderRadiusTopEnd(Radius radius) { + return borderRadius(BorderRadiusGeometryMix.topEnd(radius)); + } + + T borderRadiusBottomStart(Radius radius) { + return borderRadius(BorderRadiusGeometryMix.bottomStart(radius)); + } + + T borderRadiusBottomEnd(Radius radius) { + return borderRadius(BorderRadiusGeometryMix.bottomEnd(radius)); + } + + T borderRounded(double radius) { + return borderRadius(BorderRadiusGeometryMix.circular(radius)); + } + + T borderRoundedTop(double radius) { + return borderRadius(BorderRadiusGeometryMix.top(.circular(radius))); + } + + T borderRoundedBottom(double radius) { + return borderRadius(BorderRadiusGeometryMix.bottom(.circular(radius))); + } + + T borderRoundedLeft(double radius) { + return borderRadius(BorderRadiusGeometryMix.left(.circular(radius))); + } + + T borderRoundedRight(double radius) { + return borderRadius(BorderRadiusGeometryMix.right(.circular(radius))); + } + + T borderRoundedTopLeft(double radius) { + return borderRadius(BorderRadiusGeometryMix.topLeft(.circular(radius))); + } + + T borderRoundedTopRight(double radius) { + return borderRadius(BorderRadiusGeometryMix.topRight(.circular(radius))); + } + + T borderRoundedBottomLeft(double radius) { + return borderRadius(BorderRadiusGeometryMix.bottomLeft(.circular(radius))); + } + + T borderRoundedBottomRight(double radius) { + return borderRadius(BorderRadiusGeometryMix.bottomRight(.circular(radius))); + } + + T borderRoundedTopStart(double radius) { + return borderRadius(BorderRadiusGeometryMix.topStart(.circular(radius))); + } + + T borderRoundedTopEnd(double radius) { + return borderRadius(BorderRadiusGeometryMix.topEnd(.circular(radius))); + } + + T borderRoundedBottomStart(double radius) { + return borderRadius(BorderRadiusGeometryMix.bottomStart(.circular(radius))); + } + + T borderRoundedBottomEnd(double radius) { + return borderRadius(BorderRadiusGeometryMix.bottomEnd(.circular(radius))); + } + + T shapeCircle({BorderSideMix? side}) { + return shape(CircleBorderMix(side: side)); + } + + T shapeStadium({BorderSideMix? side}) { + return shape(StadiumBorderMix(side: side)); + } + + T shapeRoundedRectangle({ + BorderSideMix? side, + BorderRadiusMix? borderRadius, + }) { + return shape( + RoundedRectangleBorderMix(borderRadius: borderRadius, side: side), + ); + } + + T shapeBeveledRectangle({ + BorderSideMix? side, + BorderRadiusMix? borderRadius, + }) { + return shape( + BeveledRectangleBorderMix(borderRadius: borderRadius, side: side), + ); + } + + T shapeContinuousRectangle({ + BorderSideMix? side, + BorderRadiusMix? borderRadius, + }) { + return shape( + ContinuousRectangleBorderMix(borderRadius: borderRadius, side: side), + ); + } + + T shapeStar({ + BorderSideMix? side, + double? points, + double? innerRadiusRatio, + double? pointRounding, + double? valleyRounding, + double? rotation, + double? squash, + }) { + return shape( + StarBorderMix( + side: side, + points: points, + innerRadiusRatio: innerRadiusRatio, + pointRounding: pointRounding, + valleyRounding: valleyRounding, + rotation: rotation, + squash: squash, + ), + ); + } + + T shapeLinear({ + BorderSideMix? side, + LinearBorderEdgeMix? start, + LinearBorderEdgeMix? end, + LinearBorderEdgeMix? top, + LinearBorderEdgeMix? bottom, + }) { + return shape( + LinearBorderMix( + side: side, + start: start, + end: end, + top: top, + bottom: bottom, + ), + ); + } + + T shapeSuperellipse({BorderSideMix? side, BorderRadiusMix? borderRadius}) { + return shape( + RoundedSuperellipseBorderMix(borderRadius: borderRadius, side: side), + ); + } + + T shadowOnly({ + Color? color, + Offset? offset, + double? blurRadius, + double? spreadRadius, + }) { + return decoration( + BoxDecorationMix.boxShadow([ + BoxShadowMix( + color: color, + offset: offset, + blurRadius: blurRadius, + spreadRadius: spreadRadius, + ), + ]), + ); + } + + T boxShadows(List value) { + return decoration(BoxDecorationMix.boxShadow(value)); + } + + T boxElevation(ElevationShadow value) { + return decoration( + BoxDecorationMix.boxShadow(BoxShadowMix.fromElevation(value)), + ); + } - T alignment(Alignment value); + T transformReset() => transform(Matrix4.identity()); } diff --git a/packages/remix/lib/src/utilities/selected_mixin.dart b/packages/remix/lib/src/utilities/selected_mixin.dart index 0c30a16f..f4ed1965 100644 --- a/packages/remix/lib/src/utilities/selected_mixin.dart +++ b/packages/remix/lib/src/utilities/selected_mixin.dart @@ -1,12 +1,12 @@ import 'package:mix/mix.dart'; -import 'remix_style.dart'; - -mixin SelectedWidgetStateVariantMixin< - S extends Spec, - T extends RemixStyler +/// Adds the selected widget-state variant to generated Remix stylers. +extension SelectedWidgetStateVariantExtension< + T extends Style, + S extends Spec > - on RemixStyler { + on MixStyler { + /// Applies [style] while the widget is selected. T onSelected(T style) { return variant(ContextVariant.widgetState(.selected), style); } diff --git a/packages/remix/pubspec.yaml b/packages/remix/pubspec.yaml index 4c12e1a3..70e0758c 100644 --- a/packages/remix/pubspec.yaml +++ b/packages/remix/pubspec.yaml @@ -22,16 +22,15 @@ dependencies: flutter: sdk: flutter mix: ^2.1.0 - mix_annotations: ^2.1.2 + mix_annotations: ^2.2.0-beta.0 naked_ui: ^1.0.0-beta.4 dev_dependencies: - dart_code_metrics_presets: ^2.32.0 flutter_test: sdk: flutter build_runner: ^2.10.1 meta: ^1.18.0 - mix_generator: ^2.1.2 + mix_generator: ^2.2.0-beta.0 flutter: uses-material-design: true diff --git a/packages/remix/test/components/accordion/accordion_style_test.dart b/packages/remix/test/components/accordion/accordion_style_test.dart index 8ac20e8f..eefa5179 100644 --- a/packages/remix/test/components/accordion/accordion_style_test.dart +++ b/packages/remix/test/components/accordion/accordion_style_test.dart @@ -110,10 +110,8 @@ void main() { modify: (style) => style.alignment(Alignment.centerLeft), expect: (style) { expect( - style.$trigger, - equals( - Prop.maybeMix(FlexBoxStyler(alignment: Alignment.centerLeft)), - ), + style, + equals(RemixAccordionStyler.alignment(Alignment.centerLeft)), ); }, ); @@ -124,11 +122,9 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$trigger, + style, equals( - Prop.maybeMix( - FlexBoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), - ), + RemixAccordionStyler.padding(EdgeInsetsGeometryMix.all(16.0)), ), ); }, @@ -140,12 +136,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8.0)), expect: (style) { expect( - style.$trigger, - equals( - Prop.maybeMix( - FlexBoxStyler(margin: EdgeInsetsGeometryMix.all(8.0)), - ), - ), + style, + equals(RemixAccordionStyler.margin(EdgeInsetsGeometryMix.all(8.0))), ); }, ); @@ -155,14 +147,7 @@ void main() { initial: RemixAccordionStyler(), modify: (style) => style.color(Colors.blue), expect: (style) { - expect( - style.$trigger, - equals( - Prop.maybeMix( - FlexBoxStyler(decoration: BoxDecorationMix(color: Colors.blue)), - ), - ), - ); + expect(style, equals(RemixAccordionStyler.color(Colors.blue))); }, ); @@ -177,14 +162,12 @@ void main() { ), expect: (style) { expect( - style.$trigger, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: BoxDecorationMix( - color: Colors.red, - borderRadius: BorderRadiusMix.circular(8.0), - ), + RemixAccordionStyler.decoration( + BoxDecorationMix( + color: Colors.red, + borderRadius: BorderRadiusMix.circular(8.0), ), ), ), @@ -200,15 +183,10 @@ void main() { ), expect: (style) { expect( - style.$trigger, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: 100.0, - minHeight: 40.0, - ), - ), + RemixAccordionStyler.constraints( + BoxConstraintsMix(minWidth: 100.0, minHeight: 40.0), ), ), ); @@ -220,21 +198,7 @@ void main() { initial: RemixAccordionStyler(), modify: (style) => style.size(200.0, 50.0), expect: (style) { - expect( - style.$trigger, - equals( - Prop.maybeMix( - FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: 200.0, - maxWidth: 200.0, - minHeight: 50.0, - maxHeight: 50.0, - ), - ), - ), - ), - ); + expect(style, equals(RemixAccordionStyler.size(200.0, 50.0))); }, ); @@ -244,15 +208,9 @@ void main() { modify: (style) => style.borderRadius(BorderRadiusMix.circular(12.0)), expect: (style) { expect( - style.$trigger, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: BoxDecorationMix( - borderRadius: BorderRadiusMix.circular(12.0), - ), - ), - ), + RemixAccordionStyler.borderRadius(BorderRadiusMix.circular(12.0)), ), ); }, @@ -268,13 +226,11 @@ void main() { ), expect: (style) { expect( - style.$trigger, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - foregroundDecoration: BoxDecorationMix( - border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), - ), + RemixAccordionStyler.foregroundDecoration( + BoxDecorationMix( + border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), ), ), ), @@ -289,13 +245,11 @@ void main() { style.transform(Matrix4.identity(), alignment: Alignment.topLeft), expect: (style) { expect( - style.$trigger, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - transform: Matrix4.identity(), - transformAlignment: Alignment.topLeft, - ), + RemixAccordionStyler.transform( + Matrix4.identity(), + alignment: Alignment.topLeft, ), ), ); @@ -335,10 +289,7 @@ void main() { initial: RemixAccordionStyler(), modify: (style) => style.spacing(8.0), expect: (style) { - expect( - style.$trigger, - equals(Prop.maybeMix(FlexBoxStyler(spacing: 8.0))), - ); + expect(style, equals(RemixAccordionStyler.spacing(8.0))); }, ); @@ -525,8 +476,8 @@ void main() { }); group('Factory Constructors', () { - test('backgroundColor factory', () { - final style = RemixAccordionStyler.backgroundColor(Colors.red); + test('color factory', () { + final style = RemixAccordionStyler.color(Colors.red); expect(style.$trigger, isNotNull); }); @@ -575,63 +526,33 @@ void main() { expect(style.$trigger, isNotNull); }); - test('titleColor factory', () { - final style = RemixAccordionStyler.titleColor(Colors.blue); - expect(style.$title, isNotNull); - }); - - test('titleFontSize factory', () { - final style = RemixAccordionStyler.titleFontSize(16.0); - expect(style.$title, isNotNull); - }); - - test('titleFontWeight factory', () { - final style = RemixAccordionStyler.titleFontWeight(FontWeight.bold); - expect(style.$title, isNotNull); - }); - - test('titleStyle factory', () { - final style = RemixAccordionStyler.titleStyle( - TextStyleMix(color: Colors.red), + test('title factory', () { + final style = RemixAccordionStyler.title( + TextStyler(style: TextStyleMix(color: Colors.red)), ); expect(style.$title, isNotNull); }); - test('leadingIconColor factory', () { - final style = RemixAccordionStyler.leadingIconColor(Colors.green); - expect(style.$leadingIcon, isNotNull); - }); - - test('leadingIconSize factory', () { - final style = RemixAccordionStyler.leadingIconSize(24.0); + test('leadingIcon factory', () { + final style = RemixAccordionStyler.leadingIcon( + IconStyler(color: Colors.green, size: 24.0), + ); expect(style.$leadingIcon, isNotNull); }); - test('trailingIconColor factory', () { - final style = RemixAccordionStyler.trailingIconColor(Colors.purple); - expect(style.$trailingIcon, isNotNull); - }); - - test('trailingIconSize factory', () { - final style = RemixAccordionStyler.trailingIconSize(16.0); - expect(style.$trailingIcon, isNotNull); - }); - - test('contentColor factory', () { - final style = RemixAccordionStyler.contentColor(Colors.grey); - expect(style.$content, isNotNull); - }); - - test('contentPadding factory', () { - final style = RemixAccordionStyler.contentPadding( - EdgeInsetsGeometryMix.all(12.0), + test('trailingIcon factory', () { + final style = RemixAccordionStyler.trailingIcon( + IconStyler(color: Colors.purple, size: 16.0), ); - expect(style.$content, isNotNull); + expect(style.$trailingIcon, isNotNull); }); - test('contentDecoration factory', () { - final style = RemixAccordionStyler.contentDecoration( - BoxDecorationMix(color: Colors.white), + test('content factory', () { + final style = RemixAccordionStyler.content( + BoxStyler( + padding: EdgeInsetsGeometryMix.all(12.0), + decoration: BoxDecorationMix(color: Colors.white), + ), ); expect(style.$content, isNotNull); }); diff --git a/packages/remix/test/components/avatar/avatar_style_test.dart b/packages/remix/test/components/avatar/avatar_style_test.dart index e078a351..5cdd4df4 100644 --- a/packages/remix/test/components/avatar/avatar_style_test.dart +++ b/packages/remix/test/components/avatar/avatar_style_test.dart @@ -79,14 +79,7 @@ void main() { initial: RemixAvatarStyler(), modify: (style) => style.color(Colors.green), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler(decoration: BoxDecorationMix(color: Colors.green)), - ), - ), - ); + expect(style, equals(RemixAvatarStyler.color(Colors.green))); }, ); @@ -98,15 +91,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - borderRadius: BorderRadiusMix.circular(10), - shape: BoxShape.rectangle, - ), - ), + RemixAvatarStyler.borderRadius( + BorderRadiusGeometryMix.all(Radius.circular(10)), ), ), ); @@ -183,10 +171,8 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(8.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(BoxStyler(padding: EdgeInsetsGeometryMix.all(8.0))), - ), + style, + equals(RemixAvatarStyler.padding(EdgeInsetsGeometryMix.all(8.0))), ); }, ); @@ -197,10 +183,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(4.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(BoxStyler(margin: EdgeInsetsGeometryMix.all(4.0))), - ), + style, + equals(RemixAvatarStyler.margin(EdgeInsetsGeometryMix.all(4.0))), ); }, ); @@ -210,10 +194,7 @@ void main() { initial: RemixAvatarStyler(), modify: (style) => style.alignment(Alignment.topLeft), expect: (style) { - expect( - style.$container, - equals(Prop.maybeMix(BoxStyler(alignment: Alignment.topLeft))), - ); + expect(style, equals(RemixAvatarStyler.alignment(Alignment.topLeft))); }, ); @@ -224,10 +205,10 @@ void main() { style.decoration(BoxDecorationMix(color: Colors.yellow)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler(decoration: BoxDecorationMix(color: Colors.yellow)), + RemixAvatarStyler.decoration( + BoxDecorationMix(color: Colors.yellow), ), ), ); @@ -247,16 +228,14 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 50, - maxWidth: 100, - minHeight: 50, - maxHeight: 100, - ), + RemixAvatarStyler.constraints( + BoxConstraintsMix( + minWidth: 50, + maxWidth: 100, + minHeight: 50, + maxHeight: 100, ), ), ), @@ -284,9 +263,11 @@ void main() { style.label(TextStyler(style: TextStyleMix(fontSize: 16))), expect: (style) { expect( - style.$label, + style, equals( - Prop.maybeMix(TextStyler(style: TextStyleMix(fontSize: 16))), + RemixAvatarStyler.label( + TextStyler(style: TextStyleMix(fontSize: 16)), + ), ), ); }, @@ -306,21 +287,7 @@ void main() { initial: RemixAvatarStyler(), modify: (style) => style.size(60.0, 40.0), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 60.0, - maxWidth: 60.0, - minHeight: 40.0, - maxHeight: 40.0, - ), - ), - ), - ), - ); + expect(style, equals(RemixAvatarStyler.size(60.0, 40.0))); }, ); @@ -349,12 +316,10 @@ void main() { style.foregroundDecoration(BoxDecorationMix(color: Colors.cyan)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - foregroundDecoration: BoxDecorationMix(color: Colors.cyan), - ), + RemixAvatarStyler.foregroundDecoration( + BoxDecorationMix(color: Colors.cyan), ), ), ); @@ -367,15 +332,8 @@ void main() { modify: (style) => style.transform(Matrix4.identity()), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler( - transform: Matrix4.identity(), - transformAlignment: Alignment.center, - ), - ), - ), + style, + equals(RemixAvatarStyler.transform(Matrix4.identity())), ); }, ); diff --git a/packages/remix/test/components/badge/badge_style_test.dart b/packages/remix/test/components/badge/badge_style_test.dart index b6335fb7..95fd4e30 100644 --- a/packages/remix/test/components/badge/badge_style_test.dart +++ b/packages/remix/test/components/badge/badge_style_test.dart @@ -77,14 +77,10 @@ void main() { style.borderRadius(BorderRadiusGeometryMix.circular(12.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - borderRadius: BorderRadiusGeometryMix.circular(12.0), - ), - ), + RemixBadgeStyler.borderRadius( + BorderRadiusGeometryMix.circular(12.0), ), ), ); @@ -97,12 +93,8 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), - ), - ), + style, + equals(RemixBadgeStyler.padding(EdgeInsetsGeometryMix.all(16.0))), ); }, ); @@ -113,10 +105,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(4.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(BoxStyler(margin: EdgeInsetsGeometryMix.all(4.0))), - ), + style, + equals(RemixBadgeStyler.margin(EdgeInsetsGeometryMix.all(4.0))), ); }, ); @@ -132,14 +122,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - color: Colors.purple, - borderRadius: BorderRadiusGeometryMix.circular(8.0), - ), + RemixBadgeStyler.decoration( + BoxDecorationMix( + color: Colors.purple, + borderRadius: BorderRadiusGeometryMix.circular(8.0), ), ), ), @@ -153,8 +141,8 @@ void main() { modify: (style) => style.alignment(Alignment.centerLeft), expect: (style) { expect( - style.$container, - equals(Prop.maybeMix(BoxStyler(alignment: Alignment.centerLeft))), + style, + equals(RemixBadgeStyler.alignment(Alignment.centerLeft)), ); }, ); @@ -166,9 +154,11 @@ void main() { style.label(TextStyler(style: TextStyleMix(fontSize: 14.0))), expect: (style) { expect( - style.$label, + style, equals( - Prop.maybeMix(TextStyler(style: TextStyleMix(fontSize: 14.0))), + RemixBadgeStyler.label( + TextStyler(style: TextStyleMix(fontSize: 14.0)), + ), ), ); }, @@ -182,15 +172,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 50.0, - minHeight: 20.0, - ), - ), + RemixBadgeStyler.constraints( + BoxConstraintsMix(minWidth: 50.0, minHeight: 20.0), ), ), ); @@ -236,14 +221,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - foregroundDecoration: BoxDecorationMix( - color: Colors.yellow.withValues(alpha: 0.5), - ), - ), + RemixBadgeStyler.foregroundDecoration( + BoxDecorationMix(color: Colors.yellow.withValues(alpha: 0.5)), ), ), ); @@ -256,15 +237,8 @@ void main() { modify: (style) => style.transform(Matrix4.rotationZ(0.1)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler( - transform: Matrix4.rotationZ(0.1), - transformAlignment: Alignment.center, - ), - ), - ), + style, + equals(RemixBadgeStyler.transform(Matrix4.rotationZ(0.1))), ); }, ); diff --git a/packages/remix/test/components/button/button_style_test.dart b/packages/remix/test/components/button/button_style_test.dart index b80d4d30..7983af93 100644 --- a/packages/remix/test/components/button/button_style_test.dart +++ b/packages/remix/test/components/button/button_style_test.dart @@ -61,14 +61,7 @@ void main() { final shadow = BoxShadowMix().color(Colors.black).blurRadius(4.0); final style = RemixButtonStyler().shadow(shadow); - expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler(decoration: BoxDecorationMix(boxShadow: [shadow])), - ), - ), - ); + expect(style, equals(RemixButtonStyler.shadow(shadow))); }); }); @@ -106,12 +99,8 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), - ), - ), + style, + equals(RemixButtonStyler.padding(EdgeInsetsGeometryMix.all(16.0))), ); }, ); @@ -122,12 +111,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler(margin: EdgeInsetsGeometryMix.all(8.0)), - ), - ), + style, + equals(RemixButtonStyler.margin(EdgeInsetsGeometryMix.all(8.0))), ); }, ); @@ -143,14 +128,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: BoxDecorationMix( - color: Colors.blue, - borderRadius: BorderRadiusMix.circular(8.0), - ), + RemixButtonStyler.decoration( + BoxDecorationMix( + color: Colors.blue, + borderRadius: BorderRadiusMix.circular(8.0), ), ), ), @@ -164,10 +147,8 @@ void main() { modify: (style) => style.alignment(Alignment.centerLeft), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(FlexBoxStyler(alignment: Alignment.centerLeft)), - ), + style, + equals(RemixButtonStyler.alignment(Alignment.centerLeft)), ); }, ); @@ -177,10 +158,7 @@ void main() { initial: RemixButtonStyler(), modify: (style) => style.spacing(12.0), expect: (style) { - expect( - style.$container, - equals(Prop.maybeMix(FlexBoxStyler(spacing: 12.0))), - ); + expect(style, equals(RemixButtonStyler.spacing(12.0))); }, ); @@ -192,15 +170,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: 100.0, - minHeight: 40.0, - ), - ), + RemixButtonStyler.constraints( + BoxConstraintsMix(minWidth: 100.0, minHeight: 40.0), ), ), ); @@ -237,13 +210,11 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - foregroundDecoration: BoxDecorationMix( - border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), - ), + RemixButtonStyler.foregroundDecoration( + BoxDecorationMix( + border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), ), ), ), @@ -258,13 +229,11 @@ void main() { style.transform(Matrix4.identity(), alignment: Alignment.topLeft), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - transform: Matrix4.identity(), - transformAlignment: Alignment.topLeft, - ), + RemixButtonStyler.transform( + Matrix4.identity(), + alignment: Alignment.topLeft, ), ), ); @@ -272,9 +241,10 @@ void main() { ); styleMethodTest( - 'rotate', + 'modifierRotate', initial: RemixButtonStyler(), - modify: (style) => style.rotate(0.5, alignment: Alignment.topLeft), + modify: (style) => + style.modifierRotate(0.5, alignment: Alignment.topLeft), expect: (style) { expect( style.$modifier, @@ -293,7 +263,10 @@ void main() { initial: RemixButtonStyler(), modify: (style) => style.scale(1.2, alignment: Alignment.topLeft), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals(RemixButtonStyler.scale(1.2, alignment: Alignment.topLeft)), + ); }, ); @@ -302,7 +275,7 @@ void main() { initial: RemixButtonStyler(), modify: (style) => style.translate(1.0, 2.0, 3.0), expect: (style) { - expect(style.$container, isNotNull); + expect(style, equals(RemixButtonStyler.translate(1.0, 2.0, 3.0))); }, ); @@ -311,7 +284,7 @@ void main() { initial: RemixButtonStyler(), modify: (style) => style.skew(0.1, 0.2), expect: (style) { - expect(style.$container, isNotNull); + expect(style, equals(RemixButtonStyler.skew(0.1, 0.2))); }, ); @@ -370,14 +343,7 @@ void main() { initial: RemixButtonStyler(), modify: (style) => style.color(Colors.blue), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler(decoration: BoxDecorationMix(color: Colors.blue)), - ), - ), - ); + expect(style, equals(RemixButtonStyler.color(Colors.blue))); }, ); diff --git a/packages/remix/test/components/callout/callout_style_test.dart b/packages/remix/test/components/callout/callout_style_test.dart index 06ad2fbc..8b7391cd 100644 --- a/packages/remix/test/components/callout/callout_style_test.dart +++ b/packages/remix/test/components/callout/callout_style_test.dart @@ -47,12 +47,8 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(20.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler(padding: EdgeInsetsGeometryMix.all(20.0)), - ), - ), + style, + equals(RemixCalloutStyler.padding(EdgeInsetsGeometryMix.all(20.0))), ); }, ); @@ -75,12 +71,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler(margin: EdgeInsetsGeometryMix.all(8.0)), - ), - ), + style, + equals(RemixCalloutStyler.margin(EdgeInsetsGeometryMix.all(8.0))), ); }, ); @@ -131,15 +123,11 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: ShapeDecorationMix( - shape: RoundedRectangleBorderMix( - borderRadius: BorderRadiusGeometryMix.circular(16.0), - ), - ), + RemixCalloutStyler.shape( + RoundedRectangleBorderMix( + borderRadius: BorderRadiusGeometryMix.circular(16.0), ), ), ), @@ -154,14 +142,10 @@ void main() { style.borderRadius(BorderRadiusGeometryMix.circular(12.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: BoxDecorationMix( - borderRadius: BorderRadiusGeometryMix.circular(12.0), - ), - ), + RemixCalloutStyler.borderRadius( + BorderRadiusGeometryMix.circular(12.0), ), ), ); @@ -179,14 +163,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: BoxDecorationMix( - color: Colors.purple, - borderRadius: BorderRadiusGeometryMix.circular(8.0), - ), + RemixCalloutStyler.decoration( + BoxDecorationMix( + color: Colors.purple, + borderRadius: BorderRadiusGeometryMix.circular(8.0), ), ), ), @@ -200,10 +182,8 @@ void main() { modify: (style) => style.alignment(Alignment.centerRight), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(FlexBoxStyler(alignment: Alignment.centerRight)), - ), + style, + equals(RemixCalloutStyler.alignment(Alignment.centerRight)), ); }, ); @@ -213,10 +193,7 @@ void main() { initial: RemixCalloutStyler(), modify: (style) => style.spacing(16.0), expect: (style) { - expect( - style.$container, - equals(Prop.maybeMix(FlexBoxStyler(spacing: 16.0))), - ); + expect(style, equals(RemixCalloutStyler.spacing(16.0))); }, ); @@ -287,15 +264,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: 200.0, - minHeight: 50.0, - ), - ), + RemixCalloutStyler.constraints( + BoxConstraintsMix(minWidth: 200.0, minHeight: 50.0), ), ), ); @@ -310,14 +282,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - foregroundDecoration: BoxDecorationMix( - color: Colors.cyan.withValues(alpha: 0.3), - ), - ), + RemixCalloutStyler.foregroundDecoration( + BoxDecorationMix(color: Colors.cyan.withValues(alpha: 0.3)), ), ), ); @@ -330,15 +298,8 @@ void main() { modify: (style) => style.transform(Matrix4.rotationZ(0.2)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler( - transform: Matrix4.rotationZ(0.2), - transformAlignment: Alignment.center, - ), - ), - ), + style, + equals(RemixCalloutStyler.transform(Matrix4.rotationZ(0.2))), ); }, ); diff --git a/packages/remix/test/components/checkbox/checkbox_style_test.dart b/packages/remix/test/components/checkbox/checkbox_style_test.dart index 5b58835b..16452a4f 100644 --- a/packages/remix/test/components/checkbox/checkbox_style_test.dart +++ b/packages/remix/test/components/checkbox/checkbox_style_test.dart @@ -48,15 +48,11 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: ShapeDecorationMix( - shape: RoundedRectangleBorderMix( - borderRadius: BorderRadiusMix.circular(8.0), - ), - ), + RemixCheckboxStyler.shape( + RoundedRectangleBorderMix( + borderRadius: BorderRadiusMix.circular(8.0), ), ), ), @@ -71,14 +67,10 @@ void main() { style.border(BoxBorderMix.all(BorderSideMix(color: Colors.grey))), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - border: BoxBorderMix.all(BorderSideMix(color: Colors.grey)), - ), - ), + RemixCheckboxStyler.border( + BoxBorderMix.all(BorderSideMix(color: Colors.grey)), ), ), ); @@ -103,8 +95,8 @@ void main() { modify: (style) => style.alignment(Alignment.centerLeft), expect: (style) { expect( - style.$container, - equals(Prop.maybeMix(BoxStyler(alignment: Alignment.centerLeft))), + style, + equals(RemixCheckboxStyler.alignment(Alignment.centerLeft)), ); }, ); @@ -127,10 +119,8 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(8.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(BoxStyler(padding: EdgeInsetsGeometryMix.all(8.0))), - ), + style, + equals(RemixCheckboxStyler.padding(EdgeInsetsGeometryMix.all(8.0))), ); }, ); @@ -156,21 +146,7 @@ void main() { initial: RemixCheckboxStyler(), modify: (style) => style.size(20.0, 20.0), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 20.0, - maxWidth: 20.0, - minHeight: 20.0, - maxHeight: 20.0, - ), - ), - ), - ), - ); + expect(style, equals(RemixCheckboxStyler.size(20.0, 20.0))); }, ); @@ -181,14 +157,10 @@ void main() { style.borderRadius(BorderRadiusGeometryMix.circular(6.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - borderRadius: BorderRadiusGeometryMix.circular(6.0), - ), - ), + RemixCheckboxStyler.borderRadius( + BorderRadiusGeometryMix.circular(6.0), ), ), ); @@ -234,15 +206,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 18.0, - minHeight: 18.0, - ), - ), + RemixCheckboxStyler.constraints( + BoxConstraintsMix(minWidth: 18.0, minHeight: 18.0), ), ), ); @@ -260,14 +227,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - color: Colors.lightBlue, - borderRadius: BorderRadiusGeometryMix.circular(4.0), - ), + RemixCheckboxStyler.decoration( + BoxDecorationMix( + color: Colors.lightBlue, + borderRadius: BorderRadiusGeometryMix.circular(4.0), ), ), ), @@ -281,10 +246,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(4.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(BoxStyler(margin: EdgeInsetsGeometryMix.all(4.0))), - ), + style, + equals(RemixCheckboxStyler.margin(EdgeInsetsGeometryMix.all(4.0))), ); }, ); @@ -297,14 +260,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - foregroundDecoration: BoxDecorationMix( - color: Colors.yellow.withValues(alpha: 0.3), - ), - ), + RemixCheckboxStyler.foregroundDecoration( + BoxDecorationMix(color: Colors.yellow.withValues(alpha: 0.3)), ), ), ); @@ -317,15 +276,8 @@ void main() { modify: (style) => style.transform(Matrix4.rotationZ(0.1)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler( - transform: Matrix4.rotationZ(0.1), - transformAlignment: Alignment.center, - ), - ), - ), + style, + equals(RemixCheckboxStyler.transform(Matrix4.rotationZ(0.1))), ); }, ); diff --git a/packages/remix/test/components/dialog/dialog_style_test.dart b/packages/remix/test/components/dialog/dialog_style_test.dart index 007d1e06..ea576404 100644 --- a/packages/remix/test/components/dialog/dialog_style_test.dart +++ b/packages/remix/test/components/dialog/dialog_style_test.dart @@ -95,8 +95,8 @@ void main() { modify: (style) => style.alignment(Alignment.centerRight), expect: (style) { expect( - style.$container, - equals(Prop.maybeMix(BoxStyler(alignment: Alignment.centerRight))), + style, + equals(RemixDialogStyler.alignment(Alignment.centerRight)), ); }, ); @@ -107,12 +107,8 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(24.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler(padding: EdgeInsetsGeometryMix.all(24.0)), - ), - ), + style, + equals(RemixDialogStyler.padding(EdgeInsetsGeometryMix.all(24.0))), ); }, ); @@ -138,21 +134,7 @@ void main() { initial: RemixDialogStyler(), modify: (style) => style.size(400.0, 300.0), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 400.0, - maxWidth: 400.0, - minHeight: 300.0, - maxHeight: 300.0, - ), - ), - ), - ), - ); + expect(style, equals(RemixDialogStyler.size(400.0, 300.0))); }, ); @@ -163,14 +145,10 @@ void main() { style.borderRadius(BorderRadiusGeometryMix.circular(16.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - borderRadius: BorderRadiusGeometryMix.circular(16.0), - ), - ), + RemixDialogStyler.borderRadius( + BorderRadiusGeometryMix.circular(16.0), ), ), ); @@ -185,15 +163,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 300.0, - minHeight: 200.0, - ), - ), + RemixDialogStyler.constraints( + BoxConstraintsMix(minWidth: 300.0, minHeight: 200.0), ), ), ); @@ -211,14 +184,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - color: Colors.blue, - borderRadius: BorderRadiusGeometryMix.circular(12.0), - ), + RemixDialogStyler.decoration( + BoxDecorationMix( + color: Colors.blue, + borderRadius: BorderRadiusGeometryMix.circular(12.0), ), ), ), @@ -232,10 +203,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(BoxStyler(margin: EdgeInsetsGeometryMix.all(16.0))), - ), + style, + equals(RemixDialogStyler.margin(EdgeInsetsGeometryMix.all(16.0))), ); }, ); @@ -248,14 +217,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - foregroundDecoration: BoxDecorationMix( - color: Colors.yellow.withValues(alpha: 0.3), - ), - ), + RemixDialogStyler.foregroundDecoration( + BoxDecorationMix(color: Colors.yellow.withValues(alpha: 0.3)), ), ), ); @@ -268,15 +233,8 @@ void main() { modify: (style) => style.transform(Matrix4.rotationZ(0.1)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler( - transform: Matrix4.rotationZ(0.1), - transformAlignment: Alignment.center, - ), - ), - ), + style, + equals(RemixDialogStyler.transform(Matrix4.rotationZ(0.1))), ); }, ); diff --git a/packages/remix/test/components/dialog/dialog_widget_test.dart b/packages/remix/test/components/dialog/dialog_widget_test.dart index 6bbca7c4..eb61df48 100644 --- a/packages/remix/test/components/dialog/dialog_widget_test.dart +++ b/packages/remix/test/components/dialog/dialog_widget_test.dart @@ -1,5 +1,3 @@ -import 'dart:ui' show SemanticsRole; - import 'package:flutter/material.dart'; import 'package:flutter/rendering.dart'; import 'package:flutter/services.dart'; diff --git a/packages/remix/test/components/divider/divider_style_test.dart b/packages/remix/test/components/divider/divider_style_test.dart index d9c891e9..5a2d06c8 100644 --- a/packages/remix/test/components/divider/divider_style_test.dart +++ b/packages/remix/test/components/divider/divider_style_test.dart @@ -44,14 +44,7 @@ void main() { initial: RemixDividerStyler(), modify: (style) => style.color(Colors.red), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler(decoration: BoxDecorationMix(color: Colors.red)), - ), - ), - ); + expect(style, equals(RemixDividerStyler.color(Colors.red))); }, ); @@ -82,12 +75,8 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), - ), - ), + style, + equals(RemixDividerStyler.padding(EdgeInsetsGeometryMix.all(16.0))), ); }, ); @@ -98,10 +87,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(BoxStyler(margin: EdgeInsetsGeometryMix.all(8.0))), - ), + style, + equals(RemixDividerStyler.margin(EdgeInsetsGeometryMix.all(8.0))), ); }, ); @@ -111,10 +98,7 @@ void main() { initial: RemixDividerStyler(), modify: (style) => style.alignment(Alignment.center), expect: (style) { - expect( - style.$container, - equals(Prop.maybeMix(BoxStyler(alignment: Alignment.center))), - ); + expect(style, equals(RemixDividerStyler.alignment(Alignment.center))); }, ); @@ -129,14 +113,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - color: Colors.blue, - borderRadius: BorderRadiusMix.circular(4.0), - ), + RemixDividerStyler.decoration( + BoxDecorationMix( + color: Colors.blue, + borderRadius: BorderRadiusMix.circular(4.0), ), ), ), @@ -152,15 +134,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 100.0, - minHeight: 1.0, - ), - ), + RemixDividerStyler.constraints( + BoxConstraintsMix(minWidth: 100.0, minHeight: 1.0), ), ), ); @@ -177,15 +154,11 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - foregroundDecoration: BoxDecorationMix( - border: BoxBorderMix.all( - BorderSideMix(color: Colors.black), - ), - ), + RemixDividerStyler.foregroundDecoration( + BoxDecorationMix( + border: BoxBorderMix.all(BorderSideMix(color: Colors.black)), ), ), ), @@ -200,13 +173,11 @@ void main() { style.transform(Matrix4.identity(), alignment: Alignment.topCenter), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - transform: Matrix4.identity(), - transformAlignment: Alignment.topCenter, - ), + RemixDividerStyler.transform( + Matrix4.identity(), + alignment: Alignment.topCenter, ), ), ); diff --git a/packages/remix/test/components/icon_button/icon_button_style_test.dart b/packages/remix/test/components/icon_button/icon_button_style_test.dart index dc573e69..131cd59b 100644 --- a/packages/remix/test/components/icon_button/icon_button_style_test.dart +++ b/packages/remix/test/components/icon_button/icon_button_style_test.dart @@ -67,14 +67,7 @@ void main() { initial: RemixIconButtonStyler(), modify: (style) => style.color(Colors.blue), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler(decoration: BoxDecorationMix(color: Colors.blue)), - ), - ), - ); + expect(style, equals(RemixIconButtonStyler.color(Colors.blue))); }, ); @@ -84,11 +77,9 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), - ), + RemixIconButtonStyler.padding(EdgeInsetsGeometryMix.all(16.0)), ), ); }, @@ -101,14 +92,10 @@ void main() { style.borderRadius(BorderRadiusGeometryMix.circular(8.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - borderRadius: BorderRadiusGeometryMix.circular(8.0), - ), - ), + RemixIconButtonStyler.borderRadius( + BorderRadiusGeometryMix.circular(8.0), ), ), ); @@ -145,14 +132,10 @@ void main() { style.border(BoxBorderMix.all(BorderSideMix(color: Colors.grey))), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - border: BoxBorderMix.all(BorderSideMix(color: Colors.grey)), - ), - ), + RemixIconButtonStyler.border( + BoxBorderMix.all(BorderSideMix(color: Colors.grey)), ), ), ); @@ -165,9 +148,9 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(4.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix(BoxStyler(margin: EdgeInsetsGeometryMix.all(4.0))), + RemixIconButtonStyler.margin(EdgeInsetsGeometryMix.all(4.0)), ), ); }, @@ -179,8 +162,8 @@ void main() { modify: (style) => style.alignment(Alignment.centerLeft), expect: (style) { expect( - style.$container, - equals(Prop.maybeMix(BoxStyler(alignment: Alignment.centerLeft))), + style, + equals(RemixIconButtonStyler.alignment(Alignment.centerLeft)), ); }, ); @@ -196,14 +179,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - color: Colors.lightBlue, - borderRadius: BorderRadiusGeometryMix.circular(6.0), - ), + RemixIconButtonStyler.decoration( + BoxDecorationMix( + color: Colors.lightBlue, + borderRadius: BorderRadiusGeometryMix.circular(6.0), ), ), ), @@ -219,15 +200,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 40.0, - minHeight: 40.0, - ), - ), + RemixIconButtonStyler.constraints( + BoxConstraintsMix(minWidth: 40.0, minHeight: 40.0), ), ), ); @@ -260,19 +236,7 @@ void main() { initial: RemixIconButtonStyler(), modify: (style) => style.width(50.0), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 50.0, - maxWidth: 50.0, - ), - ), - ), - ), - ); + expect(style, equals(RemixIconButtonStyler.width(50.0))); }, ); @@ -281,19 +245,7 @@ void main() { initial: RemixIconButtonStyler(), modify: (style) => style.height(50.0), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minHeight: 50.0, - maxHeight: 50.0, - ), - ), - ), - ), - ); + expect(style, equals(RemixIconButtonStyler.height(50.0))); }, ); @@ -336,14 +288,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - foregroundDecoration: BoxDecorationMix( - color: Colors.yellow.withValues(alpha: 0.3), - ), - ), + RemixIconButtonStyler.foregroundDecoration( + BoxDecorationMix(color: Colors.yellow.withValues(alpha: 0.3)), ), ), ); @@ -356,15 +304,8 @@ void main() { modify: (style) => style.transform(Matrix4.rotationZ(0.1)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler( - transform: Matrix4.rotationZ(0.1), - transformAlignment: Alignment.center, - ), - ), - ), + style, + equals(RemixIconButtonStyler.transform(Matrix4.rotationZ(0.1))), ); }, ); diff --git a/packages/remix/test/components/menu/menu_style_test.dart b/packages/remix/test/components/menu/menu_style_test.dart index 15c1a713..75736cc9 100644 --- a/packages/remix/test/components/menu/menu_style_test.dart +++ b/packages/remix/test/components/menu/menu_style_test.dart @@ -84,11 +84,9 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), - ), + RemixMenuTriggerStyler.padding(EdgeInsetsGeometryMix.all(16.0)), ), ); }, @@ -99,14 +97,7 @@ void main() { initial: RemixMenuTriggerStyler(), modify: (style) => style.color(Colors.blue), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler(decoration: BoxDecorationMix(color: Colors.blue)), - ), - ), - ); + expect(style, equals(RemixMenuTriggerStyler.color(Colors.blue))); }, ); @@ -116,10 +107,8 @@ void main() { modify: (style) => style.alignment(Alignment.centerLeft), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(FlexBoxStyler(alignment: Alignment.centerLeft)), - ), + style, + equals(RemixMenuTriggerStyler.alignment(Alignment.centerLeft)), ); }, ); @@ -129,21 +118,7 @@ void main() { initial: RemixMenuTriggerStyler(), modify: (style) => style.size(100.0, 50.0), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: 100.0, - maxWidth: 100.0, - minHeight: 50.0, - maxHeight: 50.0, - ), - ), - ), - ), - ); + expect(style, equals(RemixMenuTriggerStyler.size(100.0, 50.0))); }, ); @@ -153,14 +128,10 @@ void main() { modify: (style) => style.borderRadius(BorderRadiusMix.circular(8.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: BoxDecorationMix( - borderRadius: BorderRadiusMix.circular(8.0), - ), - ), + RemixMenuTriggerStyler.borderRadius( + BorderRadiusMix.circular(8.0), ), ), ); @@ -175,15 +146,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: 100.0, - minHeight: 40.0, - ), - ), + RemixMenuTriggerStyler.constraints( + BoxConstraintsMix(minWidth: 100.0, minHeight: 40.0), ), ), ); @@ -201,14 +167,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: BoxDecorationMix( - color: Colors.blue, - borderRadius: BorderRadiusMix.circular(8.0), - ), + RemixMenuTriggerStyler.decoration( + BoxDecorationMix( + color: Colors.blue, + borderRadius: BorderRadiusMix.circular(8.0), ), ), ), @@ -222,11 +186,9 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler(margin: EdgeInsetsGeometryMix.all(8.0)), - ), + RemixMenuTriggerStyler.margin(EdgeInsetsGeometryMix.all(8.0)), ), ); }, @@ -242,13 +204,11 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - foregroundDecoration: BoxDecorationMix( - border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), - ), + RemixMenuTriggerStyler.foregroundDecoration( + BoxDecorationMix( + border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), ), ), ), @@ -263,13 +223,11 @@ void main() { style.transform(Matrix4.identity(), alignment: Alignment.topLeft), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - transform: Matrix4.identity(), - transformAlignment: Alignment.topLeft, - ), + RemixMenuTriggerStyler.transform( + Matrix4.identity(), + alignment: Alignment.topLeft, ), ), ); @@ -700,10 +658,8 @@ void main() { modify: (style) => style.alignment(Alignment.centerLeft), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(FlexBoxStyler(alignment: Alignment.centerLeft)), - ), + style, + equals(RemixMenuItemStyler.alignment(Alignment.centerLeft)), ); }, ); @@ -714,11 +670,9 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), - ), + RemixMenuItemStyler.padding(EdgeInsetsGeometryMix.all(16.0)), ), ); }, @@ -729,14 +683,7 @@ void main() { initial: RemixMenuItemStyler(), modify: (style) => style.color(Colors.blue), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler(decoration: BoxDecorationMix(color: Colors.blue)), - ), - ), - ); + expect(style, equals(RemixMenuItemStyler.color(Colors.blue))); }, ); @@ -745,21 +692,7 @@ void main() { initial: RemixMenuItemStyler(), modify: (style) => style.size(200.0, 48.0), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: 200.0, - maxWidth: 200.0, - minHeight: 48.0, - maxHeight: 48.0, - ), - ), - ), - ), - ); + expect(style, equals(RemixMenuItemStyler.size(200.0, 48.0))); }, ); @@ -769,15 +702,9 @@ void main() { modify: (style) => style.borderRadius(BorderRadiusMix.circular(4.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: BoxDecorationMix( - borderRadius: BorderRadiusMix.circular(4.0), - ), - ), - ), + RemixMenuItemStyler.borderRadius(BorderRadiusMix.circular(4.0)), ), ); }, @@ -791,15 +718,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: 150.0, - minHeight: 36.0, - ), - ), + RemixMenuItemStyler.constraints( + BoxConstraintsMix(minWidth: 150.0, minHeight: 36.0), ), ), ); @@ -817,14 +739,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: BoxDecorationMix( - color: Colors.grey, - borderRadius: BorderRadiusMix.circular(4.0), - ), + RemixMenuItemStyler.decoration( + BoxDecorationMix( + color: Colors.grey, + borderRadius: BorderRadiusMix.circular(4.0), ), ), ), @@ -838,12 +758,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(4.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler(margin: EdgeInsetsGeometryMix.all(4.0)), - ), - ), + style, + equals(RemixMenuItemStyler.margin(EdgeInsetsGeometryMix.all(4.0))), ); }, ); @@ -858,13 +774,11 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - foregroundDecoration: BoxDecorationMix( - border: BoxBorderMix.all(BorderSideMix(color: Colors.blue)), - ), + RemixMenuItemStyler.foregroundDecoration( + BoxDecorationMix( + border: BoxBorderMix.all(BorderSideMix(color: Colors.blue)), ), ), ), @@ -879,13 +793,11 @@ void main() { style.transform(Matrix4.identity(), alignment: Alignment.center), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - transform: Matrix4.identity(), - transformAlignment: Alignment.center, - ), + RemixMenuItemStyler.transform( + Matrix4.identity(), + alignment: Alignment.center, ), ), ); diff --git a/packages/remix/test/components/popover/popover_style_test.dart b/packages/remix/test/components/popover/popover_style_test.dart index 6743212f..0825cc4a 100644 --- a/packages/remix/test/components/popover/popover_style_test.dart +++ b/packages/remix/test/components/popover/popover_style_test.dart @@ -25,10 +25,7 @@ void main() { }); test('factory constructors create focused styles', () { - expect( - RemixPopoverStyler.backgroundColor(Colors.purple).$container, - isNotNull, - ); + expect(RemixPopoverStyler.color(Colors.purple).$container, isNotNull); expect( RemixPopoverStyler.padding(EdgeInsetsGeometryMix.all(12)).$container, isNotNull, diff --git a/packages/remix/test/components/progress/progress_style_test.dart b/packages/remix/test/components/progress/progress_style_test.dart index c758d959..3571678e 100644 --- a/packages/remix/test/components/progress/progress_style_test.dart +++ b/packages/remix/test/components/progress/progress_style_test.dart @@ -64,19 +64,7 @@ void main() { initial: RemixProgressStyler(), modify: (style) => style.height(20.0), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minHeight: 20.0, - maxHeight: 20.0, - ), - ), - ), - ), - ); + expect(style, equals(RemixProgressStyler.height(20.0))); }, ); @@ -85,19 +73,7 @@ void main() { initial: RemixProgressStyler(), modify: (style) => style.width(200.0), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 200.0, - maxWidth: 200.0, - ), - ), - ), - ), - ); + expect(style, equals(RemixProgressStyler.width(200.0))); }, ); @@ -191,8 +167,8 @@ void main() { modify: (style) => style.alignment(Alignment.center), expect: (style) { expect( - style.$container, - equals(Prop.maybeMix(BoxStyler(alignment: Alignment.center))), + style, + equals(RemixProgressStyler.alignment(Alignment.center)), ); }, ); @@ -203,11 +179,9 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), - ), + RemixProgressStyler.padding(EdgeInsetsGeometryMix.all(16.0)), ), ); }, @@ -219,10 +193,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(BoxStyler(margin: EdgeInsetsGeometryMix.all(8.0))), - ), + style, + equals(RemixProgressStyler.margin(EdgeInsetsGeometryMix.all(8.0))), ); }, ); @@ -235,15 +207,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 100.0, - minHeight: 40.0, - ), - ), + RemixProgressStyler.constraints( + BoxConstraintsMix(minWidth: 100.0, minHeight: 40.0), ), ), ); @@ -261,14 +228,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - color: Colors.blue, - borderRadius: BorderRadiusMix.circular(8.0), - ), + RemixProgressStyler.decoration( + BoxDecorationMix( + color: Colors.blue, + borderRadius: BorderRadiusMix.circular(8.0), ), ), ), @@ -286,13 +251,11 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - foregroundDecoration: BoxDecorationMix( - border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), - ), + RemixProgressStyler.foregroundDecoration( + BoxDecorationMix( + border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), ), ), ), @@ -307,13 +270,11 @@ void main() { style.transform(Matrix4.identity(), alignment: Alignment.topLeft), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - transform: Matrix4.identity(), - transformAlignment: Alignment.topLeft, - ), + RemixProgressStyler.transform( + Matrix4.identity(), + alignment: Alignment.topLeft, ), ), ); diff --git a/packages/remix/test/components/radio/radio_style_test.dart b/packages/remix/test/components/radio/radio_style_test.dart index f99a9f36..0577876f 100644 --- a/packages/remix/test/components/radio/radio_style_test.dart +++ b/packages/remix/test/components/radio/radio_style_test.dart @@ -70,10 +70,7 @@ void main() { initial: RemixRadioStyler(), modify: (style) => style.alignment(Alignment.center), expect: (style) { - expect( - style.$container, - equals(Prop.maybeMix(BoxStyler(alignment: Alignment.center))), - ); + expect(style, equals(RemixRadioStyler.alignment(Alignment.center))); }, ); @@ -83,12 +80,8 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), - ), - ), + style, + equals(RemixRadioStyler.padding(EdgeInsetsGeometryMix.all(16.0))), ); }, ); @@ -99,10 +92,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(BoxStyler(margin: EdgeInsetsGeometryMix.all(8.0))), - ), + style, + equals(RemixRadioStyler.margin(EdgeInsetsGeometryMix.all(8.0))), ); }, ); @@ -128,21 +119,7 @@ void main() { initial: RemixRadioStyler(), modify: (style) => style.size(24.0, 24.0), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 24.0, - maxWidth: 24.0, - minHeight: 24.0, - maxHeight: 24.0, - ), - ), - ), - ), - ); + expect(style, equals(RemixRadioStyler.size(24.0, 24.0))); }, ); @@ -152,15 +129,9 @@ void main() { modify: (style) => style.borderRadius(BorderRadiusMix.circular(12.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - borderRadius: BorderRadiusMix.circular(12.0), - ), - ), - ), + RemixRadioStyler.borderRadius(BorderRadiusMix.circular(12.0)), ), ); }, @@ -174,15 +145,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 20.0, - minHeight: 20.0, - ), - ), + RemixRadioStyler.constraints( + BoxConstraintsMix(minWidth: 20.0, minHeight: 20.0), ), ), ); @@ -200,14 +166,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - color: Colors.blue, - borderRadius: BorderRadiusMix.circular(8.0), - ), + RemixRadioStyler.decoration( + BoxDecorationMix( + color: Colors.blue, + borderRadius: BorderRadiusMix.circular(8.0), ), ), ), @@ -225,13 +189,11 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - foregroundDecoration: BoxDecorationMix( - border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), - ), + RemixRadioStyler.foregroundDecoration( + BoxDecorationMix( + border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), ), ), ), @@ -246,13 +208,11 @@ void main() { style.transform(Matrix4.identity(), alignment: Alignment.topLeft), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - transform: Matrix4.identity(), - transformAlignment: Alignment.topLeft, - ), + RemixRadioStyler.transform( + Matrix4.identity(), + alignment: Alignment.topLeft, ), ), ); diff --git a/packages/remix/test/components/select/select_style_test.dart b/packages/remix/test/components/select/select_style_test.dart index 2c0767bc..8a02f9c1 100644 --- a/packages/remix/test/components/select/select_style_test.dart +++ b/packages/remix/test/components/select/select_style_test.dart @@ -93,13 +93,11 @@ void main() { ), expect: (style) { expect( - style.$menuContainer, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - foregroundDecoration: BoxDecorationMix( - border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), - ), + RemixSelectStyler.foregroundDecoration( + BoxDecorationMix( + border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), ), ), ), @@ -114,13 +112,11 @@ void main() { style.transform(Matrix4.identity(), alignment: Alignment.topLeft), expect: (style) { expect( - style.$menuContainer, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - transform: Matrix4.identity(), - transformAlignment: Alignment.topLeft, - ), + RemixSelectStyler.transform( + Matrix4.identity(), + alignment: Alignment.topLeft, ), ), ); @@ -329,8 +325,8 @@ void main() { modify: (style) => style.alignment(Alignment.center), expect: (style) { expect( - style.$container, - equals(Prop.maybeMix(FlexBoxStyler(alignment: Alignment.center))), + style, + equals(RemixSelectTriggerStyler.alignment(Alignment.center)), ); }, ); @@ -341,11 +337,9 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), - ), + RemixSelectTriggerStyler.padding(EdgeInsetsGeometryMix.all(16.0)), ), ); }, @@ -357,11 +351,9 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler(margin: EdgeInsetsGeometryMix.all(8.0)), - ), + RemixSelectTriggerStyler.margin(EdgeInsetsGeometryMix.all(8.0)), ), ); }, @@ -378,14 +370,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: BoxDecorationMix( - color: Colors.blue, - borderRadius: BorderRadiusMix.circular(8.0), - ), + RemixSelectTriggerStyler.decoration( + BoxDecorationMix( + color: Colors.blue, + borderRadius: BorderRadiusMix.circular(8.0), ), ), ), @@ -401,15 +391,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: 100.0, - minHeight: 50.0, - ), - ), + RemixSelectTriggerStyler.constraints( + BoxConstraintsMix(minWidth: 100.0, minHeight: 50.0), ), ), ); @@ -539,8 +524,8 @@ void main() { modify: (style) => style.alignment(Alignment.center), expect: (style) { expect( - style.$container, - equals(Prop.maybeMix(FlexBoxStyler(alignment: Alignment.center))), + style, + equals(RemixSelectMenuItemStyler.alignment(Alignment.center)), ); }, ); @@ -568,10 +553,10 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), + RemixSelectMenuItemStyler.padding( + EdgeInsetsGeometryMix.all(16.0), ), ), ); @@ -585,10 +570,10 @@ void main() { style.decoration(BoxDecorationMix(color: Colors.blue)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler(decoration: BoxDecorationMix(color: Colors.blue)), + RemixSelectMenuItemStyler.decoration( + BoxDecorationMix(color: Colors.blue), ), ), ); diff --git a/packages/remix/test/components/slider/slider_style_test.dart b/packages/remix/test/components/slider/slider_style_test.dart index f3eadd79..6b5a3822 100644 --- a/packages/remix/test/components/slider/slider_style_test.dart +++ b/packages/remix/test/components/slider/slider_style_test.dart @@ -83,8 +83,8 @@ void main() { modify: (style) => style.trackColor(const Color(0xFF0000FF)), expect: (style) { expect( - style.$trackColor, - equals(Prop.value(const Color(0xFF0000FF))), + style, + equals(RemixSliderStyler.trackColor(const Color(0xFF0000FF))), ); }, ); @@ -95,8 +95,8 @@ void main() { modify: (style) => style.rangeColor(const Color(0xFFFF0000)), expect: (style) { expect( - style.$rangeColor, - equals(Prop.value(const Color(0xFFFF0000))), + style, + equals(RemixSliderStyler.rangeColor(const Color(0xFFFF0000))), ); }, ); @@ -109,9 +109,9 @@ void main() { ), expect: (style) { expect( - style.$thumb, + style, equals( - Prop.maybeMix( + RemixSliderStyler.thumb( BoxStyler(decoration: BoxDecorationMix(color: Colors.green)), ), ), @@ -142,10 +142,7 @@ void main() { initial: RemixSliderStyler(), modify: (style) => style.alignment(Alignment.center), expect: (style) { - expect( - style.$thumb, - equals(Prop.maybeMix(BoxStyler(alignment: Alignment.center))), - ); + expect(style, equals(RemixSliderStyler.alignment(Alignment.center))); }, ); @@ -183,12 +180,8 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$thumb, - equals( - Prop.maybeMix( - BoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), - ), - ), + style, + equals(RemixSliderStyler.padding(EdgeInsetsGeometryMix.all(16.0))), ); }, ); @@ -198,14 +191,7 @@ void main() { initial: RemixSliderStyler(), modify: (style) => style.color(Colors.purple), expect: (style) { - expect( - style.$thumb, - equals( - Prop.maybeMix( - BoxStyler(decoration: BoxDecorationMix(color: Colors.purple)), - ), - ), - ); + expect(style, equals(RemixSliderStyler.color(Colors.purple))); }, ); @@ -214,21 +200,7 @@ void main() { initial: RemixSliderStyler(), modify: (style) => style.size(24.0, 24.0), expect: (style) { - expect( - style.$thumb, - equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 24.0, - maxWidth: 24.0, - minHeight: 24.0, - maxHeight: 24.0, - ), - ), - ), - ), - ); + expect(style, equals(RemixSliderStyler.size(24.0, 24.0))); }, ); @@ -238,15 +210,9 @@ void main() { modify: (style) => style.borderRadius(BorderRadiusMix.circular(12.0)), expect: (style) { expect( - style.$thumb, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - borderRadius: BorderRadiusMix.circular(12.0), - ), - ), - ), + RemixSliderStyler.borderRadius(BorderRadiusMix.circular(12.0)), ), ); }, @@ -260,15 +226,10 @@ void main() { ), expect: (style) { expect( - style.$thumb, + style, equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 20.0, - minHeight: 20.0, - ), - ), + RemixSliderStyler.constraints( + BoxConstraintsMix(minWidth: 20.0, minHeight: 20.0), ), ), ); @@ -286,14 +247,12 @@ void main() { ), expect: (style) { expect( - style.$thumb, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - color: Colors.blue, - borderRadius: BorderRadiusMix.circular(8.0), - ), + RemixSliderStyler.decoration( + BoxDecorationMix( + color: Colors.blue, + borderRadius: BorderRadiusMix.circular(8.0), ), ), ), @@ -307,10 +266,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8.0)), expect: (style) { expect( - style.$thumb, - equals( - Prop.maybeMix(BoxStyler(margin: EdgeInsetsGeometryMix.all(8.0))), - ), + style, + equals(RemixSliderStyler.margin(EdgeInsetsGeometryMix.all(8.0))), ); }, ); @@ -325,13 +282,11 @@ void main() { ), expect: (style) { expect( - style.$thumb, + style, equals( - Prop.maybeMix( - BoxStyler( - foregroundDecoration: BoxDecorationMix( - border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), - ), + RemixSliderStyler.foregroundDecoration( + BoxDecorationMix( + border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), ), ), ), @@ -346,13 +301,11 @@ void main() { style.transform(Matrix4.identity(), alignment: Alignment.topLeft), expect: (style) { expect( - style.$thumb, + style, equals( - Prop.maybeMix( - BoxStyler( - transform: Matrix4.identity(), - transformAlignment: Alignment.topLeft, - ), + RemixSliderStyler.transform( + Matrix4.identity(), + alignment: Alignment.topLeft, ), ), ); diff --git a/packages/remix/test/components/styler_factory_shorthand_test.dart b/packages/remix/test/components/styler_factory_shorthand_test.dart new file mode 100644 index 00000000..43048550 --- /dev/null +++ b/packages/remix/test/components/styler_factory_shorthand_test.dart @@ -0,0 +1,204 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_test/flutter_test.dart'; +import 'package:remix/remix.dart'; + +void main() { + group('generated Remix styler factories', () { + test('support contextual shorthand for widget-state variants', () { + final style = RemixButtonStyler() + .onHovered(.color(Colors.green)) + .onPressed(.scale(0.97)); + + expect(style.$variants, hasLength(2)); + }); + + test('match their fluent methods', () { + expect( + RemixCardStyler.color(Colors.blue), + RemixCardStyler().color(Colors.blue), + ); + expect(RemixSpinnerStyler.size(20), RemixSpinnerStyler().size(20)); + expect(RemixButtonStyler.rotate(0.25), RemixButtonStyler().rotate(0.25)); + expect( + RemixToggleGroupStyler.color(Colors.blue), + RemixToggleGroupStyler().color(Colors.blue), + ); + expect( + RemixPopoverStyler.color(Colors.purple), + RemixPopoverStyler().color(Colors.purple), + ); + }); + + test('forward a restricted Box surface from Select menuContainer', () { + expect( + RemixSelectStyler.color(Colors.white), + RemixSelectStyler().color(Colors.white), + ); + }); + + test('retain field factories for composite stylers', () { + final trigger = RemixMenuTriggerStyler.color(Colors.black); + + expect( + RemixMenuStyler.trigger(trigger), + RemixMenuStyler().trigger(trigger), + ); + + final layout = FlexBoxStyler.spacing(12); + expect( + RemixTextFieldStyler.layout(layout), + RemixTextFieldStyler().layout(layout), + ); + }); + + test('retain fluent-only conveniences and aliases', () { + expect( + RemixCardStyler().paddingAll(12), + RemixCardStyler.padding(EdgeInsetsGeometryMix.all(12)), + ); + expect( + RemixCardStyler().backgroundColor(Colors.red), + RemixCardStyler.color(Colors.red), + ); + }); + + test('support contextual shorthand for selected state', () { + final style = RemixToggleGroupItemStyler().onSelected( + .color(Colors.green), + ); + + expect(style.$variants, hasLength(1)); + }); + + test('replace legacy convenience factories with canonical factories', () { + const color = Colors.indigo; + final padding = EdgeInsetsGeometryMix.all(12); + final textStyle = TextStyleMix(fontSize: 14); + + expect( + RemixCardStyler().backgroundColor(color), + RemixCardStyler.color(color), + ); + expect( + RemixAccordionStyler().titleColor(color), + RemixAccordionStyler.title(TextStyler.color(color)), + ); + expect( + RemixAccordionStyler().leadingIconSize(16), + RemixAccordionStyler.leadingIcon(IconStyler.size(16)), + ); + expect( + RemixAccordionStyler().contentPadding(padding), + RemixAccordionStyler.content(BoxStyler.padding(padding)), + ); + expect(RemixAvatarStyler().square(24), RemixAvatarStyler.size(24, 24)); + expect( + RemixBadgeStyler().foregroundColor(color), + RemixBadgeStyler.label(TextStyler.color(color)), + ); + expect( + RemixCalloutStyler().contentTextStyle(textStyle), + RemixCalloutStyler.text(TextStyler(style: textStyle)), + ); + + final contextual = RemixAccordionStyler() + .onHovered(.title(.color(color))) + .onPressed(.content(.padding(padding))); + expect(contextual.$variants, hasLength(2)); + }); + + testWidgets('resolve forwarded APIs like legacy nested styles', ( + tester, + ) async { + late BuildContext context; + await tester.pumpWidget( + MaterialApp( + home: Builder( + builder: (builderContext) { + context = builderContext; + return const SizedBox.shrink(); + }, + ), + ), + ); + + void expectSameSpec>(Style actual, Style legacy) { + expect( + actual.resolve(context).spec, + equals(legacy.resolve(context).spec), + ); + } + + final padding = EdgeInsetsGeometryMix.all(12); + final radius = BorderRadiusGeometryMix.circular(8); + + expectSameSpec( + RemixCardStyler() + .padding(padding) + .color(Colors.blue) + .borderRadius(radius), + RemixCardStyler( + container: BoxStyler( + padding: padding, + decoration: BoxDecorationMix( + color: Colors.blue, + borderRadius: radius, + ), + ), + ), + ); + expectSameSpec( + RemixButtonStyler().padding(padding).color(Colors.blue).spacing(8), + RemixButtonStyler( + container: FlexBoxStyler( + padding: padding, + decoration: BoxDecorationMix(color: Colors.blue), + spacing: 8, + ), + ), + ); + expectSameSpec( + RemixSliderStyler().size(20, 20).color(Colors.blue), + RemixSliderStyler( + thumb: BoxStyler( + constraints: BoxConstraintsMix( + minWidth: 20, + maxWidth: 20, + minHeight: 20, + maxHeight: 20, + ), + decoration: BoxDecorationMix(color: Colors.blue), + ), + ), + ); + expectSameSpec( + RemixSelectStyler().padding(padding).color(Colors.white), + RemixSelectStyler( + menuContainer: FlexBoxStyler( + padding: padding, + decoration: BoxDecorationMix(color: Colors.white), + ), + ), + ); + expectSameSpec( + RemixTextFieldStyler().color(Colors.white).textColor(Colors.black), + RemixTextFieldStyler( + container: FlexBoxStyler( + decoration: BoxDecorationMix(color: Colors.white), + ), + text: TextStyler(style: TextStyleMix(color: Colors.black)), + ), + ); + expectSameSpec( + RemixToggleGroupStyler().padding(padding).color(Colors.blue).spacing(4), + RemixToggleGroupStyler( + container: FlexBoxStyler( + padding: padding, + decoration: BoxDecorationMix(color: Colors.blue), + spacing: 4, + ), + ), + ); + }); + }); +} diff --git a/packages/remix/test/components/switch/switch_style_test.dart b/packages/remix/test/components/switch/switch_style_test.dart index 248edd7d..0a3fb36a 100644 --- a/packages/remix/test/components/switch/switch_style_test.dart +++ b/packages/remix/test/components/switch/switch_style_test.dart @@ -86,10 +86,7 @@ void main() { initial: RemixSwitchStyler(), modify: (style) => style.alignment(Alignment.center), expect: (style) { - expect( - style.$container, - equals(Prop.maybeMix(BoxStyler(alignment: Alignment.center))), - ); + expect(style, equals(RemixSwitchStyler.alignment(Alignment.center))); }, ); @@ -99,12 +96,8 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), - ), - ), + style, + equals(RemixSwitchStyler.padding(EdgeInsetsGeometryMix.all(16.0))), ); }, ); @@ -115,10 +108,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(BoxStyler(margin: EdgeInsetsGeometryMix.all(8.0))), - ), + style, + equals(RemixSwitchStyler.margin(EdgeInsetsGeometryMix.all(8.0))), ); }, ); @@ -131,15 +122,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix( - minWidth: 20.0, - minHeight: 20.0, - ), - ), + RemixSwitchStyler.constraints( + BoxConstraintsMix(minWidth: 20.0, minHeight: 20.0), ), ), ); @@ -157,14 +143,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - color: Colors.blue, - borderRadius: BorderRadiusMix.circular(8.0), - ), + RemixSwitchStyler.decoration( + BoxDecorationMix( + color: Colors.blue, + borderRadius: BorderRadiusMix.circular(8.0), ), ), ), @@ -182,13 +166,11 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - foregroundDecoration: BoxDecorationMix( - border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), - ), + RemixSwitchStyler.foregroundDecoration( + BoxDecorationMix( + border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), ), ), ), @@ -203,13 +185,11 @@ void main() { style.transform(Matrix4.identity(), alignment: Alignment.topLeft), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - transform: Matrix4.identity(), - transformAlignment: Alignment.topLeft, - ), + RemixSwitchStyler.transform( + Matrix4.identity(), + alignment: Alignment.topLeft, ), ), ); diff --git a/packages/remix/test/components/tabs/tabs_style_test.dart b/packages/remix/test/components/tabs/tabs_style_test.dart index 4e475290..5ecef760 100644 --- a/packages/remix/test/components/tabs/tabs_style_test.dart +++ b/packages/remix/test/components/tabs/tabs_style_test.dart @@ -68,7 +68,7 @@ void main() { initial: RemixTabBarStyler(), modify: (style) => style.alignment(Alignment.center), expect: (style) { - expect(style.$container, isNotNull); + expect(style, equals(RemixTabBarStyler.alignment(Alignment.center))); }, ); @@ -77,7 +77,10 @@ void main() { initial: RemixTabBarStyler(), modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals(RemixTabBarStyler.padding(EdgeInsetsGeometryMix.all(16))), + ); }, ); @@ -86,7 +89,7 @@ void main() { initial: RemixTabBarStyler(), modify: (style) => style.color(Colors.blue), expect: (style) { - expect(style.$container, isNotNull); + expect(style, equals(RemixTabBarStyler.color(Colors.blue))); }, ); @@ -95,7 +98,7 @@ void main() { initial: RemixTabBarStyler(), modify: (style) => style.size(100, 50), expect: (style) { - expect(style.$container, isNotNull); + expect(style, equals(RemixTabBarStyler.size(100, 50))); }, ); @@ -105,7 +108,14 @@ void main() { modify: (style) => style.borderRadius(BorderRadiusGeometryMix.circular(8)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabBarStyler.borderRadius( + BorderRadiusGeometryMix.circular(8), + ), + ), + ); }, ); @@ -115,7 +125,14 @@ void main() { modify: (style) => style.constraints(BoxConstraintsMix(minWidth: 100, maxWidth: 200)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabBarStyler.constraints( + BoxConstraintsMix(minWidth: 100, maxWidth: 200), + ), + ), + ); }, ); @@ -125,7 +142,12 @@ void main() { modify: (style) => style.decoration(BoxDecorationMix(color: Colors.red)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabBarStyler.decoration(BoxDecorationMix(color: Colors.red)), + ), + ); }, ); @@ -134,7 +156,10 @@ void main() { initial: RemixTabBarStyler(), modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals(RemixTabBarStyler.margin(EdgeInsetsGeometryMix.all(8))), + ); }, ); @@ -144,7 +169,14 @@ void main() { modify: (style) => style.foregroundDecoration(BoxDecorationMix(color: Colors.green)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabBarStyler.foregroundDecoration( + BoxDecorationMix(color: Colors.green), + ), + ), + ); }, ); @@ -156,7 +188,15 @@ void main() { alignment: Alignment.topLeft, ), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabBarStyler.transform( + Matrix4.rotationZ(0.1), + alignment: Alignment.topLeft, + ), + ), + ); }, ); @@ -304,7 +344,7 @@ void main() { initial: RemixTabViewStyler(), modify: (style) => style.alignment(Alignment.center), expect: (style) { - expect(style.$container, isNotNull); + expect(style, equals(RemixTabViewStyler.alignment(Alignment.center))); }, ); @@ -313,7 +353,10 @@ void main() { initial: RemixTabViewStyler(), modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals(RemixTabViewStyler.padding(EdgeInsetsGeometryMix.all(16))), + ); }, ); @@ -322,7 +365,7 @@ void main() { initial: RemixTabViewStyler(), modify: (style) => style.color(Colors.blue), expect: (style) { - expect(style.$container, isNotNull); + expect(style, equals(RemixTabViewStyler.color(Colors.blue))); }, ); @@ -332,7 +375,14 @@ void main() { modify: (style) => style.borderRadius(BorderRadiusGeometryMix.circular(8)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabViewStyler.borderRadius( + BorderRadiusGeometryMix.circular(8), + ), + ), + ); }, ); @@ -342,7 +392,14 @@ void main() { modify: (style) => style.constraints(BoxConstraintsMix(minWidth: 100, maxWidth: 200)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabViewStyler.constraints( + BoxConstraintsMix(minWidth: 100, maxWidth: 200), + ), + ), + ); }, ); @@ -352,7 +409,14 @@ void main() { modify: (style) => style.decoration(BoxDecorationMix(color: Colors.red)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabViewStyler.decoration( + BoxDecorationMix(color: Colors.red), + ), + ), + ); }, ); @@ -361,7 +425,10 @@ void main() { initial: RemixTabViewStyler(), modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals(RemixTabViewStyler.margin(EdgeInsetsGeometryMix.all(8))), + ); }, ); @@ -371,7 +438,14 @@ void main() { modify: (style) => style.foregroundDecoration(BoxDecorationMix(color: Colors.green)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabViewStyler.foregroundDecoration( + BoxDecorationMix(color: Colors.green), + ), + ), + ); }, ); @@ -383,7 +457,15 @@ void main() { alignment: Alignment.topLeft, ), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabViewStyler.transform( + Matrix4.rotationZ(0.1), + alignment: Alignment.topLeft, + ), + ), + ); }, ); @@ -576,7 +658,7 @@ void main() { initial: RemixTabStyler(), modify: (style) => style.alignment(Alignment.center), expect: (style) { - expect(style.$container, isNotNull); + expect(style, equals(RemixTabStyler.alignment(Alignment.center))); }, ); @@ -585,7 +667,10 @@ void main() { initial: RemixTabStyler(), modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals(RemixTabStyler.padding(EdgeInsetsGeometryMix.all(16))), + ); }, ); @@ -594,7 +679,7 @@ void main() { initial: RemixTabStyler(), modify: (style) => style.color(Colors.blue), expect: (style) { - expect(style.$container, isNotNull); + expect(style, equals(RemixTabStyler.color(Colors.blue))); }, ); @@ -604,7 +689,14 @@ void main() { modify: (style) => style.constraints(BoxConstraintsMix(minWidth: 100, maxWidth: 200)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabStyler.constraints( + BoxConstraintsMix(minWidth: 100, maxWidth: 200), + ), + ), + ); }, ); @@ -614,7 +706,12 @@ void main() { modify: (style) => style.decoration(BoxDecorationMix(color: Colors.red)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabStyler.decoration(BoxDecorationMix(color: Colors.red)), + ), + ); }, ); @@ -623,7 +720,10 @@ void main() { initial: RemixTabStyler(), modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals(RemixTabStyler.margin(EdgeInsetsGeometryMix.all(8))), + ); }, ); @@ -633,7 +733,14 @@ void main() { modify: (style) => style.foregroundDecoration(BoxDecorationMix(color: Colors.green)), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabStyler.foregroundDecoration( + BoxDecorationMix(color: Colors.green), + ), + ), + ); }, ); @@ -645,7 +752,15 @@ void main() { alignment: Alignment.topLeft, ), expect: (style) { - expect(style.$container, isNotNull); + expect( + style, + equals( + RemixTabStyler.transform( + Matrix4.rotationZ(0.1), + alignment: Alignment.topLeft, + ), + ), + ); }, ); diff --git a/packages/remix/test/components/textfield/textfield_style_test.dart b/packages/remix/test/components/textfield/textfield_style_test.dart index ed243a38..a3919562 100644 --- a/packages/remix/test/components/textfield/textfield_style_test.dart +++ b/packages/remix/test/components/textfield/textfield_style_test.dart @@ -141,9 +141,9 @@ void main() { group('Style Methods', () { styleMethodTest( - 'color() sets text color', + 'textColor() sets text color', initial: RemixTextFieldStyler(), - modify: (style) => style.color(Colors.blue), + modify: (style) => style.textColor(Colors.blue), expect: (style) { expect( style.$text, @@ -177,7 +177,10 @@ void main() { initial: RemixTextFieldStyler(), modify: (style) => style.container(FlexBoxStyler()), expect: (style) { - expect(style.$container, equals(Prop.maybeMix(FlexBoxStyler()))); + expect( + style, + equals(RemixTextFieldStyler.container(FlexBoxStyler())), + ); }, ); @@ -188,14 +191,10 @@ void main() { style.borderRadius(BorderRadiusGeometryMix.circular(8)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: BoxDecorationMix( - borderRadius: BorderRadiusGeometryMix.circular(8), - ), - ), + RemixTextFieldStyler.borderRadius( + BorderRadiusGeometryMix.circular(8), ), ), ); @@ -208,12 +207,8 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler(padding: EdgeInsetsGeometryMix.all(16)), - ), - ), + style, + equals(RemixTextFieldStyler.padding(EdgeInsetsGeometryMix.all(16))), ); }, ); @@ -226,16 +221,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: BoxDecorationMix( - border: BoxBorderMix.all( - BorderSideMix(color: Colors.black, width: 1), - ), - ), - ), + RemixTextFieldStyler.border( + BoxBorderMix.all(BorderSideMix(color: Colors.black, width: 1)), ), ), ); @@ -247,16 +236,7 @@ void main() { initial: RemixTextFieldStyler(), modify: (style) => style.width(200), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler( - constraints: BoxConstraintsMix(minWidth: 200, maxWidth: 200), - ), - ), - ), - ); + expect(style, equals(RemixTextFieldStyler.width(200))); }, ); @@ -265,16 +245,7 @@ void main() { initial: RemixTextFieldStyler(), modify: (style) => style.height(50), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler( - constraints: BoxConstraintsMix(minHeight: 50, maxHeight: 50), - ), - ), - ), - ); + expect(style, equals(RemixTextFieldStyler.height(50))); }, ); @@ -284,8 +255,10 @@ void main() { modify: (style) => style.cursorColor(Color.fromARGB(255, 255, 0, 0)), expect: (style) { expect( - style.$cursorColor, - equals(Prop.maybe(Color.fromARGB(255, 255, 0, 0))), + style, + equals( + RemixTextFieldStyler.cursorColor(Color.fromARGB(255, 255, 0, 0)), + ), ); }, ); @@ -311,7 +284,7 @@ void main() { initial: RemixTextFieldStyler(), modify: (style) => style.hintText(TextStyler()), expect: (style) { - expect(style.$hintText, equals(Prop.maybeMix(TextStyler()))); + expect(style, equals(RemixTextFieldStyler.hintText(TextStyler()))); }, ); @@ -321,12 +294,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler(margin: EdgeInsetsGeometryMix.all(8)), - ), - ), + style, + equals(RemixTextFieldStyler.margin(EdgeInsetsGeometryMix.all(8))), ); }, ); @@ -336,10 +305,7 @@ void main() { initial: RemixTextFieldStyler(), modify: (style) => style.spacing(12), expect: (style) { - expect( - style.$container, - equals(Prop.maybeMix(FlexBoxStyler(spacing: 12))), - ); + expect(style, equals(RemixTextFieldStyler.spacing(12))); }, ); @@ -350,10 +316,10 @@ void main() { style.decoration(BoxDecorationMix(color: Colors.red)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler(decoration: BoxDecorationMix(color: Colors.red)), + RemixTextFieldStyler.decoration( + BoxDecorationMix(color: Colors.red), ), ), ); @@ -366,8 +332,8 @@ void main() { modify: (style) => style.alignment(Alignment.center), expect: (style) { expect( - style.$container, - equals(Prop.maybeMix(FlexBoxStyler(alignment: Alignment.center))), + style, + equals(RemixTextFieldStyler.alignment(Alignment.center)), ); }, ); @@ -379,12 +345,10 @@ void main() { style.constraints(BoxConstraintsMix(minWidth: 100, maxWidth: 200)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - constraints: BoxConstraintsMix(minWidth: 100, maxWidth: 200), - ), + RemixTextFieldStyler.constraints( + BoxConstraintsMix(minWidth: 100, maxWidth: 200), ), ), ); @@ -396,7 +360,10 @@ void main() { initial: RemixTextFieldStyler(), modify: (style) => style.textAlign(TextAlign.center), expect: (style) { - expect(style.$textAlign, equals(Prop.maybe(TextAlign.center))); + expect( + style, + equals(RemixTextFieldStyler.textAlign(TextAlign.center)), + ); }, ); @@ -406,11 +373,9 @@ void main() { modify: (style) => style.helperText(TextStyler().color(Colors.blue)), expect: (style) { expect( - style.$helperText, + style, equals( - Prop.maybeMix( - TextStyler(style: TextStyleMix(color: Colors.blue)), - ), + RemixTextFieldStyler.helperText(TextStyler().color(Colors.blue)), ), ); }, @@ -422,12 +387,8 @@ void main() { modify: (style) => style.label(TextStyler().color(Colors.blue)), expect: (style) { expect( - style.$label, - equals( - Prop.maybeMix( - TextStyler(style: TextStyleMix(color: Colors.blue)), - ), - ), + style, + equals(RemixTextFieldStyler.label(TextStyler().color(Colors.blue))), ); }, ); @@ -472,14 +433,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - foregroundDecoration: BoxDecorationMix( - shape: BoxShape.circle, - ), - ), + RemixTextFieldStyler.foregroundDecoration( + BoxDecorationMix(shape: BoxShape.circle), ), ), ); @@ -495,13 +452,11 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - transform: Matrix4.rotationZ(0.1), - transformAlignment: Alignment.topLeft, - ), + RemixTextFieldStyler.transform( + Matrix4.rotationZ(0.1), + alignment: Alignment.topLeft, ), ), ); diff --git a/packages/remix/test/components/toggle/toggle_style_test.dart b/packages/remix/test/components/toggle/toggle_style_test.dart index 38a008f4..f2f132e4 100644 --- a/packages/remix/test/components/toggle/toggle_style_test.dart +++ b/packages/remix/test/components/toggle/toggle_style_test.dart @@ -77,10 +77,8 @@ void main() { modify: (style) => style.alignment(Alignment.centerLeft), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(FlexBoxStyler(alignment: Alignment.centerLeft)), - ), + style, + equals(RemixToggleStyler.alignment(Alignment.centerLeft)), ); }, ); @@ -107,12 +105,8 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler(padding: EdgeInsetsGeometryMix.all(16.0)), - ), - ), + style, + equals(RemixToggleStyler.padding(EdgeInsetsGeometryMix.all(16.0))), ); }, ); @@ -123,12 +117,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8.0)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix( - FlexBoxStyler(margin: EdgeInsetsGeometryMix.all(8.0)), - ), - ), + style, + equals(RemixToggleStyler.margin(EdgeInsetsGeometryMix.all(8.0))), ); }, ); @@ -144,14 +134,12 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - decoration: BoxDecorationMix( - color: Colors.blue, - borderRadius: BorderRadiusMix.circular(8.0), - ), + RemixToggleStyler.decoration( + BoxDecorationMix( + color: Colors.blue, + borderRadius: BorderRadiusMix.circular(8.0), ), ), ), @@ -164,10 +152,7 @@ void main() { initial: RemixToggleStyler(), modify: (style) => style.spacing(12.0), expect: (style) { - expect( - style.$container, - equals(Prop.maybeMix(FlexBoxStyler(spacing: 12.0))), - ); + expect(style, equals(RemixToggleStyler.spacing(12.0))); }, ); @@ -179,15 +164,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - constraints: BoxConstraintsMix( - minWidth: 100.0, - minHeight: 40.0, - ), - ), + RemixToggleStyler.constraints( + BoxConstraintsMix(minWidth: 100.0, minHeight: 40.0), ), ), ); @@ -204,13 +184,11 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - foregroundDecoration: BoxDecorationMix( - border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), - ), + RemixToggleStyler.foregroundDecoration( + BoxDecorationMix( + border: BoxBorderMix.all(BorderSideMix(color: Colors.red)), ), ), ), @@ -225,13 +203,11 @@ void main() { style.transform(Matrix4.identity(), alignment: Alignment.topLeft), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - FlexBoxStyler( - transform: Matrix4.identity(), - transformAlignment: Alignment.topLeft, - ), + RemixToggleStyler.transform( + Matrix4.identity(), + alignment: Alignment.topLeft, ), ), ); diff --git a/packages/remix/test/components/toggle_group/toggle_group_style_test.dart b/packages/remix/test/components/toggle_group/toggle_group_style_test.dart index a0c3fef6..f0a57736 100644 --- a/packages/remix/test/components/toggle_group/toggle_group_style_test.dart +++ b/packages/remix/test/components/toggle_group/toggle_group_style_test.dart @@ -20,12 +20,7 @@ void main() { initial: RemixToggleGroupStyler(), modify: (style) => style.backgroundColor(Colors.blue), expect: (style) { - expect( - style.$container, - Prop.maybeMix( - FlexBoxStyler(decoration: BoxDecorationMix(color: Colors.blue)), - ), - ); + expect(style, RemixToggleGroupStyler.color(Colors.blue)); }, ); @@ -208,7 +203,7 @@ void main() { initial: RemixToggleGroupItemStyler(), modify: (style) => style.spacing(8), expect: (style) { - expect(style.$container, Prop.maybeMix(FlexBoxStyler(spacing: 8))); + expect(style, RemixToggleGroupItemStyler.spacing(8)); }, ); }); diff --git a/packages/remix/test/components/tooltip/tooltip_style_test.dart b/packages/remix/test/components/tooltip/tooltip_style_test.dart index 128a00f3..828520b5 100644 --- a/packages/remix/test/components/tooltip/tooltip_style_test.dart +++ b/packages/remix/test/components/tooltip/tooltip_style_test.dart @@ -72,10 +72,8 @@ void main() { modify: (style) => style.padding(EdgeInsetsGeometryMix.all(16)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(BoxStyler(padding: EdgeInsetsGeometryMix.all(16))), - ), + style, + equals(RemixTooltipStyler.padding(EdgeInsetsGeometryMix.all(16))), ); }, ); @@ -86,10 +84,8 @@ void main() { modify: (style) => style.margin(EdgeInsetsGeometryMix.all(8)), expect: (style) { expect( - style.$container, - equals( - Prop.maybeMix(BoxStyler(margin: EdgeInsetsGeometryMix.all(8))), - ), + style, + equals(RemixTooltipStyler.margin(EdgeInsetsGeometryMix.all(8))), ); }, ); @@ -99,10 +95,7 @@ void main() { initial: RemixTooltipStyler(), modify: (style) => style.alignment(Alignment.center), expect: (style) { - expect( - style.$container, - equals(Prop.maybeMix(BoxStyler(alignment: Alignment.center))), - ); + expect(style, equals(RemixTooltipStyler.alignment(Alignment.center))); }, ); @@ -111,14 +104,7 @@ void main() { initial: RemixTooltipStyler(), modify: (style) => style.color(Colors.blue), expect: (style) { - expect( - style.$container, - equals( - Prop.maybeMix( - BoxStyler(decoration: BoxDecorationMix(color: Colors.blue)), - ), - ), - ); + expect(style, equals(RemixTooltipStyler.color(Colors.blue))); }, ); @@ -145,14 +131,10 @@ void main() { style.borderRadius(BorderRadiusGeometryMix.circular(8)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - decoration: BoxDecorationMix( - borderRadius: BorderRadiusGeometryMix.circular(8), - ), - ), + RemixTooltipStyler.borderRadius( + BorderRadiusGeometryMix.circular(8), ), ), ); @@ -166,10 +148,10 @@ void main() { style.decoration(BoxDecorationMix(color: Colors.red)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler(decoration: BoxDecorationMix(color: Colors.red)), + RemixTooltipStyler.decoration( + BoxDecorationMix(color: Colors.red), ), ), ); @@ -209,12 +191,10 @@ void main() { style.constraints(BoxConstraintsMix(minWidth: 100, maxWidth: 200)), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - constraints: BoxConstraintsMix(minWidth: 100, maxWidth: 200), - ), + RemixTooltipStyler.constraints( + BoxConstraintsMix(minWidth: 100, maxWidth: 200), ), ), ); @@ -229,14 +209,10 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - foregroundDecoration: BoxDecorationMix( - shape: BoxShape.circle, - ), - ), + RemixTooltipStyler.foregroundDecoration( + BoxDecorationMix(shape: BoxShape.circle), ), ), ); @@ -252,13 +228,11 @@ void main() { ), expect: (style) { expect( - style.$container, + style, equals( - Prop.maybeMix( - BoxStyler( - transform: Matrix4.rotationZ(0.1), - transformAlignment: Alignment.topLeft, - ), + RemixTooltipStyler.transform( + Matrix4.rotationZ(0.1), + alignment: Alignment.topLeft, ), ), ); diff --git a/pubspec.lock b/pubspec.lock index 619aae84..c6a7460d 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -209,14 +209,6 @@ packages: url: "https://pub.dev" source: hosted version: "1.0.9" - dart_code_metrics_presets: - dependency: "direct dev" - description: - name: dart_code_metrics_presets - sha256: c2b890695e732329c79085194c6fc815a20acf44e553fad6c72f75bf3ae203cf - url: "https://pub.dev" - source: hosted - version: "2.32.0" dart_style: dependency: transitive description: @@ -445,10 +437,10 @@ packages: dependency: transitive description: name: mix_annotations - sha256: "73d25392f50e9ae34ed75528403881623eac1257501fec9d9b6bb57685fbc5bb" + sha256: f8b9ed018f70a1b376df0fcc16e965ebdcdd56ac3110f9d13de7d50405206c4a url: "https://pub.dev" source: hosted - version: "2.1.2" + version: "2.2.0-beta.0" mix_atlas: dependency: transitive description: @@ -471,10 +463,10 @@ packages: dependency: transitive description: name: mix_generator - sha256: "9261595aefaa00146d2d84d0500f3c116cf15a0fc5c5ea2266f7feb3d84cec4e" + sha256: "76d888e0845e7bb3bc6bee3d903bbb0611ec7f27b8b6c554deef62775b59654b" url: "https://pub.dev" source: hosted - version: "2.1.2" + version: "2.2.0-beta.0" mix_protocol: dependency: transitive description: diff --git a/pubspec.yaml b/pubspec.yaml index d46e24c5..8082ea5c 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -5,7 +5,6 @@ environment: dev_dependencies: melos: ^7.1.1 - dart_code_metrics_presets: ^2.32.0 flutter_lints: ^6.0.0 build_runner: ^2.10.1 @@ -38,12 +37,6 @@ melos: - git diff --exit-code -- packages/remix/lib description: Regenerate Remix sources and fail on generated drift - dcm:check: - exec: dcm analyze lib --fatal-style --fatal-warnings --no-congratulate - description: Run Dart Code Metrics with all configured severities fatal - packageFilters: - scope: remix - test:flutter: exec: flutter test --reporter=failures-only description: Run flutter test