### Describe the bug I have a React component whose one of the props receives a JSX. Since we can't handle JSX directly on the control, I'm using the `mapping`, but I noticed that the code snippet doesn't output the JSX correctly. It shows the mapping key instead of the current value and does not update when a new entry is picked. The same code works on Storybook 6. May be related to #22099

### To Reproduce ```jsx import { Meta, StoryObj } from '@storybook/react'; import React from 'react'; const Example = (props) => { return

{props.buttons}

; }; type Component = typeof Example; const meta: Meta = { component: Example, argTypes: { buttons: { message: { control: 'text', if: { arg: 'withIcon' }, }, options: ['No Button', 'One Button', 'Two Buttons'], mapping: { 'No Button': null, 'One Button': ( <> ), 'Two Buttons': ( <> ), }, control: { type: 'select' }, }, }, }; export default meta; export const Default: StoryObj = { args: { buttons: 'One Button', }, }; ``` ### System ```shell Environment Info: System: OS: macOS 13.2 CPU: (10) arm64 Apple M1 Max Binaries: Node: 16.15.1 - ~/.nvm/versions/node/v16.15.1/bin/node Yarn: 1.22.19 - ~/.nvm/versions/node/v16.15.1/bin/yarn npm: 8.11.0 - ~/.nvm/versions/node/v16.15.1/bin/npm Browsers: Chrome: 111.0.5563.110 Firefox: 109.0.1 Safari: 16.3 npmPackages: @storybook/addon-actions: ^7.0.4 => 7.0.4 @storybook/addon-docs: ^7.0.4 => 7.0.4 @storybook/addon-essentials: ^7.0.4 => 7.0.4 @storybook/addon-links: ^7.0.4 => 7.0.4 @storybook/addon-mdx-gfm: ^7.0.4 => 7.0.4 @storybook/node-logger: ^7.0.4 => 7.0.4 @storybook/react: ^7.0.4 => 7.0.4 @storybook/react-vite: ^7.0.4 => 7.0.4 ``` ### Additional context _No response_

[Bug]: On Storybook 7, the code snippet isn't updated according with the current mapping selected value #22100

Company

Community

Support

Connect