chore: Updating the dropdown width for the run behavior settings of JS object (#40691)

## Description

Updating the dropdown width for the run behavior settings of JS object

Fixes [#40657](https://github.com/appsmithorg/appsmith/issues/40657)

## Automation

/ok-to-test tags="@tag.JS, @tag.IDE"

### 🔍 Cypress test results
<!-- This is an auto-generated comment: Cypress test results  -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/15113084468>
> Commit: 8b29ef23202e1ae2c1c0c05012ee2f94ec6a85d2
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=15113084468&attempt=1"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.JS, @tag.IDE`
> Spec:
> <hr>Mon, 19 May 2025 13:26:04 UTC
<!-- end of auto-generated comment: Cypress test results  -->


## Communication
Should the DevRel and Marketing teams inform users about this change?
- [ ] Yes
- [ ] No


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **New Features**
- Added an option to control whether the dropdown menu width matches the
select input width, or to set a custom width for dropdown menus.

- **Style**
  - Improved popover content width handling for more consistent display.
- Adjusted minimum width of select input in function settings for a more
compact appearance.
- Dropdown menus in function settings now have a fixed width for better
usability.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

app/client/packages/design-system/ads/src/Select/Select.tsx

@@ -26,6 +26,7 @@ function Select(props: SelectProps) {
     children,
     className,
     dropdownClassName,
+    dropdownMatchSelectWidth = true,
     isDisabled = false,
     isLoading = false,
     isMultiSelect,
@@ -88,6 +89,7 @@ function Select(props: SelectProps) {
         SelectDropdownClassName + `--${size}`,
         dropdownClassName,
       )}
+      dropdownMatchSelectWidth={dropdownMatchSelectWidth}
       dropdownRender={(menu: any) => {
         return (
           <div>

app/client/packages/design-system/ads/src/Select/Select.types.ts

@@ -11,6 +11,7 @@ export type SelectProps = RCSelectProps & {
   isDisabled?: boolean;
   isValid?: boolean;
   isLoading?: boolean;
+  dropdownMatchSelectWidth?: boolean | number;
 };
 
 export type SelectOptionProps = OptionProps & {

app/client/src/IDE/Components/ToolbarSettingsPopover.tsx

@@ -24,8 +24,9 @@ const StyledPopoverHeader = styled(PopoverHeader)`
 `;
 
 const StyledPopoverContent = styled(PopoverContent)<{ popoverWidth?: string }>`
-  --popover-width: ${({ popoverWidth }) =>
+  min-width: 280px;
-    popoverWidth ? popoverWidth : "280px"};
+  max-width: ${({ popoverWidth }) => (popoverWidth ? popoverWidth : "280px")};
+  width: fit-content;
 `;
 
 export const ToolbarSettingsPopover = (props: Props) => {

app/client/src/pages/Editor/JSEditor/JSEditorToolbar/components/JSFunctionSettings.tsx

@@ -38,7 +38,7 @@ const StyledSelect = styled(Select)`
   width: fit-content;
 
   .rc-select-selector {
-    min-width: 120px;
+    min-width: 110px;
   }
 `;
 
@@ -100,6 +100,7 @@ const FunctionSettingRow = (props: FunctionSettingsRowProps) => {
       </FunctionName>
       <StyledSelect
         data-testid={`t--dropdown-runBehaviour`}
+        dropdownMatchSelectWidth={256}
         id={props.action.id}
         isDisabled={props.disabled}
         listHeight={240}