[UPDATED] build to exclude test files

Author: Hardik_B

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dx-kit/react-conditional-match",
-  "version": "2.2.2",
+  "version": "2.2.3",
   "description": "A flexible and reusable React component for conditionally rendering child elements. The component supports options for handling multiple matching children and custom fallbacks, and is lightweight and easy to use. This component can help simplify complex rendering logic in your React application and remove the need for ternary statements and if else blocks.",
   "main": "./dist/index.esm.js",
   "module": "./dist/index.cjs.js",
@@ -47,10 +47,10 @@
     "README.md"
   ],
   "dependencies": {
-    "@types/react": "^18.0.28",
-    "@types/react-dom": "^18.0.11",
     "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react-dom": "^18.2.0",
+    "@types/react": "^18.0.28",
+    "@types/react-dom": "^18.0.11"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^5.16.5",

src/components/ConditionalMatch/ConditionalMatch.tsx

@@ -1,21 +1,21 @@
-import { Children, Fragment, ReactNode, useMemo } from "react";
+import React from "react";
 
 import { Render } from "./components/Render";
 
 export interface ConditionalMatchProps {
   /** The fallback element to render if no children match the condition */
-  fallback: ReactNode;
+  fallback: React.ReactNode;
   /** The children to search for a matching condition */
   children?: JSX.Element | JSX.Element[] | null;
   /**  Whether to render all matching children (if true) or only the first matching child (if false) */
   multiMatch?: boolean;
 }
 
 const ConditionalMatch = ({ fallback, children = null, multiMatch = false }: ConditionalMatchProps): JSX.Element => {
-  const matchedChildren = useMemo(() => {
+  const matchedChildren = React.useMemo(() => {
     const childrenToRender: JSX.Element[] = [];
 
-    Children.forEach(children, (child) => {
+    React.Children.forEach(children, (child) => {
       if (child?.type !== Render) {
         return;
       }
@@ -33,10 +33,10 @@ const ConditionalMatch = ({ fallback, children = null, multiMatch = false }: Con
   }, [children, multiMatch]);
 
   if (matchedChildren?.length) {
-    return <Fragment>{matchedChildren}</Fragment>;
+    return <React.Fragment>{matchedChildren}</React.Fragment>;
   }
 
-  return <Fragment>{fallback}</Fragment>;
+  return <React.Fragment>{fallback}</React.Fragment>;
 };
 
 const ConditionalMatchCompound = Object.assign(ConditionalMatch, {

src/components/ConditionalMatch/components/Render.tsx

@@ -1,18 +1,18 @@
-import { Fragment, ReactNode } from "react";
+import React from "react";
 
 type RenderProps<T> = {
   /** The condition to determine whether to render the children */
   when: T | undefined | null | boolean;
   /** The children to render if the condition is true */
-  children: ReactNode;
+  children: React.ReactNode;
 };
 
 function Render<T>({ children, when }: RenderProps<T>): JSX.Element | null {
   if (!when) {
     return null;
   }
 
-  return <Fragment>{children}</Fragment>;
+  return <React.Fragment>{children}</React.Fragment>;
 }
 
 export { Render };

tsconfig.json

@@ -1,6 +1,6 @@
 {
   "include": ["src"],
-  "exclude": ["dist", "node_modules", "build.js"],
+  "exclude": ["dist", "node_modules", "build.js", "src/**/*.test.{js,ts,jsx,tsx}"],
   "compilerOptions": {
     "module": "esnext",
     "lib": ["dom", "esnext"],