From 8c4324f75ccb5c9af4396ca30cb16a50b91af249 Mon Sep 17 00:00:00 2001 From: Cory LaViska Date: Mon, 23 Jun 2025 15:31:14 -0400 Subject: [PATCH] update changelog --- .../docs/docs/resources/changelog.md | 151 ++++++++---------- 1 file changed, 63 insertions(+), 88 deletions(-) diff --git a/packages/webawesome/docs/docs/resources/changelog.md b/packages/webawesome/docs/docs/resources/changelog.md index 58bebedd5..220ae2e41 100644 --- a/packages/webawesome/docs/docs/resources/changelog.md +++ b/packages/webawesome/docs/docs/resources/changelog.md @@ -12,19 +12,31 @@ Components with the Experimental bad During the alpha period, things might break! We take breaking changes very seriously, but sometimes they're necessary to make the final product that much better. We appreciate your patience! ::: -## Next +## 3.0.0-beta.1 -- 🚨 BREAKING: `input` and `change` events on form controls like `` now are always set to `bubble` and `compose`. -- 🚨 BREAKING: Greatly simplified how native styles work and removed redundant utilities +We're excited to share the first beta release of Web Awesome, which includes some breaking changes that make the library significantly more intuitive and consistent! + +The list looks extensive, but that's because we've tried to be thorough in documenting every change. We expect most users will only encounter a few of these during their upgrade. The majority are simple attribute renames (like clearable becoming with-clear) and component simplifications that actually reduce the amount of code you need to write. + +**If you're a Web Awesome alpha user, please read through these release notes carefully!** + +Many of these changes and improvements were the direct result of feedback from users like you! These changes represent our commitment to getting the fundamentals right as we move from alpha into a more stable beta release. + +### 🚨 Breaking Changes {data-no-outline} + +- `input` and `change` events on form controls like `` now are always set to `bubble` and `compose`. +- Greatly simplified how native styles work and removed redundant utilities - Removed `.wa-button`, `.wa-callout` classes - Removed `themes/native/*.css` files; use `native.css` to opt into native styles - Clarified which utilities classes can be applied to which native elements -- 🚨 BREAKING: Removed the extra dash in the `` CSS part name `pagination-item--active` => `pagination-item-active` -- 🚨 BREAKING: Renamed the `classic` theme to `shoelace` -- 🚨 BREAKING: Renamed `pulse` attribute in `` to `attention="pulse"` and added `attention="bounce"` [issue:#940] -- 🚨 BREAKING: Renamed the `vertical` attribute to `orientation="vertical"` in `` and `` to align with other components and the platform [issue:674] -- 🚨 BREAKING: Renamed the `eye-dropper-*` parts to `eyedropper` in `` -- 🚨 BREAKING: Renamed certain boolean attributes to be more consistent using the `with-*` and `without-*` pattern: +- Renamed the `classic` theme to `shoelace` +- Removed ``; use `` instead +- Completely reworked `` to be easier to use + - Added ``, greatly simplifying the dropdown's markup structure + - Removed ``, ``, and ``; use `` and native headings instead +- Renamed `pulse` attribute in `` to `attention="pulse"` and added `attention="bounce"` +- Renamed the `vertical` attribute to `orientation="vertical"` in `` and `` to align with other components and the platform +- Renamed certain boolean attributes to be more consistent using the `with-*` and `without-*` pattern: - `` => `` - `` => `` - `` => `` @@ -32,15 +44,23 @@ During the alpha period, things might break! We take breaking changes very serio - `` => `` - `` => `` - `` => `` -- 🚨 BREAKING: removed the `size` attribute from ``; please set the size of child elements on the children directly -- 🚨 BREAKING: greatly simplified the sizing strategy across components and utilities +- Renamed all `prefix` and `suffix` slots to `start` and `end`, affecting the following components: + - `` + - `` + - `` + - `` + - `` +- Removed the extra dash in the `` CSS part name `pagination-item--active` => `pagination-item-active` +- Renamed the `eye-dropper-*` parts to `eyedropper` in `` +- removed the `size` attribute from ``; please set the size of child elements on the children directly +- Greatly simplified the sizing strategy across components and utilities - Removed `--wa-size`, `--wa-size-smaller`, `--wa-size-larger`, `--wa-space`, `--wa-space-smaller`, and `--wa-space-larger` - Added tokens for `--wa-form-control-padding-inline`, `--wa-form-control-padding-block`, and `--wa-form-control-toggle-size` - Refactored default `--wa-font-size-*` values to use an apparent 1.125 ratio and round rendered values to the nearest whole pixel - Added convenience tokens for `--wa-font-size-smaller` and `--wa-font-size-larger` - Updated components to use relative `em` values for internal padding and margin wherever appropriate -- 🚨 BREAKING: removed the `hint` property and slot from ``; please apply hints directly to `` instead -- 🚨 BREAKING: redesigned `` with extensive new functionality +- Removed the `hint` property and slot from ``; please apply hints directly to `` instead +- Redesigned `` with extensive new functionality - Added support for range sliders with dual thumbs using the `range` attribute - Added vertical orientation support with `orientation="vertical"` - Added visual markers at each step with `with-markers` @@ -50,20 +70,13 @@ During the alpha period, things might break! We take breaking changes very serio - Added value formatting support with the `valueFormatter` property - Improved the styling API to be consistent and more powerful (no more browser-specific selectors and pseudo elements to style) - Updated to use consistent `with-*` attribute naming pattern -- 🚨 BREAKING: removed ``; use `` instead -- 🚨 BREAKING: completely reworked `` to be easier to use - - Added ``, greatly simplifying the dropdown's markup structure - - Removed ``, ``, and ``; use `` and native headings instead -- 🚨 BREAKING: renamed all `prefix` and `suffix` slots to `start` and `end`, affecting the following components: - - `` - - `` - - `` - - `` - - `` -- 🚨 BREAKING: reworked `` to use `` to set initially selected options, removing the "no spaces allowed" restrictions for option values +- Reworked `` to use `` to set initially selected options, removing the "no spaces allowed" restrictions for option values + +### New Features {data-no-outline} + - Added a new free component: `` (#2 of 14 per stretch goals) - Added a new free component: `` (#3 of 14 per stretch goals) -- Added a `min-block-size` to `` to ensure the divider is visible regardless of container height [issue:675] +- Added a `min-block-size` to `` to ensure the divider is visible regardless of container height - Added support for `name` in `` for exclusively opening one in a group - Added `--checked-icon-scale` to `` - Added `--tag-max-size` to `` when using `multiple` @@ -71,18 +84,27 @@ During the alpha period, things might break! We take breaking changes very serio - Added support for `data-drawer="open "` to `` - Added `@media (hover: hover)` to component hover styles to prevent sticky hover states - Added the ability to use `` to disable all radios in the group -- Fixed a bug in `` that caused radios to uncheck when assigning a numeric value [issue:924] + +### Bug Fixes and Improvements {data-no-outline} + +- Fixed a bug in `` that caused radios to uncheck when assigning a numeric value - Fixed `` so dividers properly show between buttons - Fixed the tooltip position in `` when using RTL -- Fixed a bug in `` and native `
` styles that made the summary hard to click [issue:684] +- Fixed a bug in `` and native `
` styles that made the summary hard to click - Fixed a handful of bugs unify form control height across components and native elements - Fixed a bug where `input` events from components weren't bubbling -- Improved CSS utilities and Native Styles to use [CSS layers](https://developer.mozilla.org/en-US/docs/Web/CSS/@layer) for easier end user customization (no more specificity conflictsΒ β€”Β your CSS wins!) +- Improved CSS utilities and Native Styles to use [CSS layers](https://developer.mozilla.org/en-US/docs/Web/CSS/@layer) for easier end user customization (no more specificity conflicts β€” your CSS wins!) - Improved native `