@geee-be/react-utils 1.1.9 → 1.2.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @geee-be/react-utils
 
+## 1.2.0
+
+### Minor Changes
+
+- ad3b011: Update packages
+
+## 1.1.10
+
+### Patch Changes
+
+- 3ad787e: feat: add Monitor
+
 ## 1.1.9
 
 ### Patch Changes

package/dist/helpers/index.js

@@ -1,3 +1,4 @@
 export { ClientOnly } from './client-only.js';
+export { Monitor } from './monitor.js';
 export * from './ripple.js';
 export * from './sub-component.js';

package/dist/helpers/monitor.js

@@ -0,0 +1,13 @@
+'use client';
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { useRenderCount } from '@uidotdev/usehooks';
+import { useEffect } from 'react';
+export const Monitor = ({ children, label }) => {
+    useEffect(() => {
+        console.log(label, 'mounted');
+        return () => console.log(label, 'unmounted');
+    }, [label]);
+    const count = useRenderCount();
+    console.log(label, 'rendered', count);
+    return _jsx(_Fragment, { children: children });
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@geee-be/react-utils",
-  "version": "1.1.9",
+  "version": "1.2.0",
   "description": "",
   "keywords": [],
   "license": "MIT",
@@ -9,25 +9,28 @@
   "main": "dist/index.js",
   "types": "src/index.ts",
   "devDependencies": {
-    "@storybook/addon-essentials": "^7.6.7",
-    "@storybook/addon-interactions": "^7.6.7",
-    "@storybook/addon-links": "^7.6.7",
-    "@storybook/addon-onboarding": "^1.0.10",
-    "@storybook/blocks": "^7.6.7",
-    "@storybook/react": "^7.6.7",
-    "@storybook/react-vite": "^7.6.7",
-    "@storybook/test": "^7.6.7",
-    "@types/react": "^18.2.0",
-    "@types/react-dom": "^18.2.0",
+    "@storybook/addon-essentials": "^7.6.20",
+    "@storybook/addon-interactions": "^7.6.20",
+    "@storybook/addon-links": "^7.6.20",
+    "@storybook/addon-onboarding": "^1.0.11",
+    "@storybook/blocks": "^7.6.20",
+    "@storybook/react": "^7.6.20",
+    "@storybook/react-vite": "^7.6.20",
+    "@storybook/test": "^7.6.20",
+    "@types/react": "^18.3.12",
+    "@types/react-dom": "^18.3.1",
     "prop-types": "^15.8.1",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "storybook": "^7.6.7"
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "storybook": "^7.6.20"
   },
   "peerDependencies": {
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0"
   },
+  "dependencies": {
+    "@uidotdev/usehooks": "^2.4.1"
+  },
   "scripts": {
     "prebuild": "rimraf dist/*",
     "build": "tsc",

package/src/helpers/index.ts

@@ -1,3 +1,4 @@
 export { ClientOnly } from './client-only.js';
+export { Monitor } from './monitor.js';
 export * from './ripple.js';
 export * from './sub-component.js';

package/src/helpers/monitor.tsx

@@ -0,0 +1,18 @@
+'use client';
+
+import { useRenderCount } from '@uidotdev/usehooks';
+import { useEffect, type FC, type PropsWithChildren } from 'react';
+
+type Props = PropsWithChildren<{ label: string }>;
+
+export const Monitor: FC<Props> = ({ children, label }) => {
+  useEffect(() => {
+    console.log(label, 'mounted');
+    return () => console.log(label, 'unmounted');
+  }, [label]);
+
+  const count = useRenderCount();
+  console.log(label, 'rendered', count);
+
+  return <>{children}</>;
+};