fix : doc view crashing when selecting enum value

[SB-virendrasolanke]

Motivation and Context

STOP-4423

Description

Elements crash when user tries to apply query parameter to try request with enum value & example.
The error originated from React Aria (which Mosaic uses internally), but the root cause was that Elements was passing unencoded values with special characters to Mosaic's Select component.
Mosaic's Select component is a generic UI component that shouldn't need to know about encoding/sanitizing data values.
By encoding values in Elements before passing them to Mosaic Select, we've ensured the values are CSS-selector-safe.

How Has This Been Tested?

Verified on PR environment by publishing Elements alpha version first. - https://x-20657.stoplight-dev.com

Screenshot(s)/recordings(s)

Before -

After

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)

Checklist

• This PR's code follows as closely as possible the coding style/guidelines of this project.
• I have added error reporting and followed the error reporting guidelines.
• I have added event tracking and followed the event tracking guidelines.
• I have updated any internal docs to reflect this PR's changes.
• If this PR affects existing features or includes UI changes, I have reached out to the Tech Writers team OR added the s/needs-docs label.
• I have added automated tests (unit/integration/e2e/other) to cover my changes.
• All new and existing tests pass locally (excluding flaky CI tests).
• If this PR completes a story or makes a substantial UX change, demo it to the Product Manager.

[netlify]

✅ Deploy Preview for stoplight-elements-demo ready!

Name	Link
🔨 Latest commit	57c6ac5
🔍 Latest deploy log	https://app.netlify.com/projects/stoplight-elements-demo/deploys/69679bfbada6360007114613
😎 Deploy Preview	https://deploy-preview-2859--stoplight-elements-demo.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[netlify]

✅ Deploy Preview for stoplight-elements ready!

Name	Link
🔨 Latest commit	57c6ac5
🔍 Latest deploy log	https://app.netlify.com/projects/stoplight-elements/deploys/69679bfb6301210008f43a0c
😎 Deploy Preview	https://deploy-preview-2859--stoplight-elements.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[prafullaAtSB]

looks common code of encodeSafeSelectorValue method here and at packages/elements-core/src/components/TryIt/Servers/VariableEditor.tsx

create utility class and use it at both place.

[SB-virendrasolanke]

@prafullaAtSB , I have removed the redundant code.

[prafullaAtSB]

Changes looks good to go ahead after comments incorporating..

[prafullaAtSB]

The fix looks ok to stabilise the view to avoid crash.
Although the spec is not appropriate constructed as per the guidelines.

[bhaskarsontakke]

LGTM !