Skip to content

Conversation

@stuartromanek
Copy link
Member

@stuartromanek stuartromanek commented Oct 23, 2025

Summary

  • Adds buttons setting to radio input
  • both button mode and not support icons
  • everything keyboard accessible
  • focus states

Preview

Clipboard-20251023-185458-778.mp4

Field configs of interest

radioFields: {
  label: 'Regular Radio',
  type: 'radio',
  choices: [
    {
      label: 'Small',
      value: 'small'
    },
    {
      label: 'Medium',
      value: 'med'
    },
    {
      label: 'Big',
      value: 'big'
    }
  ]
},
radioIconsFields: {
  label: 'Radios with Icons',
  type: 'radio',
  choices: [
    {
      label: 'Up',
      value: 'up',
      icon: 'arrow-up-icon'
    },
    {
      label: 'Down',
      value: 'down',
      icon: 'arrow-down-icon'
    },
    {
      label: 'Left',
      value: 'left',
      icon: 'arrow-left-icon'
    },
    {
      label: 'Right',
      value: 'right',
      icon: 'arrow-right-icon'
    }
  ]
},
radioButtonsFields: {
  label: 'Radio buttons with labels',
  type: 'radio',
  buttons: true,
  choices: [
    {
      label: 'Left',
      value: 'left',
      icon: 'format-align-left-icon'
    },
    {
      label: 'Center',
      value: 'center',
      icon: 'format-align-center-icon'
    },
    {
      label: 'Right',
      value: 'right',
      icon: 'format-align-right-icon'
    }
  ]
},
radioButtonsTooltipsFields: {
  label: 'Radio buttons with tooltips',
  type: 'radio',
  buttons: true,
  choices: [
    {
      tooltip: 'Left',
      value: 'left',
      icon: 'format-align-left-icon'
    },
    {
      tooltip: 'Center',
      value: 'center',
      icon: 'format-align-center-icon'
    },
    {
      tooltip: 'Right',
      value: 'right',
      icon: 'format-align-right-icon'
    }
  ]
},

Tests

https://github.com/apostrophecms/testbed/actions/runs/18760973118

Related

https://github.com/apostrophecms/testbed/pull/394

Copy link
Contributor

@BoDonkey BoDonkey left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

One part of me says, " we are acshually in code freeze", but the cowboy part of me says" F*ck yeh, looks great to me!"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

3 participants