Merge pull request #312 from divyadaglia-unbxd/vulnerability_moderate

WIP:Vulnerability moderate(Tailwind migration, postcss loader update)

demo/package.json

@@ -16,15 +16,15 @@
         "bootstrap": "^4.5.2",
         "express": "^4.17.1",
         "html-loader": "^1.3.1",
-        "postcss-loader": "^4.0.3",
+        "postcss-loader": "7.3.3",
         "rc-slider": "^9.6.1",
         "react": "16.13.0",
         "react-app-polyfill": "^1.0.6",
         "react-bootstrap": "^1.3.0",
         "react-dom": "16.13.0",
         "react-router-dom": "^5.2.0",
         "react-select": "^4.3.0",
-        "tailwindcss": "^1.8.12"
+        "tailwindcss": "3.3.3"
     },
     "devDependencies": {
         "@babel/core": "^7.10.4",
@@ -34,7 +34,7 @@
         "autoprefixer": "^9.8.4",
         "babel-loader": "^8.1.0",
         "babel-plugin-transform-class-properties": "^6.24.1",
-        "css-loader": "^3.6.0",
+        "css-loader": "6.8.1",
         "html-webpack-plugin": "^4.3.0",
         "mini-css-extract-plugin": "^0.9.0",
         "node-sass": "^6.0.1",

demo/public/index.html

@@ -18,6 +18,7 @@
             type="text/css"
             href="https://libraries.unbxdapi.com/sdk-assets/styles.css"
         />
+
         <link
             rel="stylesheet"
             href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.0-2/css/all.min.css"

demo/webpack/webpack.dev.js

@@ -64,7 +64,10 @@ module.exports = {
     },
     plugins: [htmlPlugin],
     resolve: {
-        extensions: ['*', '.js', '.jsx'],
+        extensions: ['*', '.js', '.jsx', '.scss', '.css'],
+        modules: [
+            "node_modules"
+        ],
         alias: {
             '~': Path.resolve(__dirname, '../src')
         }

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@unbxd-ui/react-search-sdk",
-    "version": "1.2.28",
+    "version": "1.2.29-beta.1",
     "description": "Unbxd React Search JS SDK",
     "main": "public/dist/js/reactSearch.js",
     "files": [
@@ -30,7 +30,7 @@
         "@babel/plugin-syntax-jsx": "^7.18.6",
         "@babel/preset-env": "^7.19.0",
         "@babel/preset-react": "^7.18.6",
-        "@fullhuman/postcss-purgecss": "^2.2.0",
+        "@fullhuman/postcss-purgecss": "5.0.0",
         "@storybook/addon-actions": "6.1.11",
         "@storybook/addon-docs": "^7.0.25",
         "@storybook/addon-links": "^6.1.11",
@@ -42,13 +42,13 @@
         "@testing-library/react": "^11.1.2",
         "@webpack-cli/serve": "^2.0.5",
         "add-asset-html-webpack-plugin": "^5.0.2",
-        "autoprefixer": "^9.7.6",
+        "autoprefixer": "10.4.14",
         "babel-eslint": "^10.1.0",
         "babel-loader": "^8.0.6",
         "codecov": "^3.8.1",
-        "commitizen": "^4.2.2",
+        "commitizen": "4.3.0",
         "compression-webpack-plugin": "4.0.0",
-        "css-loader": "^3.4.2",
+        "css-loader": "6.8.1",
         "cz-conventional-changelog": "3.3.0",
         "eslint": "^8.0.0",
         "eslint-config-airbnb": "^19.0.4",
@@ -73,17 +73,17 @@
         "mini-css-extract-plugin": "^0.9.0",
         "optimize-css-assets-webpack-plugin": "^5.0.3",
         "path": "^0.12.7",
-        "postcss-cli": "^7.1.1",
-        "postcss-loader": "^3.0.0",
+        "postcss-cli": "10.1.0",
+        "postcss-loader": "7.3.3",
         "prettier": "^2.0.5",
-        "purgecss-webpack-plugin": "^2.2.0",
+        "purgecss-webpack-plugin": "5.0.0",
         "react": "^16.13.0",
         "react-dom": "^16.13.0",
         "react-test-renderer": "^17.0.1",
         "remove-files-webpack-plugin": "^1.4.3",
         "sass-loader": "10.4.1",
         "storybook-addon-react-docgen": "1.2.43",
-        "tailwindcss": "^1.4.6",
+        "tailwindcss": "3.3.3",
         "terser-webpack-plugin": "^3.0.1",
         "uglifyjs-webpack-plugin": "^2.2.0",
         "webpack": "5.76.0",
@@ -97,13 +97,9 @@
         "glob-parent": "5.1.2",
         "nth-check": "2.0.1",
         "serialize-javascript": "3.1.0",
-        "node-fetch": "2.6.7"
-    },
-    "overrides": {
-        "@storybook/theming": "^6.2.9",
-        "prop-types": "^15.7.2",
-        "parse-url": "8.1.0",
-        "glob-parent": "5.1.2"
+        "node-fetch": "2.6.7",
+        "semver": "5.7.2",
+        "word-wrap": "1.2.4"
     },
     "keywords": [
         "React Search",
@@ -132,6 +128,7 @@
     "dependencies": {
         "@babel/plugin-transform-runtime": "^7.22.6",
         "@unbxd-ui/unbxd-search-core": "0.4.33",
+        "postcss": "8.2.13",
         "sass": "^1.63.6",
         "style-loader": "3.3.3",
         "yarn": "^1.22.19"

postcss.config.js

@@ -1,15 +1,16 @@
 const tailwindcss = require('tailwindcss');
 const whiteListClasses = require('./src/config/whiteListClasses');
+const purgecss = require('@fullhuman/postcss-purgecss')
 
 module.exports = {
     plugins: [
         tailwindcss('./tailwind.config.js'),
-        require('autoprefixer'),
-        require('@fullhuman/postcss-purgecss')({
-            content: ['./src/**/*.js'],
-            defaultExtractor: (content) =>
-                content.match(/[\w-/:]+(?<!:)/g) || [],
-            whitelist: whiteListClasses
-        })
+        require('autoprefixer')
+        // purgecss({
+        //     content: ["./src/**/*.js", "./demo/src/**/*.js"],
+        //     css: ["./public/css/**/*.css"],
+        //     defaultExtractor: content => content.match(/[\w-./:]+(?<!:)/g) || [],
+        //     safelist: whiteListClasses
+        //   }),
     ]
 };

public/css/core/modules.scss

@@ -1,12 +1,18 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
 /* SearchBox Begins*/
 .UNX-searchbox__container {
     display: inline-block;
     position: relative;
 }
 
-.UNX-searchbox__button {
+
+ .UNX-searchbox__button {
     @apply m-2;
-}
+} 
+
 
 .UNX-searchbox__clearIcon {
     position: absolute;