Merge pull request #40 from cinaaaa/refactor/new

feat: update and lint the files
cinaaaa · Mar 31, 2023 · f5e9b49 · f5e9b49
2 parents 563952f + dfd02f8
commit f5e9b49
Show file tree

Hide file tree

Showing 9 changed files with 124 additions and 130 deletions.
diff --git a/package.json b/package.json
@@ -1,20 +1,11 @@
 {
     "name": "react-tagify",
-    "version": "0.1.5",
-    "description": "Highlight #hashtags and @mentions in React",
-    "author": "Sina Farhadi",
-    "private": "true",
-    "license": "MIT",
     "workspaces": {
         "packages": [
             "packages/*",
             "site/*"
         ]
     },
-    "repository": {
-        "type": "git",
-        "url": "git+https://github.com/cinaaaa/react-tagify.git"
-    },
     "scripts": {
         "prepare": "husky install",
         "test": "echo test",
@@ -23,19 +14,6 @@
         "format": "prettier --write src//**/*.{ts,tsx,css} --config ./.prettierrc",
         "lint-staged": "yarn lint:fix && yarn format"
     },
-    "keywords": [
-        "react",
-        "react-tagify",
-        "tag",
-        "mention",
-        "highlight",
-        "tag-highlight",
-        "mention-highlight"
-    ],
-    "bugs": {
-        "url": "https://github.com/cinaaaa/react-tagify/issues"
-    },
-    "homepage": "https://cinaaaa.github.io/react-tagify/",
     "devDependencies": {
         "@types/node": "^18.15.11",
         "eslint-plugin-simple-import-sort": "^10.0.0",

diff --git a/packages/react-tagify/package.json b/packages/react-tagify/package.json
@@ -1,50 +1,69 @@
 {
-    "name": "react-tagify",
-    "version": "0.1.5",
-    "scripts": {
-        "dev": "vite",
-        "build": "tsc && vite build",
-        "preview": "vite preview",
-        "prepare": "husky install"
-    },
-    "dependencies": {
-        "react": "^16.8.0 || 17.x",
-        "react-dom": "^16.8.0 || 17.x",
-        "styled-components": "^5.0.0"
-    },
-    "devDependencies": {
-        "@babel/core": "^7.16.12",
-        "@types/node": "^17.0.12",
-        "@types/react": "^17.0.38",
-        "@types/react-dom": "^17.0.11",
-        "@types/styled-components": "^5.1.21",
-        "@typescript-eslint/eslint-plugin": "^5.43.0",
-        "@vitejs/plugin-react": "^1.1.4",
-        "acorn-jsx": "^5.3.2",
-        "babel-loader": "^8.2.3",
-        "husky": "^8.0.3",
-        "prettier": "^2.8.7",
-        "react-hooks": "^1.0.1",
-        "typescript": "*",
-        "vite": "^2.7.13",
-        "vite-plugin-dts": "^0.9.9"
-    },
-    "license": "UNLICENSED",
-    "peerDependencies": {
-        "react": "^16.8.0 || 17.x",
-        "react-dom": "^16.8.0 || 17.x",
-        "styled-components": "^5.0.0"
-    },
-    "files": [
-        "dist"
-    ],
-    "main": "./dist/lib.umd.js",
-    "module": "./dist/lib.es.js",
-    "types": "./dist/index.d.ts",
-    "exports": {
-        ".": {
-            "import": "./dist/lib.es.js",
-            "require": "./dist/lib.umd.js"
-        }
+  "name": "react-tagify",
+  "version": "0.1.5",
+  "description": "Empower your React applications with effortless #tag and @mention support",
+  "author": "Sina Farhadi",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview",
+    "prepare": "husky install"
+  },
+  "dependencies": {
+    "react": "^16.8.0 || 17.x",
+    "react-dom": "^16.8.0 || 17.x",
+    "styled-components": "^5.0.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.16.12",
+    "@types/node": "^17.0.12",
+    "@types/react": "^17.0.38",
+    "@types/react-dom": "^17.0.11",
+    "@types/styled-components": "^5.1.21",
+    "@typescript-eslint/eslint-plugin": "^5.43.0",
+    "@vitejs/plugin-react": "^1.1.4",
+    "acorn-jsx": "^5.3.2",
+    "babel-loader": "^8.2.3",
+    "husky": "^8.0.3",
+    "prettier": "^2.8.7",
+    "react-hooks": "^1.0.1",
+    "typescript": "*",
+    "vite": "^2.7.13",
+    "vite-plugin-dts": "^0.9.9"
+  },
+  "license": "UNLICENSED",
+  "peerDependencies": {
+    "react": "^16.8.0 || 17.x",
+    "react-dom": "^16.8.0 || 17.x",
+    "styled-components": "^5.0.0"
+  },
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/lib.umd.js",
+  "module": "./dist/lib.es.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/lib.es.js",
+      "require": "./dist/lib.umd.js"
     }
+  },
+  "keywords": [
+    "react",
+    "react-tagify",
+    "tag",
+    "mention",
+    "highlight",
+    "tag-highlight",
+    "mention-highlight"
+  ],
+  "bugs": {
+    "url": "https://github.com/cinaaaa/react-tagify/issues"
+  },
+  "homepage": "https://cinaaaa.github.io/react-tagify/",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/cinaaaa/react-tagify.git"
+  }
 }
diff --git a/packages/react-tagify/src/@types/tagify.ts b/packages/react-tagify/src/@types/tagify.ts
@@ -1,18 +1,14 @@
 export interface TagifyProps {
-  // Tagify options
   children: React.ReactNode;
 
-  // Styling props
   color?: string;
   tagStyle?: React.CSSProperties;
   mentionStyle?: React.CSSProperties;
 
-  // Option props
   detectHashtags?: boolean;
   detectMentions?: boolean;
 
-  // Event handlers
   onClick?: (tag: string, type: ElementDetectedType) => void;
 }
 
