v0.5.0

What's Changed

Breaking Changes

• Remove warning + no border state for button by @Jeremy-Walton in #200
  • Combining the .btn-warning and .btn--no-border class no longer creates a borderless warning button, it creates a normal warning button as if you were only using .btn-warning. This is to match the delete button behavior
  • If a button is meant to convey warning, the unfocused un-hovered state should convey that and a borderless warning button wasn't doing that.

Base Token Changes

• Breakpoint continuity by @Jeremy-Walton in #181
  • Variable versions of the existing sass variables for breakpoints have been added. This allows for usage in cases of max-width or such where a calc may be desired. @media queries still require using the sass variables.
• Documentation improvements by @Jeremy-Walton in #194
  • --op-color-on-background-alt was added to accompany the existing background color tokens.
• Add tags component by @dallasbpeters in #186
  • input focus tokens for neutral, info, and notice were added to support focus for all color scales.
• Dropdown Encoded Image by @Jeremy-Walton in #199
  • The encoded image token for the arrow on dropdown selects has been updated and a dark mode version was added
• Opacity Tokens by @Jeremy-Walton in #198
  • Opacity tokens have been added to support setting various visibility settings.
• Size Scale by @Jeremy-Walton in #197
  • A new token for size: --op-size-unit has been added for width and height properties to utilize. This ensures sizes are scalable at a global level and are divisible by 4.

New Components

• Switch by @Jeremy-Walton in #183
  • A new Switch (sometimes referred to as a toggle) component for boolean input is now available
• Navbar component by @Jeremy-Walton in #191
  • A Header bar for building your applications navigation is now available along with some example application layouts.
• Add tab component by @Jeremy-Walton in #195
  • A Tab component for creating tabbed navigation controls is now available.
• Side Panel by @Jeremy-Walton in #196
  • A Side Panel component is now available along with some example application layouts.
• Add tags component by @dallasbpeters in #186
  • A Tag component is now available. It is similar to Badge, but has a different semantic intent (that of interaction where badge is for information) and different behavior when buttons are used within it.
• Add spinner component by @dallasbpeters in #188
  • A loading spinner component can now be used. Also includes some example application layouts.

Component Changes

• Select control fix by @Jeremy-Walton in #184
  • The select form control was not respecting background colors set on it. This has been fixed.
• Dropdown Encoded Image by @Jeremy-Walton in #199
  • The arrow for the select form control has been changed

Repository Changes

• Add rule to auto fix on save by @Jeremy-Walton in #187
  • This is a code formatting rule for developing on this project.

Documentation Changes

• Fix various documentation inconsistencies. by @Jeremy-Walton in #182
  • Some components were missing instructions for selective imports
  • The customizing and extending sections of each component now show an important notice.
• Documentation improvements by @Jeremy-Walton in #194
  • The documentation tool along with other packages for documentation have been updated.
  • A Table of Contents was added to navigate the documentation easier.
  • The introduction page was updated to show some project status indicators

New Contributors

• @dallasbpeters made their first contribution in #188

Full Changelog: v0.4.2...v0.5.0