Skip to content

feat(useDebouncedCallback,useThrottledCallback): accept any value type - #446

Merged
hyesungoh merged 1 commit into
mainfrom
docs/boolean-callback-examples
Aug 27, 2026
Merged

feat(useDebouncedCallback,useThrottledCallback): accept any value type#446
hyesungoh merged 1 commit into
mainfrom
docs/boolean-callback-examples

Conversation

@hyesungoh

@hyesungoh hyesungoh commented Aug 27, 2026

Copy link
Copy Markdown
Member

What

useDebouncedCallback and useThrottledCallback were typed to accept only a boolean (onChange: (newValue: boolean) => void), while their own examples passed a string and a number. Nothing in the implementation depends on the value being a boolean — the hooks debounce or throttle a setter and skip a value equal to the last one forwarded — so the type is now generic: onChange: (newValue: T) => void.

  • Both hooks take a type parameter T, inferred from onChange. Boolean callers are unchanged.
  • useDebouncedCallback no longer drops a first call of false. It seeded its "last forwarded value" with false, so the very first false looked redundant; it now starts from a sentinel, as fix(useThrottledCallback): invoke the callback when the first value is false #404 did for useThrottledCallback. A false that arrives while an initial true is still pending now replaces it — the settled value wins, which is what a debounced setter is expected to do.
  • useImpressionRef (the internal consumer) relied on that swallowed false to avoid emitting onImpressionEnd for an element that was never impressed. It now tracks whether an impression started and only emits an end after a start.
  • Tests: a string through useDebouncedCallback, a number through useThrottledCallback, and the first-false case. The existing debounce test that encoded the old seed behaviour is updated.
  • Docs regenerated. The examples are now a debounced search input and a throttled scroll position, and both type-check. The Korean page for useThrottledCallback described a signature the hook never had (useThrottledCallback(fn, 300)) and is rewritten.
  • The skill's "common needs" table lists both hooks again; they were removed in feat(plugin): generate the react-simplikit skill and replace the react-design-philosophy plugin #441 because of this issue.
  • Changeset: minor.

This continues #267 by @wo-o29, which proposed the same generic type for useDebouncedCallback. That branch predates the packages/corepackages/react-simplikit move and could not be rebased, so the change is re-applied here with the sentinel from #404 instead of a null seed and extended to useThrottledCallback. Credited as co-author on the commit.

@github-actions

github-actions Bot commented Aug 27, 2026

Copy link
Copy Markdown
Contributor

Size Change: +892 B (+0.93%)

Total Size: 97.2 kB

