# Badge changelog Read the complete [LICENSE](https://snowui.dev/LICENSE) for the installed version before use. Reviewed against Chinese source SHA-256 `b6b727f55102aa1876cddf97459d6d02f8d721bf8a64ec1b85e4766c2f93b79b`. For version differences, check the installed package as well. - 2026-10-05: Changed the former default Indigo palette to Brand (`--brand`), retaining opacity, states, and override behavior. - 2026-09-21: Unified the usage guide, source property table, and Site / AI reading entry points. Documentation only; component behavior is unchanged. ### v1.3.3 (2026-09-02) - Expanded the per-property descriptions, default fallbacks, and usage boundaries to match the existing source. Runtime behavior is unchanged. ### v1.3.2 (2026-08-28) #### Fixes - Grid now centers the content layer at its natural width and allows symmetric overflow around the geometric center of fixed 16px / 12px Badges, correcting the optical offset of text labels and rightward offset of small numbers. ### v1.3.1 (2026-07-30) #### Fixes - The text layer inside the Border variant now inherits a 16px line height, preventing the shared morph-item style from compressing its actual height to 12px. The New label now matches Kbd’s default border height. ### v1.3.0 (2026-07-30) #### New features - Added `variant="border"`, reusing the Tokens, padding, corner radius, font size, and line height of Kbd’s default outlined appearance for status and category labels such as New and updated. Default `filled` behavior is unchanged. - **Badge-Motion.2026-06-18** Recreated the default motion with the two-layer structure of the transitions.dev Notification badge: the Frame root enters from the lower left while the full visual surface scales, fades, and blurs from its center. On exit the whole surface shrinks, rather than only the numeric content. - **Badge-Motion.2026-06-30** Unified the semantics of the full visual channel for `while*`: an explicit object no longer shallow-merges Badge’s default x / y / scale / opacity; it inherits only default timing and dynamics. - **Badge-Docs.2026-05-25** Archived the historical changelog at the top of the source file. Subsequent changes go in this document’s changelog; the source header retains only responsibilities, current key architecture, and the documentation path. ### v1.2.8 (2026-06-18) #### Motion restoration - **BD-Motion.1** Adopted a positioned root and visual surface as two layers, matching the parallel slide / pop motion of the Notification badge. - **BD-Motion.2** Entrance uses 260ms movement, 500ms scale/blur, and 400ms opacity; exit uses 180ms scale/opacity/blur and shrinks the entire Badge toward its center. - **BD-Color.1** Added the `color` Prop, using the shared SnowUI PascalCase semantic-color resolver for numbers, text, and Dot-mode fill. ### v1.2.7 (2026-04-28) #### Adjustments - **BD-Layout.1** Removed the component’s internal `margin` chain under the inline shell layout protocol. Parent layout now manages outside spacing for Dot mode. ### v1.2.6 (2026-03-07) #### Architecture refactor - Freed the `whileLoad` keyword: Badge now uses `loading` for local loading state and passes `whileLoad` back to `Frame` as loading-state motion configuration. ### v1.2.4 (2026-02-18) #### Adjustments - **BD-Typography.1** Standardized internal line height as `line-height: 1` for base styles and morph items. ### v1.2.3 (2026-02-05) #### Style improvements - **BD-Style.2** Fixed numeric content color to white (`--static-white-100`). - **BD-Doc.1** Moved every in-component style definition to the document’s `UserDefined` section. ### v1.2.3 (2026-02-05) #### Fixes - **BD-Fix.2** Fixed numbers not being centered at large sizes by removing a forced `line-height`. ### v1.2.2 (2026-02-05) #### Architecture refactor - **Size Context**: Added support for reading `size` from Frame context. Role-aware inheritance keeps the Badge at the right visual proportion in different use cases. ### v1.2.0 (Initial) - Initial release [Component guide](https://snowui.dev/llms/en/components/badge.md) · [Full reference](https://snowui.dev/llms/en/components/badge/reference.md)