-export type ElementDetectedType = "tag" | "mention" | null;
+export type ElementDetectedType = 'tag' | 'mention' | null;
diff --git a/packages/react-tagify/src/helpers/matchers.ts b/packages/react-tagify/src/helpers/matchers.ts
@@ -1,24 +1,24 @@
 type getMatchedTypeProps = {
-    text: string;
-    detectHashtags: boolean;
-    detectMentions: boolean;
+  text: string;
+  detectHashtags: boolean;
+  detectMentions: boolean;
 };
 
 export const getMatchedType = (args: getMatchedTypeProps) => {
-    const matchers = [
-        { type: 'hashtag', pattern: /#[a-zA-Z0-9_]+/g },
-        { type: 'mention', pattern: /@[a-zA-Z0-9_]+/g }
-    ];
+  const matchers = [
+    { type: 'hashtag', pattern: /#[a-zA-Z0-9_]+/g },
+    { type: 'mention', pattern: /@[a-zA-Z0-9_]+/g },
+  ];
 
-    for (const matcher of matchers) {
-        if (matcher.pattern.test(args.text)) {
-            if (
-                (matcher.type === 'hashtag' && args.detectHashtags) ||
-                (matcher.type === 'mention' && args.detectMentions)
-            ) {
-                return matcher.type;
-            }
-        }
+  for (const matcher of matchers) {
+    if (matcher.pattern.test(args.text)) {
+      if (
+        (matcher.type === 'hashtag' && args.detectHashtags) ||
+        (matcher.type === 'mention' && args.detectMentions)
+      ) {
+        return matcher.type;
+      }
     }
-    return null;
+  }
+  return null;
 };
diff --git a/packages/react-tagify/src/helpers/sign-remover.ts b/packages/react-tagify/src/helpers/sign-remover.ts
@@ -1,6 +1,5 @@
-// remove # and @ from texts
 export const signRemover = (str: string) => {
-    if (str.startsWith('#')) return str.slice(1);
-    if (str.startsWith('@')) return str.slice(1);
-    return str;
-};
+  if (str.startsWith('#')) return str.slice(1);
+  if (str.startsWith('@')) return str.slice(1);
+  return str;
+};
diff --git a/packages/react-tagify/src/helpers/type-detector.ts b/packages/react-tagify/src/helpers/type-detector.ts
@@ -1,5 +1,3 @@
-// a function that recieves a string and check that it is starting with # or @
-// and return the type of the string
 export const detectType = (str: string) => {
   if (str.startsWith('#')) return 'tag';
   if (str.startsWith('@')) return 'mention';

diff --git a/packages/react-tagify/src/lib/span.tsx b/packages/react-tagify/src/lib/span.tsx
@@ -14,6 +14,7 @@ export const SpanElement = (props: SpanElement) => {
   };
 
   const spanStyle = props.style || defaultStyle;
+
   return (
     <span
       style={spanStyle}

diff --git a/packages/react-tagify/src/lib/tagify.tsx b/packages/react-tagify/src/lib/tagify.tsx
@@ -4,7 +4,7 @@ import { getMatchedType } from '../helpers';
 import type { TagifyProps } from '../@types/tagify';
 
 const Tagify: React.FC<TagifyProps> = ({
-  children,
+  children = <></>,
   color = '#0073e6',
   onClick,
   tagStyle,

diff --git a/packages/react-tagify/vite.config.ts b/packages/react-tagify/vite.config.ts
@@ -5,39 +5,42 @@ import { defineConfig, UserConfigExport } from 'vite';
 import dts from 'vite-plugin-dts';
 
 const App = async (): Promise<UserConfigExport> => {
+  var name: string = 'replaceme';
+  const data: string = await readFile(path.join(__dirname, 'src', 'lib', 'index.tsx'), {
+    encoding: 'utf-8',
+  });
 
-    var name: string = 'replaceme';
-    const data: string = await readFile(path.join(__dirname, 'src', 'lib', 'index.tsx'), { encoding: 'utf-8' })
+  const s = data.split('\n');
 
-    const s = data.split('\n')
+  for (let x of s.reverse())
+    if (x.includes('export default'))
+      name = x.replace('export default ', '').replace(' ', '');
 
-    for (let x of s.reverse()) if (x.includes('export default')) name = x.replace('export default ', '').replace(" ", "")
-
-    return defineConfig({
-        plugins: [
-            react(),
-            dts({
-                insertTypesEntry: true,
-            }),
-        ],
-        build: {
-            lib: {
-                entry: path.resolve(__dirname, 'src/lib/index.tsx'),
-                name,
-                formats: ['es', 'umd'],
-                fileName: (format) => `lib.${format}.js`,
-            },
-            rollupOptions: {
-                external: ['react', 'react-dom'],
-                output: {
-                    globals: {
-                        react: 'React',
-                        'react-dom': 'ReactDOM'
-                    },
-                },
-            },
+  return defineConfig({
+    plugins: [
+      react(),
+      dts({
+        insertTypesEntry: true,
+      }),
+    ],
+    build: {
+      lib: {
+        entry: path.resolve(__dirname, 'src/lib/index.tsx'),
+        name,
+        formats: ['es', 'umd'],
+        fileName: (format) => `lib.${format}.js`,
+      },
+      rollupOptions: {
+        external: ['react', 'react-dom'],
+        output: {
+          globals: {
+            react: 'React',
+            'react-dom': 'ReactDOM',
+          },
         },
-    });
-}
+      },
+    },
+  });
+};
 
-export default App;
+export default App;