@bigbinary/neeto-commons-frontend 2.0.24 → 2.0.26

package/configs/eslint/react.js

@@ -0,0 +1,92 @@
+module.exports = {
+  rules: {
+    // not-auto-fixable: Prevent missing props validation in a React component definition.
+    "react/prop-types": "off",
+    // not-auto-fixable: Detect unescaped HTML entities, which might represent malformed tags.
+    "react/no-unescaped-entities": "off",
+    // not-auto-fixable: Prevent missing displayName in a React component definition. Useful when using React extensions in browser and checking for component name.
+    "react/display-name": "error",
+    // not-auto-fixable: Reports when this.state is accessed within setState.
+    "react/no-access-state-in-setstate": "error",
+    // not-auto-fixable: Prevent usage of dangerous JSX props. Currently jam3 plugin will take care of handling this.
+    "react/no-danger": "off",
+    // not-auto-fixable: Report when a DOM element is using both children and dangerouslySetInnerHTML.
+    "react/no-danger-with-children": "warn",
+    // not-auto-fixable: Prevent definitions of unused prop types.
+    "react/no-unused-prop-types": "error",
+    // not-auto-fixable: Report missing key props in iterators/collection literals. Important rule!
+    "react/jsx-key": ["error", { checkFragmentShorthand: true }],
+    // not-auto-fixable: Enforce no duplicate props.
+    "react/jsx-no-duplicate-props": "error",
+    // not-auto-fixable: Disallow undeclared variables in JSX.
+    "react/jsx-no-undef": "error",
+    // not-auto-fixable: Enforce PascalCase for user-defined JSX components.
+    "react/jsx-pascal-case": ["error", { allowNamespace: true }],
+    // not-auto-fixable: Prevent React to be incorrectly marked as unused.
+    "react/jsx-uses-react": "error",
+    // not-auto-fixable: Prevent variables used in JSX to be marked as unused.
+    "react/jsx-uses-vars": "error",
+    // not-auto-fixable: Ensures https://reactjs.org/docs/hooks-rules.html.
+    "react-hooks/rules-of-hooks": "error",
+    // not-auto-fixable: Ensures https://reactjs.org/docs/hooks-rules.html - Checks effect dependencies.
+    "react-hooks/exhaustive-deps": "warn",
+    // auto-fixable: A fragment is redundant if it contains only one child, or if it is the child of a html element, and is not a keyed fragment.
+    "react/jsx-no-useless-fragment": ["error", { allowExpressions: true }],
+    // auto-fixable: Prefer arrow function expressions for component declaration.
+    "react/function-component-definition": [
+      "error",
+      {
+        namedComponents: "arrow-function",
+        unnamedComponents: "arrow-function",
+      },
+    ],
+    // auto-fixable: Components without children can be self-closed to avoid unnecessary extra closing tag.
+    "react/self-closing-comp": [
+      "error",
+      {
+        component: true,
+        html: true,
+      },
+    ],
+    // auto-fixable: Wrapping multiline JSX in parentheses can improve readability and/or convenience.
+    "react/jsx-wrap-multilines": [
+      "error",
+      {
+        declaration: "parens-new-line",
+        assignment: "parens-new-line",
+        return: "parens-new-line",
+        arrow: "parens-new-line",
+        condition: "parens-new-line",
+        logical: "parens-new-line",
+        prop: "ignore",
+      },
+    ],
+    // not-auto-fixable: Make sure files containing JSX is having .jsx extension.
+    "react/jsx-filename-extension": ["error", { allow: "as-needed" }],
+    // auto-fixable: Omit mentioning the "true" value if it can be implicitly understood in props.
+    "react/jsx-boolean-value": "error",
+    // auto-fixable: Partially fixable. Make sure the state and setter have symmertic naming.
+    "react/hook-use-state": "error",
+    // auto-fixable: Shorthand notations should always be at the top and also enforce props alphabetical sorting.
+    "react/jsx-sort-props": [
+      "error",
+      {
+        callbacksLast: true,
+        shorthandFirst: true,
+        multiline: "last",
+        reservedFirst: false,
+        locale: "auto",
+      },
+    ],
+    // auto-fixable: Disallow unnecessary curly braces in JSX props and/or children.
+    "react/jsx-curly-brace-presence": [
+      "error",
+      {
+        props: "never",
+        children: "never",
+        // JSX prop values that are JSX elements should be enclosed in braces.
+        propElementValues: "always",
+      },
+    ],
+  },
+};

