feat: separate background by preview/rendering

[mxsdev]

Closes: #1018

Some issues:

• Currently the default setting for background will apply to both preview and rendering video settings - we could also introduce two separate settings (maybe best in a separate PR?)
• Backwards Compatibility: Background settings from existing projects will be dropped and set to null for both preview and render
• Forwards Compatibility: Background settings from newer projects read on older versions will not be recognized, and this will become null here as well
• I did not write any tests for this change, but happy to (the code I changed didn't appear to be covered originally)

To address backwards compatibility issues, one approach is to introduce some sort of a "deprecated"/"hidden" flag for old fields to hide them in the preview, and then set the preview & render backgrounds accordingly on initial project load. Happy to introduce such a thing in a separate PR before merging this.

To address forwards compatibility issues, we could sync the deprecated background field above to one of the preview or render settings (not sure which is better). Although I'm not sure how concerned we are with forwards compatibility.

Let me know your thoughts @aarthificial

[aarthificial]

one approach is to introduce some sort of a "deprecated"/"hidden" flag for old fields to hide them in the preview

There's already a disable method that can be called when defining meta fields that will hide them in the inspector.
But I don't think this would be necessary, undeclared fields in meta files are preserved so the migration can be performed by overriding the set method of ProjectMetadata:

export class ProjectMetadata /* ... */ {
  // ...

  public override set(
    value: Partial<ValueOf<ReturnType<typeof createProjectMetadata>>>,
  ) {
    if (value.shared && 'background' in value.shared) {
      const background = value.shared.background as Color | null;
      delete value.shared.background;
      if (value.preview) {
        value.preview.background = background;
      }
      if (value.rendering) {
        value.rendering.background = background;
      }
    }
    super.set(value);
  }
}

We also don't support forward compatibility since that's practically impossible. There are lots of new features being added in each version so trying to open a project with an older editor will almost always fail.

[aarthificial]

StageView is used to display the animation in all three places:

• PresentationMode - uses rendering settings
• RenderingViewport - uses rendering settings
• PreviewStage - uses preview settings

So the background should probably be passed here as a prop depending on the context in which the stage is used.