feat(blazorui): rename PreserveCalloutWidh parameter to FixedCalloutWidth in callouts #11507 (#11510)

msynk · web-flow · commit e18d8dfe6426 · 2025-10-30T09:12:37.000+03:30
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.razor.cs
@@ -593,7 +593,7 @@ await _js.BitCalloutToggleCallout(
             headerId: "",
             footerId: "",
             setCalloutWidth: true,
-            preserveCalloutWidth: false,
+            fixedCalloutWidth: false,
             maxWindowWidth: 0);
     }
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.razor.cs
@@ -551,7 +551,7 @@ await _js.BitCalloutToggleCallout(
             headerId: "",
             footerId: "",
             setCalloutWidth: false,
-            preserveCalloutWidth: false,
+            fixedCalloutWidth: false,
             maxWindowWidth: 0);
     }
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor.cs
@@ -1416,7 +1416,7 @@ private async Task<bool> ToggleCallout()
             headerId: "",
             footerId: "",
             setCalloutWidth: false,
-            preserveCalloutWidth: false,
+            fixedCalloutWidth: false,
             maxWindowWidth: MAX_WIDTH);
     }
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor.cs
@@ -1939,7 +1939,7 @@ private async Task<bool> ToggleCallout()
             headerId: "",
             footerId: "",
             setCalloutWidth: false,
-            preserveCalloutWidth: false,
+            fixedCalloutWidth: false,
             maxWindowWidth: MAX_WIDTH);
     }
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor.cs
@@ -1187,7 +1187,7 @@ private async Task ToggleCallout()
             headerId: CalloutHeaderTemplate is not null ? _headerId : "",
             footerId: CalloutFooterTemplate is not null ? _footerId : "",
             setCalloutWidth: PreserveCalloutWidth is false,
-            preserveCalloutWidth: false,
+            fixedCalloutWidth: false,
             maxWindowWidth: 0);
     }
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.razor.cs
@@ -535,7 +535,7 @@ await _js.BitCalloutToggleCallout(
             headerId: string.Empty,
             footerId: string.Empty,
             setCalloutWidth: false,
-            preserveCalloutWidth: false,
+            fixedCalloutWidth: false,
             maxWindowWidth: 0);
     }
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.razor.cs
@@ -447,7 +447,7 @@ await _js.BitCalloutToggleCallout(
             headerId: string.Empty,
             footerId: string.Empty,
             setCalloutWidth: true,
-            preserveCalloutWidth: false,
+            fixedCalloutWidth: false,
             maxWindowWidth: 0);
     }
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor.cs
@@ -622,7 +622,7 @@ await _js.BitCalloutToggleCallout(
             headerId: "",
             footerId: "",
             setCalloutWidth: false,
-            preserveCalloutWidth: false,
+            fixedCalloutWidth: false,
             maxWindowWidth: 0);
     }
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor.cs
@@ -218,7 +218,7 @@ await _js.BitCalloutToggleCallout(
             headerId: "",
             footerId: "",
             setCalloutWidth: false,
-            preserveCalloutWidth: false,
+            fixedCalloutWidth: false,
             maxWindowWidth: 0);
     }
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Callout/BitCallout.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Callout/BitCallout.razor.cs
@@ -50,6 +50,11 @@ public partial class BitCallout : BitComponentBase
     /// </summary>
     [Parameter] public BitDropDirection? Direction { get; set; }
 
+    /// <summary>
+    /// Forces the callout to preserve its component's original width.
+    /// </summary>
+    [Parameter] public bool FixedCalloutWidth { get; set; }
+
     /// <summary>
     /// The id of the footer element that renders at the end of the scrolling container of the callout contnet.
     /// </summary>
@@ -79,12 +84,7 @@ public partial class BitCallout : BitComponentBase
     [Parameter] public EventCallback<bool> OnToggle { get; set; }
 
     /// <summary>
-    /// Forces the callout to preserve its component's original width.
-    /// </summary>
-    [Parameter] public bool PreserveCalloutWidth { get; set; }
-
-    /// <summary>
-    /// Forces the callout to set its content container width while openning based on the available space and actual content.
+    /// Forces the callout to set its content container width while opening based on the available space and actual content.
     /// </summary>
     [Parameter] public bool SetCalloutWidth { get; set; }
 