package/configs/prettier.js

@@ -0,0 +1,16 @@
+module.exports = {
+  tailwindConfig: "./tailwind.config.js",
+  trailingComma: "es5",
+  arrowParens: "avoid",
+  printWidth: 80,
+  tabWidth: 2,
+  useTabs: false,
+  semi: true,
+  quoteProps: "as-needed",
+  jsxSingleQuote: false,
+  singleQuote: false,
+  bracketSpacing: true,
+  bracketSameLine: false,
+  proseWrap: "always",
+  endOfLine: "lf",
+};

package/configs/tailwind.js

@@ -0,0 +1,13 @@
+module.exports = {
+  important: true,
+  purge: {
+    enabled: process.env.NODE_ENV === "production",
+    content: [
+      "./app/javascript/**/*.{js,jsx}",
+      "./app/views/**/*.html.erb",
+      "./app/views/**/*.slim",
+      "./node_modules/@bigbinary/**/*.js",
+    ],
+    defaultExtractor: content => content.match(/[A-Za-z0-9-_:/]+/g) || [],
+  },
+};

package/configs/webpack/helpers/customize-default-rules.js

@@ -0,0 +1,57 @@
+/*
+  Customize default webpack rules/loaders configuration.
+  A custom helpers till shakapacker introduces the feature.
+  Track the following the issues to get the status of feature development in shakapacker:
+  https://github.com/shakacode/shakapacker/issues/80
+  https://github.com/shakacode/shakapacker/issues/87
+  Usage:
+    const customizeWebpackDefaultRules = require("./helpers/customize-default-rules");
+    const defaultRules = {
+      "asset/resource": {
+        test: /\.(bmp|gif|jpe?g|png|tiff|ico|avif|webp|eot|otf|ttf|woff|woff2)$/
+      },
+      "asset/source": {
+        exclude: /\.(js|mjs|jsx|ts|tsx|js)$/,
+      },
+    };
+    const customWebpackConfig = customizeWebpackDefaultRules(webpackConfig, defaultRules);
+  NOTE:
+    - Check if the option to output default configuration is introduced or not before upgrading further.
+    - Update the defaultRuleType constant whenever shakapacker introduces a new default rule/loader.
+*/
+const {
+  findBy,
+  findIndexBy,
+} = require("@bigbinary/neeto-commons-frontend/pure");
+
+const modifyDefaultRulesConfig = (webpackConfig, rules = {}) => {
+  const defaultRuleType = ["asset/resource", "asset/source"];
+
+  Object.keys(rules).forEach(ruleName => {
+    if (defaultRuleType.includes(ruleName)) {
+      const rule = findBy(
+        { type: "asset/resource" },
+        webpackConfig.module.rules
+      );
+
+      const rulePosition = findIndexBy(
+        { type: ruleName },
+        webpackConfig.module.rules
+      );
+
+      Object.keys(rules[ruleName]).forEach(attribute => {
+        if (rule[attribute] !== undefined) {
+          rule[attribute] = rules[ruleName][attribute];
+        }
+      });
+
+      webpackConfig.module.rules[rulePosition] = rule;
+    } else {
+      throw new Error("Invalid default rule type");
+    }
+  });
+
+  return webpackConfig;
+};
+
+module.exports = modifyDefaultRulesConfig;

package/configs/webpack/index.js

