IconButton constructor

IconButton({
  1. required Object icon,
  2. required String label,
  3. String? tooltip,
  4. String? className,
  5. Map<String, Object?> props = const {},
  6. Map<String, Object?> style = const {},
  7. DartStyle? dartStyle,
  8. ButtonVariant variant = ButtonVariant.ghost,
  9. Tone tone = Tone.neutral,
  10. ComponentSize size = ComponentSize.md,
  11. bool loading = false,
  12. bool disabled = false,
  13. void onPressed(
    1. Object event
    )?,
})

Creates an icon button with an accessible label.

Implementation

IconButton({
  required Object icon,
  required String label,
  String? tooltip,
  String? className,
  Map<String, Object?> props = const {},
  Map<String, Object?> style = const {},
  DartStyle? dartStyle,
  ButtonVariant variant = ButtonVariant.ghost,
  Tone tone = Tone.neutral,
  ComponentSize size = ComponentSize.md,
  bool loading = false,
  bool disabled = false,
  void Function(Object event)? onPressed,
}) : super(
        'button',
        props: mergeComponentProps(
          {
            ...props,
            'type': props['type'] ?? 'button',
            'aria-label': label,
            if (tooltip != null) 'title': tooltip,
            if (disabled || loading) 'disabled': true,
            if (loading) 'aria-busy': 'true',
            if (onPressed != null && !disabled && !loading)
              'onClick': onPressed,
          },
          className: className,
          dartStyle: buttonComponentStyle(
            variant: variant,
            tone: tone,
            size: size,
            disabled: disabled,
            loading: loading,
          )
              .merge(
                DartStyle(
                  width: iconButtonSize(size),
                  padding: const EdgeInsets.all(0),
                ),
              )
              .merge(dartStyle),
          style: style,
        ),
        children: [
          if (loading)
            Spinner(size: ComponentSize.xs, tone: tone)
          else if (icon is IconData)
            Icon(
              icon,
              size: switch (size) {
                ComponentSize.xs => 12,
                ComponentSize.sm => 14,
                ComponentSize.md => 16,
                ComponentSize.lg => 20,
              },
            )
          else
            toFlintNode(icon),
        ],
      );