@atlaskit/eslint-plugin-platform 2.1.0 → 2.1.2

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/eslint-plugin-platform
 
+## 2.1.2
+
+### Patch Changes
+
+- [#102248](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/102248)
+  [`05acb13c43541`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/05acb13c43541) -
+  AFB-825 Fixing edge case of expand-spacing-shorthand rule
+
+## 2.1.1
+
+### Patch Changes
+
+- [#101753](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/101753)
+  [`ab8a4d93399e8`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/ab8a4d93399e8) -
+  AFB-822 Turn of expand-spacing-shorthand rule until all of Jira and Platform rollout is complete
+
 ## 2.1.0
 
 ### Minor Changes

package/dist/cjs/index.js

@@ -72,7 +72,7 @@ var commonConfig = {
   // Compiled: rules that are not included via `@compiled/recommended
   '@atlaskit/platform/expand-border-shorthand': 'error',
   '@atlaskit/platform/expand-background-shorthand': 'error',
-  '@atlaskit/platform/expand-spacing-shorthand': 'warn',
+  '@atlaskit/platform/expand-spacing-shorthand': 'off',
   '@compiled/jsx-pragma': ['error', {
     importSources: ['@atlaskit/css'],
     onlyRunIfImportingCompiled: true,

package/dist/cjs/rules/compiled/expand-spacing-shorthand/index.js

@@ -11,9 +11,7 @@ var _compiledUtils = require("../../util/compiled-utils");
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
-var spacingPos = ["Top", "Right", "Bottom", "Left"];
-;
-
+var spacingPos = ['Top', 'Right', 'Bottom', 'Left'];
 // Checks if node is a call expression with identifier 'token'
 var isTokenCallExpression = function isTokenCallExpression(node) {
   if (node.callee.type === 'Identifier' && node.callee.name === 'token') {
@@ -32,11 +30,12 @@ var parseTemplateLiteral = function parseTemplateLiteral(templateLiteral, contex
     if (i < quasis.length) {
       var cookedQuasi = quasis[i].value.cooked;
       if (cookedQuasi) {
-        var splitQuasi = cookedQuasi.split(" ").filter(function (str) {
-          return str.length > 0;
-        });
-        splitQuasi.forEach(function (str) {
-          propertyValues.push(isNaN(Number(str)) ? "'".concat(str, "'") : str);
+        var splitQuasis = cookedQuasi.split(' ');
+        splitQuasis.forEach(function (str) {
+          str = str.trim().replace("\'", "");
+          if (str.length > 0) {
+            propertyValues.push(isNaN(Number(str)) ? "'".concat(str, "'") : str);
+          }
         });
       }
     }
@@ -49,7 +48,7 @@ var parseTemplateLiteral = function parseTemplateLiteral(templateLiteral, contex
 };
 var checkValidPropertyValues = function checkValidPropertyValues(propertyValues) {
   if (!propertyValues.some(function (str) {
-    return str.includes("token(");
+    return str.includes('token(');
   })) {
     return false;
   }
@@ -57,13 +56,23 @@ var checkValidPropertyValues = function checkValidPropertyValues(propertyValues)
     return false;
   }
   if (propertyValues.some(function (str) {
-    return str.includes("calc(");
+    return str.includes('calc(');
   })) {
     return false;
   }
   return true;
 };
 
+// Check that all expressions in TemplateLiteral are token expressions
+// If true: create an autofix
+// If false: report violation without autofix
+var hasOnlyTokens = function hasOnlyTokens(templateLiteral) {
+  var expressions = templateLiteral.expressions;
+  return expressions.every(function (expr) {
+    return expr.type === 'CallExpression' && isTokenCallExpression(expr);
+  });
+};
+
 // To fix spacing shorthands, given a list of spacing property values, expands the spacing property and adds autofix fixes
 var expandSpacingProperties = function expandSpacingProperties(_ref) {
   var context = _ref.context,
@@ -98,10 +107,10 @@ var expandSpacingProperties = function expandSpacingProperties(_ref) {
                 start = _prop$range[0],
                 end = _prop$range[1];
               // Remove the entire line for the duplicate property
-              while ((0, _contextCompat.getSourceCode)(context).text[end] !== "\n") {
+              while ((0, _contextCompat.getSourceCode)(context).text[end] !== '\n') {
                 end += 1;
               }
-              while ((0, _contextCompat.getSourceCode)(context).text[start] !== "\n") {
+              while ((0, _contextCompat.getSourceCode)(context).text[start] !== '\n') {
                 start -= 1;
               }
               spacing[i] = (0, _contextCompat.getSourceCode)(context).getText(prop.value);
@@ -130,6 +139,16 @@ var executeExpandSpacingRule = function executeExpandSpacingRule(context, node,
   }
   if (node.value.type === 'TemplateLiteral') {
     // Value of spacing property is a TemplateLiteral type that contains a token, e.g. padding: `0 token('a')`
+    if (!hasOnlyTokens(node.value)) {
+      context.report({
+        node: node,
+        messageId: 'expandSpacingShorthand',
+        data: {
+          property: propertyShorthand
+        }
+      });
+      return;
+    }
     var propertyValues = parseTemplateLiteral(node.value, context);
     if (!checkValidPropertyValues(propertyValues)) {
       return;

package/dist/es2019/index.js

@@ -64,7 +64,7 @@ const commonConfig = {
   // Compiled: rules that are not included via `@compiled/recommended
   '@atlaskit/platform/expand-border-shorthand': 'error',
   '@atlaskit/platform/expand-background-shorthand': 'error',
-  '@atlaskit/platform/expand-spacing-shorthand': 'warn',
+  '@atlaskit/platform/expand-spacing-shorthand': 'off',
   '@compiled/jsx-pragma': ['error', {
     importSources: ['@atlaskit/css'],
     onlyRunIfImportingCompiled: true,

package/dist/es2019/rules/compiled/expand-spacing-shorthand/index.js

@@ -1,8 +1,6 @@
 import { getSourceCode } from '../../util/context-compat';
 import { isCompiledAPI } from '../../util/compiled-utils';
-const spacingPos = ["Top", "Right", "Bottom", "Left"];
-;
-
+const spacingPos = ['Top', 'Right', 'Bottom', 'Left'];
 // Checks if node is a call expression with identifier 'token'
 const isTokenCallExpression = node => {
   if (node.callee.type === 'Identifier' && node.callee.name === 'token') {
@@ -21,9 +19,12 @@ const parseTemplateLiteral = (templateLiteral, context) => {
     if (i < quasis.length) {
       const cookedQuasi = quasis[i].value.cooked;
       if (cookedQuasi) {
-        const splitQuasi = cookedQuasi.split(" ").filter(str => str.length > 0);
-        splitQuasi.forEach(str => {
-          propertyValues.push(isNaN(Number(str)) ? `'${str}'` : str);
+        const splitQuasis = cookedQuasi.split(' ');
+        splitQuasis.forEach(str => {
+          str = str.trim().replace("\'", "");
+          if (str.length > 0) {
+            propertyValues.push(isNaN(Number(str)) ? `'${str}'` : str);
+          }
         });
       }
     }
@@ -35,18 +36,26 @@ const parseTemplateLiteral = (templateLiteral, context) => {
   return propertyValues;
 };
 const checkValidPropertyValues = propertyValues => {
-  if (!propertyValues.some(str => str.includes("token("))) {
+  if (!propertyValues.some(str => str.includes('token('))) {
     return false;
   }
   if (propertyValues.length < 1 || propertyValues.length > 4) {
     return false;
   }
-  if (propertyValues.some(str => str.includes("calc("))) {
+  if (propertyValues.some(str => str.includes('calc('))) {
     return false;
   }
   return true;
 };
 
+// Check that all expressions in TemplateLiteral are token expressions
+// If true: create an autofix
+// If false: report violation without autofix
+const hasOnlyTokens = templateLiteral => {
+  const expressions = templateLiteral.expressions;
+  return expressions.every(expr => expr.type === 'CallExpression' && isTokenCallExpression(expr));
+};
+
 // To fix spacing shorthands, given a list of spacing property values, expands the spacing property and adds autofix fixes
 const expandSpacingProperties = ({
   context,
@@ -69,10 +78,10 @@ const expandSpacingProperties = ({
           if (prop.key.name === `${propertyShorthand}${spacingPos[i]}`) {
             let [start, end] = prop.range;
             // Remove the entire line for the duplicate property
-            while (getSourceCode(context).text[end] !== "\n") {
+            while (getSourceCode(context).text[end] !== '\n') {
               end += 1;
             }
-            while (getSourceCode(context).text[start] !== "\n") {
+            while (getSourceCode(context).text[start] !== '\n') {
               start -= 1;
             }
             spacing[i] = getSourceCode(context).getText(prop.value);
@@ -96,6 +105,16 @@ const executeExpandSpacingRule = (context, node, propertyShorthand) => {
   }
   if (node.value.type === 'TemplateLiteral') {
     // Value of spacing property is a TemplateLiteral type that contains a token, e.g. padding: `0 token('a')`
+    if (!hasOnlyTokens(node.value)) {
+      context.report({
+        node,
+        messageId: 'expandSpacingShorthand',
+        data: {
+          property: propertyShorthand
+        }
+      });
+      return;
+    }
     const propertyValues = parseTemplateLiteral(node.value, context);
     if (!checkValidPropertyValues(propertyValues)) {
       return;

package/dist/esm/index.js

@@ -67,7 +67,7 @@ var commonConfig = {
   // Compiled: rules that are not included via `@compiled/recommended
   '@atlaskit/platform/expand-border-shorthand': 'error',
   '@atlaskit/platform/expand-background-shorthand': 'error',
-  '@atlaskit/platform/expand-spacing-shorthand': 'warn',
+  '@atlaskit/platform/expand-spacing-shorthand': 'off',
   '@compiled/jsx-pragma': ['error', {
     importSources: ['@atlaskit/css'],
     onlyRunIfImportingCompiled: true,

package/dist/esm/rules/compiled/expand-spacing-shorthand/index.js

@@ -4,9 +4,7 @@ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r)
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 import { getSourceCode } from '../../util/context-compat';
 import { isCompiledAPI } from '../../util/compiled-utils';
-var spacingPos = ["Top", "Right", "Bottom", "Left"];
-;
-
+var spacingPos = ['Top', 'Right', 'Bottom', 'Left'];
 // Checks if node is a call expression with identifier 'token'
 var isTokenCallExpression = function isTokenCallExpression(node) {
   if (node.callee.type === 'Identifier' && node.callee.name === 'token') {
@@ -25,11 +23,12 @@ var parseTemplateLiteral = function parseTemplateLiteral(templateLiteral, contex
     if (i < quasis.length) {
       var cookedQuasi = quasis[i].value.cooked;
       if (cookedQuasi) {
-        var splitQuasi = cookedQuasi.split(" ").filter(function (str) {
-          return str.length > 0;
-        });
-        splitQuasi.forEach(function (str) {
-          propertyValues.push(isNaN(Number(str)) ? "'".concat(str, "'") : str);
+        var splitQuasis = cookedQuasi.split(' ');
+        splitQuasis.forEach(function (str) {
+          str = str.trim().replace("\'", "");
+          if (str.length > 0) {
+            propertyValues.push(isNaN(Number(str)) ? "'".concat(str, "'") : str);
+          }
         });
       }
     }
@@ -42,7 +41,7 @@ var parseTemplateLiteral = function parseTemplateLiteral(templateLiteral, contex
 };
 var checkValidPropertyValues = function checkValidPropertyValues(propertyValues) {
   if (!propertyValues.some(function (str) {
-    return str.includes("token(");
+    return str.includes('token(');
   })) {
     return false;
   }
@@ -50,13 +49,23 @@ var checkValidPropertyValues = function checkValidPropertyValues(propertyValues)
     return false;
   }
   if (propertyValues.some(function (str) {
-    return str.includes("calc(");
+    return str.includes('calc(');
   })) {
     return false;
   }
   return true;
 };
 
+// Check that all expressions in TemplateLiteral are token expressions
+// If true: create an autofix
+// If false: report violation without autofix
+var hasOnlyTokens = function hasOnlyTokens(templateLiteral) {
+  var expressions = templateLiteral.expressions;
+  return expressions.every(function (expr) {
+    return expr.type === 'CallExpression' && isTokenCallExpression(expr);
+  });
+};
+
 // To fix spacing shorthands, given a list of spacing property values, expands the spacing property and adds autofix fixes
 var expandSpacingProperties = function expandSpacingProperties(_ref) {
   var context = _ref.context,
@@ -91,10 +100,10 @@ var expandSpacingProperties = function expandSpacingProperties(_ref) {
                 start = _prop$range[0],
                 end = _prop$range[1];
               // Remove the entire line for the duplicate property
-              while (getSourceCode(context).text[end] !== "\n") {
+              while (getSourceCode(context).text[end] !== '\n') {
                 end += 1;
               }
-              while (getSourceCode(context).text[start] !== "\n") {
+              while (getSourceCode(context).text[start] !== '\n') {
                 start -= 1;
               }
               spacing[i] = getSourceCode(context).getText(prop.value);
@@ -123,6 +132,16 @@ var executeExpandSpacingRule = function executeExpandSpacingRule(context, node,
   }
   if (node.value.type === 'TemplateLiteral') {
     // Value of spacing property is a TemplateLiteral type that contains a token, e.g. padding: `0 token('a')`
+    if (!hasOnlyTokens(node.value)) {
+      context.report({
+        node: node,
+        messageId: 'expandSpacingShorthand',
+        data: {
+          property: propertyShorthand
+        }
+      });
+      return;
+    }
     var propertyValues = parseTemplateLiteral(node.value, context);
     if (!checkValidPropertyValues(propertyValues)) {
       return;

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@atlaskit/eslint-plugin-platform",
 	"description": "The essential plugin for use with Atlassian frontend platform tools",
-	"version": "2.1.0",
+	"version": "2.1.2",
 	"author": "Atlassian Pty Ltd",
 	"atlassian": {
 		"team": "Build Infra",

package/src/index.tsx

@@ -66,7 +66,7 @@ const commonConfig = {
 	// Compiled: rules that are not included via `@compiled/recommended
 	'@atlaskit/platform/expand-border-shorthand': 'error',
 	'@atlaskit/platform/expand-background-shorthand': 'error',
-	'@atlaskit/platform/expand-spacing-shorthand': 'warn',
+	'@atlaskit/platform/expand-spacing-shorthand': 'off',
 	'@compiled/jsx-pragma': [
 		'error',
 		{

package/src/rules/compiled/expand-spacing-shorthand/__tests__/rule.test.ts

@@ -2,15 +2,8 @@ import { outdent } from 'outdent';
 import { tester } from '../../../../__tests__/utils/_tester';
 import { expandSpacingShorthand } from '../index';
 
-const included_compiled_libraries = [
-	'@compiled/react', 
-	'@atlaskit/css'
-];
-const exempt_libraries = [
-	'@atlaskit/primitives', 
-	'@emotion', 
-	'styled-components', 
-];
+const included_compiled_libraries = ['@compiled/react', '@atlaskit/css'];
+const exempt_libraries = ['@emotion/react', 'styled-components'];
 
 const validTestCases = (property: string) => {
 	return [
@@ -18,9 +11,14 @@ const validTestCases = (property: string) => {
 			name: `${property}: do not have to handle non-compiled packages (${imp})`,
 			code: outdent`
 			import {css} from '${imp}';
+			import {xcss} from '@atlaskit/primitives';
+
 			const styles = css({
 				${property}: token('space.200'),
 			});
+			const styles2 = xcss({
+				${property}: token('space.200'),
+			});
 		`,
 		})),
 		{
@@ -254,6 +252,26 @@ const invalidTestCases = (property: string) => {
 			`,
 			errors: [{ messageId: 'expandSpacingShorthand' }],
 		},
+		// Template literal containing expressions that is not token should only throw error with no autofix
+		{
+			name: `${property}: property value template string where it contains an expression that is not a token`,
+			code: outdent`
+			import {css} from '@compiled/react';
+			const styles = css({
+				${property}: \`\${token('space.100', '8px')} \${gridSize * 2}px\`,
+			});
+			const styles2 = css({
+				padding: \`\${DROPDOWN_HEADER_VERTICAL_PADDING} \${token('space.075','6px')} 
+					\${DROPDOWN_HEADER_VERTICAL_PADDING} \${token('space.200', '16px')}\`,
+			});
+			const styles3 = css({
+				${property}: \`\${token('space.050', '4px')} \${token('space.150', '12px')} \${token('space.150', '12px')} 
+					\${({ isSummaryView }: EditFormContentWrapperProps) =>
+					isSummaryView ? token('space.0', '0') : token('space.150', '12px')}\`,
+			});
+			`,
+			errors: Array.from(Array(3), () => ({ messageId: 'expandSpacingShorthand' })),
+		},
 		// Miscellaneous
 		{
 			name: `${property}: new property should not be created if existing property already exists`,
@@ -329,16 +347,70 @@ const invalidTestCases = (property: string) => {
 			`,
 			errors: Array.from(Array(3), () => ({ messageId: 'expandSpacingShorthand' })),
 		},
+		{
+			name: `${property}: property value includes newline and tab`,
+			code: outdent`
+			import {css} from '@compiled/react';
+			const styles = css({
+				${property}: \`\${token('space.100')} \${token('space.200')}
+					\${token('space.300')} \${token('space.400')}\`,
+			});
+			const styles2 = css({
+				paddingBottom: token('space.050', '4px'),
+				'&& > span': {
+					padding: \`\${token('space.100', '8px')} \${token('space.150', '12px')} 7px
+					\${token('space.150', '12px')}\`,
+				},
+			});
+			`,
+			output: outdent`
+			import {css} from '@compiled/react';
+			const styles = css({
+				${property}Top: token('space.100'),
+				${property}Right: token('space.200'),
+				${property}Bottom: token('space.300'),
+				${property}Left: token('space.400'),
+			});
+			const styles2 = css({
+				paddingBottom: token('space.050', '4px'),
+				'&& > span': {
+					paddingTop: token('space.100', '8px'),
+				paddingRight: token('space.150', '12px'),
+				paddingBottom: '7px',
+				paddingLeft: token('space.150', '12px'),
+				},
+			});
+			`,
+			errors: Array.from(Array(2), () => ({ messageId: 'expandSpacingShorthand' })),
+		},
+		// TODO (AFB-1022): Resolve this failing test
+		// {
+		//  name: `${property}: styled components with prop input`,
+		//  code: outdent`
+		//  import { styled } from '@compiled/react';
+		//  const MenuOptionWrapper = styled.div<{ isDisabled: boolean }>({
+		//      '& button': ({ isDisabled }) => ({
+		//          ${property}: \`\${token('space.075', '6px')} \${token('space.200', '16px')}\`,
+		//      }),
+		//  });
+		//  `,
+		//  output: outdent`
+		//  import { styled } from '@compiled/react';
+		//  const MenuOptionWrapper = styled.div<{ isDisabled: boolean }>({
+		//      '& button': ({ isDisabled }) => ({
+		//          ${property}Top: token('space.075', '6px'),
+		//      ${property}Right: token('space.200', '16px'),
+		//      ${property}Bottom: token('space.075', '6px'),
+		//      ${property}Left: token('space.200', '16px'),
+		//      }),
+		//  });
+		//  `,
+		//  errors: [{ messageId: 'expandSpacingShorthand' }],
+		// },
 	];
 };
 
 tester.run('expand-spacing-shorthand', expandSpacingShorthand, {
-	valid: [
-		...validTestCases('padding'),
-		...validTestCases('margin'),
-	],
-	invalid: [
-		...invalidTestCases('padding'),
-		...invalidTestCases('margin'),
-	],
+	valid: [...validTestCases('padding'), ...validTestCases('margin')],
+	invalid: [...invalidTestCases('padding'), ...invalidTestCases('margin')],
 });

package/src/rules/compiled/expand-spacing-shorthand/index.ts

@@ -3,15 +3,15 @@ import type { Property, Node, TemplateLiteral, CallExpression } from 'estree';
 import { getSourceCode } from '../../util/context-compat';
 import { isCompiledAPI } from '../../util/compiled-utils';
 
-const spacingPos = ["Top", "Right", "Bottom", "Left"] as const;
+const spacingPos = ['Top', 'Right', 'Bottom', 'Left'] as const;
 
 interface ExpandSpacingPropertiesType {
-	context: Rule.RuleContext, 
-	node: Property & { parent?: Node }, 
-	propertyValues: string[], 
-	fixer: Rule.RuleFixer,
-	propertyShorthand: string,
-};
+	context: Rule.RuleContext;
+	node: Property & { parent?: Node };
+	propertyValues: string[];
+	fixer: Rule.RuleFixer;
+	propertyShorthand: string;
+}
 
 // Checks if node is a call expression with identifier 'token'
 const isTokenCallExpression = (node: CallExpression) => {
@@ -29,12 +29,15 @@ const parseTemplateLiteral = (templateLiteral: TemplateLiteral, context: Rule.Ru
 
 	let propertyValues: string[] = [];
 	for (let i = 0; i < expressions.length || i < quasis.length; i++) {
-		if (i < quasis.length) {	
+		if (i < quasis.length) {
 			const cookedQuasi = quasis[i].value.cooked;
 			if (cookedQuasi) {
-				const splitQuasi = cookedQuasi.split(" ").filter(str => str.length > 0);
-				splitQuasi.forEach(str => {
-					propertyValues.push(isNaN(Number(str)) ? `'${str}'` : str);
+				const splitQuasis = cookedQuasi.split(' ');
+				splitQuasis.forEach((str) => {
+					str = str.trim().replace("\'", "");
+					if (str.length > 0) {
+						propertyValues.push(isNaN(Number(str)) ? `'${str}'` : str);
+					}
 				});
 			}
 		}
@@ -47,14 +50,34 @@ const parseTemplateLiteral = (templateLiteral: TemplateLiteral, context: Rule.Ru
 };
 
 const checkValidPropertyValues = (propertyValues: string[]) => {
-	if (!propertyValues.some(str => str.includes("token("))) { return false; }
-	if (propertyValues.length < 1 || propertyValues.length > 4) { return false; }
-	if (propertyValues.some(str => str.includes("calc("))) { return false; }
+	if (!propertyValues.some((str) => str.includes('token('))) {
+		return false;
+	}
+	if (propertyValues.length < 1 || propertyValues.length > 4) {
+		return false;
+	}
+	if (propertyValues.some((str) => str.includes('calc('))) {
+		return false;
+	}
 	return true;
-}
+};
+
+// Check that all expressions in TemplateLiteral are token expressions
+// If true: create an autofix
+// If false: report violation without autofix
+const hasOnlyTokens = (templateLiteral: TemplateLiteral) => {
+	const expressions = templateLiteral.expressions;
+	return expressions.every((expr) => expr.type === 'CallExpression' && isTokenCallExpression(expr));
+};
 
 // To fix spacing shorthands, given a list of spacing property values, expands the spacing property and adds autofix fixes
-const expandSpacingProperties = ({ context, node, propertyValues, fixer, propertyShorthand }: ExpandSpacingPropertiesType)  => {
+const expandSpacingProperties = ({
+	context,
+	node,
+	propertyValues,
+	fixer,
+	propertyShorthand,
+}: ExpandSpacingPropertiesType) => {
 	const [top, right = top, bottom = top, left = right] = propertyValues;
 	const spacing: string[] = [top, right, bottom, left];
 
@@ -63,16 +86,22 @@ const expandSpacingProperties = ({ context, node, propertyValues, fixer, propert
 	const parentNode = node.parent;
 	if (parentNode && parentNode.type === 'ObjectExpression') {
 		for (var prop of parentNode.properties) {
-			if (prop.type !== 'Property') { continue; }
-			if (prop.key.type === 'Identifier' && prop.range && prop.key.name !== `${propertyShorthand}`) {
+			if (prop.type !== 'Property') {
+				continue;
+			}
+			if (
+				prop.key.type === 'Identifier' &&
+				prop.range &&
+				prop.key.name !== `${propertyShorthand}`
+			) {
 				for (let i = 0; i < spacing.length; i++) {
 					if (prop.key.name === `${propertyShorthand}${spacingPos[i]}`) {
 						let [start, end] = prop.range;
 						// Remove the entire line for the duplicate property
-						while (getSourceCode(context).text[end] !== "\n") {
+						while (getSourceCode(context).text[end] !== '\n') {
 							end += 1;
 						}
-						while (getSourceCode(context).text[start] !== "\n") {
+						while (getSourceCode(context).text[start] !== '\n') {
 							start -= 1;
 						}
 						spacing[i] = getSourceCode(context).getText(prop.value);
@@ -83,7 +112,7 @@ const expandSpacingProperties = ({ context, node, propertyValues, fixer, propert
 			}
 		}
 	}
-	
+
 	fixes.push(fixer.insertTextAfter(node, `${propertyShorthand}Top: ${spacing[0]},\n`));
 	fixes.push(fixer.insertTextAfter(node, `\t${propertyShorthand}Right: ${spacing[1]},\n`));
 	fixes.push(fixer.insertTextAfter(node, `\t${propertyShorthand}Bottom: ${spacing[2]},\n`));
@@ -92,12 +121,30 @@ const expandSpacingProperties = ({ context, node, propertyValues, fixer, propert
 	return fixes;
 };
 
-const executeExpandSpacingRule = (context: Rule.RuleContext, node: Property, propertyShorthand: string) => {
-	if (!isCompiledAPI(context, node)) { return; }
+const executeExpandSpacingRule = (
+	context: Rule.RuleContext,
+	node: Property,
+	propertyShorthand: string,
+) => {
+	if (!isCompiledAPI(context, node)) {
+		return;
+	}
 	if (node.value.type === 'TemplateLiteral') {
 		// Value of spacing property is a TemplateLiteral type that contains a token, e.g. padding: `0 token('a')`
+		if (!hasOnlyTokens(node.value)) {
+			context.report({
+				node,
+				messageId: 'expandSpacingShorthand',
+				data: {
+					property: propertyShorthand,
+				},
+			});
+			return;
+		}
 		const propertyValues = parseTemplateLiteral(node.value, context);
-		if (!checkValidPropertyValues(propertyValues)) { return; }
+		if (!checkValidPropertyValues(propertyValues)) {
+			return;
+		}
 		context.report({
 			node,
 			messageId: 'expandSpacingShorthand',
@@ -105,12 +152,12 @@ const executeExpandSpacingRule = (context: Rule.RuleContext, node: Property, pro
 				property: propertyShorthand,
 			},
 			fix(fixer) {
-				return expandSpacingProperties({context, node, propertyValues, fixer, propertyShorthand});
+				return expandSpacingProperties({ context, node, propertyValues, fixer, propertyShorthand });
 			},
 		});
 	} else if (node.value.type === 'CallExpression' && isTokenCallExpression(node.value)) {
 		// Value of spacing property is a token CallExpression type, e.g. margin: token('space.100', '8px')
-		const propertyValues = [ getSourceCode(context).getText(node.value) ];
+		const propertyValues = [getSourceCode(context).getText(node.value)];
 		context.report({
 			node,
 			messageId: 'expandSpacingShorthand',
@@ -118,11 +165,11 @@ const executeExpandSpacingRule = (context: Rule.RuleContext, node: Property, pro
 				property: propertyShorthand,
 			},
 			fix(fixer) {
-				return expandSpacingProperties({context, node, propertyValues, fixer, propertyShorthand});
+				return expandSpacingProperties({ context, node, propertyValues, fixer, propertyShorthand });
 			},
 		});
 	}
-}
+};
 
 export const expandSpacingShorthand: Rule.RuleModule = {
 	meta: {
@@ -130,7 +177,8 @@ export const expandSpacingShorthand: Rule.RuleModule = {
 			url: 'https://bitbucket.org/atlassian/atlassian-frontend-monorepo/src/master/platform/packages/platform/eslint-plugin/src/rules/compiled/expand-spacing-shorthand/',
 		},
 		messages: {
-			expandSpacingShorthand: 'Use {{ property }}Top, {{ property }}Right, {{ property }}Bottom and {{ property }}Left instead of {{ property }} shorthand',
+			expandSpacingShorthand:
+				'Use {{ property }}Top, {{ property }}Right, {{ property }}Bottom and {{ property }}Left instead of {{ property }} shorthand',
 		},
 		type: 'problem',
 		fixable: 'code',
@@ -147,4 +195,4 @@ export const expandSpacingShorthand: Rule.RuleModule = {
 	},
 };
 
-export default expandSpacingShorthand;
+export default expandSpacingShorthand;