@@ -0,0 +1,41 @@
+const process = require("process");
+
+const Dotenv = require("dotenv-webpack");
+const { webpackConfig, merge } = require("shakapacker");
+const webpack = require("webpack");
+
+const customizeWebpackDefaultRules = require("./helpers/customize-default-rules");
+const resolve = require("./resolve");
+const rules = require("./rules");
+
+const dotEnvFileSuffix =
+  process.env.NODE_ENV === "production" ? "" : `.${process.env.NODE_ENV}`;
+
+const commonOptions = {
+  infrastructureLogging: { level: "warn" },
+  devtool: "source-map",
+  resolve,
+  module: { rules },
+  plugins: [
+    new webpack.ProvidePlugin({ process: "process/browser" }),
+    new Dotenv({
+      path: `./.env${dotEnvFileSuffix}`,
+      systemvars: true,
+      silent: true,
+    }),
+  ],
+};
+
+// This rule is causing issues to react-svg-loader
+const defaultRules = {
+  "asset/resource": {
+    test: /\.(bmp|gif|jpe?g|png|tiff|ico|avif|webp|eot|otf|ttf|woff|woff2)$/,
+  },
+};
+
+const customWebpackConfig = customizeWebpackDefaultRules(
+  webpackConfig,
+  defaultRules
+);
+
+module.exports = merge(customWebpackConfig, commonOptions);

package/configs/webpack/resolve.js

@@ -0,0 +1,47 @@
+const path = require("path");
+
+const absolutePath = basePath =>
+  path.resolve(__dirname, "../../../../../", `app/javascript/${basePath}`);
+
+module.exports = {
+  alias: {
+    apis: absolutePath("src/apis"),
+    assets: absolutePath("src/assets"),
+    components: absolutePath("src/components"),
+    hooks: absolutePath("src/hooks"),
+    reducers: absolutePath("src/reducers"),
+    routes: absolutePath("src/routes"),
+    stores: absolutePath("src/stores"),
+    translations: absolutePath("src/translations"),
+    utils: absolutePath("src/utils"),
+    src: absolutePath("src"),
+    neetoui: "@bigbinary/neetoui",
+    neetocommons: "@bigbinary/neeto-commons-frontend",
+    neetoicons: "@bigbinary/neeto-icons",
+    neetoteam: "@bigbinary/neeto-team-members-frontend",
+    neetoeditor: "@bigbinary/neeto-editor",
+    neetofilters: "@bigbinary/neeto-filters-frontend",
+    images: path.resolve(__dirname, "../../../../../", "app/assets/images"),
+  },
+  extensions: [
+    ".ts",
+    ".mjs",
+    ".js",
+    ".sass",
+    ".scss",
+    ".css",
+    ".module.sass",
+    ".module.scss",
+    ".module.css",
+    ".png",
+    ".svg",
+    ".gif",
+    ".jpeg",
+    ".jpg",
+  ],
+  fallback: {
+    util: require.resolve("util/"),
+    url: require.resolve("url/"),
+    fs: false,
+  },
+};

package/configs/webpack/rules.js

@@ -0,0 +1,43 @@
+module.exports = [
+  {
+    test: /\.svg$/i,
+    use: [
+      {
+        loader: "@svgr/webpack",
+        options: {
+          svgoConfig: { plugins: ["preset-default"] },
+        },
+      },
+    ],
+  },
+  {
+    test: /\.ts$/,
+    exclude: /node_modules/,
+    use: {
+      loader: "babel-loader",
+      options: {
+        presets: ["@babel/preset-env", "@babel/preset-typescript"],
+      },
+    },
+  },
+  {
+    test: /\.mp3$/,
+    use: [
+      "babel-loader",
+      {
+        loader: "file-loader",
+        options: {
+          query: {
+            name: "static/media/[name].[hash:8].[ext]",
+          },
+        },
+      },
+    ],
+  },
+  {
+    test: /\.m?js$/,
+    resolve: {
+      fullySpecified: false, // allows webpack to ignore some package rules as the Strict EcmaScript Module mode.
+    },
+  },
+];

package/initializers.cjs.js

@@ -980,6 +980,81 @@ function initializeGlobalProps() {
   deepFreezeObject(window.globalProps);
 }
 
