✨ UX - Improve adding a button experience in TinaCMS editor

Requested by: @tiagov8 via YakShaver.ai 🦬
cc: @tiagov8, @brookjeynes-ssw, @adamcogan, @babakamyljanovssw @bettybondoc @hveraus @jaydenalchin @micsblank

Hi Team!

  🟥  Watch the video (2 min 59 sec)

Pain

Enhance the button configuration options in the Tina.io editor to improve usability and functionality. This includes renaming labels, adjusting size options, adding new icons, and fixing the button centering feature.

Acceptance Criteria

1. Button - Rename 'Utility Button' to 'Button'
2. Size - Change size options to 'Small', 'Medium', and 'Large' OR 'Small', and 'Large'
3. Size - Set 'Small' as the default
4. Size - Remove "Choose an option" (Bug: Padding lost if button size not selected)
5. Icon - Rename 'Choose an option' in the icon section to 'No Icon'
6. Icon - Improve icon labels to 'Arrow Right' and 'Arrow Left'
7. Icon - Add three new icons: YouTube, Download, and External Link
8. Alignment. - Fix the button centering functionality to work correctly
9. Alignment - Change the label from 'Uncentered' to 'Centered' and ensure functionality matches the label

Screenshot

Figure: Bug: Padding lost if button size not selected

Review the TinaCMS editor button configuration, then use the linked video and screenshot to understand the current labels, size defaults, icons, and centering behavior. Done means all nine acceptance criteria are reflected in the editor, including the new icons, Small as the default size, preserved padding, and correct centered labeling and behavior.