dev: Add configurable ITheatreLogger

Addresses the lack of options we currently have for surfacing issues in
our application via debugging tools. Prioritizes performance and
usability (visually) over clarity in some places that could have been
object mapped.

A logger with three separate audiences:

 * `internal`: Logs for developers maintaining Theatre.js
 * `dev`: Logs for developers using Theatre.js
 * `public`: Logs for everyone

This logger supports:
 * multiple logging levels (error, warn, debug, trace),
 * multiple audience levels (internal, dev, public),
 * multiple categories (general, todo, troubleshooting)
 * named and keyed loggers (e.g.
   `rootLogger.named("Project", project.id)`)
 * console styling with deterministic coloring
 * console devtool maintains accurate sourcemap link to logging origin
   (e.g. `coreExports.ts:71` as opposed to `logger.ts:45` or whatever)
 * swappable logger
 * customizable filtering
 * Accepts lazy `args`: `args: () => object` via
  `logger.lazy.<level>("message", () => <expensive computation>)` (e.g.
  `logger.lazy.debugDev("Loaded project state", () => ({ save: bigProject.exportToSaveable() }))`)

packages/playground/src/shared/dom/index.tsx

@@ -3,6 +3,7 @@ import ReactDOM from 'react-dom'
 import studio from '@theatre/studio'
 import {getProject} from '@theatre/core'
 import {Scene} from './Scene'
+import {TheatreLoggerLevel} from '@theatre/shared/logger'
 /**
  * This is a basic example of using Theatre for manipulating the DOM.
  *
@@ -13,6 +14,16 @@ import {Scene} from './Scene'
 studio.initialize()
 
 ReactDOM.render(
-  <Scene project={getProject('Sample project')} />,
+  <Scene
+    project={getProject('Sample project', {
+      experiments: {
+        logging: {
+          internal: true,
+          dev: true,
+          min: TheatreLoggerLevel.TRACE,
+        },
+      },
+    })}
+  />,
   document.getElementById('root'),
 )