@reactuses/core 1.1.1 → 1.1.3

package/dist/index.cjs

@@ -2407,9 +2407,60 @@ function useCycleList(list, i = 0) {
   return [list[index], next, prev];
 }
 
+function useFocus(target, initialValue = false) {
+  const [focus, innerSetFocus] = react.useState(initialValue);
+  useEventListener("focus", () => innerSetFocus(true), target);
+  useEventListener("blur", () => innerSetFocus(false), target);
+  useMount(() => {
+    setFocus(focus);
+  });
+  const setFocus = (value) => {
+    const element = getTargetElement(target);
+    if (!element) {
+      return;
+    }
+    if (!value) {
+      element.blur();
+    } else if (value) {
+      element.focus();
+    }
+  };
+  return [focus, setFocus];
+}
+
+function useControlled({
+  controlled,
+  defaultValue: defaultProp,
+  state = "value"
+}) {
+  const { current: isControlled } = react.useRef(controlled !== void 0);
+  const [valueState, setValue] = react.useState(defaultProp);
+  const value = isControlled ? controlled : valueState;
+  react.useEffect(() => {
+    if (isControlled !== (controlled !== void 0)) {
+      console.error(
+        [
+          `A component is changing the ${isControlled ? "" : "un"}controlled ${state} state of ${name} to be ${isControlled ? "un" : ""}controlled.`,
+          "Elements should not switch from uncontrolled to controlled (or vice versa).",
+          `Decide between using a controlled or uncontrolled ${name} element for the lifetime of the component.`,
+          "The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.",
+          "More info: https://fb.me/react-controlled-components"
+        ].join("\n")
+      );
+    }
+  }, [state, controlled]);
+  const setValueIfUncontrolled = react.useCallback((newValue) => {
+    if (!isControlled) {
+      setValue(newValue);
+    }
+  }, []);
+  return [value, setValueIfUncontrolled];
+}
+
 exports.useActiveElement = useActiveElement;
 exports.useClickOutside = useClickOutSide;
 exports.useClipboard = useClipBorad;
+exports.useControlled = useControlled;
 exports.useCounter = useCounter;
 exports.useCustomCompareEffect = useCustomCompareEffect;
 exports.useCycleList = useCycleList;
@@ -2429,6 +2480,7 @@ exports.useEventListener = useEventListener;
 exports.useFavicon = useFavicon;
 exports.useFileDialog = useFileDialog;
 exports.useFirstMountState = useFirstMountState;
+exports.useFocus = useFocus;
 exports.useFps = useFps$1;
 exports.useFullscreen = useFullscreen;
 exports.useGeolocation = useGeolocation;

package/dist/index.d.ts

@@ -684,7 +684,7 @@ declare function useElementBounding(target: BasicTarget, options?: UseElementBou
     readonly update: () => void;
 };
 
-declare function useElementVisibility(target: BasicTarget<HTMLElement | SVGElement>, options?: IntersectionObserverInit): readonly [any, () => void];
+declare function useElementVisibility(target: BasicTarget<HTMLElement | SVGElement>, options?: IntersectionObserverInit): readonly [boolean, () => void];
 
 declare function useWindowsFocus(): boolean;
 
@@ -710,4 +710,13 @@ declare function useClickOutSide(target: BasicTarget, handler: (evt: EventType)
 
 declare function useCycleList<T>(list: T[], i?: number): readonly [T, (i?: number) => void, (i?: number) => void];
 
-export { useActiveElement, useClickOutSide as useClickOutside, useClipBorad as useClipboard, useCounter, useCustomCompareEffect, useCycleList, useDarkMode, useDebounce, useDebounceFn, useDeepCompareEffect, useDocumentVisibility, useDraggable, useDropZone, useElementBounding, useElementSize, useElementVisibility, useEvent, useEventEmitter, useEventListener, useFavicon, useFileDialog, useFirstMountState, _default as useFps, useFullscreen, useGeolocation, useIdle, useInfiniteScroll, useIntersectionObserver, useInterval, useIsomorphicLayoutEffect, useKeyModifier, useLatest, useLocalStorage, useLongPress, _default$1 as useMediaDevices, useMediaQuery, useMount, useMountedState, useMouse, useMousePressed, useMutationObserver, useNetwork, useObjectUrl, useOnline, useOrientation, usePageLeave, usePermission, usePreferredColorScheme, usePreferredContrast, usePreferredDark, usePrevious, useRafFn, useRafState, useResizeObserver, useScriptTag, useScroll, useScrollLock, useSessionStorage, useTextDirection, useThrottle, useThrottleFn, useTimeout, useTimeoutFn, useTitle, useToggle, useUnmount, useUpdate, _default$3 as useUpdateEffect, _default$2 as useUpdateLayoutEffect, useVirtualList, useWindowScroll, useWindowSize, useWindowsFocus };
+declare function useFocus(target: BasicTarget<HTMLElement | SVGElement>, initialValue?: boolean): readonly [boolean, (value: boolean) => void];
+
+interface IProps<T> {
+    controlled?: T;
+    defaultValue?: T;
+    state?: T;
+}
+declare function useControlled<T = string>({ controlled, defaultValue, state, }: IProps<T>): readonly [T, (newValue: T) => void];
+
+export { useActiveElement, useClickOutSide as useClickOutside, useClipBorad as useClipboard, useControlled, useCounter, useCustomCompareEffect, useCycleList, useDarkMode, useDebounce, useDebounceFn, useDeepCompareEffect, useDocumentVisibility, useDraggable, useDropZone, useElementBounding, useElementSize, useElementVisibility, useEvent, useEventEmitter, useEventListener, useFavicon, useFileDialog, useFirstMountState, useFocus, _default as useFps, useFullscreen, useGeolocation, useIdle, useInfiniteScroll, useIntersectionObserver, useInterval, useIsomorphicLayoutEffect, useKeyModifier, useLatest, useLocalStorage, useLongPress, _default$1 as useMediaDevices, useMediaQuery, useMount, useMountedState, useMouse, useMousePressed, useMutationObserver, useNetwork, useObjectUrl, useOnline, useOrientation, usePageLeave, usePermission, usePreferredColorScheme, usePreferredContrast, usePreferredDark, usePrevious, useRafFn, useRafState, useResizeObserver, useScriptTag, useScroll, useScrollLock, useSessionStorage, useTextDirection, useThrottle, useThrottleFn, useTimeout, useTimeoutFn, useTitle, useToggle, useUnmount, useUpdate, _default$3 as useUpdateEffect, _default$2 as useUpdateLayoutEffect, useVirtualList, useWindowScroll, useWindowSize, useWindowsFocus };

package/dist/index.mjs

@@ -2403,4 +2403,54 @@ function useCycleList(list, i = 0) {
   return [list[index], next, prev];
 }
 
-export { useActiveElement, useClickOutSide as useClickOutside, useClipBorad as useClipboard, useCounter, useCustomCompareEffect, useCycleList, useDarkMode, useDebounce, useDebounceFn, useDeepCompareEffect, useDocumentVisibility, useDraggable, useDropZone, useElementBounding, useElementSize, useElementVisibility, useEvent, useEventEmitter, useEventListener, useFavicon, useFileDialog, useFirstMountState, useFps$1 as useFps, useFullscreen, useGeolocation, useIdle, useInfiniteScroll, useIntersectionObserver, useInterval, useIsomorphicLayoutEffect, useKeyModifier, useLatest, useLocalStorage, useLongPress, useMediaDevices$1 as useMediaDevices, useMediaQuery, useMount, useMountedState, useMouse, useMousePressed, useMutationObserver, useNetwork, useObjectUrl, useOnline, useOrientation, usePageLeave, usePermission, usePreferredColorScheme, usePreferredContrast, usePreferredDark, usePrevious, useRafFn, useRafState, useResizeObserver, useScriptTag, useScroll, useScrollLock, useSessionStorage, useTextDirection, useThrottle, useThrottleFn, useTimeout, useTimeoutFn, useTitle, useToggle, useUnmount, useUpdate, useUpdateEffect, useUpdateLayoutEffect, useVirtualList, useWindowScroll, useWindowSize, useWindowsFocus };
+function useFocus(target, initialValue = false) {
+  const [focus, innerSetFocus] = useState(initialValue);
+  useEventListener("focus", () => innerSetFocus(true), target);
+  useEventListener("blur", () => innerSetFocus(false), target);
+  useMount(() => {
+    setFocus(focus);
+  });
+  const setFocus = (value) => {
+    const element = getTargetElement(target);
+    if (!element) {
+      return;
+    }
+    if (!value) {
+      element.blur();
+    } else if (value) {
+      element.focus();
+    }
+  };
+  return [focus, setFocus];
+}
+
+function useControlled({
+  controlled,
+  defaultValue: defaultProp,
+  state = "value"
+}) {
+  const { current: isControlled } = useRef(controlled !== void 0);
+  const [valueState, setValue] = useState(defaultProp);
+  const value = isControlled ? controlled : valueState;
+  useEffect(() => {
+    if (isControlled !== (controlled !== void 0)) {
+      console.error(
+        [
+          `A component is changing the ${isControlled ? "" : "un"}controlled ${state} state of ${name} to be ${isControlled ? "un" : ""}controlled.`,
+          "Elements should not switch from uncontrolled to controlled (or vice versa).",
+          `Decide between using a controlled or uncontrolled ${name} element for the lifetime of the component.`,
+          "The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.",
+          "More info: https://fb.me/react-controlled-components"
+        ].join("\n")
+      );
+    }
+  }, [state, controlled]);
+  const setValueIfUncontrolled = useCallback((newValue) => {
+    if (!isControlled) {
+      setValue(newValue);
+    }
+  }, []);
+  return [value, setValueIfUncontrolled];
+}
+
+export { useActiveElement, useClickOutSide as useClickOutside, useClipBorad as useClipboard, useControlled, useCounter, useCustomCompareEffect, useCycleList, useDarkMode, useDebounce, useDebounceFn, useDeepCompareEffect, useDocumentVisibility, useDraggable, useDropZone, useElementBounding, useElementSize, useElementVisibility, useEvent, useEventEmitter, useEventListener, useFavicon, useFileDialog, useFirstMountState, useFocus, useFps$1 as useFps, useFullscreen, useGeolocation, useIdle, useInfiniteScroll, useIntersectionObserver, useInterval, useIsomorphicLayoutEffect, useKeyModifier, useLatest, useLocalStorage, useLongPress, useMediaDevices$1 as useMediaDevices, useMediaQuery, useMount, useMountedState, useMouse, useMousePressed, useMutationObserver, useNetwork, useObjectUrl, useOnline, useOrientation, usePageLeave, usePermission, usePreferredColorScheme, usePreferredContrast, usePreferredDark, usePrevious, useRafFn, useRafState, useResizeObserver, useScriptTag, useScroll, useScrollLock, useSessionStorage, useTextDirection, useThrottle, useThrottleFn, useTimeout, useTimeoutFn, useTitle, useToggle, useUnmount, useUpdate, useUpdateEffect, useUpdateLayoutEffect, useVirtualList, useWindowScroll, useWindowSize, useWindowsFocus };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reactuses/core",
-  "version": "1.1.1",
+  "version": "1.1.3",
   "main": "./dist/index.cjs",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
@@ -25,6 +25,7 @@
     "lint": "eslint \"{hooks,tests}/**/*.{ts,tsx}\"",
     "build": "esno scripts/build.ts",
     "build:rollup": "cross-env NODE_OPTIONS=\"--max-old-space-size=6144\" rollup -c",
+    "dev": "cross-env NODE_OPTIONS=\"--max-old-space-size=6144\" rollup -c --watch",
     "publish:ci": "esno scripts/publish.ts",
     "release:prepare": "bump",
     "release": "esno scripts/release.ts",