feat(ui-codemods): add codemod for v10 color update

Closes: INSTUI-4144
instructure · Jul 31, 2024 · 566751b · 566751b
1 parent f55dc3e
commit 566751b
Show file tree

Hide file tree

Showing 8 changed files with 1,721 additions and 1 deletion.
diff --git a/packages/ui-codemods/__testfixtures__/updateV10Breaking/colors.input.js b/packages/ui-codemods/__testfixtures__/updateV10Breaking/colors.input.js
@@ -0,0 +1,40 @@
+/* eslint-disable */
+import { canvas, canvasHighContrast } from '@instructure/ui'
+
+export const generateStyle = () => {
+  return {
+    logoSubtitle: {
+      label: 'logoSubtitle',
+      marginTop: '-3px'
+    },
+    optionWrapper: {
+      label: 'optionWrapper',
+      margin: '-0.5rem -0.75rem',
+      padding: '0.5rem 0.75rem',
+      border: '0 solid ' + canvas.colors.tiara,
+      borderBottomWidth: '1px',
+      display: 'flex',
+      maxWidth: '100%',
+      overflow: 'hidden',
+      alignItems: 'center'
+    },
+    optionIcon: {
+      label: 'optionIcon',
+      width: '36px',
+      height: '36px',
+      backgroundColor: canvasHighContrast.colors.oxford,
+      borderRadius: 100,
+      flexShrink: 0,
+      display: 'flex',
+      justifyContent: 'center',
+      alignItems: 'center'
+    },
+    truncateSingleLine: {
+      overflow: 'hidden',
+      whiteSpace: 'nowrap',
+      textOverflow: 'ellipsis'
+    }
+  }
+}
+
+export const generateComponentTheme = () => ({})
diff --git a/packages/ui-codemods/__testfixtures__/updateV10Breaking/colors.output.js b/packages/ui-codemods/__testfixtures__/updateV10Breaking/colors.output.js
@@ -0,0 +1,40 @@
+/* eslint-disable */
+import { canvas, canvasHighContrast } from '@instructure/ui'
+
+export const generateStyle = () => {
+  return {
+    logoSubtitle: {
+      label: 'logoSubtitle',
+      marginTop: '-3px'
+    },
+    optionWrapper: {
+      label: 'optionWrapper',
+      margin: '-0.5rem -0.75rem',
+      padding: '0.5rem 0.75rem',
+      border: '0 solid ' + canvas.colors?.contrasts?.grey1214,
+      borderBottomWidth: '1px',
+      display: 'flex',
+      maxWidth: '100%',
+      overflow: 'hidden',
+      alignItems: 'center'
+    },
+    optionIcon: {
+      label: 'optionIcon',
+      width: '36px',
+      height: '36px',
+      backgroundColor: canvasHighContrast.colors?.contrasts?.grey100100,
+      borderRadius: 100,
+      flexShrink: 0,
+      display: 'flex',
+      justifyContent: 'center',
+      alignItems: 'center'
+    },
+    truncateSingleLine: {
+      overflow: 'hidden',
+      whiteSpace: 'nowrap',
+      textOverflow: 'ellipsis'
+    }
+  }
+}
+
+export const generateComponentTheme = () => ({})