@rarui/components 1.30.2 → 1.31.0

package/CHANGELOG.md

@@ -2,6 +2,23 @@
 
 `@rarui/components` components is a component library built with [Lit](https://lit.dev/).
 
+## 2025-11-25 `1.31.0`
+
+#### 🎉 New features
+
+- **Banner Tonal Property**: Added `tonal` property to Banner component enabling subdued color variants for all appearance types. When enabled, displays softer, less vibrant versions of appearance colors for a more subtle presentation. ([#149](https://git.rarolabs.com.br/frontend/rarui/-/merge_requests/149) by [@junior](https://git.rarolabs.com.br/junior))
+
+#### 💡 Others
+
+- **Banner Property Binding Improvements**: Enhanced Banner component property bindings following Lit best practices. Added `reflect: true` to all visual properties (appearance, floating, closable, tonal) for better CSS styling support and debugging visibility. Removed unnecessary boolean converters as Lit handles boolean attributes automatically. Added default value `"brand"` to `appearance` property for consistency with React implementation. ([#149](https://git.rarolabs.com.br/frontend/rarui/-/merge_requests/149) by [@junior](https://git.rarolabs.com.br/junior))
+
+## 2025-11-14 `1.30.3`
+
+#### 🐛 Bug fixes
+
+- **Dropdown Accessibility Improvement**: Removed unnecessary `role="button"` and `tabindex="0"` attributes from dropdown reference container to prevent duplicate focus targets and improve screen reader navigation. The dropdown now relies on proper slot content for interactive elements while maintaining ARIA attributes for popup functionality. ([#148](https://git.rarolabs.com.br/frontend/rarui/-/merge_requests/148) by [@junior](https://git.rarolabs.com.br/junior))
+- **Accordion Header Focus Management**: Enhanced AccordionHeader component focus handling by removing redundant focus-related attributes that conflicted with the component's internal button element, ensuring proper keyboard navigation and accessibility compliance. ([#148](https://git.rarolabs.com.br/frontend/rarui/-/merge_requests/148) by [@junior](https://git.rarolabs.com.br/junior))
+
 ## 2025-11-06 `1.30.2`
 
 #### 🎉 New features

package/custom-elements.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.30.1",
+  "version": "1.30.3",
   "tags": [
     {
       "name": "rarui-avatar",
@@ -9112,6 +9112,12 @@
           "type": "boolean",
           "default": false
         },
+        {
+          "name": "tonal",
+          "description": "Enables subdued color variants for the banner. When true, uses softer, less vibrant versions of the appearance colors for a more subtle presentation.",
+          "type": "boolean",
+          "default": false
+        },
         {
           "name": "closable",
           "description": "If `true`, display the closing button in the upper right corner of the banner.\nWhen clicked, it fires the `close` event that can be listened to externally.",

package/dist/index.d.ts

@@ -17247,12 +17247,12 @@ declare const statusStyles: {
     dot: RuntimeFn<{
         size: {
             normal: {
-                height: ".5rem";
-                width: ".5rem";
+                minHeight: ".5rem";
+                minWidth: ".5rem";
             };
             small: {
-                height: ".25rem";
-                width: ".25rem";
+                minHeight: ".25rem";
+                minWidth: ".25rem";
             };
         };
     }>;
@@ -17305,6 +17305,13 @@ declare const bannerStyles: {
                 borderRadius: `var(--${string})` | `var(--${string}, ${string})`;
             };
         };
+        /**
+         * Enables subdued color variants for the banner. When true, uses softer, less vibrant versions of the appearance colors for a more subtle presentation.
+         * @default false
+         */
+        tonal: {
+            true: {};
+        };
     }>;
 };
 
@@ -20556,9 +20563,10 @@ declare const RaruiBanner_base: (new (...args: any[]) => {
     ariaDescribedBy: string | null;
 }) & typeof LitElement;
 declare class RaruiBanner extends RaruiBanner_base {
-    appearance?: BannerProperties["appearance"];
+    appearance: BannerProperties["appearance"];
     floating: BannerProperties["floating"];
     closable: BannerProperties["closable"];
+    tonal: BannerProperties["tonal"];
     static styles: CSSResult;
     private handleClose;
     render(): TemplateResult<1>;