📦 View Changed
Filename Size Change
packages/react-simplikit/dist/hooks/useDebouncedCallback/useDebouncedCallback.cjs 1.36 kB +315 B (+30.09%) 🚨
packages/react-simplikit/dist/hooks/useDebouncedCallback/useDebouncedCallback.mjs 1.34 kB +308 B (+29.9%) 🚨
packages/react-simplikit/dist/hooks/useImpressionRef/useImpressionRef.cjs 1.12 kB +28 B (+2.57%)
packages/react-simplikit/dist/hooks/useImpressionRef/useImpressionRef.mjs 1.08 kB +29 B (+2.76%)
packages/react-simplikit/dist/hooks/useThrottledCallback/useThrottledCallback.cjs 1.22 kB +110 B (+9.94%) ⚠️
packages/react-simplikit/dist/hooks/useThrottledCallback/useThrottledCallback.mjs 1.19 kB +102 B (+9.4%) 🔍
ℹ️ View Unchanged
Filename Size
packages/react-simplikit/dist/components/ImpressionArea/ImpressionArea.cjs 1.01 kB
packages/react-simplikit/dist/components/ImpressionArea/ImpressionArea.mjs 984 B
packages/react-simplikit/dist/components/Separated/Separated.cjs 686 B
packages/react-simplikit/dist/components/Separated/Separated.mjs 684 B
packages/react-simplikit/dist/components/SwitchCase/SwitchCase.cjs 701 B
packages/react-simplikit/dist/components/SwitchCase/SwitchCase.mjs 699 B
packages/react-simplikit/dist/hooks/useAsyncEffect/useAsyncEffect.cjs 626 B
packages/react-simplikit/dist/hooks/useAsyncEffect/useAsyncEffect.mjs 615 B
packages/react-simplikit/dist/hooks/useBooleanState/useBooleanState.cjs 539 B
packages/react-simplikit/dist/hooks/useBooleanState/useBooleanState.mjs 529 B
packages/react-simplikit/dist/hooks/useCallbackOncePerRender/useCallbackOncePerRender.cjs 790 B
packages/react-simplikit/dist/hooks/useCallbackOncePerRender/useCallbackOncePerRender.mjs 762 B
packages/react-simplikit/dist/hooks/useConditionalEffect/useConditionalEffect.cjs 955 B
packages/react-simplikit/dist/hooks/useConditionalEffect/useConditionalEffect.mjs 934 B
packages/react-simplikit/dist/hooks/useControlledState/useControlledState.cjs 865 B
packages/react-simplikit/dist/hooks/useControlledState/useControlledState.mjs 855 B
packages/react-simplikit/dist/hooks/useCounter/useCounter.cjs 1.03 kB
packages/react-simplikit/dist/hooks/useCounter/useCounter.mjs 1.01 kB
packages/react-simplikit/dist/hooks/useDebounce/debounce.cjs 458 B
packages/react-simplikit/dist/hooks/useDebounce/debounce.mjs 456 B
packages/react-simplikit/dist/hooks/useDebounce/useDebounce.cjs 974 B
packages/react-simplikit/dist/hooks/useDebounce/useDebounce.mjs 953 B
packages/react-simplikit/dist/hooks/useDoubleClick/useDoubleClick.cjs 965 B
packages/react-simplikit/dist/hooks/useDoubleClick/useDoubleClick.mjs 950 B
packages/react-simplikit/dist/hooks/useGeolocation/useGeolocation.cjs 2.02 kB
packages/react-simplikit/dist/hooks/useGeolocation/useGeolocation.mjs 2.02 kB
packages/react-simplikit/dist/hooks/useInputState/useInputState.cjs 663 B
packages/react-simplikit/dist/hooks/useInputState/useInputState.mjs 654 B
packages/react-simplikit/dist/hooks/useIntersectionObserver/useIntersectionObserver.cjs 967 B
packages/react-simplikit/dist/hooks/useIntersectionObserver/useIntersectionObserver.mjs 939 B
packages/react-simplikit/dist/hooks/useInterval/useInterval.cjs 837 B
packages/react-simplikit/dist/hooks/useInterval/useInterval.mjs 811 B
packages/react-simplikit/dist/hooks/useIsClient/useIsClient.cjs 585 B
packages/react-simplikit/dist/hooks/useIsClient/useIsClient.mjs 574 B
packages/react-simplikit/dist/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.cjs 577 B
packages/react-simplikit/dist/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.mjs 575 B
packages/react-simplikit/dist/hooks/useList/useList.cjs 850 B
packages/react-simplikit/dist/hooks/useList/useList.mjs 825 B
packages/react-simplikit/dist/hooks/useLoading/useLoading.cjs 919 B
packages/react-simplikit/dist/hooks/useLoading/useLoading.mjs 909 B
packages/react-simplikit/dist/hooks/useLongPress/useLongPress.cjs 1.68 kB
packages/react-simplikit/dist/hooks/useLongPress/useLongPress.mjs 1.64 kB
packages/react-simplikit/dist/hooks/useMap/useMap.cjs 730 B
packages/react-simplikit/dist/hooks/useMap/useMap.mjs 713 B
packages/react-simplikit/dist/hooks/useOutsideClickEffect/useOutsideClickEffect.cjs 789 B
packages/react-simplikit/dist/hooks/useOutsideClickEffect/useOutsideClickEffect.mjs 758 B
packages/react-simplikit/dist/hooks/usePreservedCallback/usePreservedCallback.cjs 691 B
packages/react-simplikit/dist/hooks/usePreservedCallback/usePreservedCallback.mjs 675 B
packages/react-simplikit/dist/hooks/usePreservedReference/usePreservedReference.cjs 805 B
packages/react-simplikit/dist/hooks/usePreservedReference/usePreservedReference.mjs 789 B
packages/react-simplikit/dist/hooks/usePrevious/usePrevious.cjs 643 B
packages/react-simplikit/dist/hooks/usePrevious/usePrevious.mjs 635 B
packages/react-simplikit/dist/hooks/useRefEffect/useRefEffect.cjs 780 B
packages/react-simplikit/dist/hooks/useRefEffect/useRefEffect.mjs 753 B
packages/react-simplikit/dist/hooks/useSet/useSet.cjs 822 B
packages/react-simplikit/dist/hooks/useSet/useSet.mjs 791 B
packages/react-simplikit/dist/hooks/useStorageState/storage.cjs 543 B
packages/react-simplikit/dist/hooks/useStorageState/storage.mjs 527 B
packages/react-simplikit/dist/hooks/useStorageState/useStorageState.cjs 966 B
packages/react-simplikit/dist/hooks/useStorageState/useStorageState.mjs 957 B
packages/react-simplikit/dist/hooks/useThrottle/throttle.cjs 306 B
packages/react-simplikit/dist/hooks/useThrottle/throttle.mjs 298 B
packages/react-simplikit/dist/hooks/useThrottle/useThrottle.cjs 864 B
packages/react-simplikit/dist/hooks/useThrottle/useThrottle.mjs 838 B
packages/react-simplikit/dist/hooks/useTimeout/useTimeout.cjs 627 B
packages/react-simplikit/dist/hooks/useTimeout/useTimeout.mjs 600 B
packages/react-simplikit/dist/hooks/useToggle/useToggle.cjs 524 B
packages/react-simplikit/dist/hooks/useToggle/useToggle.mjs 506 B
packages/react-simplikit/dist/hooks/useVisibilityEvent/useVisibilityEvent.cjs 692 B
packages/react-simplikit/dist/hooks/useVisibilityEvent/useVisibilityEvent.mjs 674 B
packages/react-simplikit/dist/index.cjs 1.37 kB
packages/react-simplikit/dist/index.mjs 997 B
packages/react-simplikit/dist/mobile/hooks/useAvoidKeyboard/useAvoidKeyboard.cjs 990 B
packages/react-simplikit/dist/mobile/hooks/useAvoidKeyboard/useAvoidKeyboard.mjs 968 B
packages/react-simplikit/dist/mobile/hooks/useBodyScrollLock/useBodyScrollLock.cjs 551 B
packages/react-simplikit/dist/mobile/hooks/useBodyScrollLock/useBodyScrollLock.mjs 527 B
packages/react-simplikit/dist/mobile/hooks/useKeyboardHeight/useKeyboardHeight.cjs 690 B
packages/react-simplikit/dist/mobile/hooks/useKeyboardHeight/useKeyboardHeight.mjs 671 B
packages/react-simplikit/dist/mobile/hooks/useNetworkStatus/useNetworkStatus.cjs 1.2 kB
packages/react-simplikit/dist/mobile/hooks/useNetworkStatus/useNetworkStatus.mjs 1.19 kB
packages/react-simplikit/dist/mobile/hooks/usePageVisibility/usePageVisibility.cjs 936 B
packages/react-simplikit/dist/mobile/hooks/usePageVisibility/usePageVisibility.mjs 917 B
packages/react-simplikit/dist/mobile/hooks/useSafeAreaInset/useSafeAreaInset.cjs 947 B
packages/react-simplikit/dist/mobile/hooks/useSafeAreaInset/useSafeAreaInset.mjs 932 B
packages/react-simplikit/dist/mobile/hooks/useScrollDirection/useScrollDirection.cjs 960 B
packages/react-simplikit/dist/mobile/hooks/useScrollDirection/useScrollDirection.mjs 949 B
packages/react-simplikit/dist/mobile/hooks/useVisualViewport/useVisualViewport.cjs 1.24 kB
packages/react-simplikit/dist/mobile/hooks/useVisualViewport/useVisualViewport.mjs 1.22 kB
packages/react-simplikit/dist/mobile/utils/disableBodyScrollLock/disableBodyScrollLock.cjs 681 B
packages/react-simplikit/dist/mobile/utils/disableBodyScrollLock/disableBodyScrollLock.mjs 673 B
packages/react-simplikit/dist/mobile/utils/enableBodyScrollLock/enableBodyScrollLock.cjs 677 B
packages/react-simplikit/dist/mobile/utils/enableBodyScrollLock/enableBodyScrollLock.mjs 666 B
packages/react-simplikit/dist/mobile/utils/getKeyboardHeight/getKeyboardHeight.cjs 613 B
packages/react-simplikit/dist/mobile/utils/getKeyboardHeight/getKeyboardHeight.mjs 607 B
packages/react-simplikit/dist/mobile/utils/getSafeAreaInset/getSafeAreaInset.cjs 907 B
packages/react-simplikit/dist/mobile/utils/getSafeAreaInset/getSafeAreaInset.mjs 898 B
packages/react-simplikit/dist/mobile/utils/isAndroid/isAndroid.cjs 547 B
packages/react-simplikit/dist/mobile/utils/isAndroid/isAndroid.mjs 538 B
packages/react-simplikit/dist/mobile/utils/isIOS/isIOS.cjs 758 B
packages/react-simplikit/dist/mobile/utils/isIOS/isIOS.mjs 751 B
packages/react-simplikit/dist/mobile/utils/isKeyboardVisible/isKeyboardVisible.cjs 434 B
packages/react-simplikit/dist/mobile/utils/isKeyboardVisible/isKeyboardVisible.mjs 423 B
packages/react-simplikit/dist/mobile/utils/isServer/isServer.cjs 386 B
packages/react-simplikit/dist/mobile/utils/isServer/isServer.mjs 384 B
packages/react-simplikit/dist/mobile/utils/subscribeKeyboardHeight/subscribeKeyboardHeight.cjs 1.12 kB
packages/react-simplikit/dist/mobile/utils/subscribeKeyboardHeight/subscribeKeyboardHeight.mjs 1.1 kB
packages/react-simplikit/dist/utils/buildContext/buildContext.cjs 809 B
packages/react-simplikit/dist/utils/buildContext/buildContext.mjs 788 B
packages/react-simplikit/dist/utils/mergeProps/mergeProps.cjs 669 B
packages/react-simplikit/dist/utils/mergeProps/mergeProps.mjs 668 B
packages/react-simplikit/dist/utils/mergeRefs/mergeRefs.cjs 614 B
packages/react-simplikit/dist/utils/mergeRefs/mergeRefs.mjs 612 B