+var generic = {
+	error: "Something went wrong. Please try again later."
+};
+var authentication = {
+	notLoggedIn: "Could not authenticate, please login to continue!",
+	couldNotAuth: "Could not authenticate with the provided %{parameter}.",
+	incorrectPassword: "Current password is incorrect. Please try again.",
+	incorrectEmailPassword: "Incorrect email or password. Please try again."
+};
+var authorization = {
+	unauthorized: "You are not authorized to perform this action."
+};
+var resource = {
+	add_one: "{{entity}} has been added successfully.",
+	add_other: "{{entity}} have been added successfully.",
+	save: "{{entity}} has been saved successfully.",
+	update: "{{entity}} has been updated successfully.",
+	delete_one: "{{entity}} has been deleted successfully.",
+	delete_other: "{{entity}} have been deleted successfully.",
+	clone: "{{entity}} has been cloned successfully.",
+	notFound: "{{entity}} does not exist.",
+	remove_one: "{{entity}} successfully removed",
+	remove_other: "{{entity}}s successfully removed",
+	sent: "{{entity}} sent successfully."
+};
+var otp = {
+	sent: "OTP has been sent successfully.",
+	invalid: "Invalid OTP",
+	verified: "OTP has been verified successfully."
+};
+var upload = {
+	error: "An error occured while uploading the file"
+};
+var image = {
+	profile: {
+		removalFailed: "Failed to remove profile picture",
+		removalSuccess: "Profile picture successfully removed"
+	},
+	contentTypeInvalid: "Other than jpg, png, svg are not supported",
+	sizeOutOfRange: "Should not be more than {{maxSize, number}} MB"
+};
+var userRole = {
+	deactivateActiveAdmin: "You cannot deactivate active admin from the organization!"
+};
+var activeRecord = {
+	error: {
+		blankName: "Name can't be blank",
+		blankDescription: "Description can't be blank",
+		blankValue: "Value can't be blank",
+		prefixType: "Prefix type {{value}} is not valid",
+		minimumEntryLimit: "Minimum entry limit must be less than or equal to {{maximumEntryLimit, number}}",
+		maximumEntryLimit: "Maximum entry limit must be greater than or equal to {{minimumEntryLimit, number}}"
+	}
+};
+var sessions = {
+	expiry: "Your session has expired. Please login again."
+};
+var payment = {
+	error: {
+		incomplete: "Your payment could not be completed"
+	}
+};
+var invitations = {
+	deleted_one: "Invitation has been deleted successfully",
+	deleted_other: "{{count, number}} Invitations have been deleted successfully",
+	sent_one: "Invitation has been sent successfully",
+	sent_other: "{{count, number}} Invitations have been sent successfully",
+	notFound: "{{email}} was not invited to test this website."
+};
+var github = {
+	error: {
+		webhookPermissionDenied: "Permission denied. Ensure you have permission to create webhooks for the repository.",
+		primaryNonDeletable: "Primary Github account cannot be deleted."
+	}
+};
 var neetoCommons = {
 	errorPage: {
 		cantBeFound: "The page you're looking for <br /> can't be found.",
@@ -1067,9 +1142,9 @@ var neetoCommons = {
 			},
 			body: {
 				values: {
-					embedCode: "<p>Hi,</p> <p>We are going to use {{selectedWidgets}}. Please find the code snippet for the installation of the {{selectedWidgets}} widget. You can find the documentation regarding this at <configureLink>{{neetoKbUrl}}</configureLink>.</p> <p>If you still need help then send an email to <mail>{{helpEmail}}</mail>.</p>",
-					userIdentity: "Hey there. This is the object structure that you can use to specify the user identity for neetoWidget. You can find the documentation at - {{userIdentityKbUrl}}.",
-					sessionContext: "Hey there. This is the object structure that you can use to specify the contextual values for neetoReplay sessions. You can find the documentation at - {{sessionContextKbUrl}}."
+					embedCode: "<p>Hi,</p> <p>We are going to use {{selectedWidgets}}.</p> <p>Please find the code snippet for the installation of the {{selectedWidgets}} widget.</p> <p>You can find the documentation regarding this at <configureLink>{{neetoKbUrl}}</configureLink>.</p> <p>If you still need help then send an email to <mail>{{helpEmail}}</mail>.</p>",
+					userIdentity: "<p>Hi,</p> <p>This is the object structure that you can use to specify the user identity for neetoWidget.</p> <p>You can find the documentation at <configureLink>{{userIdentityKbUrl}}</configureLink>.</p>",
+					sessionContext: "<p>Hi,</p> <p>This is the object structure that you can use to specify the contextual values for neetoReplay sessions.</p> <p>You can find the documentation at <configureLink>{{sessionContextKbUrl}}</configureLink>.</p>"
 				}
 			},
 			actions: {
@@ -1155,9 +1230,37 @@ var neetoCommons = {
 			buttonLabel: "Contact us"
 		},
 		unknownBrowserMsg: "an unknown browser"
+	},
+	ipRestriction: {
+		switchLabel: "Enable IP restriction",
+		description: "Restrict access to only trusted locations and networks by defining the range of allowed IP addresses",
+		allowedIpRangeTitle: "Allowed IP range",
+		ipStart: "IP start",
+		ipEnd: "IP end",
+		actions: "Actions",
+		allowedIpRangeConfirmation: "This can't be undone. Confirm deletion of IP range {{ipStart}} to {{ipEnd}}",
+		validations: {
+			invalidIp: "Invalid IPv4 address format",
+			ipEndGreaterThanIpStart: "IP end should be greater than or equal to IP start"
+		},
+		currentIpTitle: "Your current IP is",
+		currentIpDescription: "Your current IP will be added to the allowed IP range by default. You will not be able to save the IP settings without your current IP address on the list"
 	}
 };
 var en = {
+	generic: generic,
+	authentication: authentication,
+	authorization: authorization,
+	resource: resource,
+	otp: otp,
+	upload: upload,
+	image: image,
+	userRole: userRole,
+	activeRecord: activeRecord,
+	sessions: sessions,
+	payment: payment,
+	invitations: invitations,
+	github: github,
 	neetoCommons: neetoCommons
 };
 

package/initializers.js

@@ -968,6 +968,81 @@ function initializeGlobalProps() {
   deepFreezeObject(window.globalProps);
 }
 
+var generic = {
+	error: "Something went wrong. Please try again later."
+};
+var authentication = {
+	notLoggedIn: "Could not authenticate, please login to continue!",
+	couldNotAuth: "Could not authenticate with the provided %{parameter}.",
+	incorrectPassword: "Current password is incorrect. Please try again.",
+	incorrectEmailPassword: "Incorrect email or password. Please try again."
+};
+var authorization = {
+	unauthorized: "You are not authorized to perform this action."
+};
+var resource = {
+	add_one: "{{entity}} has been added successfully.",
+	add_other: "{{entity}} have been added successfully.",
+	save: "{{entity}} has been saved successfully.",
+	update: "{{entity}} has been updated successfully.",
+	delete_one: "{{entity}} has been deleted successfully.",
+	delete_other: "{{entity}} have been deleted successfully.",
+	clone: "{{entity}} has been cloned successfully.",
+	notFound: "{{entity}} does not exist.",
+	remove_one: "{{entity}} successfully removed",
+	remove_other: "{{entity}}s successfully removed",
+	sent: "{{entity}} sent successfully."
+};
+var otp = {
+	sent: "OTP has been sent successfully.",
+	invalid: "Invalid OTP",
+	verified: "OTP has been verified successfully."
+};
+var upload = {
+	error: "An error occured while uploading the file"
+};
+var image = {
+	profile: {
+		removalFailed: "Failed to remove profile picture",
+		removalSuccess: "Profile picture successfully removed"
+	},
+	contentTypeInvalid: "Other than jpg, png, svg are not supported",
+	sizeOutOfRange: "Should not be more than {{maxSize, number}} MB"
+};
+var userRole = {
+	deactivateActiveAdmin: "You cannot deactivate active admin from the organization!"
+};
+var activeRecord = {
+	error: {
+		blankName: "Name can't be blank",
+		blankDescription: "Description can't be blank",
+		blankValue: "Value can't be blank",
+		prefixType: "Prefix type {{value}} is not valid",
+		minimumEntryLimit: "Minimum entry limit must be less than or equal to {{maximumEntryLimit, number}}",
+		maximumEntryLimit: "Maximum entry limit must be greater than or equal to {{minimumEntryLimit, number}}"
+	}
+};
+var sessions = {
+	expiry: "Your session has expired. Please login again."
+};
+var payment = {
+	error: {
+		incomplete: "Your payment could not be completed"
+	}
+};
+var invitations = {
+	deleted_one: "Invitation has been deleted successfully",
+	deleted_other: "{{count, number}} Invitations have been deleted successfully",
+	sent_one: "Invitation has been sent successfully",
+	sent_other: "{{count, number}} Invitations have been sent successfully",
+	notFound: "{{email}} was not invited to test this website."
+};
+var github = {
+	error: {
+		webhookPermissionDenied: "Permission denied. Ensure you have permission to create webhooks for the repository.",
+		primaryNonDeletable: "Primary Github account cannot be deleted."
+	}
+};
 var neetoCommons = {
 	errorPage: {
 		cantBeFound: "The page you're looking for <br /> can't be found.",
@@ -1055,9 +1130,9 @@ var neetoCommons = {
 			},
 			body: {
 				values: {
-					embedCode: "<p>Hi,</p> <p>We are going to use {{selectedWidgets}}. Please find the code snippet for the installation of the {{selectedWidgets}} widget. You can find the documentation regarding this at <configureLink>{{neetoKbUrl}}</configureLink>.</p> <p>If you still need help then send an email to <mail>{{helpEmail}}</mail>.</p>",
-					userIdentity: "Hey there. This is the object structure that you can use to specify the user identity for neetoWidget. You can find the documentation at - {{userIdentityKbUrl}}.",
-					sessionContext: "Hey there. This is the object structure that you can use to specify the contextual values for neetoReplay sessions. You can find the documentation at - {{sessionContextKbUrl}}."
+					embedCode: "<p>Hi,</p> <p>We are going to use {{selectedWidgets}}.</p> <p>Please find the code snippet for the installation of the {{selectedWidgets}} widget.</p> <p>You can find the documentation regarding this at <configureLink>{{neetoKbUrl}}</configureLink>.</p> <p>If you still need help then send an email to <mail>{{helpEmail}}</mail>.</p>",
+					userIdentity: "<p>Hi,</p> <p>This is the object structure that you can use to specify the user identity for neetoWidget.</p> <p>You can find the documentation at <configureLink>{{userIdentityKbUrl}}</configureLink>.</p>",
+					sessionContext: "<p>Hi,</p> <p>This is the object structure that you can use to specify the contextual values for neetoReplay sessions.</p> <p>You can find the documentation at <configureLink>{{sessionContextKbUrl}}</configureLink>.</p>"
 				}
 			},
 			actions: {
@@ -1143,9 +1218,37 @@ var neetoCommons = {
 			buttonLabel: "Contact us"
 		},
 		unknownBrowserMsg: "an unknown browser"
+	},
+	ipRestriction: {
+		switchLabel: "Enable IP restriction",
+		description: "Restrict access to only trusted locations and networks by defining the range of allowed IP addresses",
+		allowedIpRangeTitle: "Allowed IP range",
+		ipStart: "IP start",
+		ipEnd: "IP end",
+		actions: "Actions",
+		allowedIpRangeConfirmation: "This can't be undone. Confirm deletion of IP range {{ipStart}} to {{ipEnd}}",
+		validations: {
+			invalidIp: "Invalid IPv4 address format",
+			ipEndGreaterThanIpStart: "IP end should be greater than or equal to IP start"
+		},
+		currentIpTitle: "Your current IP is",
+		currentIpDescription: "Your current IP will be added to the allowed IP range by default. You will not be able to save the IP settings without your current IP address on the list"
 	}
 };
 var en = {
+	generic: generic,
+	authentication: authentication,
+	authorization: authorization,
+	resource: resource,
+	otp: otp,
+	upload: upload,
+	image: image,
+	userRole: userRole,
+	activeRecord: activeRecord,
+	sessions: sessions,
+	payment: payment,
+	invitations: invitations,
+	github: github,
 	neetoCommons: neetoCommons
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bigbinary/neeto-commons-frontend",
-  "version": "2.0.24",
+  "version": "2.0.26",
   "description": "A package encapsulating common code across neeto projects including initializers, utility functions, common components and hooks and so on.",
   "repository": "git@github.com:bigbinary/neeto-commons-frontend.git",
   "author": "Amaljith K <amaljith.k@bigbinary.com>",
@@ -16,7 +16,8 @@
     "initializers.*",
     "react-utils.*",
     "utils.*",
-    "pure.*"
+    "pure.*",
+    "configs"
   ],
   "lint-staged": {
     "**/*.{js,jsx,json}": [
@@ -39,7 +40,8 @@
     "./initializers": {
       "import": "./initializers.js",
       "require": "./initializers.cjs.js"
-    }
+    },
+    "./configs/*": "./configs/*"
   },
   "devDependencies": {
     "@babel/eslint-parser": "^7.18.2",
@@ -47,7 +49,7 @@
     "@babel/preset-env": "^7.17.10",
     "@babel/preset-react": "^7.16.7",
     "@bigbinary/neeto-icons": "^1.8.35",
-    "@bigbinary/neetoui": "^4.1.1",
+    "@bigbinary/neetoui": "^4.1.33",
     "@honeybadger-io/react": "2.0.1",
     "@rollup/plugin-alias": "^3.1.9",
     "@rollup/plugin-babel": "^5.3.1",
@@ -60,9 +62,10 @@
     "@testing-library/react-hooks": "^8.0.0",
     "@testing-library/user-event": "13.5.0",
     "antd": "4.18.7",
-    "autoprefixer": "^10.4.7",
+    "autoprefixer": "^10.4.13",
     "axios": "^0.27.2",
     "babel-jest": "27.0.6",
+    "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "dayjs": "1.11.1",
     "eslint": "^8.15.0",
     "eslint-config-prettier": "^8.5.0",
@@ -78,6 +81,7 @@
     "formik": "^2.2.9",
     "husky": "^7.0.4",
     "i18next": "21.7.0",
+    "ip-num": "^1.5.0",
     "jest": "27.5.1",
     "js-logger": "^1.6.1",
     "lint-staged": "^12.3.7",
@@ -99,21 +103,26 @@
     "rollup-plugin-cleaner": "^1.0.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "yup": "^0.32.11",
-    "zustand": "^4.1.2",
-    "babel-plugin-transform-react-remove-prop-types": "^0.4.24"
+    "zustand": "^4.1.2"
   },
   "dependencies": {},
   "peerDependencies": {
     "@bigbinary/neeto-icons": "^1.8.35",
     "@bigbinary/neetoui": "^4.1.1",
     "@honeybadger-io/react": "2.0.1",
+    "@svgr/webpack": "^6.5.1",
     "antd": "4.18.7",
+    "autoprefixer": "^10.4.13",
     "axios": "^0.27.2",
     "dayjs": "1.11.1",
+    "dotenv-webpack": "^8.0.1",
     "formik": "^2.2.9",
     "i18next": "21.7.0",
     "js-logger": "^1.6.1",
     "mixpanel-browser": "^2.45.0",
+    "postcss-flexbugs-fixes": "^5.0.2",
+    "postcss-import": "^15.1.0",
+    "postcss-preset-env": "^7.8.3",
     "ramda": "^0.28.0",
     "react": "^17.0.2",
     "react-helmet": "^6.1.0",
@@ -121,6 +130,9 @@
     "react-query": "^3.39.2",
     "react-router-dom": "^5.2.0",
     "react-toastify": "^9.0.8",
+    "shakapacker": "^6.5.5",
+    "tailwindcss": "^3.2.4",
+    "webpack": "^5.75.0",
     "yup": "^0.32.11"
   }
 }