chore(ui-codemods): make local themes default

Author: git-nandor

packages/ui-codemods/lib/__node_tests__/__testfixtures__/renameCanvasThemesCodemod/canvasHighContrastUsage.warning.input.tsx

@@ -0,0 +1,9 @@
+// @ts-nocheck
+
+import canvasHighContrast from '@instructure/ui-themes'
+
+function asd() {
+  canvasHighContrast.use()
+
+  return <div>asd</div>
+}

packages/ui-codemods/lib/__node_tests__/__testfixtures__/renameCanvasThemesCodemod/canvasHighContrastUsage.warning.output.tsx

@@ -0,0 +1 @@
+'Found canvasHighContrast.use(). This will be deleted. Users should wrap each React root in its own InstUISettingsProvider instead.'

packages/ui-codemods/lib/__node_tests__/__testfixtures__/renameCanvasThemesCodemod/canvasUsage.warning.input.tsx

@@ -0,0 +1,9 @@
+// @ts-nocheck
+
+import canvas from '@instructure/ui-themes'
+
+function asd() {
+  canvas.use()
+
+  return <div>asd</div>
+}

packages/ui-codemods/lib/__node_tests__/__testfixtures__/renameCanvasThemesCodemod/canvasUsage.warning.output.tsx

@@ -0,0 +1 @@
+'Found canvas.use(). This will be deleted. Users should wrap each React root in its own InstUISettingsProvider instead.'

packages/ui-codemods/lib/__node_tests__/__testfixtures__/renameCanvasThemesCodemod/deprecated.warning.input.tsx

@@ -0,0 +1,7 @@
+// @ts-nocheck
+
+import { ThemeRegistry } from '@instructure/theme-registry'
+
+function asd() {
+  return <div>asd</div>
+}

packages/ui-codemods/lib/__node_tests__/__testfixtures__/renameCanvasThemesCodemod/deprecated.warning.output.tsx

@@ -0,0 +1 @@
+'ThemeRegistry has been deleted and there are no global themes anymore.'

packages/ui-codemods/lib/__node_tests__/__testfixtures__/renameCanvasThemesCodemod/renamed.input.tsx

@@ -0,0 +1,55 @@
+// @ts-nocheck
+
+import {
+  canvasThemeLocal,
+  canvasHighContrastThemeLocal,
+  somethingElse
+} from '@instructure/ui-themes'
+import { canvasThemeLocal as theme } from '@instructure/ui-themes'
+import { canvasHighContrastThemeLocal as anotherTheme } from '@instructure/ui-themes'
+import * as myThemes from '@instructure/canvas-theme'
+
+function asd() {
+  const a = canvasThemeLocal
+  const b = canvasHighContrastThemeLocal
+  const c = canvasThemeLocalCustom
+  const d = myThemes.canvasThemeLocal
+  const e = myThemes.canvasHighContrastThemeLocal
+
+  canvasThemeLocal()
+  canvasHighContrastThemeLocal()
+
+  const { canvasThemeLocal } = myThemes
+  const { canvasHighContrastThemeLocal } = myThemes
+
+  return (
+    <div>
+      <InstUISettingsProvider theme={canvasThemeLocal}>
+        <div>asd</div>
+      </InstUISettingsProvider>
+      <InstUISettingsProvider
+        theme={{
+          ...canvasThemeLocal,
+          ...{
+            typography: { fontFamily: 'monospace' }
+          }
+        }}
+      >
+        <div>asd</div>
+      </InstUISettingsProvider>
+      <InstUISettingsProvider theme={canvasHighContrastThemeLocal}>
+        <div>asd</div>
+      </InstUISettingsProvider>
+      <InstUISettingsProvider
+        theme={{
+          ...canvasHighContrastThemeLocal,
+          ...{
+            typography: { fontFamily: 'monospace' }
+          }
+        }}
+      >
+        <div>asd</div>
+      </InstUISettingsProvider>
+    </div>
+  )
+}

packages/ui-codemods/lib/__node_tests__/__testfixtures__/renameCanvasThemesCodemod/renamed.output.tsx

@@ -0,0 +1,55 @@
+// @ts-nocheck
+
+import {
+  canvasTheme,
+  canvasHighContrastTheme,
+  somethingElse
+} from '@instructure/ui-themes'
+import { canvasTheme as theme } from '@instructure/ui-themes'
+import { canvasHighContrastTheme as anotherTheme } from '@instructure/ui-themes'
+import * as myThemes from '@instructure/canvas-theme'
+
+function asd() {
+  const a = canvasTheme
+  const b = canvasHighContrastTheme
+  const c = canvasThemeLocalCustom
+  const d = myThemes.canvasTheme
+  const e = myThemes.canvasHighContrastTheme
+
+  canvasTheme()
+  canvasHighContrastTheme()
+
+  const { canvasTheme } = myThemes
+  const { canvasHighContrastTheme } = myThemes
+
+  return (
+    <div>
+      <InstUISettingsProvider theme={canvasTheme}>
+        <div>asd</div>
+      </InstUISettingsProvider>
+      <InstUISettingsProvider
+        theme={{
+          ...canvasTheme,
+          ...{
+            typography: { fontFamily: 'monospace' }
+          }
+        }}
+      >
+        <div>asd</div>
+      </InstUISettingsProvider>
+      <InstUISettingsProvider theme={canvasHighContrastTheme}>
+        <div>asd</div>
+      </InstUISettingsProvider>
+      <InstUISettingsProvider
+        theme={{
+          ...canvasHighContrastTheme,
+          ...{
+            typography: { fontFamily: 'monospace' }
+          }
+        }}
+      >
+        <div>asd</div>
+      </InstUISettingsProvider>
+    </div>
+  )
+}