@rarui/components 1.31.1 → 1.32.0

package/CHANGELOG.md

@@ -2,6 +2,18 @@
 
 `@rarui/components` components is a component library built with [Lit](https://lit.dev/).
 
+## 2026-01-19 `1.32.0`
+
+#### 🎉 New features
+
+- **Modal Header title Property**: Added `title` and `subtitle` properties to ModalHeader component for simplified modal header creation. When provided, automatically renders title as `<rarui-title as="h5">` and subtitle as `<rarui-text>` with appropriate styling, eliminating the need for manual slot content for common use cases. ([#151](https://git.rarolabs.com.br/frontend/rarui/-/merge_requests/151) by [@junior](https://git.rarolabs.com.br/junior))
+
+#### 🐛 Bug fixes
+
+- **Select Form Value Clear Fix**: Fixed Select component not clearing form values when clicking the clear all options button in multiple selection mode. Added missing `_updateFormValue()` call in `handleResetOptions()` method to properly sync FormData with ElementInternals API, ensuring form submission reflects cleared state. ([#151](https://git.rarolabs.com.br/frontend/rarui/-/merge_requests/151) by [@junior](https://git.rarolabs.com.br/junior))
+- **Banner Tonal Close Button Color**: Fixed Banner component close button color inconsistency in tonal variant. Implemented `getTonalColorButtonClose` mapping to ensure close button uses appropriate appearance colors (brand, warning, error, success, primary) based on banner appearance when tonal variant is enabled, improving visual consistency and readability. ([#151](https://git.rarolabs.com.br/frontend/rarui/-/merge_requests/151) by [@junior](https://git.rarolabs.com.br/junior))
+- **RadioButton Shape Preservation**: Fixed RadioButton component visual deformation when label text becomes too large. Radio button now maintains its circular shape with proper `minWidth` and `minHeight` constraints (1.25rem for small, 1.5rem for large), preventing flex container from shrinking the radio circle regardless of label length. ([#151](https://git.rarolabs.com.br/frontend/rarui/-/merge_requests/151) by [@junior](https://git.rarolabs.com.br/junior))
+
 ## 2025-11-26 `1.31.1`
 
 #### 🎉 New features

package/custom-elements.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.31.0",
+  "version": "1.31.1",
   "tags": [
     {
       "name": "rarui-avatar",
@@ -2493,6 +2493,33 @@
             }
           ],
           "default": "solid"
+        },
+        {
+          "name": "min-width",
+          "description": "The **`min-width`** CSS property sets the minimum width of an element. It prevents the used value of the `width` property from becoming smaller than the value specified for `min-width`. It is also possible to pass a specific value.\n\n\n**Initial value**: `auto`\n\nThis property supports responsive values. You can pass a single value like `\"auto\"`.\n\n Or an object like:\n \n ```\n{\n  \"xs\": \"auto\",\n  \"md\": \"fit-content\",\n  \"lg\": \"intrinsic\",\n  \"xl\": \"max-content\"\n}\n```\n\n- auto\n- fit-content\n- intrinsic\n- max-content\n- min-content\n- min-intrinsic\n- stretch",
+          "values": [
+            {
+              "name": "auto"
+            },
+            {
+              "name": "fit-content"
+            },
+            {
+              "name": "intrinsic"
+            },
+            {
+              "name": "max-content"
+            },
+            {
+              "name": "min-content"
+            },
+            {
+              "name": "min-intrinsic"
+            },
+            {
+              "name": "stretch"
+            }
+          ]
         }
       ]
     },

package/dist/index.d.ts

@@ -17020,7 +17020,9 @@ declare const styles$3: {
         size: {
             small: {
                 width: "1.25rem";
+                minWidth: "1.25rem";
                 height: "1.25rem";
+                minHeight: "1.25rem";
                 ":before": {
                     width: "2rem";
                     height: "2rem";
@@ -17032,7 +17034,9 @@ declare const styles$3: {
             };
             large: {
                 width: "1.5rem";
+                minWidth: "1.5rem";
                 height: "1.5rem";
+                minHeight: "1.5rem";
                 ":before": {
                     width: "2.75rem";
                     height: "2.75rem";
@@ -17259,6 +17263,8 @@ declare const statusStyles: {
 };
 
 type StatusVariants = NonNullable<RecipeVariants<typeof statusStyles.status>>;
+type StatusDynamicProperties = Pick<StandardLonghandProperties, "minWidth">;
+type StatusSprinkle = StatusDynamicProperties;
 
 declare const bannerStyles: {
     banner: RuntimeFn<{
@@ -18014,7 +18020,7 @@ interface StatusTyping {
      */
     dot?: boolean;
 }
-type StatusProps = StatusTyping & StatusVariants;
+type StatusProps = StatusTyping & StatusVariants & StatusSprinkle;
 
 interface ButtonTyping {
     /**
@@ -18900,6 +18906,13 @@ type StatusManifestProperties = StatusProps;
 type StatusProperties = WebComponentProperties<StatusManifestProperties>;
 
 declare const RaruiStatus_base: (new (...args: any[]) => {
+    cssProps: Record<string, any>;
+    sprinkleAttrs: Record<string, any>;
+}) & (new (...args: any[]) => {
+    ariaLabel: string | null;
+    ariaLabelledBy: string | null;
+    ariaDescribedBy: string | null;
+}) & (new (...args: any[]) => {
     ariaLabel: string | null;
     ariaLabelledBy: string | null;
     ariaDescribedBy: string | null;