feat: support custom global ui component injection

[sanyuan0704]

Is your feature request related to a problem? Please describe.

For example, i want to inject a back to top component, then i can register it by following config:

// config.ts
export default {
  globalUIComponents: ['/User/project/src/components/BackToTop/index.tsx']
}

Then the component will be injected to page automatically.

Describe the solution you'd like

1. declare virtual module in Layout component in default theme.

// Layout/index.tsx
import globalComponents from 'virtual:components'

2. Generate component exports in vite plugin:

load(id) {
  if (id === 'virtual:components') {
    return `
      import BackToTop from '/User/project/src/components/BackToTop/index.tsx';
      export default [BackToTop]
   `
  }
}

3. Render global component:

// Layout/index.tsx
function Layout() {
  return (
     // 省略
     globalComponents.map(globalComponent => React.createElement(globalComponent))
  )
}

Describe alternatives you've considered

No response

Additional context

No response

Validations

• Read the docs.
• Read the Contributing Guidelines.
• Check that there isn't already an issue that asks for the same feature to avoid creating a duplicate.

[sanyuan0704]

I am not clear how to implement it