Remove borderRadius.none and use 1px in codemod

sumup-oss · Jun 16, 2021 · 494c4fa · 494c4fa
1 parent 7616ecf
commit 494c4fa
Show file tree

Hide file tree

Showing 7 changed files with 8 additions and 20 deletions.
diff --git a/packages/circuit-ui/cli/migrate/__testfixtures__/theme-border-radius.input.js b/packages/circuit-ui/cli/migrate/__testfixtures__/theme-border-radius.input.js
@@ -1,17 +1,12 @@
 import styled from '@emotion/styled';
 import { css } from '@emotion/core';
 
-const borderRadiusStyles = ({ theme }) => css`
+const elementStyles = ({ theme }) => css`
   border-top-left-radius: ${theme.borderRadius.mega};
   border-top-right-radius: ${theme.borderRadius.giga};
   border-bottom-left-radius: ${theme.borderRadius.tera};
   border-bottom-right-radius: ${theme.borderRadius.peta};
-`;
-
-const removedRadiusStyles = ({ theme }) => css`
   border-radius: ${theme.borderRadius.kilo};
 `;
 
-const BorderRadius = styled.div(borderRadiusStyles);
-
-const RemovedRadius = styled.div(removedRadiusStyles);
+const Element = styled.div(elementStyles);
diff --git a/packages/circuit-ui/cli/migrate/__testfixtures__/theme-border-radius.output.js b/packages/circuit-ui/cli/migrate/__testfixtures__/theme-border-radius.output.js
@@ -1,17 +1,12 @@
 import styled from '@emotion/styled';
 import { css } from '@emotion/core';
 
-const borderRadiusStyles = ({ theme }) => css`
+const elementStyles = ({ theme }) => css`
   border-top-left-radius: ${theme.borderRadius.bit};
   border-top-right-radius: ${theme.borderRadius.byte};
   border-bottom-left-radius: ${theme.borderRadius.byte};
   border-bottom-right-radius: ${theme.borderRadius.kilo};
+  border-radius: ${'1px'};
 `;
 
-const removedRadiusStyles = ({ theme }) => css`
-  border-radius: ${theme.borderRadius.none};
-`;
-
-const BorderRadius = styled.div(borderRadiusStyles);
-
-const RemovedRadius = styled.div(removedRadiusStyles);
+const Element = styled.div(elementStyles);
diff --git a/packages/circuit-ui/cli/migrate/theme-border-radius.ts b/packages/circuit-ui/cli/migrate/theme-border-radius.ts
@@ -32,7 +32,9 @@ const transform: Transform = (file, api) => {
   const j = api.jscodeshift;
   const root = j(file.source);
 
-  renameFactory(j, root, 'kilo', 'none'); // TODO add and deprecate none in design tokens
+  findProperty(j, root, `theme.borderRadius.kilo`).replaceWith(
+    j.identifier(`'1px'`),
+  );
   renameFactory(j, root, 'mega', 'bit');
   renameFactory(j, root, 'giga', 'byte');
   renameFactory(j, root, 'tera', 'byte');

diff --git a/packages/design-tokens/tests/__snapshots__/index.spec.ts.snap b/packages/design-tokens/tests/__snapshots__/index.spec.ts.snap
@@ -8,7 +8,6 @@ Object {
     "circle": "100%",
     "kilo": "12px",
     "mega": "16px",
-    "none": "0",
     "pill": "999999px",
   },
   "borderWidth": Object {

diff --git a/packages/design-tokens/themes/shared.ts b/packages/design-tokens/themes/shared.ts
@@ -47,7 +47,6 @@ export const iconSizes: IconSizes = {
 };
 
 export const borderRadius: BorderRadius = {
-  none: '0',
   bit: '4px',
   byte: '8px',
   kilo: '12px',

diff --git a/packages/design-tokens/types/index.ts b/packages/design-tokens/types/index.ts
@@ -104,7 +104,6 @@ export type IconSizes = {
 };
 
 export type BorderRadius = {
-  none: string;
   bit: string;
   byte: string;
   kilo: string;

diff --git a/packages/design-tokens/utils/theme-prop-type.ts b/packages/design-tokens/utils/theme-prop-type.ts
@@ -146,7 +146,6 @@ export const themePropType = PropTypes.shape({
     giga: PropTypes.string.isRequired,
   } as { [key in keyof IconSizes]: any }).isRequired,
   borderRadius: PropTypes.shape({
-    none: PropTypes.string.isRequired,
     bit: PropTypes.string.isRequired,
     byte: PropTypes.string.isRequired,
     kilo: PropTypes.string.isRequired,