@@ -205,7 +205,7 @@ await _js.BitCalloutToggleCallout(
             headerId: HeaderId ?? "",
             footerId: FooterId ?? "",
             setCalloutWidth: SetCalloutWidth,
-            preserveCalloutWidth: PreserveCalloutWidth,
+            fixedCalloutWidth: FixedCalloutWidth,
             maxWindowWidth: MaxWindowWidth ?? 0);
 
         await OnToggle.InvokeAsync(IsOpen);
diff --git a/src/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/CalloutsJsRuntimeExtensions.cs b/src/BlazorUI/Bit.BlazorUI/Extensions/JsInterop/CalloutsJsRuntimeExtensions.cs
@@ -20,26 +20,27 @@ internal static class CalloutsJsRuntimeExtensions
         string headerId,
         string footerId,
         bool setCalloutWidth,
-        bool preserveCalloutWidth,
+        bool fixedCalloutWidth,
         int maxWindowWidth) where T : class
     {
-        return jsRuntime.Invoke<bool>("BitBlazorUI.Callouts.toggle",
-                                      dotnetObj,
-                                      componentId,
-                                      component,
-                                      calloutId,
-                                      callout,
-                                      isCalloutOpen,
-                                      responsiveMode,
-                                      dropDirection,
-                                      isRtl,
-                                      scrollContainerId,
-                                      scrollOffset,
-                                      headerId,
-                                      footerId,
-                                      setCalloutWidth,
-                                      preserveCalloutWidth,
-                                      maxWindowWidth);
+        return jsRuntime.Invoke<bool>(
+            "BitBlazorUI.Callouts.toggle",
+            dotnetObj,
+            componentId,
+            component,
+            calloutId,
+            callout,
+            isCalloutOpen,
+            responsiveMode,
+            dropDirection,
+            isRtl,
+            scrollContainerId,
+            scrollOffset,
+            headerId,
+            footerId,
+            setCalloutWidth,
+            fixedCalloutWidth,
+            maxWindowWidth);
     }
 
     internal static ValueTask BitCalloutClearCallout(this IJSRuntime jsRuntime, string calloutId)