compressed-size-action

@hyesungoh
hyesungoh force-pushed the docs/boolean-callback-examples branch from c2866ee to 4272498 Compare August 27, 2026 16:30
@changeset-bot

changeset-bot Bot commented Aug 27, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 5841b8d

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
react-simplikit Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@hyesungoh hyesungoh changed the title docs(useDebouncedCallback,useThrottledCallback): document the boolean-only callback feat(useDebouncedCallback,useThrottledCallback): accept any value type Aug 27, 2026
@hyesungoh
hyesungoh marked this pull request as ready for review August 27, 2026 16:31
@hyesungoh
hyesungoh requested a review from mnxmnz as a code owner August 27, 2026 16:31
Base automatically changed from feat/consumer-skill to main August 27, 2026 16:38
@hyesungoh
hyesungoh force-pushed the docs/boolean-callback-examples branch from 4272498 to 5841b8d Compare August 27, 2026 16:40
@codecov-commenter

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 100.00%. Comparing base (f65d51c) to head (5841b8d).

Additional details and impacted files

Impacted file tree graph

@@            Coverage Diff            @@
##              main      #446   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files           58        58           
  Lines         1652      1664   +12     
  Branches       499       500    +1     
=========================================
+ Hits          1652      1664   +12     
🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@hyesungoh
hyesungoh merged commit 0b66d40 into main Aug 27, 2026
18 checks passed
@hyesungoh
hyesungoh deleted the docs/boolean-callback-examples branch August 27, 2026 16:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants