react-simplikit 0.0.51 → 0.0.53

package/dist/utils/mergeRefs/index.d.cts

@@ -1,39 +1,3 @@
-import { RefObject, RefCallback } from 'react';
 
-/**
- * @description
- * This function takes multiple refs (RefObject or RefCallback) and returns a single ref that updates all provided refs.
- * It's useful when you need to pass multiple refs to a single element.
- *
- * @template T - The type of target to be referenced.
- *
- * @param {Array<RefObject<T> | RefCallback<T> | null | undefined>} refs - An array of refs to be merged. Each ref can be either a RefObject or RefCallback.
- *
- * @returns {RefCallback<T>} A single ref callback that updates all provided refs.
- *
- * @example
- * forwardRef(function Component(props, parentRef) {
- *   const myRef = useRef(null);
- *
- *   return <div ref={mergeRefs(myRef, parentRef)} />;
- * })
- *
- * @example
- * function Component(props) {
- *   const ref = useRef(null);
- *   const [height, setHeight] = useState(0);
- *
- *   const measuredRef = useCallback(node => {
- *     if(node == null) {
- *       return;
- *     }
- *
- *     setHeight(node.offsetHeight);
- *   }, []);
- *
- *   return <div ref={mergeRefs(measuredRef, ref)} />;
- * }
- */
-declare function mergeRefs<T>(...refs: Array<RefObject<T> | RefCallback<T> | null | undefined>): RefCallback<T>;
-
-export { mergeRefs };
+import { mergeRefs } from "./mergeRefs.cjs";
+export { mergeRefs };

package/dist/utils/mergeRefs/index.d.mts

@@ -0,0 +1,3 @@
+
+import { mergeRefs } from "./mergeRefs.mjs";
+export { mergeRefs };

package/dist/utils/mergeRefs/mergeRefs.cjs

@@ -0,0 +1,50 @@
+"use client";
+//#region src/utils/mergeRefs/mergeRefs.ts
+/**
+* @description
+* This function takes multiple refs (RefObject or RefCallback) and returns a single ref that updates all provided refs.
+* It's useful when you need to pass multiple refs to a single element.
+*
+* @template T - The type of target to be referenced.
+*
+* @param {Array<RefObject<T> | RefCallback<T> | null | undefined>} refs - An array of refs to be merged. Each ref can be either a RefObject or RefCallback.
+*
+* @returns {RefCallback<T>} A single ref callback that updates all provided refs.
+*
+* @example
+* forwardRef(function Component(props, parentRef) {
+*   const myRef = useRef(null);
+*
+*   return <div ref={mergeRefs(myRef, parentRef)} />;
+* })
+*
+* @example
+* function Component(props) {
+*   const ref = useRef(null);
+*   const [height, setHeight] = useState(0);
+*
+*   const measuredRef = useCallback(node => {
+*     if(node == null) {
+*       return;
+*     }
+*
+*     setHeight(node.offsetHeight);
+*   }, []);
+*
+*   return <div ref={mergeRefs(measuredRef, ref)} />;
+* }
+*/
+function mergeRefs(...refs) {
+	return (value) => {
+		for (const ref of refs) {
+			if (ref == null) continue;
+			if (typeof ref === "function") {
+				ref(value);
+				continue;
+			}
+			ref.current = value;
+		}
+	};
+}
+//#endregion
+exports.mergeRefs = mergeRefs;

package/{esm/utils/mergeRefs/index.d.ts → dist/utils/mergeRefs/mergeRefs.d.cts}

@@ -1,5 +1,6 @@
-import { RefObject, RefCallback } from 'react';
 
+import { RefCallback, RefObject } from "react";
+//#region src/utils/mergeRefs/mergeRefs.d.ts
 /**
  * @description
  * This function takes multiple refs (RefObject or RefCallback) and returns a single ref that updates all provided refs.
@@ -35,5 +36,5 @@ import { RefObject, RefCallback } from 'react';
  * }
  */
 declare function mergeRefs<T>(...refs: Array<RefObject<T> | RefCallback<T> | null | undefined>): RefCallback<T>;
-
-export { mergeRefs };
+//#endregion
+export { mergeRefs };

package/dist/utils/mergeRefs/mergeRefs.d.mts

@@ -0,0 +1,40 @@
+
+import { RefCallback, RefObject } from "react";
+//#region src/utils/mergeRefs/mergeRefs.d.ts
+/**
+ * @description
+ * This function takes multiple refs (RefObject or RefCallback) and returns a single ref that updates all provided refs.
+ * It's useful when you need to pass multiple refs to a single element.
+ *
+ * @template T - The type of target to be referenced.
+ *
+ * @param {Array<RefObject<T> | RefCallback<T> | null | undefined>} refs - An array of refs to be merged. Each ref can be either a RefObject or RefCallback.
+ *
+ * @returns {RefCallback<T>} A single ref callback that updates all provided refs.
+ *
+ * @example
+ * forwardRef(function Component(props, parentRef) {
+ *   const myRef = useRef(null);
+ *
+ *   return <div ref={mergeRefs(myRef, parentRef)} />;
+ * })
+ *
+ * @example
+ * function Component(props) {
+ *   const ref = useRef(null);
+ *   const [height, setHeight] = useState(0);
+ *
+ *   const measuredRef = useCallback(node => {
+ *     if(node == null) {
+ *       return;
+ *     }
+ *
+ *     setHeight(node.offsetHeight);
+ *   }, []);
+ *
+ *   return <div ref={mergeRefs(measuredRef, ref)} />;
+ * }
+ */
+declare function mergeRefs<T>(...refs: Array<RefObject<T> | RefCallback<T> | null | undefined>): RefCallback<T>;
+//#endregion
+export { mergeRefs };

package/dist/utils/mergeRefs/mergeRefs.mjs

@@ -0,0 +1,50 @@
+"use client";
+//#region src/utils/mergeRefs/mergeRefs.ts
+/**
+* @description
+* This function takes multiple refs (RefObject or RefCallback) and returns a single ref that updates all provided refs.
+* It's useful when you need to pass multiple refs to a single element.
+*
+* @template T - The type of target to be referenced.
+*
+* @param {Array<RefObject<T> | RefCallback<T> | null | undefined>} refs - An array of refs to be merged. Each ref can be either a RefObject or RefCallback.
+*
+* @returns {RefCallback<T>} A single ref callback that updates all provided refs.
+*
+* @example
+* forwardRef(function Component(props, parentRef) {
+*   const myRef = useRef(null);
+*
+*   return <div ref={mergeRefs(myRef, parentRef)} />;
+* })
+*
+* @example
+* function Component(props) {
+*   const ref = useRef(null);
+*   const [height, setHeight] = useState(0);
+*
+*   const measuredRef = useCallback(node => {
+*     if(node == null) {
+*       return;
+*     }
+*
+*     setHeight(node.offsetHeight);
+*   }, []);
+*
+*   return <div ref={mergeRefs(measuredRef, ref)} />;
+* }
+*/
+function mergeRefs(...refs) {
+	return (value) => {
+		for (const ref of refs) {
+			if (ref == null) continue;
+			if (typeof ref === "function") {
+				ref(value);
+				continue;
+			}
+			ref.current = value;
+		}
+	};
+}
+//#endregion
+export { mergeRefs };

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "react-simplikit",
-  "version": "0.0.51",
+  "version": "0.0.53",
   "main": "./dist/index.cjs",
-  "module": "./esm/index.js",
+  "module": "./dist/index.mjs",
   "types": "./dist/index.d.cts",
   "exports": {
     ".": {
       "import": {
-        "types": "./esm/index.d.ts",
-        "default": "./esm/index.js"
+        "types": "./dist/index.d.mts",
+        "default": "./dist/index.mjs"
       },
       "require": {
         "types": "./dist/index.d.cts",
@@ -31,12 +31,11 @@
   },
   "license": "MIT",
   "files": [
-    "dist/**/*",
-    "esm/**/*"
+    "dist/**/*"
   ],
   "scripts": {
-    "build": "tsup",
-    "clean": "rimraf ./dist ./esm",
+    "build": "tsdown",
+    "clean": "rimraf ./dist",
     "lint": "eslint src",
     "typecheck": "tsc --noEmit",
     "test": "vitest run",
@@ -54,7 +53,7 @@
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.1.0",
     "@trivago/prettier-plugin-sort-imports": "^5.2.0",
-    "@types/node": "^22.10.2",
+    "@types/node": "^24.13.3",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
     "@vitest/coverage-v8": "^2.1.8",
@@ -62,7 +61,6 @@
     "comment-parser": "^1.4.1",
     "corepack": "^0.30.0",
     "dotenv": "^16.4.7",
-    "esbuild": "^0.24.0",
     "eslint": "^9.16.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-import": "^2.31.0",
@@ -83,7 +81,7 @@
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "rimraf": "^6.0.1",
-    "tsup": "^8.3.5",
+    "tsdown": "^0.22.14",
     "tsx": "^4.19.2",
     "typescript": "^5.7.2",
     "typescript-eslint": "^8.18.0",

package/dist/components/ImpressionArea/index.cjs

@@ -1,295 +0,0 @@
-"use client";
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/components/ImpressionArea/index.ts
-var ImpressionArea_exports = {};
-__export(ImpressionArea_exports, {
-  ImpressionArea: () => ImpressionArea
-});
-module.exports = __toCommonJS(ImpressionArea_exports);
-
-// src/components/ImpressionArea/ImpressionArea.tsx
-var import_react7 = require("react");
-
-// src/hooks/useImpressionRef/useImpressionRef.ts
-var import_react6 = require("react");
-
-// src/hooks/useDebouncedCallback/useDebouncedCallback.ts
-var import_react2 = require("react");
-
-// src/hooks/useDebounce/debounce.ts
-function debounce(func, debounceMs, { edges = ["leading", "trailing"] } = {}) {
-  let pendingThis = void 0;
-  let pendingArgs = null;
-  const leading = edges != null && edges.includes("leading");
-  const trailing = edges == null || edges.includes("trailing");
-  const invoke = () => {
-    if (pendingArgs !== null) {
-      func.apply(pendingThis, pendingArgs);
-      pendingThis = void 0;
-      pendingArgs = null;
-    }
-  };
-  const onTimerEnd = () => {
-    if (trailing) {
-      invoke();
-    }
-    cancel();
-  };
-  let timeoutId = null;
-  const schedule = () => {
-    if (timeoutId != null) {
-      clearTimeout(timeoutId);
-    }
-    timeoutId = setTimeout(() => {
-      timeoutId = null;
-      onTimerEnd();
-    }, debounceMs);
-  };
-  const cancelTimer = () => {
-    if (timeoutId !== null) {
-      clearTimeout(timeoutId);
-      timeoutId = null;
-    }
-  };
-  const cancel = () => {
-    cancelTimer();
-    pendingThis = void 0;
-    pendingArgs = null;
-  };
-  const debounced = function(...args) {
-    pendingThis = this;
-    pendingArgs = args;
-    const isFirstCall = timeoutId == null;
-    schedule();
-    if (leading && isFirstCall) {
-      invoke();
-    }
-  };
-  debounced.cancel = cancel;
-  return debounced;
-}
-
-// src/hooks/usePreservedCallback/usePreservedCallback.ts
-var import_react = require("react");
-function usePreservedCallback(callback) {
-  const callbackRef = (0, import_react.useRef)(callback);
-  (0, import_react.useEffect)(
-    function syncCallbackRef() {
-      callbackRef.current = callback;
-    },
-    [callback]
-  );
-  return (0, import_react.useCallback)((...args) => {
-    return callbackRef.current(...args);
-  }, []);
-}
-
-// src/hooks/useDebouncedCallback/useDebouncedCallback.ts
-function useDebouncedCallback({
-  onChange,
-  timeThreshold,
-  leading = false,
-  trailing = true
-}) {
-  const handleChange = usePreservedCallback(onChange);
-  const ref = (0, import_react2.useRef)({ value: false, clearPreviousDebounce: () => {
-  } });
-  (0, import_react2.useEffect)(function clearDebouncedOnUnmount() {
-    const current = ref.current;
-    return () => {
-      current.clearPreviousDebounce();
-    };
-  }, []);
-  const edges = (0, import_react2.useMemo)(() => {
-    const _edges = [];
-    if (leading) {
-      _edges.push("leading");
-    }
-    if (trailing) {
-      _edges.push("trailing");
-    }
-    return _edges;
-  }, [leading, trailing]);
-  return (0, import_react2.useCallback)(
-    (nextValue) => {
-      if (nextValue === ref.current.value) {
-        return;
-      }
-      const debounced = debounce(
-        () => {
-          handleChange(nextValue);
-          ref.current.value = nextValue;
-        },
-        timeThreshold,
-        { edges }
-      );
-      ref.current.clearPreviousDebounce();
-      debounced();
-      ref.current.clearPreviousDebounce = debounced.cancel;
-    },
-    [handleChange, timeThreshold, edges]
-  );
-}
-
-// src/hooks/useIntersectionObserver/useIntersectionObserver.ts
-var import_react4 = require("react");
-
-// src/hooks/useRefEffect/useRefEffect.ts
-var import_react3 = require("react");
-function useRefEffect(callback, deps) {
-  const preservedCallback = usePreservedCallback(callback);
-  const cleanupCallbackRef = (0, import_react3.useRef)(() => {
-  });
-  const effect = (0, import_react3.useCallback)(
-    (element) => {
-      cleanupCallbackRef.current();
-      cleanupCallbackRef.current = () => {
-      };
-      if (element == null) {
-        return;
-      }
-      const cleanup = preservedCallback(element);
-      if (typeof cleanup === "function") {
-        cleanupCallbackRef.current = cleanup;
-      }
-    },
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [preservedCallback, ...deps]
-  );
-  return effect;
-}
-
-// src/hooks/useIntersectionObserver/useIntersectionObserver.ts
-function useIntersectionObserver(callback, options) {
-  const preservedCallback = usePreservedCallback(callback);
-  const observer = (0, import_react4.useMemo)(() => {
-    if (typeof IntersectionObserver === "undefined") {
-      return;
-    }
-    return new IntersectionObserver(([entry]) => {
-      preservedCallback(entry);
-    }, options);
-  }, [preservedCallback, options]);
-  return useRefEffect(
-    (element) => {
-      observer?.observe(element);
-      return () => {
-        observer?.unobserve(element);
-      };
-    },
-    [preservedCallback, options]
-  );
-}
-
-// src/hooks/useVisibilityEvent/useVisibilityEvent.ts
-var import_react5 = require("react");
-function useVisibilityEvent(callback, options = {}) {
-  const handleVisibilityChange = (0, import_react5.useCallback)(() => {
-    callback(document.visibilityState);
-  }, [callback]);
-  (0, import_react5.useEffect)(() => {
-    if (options?.immediate ?? false) {
-      handleVisibilityChange();
-    }
-    document.addEventListener("visibilitychange", handleVisibilityChange);
-    return () => {
-      document.removeEventListener("visibilitychange", handleVisibilityChange);
-    };
-  }, [handleVisibilityChange, options?.immediate]);
-}
-
-// src/hooks/useImpressionRef/useImpressionRef.ts
-function useImpressionRef({
-  onImpressionStart = () => {
-  },
-  onImpressionEnd = () => {
-  },
-  rootMargin,
-  areaThreshold = 0,
-  timeThreshold = 0
-}) {
-  const impressionStartHandler = usePreservedCallback(onImpressionStart);
-  const impressionEndHandler = usePreservedCallback(onImpressionEnd);
-  const isIntersectingRef = (0, import_react6.useRef)(false);
-  const impressionEventHandler = useDebouncedCallback({
-    timeThreshold,
-    onChange: (impressed) => {
-      (impressed ? impressionStartHandler : impressionEndHandler)();
-    },
-    leading: true
-  });
-  useVisibilityEvent((documentVisible) => {
-    if (!isIntersectingRef.current) {
-      return;
-    }
-    impressionEventHandler(documentVisible === "visible");
-  });
-  return useIntersectionObserver(
-    (entry) => {
-      if (document.visibilityState === "hidden") {
-        return;
-      }
-      const currentRatio = entry.intersectionRatio;
-      const isIntersecting = areaThreshold === 0 ? entry.isIntersecting : currentRatio >= areaThreshold;
-      isIntersectingRef.current = isIntersecting;
-      impressionEventHandler(isIntersecting);
-    },
-    { rootMargin, threshold: areaThreshold }
-  );
-}
-
-// src/utils/mergeRefs/mergeRefs.ts
-function mergeRefs(...refs) {
-  return (value) => {
-    for (const ref of refs) {
-      if (ref == null) {
-        continue;
-      }
-      if (typeof ref === "function") {
-        ref(value);
-        continue;
-      }
-      ref.current = value;
-    }
-  };
-}
-
-// src/components/ImpressionArea/ImpressionArea.tsx
-var import_jsx_runtime = require("react/jsx-runtime");
-var ImpressionArea = (0, import_react7.forwardRef)(ImpressionAreaImpl);
-function ImpressionAreaImpl({ as, rootMargin, areaThreshold, timeThreshold, onImpressionStart, onImpressionEnd, ...props }, ref) {
-  const Component = as ?? "div";
-  const impressionRef = useImpressionRef({
-    onImpressionStart,
-    onImpressionEnd,
-    areaThreshold,
-    timeThreshold,
-    rootMargin
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, { ref: mergeRefs(ref, impressionRef), ...props });
-}
-Object.assign(ImpressionArea, {
-  displayName: "ImpressionArea"
-});
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  ImpressionArea
-});

package/dist/components/Separated/index.cjs

@@ -1,41 +0,0 @@
-"use client";
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/components/Separated/index.ts
-var Separated_exports = {};
-__export(Separated_exports, {
-  Separated: () => Separated
-});
-module.exports = __toCommonJS(Separated_exports);
-
-// src/components/Separated/Separated.tsx
-var import_react = require("react");
-var import_jsx_runtime = require("react/jsx-runtime");
-function Separated({ children, by: separator }) {
-  const childrenArray = import_react.Children.toArray(children).filter(import_react.isValidElement);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: childrenArray.map((child, i, { length }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react.Fragment, { children: [
-    child,
-    i + 1 !== length && separator
-  ] }, child.key ?? i)) });
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  Separated
-});

