Feat: Add option for using react-jsx transform

[MattIPv4]

Which areas does this feature request relate to

• [x] Create Plugin
• [ ] Sign Plugin
• [ ] Plugin E2E
• [ ] Plugin Meta Extractor
• [ ] Documentation

Problem

👋 I'd like to use the newer react-jsx transform for our JSX, removing the need for having a React import in every JSX/TSX file. This currently requires me to modify quite a few of the default configs in our repository, and I'd prefer to use a create-plugin option. It is also worth noting that using the newer transform will be required for plugins to update to React 19.

Solution

Add a new flag similar to useReactRouterV6, useReactJsxRuntime.

Omit https://github.com/grafana/plugin-tools/blob/5d8e7c42ee95a284f21e44cacc2bb06f668ec42c/packages/create-plugin/templates/common/.config/jest/mocks/react-inlinesvg.tsx#L5

swc

https://swc.rs/docs/configuration/compilation#jsctransformreactruntime

https://github.com/grafana/plugin-tools/blob/5d8e7c42ee95a284f21e44cacc2bb06f668ec42c/packages/create-plugin/templates/common/.config/webpack/webpack.config.ts#L126

              jsc: {
                // ...
                transform: {
                  react: {
                    runtime: 'automatic',
                  },
                },
              },

https://github.com/grafana/plugin-tools/blob/5d8e7c42ee95a284f21e44cacc2bb06f668ec42c/packages/create-plugin/templates/common/.config/rspack/rspack.config.ts#L113

              jsc: {
                // ...
                transform: {
                  // ...
                  react: {
                    // ...
                    runtime: 'automatic',
                  },
                },
              },

react is marked as an external, need to confirm if this will include react/jsx-runtime or if that needs to be listed separately.

https://github.com/grafana/plugin-tools/blob/5d8e7c42ee95a284f21e44cacc2bb06f668ec42c/packages/create-plugin/templates/common/.config/webpack/webpack.config.ts#L70

https://github.com/grafana/plugin-tools/blob/5d8e7c42ee95a284f21e44cacc2bb06f668ec42c/packages/create-plugin/templates/common/.config/rspack/rspack.config.ts#L56

https://github.com/grafana/plugin-tools/blob/5d8e7c42ee95a284f21e44cacc2bb06f668ec42c/packages/create-plugin/templates/common/.config/jest.config.js#L29

        jsc: {
          // ...
          transform: {
            react: {
              runtime: 'automatic',
            },
          },
        },

tsconfig

https://github.com/grafana/plugin-tools/blob/5d8e7c42ee95a284f21e44cacc2bb06f668ec42c/packages/create-plugin/templates/common/.config/tsconfig.json#L8

  "compilerOptions": {
    // ...
    "jsx": "react-jsx"
  }

Alternatives

No response

Additional context

No response

Are you interested in contributing the solution?

• [x] Yes
• [ ] No