v1.0.6

Author: minimal-ui-kit

packages/minimal-shared/CHANGELOG.md

@@ -1,5 +1,17 @@
 # minimal-shared
 
+## 1.0.6
+
+_Feb 23, 2025_
+
+- Update `hooks/use-scroll-offset-top`.
+- Update `hooks/use-client-rect`.
+- Update `hooks/use-popover-hover`.
+- Update `utils/refs`.
+- Clean devDependencies
+
+---
+
 ## 1.0.5
 
 _Jan 1, 2025_

packages/minimal-shared/knip.jsonc

@@ -0,0 +1,17 @@
+{
+  "$schema": "https://unpkg.com/knip@5/schema-jsonc.json",
+  "paths": {
+    "src/*": ["./src/*"],
+  },
+  "project": ["src/**/*.{js,cjs,mjs,jsx,ts,cts,mts,tsx}"],
+  "ignoreExportsUsedInFile": true,
+  "ignoreDependencies": [
+    // ignore dependencies
+    "chalk",
+    "es-toolkit",
+    "internal-eslint-config",
+  ],
+  "ignore": [
+    // ignore folders or files
+  ],
+}

packages/minimal-shared/package.json

@@ -1,7 +1,7 @@
 {
   "name": "minimal-shared",
   "author": "Minimals",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "Shared hooks and utils used by Minimal UI and Zone UI.",
   "keywords": [
     "typescript",
@@ -60,31 +60,27 @@
     "test:watch": "vitest",
     "lint": "eslint \"**/*.{js,jsx,ts,tsx}\"",
     "lint:fix": "eslint --fix \"**/*.{js,jsx,ts,tsx}\"",
-    "lint:print": "npx eslint --print-config eslint.config.mjs > eslint-current-config.json",
+    "lint:print": "npx eslint --print-config eslint.config.mjs > eslint-show-config.json",
     "clean": "rm -rf node_modules .turbo .next out dist build",
     "re:build": "pnpm clean && pnpm install && pnpm test && pnpm build",
     "tsc:print": "npx tsc --showConfig"
   },
   "dependencies": {
-    "es-toolkit": "^1.31.0"
+    "es-toolkit": "^1.32.0"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.6.3",
-    "@testing-library/react": "^16.1.0",
-    "@types/fs-extra": "^11.0.4",
-    "@types/node": "^22.10.3",
-    "@types/react": "18.3.12",
+    "@testing-library/react": "^16.2.0",
+    "@types/node": "^22.13.5",
+    "@types/react": "19.0.10",
     "chalk": "^5.4.1",
-    "fast-glob": "^3.3.2",
-    "fs-extra": "^11.2.0",
-    "glob": "^11.0.0",
     "internal-eslint-config": "workspace:*",
     "internal-ts-config": "workspace:*",
-    "jsdom": "^25.0.1",
-    "react": "^18.3.1",
-    "tsup": "^8.3.5",
-    "typescript": "^5.7.2",
-    "vitest": "^2.1.8"
+    "jsdom": "^26.0.0",
+    "react": "^19.0.0",
+    "tsup": "^8.3.6",
+    "typescript": "^5.7.3",
+    "vitest": "^3.0.6"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0"

packages/minimal-shared/src/hooks/use-client-rect/use-client-rect.ts

@@ -7,7 +7,7 @@ import { useRef, useMemo, useState, useEffect, useCallback, useLayoutEffect } fr
 /**
  * Custom hook to get the bounding client rect and scroll dimensions of a DOM element.
  *
- * @param {RefObject<HTMLDivElement>} [inputRef] - Optional ref object to the target element.
+ * @param {RefObject<T | null>} [inputRef] - Optional ref object to the target element.
  * @param {string} [eventType] - Optional event type to trigger updates (e.g., 'scroll', 'resize').
  * @returns {UseClientRectReturn} - Object containing the bounding rect, scroll dimensions, and ref to the element.
  */
@@ -28,17 +28,17 @@ type DOMRectValue = {
   height: number;
 };
 
-export type UseClientRectReturn = DOMRectValue &
+export type UseClientRectReturn<T> = DOMRectValue &
   ScrollElValue & {
-    elementRef: RefObject<HTMLDivElement>;
+    elementRef: RefObject<T | null>;
   };
 
-export function useClientRect(
-  inputRef?: RefObject<HTMLDivElement>,
+export function useClientRect<T extends HTMLElement>(
+  inputRef?: RefObject<T | null>,
   eventType?: string
-): UseClientRectReturn {
-  const initialRef = useRef<HTMLDivElement>(null);
-  const elementRef = inputRef || initialRef;
+): UseClientRectReturn<T> {
+  const localRef = useRef<T>(null);
+  const elementRef = inputRef || localRef;
 
   const [rect, setRect] = useState<DOMRect | undefined>(undefined);
   const [scroll, setScroll] = useState<ScrollElValue | undefined>(undefined);

packages/minimal-shared/src/hooks/use-popover-hover/use-popover-hover.ts

@@ -35,18 +35,18 @@ import { useRef, useState, useCallback } from 'react';
 
 type UsePopoverHoverReturn<T> = {
   open: boolean;
-  onOpen: () => void;
   anchorEl: T | null;
+  onOpen: () => void;
   onClose: () => void;
-  elementRef: RefObject<T>;
+  elementRef: RefObject<T | null>;
   setOpen: Dispatch<SetStateAction<boolean>>;
 };
 
 export function usePopoverHover<T extends HTMLElement>(
   inputRef?: RefObject<T>
 ): UsePopoverHoverReturn<T> {
-  const initialRef = useRef<T | null>(null);
-  const elementRef = inputRef || initialRef;
+  const localRef = useRef<T>(null);
+  const elementRef = inputRef || localRef;
 
   const [open, setOpen] = useState<boolean>(false);
 

packages/minimal-shared/src/hooks/use-scroll-offset-top/use-scroll-offset-top.test.ts

@@ -1,5 +1,3 @@
-import type { MutableRefObject } from 'react';
-
 import { act, renderHook } from '@testing-library/react';
 
 import { useScrollOffsetTop } from './use-scroll-offset-top';
@@ -28,12 +26,12 @@ describe('useScrollOffsetTop()', () => {
   };
 
   it(`1. Should return offsetTop as ${highlightText.val('false')} when window.scrollY is less than default value`, () => {
-    const { result } = renderHook(() => useScrollOffsetTop<HTMLDivElement>(defaultOffset));
+    const { result } = renderHook(() => useScrollOffsetTop(defaultOffset));
     expect(result.current.offsetTop).toBe(false);
   });
 
   it(`2. Should update offsetTop to ${highlightText.val('true')} when scroll position is greater than default value`, () => {
-    const { result } = renderHook(() => useScrollOffsetTop<HTMLDivElement>(defaultOffset));
+    const { result } = renderHook(() => useScrollOffsetTop(defaultOffset));
     setScrollY(defaultOffset + 10);
     expect(result.current.offsetTop).toBe(true);
   });
@@ -45,10 +43,10 @@ describe('useScrollOffsetTop()', () => {
 
     Object.defineProperty(mockElement, 'offsetTop', { value: elementOffsetTop, writable: false });
 
-    const { result } = renderHook(() => useScrollOffsetTop<HTMLDivElement>(0));
+    const { result } = renderHook(() => useScrollOffsetTop(0));
 
     act(() => {
-      (result.current.elementRef as MutableRefObject<HTMLDivElement>).current = mockElement;
+      result.current.elementRef.current = mockElement;
     });
 
     setScrollY(elementOffsetTop - 1);
@@ -59,7 +57,7 @@ describe('useScrollOffsetTop()', () => {
   });
 
   it(`4. Should update offsetTop to ${highlightText.val('false')} when scroll position is less than default value`, () => {
-    const { result } = renderHook(() => useScrollOffsetTop<HTMLDivElement>(defaultOffset));
+    const { result } = renderHook(() => useScrollOffsetTop(defaultOffset));
     setScrollY(defaultOffset - 1);
     expect(result.current.offsetTop).toBe(false);
   });

packages/minimal-shared/src/hooks/use-scroll-offset-top/use-scroll-offset-top.ts

@@ -26,13 +26,13 @@ import { useRef, useState, useEffect, useCallback } from 'react';
 
 export type UseScrollOffsetTopReturn<T> = {
   offsetTop: boolean;
-  elementRef: RefObject<T>;
+  elementRef: RefObject<T | null>;
 };
 
 export function useScrollOffsetTop<T extends HTMLElement>(
   defaultValue: number = 0
 ): UseScrollOffsetTopReturn<T> {
-  const elementRef = useRef<T | null>(null);
+  const elementRef = useRef<T>(null);
 
   const [offsetTop, setOffsetTop] = useState<boolean>(false);
 

packages/minimal-shared/src/utils/refs/refs.ts

@@ -15,7 +15,7 @@ export function mergeRefs<T>(refs: (React.Ref<T> | undefined | null)[]): React.R
       }
       // Handle object refs with 'current' property
       else if ('current' in ref) {
-        (ref as React.MutableRefObject<T | null>).current = value;
+        (ref as React.RefObject<T | null>).current = value;
       }
     }
   };