fix(UI Pattern): design review fixes

[SamCreasey]

Task: CU-86933q1m6

Requires guideline-blocks-settings bump

Fixes:

• Border radius has been removed from child components and is now controlled by the wrapper with overflow: hidden.
• Accessibility styles have more consistent visibility with inset styles, so they are always visible in view and edit mode when required
• Dependency settings have been moved to "Basics" and default values set to false
• Theme settings have been moved up in the style settings, and label for background has been updated
• Min-height has been added to Code Editor to reduce the visibility of flickering from content unmounting and re-mounting (Issue reported)
• Border-bottom removed from Code Editor when there are no dependencies visible in view mode to prevent a double-border from appearing
• If there is no user-applied border then border-bottom remains visible for Code Editor and dependencies

[ragi96]

Just an issue that i found: if you change the theme it just takes effect after a reload and not directly

[SamCreasey]

Just an issue that i found: if you change the theme it just takes effect after a reload and not directly

Unfortunately the only way to fix this is to rerender the whole SandpackProvider, as the Theme Provider is nested inside and it sets an internal state from the theme prop.
https://github.com/codesandbox/sandpack/blob/main/sandpack-react/src/styles/themeContext.tsx

I have fixed the code accordingly

[ragi96]

Works now as expected