diff --git a/src/BlazorUI/Bit.BlazorUI/Scripts/Callouts.ts b/src/BlazorUI/Bit.BlazorUI/Scripts/Callouts.ts
@@ -19,7 +19,7 @@ namespace BitBlazorUI {
             headerId: string,
             footerId: string,
             setCalloutWidth: boolean,
-            preserveCalloutWidth: boolean,
+            fixedCalloutWidth: boolean,
             maxWindowWidth: number,
         ) {
             component ??= document.getElementById(componentId);
@@ -95,7 +95,7 @@ namespace BitBlazorUI {
                 callout.style.width = width + 'px';
                 calloutWidth = width;
             }
-            if (preserveCalloutWidth) {
+            if (fixedCalloutWidth) {
                 let width = Math.min(componentWidth, calloutWidth);
                 callout.style.width = width + 'px';
                 calloutWidth = width;
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Callout/BitCalloutDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Callout/BitCalloutDemo.razor.cs
@@ -58,6 +58,13 @@ public partial class BitCalloutDemo
             Href = "#drop-direction-enum"
         },
         new()
+        {
+            Name = "FixedCalloutWidth",
+            Type = "bool",
+            DefaultValue = "false",
+            Description = "Forces the callout to preserve its component's original width."
+        },
+        new()
         {
             Name = "FooterId",
             Type = "string?",
@@ -93,18 +100,11 @@ public partial class BitCalloutDemo
             Description = "The callback that is called when the callout opens or closes."
         },
         new()
-        {
-            Name = "PreserveCalloutWidth",
-            Type = "bool",
-            DefaultValue = "false",
-            Description = "Forces the callout to preserve its component's original width."
-        },
-        new()
         {
             Name = "SetCalloutWidth",
             Type = "bool",
             DefaultValue = "false",
-            Description = "Forces the callout to set its content container width while openning based on the available space and actual content."
+            Description = "Forces the callout to set its content container width while opening based on the available space and actual content."
         },
         new()
         {

Original file line number	Diff line number	Diff line change
`@@ -593,7 +593,7 @@ await _js.BitCalloutToggleCallout(`
`593`	`593`	`headerId: "",`
`594`	`594`	`footerId: "",`
`595`	`595`	`setCalloutWidth: true,`
`596`		`- preserveCalloutWidth: false,`
	`596`	`+ fixedCalloutWidth: false,`
`597`	`597`	`maxWindowWidth: 0);`
`598`	`598`	`}`
`599`	`599`
Original file line number	Diff line number	Diff line change
`@@ -551,7 +551,7 @@ await _js.BitCalloutToggleCallout(`
`551`	`551`	`headerId: "",`
`552`	`552`	`footerId: "",`
`553`	`553`	`setCalloutWidth: false,`
`554`		`- preserveCalloutWidth: false,`
	`554`	`+ fixedCalloutWidth: false,`
`555`	`555`	`maxWindowWidth: 0);`
`556`	`556`	`}`
`557`	`557`
Original file line number	Diff line number	Diff line change
`@@ -1416,7 +1416,7 @@ private async Task<bool> ToggleCallout()`
`1416`	`1416`	`headerId: "",`
`1417`	`1417`	`footerId: "",`
`1418`	`1418`	`setCalloutWidth: false,`
`1419`		`- preserveCalloutWidth: false,`
	`1419`	`+ fixedCalloutWidth: false,`
`1420`	`1420`	`maxWindowWidth: MAX_WIDTH);`
`1421`	`1421`	`}`
`1422`	`1422`
Original file line number	Diff line number	Diff line change
`@@ -1939,7 +1939,7 @@ private async Task<bool> ToggleCallout()`
`1939`	`1939`	`headerId: "",`
`1940`	`1940`	`footerId: "",`
`1941`	`1941`	`setCalloutWidth: false,`
`1942`		`- preserveCalloutWidth: false,`
	`1942`	`+ fixedCalloutWidth: false,`
`1943`	`1943`	`maxWindowWidth: MAX_WIDTH);`
`1944`	`1944`	`}`
`1945`	`1945`
Original file line number	Diff line number	Diff line change
`@@ -1187,7 +1187,7 @@ private async Task ToggleCallout()`
`1187`	`1187`	`headerId: CalloutHeaderTemplate is not null ? _headerId : "",`
`1188`	`1188`	`footerId: CalloutFooterTemplate is not null ? _footerId : "",`
`1189`	`1189`	`setCalloutWidth: PreserveCalloutWidth is false,`
`1190`		`- preserveCalloutWidth: false,`
	`1190`	`+ fixedCalloutWidth: false,`
`1191`	`1191`	`maxWindowWidth: 0);`
`1192`	`1192`	`}`
`1193`	`1193`
Original file line number	Diff line number	Diff line change
`@@ -535,7 +535,7 @@ await _js.BitCalloutToggleCallout(`
`535`	`535`	`headerId: string.Empty,`
`536`	`536`	`footerId: string.Empty,`
`537`	`537`	`setCalloutWidth: false,`
`538`		`- preserveCalloutWidth: false,`
	`538`	`+ fixedCalloutWidth: false,`
`539`	`539`	`maxWindowWidth: 0);`
`540`	`540`	`}`
`541`	`541`
Original file line number	Diff line number	Diff line change
`@@ -447,7 +447,7 @@ await _js.BitCalloutToggleCallout(`
`447`	`447`	`headerId: string.Empty,`
`448`	`448`	`footerId: string.Empty,`
`449`	`449`	`setCalloutWidth: true,`
`450`		`- preserveCalloutWidth: false,`
	`450`	`+ fixedCalloutWidth: false,`
`451`	`451`	`maxWindowWidth: 0);`
`452`	`452`	`}`
`453`	`453`
Original file line number	Diff line number	Diff line change
`@@ -622,7 +622,7 @@ await _js.BitCalloutToggleCallout(`
`622`	`622`	`headerId: "",`
`623`	`623`	`footerId: "",`
`624`	`624`	`setCalloutWidth: false,`
`625`		`- preserveCalloutWidth: false,`
	`625`	`+ fixedCalloutWidth: false,`
`626`	`626`	`maxWindowWidth: 0);`
`627`	`627`	`}`
`628`	`628`
Original file line number	Diff line number	Diff line change
`@@ -218,7 +218,7 @@ await _js.BitCalloutToggleCallout(`
`218`	`218`	`headerId: "",`
`219`	`219`	`footerId: "",`
`220`	`220`	`setCalloutWidth: false,`
`221`		`- preserveCalloutWidth: false,`
	`221`	`+ fixedCalloutWidth: false,`
`222`	`222`	`maxWindowWidth: 0);`
`223`	`223`	`}`
`224`	`224`