package/dist/components/SwitchCase/index.cjs

@@ -1,36 +0,0 @@
-"use client";
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/components/SwitchCase/index.ts
-var SwitchCase_exports = {};
-__export(SwitchCase_exports, {
-  SwitchCase: () => SwitchCase
-});
-module.exports = __toCommonJS(SwitchCase_exports);
-
-// src/components/SwitchCase/SwitchCase.tsx
-function SwitchCase({ value, caseBy, defaultComponent = () => null }) {
-  const stringifiedValue = String(value);
-  return (caseBy[stringifiedValue] ?? defaultComponent)();
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  SwitchCase
-});

package/dist/hooks/useAsyncEffect/index.cjs

@@ -1,49 +0,0 @@
-"use client";
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/hooks/useAsyncEffect/index.ts
-var useAsyncEffect_exports = {};
-__export(useAsyncEffect_exports, {
-  useAsyncEffect: () => useAsyncEffect
-});
-module.exports = __toCommonJS(useAsyncEffect_exports);
-
-// src/hooks/useAsyncEffect/useAsyncEffect.ts
-var import_react = require("react");
-function useAsyncEffect(effect, deps) {
-  (0, import_react.useEffect)(() => {
-    let cleanup;
-    let isCleaned = false;
-    effect().then((result) => {
-      cleanup = result;
-      if (isCleaned) {
-        cleanup?.();
-      }
-    });
-    return () => {
-      isCleaned = true;
-      cleanup?.();
-    };
-  }, deps);
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  useAsyncEffect
-});