• 
      

    Add a button component.

    Review Request #13616 — Created March 6, 2024 and submitted — Latest diff uploaded

    Information

    Ink
    master

    Reviewers

    This introduces a component used to display a button. This button
    appears and behaves like a standard button, complete with a slight
    recess of the content when pressing it down, and all standard states
    (focused, active, disabled).

    Buttons are managed by ButtonView (or Ink.Button in a crafted
    template), which handles all rendering and states for the button. Nearly
    all properties are dynamic and will re-render the contents, allowing for
    a UI to trigger updates to the presentation of the buttons as needed.

    Buttons include the following supported types:

    • Standard (normal buttons)
    • Primary (main button on a form/page/dialog)
    • Danger (performs a destructive operation)
    • Submit (similar to Primary, but submits a form)
    • Reset (resets the contents of a form)

    It also includes a "busy" state, which disables all events (when managed
    by ButtonView) and displays a horizontal barberpole animation.

    Keyboard shortcuts can be assigned to buttons, registered with a parent
    KeyboardShortcutRegistry. This will have the effect of clicking the
    button.

    Aside from the label, buttons can have an icon displayed to the left,
    and keyboard shortcuts displayed to the right (helping to highlight
    the associated shortcuts). These are optional, and shortcuts can be
    registered without being shown on the button.

    While <button> is most standard for buttons, an <a href="..."> can
    also be styled and managed as a button. This allows for navigation to
    other URLs like any other link, but with all the benefits of the button
    component.

    All unit tests pass.

    Played with all the various combinations of button states in Storybook,
    for both <button> and <a>-based buttons.


    Commits

    Files