import 'package:flutter/material.dart';
import 'package:remix/remix.dart';
 
class ButtonExample extends StatelessWidget {
  const ButtonExample({super.key});
 
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        spacing: 16,
        children: [
          RemixButton(
            onPressed: () {},
            label: 'Turn Off',
            style: destructiveStyle,
          ),
          RemixButton(
            onPressed: () {},
            label: 'Turn on',
            style: successStyle,
          ),
        ],
      ),
    );
  }
 
  RemixButtonStyle get destructiveStyle {
    return RemixButtonStyle()
        .paddingX(16)
        .paddingY(10)
        .color(const Color(0xFF4D1919))
        .shadow(
          BoxShadowMix().color(Colors.redAccent).blurRadius(10).spreadRadius(0),
        )
        .label(
          TextStyler().uppercase().color(Colors.redAccent),
        )
        .shapeBeveledRectangle(
          borderRadius: BorderRadiusMix()
              .bottomLeft(const Radius.circular(12))
              .topRight(const Radius.circular(12)),
          side: BorderSideMix.width(1).color(Colors.redAccent),
        )
        .wrap(WidgetModifierConfig.scale(x: 1, y: 1))
        .onPressed(
          RemixButtonStyle().wrap(WidgetModifierConfig.scale(x: 0.90, y: 0.90)),
        )
        .onHovered(
          RemixButtonStyle()
              .color(const Color(0xFF732D2D))
              .animate(AnimationConfig.spring(300.ms)),
        )
        .onFocused(
          RemixButtonStyle().color(const Color(0xFF732D2D)),
        );
  }
 
  RemixButtonStyle get successStyle {
    return destructiveStyle
        .color(const Color.fromARGB(255, 15, 61, 15))
        .label(TextStyler().uppercase().color(Colors.greenAccent))
        .shapeBeveledRectangle(
          side: BorderSideMix().color(Colors.greenAccent),
        )
        .shadow(
          BoxShadowMix()
              .color(Colors.greenAccent)
              .blurRadius(10)
              .spreadRadius(0),
        )
        .onHovered(
          RemixButtonStyle().color(const Color(0xFF357857)),
        )
        .onFocused(
          RemixButtonStyle().color(const Color(0xFF357857)),
        );
  }
}

import 'package:flutter/material.dart';
import 'package:remix/remix.dart';
 
class FortalButtonExample extends StatelessWidget {
  const FortalButtonExample({super.key});
 
  @override
  Widget build(BuildContext context) {
    return Column(
      spacing: 16,
      children: [
        // Solid variant - High emphasis, primary actions
        RemixButton(
          label: 'Solid Button',
          onPressed: () {},
          style: FortalButtonStyle.solid(),
        ),
        // Soft variant - Medium emphasis, secondary actions
        RemixButton(
          label: 'Soft Button',
          onPressed: () {},
          style: FortalButtonStyle.soft(),
        ),
        // Surface variant - Subtle emphasis with border
        RemixButton(
          label: 'Surface Button',
          onPressed: () {},
          style: FortalButtonStyle.surface(),
        ),
        // Outline variant - Low emphasis, tertiary actions
        RemixButton(
          label: 'Outline Button',
          onPressed: () {},
          style: FortalButtonStyle.outline(),
        ),
        // Ghost variant - Minimal styling, inline actions
        RemixButton(
          label: 'Ghost Button',
          onPressed: () {},
          style: FortalButtonStyle.ghost(),
        ),
      ],
    );
  }
}

const RemixButton({
  Key? key,
  required String label,
  IconData? leadingIcon,
  IconData? trailingIcon,
  RemixButtonTextBuilder? textBuilder,
  RemixButtonIconBuilder? leadingIconBuilder,
  RemixButtonIconBuilder? trailingIconBuilder,
  RemixButtonLoadingBuilder? loadingBuilder,
  bool loading = false,
  bool enabled = true,
  required VoidCallback? onPressed,
  VoidCallback? onLongPress,
  FocusNode? focusNode,
  bool autofocus = false,
  bool enableFeedback = true,
  String? semanticLabel,
  String? semanticHint,
  bool excludeSemantics = false,
  MouseCursor mouseCursor = SystemMouseCursors.click,
  RemixButtonStyle style = const RemixButtonStyle.create(),
  RemixButtonSpec? styleSpec,
})