refactor: Redesign helpers

src/helpers/converter/index.ts → src/helpers/css-converter/index.ts

@@ -1,14 +1,17 @@
-import TAILWINDCLASS from '../preprocessor/constants';
-import { StyleDeclaration, StyleRule } from '~/helpers/extractor';
-import { preprocessProperty, preprocessValue } from '../preprocessor';
-import { preprocessShorthand } from '~/helpers/preprocessor/shorthand';
+import { StyleDeclaration, StyleRule } from '~/types';
+import {
+  preprocessProperty,
+  preprocessValue,
+  preprocessShorthand,
+  TAILWINDCLASS,
+} from './preprocessor';
 
 export function convertStyles(styles: StyleRule[]) {
   const rules = preprocessShorthand(styles);
 
   return rules.reduce((combinedStyles, rule) => {
     const selectors = convertSelector(rule.selectors);
-    const utilities = rule.declarations.map((declaration) =>
+    const utilities = rule.declarations.map((declaration: StyleDeclaration) =>
       convertCss(declaration),
     );
 
@@ -18,7 +21,7 @@ export function convertStyles(styles: StyleRule[]) {
         (combinedSelectors, selector) =>
           combinedSelectors +
           utilities.reduce(
-            (combinedUtilities, util) =>
+            (combinedUtilities: string, util: string) =>
               combinedUtilities + `${selector}${selector ? ':' : ''}${util} `,
             '',
           ),

src/helpers/preprocessor/dimension.ts → src/helpers/css-converter/preprocessor/dimension.ts

@@ -1,4 +1,4 @@
-import { convertUnit } from '~/helpers/preprocessor/unit';
+import { convertUnit } from './unit';
 
 export function preprocessDimension(value: string) {
   if (value === '0' || value === '0px') {

src/helpers/preprocessor/index.ts → src/helpers/css-converter/preprocessor/index.ts

@@ -6,8 +6,11 @@ import {
   preprocessLetterSpacing,
   preprocessLineHeight,
 } from './text';
-import { preprocessSpacing } from '~/helpers/preprocessor/spacing';
-import { preprocessDimension } from '~/helpers/preprocessor/dimension';
+import { preprocessSpacing } from './spacing';
+import { preprocessDimension } from './dimension';
+
+export { preprocessShorthand } from './shorthand';
+export { default as TAILWINDCLASS } from './constants';
 
 export type CSSStyleEntity = {
   property: string;

src/helpers/preprocessor/shorthand.ts → src/helpers/css-converter/preprocessor/shorthand.ts

@@ -1,6 +1,6 @@
 import TAILWINDCLASS from './constants';
-import { StyleDeclaration, StyleRule } from '~/helpers/extractor';
-import { isColor } from '~/helpers/preprocessor/color';
+import { StyleDeclaration, StyleRule } from '~/types';
+import { isColor } from './color';
 
 export function preprocessShorthand(styleRules: StyleRule[]) {
   return styleRules.map((styleRule) => {

src/helpers/preprocessor/spacing.ts → src/helpers/css-converter/preprocessor/spacing.ts

@@ -1,4 +1,4 @@
-import { convertUnit } from '~/helpers/preprocessor/unit';
+import { convertUnit } from './unit';
 
 export function preprocessSpacing(value: string) {
   return convertUnit(value, 'rem');

src/helpers/preprocessor/text.ts → src/helpers/css-converter/preprocessor/text.ts

@@ -1,4 +1,4 @@
-import { convertUnit } from '~/helpers/preprocessor/unit';
+import { convertUnit } from './unit';
 
 export function preprocessFontWeight(value: string) {
   switch (value) {

src/helpers/extractor.ts → src/helpers/css-extractor.ts

@@ -1,10 +1,11 @@
 import { AST } from 'prettier';
 import {
-  generateConcatenatedCSSTemplateLiteral,
-  generateJSXOpeningElementClassNameAttribute,
-} from '~/helpers/generator';
-import { convertStyles } from '~/helpers/converter';
-import { parseSass } from '~/helpers/css-parser';
+  manipulateConcatenatedCSSTemplateLiteral,
+  manipulateJSXOpeningElementClassNameAttribute,
+} from './manipulator';
+import { convertStyles } from './css-converter';
+import { parseSass } from './css-parser';
+import { ComponentDeclaration } from '~/types';
 
 export function extractVariableDeclarations(ast: AST): any[] {
   if (!ast.program || !ast.program.body.length) {
@@ -16,26 +17,6 @@ export function extractVariableDeclarations(ast: AST): any[] {
   );
 }
 
-export type StyleRule = {
-  type: string;
-  selectors: string[];
-  declarations: StyleDeclaration[];
-  position: any;
-};
-
-export type StyleDeclaration = {
-  type: string;
-  property: string;
-  value: string;
-  position: any;
-};
-
-type ComponentDeclaration = {
-  name: string;
-  tag: string;
-  styles: StyleRule[];
-};
-
 export function isObject(arg: unknown): arg is object {
   return typeof arg === 'object' && arg !== null;
 }
@@ -98,7 +79,7 @@ export function getVariableDeclarationThroughStyledRecursively(ast: AST) {
       'value' in node.init.quasi.quasis[0] &&
       isObject(node.init.quasi.quasis[0].value)
     ) {
-      const sassScript = generateConcatenatedCSSTemplateLiteral(
+      const sassScript = manipulateConcatenatedCSSTemplateLiteral(
         node.init.quasi.quasis,
       );
 
@@ -168,7 +149,7 @@ export function overrideClassnameAttributeRecursively(
         if (targetComponentDeclarations.length) {
           const { tag, styles } = targetComponentDeclarations[0];
 
-          const newAttributes = generateJSXOpeningElementClassNameAttribute(
+          const newAttributes = manipulateJSXOpeningElementClassNameAttribute(
             node.attributes,
             convertStyles(styles),
           );

src/helpers/generator.ts → src/helpers/manipulator.ts

@@ -2,7 +2,7 @@
 // @ts-nocheck
 import type { JSXAttribute, JSXSpreadAttribute } from 'estree-jsx';
 
-export function generateJSXOpeningElementClassNameAttribute(
+export function manipulateJSXOpeningElementClassNameAttribute(
   attributes: (JSXAttribute | JSXSpreadAttribute)[],
   attributeValue: string,
 ): JSXAttribute[] {
@@ -67,7 +67,7 @@ export function generateJSXOpeningElementClassNameAttribute(
   return attributes;
 }
 
-export function generateConcatenatedCSSTemplateLiteral(quasis: any[]) {
+export function manipulateConcatenatedCSSTemplateLiteral(quasis: any[]) {
   return quasis.reduce((sum, curr) => {
     if (!curr.tail) {
       const replaced = curr.value.raw.replace(/\n|\s/g, '');

src/main.ts

@@ -1,15 +1,15 @@
 import { format } from 'prettier';
-import { scrapRawScript, writeFormattedScript } from '~/helpers/reader';
 import plugin from './plugin';
 import chalk from 'chalk';
+import fs from 'fs/promises';
 
 export default (async () => {
   const args = process.argv.slice(2);
 
   if (args[0] === '--target') {
     try {
       const filePath = args[1];
-      const rawScript = await scrapRawScript(filePath);
+      const rawScript = await fs.readFile(filePath, 'utf-8');
 
       const formattedScript = format(rawScript, {
         plugins: [plugin],
@@ -26,7 +26,7 @@ export default (async () => {
         const directory = `${writeDirectory.join(
           '/',
         )}/${tailwindFileName}.${fileExtension}`;
-        await writeFormattedScript(directory, formattedScript);
+        await fs.writeFile(directory, formattedScript);
 
         console.log(
           chalk.green(

src/plugin.ts

@@ -1,7 +1,7 @@
 import { parsers as babelParsers } from 'prettier/parser-babel';
 import { parsers as typescriptParsers } from 'prettier/parser-typescript';
 
-import { printers } from './helpers/printer';
+import { printers } from './printer';
 
 export const parsers: { [parserName: string]: any } = {
   babel: {

src/helpers/printer.ts → src/printer.ts

@@ -10,7 +10,7 @@ import {
   extractVariableDeclarations,
   getVariableDeclarationThroughStyledRecursively,
   overrideClassnameAttributeRecursively,
-} from '~/helpers/extractor';
+} from '~/helpers/css-extractor';
 
 export function extractPrinter(options: ParserOptions): Printer | undefined {
   const pluginOrNot = (

src/types/index.ts

@@ -0,0 +1,19 @@
+export type StyleRule = {
+  type: string;
+  selectors: string[];
+  declarations: StyleDeclaration[];
+  position: any;
+};
+
+export type StyleDeclaration = {
+  type: string;
+  property: string;
+  value: string;
+  position: any;
+};
+
+export type ComponentDeclaration = {
+  name: string;
+  tag: string;
+  styles: StyleRule[];
+};