@mantine/hooks 6.0.11 → 7.0.0-alpha.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/index.js +6 -4
- package/cjs/index.js.map +1 -1
- package/cjs/use-callback-ref/use-callback-ref.js +16 -0
- package/cjs/use-callback-ref/use-callback-ref.js.map +1 -0
- package/cjs/use-click-outside/use-click-outside.js +21 -19
- package/cjs/use-click-outside/use-click-outside.js.map +1 -1
- package/cjs/use-clipboard/use-clipboard.js +26 -22
- package/cjs/use-clipboard/use-clipboard.js.map +1 -1
- package/cjs/use-color-scheme/use-color-scheme.js +3 -1
- package/cjs/use-color-scheme/use-color-scheme.js.map +1 -1
- package/cjs/use-counter/use-counter.js +9 -25
- package/cjs/use-counter/use-counter.js.map +1 -1
- package/cjs/use-debounced-callback/use-debounced-callback.js +19 -0
- package/cjs/use-debounced-callback/use-debounced-callback.js.map +1 -0
- package/cjs/use-debounced-state/use-debounced-state.js +19 -18
- package/cjs/use-debounced-state/use-debounced-state.js.map +1 -1
- package/cjs/use-debounced-value/use-debounced-value.js +25 -24
- package/cjs/use-debounced-value/use-debounced-value.js.map +1 -1
- package/cjs/use-did-update/use-did-update.js +11 -11
- package/cjs/use-did-update/use-did-update.js.map +1 -1
- package/cjs/use-disclosure/use-disclosure.js +24 -24
- package/cjs/use-disclosure/use-disclosure.js.map +1 -1
- package/cjs/use-document-title/use-document-title.js +5 -5
- package/cjs/use-document-title/use-document-title.js.map +1 -1
- package/cjs/use-document-visibility/use-document-visibility.js +7 -7
- package/cjs/use-document-visibility/use-document-visibility.js.map +1 -1
- package/cjs/use-event-listener/use-event-listener.js +9 -12
- package/cjs/use-event-listener/use-event-listener.js.map +1 -1
- package/cjs/use-eye-dropper/use-eye-dropper.js +12 -12
- package/cjs/use-eye-dropper/use-eye-dropper.js.map +1 -1
- package/cjs/use-favicon/use-favicon.js +23 -21
- package/cjs/use-favicon/use-favicon.js.map +1 -1
- package/cjs/use-focus-return/use-focus-return.js +29 -25
- package/cjs/use-focus-return/use-focus-return.js.map +1 -1
- package/cjs/use-focus-trap/create-aria-hider.js +36 -34
- package/cjs/use-focus-trap/create-aria-hider.js.map +1 -1
- package/cjs/use-focus-trap/scope-tab.js +15 -15
- package/cjs/use-focus-trap/scope-tab.js.map +1 -1
- package/cjs/use-focus-trap/tabbable.js +36 -31
- package/cjs/use-focus-trap/tabbable.js.map +1 -1
- package/cjs/use-focus-trap/use-focus-trap.js +67 -61
- package/cjs/use-focus-trap/use-focus-trap.js.map +1 -1
- package/cjs/use-focus-within/use-focus-within.js +37 -40
- package/cjs/use-focus-within/use-focus-within.js.map +1 -1
- package/cjs/use-force-update/use-force-update.js +3 -3
- package/cjs/use-force-update/use-force-update.js.map +1 -1
- package/cjs/use-fullscreen/use-fullscreen.js +83 -71
- package/cjs/use-fullscreen/use-fullscreen.js.map +1 -1
- package/cjs/use-hash/use-hash.js +16 -16
- package/cjs/use-hash/use-hash.js.map +1 -1
- package/cjs/use-headroom/use-headroom.js +23 -23
- package/cjs/use-headroom/use-headroom.js.map +1 -1
- package/cjs/use-hotkeys/parse-hotkey.js +49 -64
- package/cjs/use-hotkeys/parse-hotkey.js.map +1 -1
- package/cjs/use-hotkeys/use-hotkeys.js +22 -21
- package/cjs/use-hotkeys/use-hotkeys.js.map +1 -1
- package/cjs/use-hover/use-hover.js +17 -17
- package/cjs/use-hover/use-hover.js.map +1 -1
- package/cjs/use-id/use-id.js +12 -12
- package/cjs/use-id/use-id.js.map +1 -1
- package/cjs/use-id/use-react-id.js +3 -3
- package/cjs/use-id/use-react-id.js.map +1 -1
- package/cjs/use-idle/use-idle.js +26 -42
- package/cjs/use-idle/use-idle.js.map +1 -1
- package/cjs/use-input-state/use-input-state.js +22 -18
- package/cjs/use-input-state/use-input-state.js.map +1 -1
- package/cjs/use-intersection/use-intersection.js +17 -17
- package/cjs/use-intersection/use-intersection.js.map +1 -1
- package/cjs/use-interval/use-interval.js +28 -27
- package/cjs/use-interval/use-interval.js.map +1 -1
- package/cjs/use-isomorphic-effect/use-isomorphic-effect.js +3 -1
- package/cjs/use-isomorphic-effect/use-isomorphic-effect.js.map +1 -1
- package/cjs/use-list-state/use-list-state.js +55 -74
- package/cjs/use-list-state/use-list-state.js.map +1 -1
- package/cjs/use-local-storage/create-storage.js +70 -70
- package/cjs/use-local-storage/create-storage.js.map +1 -1
- package/cjs/use-local-storage/use-local-storage.js +1 -1
- package/cjs/use-local-storage/use-local-storage.js.map +1 -1
- package/cjs/use-logger/use-logger.js +9 -8
- package/cjs/use-logger/use-logger.js.map +1 -1
- package/cjs/use-media-query/use-media-query.js +31 -26
- package/cjs/use-media-query/use-media-query.js.map +1 -1
- package/cjs/use-merged-ref/use-merged-ref.js +14 -5
- package/cjs/use-merged-ref/use-merged-ref.js.map +1 -1
- package/cjs/use-mouse/use-mouse.js +25 -40
- package/cjs/use-mouse/use-mouse.js.map +1 -1
- package/cjs/use-move/use-move.js +88 -86
- package/cjs/use-move/use-move.js.map +1 -1
- package/cjs/use-network/use-network.js +32 -48
- package/cjs/use-network/use-network.js.map +1 -1
- package/cjs/use-os/use-os.js +30 -30
- package/cjs/use-os/use-os.js.map +1 -1
- package/cjs/use-page-leave/use-page-leave.js +4 -4
- package/cjs/use-page-leave/use-page-leave.js.map +1 -1
- package/cjs/use-pagination/use-pagination.js +58 -63
- package/cjs/use-pagination/use-pagination.js.map +1 -1
- package/cjs/use-previous/use-previous.js +5 -5
- package/cjs/use-previous/use-previous.js.map +1 -1
- package/cjs/use-queue/use-queue.js +24 -24
- package/cjs/use-queue/use-queue.js.map +1 -1
- package/cjs/use-reduced-motion/use-reduced-motion.js +1 -1
- package/cjs/use-reduced-motion/use-reduced-motion.js.map +1 -1
- package/cjs/use-resize-observer/use-resize-observer.js +36 -34
- package/cjs/use-resize-observer/use-resize-observer.js.map +1 -1
- package/cjs/use-scroll-into-view/use-scroll-into-view.js +77 -77
- package/cjs/use-scroll-into-view/use-scroll-into-view.js.map +1 -1
- package/cjs/use-scroll-into-view/utils/ease-in-out-quad.js +1 -1
- package/cjs/use-scroll-into-view/utils/ease-in-out-quad.js.map +1 -1
- package/cjs/use-scroll-into-view/utils/get-relative-position.js +46 -53
- package/cjs/use-scroll-into-view/utils/get-relative-position.js.map +1 -1
- package/cjs/use-scroll-into-view/utils/get-scroll-start.js +10 -9
- package/cjs/use-scroll-into-view/utils/get-scroll-start.js.map +1 -1
- package/cjs/use-scroll-into-view/utils/set-scroll-param.js +14 -11
- package/cjs/use-scroll-into-view/utils/set-scroll-param.js.map +1 -1
- package/cjs/use-session-storage/use-session-storage.js +1 -1
- package/cjs/use-session-storage/use-session-storage.js.map +1 -1
- package/cjs/use-set-state/use-set-state.js +3 -19
- package/cjs/use-set-state/use-set-state.js.map +1 -1
- package/cjs/use-shallow-effect/use-shallow-effect.js +22 -22
- package/cjs/use-shallow-effect/use-shallow-effect.js.map +1 -1
- package/cjs/use-text-selection/use-text-selection.js +12 -12
- package/cjs/use-text-selection/use-text-selection.js.map +1 -1
- package/cjs/use-timeout/use-timeout.js +22 -26
- package/cjs/use-timeout/use-timeout.js.map +1 -1
- package/cjs/use-toggle/use-toggle.js +6 -6
- package/cjs/use-toggle/use-toggle.js.map +1 -1
- package/cjs/use-uncontrolled/use-uncontrolled.js +10 -16
- package/cjs/use-uncontrolled/use-uncontrolled.js.map +1 -1
- package/cjs/use-validated-state/use-validated-state.js +14 -13
- package/cjs/use-validated-state/use-validated-state.js.map +1 -1
- package/cjs/use-viewport-size/use-viewport-size.js +12 -12
- package/cjs/use-viewport-size/use-viewport-size.js.map +1 -1
- package/cjs/use-window-event/use-window-event.js +4 -4
- package/cjs/use-window-event/use-window-event.js.map +1 -1
- package/cjs/use-window-scroll/use-window-scroll.js +19 -17
- package/cjs/use-window-scroll/use-window-scroll.js.map +1 -1
- package/cjs/utils/clamp/clamp.js +1 -1
- package/cjs/utils/clamp/clamp.js.map +1 -1
- package/cjs/utils/lower-first/lower-first.js +1 -1
- package/cjs/utils/lower-first/lower-first.js.map +1 -1
- package/cjs/utils/random-id/random-id.js +1 -1
- package/cjs/utils/random-id/random-id.js.map +1 -1
- package/cjs/utils/range/range.js +2 -2
- package/cjs/utils/range/range.js.map +1 -1
- package/cjs/utils/shallow-equal/shallow-equal.js +19 -19
- package/cjs/utils/shallow-equal/shallow-equal.js.map +1 -1
- package/cjs/utils/upper-first/upper-first.js +1 -1
- package/cjs/utils/upper-first/upper-first.js.map +1 -1
- package/esm/index.js +4 -3
- package/esm/index.js.map +1 -1
- package/esm/use-callback-ref/use-callback-ref.js +12 -0
- package/esm/use-callback-ref/use-callback-ref.js.map +1 -0
- package/esm/use-click-outside/use-click-outside.js +21 -19
- package/esm/use-click-outside/use-click-outside.js.map +1 -1
- package/esm/use-clipboard/use-clipboard.js +26 -22
- package/esm/use-clipboard/use-clipboard.js.map +1 -1
- package/esm/use-color-scheme/use-color-scheme.js +3 -1
- package/esm/use-color-scheme/use-color-scheme.js.map +1 -1
- package/esm/use-counter/use-counter.js +9 -25
- package/esm/use-counter/use-counter.js.map +1 -1
- package/esm/use-debounced-callback/use-debounced-callback.js +15 -0
- package/esm/use-debounced-callback/use-debounced-callback.js.map +1 -0
- package/esm/use-debounced-state/use-debounced-state.js +19 -18
- package/esm/use-debounced-state/use-debounced-state.js.map +1 -1
- package/esm/use-debounced-value/use-debounced-value.js +25 -24
- package/esm/use-debounced-value/use-debounced-value.js.map +1 -1
- package/esm/use-did-update/use-did-update.js +11 -11
- package/esm/use-did-update/use-did-update.js.map +1 -1
- package/esm/use-disclosure/use-disclosure.js +24 -24
- package/esm/use-disclosure/use-disclosure.js.map +1 -1
- package/esm/use-document-title/use-document-title.js +5 -5
- package/esm/use-document-title/use-document-title.js.map +1 -1
- package/esm/use-document-visibility/use-document-visibility.js +7 -7
- package/esm/use-document-visibility/use-document-visibility.js.map +1 -1
- package/esm/use-event-listener/use-event-listener.js +9 -12
- package/esm/use-event-listener/use-event-listener.js.map +1 -1
- package/esm/use-eye-dropper/use-eye-dropper.js +12 -12
- package/esm/use-eye-dropper/use-eye-dropper.js.map +1 -1
- package/esm/use-favicon/use-favicon.js +23 -21
- package/esm/use-favicon/use-favicon.js.map +1 -1
- package/esm/use-focus-return/use-focus-return.js +29 -25
- package/esm/use-focus-return/use-focus-return.js.map +1 -1
- package/esm/use-focus-trap/create-aria-hider.js +36 -34
- package/esm/use-focus-trap/create-aria-hider.js.map +1 -1
- package/esm/use-focus-trap/scope-tab.js +15 -15
- package/esm/use-focus-trap/scope-tab.js.map +1 -1
- package/esm/use-focus-trap/tabbable.js +36 -31
- package/esm/use-focus-trap/tabbable.js.map +1 -1
- package/esm/use-focus-trap/use-focus-trap.js +67 -61
- package/esm/use-focus-trap/use-focus-trap.js.map +1 -1
- package/esm/use-focus-within/use-focus-within.js +37 -40
- package/esm/use-focus-within/use-focus-within.js.map +1 -1
- package/esm/use-force-update/use-force-update.js +3 -3
- package/esm/use-force-update/use-force-update.js.map +1 -1
- package/esm/use-fullscreen/use-fullscreen.js +83 -71
- package/esm/use-fullscreen/use-fullscreen.js.map +1 -1
- package/esm/use-hash/use-hash.js +16 -16
- package/esm/use-hash/use-hash.js.map +1 -1
- package/esm/use-headroom/use-headroom.js +23 -23
- package/esm/use-headroom/use-headroom.js.map +1 -1
- package/esm/use-hotkeys/parse-hotkey.js +49 -64
- package/esm/use-hotkeys/parse-hotkey.js.map +1 -1
- package/esm/use-hotkeys/use-hotkeys.js +22 -21
- package/esm/use-hotkeys/use-hotkeys.js.map +1 -1
- package/esm/use-hover/use-hover.js +17 -17
- package/esm/use-hover/use-hover.js.map +1 -1
- package/esm/use-id/use-id.js +12 -12
- package/esm/use-id/use-id.js.map +1 -1
- package/esm/use-id/use-react-id.js +3 -3
- package/esm/use-id/use-react-id.js.map +1 -1
- package/esm/use-idle/use-idle.js +26 -42
- package/esm/use-idle/use-idle.js.map +1 -1
- package/esm/use-input-state/use-input-state.js +22 -18
- package/esm/use-input-state/use-input-state.js.map +1 -1
- package/esm/use-intersection/use-intersection.js +17 -17
- package/esm/use-intersection/use-intersection.js.map +1 -1
- package/esm/use-interval/use-interval.js +28 -27
- package/esm/use-interval/use-interval.js.map +1 -1
- package/esm/use-isomorphic-effect/use-isomorphic-effect.js +3 -1
- package/esm/use-isomorphic-effect/use-isomorphic-effect.js.map +1 -1
- package/esm/use-list-state/use-list-state.js +55 -74
- package/esm/use-list-state/use-list-state.js.map +1 -1
- package/esm/use-local-storage/create-storage.js +70 -70
- package/esm/use-local-storage/create-storage.js.map +1 -1
- package/esm/use-local-storage/use-local-storage.js +1 -1
- package/esm/use-local-storage/use-local-storage.js.map +1 -1
- package/esm/use-logger/use-logger.js +9 -8
- package/esm/use-logger/use-logger.js.map +1 -1
- package/esm/use-media-query/use-media-query.js +31 -26
- package/esm/use-media-query/use-media-query.js.map +1 -1
- package/esm/use-merged-ref/use-merged-ref.js +14 -6
- package/esm/use-merged-ref/use-merged-ref.js.map +1 -1
- package/esm/use-mouse/use-mouse.js +25 -40
- package/esm/use-mouse/use-mouse.js.map +1 -1
- package/esm/use-move/use-move.js +88 -86
- package/esm/use-move/use-move.js.map +1 -1
- package/esm/use-network/use-network.js +32 -48
- package/esm/use-network/use-network.js.map +1 -1
- package/esm/use-os/use-os.js +30 -30
- package/esm/use-os/use-os.js.map +1 -1
- package/esm/use-page-leave/use-page-leave.js +4 -4
- package/esm/use-page-leave/use-page-leave.js.map +1 -1
- package/esm/use-pagination/use-pagination.js +58 -63
- package/esm/use-pagination/use-pagination.js.map +1 -1
- package/esm/use-previous/use-previous.js +5 -5
- package/esm/use-previous/use-previous.js.map +1 -1
- package/esm/use-queue/use-queue.js +24 -24
- package/esm/use-queue/use-queue.js.map +1 -1
- package/esm/use-reduced-motion/use-reduced-motion.js +1 -1
- package/esm/use-reduced-motion/use-reduced-motion.js.map +1 -1
- package/esm/use-resize-observer/use-resize-observer.js +36 -34
- package/esm/use-resize-observer/use-resize-observer.js.map +1 -1
- package/esm/use-scroll-into-view/use-scroll-into-view.js +77 -77
- package/esm/use-scroll-into-view/use-scroll-into-view.js.map +1 -1
- package/esm/use-scroll-into-view/utils/ease-in-out-quad.js +1 -1
- package/esm/use-scroll-into-view/utils/ease-in-out-quad.js.map +1 -1
- package/esm/use-scroll-into-view/utils/get-relative-position.js +46 -53
- package/esm/use-scroll-into-view/utils/get-relative-position.js.map +1 -1
- package/esm/use-scroll-into-view/utils/get-scroll-start.js +10 -9
- package/esm/use-scroll-into-view/utils/get-scroll-start.js.map +1 -1
- package/esm/use-scroll-into-view/utils/set-scroll-param.js +14 -11
- package/esm/use-scroll-into-view/utils/set-scroll-param.js.map +1 -1
- package/esm/use-session-storage/use-session-storage.js +1 -1
- package/esm/use-session-storage/use-session-storage.js.map +1 -1
- package/esm/use-set-state/use-set-state.js +3 -19
- package/esm/use-set-state/use-set-state.js.map +1 -1
- package/esm/use-shallow-effect/use-shallow-effect.js +22 -22
- package/esm/use-shallow-effect/use-shallow-effect.js.map +1 -1
- package/esm/use-text-selection/use-text-selection.js +12 -12
- package/esm/use-text-selection/use-text-selection.js.map +1 -1
- package/esm/use-timeout/use-timeout.js +23 -27
- package/esm/use-timeout/use-timeout.js.map +1 -1
- package/esm/use-toggle/use-toggle.js +6 -6
- package/esm/use-toggle/use-toggle.js.map +1 -1
- package/esm/use-uncontrolled/use-uncontrolled.js +10 -16
- package/esm/use-uncontrolled/use-uncontrolled.js.map +1 -1
- package/esm/use-validated-state/use-validated-state.js +14 -13
- package/esm/use-validated-state/use-validated-state.js.map +1 -1
- package/esm/use-viewport-size/use-viewport-size.js +12 -12
- package/esm/use-viewport-size/use-viewport-size.js.map +1 -1
- package/esm/use-window-event/use-window-event.js +4 -4
- package/esm/use-window-event/use-window-event.js.map +1 -1
- package/esm/use-window-scroll/use-window-scroll.js +19 -17
- package/esm/use-window-scroll/use-window-scroll.js.map +1 -1
- package/esm/utils/clamp/clamp.js +1 -1
- package/esm/utils/clamp/clamp.js.map +1 -1
- package/esm/utils/lower-first/lower-first.js +1 -1
- package/esm/utils/lower-first/lower-first.js.map +1 -1
- package/esm/utils/random-id/random-id.js +1 -1
- package/esm/utils/random-id/random-id.js.map +1 -1
- package/esm/utils/range/range.js +2 -2
- package/esm/utils/range/range.js.map +1 -1
- package/esm/utils/shallow-equal/shallow-equal.js +19 -19
- package/esm/utils/shallow-equal/shallow-equal.js.map +1 -1
- package/esm/utils/upper-first/upper-first.js +1 -1
- package/esm/utils/upper-first/upper-first.js.map +1 -1
- package/lib/index.d.ts +4 -3
- package/lib/use-callback-ref/use-callback-ref.d.ts +1 -0
- package/lib/use-click-outside/use-click-outside.d.ts +1 -2
- package/lib/use-clipboard/use-clipboard.d.ts +2 -3
- package/lib/use-color-scheme/use-color-scheme.d.ts +0 -1
- package/lib/use-counter/use-counter.d.ts +0 -1
- package/lib/use-debounced-callback/use-debounced-callback.d.ts +1 -0
- package/lib/use-debounced-state/use-debounced-state.d.ts +0 -1
- package/lib/use-debounced-value/use-debounced-value.d.ts +0 -1
- package/lib/use-did-update/use-did-update.d.ts +0 -1
- package/lib/use-disclosure/use-disclosure.d.ts +0 -1
- package/lib/use-document-title/use-document-title.d.ts +0 -1
- package/lib/use-document-visibility/use-document-visibility.d.ts +0 -1
- package/lib/use-event-listener/use-event-listener.d.ts +1 -2
- package/lib/use-eye-dropper/use-eye-dropper.d.ts +1 -2
- package/lib/use-favicon/use-favicon.d.ts +0 -1
- package/lib/use-focus-return/use-focus-return.d.ts +0 -1
- package/lib/use-focus-trap/create-aria-hider.d.ts +0 -1
- package/lib/use-focus-trap/scope-tab.d.ts +0 -1
- package/lib/use-focus-trap/tabbable.d.ts +2 -3
- package/lib/use-focus-trap/use-focus-trap.d.ts +0 -1
- package/lib/use-focus-within/use-focus-within.d.ts +0 -1
- package/lib/use-force-update/use-force-update.d.ts +0 -1
- package/lib/use-fullscreen/use-fullscreen.d.ts +0 -1
- package/lib/use-hash/use-hash.d.ts +0 -1
- package/lib/use-headroom/use-headroom.d.ts +0 -1
- package/lib/use-hotkeys/parse-hotkey.d.ts +0 -1
- package/lib/use-hotkeys/use-hotkeys.d.ts +0 -1
- package/lib/use-hover/use-hover.d.ts +1 -2
- package/lib/use-id/use-id.d.ts +0 -1
- package/lib/use-id/use-react-id.d.ts +0 -1
- package/lib/use-idle/use-idle.d.ts +0 -1
- package/lib/use-input-state/use-input-state.d.ts +1 -2
- package/lib/use-intersection/use-intersection.d.ts +1 -2
- package/lib/use-interval/use-interval.d.ts +0 -1
- package/lib/use-isomorphic-effect/use-isomorphic-effect.d.ts +0 -1
- package/lib/use-list-state/use-list-state.d.ts +0 -1
- package/lib/use-local-storage/create-storage.d.ts +4 -5
- package/lib/use-local-storage/use-local-storage.d.ts +1 -2
- package/lib/use-logger/use-logger.d.ts +1 -2
- package/lib/use-media-query/use-media-query.d.ts +1 -2
- package/lib/use-merged-ref/use-merged-ref.d.ts +5 -5
- package/lib/use-mouse/use-mouse.d.ts +1 -2
- package/lib/use-move/use-move.d.ts +1 -2
- package/lib/use-network/use-network.d.ts +0 -1
- package/lib/use-os/use-os.d.ts +0 -1
- package/lib/use-page-leave/use-page-leave.d.ts +0 -1
- package/lib/use-pagination/use-pagination.d.ts +0 -1
- package/lib/use-previous/use-previous.d.ts +0 -1
- package/lib/use-queue/use-queue.d.ts +0 -1
- package/lib/use-reduced-motion/use-reduced-motion.d.ts +1 -2
- package/lib/use-resize-observer/use-resize-observer.d.ts +2 -3
- package/lib/use-scroll-into-view/use-scroll-into-view.d.ts +2 -3
- package/lib/use-scroll-into-view/utils/ease-in-out-quad.d.ts +0 -1
- package/lib/use-scroll-into-view/utils/get-relative-position.d.ts +1 -9
- package/lib/use-scroll-into-view/utils/get-scroll-start.d.ts +1 -5
- package/lib/use-scroll-into-view/utils/set-scroll-param.d.ts +1 -6
- package/lib/use-session-storage/use-session-storage.d.ts +1 -2
- package/lib/use-set-state/use-set-state.d.ts +0 -1
- package/lib/use-shallow-effect/use-shallow-effect.d.ts +0 -1
- package/lib/use-text-selection/use-text-selection.d.ts +0 -1
- package/lib/use-timeout/use-timeout.d.ts +0 -1
- package/lib/use-toggle/use-toggle.d.ts +0 -1
- package/lib/use-uncontrolled/use-uncontrolled.d.ts +0 -1
- package/lib/use-validated-state/use-validated-state.d.ts +1 -2
- package/lib/use-viewport-size/use-viewport-size.d.ts +0 -1
- package/lib/use-window-event/use-window-event.d.ts +0 -1
- package/lib/use-window-scroll/use-window-scroll.d.ts +0 -1
- package/lib/utils/clamp/clamp.d.ts +0 -1
- package/lib/utils/index.d.ts +0 -2
- package/lib/utils/lower-first/lower-first.d.ts +0 -1
- package/lib/utils/random-id/random-id.d.ts +0 -1
- package/lib/utils/range/range.d.ts +0 -1
- package/lib/utils/shallow-equal/shallow-equal.d.ts +0 -1
- package/lib/utils/upper-first/upper-first.d.ts +0 -1
- package/package.json +11 -5
- package/cjs/use-scroll-lock/use-scroll-lock.js +0 -54
- package/cjs/use-scroll-lock/use-scroll-lock.js.map +0 -1
- package/cjs/use-scroll-lock/utils/get-lock-styles.js +0 -20
- package/cjs/use-scroll-lock/utils/get-lock-styles.js.map +0 -1
- package/cjs/use-scroll-lock/utils/get-scroll-width.js +0 -14
- package/cjs/use-scroll-lock/utils/get-scroll-width.js.map +0 -1
- package/cjs/use-scroll-lock/utils/inject-style-tag.js +0 -14
- package/cjs/use-scroll-lock/utils/inject-style-tag.js.map +0 -1
- package/cjs/use-scroll-lock/utils/insert-style-tag.js +0 -11
- package/cjs/use-scroll-lock/utils/insert-style-tag.js.map +0 -1
- package/cjs/use-scroll-lock/utils/make-style-tag.js +0 -13
- package/cjs/use-scroll-lock/utils/make-style-tag.js.map +0 -1
- package/cjs/utils/assign-ref/assign-ref.js +0 -14
- package/cjs/utils/assign-ref/assign-ref.js.map +0 -1
- package/esm/use-scroll-lock/use-scroll-lock.js +0 -50
- package/esm/use-scroll-lock/use-scroll-lock.js.map +0 -1
- package/esm/use-scroll-lock/utils/get-lock-styles.js +0 -16
- package/esm/use-scroll-lock/utils/get-lock-styles.js.map +0 -1
- package/esm/use-scroll-lock/utils/get-scroll-width.js +0 -10
- package/esm/use-scroll-lock/utils/get-scroll-width.js.map +0 -1
- package/esm/use-scroll-lock/utils/inject-style-tag.js +0 -10
- package/esm/use-scroll-lock/utils/inject-style-tag.js.map +0 -1
- package/esm/use-scroll-lock/utils/insert-style-tag.js +0 -7
- package/esm/use-scroll-lock/utils/insert-style-tag.js.map +0 -1
- package/esm/use-scroll-lock/utils/make-style-tag.js +0 -9
- package/esm/use-scroll-lock/utils/make-style-tag.js.map +0 -1
- package/esm/utils/assign-ref/assign-ref.js +0 -10
- package/esm/utils/assign-ref/assign-ref.js.map +0 -1
- package/lib/index.d.ts.map +0 -1
- package/lib/use-click-outside/use-click-outside.d.ts.map +0 -1
- package/lib/use-clipboard/use-clipboard.d.ts.map +0 -1
- package/lib/use-color-scheme/use-color-scheme.d.ts.map +0 -1
- package/lib/use-counter/use-counter.d.ts.map +0 -1
- package/lib/use-debounced-state/use-debounced-state.d.ts.map +0 -1
- package/lib/use-debounced-value/use-debounced-value.d.ts.map +0 -1
- package/lib/use-did-update/use-did-update.d.ts.map +0 -1
- package/lib/use-disclosure/use-disclosure.d.ts.map +0 -1
- package/lib/use-document-title/use-document-title.d.ts.map +0 -1
- package/lib/use-document-visibility/use-document-visibility.d.ts.map +0 -1
- package/lib/use-event-listener/use-event-listener.d.ts.map +0 -1
- package/lib/use-eye-dropper/use-eye-dropper.d.ts.map +0 -1
- package/lib/use-favicon/use-favicon.d.ts.map +0 -1
- package/lib/use-focus-return/use-focus-return.d.ts.map +0 -1
- package/lib/use-focus-trap/create-aria-hider.d.ts.map +0 -1
- package/lib/use-focus-trap/scope-tab.d.ts.map +0 -1
- package/lib/use-focus-trap/tabbable.d.ts.map +0 -1
- package/lib/use-focus-trap/use-focus-trap.d.ts.map +0 -1
- package/lib/use-focus-within/use-focus-within.d.ts.map +0 -1
- package/lib/use-force-update/use-force-update.d.ts.map +0 -1
- package/lib/use-fullscreen/use-fullscreen.d.ts.map +0 -1
- package/lib/use-hash/use-hash.d.ts.map +0 -1
- package/lib/use-headroom/use-headroom.d.ts.map +0 -1
- package/lib/use-hotkeys/parse-hotkey.d.ts.map +0 -1
- package/lib/use-hotkeys/use-hotkeys.d.ts.map +0 -1
- package/lib/use-hover/use-hover.d.ts.map +0 -1
- package/lib/use-id/use-id.d.ts.map +0 -1
- package/lib/use-id/use-react-id.d.ts.map +0 -1
- package/lib/use-idle/use-idle.d.ts.map +0 -1
- package/lib/use-input-state/use-input-state.d.ts.map +0 -1
- package/lib/use-intersection/use-intersection.d.ts.map +0 -1
- package/lib/use-interval/use-interval.d.ts.map +0 -1
- package/lib/use-isomorphic-effect/use-isomorphic-effect.d.ts.map +0 -1
- package/lib/use-list-state/use-list-state.d.ts.map +0 -1
- package/lib/use-local-storage/create-storage.d.ts.map +0 -1
- package/lib/use-local-storage/use-local-storage.d.ts.map +0 -1
- package/lib/use-logger/use-logger.d.ts.map +0 -1
- package/lib/use-media-query/use-media-query.d.ts.map +0 -1
- package/lib/use-merged-ref/use-merged-ref.d.ts.map +0 -1
- package/lib/use-mouse/use-mouse.d.ts.map +0 -1
- package/lib/use-move/use-move.d.ts.map +0 -1
- package/lib/use-network/use-network.d.ts.map +0 -1
- package/lib/use-os/use-os.d.ts.map +0 -1
- package/lib/use-page-leave/use-page-leave.d.ts.map +0 -1
- package/lib/use-pagination/use-pagination.d.ts.map +0 -1
- package/lib/use-previous/use-previous.d.ts.map +0 -1
- package/lib/use-queue/use-queue.d.ts.map +0 -1
- package/lib/use-reduced-motion/use-reduced-motion.d.ts.map +0 -1
- package/lib/use-resize-observer/use-resize-observer.d.ts.map +0 -1
- package/lib/use-scroll-into-view/use-scroll-into-view.d.ts.map +0 -1
- package/lib/use-scroll-into-view/utils/ease-in-out-quad.d.ts.map +0 -1
- package/lib/use-scroll-into-view/utils/get-relative-position.d.ts.map +0 -1
- package/lib/use-scroll-into-view/utils/get-scroll-start.d.ts.map +0 -1
- package/lib/use-scroll-into-view/utils/set-scroll-param.d.ts.map +0 -1
- package/lib/use-scroll-lock/use-scroll-lock.d.ts +0 -5
- package/lib/use-scroll-lock/use-scroll-lock.d.ts.map +0 -1
- package/lib/use-scroll-lock/utils/get-lock-styles.d.ts +0 -4
- package/lib/use-scroll-lock/utils/get-lock-styles.d.ts.map +0 -1
- package/lib/use-scroll-lock/utils/get-scroll-width.d.ts +0 -2
- package/lib/use-scroll-lock/utils/get-scroll-width.d.ts.map +0 -1
- package/lib/use-scroll-lock/utils/inject-style-tag.d.ts +0 -2
- package/lib/use-scroll-lock/utils/inject-style-tag.d.ts.map +0 -1
- package/lib/use-scroll-lock/utils/insert-style-tag.d.ts +0 -2
- package/lib/use-scroll-lock/utils/insert-style-tag.d.ts.map +0 -1
- package/lib/use-scroll-lock/utils/make-style-tag.d.ts +0 -2
- package/lib/use-scroll-lock/utils/make-style-tag.d.ts.map +0 -1
- package/lib/use-session-storage/use-session-storage.d.ts.map +0 -1
- package/lib/use-set-state/use-set-state.d.ts.map +0 -1
- package/lib/use-shallow-effect/use-shallow-effect.d.ts.map +0 -1
- package/lib/use-text-selection/use-text-selection.d.ts.map +0 -1
- package/lib/use-timeout/use-timeout.d.ts.map +0 -1
- package/lib/use-toggle/use-toggle.d.ts.map +0 -1
- package/lib/use-uncontrolled/use-uncontrolled.d.ts.map +0 -1
- package/lib/use-validated-state/use-validated-state.d.ts.map +0 -1
- package/lib/use-viewport-size/use-viewport-size.d.ts.map +0 -1
- package/lib/use-window-event/use-window-event.d.ts.map +0 -1
- package/lib/use-window-scroll/use-window-scroll.d.ts.map +0 -1
- package/lib/utils/assign-ref/assign-ref.d.ts +0 -3
- package/lib/utils/assign-ref/assign-ref.d.ts.map +0 -1
- package/lib/utils/clamp/clamp.d.ts.map +0 -1
- package/lib/utils/index.d.ts.map +0 -1
- package/lib/utils/lower-first/lower-first.d.ts.map +0 -1
- package/lib/utils/random-id/random-id.d.ts.map +0 -1
- package/lib/utils/range/range.d.ts.map +0 -1
- package/lib/utils/shallow-equal/shallow-equal.d.ts.map +0 -1
- package/lib/utils/upper-first/upper-first.d.ts.map +0 -1
package/esm/use-hash/use-hash.js
CHANGED
|
@@ -2,22 +2,22 @@ import { useState, useEffect } from 'react';
|
|
|
2
2
|
import { useWindowEvent } from '../use-window-event/use-window-event.js';
|
|
3
3
|
|
|
4
4
|
function useHash() {
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
5
|
+
const [hash, setHashValue] = useState('');
|
|
6
|
+
const setHash = (value) => {
|
|
7
|
+
const valueWithHash = value.startsWith('#') ? value : `#${value}`;
|
|
8
|
+
window.location.hash = valueWithHash;
|
|
9
|
+
setHashValue(valueWithHash);
|
|
10
|
+
};
|
|
11
|
+
useWindowEvent('hashchange', () => {
|
|
12
|
+
const newHash = window.location.hash;
|
|
13
|
+
if (hash !== newHash) {
|
|
14
|
+
setHashValue(hash);
|
|
15
|
+
}
|
|
16
|
+
});
|
|
17
|
+
useEffect(() => {
|
|
18
|
+
setHashValue(window.location.hash);
|
|
19
|
+
}, []);
|
|
20
|
+
return [hash, setHash];
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
export { useHash };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-hash.js","sources":["../../src/use-hash/use-hash.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\n\nexport function useHash() {\n const [hash, setHashValue] = useState<string>('');\n\n const setHash = (value: string) => {\n const valueWithHash = value.startsWith('#') ? value : `#${value}`;\n window.location.hash = valueWithHash;\n setHashValue(valueWithHash);\n };\n\n useWindowEvent('hashchange', () => {\n const newHash = window.location.hash;\n if (hash !== newHash) {\n setHashValue(
|
|
1
|
+
{"version":3,"file":"use-hash.js","sources":["../../src/use-hash/use-hash.ts"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\n\nexport function useHash() {\n const [hash, setHashValue] = useState<string>('');\n\n const setHash = (value: string) => {\n const valueWithHash = value.startsWith('#') ? value : `#${value}`;\n window.location.hash = valueWithHash;\n setHashValue(valueWithHash);\n };\n\n useWindowEvent('hashchange', () => {\n const newHash = window.location.hash;\n if (hash !== newHash) {\n setHashValue(hash);\n }\n });\n\n useEffect(() => {\n setHashValue(window.location.hash);\n }, []);\n\n return [hash, setHash] as const;\n}\n"],"names":[],"mappings":";;;SAGgB,OAAO;IACrB,MAAM,CAAC,IAAI,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IAElD,MAAM,OAAO,GAAG,CAAC,KAAa;QAC5B,MAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC,GAAG,KAAK,GAAG,IAAI,KAAK,EAAE,CAAC;QAClE,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,aAAa,CAAC;QACrC,YAAY,CAAC,aAAa,CAAC,CAAC;KAC7B,CAAC;IAEF,cAAc,CAAC,YAAY,EAAE;QAC3B,MAAM,OAAO,GAAG,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC;QACrC,IAAI,IAAI,KAAK,OAAO,EAAE;YACpB,YAAY,CAAC,IAAI,CAAC,CAAC;SACpB;KACF,CAAC,CAAC;IAEH,SAAS,CAAC;QACR,YAAY,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;KACpC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CAAC,IAAI,EAAE,OAAO,CAAU,CAAC;AAClC;;;;"}
|
|
@@ -6,33 +6,33 @@ const isFixed = (current, fixedAt) => current <= fixedAt;
|
|
|
6
6
|
const isPinned = (current, previous) => current <= previous;
|
|
7
7
|
const isReleased = (current, previous, fixedAt) => !isPinned(current, previous) && !isFixed(current, fixedAt);
|
|
8
8
|
function useHeadroom({ fixedAt = 0, onPin, onFix, onRelease } = {}) {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
9
|
+
const scrollRef = useRef(0);
|
|
10
|
+
const [{ y: scrollPosition }] = useWindowScroll();
|
|
11
|
+
useIsomorphicEffect(() => {
|
|
12
|
+
if (isPinned(scrollPosition, scrollRef.current)) {
|
|
13
|
+
onPin === null || onPin === void 0 ? void 0 : onPin();
|
|
14
|
+
}
|
|
15
|
+
}, [scrollPosition, onPin]);
|
|
16
|
+
useIsomorphicEffect(() => {
|
|
17
|
+
if (isFixed(scrollPosition, fixedAt)) {
|
|
18
|
+
onFix === null || onFix === void 0 ? void 0 : onFix();
|
|
19
|
+
}
|
|
20
|
+
}, [scrollPosition, fixedAt, onFix]);
|
|
21
|
+
useIsomorphicEffect(() => {
|
|
22
|
+
if (isReleased(scrollPosition, scrollRef.current, fixedAt)) {
|
|
23
|
+
onRelease === null || onRelease === void 0 ? void 0 : onRelease();
|
|
24
|
+
}
|
|
25
|
+
}, [scrollPosition, onRelease]);
|
|
26
|
+
useIsomorphicEffect(() => {
|
|
27
|
+
scrollRef.current = window.scrollY;
|
|
28
|
+
}, [scrollPosition]);
|
|
12
29
|
if (isPinned(scrollPosition, scrollRef.current)) {
|
|
13
|
-
|
|
30
|
+
return true;
|
|
14
31
|
}
|
|
15
|
-
}, [scrollPosition, onPin]);
|
|
16
|
-
useIsomorphicEffect(() => {
|
|
17
32
|
if (isFixed(scrollPosition, fixedAt)) {
|
|
18
|
-
|
|
33
|
+
return true;
|
|
19
34
|
}
|
|
20
|
-
|
|
21
|
-
useIsomorphicEffect(() => {
|
|
22
|
-
if (isReleased(scrollPosition, scrollRef.current, fixedAt)) {
|
|
23
|
-
onRelease == null ? void 0 : onRelease();
|
|
24
|
-
}
|
|
25
|
-
}, [scrollPosition, onRelease]);
|
|
26
|
-
useIsomorphicEffect(() => {
|
|
27
|
-
scrollRef.current = window.scrollY;
|
|
28
|
-
}, [scrollPosition]);
|
|
29
|
-
if (isPinned(scrollPosition, scrollRef.current)) {
|
|
30
|
-
return true;
|
|
31
|
-
}
|
|
32
|
-
if (isFixed(scrollPosition, fixedAt)) {
|
|
33
|
-
return true;
|
|
34
|
-
}
|
|
35
|
-
return false;
|
|
35
|
+
return false;
|
|
36
36
|
}
|
|
37
37
|
|
|
38
38
|
export { isFixed, isPinned, isReleased, useHeadroom };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-headroom.js","sources":["../../src/use-headroom/use-headroom.ts"],"sourcesContent":["import { useRef } from 'react';\nimport { useWindowScroll } from '../use-window-scroll/use-window-scroll';\nimport { useIsomorphicEffect } from '../use-isomorphic-effect/use-isomorphic-effect';\n\nexport const isFixed = (current: number, fixedAt: number) => current <= fixedAt;\nexport const isPinned = (current: number, previous: number) => current <= previous;\nexport const isReleased = (current: number, previous: number, fixedAt: number) =>\n !isPinned(current, previous) && !isFixed(current, fixedAt);\n\ninterface UseHeadroomInput {\n /** Number in px at which element should be fixed */\n fixedAt?: number;\n\n /** Called when element is pinned */\n onPin?(): void;\n\n /** Called when element is at fixed position */\n onFix?(): void;\n\n /** Called when element is unpinned */\n onRelease?(): void;\n}\n\nexport function useHeadroom({ fixedAt = 0, onPin, onFix, onRelease }: UseHeadroomInput = {}) {\n const scrollRef = useRef(0);\n const [{ y: scrollPosition }] = useWindowScroll();\n\n useIsomorphicEffect(() => {\n if (isPinned(scrollPosition, scrollRef.current)) {\n onPin?.();\n }\n }, [scrollPosition, onPin]);\n\n useIsomorphicEffect(() => {\n if (isFixed(scrollPosition, fixedAt)) {\n onFix?.();\n }\n }, [scrollPosition, fixedAt, onFix]);\n\n useIsomorphicEffect(() => {\n if (isReleased(scrollPosition, scrollRef.current, fixedAt)) {\n onRelease?.();\n }\n }, [scrollPosition, onRelease]);\n\n useIsomorphicEffect(() => {\n scrollRef.current = window.scrollY;\n }, [scrollPosition]);\n\n if (isPinned(scrollPosition, scrollRef.current)) {\n return true;\n }\n\n if (isFixed(scrollPosition, fixedAt)) {\n return true;\n }\n\n return false;\n}\n"],"names":[],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"use-headroom.js","sources":["../../src/use-headroom/use-headroom.ts"],"sourcesContent":["import { useRef } from 'react';\nimport { useWindowScroll } from '../use-window-scroll/use-window-scroll';\nimport { useIsomorphicEffect } from '../use-isomorphic-effect/use-isomorphic-effect';\n\nexport const isFixed = (current: number, fixedAt: number) => current <= fixedAt;\nexport const isPinned = (current: number, previous: number) => current <= previous;\nexport const isReleased = (current: number, previous: number, fixedAt: number) =>\n !isPinned(current, previous) && !isFixed(current, fixedAt);\n\ninterface UseHeadroomInput {\n /** Number in px at which element should be fixed */\n fixedAt?: number;\n\n /** Called when element is pinned */\n onPin?(): void;\n\n /** Called when element is at fixed position */\n onFix?(): void;\n\n /** Called when element is unpinned */\n onRelease?(): void;\n}\n\nexport function useHeadroom({ fixedAt = 0, onPin, onFix, onRelease }: UseHeadroomInput = {}) {\n const scrollRef = useRef(0);\n const [{ y: scrollPosition }] = useWindowScroll();\n\n useIsomorphicEffect(() => {\n if (isPinned(scrollPosition, scrollRef.current)) {\n onPin?.();\n }\n }, [scrollPosition, onPin]);\n\n useIsomorphicEffect(() => {\n if (isFixed(scrollPosition, fixedAt)) {\n onFix?.();\n }\n }, [scrollPosition, fixedAt, onFix]);\n\n useIsomorphicEffect(() => {\n if (isReleased(scrollPosition, scrollRef.current, fixedAt)) {\n onRelease?.();\n }\n }, [scrollPosition, onRelease]);\n\n useIsomorphicEffect(() => {\n scrollRef.current = window.scrollY;\n }, [scrollPosition]);\n\n if (isPinned(scrollPosition, scrollRef.current)) {\n return true;\n }\n\n if (isFixed(scrollPosition, fixedAt)) {\n return true;\n }\n\n return false;\n}\n"],"names":[],"mappings":";;;;MAIa,OAAO,GAAG,CAAC,OAAe,EAAE,OAAe,KAAK,OAAO,IAAI,QAAQ;MACnE,QAAQ,GAAG,CAAC,OAAe,EAAE,QAAgB,KAAK,OAAO,IAAI,SAAS;MACtE,UAAU,GAAG,CAAC,OAAe,EAAE,QAAgB,EAAE,OAAe,KAC3E,CAAC,QAAQ,CAAC,OAAO,EAAE,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,OAAO,EAAE;SAgB7C,WAAW,CAAC,EAAE,OAAO,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,KAAuB,EAAE;IACzF,MAAM,SAAS,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;IAC5B,MAAM,CAAC,EAAE,CAAC,EAAE,cAAc,EAAE,CAAC,GAAG,eAAe,EAAE,CAAC;IAElD,mBAAmB,CAAC;QAClB,IAAI,QAAQ,CAAC,cAAc,EAAE,SAAS,CAAC,OAAO,CAAC,EAAE;YAC/C,KAAK,aAAL,KAAK,uBAAL,KAAK,EAAI,CAAC;SACX;KACF,EAAE,CAAC,cAAc,EAAE,KAAK,CAAC,CAAC,CAAC;IAE5B,mBAAmB,CAAC;QAClB,IAAI,OAAO,CAAC,cAAc,EAAE,OAAO,CAAC,EAAE;YACpC,KAAK,aAAL,KAAK,uBAAL,KAAK,EAAI,CAAC;SACX;KACF,EAAE,CAAC,cAAc,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC;IAErC,mBAAmB,CAAC;QAClB,IAAI,UAAU,CAAC,cAAc,EAAE,SAAS,CAAC,OAAO,EAAE,OAAO,CAAC,EAAE;YAC1D,SAAS,aAAT,SAAS,uBAAT,SAAS,EAAI,CAAC;SACf;KACF,EAAE,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC,CAAC;IAEhC,mBAAmB,CAAC;QAClB,SAAS,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC;KACpC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IAErB,IAAI,QAAQ,CAAC,cAAc,EAAE,SAAS,CAAC,OAAO,CAAC,EAAE;QAC/C,OAAO,IAAI,CAAC;KACb;IAED,IAAI,OAAO,CAAC,cAAc,EAAE,OAAO,CAAC,EAAE;QACpC,OAAO,IAAI,CAAC;KACb;IAED,OAAO,KAAK,CAAC;AACf;;;;"}
|
|
@@ -1,78 +1,63 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __defProps = Object.defineProperties;
|
|
3
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
-
var __spreadValues = (a, b) => {
|
|
9
|
-
for (var prop in b || (b = {}))
|
|
10
|
-
if (__hasOwnProp.call(b, prop))
|
|
11
|
-
__defNormalProp(a, prop, b[prop]);
|
|
12
|
-
if (__getOwnPropSymbols)
|
|
13
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
-
if (__propIsEnum.call(b, prop))
|
|
15
|
-
__defNormalProp(a, prop, b[prop]);
|
|
16
|
-
}
|
|
17
|
-
return a;
|
|
18
|
-
};
|
|
19
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
1
|
function parseHotkey(hotkey) {
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
2
|
+
const keys = hotkey
|
|
3
|
+
.toLowerCase()
|
|
4
|
+
.split('+')
|
|
5
|
+
.map((part) => part.trim());
|
|
6
|
+
const modifiers = {
|
|
7
|
+
alt: keys.includes('alt'),
|
|
8
|
+
ctrl: keys.includes('ctrl'),
|
|
9
|
+
meta: keys.includes('meta'),
|
|
10
|
+
mod: keys.includes('mod'),
|
|
11
|
+
shift: keys.includes('shift'),
|
|
12
|
+
};
|
|
13
|
+
const reservedKeys = ['alt', 'ctrl', 'meta', 'shift', 'mod'];
|
|
14
|
+
const freeKey = keys.find((key) => !reservedKeys.includes(key));
|
|
15
|
+
return Object.assign(Object.assign({}, modifiers), { key: freeKey });
|
|
34
16
|
}
|
|
35
17
|
function isExactHotkey(hotkey, event) {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
18
|
+
const { alt, ctrl, meta, mod, shift, key } = hotkey;
|
|
19
|
+
const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKey } = event;
|
|
20
|
+
if (alt !== altKey) {
|
|
21
|
+
return false;
|
|
22
|
+
}
|
|
23
|
+
if (mod) {
|
|
24
|
+
if (!ctrlKey && !metaKey) {
|
|
25
|
+
return false;
|
|
26
|
+
}
|
|
44
27
|
}
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
28
|
+
else {
|
|
29
|
+
if (ctrl !== ctrlKey) {
|
|
30
|
+
return false;
|
|
31
|
+
}
|
|
32
|
+
if (meta !== metaKey) {
|
|
33
|
+
return false;
|
|
34
|
+
}
|
|
48
35
|
}
|
|
49
|
-
if (
|
|
50
|
-
|
|
36
|
+
if (shift !== shiftKey) {
|
|
37
|
+
return false;
|
|
38
|
+
}
|
|
39
|
+
if (key &&
|
|
40
|
+
(pressedKey.toLowerCase() === key.toLowerCase() ||
|
|
41
|
+
event.code.replace('Key', '').toLowerCase() === key.toLowerCase())) {
|
|
42
|
+
return true;
|
|
51
43
|
}
|
|
52
|
-
}
|
|
53
|
-
if (shift !== shiftKey) {
|
|
54
44
|
return false;
|
|
55
|
-
}
|
|
56
|
-
if (key && (pressedKey.toLowerCase() === key.toLowerCase() || event.code.replace("Key", "").toLowerCase() === key.toLowerCase())) {
|
|
57
|
-
return true;
|
|
58
|
-
}
|
|
59
|
-
return false;
|
|
60
45
|
}
|
|
61
46
|
function getHotkeyMatcher(hotkey) {
|
|
62
|
-
|
|
47
|
+
return (event) => isExactHotkey(parseHotkey(hotkey), event);
|
|
63
48
|
}
|
|
64
49
|
function getHotkeyHandler(hotkeys) {
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
50
|
+
return (event) => {
|
|
51
|
+
const _event = 'nativeEvent' in event ? event.nativeEvent : event;
|
|
52
|
+
hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {
|
|
53
|
+
if (getHotkeyMatcher(hotkey)(_event)) {
|
|
54
|
+
if (options.preventDefault) {
|
|
55
|
+
event.preventDefault();
|
|
56
|
+
}
|
|
57
|
+
handler(_event);
|
|
58
|
+
}
|
|
59
|
+
});
|
|
60
|
+
};
|
|
76
61
|
}
|
|
77
62
|
|
|
78
63
|
export { getHotkeyHandler, getHotkeyMatcher, parseHotkey };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"parse-hotkey.js","sources":["../../src/use-hotkeys/parse-hotkey.ts"],"sourcesContent":["export type KeyboardModifiers = {\n alt: boolean;\n ctrl: boolean;\n meta: boolean;\n mod: boolean;\n shift: boolean;\n};\n\nexport type Hotkey = KeyboardModifiers & {\n key?: string;\n};\n\ntype CheckHotkeyMatch = (event: KeyboardEvent) => boolean;\n\nexport function parseHotkey(hotkey: string): Hotkey {\n const keys = hotkey\n .toLowerCase()\n .split('+')\n .map((part) => part.trim());\n\n const modifiers: KeyboardModifiers = {\n alt: keys.includes('alt'),\n ctrl: keys.includes('ctrl'),\n meta: keys.includes('meta'),\n mod: keys.includes('mod'),\n shift: keys.includes('shift'),\n };\n\n const reservedKeys = ['alt', 'ctrl', 'meta', 'shift', 'mod'];\n\n const freeKey = keys.find((key) => !reservedKeys.includes(key));\n\n return {\n ...modifiers,\n key: freeKey,\n };\n}\n\nfunction isExactHotkey(hotkey: Hotkey, event: KeyboardEvent): boolean {\n const { alt, ctrl, meta, mod, shift, key } = hotkey;\n const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKey } = event;\n\n if (alt !== altKey) {\n return false;\n }\n\n if (mod) {\n if (!ctrlKey && !metaKey) {\n return false;\n }\n } else {\n if (ctrl !== ctrlKey) {\n return false;\n }\n if (meta !== metaKey) {\n return false;\n }\n }\n if (shift !== shiftKey) {\n return false;\n }\n\n if (\n key &&\n (pressedKey.toLowerCase() === key.toLowerCase() ||\n event.code.replace('Key', '').toLowerCase() === key.toLowerCase())\n ) {\n return true;\n }\n\n return false;\n}\n\nexport function getHotkeyMatcher(hotkey: string): CheckHotkeyMatch {\n return (event) => isExactHotkey(parseHotkey(hotkey), event);\n}\n\nexport interface HotkeyItemOptions {\n preventDefault?: boolean;\n}\n\ntype HotkeyItem = [\n string,\n (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => void,\n HotkeyItemOptions?\n];\n\nexport function getHotkeyHandler(hotkeys: HotkeyItem[]) {\n return (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => {\n const _event = 'nativeEvent' in event ? event.nativeEvent : event;\n hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {\n if (getHotkeyMatcher(hotkey)(_event)) {\n if (options.preventDefault) {\n event.preventDefault();\n }\n\n handler(_event);\n }\n });\n };\n}\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"parse-hotkey.js","sources":["../../src/use-hotkeys/parse-hotkey.ts"],"sourcesContent":["export type KeyboardModifiers = {\n alt: boolean;\n ctrl: boolean;\n meta: boolean;\n mod: boolean;\n shift: boolean;\n};\n\nexport type Hotkey = KeyboardModifiers & {\n key?: string;\n};\n\ntype CheckHotkeyMatch = (event: KeyboardEvent) => boolean;\n\nexport function parseHotkey(hotkey: string): Hotkey {\n const keys = hotkey\n .toLowerCase()\n .split('+')\n .map((part) => part.trim());\n\n const modifiers: KeyboardModifiers = {\n alt: keys.includes('alt'),\n ctrl: keys.includes('ctrl'),\n meta: keys.includes('meta'),\n mod: keys.includes('mod'),\n shift: keys.includes('shift'),\n };\n\n const reservedKeys = ['alt', 'ctrl', 'meta', 'shift', 'mod'];\n\n const freeKey = keys.find((key) => !reservedKeys.includes(key));\n\n return {\n ...modifiers,\n key: freeKey,\n };\n}\n\nfunction isExactHotkey(hotkey: Hotkey, event: KeyboardEvent): boolean {\n const { alt, ctrl, meta, mod, shift, key } = hotkey;\n const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKey } = event;\n\n if (alt !== altKey) {\n return false;\n }\n\n if (mod) {\n if (!ctrlKey && !metaKey) {\n return false;\n }\n } else {\n if (ctrl !== ctrlKey) {\n return false;\n }\n if (meta !== metaKey) {\n return false;\n }\n }\n if (shift !== shiftKey) {\n return false;\n }\n\n if (\n key &&\n (pressedKey.toLowerCase() === key.toLowerCase() ||\n event.code.replace('Key', '').toLowerCase() === key.toLowerCase())\n ) {\n return true;\n }\n\n return false;\n}\n\nexport function getHotkeyMatcher(hotkey: string): CheckHotkeyMatch {\n return (event) => isExactHotkey(parseHotkey(hotkey), event);\n}\n\nexport interface HotkeyItemOptions {\n preventDefault?: boolean;\n}\n\ntype HotkeyItem = [\n string,\n (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => void,\n HotkeyItemOptions?\n];\n\nexport function getHotkeyHandler(hotkeys: HotkeyItem[]) {\n return (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => {\n const _event = 'nativeEvent' in event ? event.nativeEvent : event;\n hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {\n if (getHotkeyMatcher(hotkey)(_event)) {\n if (options.preventDefault) {\n event.preventDefault();\n }\n\n handler(_event);\n }\n });\n };\n}\n"],"names":[],"mappings":"SAcgB,WAAW,CAAC,MAAc;IACxC,MAAM,IAAI,GAAG,MAAM;SAChB,WAAW,EAAE;SACb,KAAK,CAAC,GAAG,CAAC;SACV,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;IAE9B,MAAM,SAAS,GAAsB;QACnC,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;QACzB,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC;QAC3B,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC;QAC3B,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;QACzB,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC;KAC9B,CAAC;IAEF,MAAM,YAAY,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC;IAE7D,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC;IAEhE,uCACK,SAAS,KACZ,GAAG,EAAE,OAAO,IACZ;AACJ,CAAC;AAED,SAAS,aAAa,CAAC,MAAc,EAAE,KAAoB;IACzD,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,MAAM,CAAC;IACpD,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC;IAEtE,IAAI,GAAG,KAAK,MAAM,EAAE;QAClB,OAAO,KAAK,CAAC;KACd;IAED,IAAI,GAAG,EAAE;QACP,IAAI,CAAC,OAAO,IAAI,CAAC,OAAO,EAAE;YACxB,OAAO,KAAK,CAAC;SACd;KACF;SAAM;QACL,IAAI,IAAI,KAAK,OAAO,EAAE;YACpB,OAAO,KAAK,CAAC;SACd;QACD,IAAI,IAAI,KAAK,OAAO,EAAE;YACpB,OAAO,KAAK,CAAC;SACd;KACF;IACD,IAAI,KAAK,KAAK,QAAQ,EAAE;QACtB,OAAO,KAAK,CAAC;KACd;IAED,IACE,GAAG;SACF,UAAU,CAAC,WAAW,EAAE,KAAK,GAAG,CAAC,WAAW,EAAE;YAC7C,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,WAAW,EAAE,KAAK,GAAG,CAAC,WAAW,EAAE,CAAC,EACpE;QACA,OAAO,IAAI,CAAC;KACb;IAED,OAAO,KAAK,CAAC;AACf,CAAC;SAEe,gBAAgB,CAAC,MAAc;IAC7C,OAAO,CAAC,KAAK,KAAK,aAAa,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,CAAC;AAC9D,CAAC;SAYe,gBAAgB,CAAC,OAAqB;IACpD,OAAO,CAAC,KAAuD;QAC7D,MAAM,MAAM,GAAG,aAAa,IAAI,KAAK,GAAG,KAAK,CAAC,WAAW,GAAG,KAAK,CAAC;QAClE,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EAAE,OAAO,EAAE,OAAO,GAAG,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC;YACpE,IAAI,gBAAgB,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,EAAE;gBACpC,IAAI,OAAO,CAAC,cAAc,EAAE;oBAC1B,KAAK,CAAC,cAAc,EAAE,CAAC;iBACxB;gBAED,OAAO,CAAC,MAAM,CAAC,CAAC;aACjB;SACF,CAAC,CAAC;KACJ,CAAC;AACJ;;;;"}
|
|
@@ -3,29 +3,30 @@ import { getHotkeyMatcher } from './parse-hotkey.js';
|
|
|
3
3
|
export { getHotkeyHandler } from './parse-hotkey.js';
|
|
4
4
|
|
|
5
5
|
function shouldFireEvent(event, tagsToIgnore, triggerOnContentEditable = false) {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
6
|
+
if (event.target instanceof HTMLElement) {
|
|
7
|
+
if (triggerOnContentEditable) {
|
|
8
|
+
return !tagsToIgnore.includes(event.target.tagName);
|
|
9
|
+
}
|
|
10
|
+
return !event.target.isContentEditable && !tagsToIgnore.includes(event.target.tagName);
|
|
9
11
|
}
|
|
10
|
-
return
|
|
11
|
-
}
|
|
12
|
-
return true;
|
|
12
|
+
return true;
|
|
13
13
|
}
|
|
14
|
-
function useHotkeys(hotkeys, tagsToIgnore = [
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
14
|
+
function useHotkeys(hotkeys, tagsToIgnore = ['INPUT', 'TEXTAREA', 'SELECT'], triggerOnContentEditable = false) {
|
|
15
|
+
useEffect(() => {
|
|
16
|
+
const keydownListener = (event) => {
|
|
17
|
+
hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {
|
|
18
|
+
if (getHotkeyMatcher(hotkey)(event) &&
|
|
19
|
+
shouldFireEvent(event, tagsToIgnore, triggerOnContentEditable)) {
|
|
20
|
+
if (options.preventDefault) {
|
|
21
|
+
event.preventDefault();
|
|
22
|
+
}
|
|
23
|
+
handler(event);
|
|
24
|
+
}
|
|
25
|
+
});
|
|
26
|
+
};
|
|
27
|
+
document.documentElement.addEventListener('keydown', keydownListener);
|
|
28
|
+
return () => document.documentElement.removeEventListener('keydown', keydownListener);
|
|
29
|
+
}, [hotkeys]);
|
|
29
30
|
}
|
|
30
31
|
|
|
31
32
|
export { useHotkeys };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-hotkeys.js","sources":["../../src/use-hotkeys/use-hotkeys.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport { getHotkeyHandler, getHotkeyMatcher, HotkeyItemOptions } from './parse-hotkey';\n\nexport type { HotkeyItemOptions };\nexport { getHotkeyHandler };\n\nexport type HotkeyItem = [string, (event: KeyboardEvent) => void, HotkeyItemOptions?];\n\nfunction shouldFireEvent(\n event: KeyboardEvent,\n tagsToIgnore: string[],\n triggerOnContentEditable = false\n) {\n if (event.target instanceof HTMLElement) {\n if (triggerOnContentEditable) {\n return !tagsToIgnore.includes(event.target.tagName);\n }\n\n return !event.target.isContentEditable && !tagsToIgnore.includes(event.target.tagName);\n }\n\n return true;\n}\n\nexport function useHotkeys(\n hotkeys: HotkeyItem[],\n tagsToIgnore: string[] = ['INPUT', 'TEXTAREA', 'SELECT'],\n triggerOnContentEditable = false\n) {\n useEffect(() => {\n const keydownListener = (event: KeyboardEvent) => {\n hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {\n if (\n getHotkeyMatcher(hotkey)(event) &&\n shouldFireEvent(event, tagsToIgnore, triggerOnContentEditable)\n ) {\n if (options.preventDefault) {\n event.preventDefault();\n }\n\n handler(event);\n }\n });\n };\n\n document.documentElement.addEventListener('keydown', keydownListener);\n return () => document.documentElement.removeEventListener('keydown', keydownListener);\n }, [hotkeys]);\n}\n"],"names":[],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"use-hotkeys.js","sources":["../../src/use-hotkeys/use-hotkeys.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport { getHotkeyHandler, getHotkeyMatcher, HotkeyItemOptions } from './parse-hotkey';\n\nexport type { HotkeyItemOptions };\nexport { getHotkeyHandler };\n\nexport type HotkeyItem = [string, (event: KeyboardEvent) => void, HotkeyItemOptions?];\n\nfunction shouldFireEvent(\n event: KeyboardEvent,\n tagsToIgnore: string[],\n triggerOnContentEditable = false\n) {\n if (event.target instanceof HTMLElement) {\n if (triggerOnContentEditable) {\n return !tagsToIgnore.includes(event.target.tagName);\n }\n\n return !event.target.isContentEditable && !tagsToIgnore.includes(event.target.tagName);\n }\n\n return true;\n}\n\nexport function useHotkeys(\n hotkeys: HotkeyItem[],\n tagsToIgnore: string[] = ['INPUT', 'TEXTAREA', 'SELECT'],\n triggerOnContentEditable = false\n) {\n useEffect(() => {\n const keydownListener = (event: KeyboardEvent) => {\n hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {\n if (\n getHotkeyMatcher(hotkey)(event) &&\n shouldFireEvent(event, tagsToIgnore, triggerOnContentEditable)\n ) {\n if (options.preventDefault) {\n event.preventDefault();\n }\n\n handler(event);\n }\n });\n };\n\n document.documentElement.addEventListener('keydown', keydownListener);\n return () => document.documentElement.removeEventListener('keydown', keydownListener);\n }, [hotkeys]);\n}\n"],"names":[],"mappings":";;;;AAQA,SAAS,eAAe,CACtB,KAAoB,EACpB,YAAsB,EACtB,wBAAwB,GAAG,KAAK;IAEhC,IAAI,KAAK,CAAC,MAAM,YAAY,WAAW,EAAE;QACvC,IAAI,wBAAwB,EAAE;YAC5B,OAAO,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;SACrD;QAED,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,iBAAiB,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;KACxF;IAED,OAAO,IAAI,CAAC;AACd,CAAC;SAEe,UAAU,CACxB,OAAqB,EACrB,eAAyB,CAAC,OAAO,EAAE,UAAU,EAAE,QAAQ,CAAC,EACxD,wBAAwB,GAAG,KAAK;IAEhC,SAAS,CAAC;QACR,MAAM,eAAe,GAAG,CAAC,KAAoB;YAC3C,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EAAE,OAAO,EAAE,OAAO,GAAG,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC;gBACpE,IACE,gBAAgB,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC;oBAC/B,eAAe,CAAC,KAAK,EAAE,YAAY,EAAE,wBAAwB,CAAC,EAC9D;oBACA,IAAI,OAAO,CAAC,cAAc,EAAE;wBAC1B,KAAK,CAAC,cAAc,EAAE,CAAC;qBACxB;oBAED,OAAO,CAAC,KAAK,CAAC,CAAC;iBAChB;aACF,CAAC,CAAC;SACJ,CAAC;QAEF,QAAQ,CAAC,eAAe,CAAC,gBAAgB,CAAC,SAAS,EAAE,eAAe,CAAC,CAAC;QACtE,OAAO,MAAM,QAAQ,CAAC,eAAe,CAAC,mBAAmB,CAAC,SAAS,EAAE,eAAe,CAAC,CAAC;KACvF,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;AAChB;;;;"}
|
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
import { useState, useRef, useCallback, useEffect } from 'react';
|
|
2
2
|
|
|
3
3
|
function useHover() {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
4
|
+
const [hovered, setHovered] = useState(false);
|
|
5
|
+
const ref = useRef(null);
|
|
6
|
+
const onMouseEnter = useCallback(() => setHovered(true), []);
|
|
7
|
+
const onMouseLeave = useCallback(() => setHovered(false), []);
|
|
8
|
+
useEffect(() => {
|
|
9
|
+
if (ref.current) {
|
|
10
|
+
ref.current.addEventListener('mouseenter', onMouseEnter);
|
|
11
|
+
ref.current.addEventListener('mouseleave', onMouseLeave);
|
|
12
|
+
return () => {
|
|
13
|
+
var _a, _b;
|
|
14
|
+
(_a = ref.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('mouseenter', onMouseEnter);
|
|
15
|
+
(_b = ref.current) === null || _b === void 0 ? void 0 : _b.removeEventListener('mouseleave', onMouseLeave);
|
|
16
|
+
};
|
|
17
|
+
}
|
|
18
|
+
return undefined;
|
|
19
|
+
}, []);
|
|
20
|
+
return { ref, hovered };
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
export { useHover };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-hover.js","sources":["../../src/use-hover/use-hover.ts"],"sourcesContent":["import { useState, useEffect, useRef, useCallback } from 'react';\n\nexport function useHover<T extends HTMLElement = HTMLDivElement>() {\n const [hovered, setHovered] = useState(false);\n const ref = useRef<T>(null);\n const onMouseEnter = useCallback(() => setHovered(true), []);\n const onMouseLeave = useCallback(() => setHovered(false), []);\n\n useEffect(() => {\n if (ref.current) {\n ref.current.addEventListener('mouseenter', onMouseEnter);\n ref.current.addEventListener('mouseleave', onMouseLeave);\n\n return () => {\n ref.current?.removeEventListener('mouseenter', onMouseEnter);\n ref.current?.removeEventListener('mouseleave', onMouseLeave);\n };\n }\n\n return undefined;\n }, []);\n\n return { ref, hovered };\n}\n"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"use-hover.js","sources":["../../src/use-hover/use-hover.ts"],"sourcesContent":["import { useState, useEffect, useRef, useCallback } from 'react';\n\nexport function useHover<T extends HTMLElement = HTMLDivElement>() {\n const [hovered, setHovered] = useState(false);\n const ref = useRef<T>(null);\n const onMouseEnter = useCallback(() => setHovered(true), []);\n const onMouseLeave = useCallback(() => setHovered(false), []);\n\n useEffect(() => {\n if (ref.current) {\n ref.current.addEventListener('mouseenter', onMouseEnter);\n ref.current.addEventListener('mouseleave', onMouseLeave);\n\n return () => {\n ref.current?.removeEventListener('mouseenter', onMouseEnter);\n ref.current?.removeEventListener('mouseleave', onMouseLeave);\n };\n }\n\n return undefined;\n }, []);\n\n return { ref, hovered };\n}\n"],"names":[],"mappings":";;SAEgB,QAAQ;IACtB,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,GAAG,GAAG,MAAM,CAAI,IAAI,CAAC,CAAC;IAC5B,MAAM,YAAY,GAAG,WAAW,CAAC,MAAM,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;IAC7D,MAAM,YAAY,GAAG,WAAW,CAAC,MAAM,UAAU,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC;IAE9D,SAAS,CAAC;QACR,IAAI,GAAG,CAAC,OAAO,EAAE;YACf,GAAG,CAAC,OAAO,CAAC,gBAAgB,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;YACzD,GAAG,CAAC,OAAO,CAAC,gBAAgB,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;YAEzD,OAAO;;gBACL,MAAA,GAAG,CAAC,OAAO,0CAAE,mBAAmB,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;gBAC7D,MAAA,GAAG,CAAC,OAAO,0CAAE,mBAAmB,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;aAC9D,CAAC;SACH;QAED,OAAO,SAAS,CAAC;KAClB,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,CAAC;AAC1B;;;;"}
|
package/esm/use-id/use-id.js
CHANGED
|
@@ -4,18 +4,18 @@ import { useReactId } from './use-react-id.js';
|
|
|
4
4
|
import { randomId } from '../utils/random-id/random-id.js';
|
|
5
5
|
|
|
6
6
|
function useId(staticId) {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
7
|
+
const reactId = useReactId();
|
|
8
|
+
const [uuid, setUuid] = useState(reactId);
|
|
9
|
+
useIsomorphicEffect(() => {
|
|
10
|
+
setUuid(randomId());
|
|
11
|
+
}, []);
|
|
12
|
+
if (typeof staticId === 'string') {
|
|
13
|
+
return staticId;
|
|
14
|
+
}
|
|
15
|
+
if (typeof window === 'undefined') {
|
|
16
|
+
return reactId;
|
|
17
|
+
}
|
|
18
|
+
return uuid;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
21
|
export { useId };
|
package/esm/use-id/use-id.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-id.js","sources":["../../src/use-id/use-id.ts"],"sourcesContent":["import { useState } from 'react';\nimport { useIsomorphicEffect } from '../use-isomorphic-effect/use-isomorphic-effect';\nimport { randomId } from '../utils';\nimport { useReactId } from './use-react-id';\n\nexport function useId(staticId?: string) {\n const reactId = useReactId();\n const [uuid, setUuid] = useState(reactId);\n\n useIsomorphicEffect(() => {\n setUuid(randomId());\n }, []);\n\n if (typeof staticId === 'string') {\n return staticId;\n }\n\n if (typeof window === 'undefined') {\n return reactId;\n }\n\n return uuid;\n}\n"],"names":[],"mappings":";;;;;
|
|
1
|
+
{"version":3,"file":"use-id.js","sources":["../../src/use-id/use-id.ts"],"sourcesContent":["import { useState } from 'react';\nimport { useIsomorphicEffect } from '../use-isomorphic-effect/use-isomorphic-effect';\nimport { randomId } from '../utils';\nimport { useReactId } from './use-react-id';\n\nexport function useId(staticId?: string) {\n const reactId = useReactId();\n const [uuid, setUuid] = useState(reactId);\n\n useIsomorphicEffect(() => {\n setUuid(randomId());\n }, []);\n\n if (typeof staticId === 'string') {\n return staticId;\n }\n\n if (typeof window === 'undefined') {\n return reactId;\n }\n\n return uuid;\n}\n"],"names":[],"mappings":";;;;;SAKgB,KAAK,CAAC,QAAiB;IACrC,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAC7B,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC;IAE1C,mBAAmB,CAAC;QAClB,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC;KACrB,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;QAChC,OAAO,QAAQ,CAAC;KACjB;IAED,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;QACjC,OAAO,OAAO,CAAC;KAChB;IAED,OAAO,IAAI,CAAC;AACd;;;;"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
|
|
3
|
-
const __useId = React[
|
|
3
|
+
const __useId = React['useId'.toString()] || (() => undefined);
|
|
4
4
|
function useReactId() {
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
const id = __useId();
|
|
6
|
+
return id ? `mantine-${id.replace(/:/g, '')}` : '';
|
|
7
7
|
}
|
|
8
8
|
|
|
9
9
|
export { useReactId };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-react-id.js","sources":["../../src/use-id/use-react-id.ts"],"sourcesContent":["import React from 'react';\n\nconst __useId: () => string | undefined = (React as any)['useId'.toString()] || (() => undefined);\n\nexport function useReactId() {\n const id = __useId();\n return id ? `mantine-${id.replace(/:/g, '')}` : '';\n}\n"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"use-react-id.js","sources":["../../src/use-id/use-react-id.ts"],"sourcesContent":["import React from 'react';\n\nconst __useId: () => string | undefined = (React as any)['useId'.toString()] || (() => undefined);\n\nexport function useReactId() {\n const id = __useId();\n return id ? `mantine-${id.replace(/:/g, '')}` : '';\n}\n"],"names":[],"mappings":";;AAEA,MAAM,OAAO,GAA8B,KAAa,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,KAAK,MAAM,SAAS,CAAC,CAAC;SAElF,UAAU;IACxB,MAAM,EAAE,GAAG,OAAO,EAAE,CAAC;IACrB,OAAO,EAAE,GAAG,WAAW,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC;AACrD;;;;"}
|
package/esm/use-idle/use-idle.js
CHANGED
|
@@ -1,52 +1,36 @@
|
|
|
1
1
|
import { useState, useRef, useEffect } from 'react';
|
|
2
2
|
|
|
3
|
-
var __defProp = Object.defineProperty;
|
|
4
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
-
var __spreadValues = (a, b) => {
|
|
9
|
-
for (var prop in b || (b = {}))
|
|
10
|
-
if (__hasOwnProp.call(b, prop))
|
|
11
|
-
__defNormalProp(a, prop, b[prop]);
|
|
12
|
-
if (__getOwnPropSymbols)
|
|
13
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
-
if (__propIsEnum.call(b, prop))
|
|
15
|
-
__defNormalProp(a, prop, b[prop]);
|
|
16
|
-
}
|
|
17
|
-
return a;
|
|
18
|
-
};
|
|
19
3
|
const DEFAULT_EVENTS = [
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
4
|
+
'keypress',
|
|
5
|
+
'mousemove',
|
|
6
|
+
'touchmove',
|
|
7
|
+
'click',
|
|
8
|
+
'scroll',
|
|
25
9
|
];
|
|
26
10
|
const DEFAULT_OPTIONS = {
|
|
27
|
-
|
|
28
|
-
|
|
11
|
+
events: DEFAULT_EVENTS,
|
|
12
|
+
initialState: true,
|
|
29
13
|
};
|
|
30
14
|
function useIdle(timeout, options) {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
15
|
+
const { events, initialState } = Object.assign(Object.assign({}, DEFAULT_OPTIONS), options);
|
|
16
|
+
const [idle, setIdle] = useState(initialState);
|
|
17
|
+
const timer = useRef();
|
|
18
|
+
useEffect(() => {
|
|
19
|
+
const handleEvents = () => {
|
|
20
|
+
setIdle(false);
|
|
21
|
+
if (timer.current) {
|
|
22
|
+
window.clearTimeout(timer.current);
|
|
23
|
+
}
|
|
24
|
+
timer.current = window.setTimeout(() => {
|
|
25
|
+
setIdle(true);
|
|
26
|
+
}, timeout);
|
|
27
|
+
};
|
|
28
|
+
events.forEach((event) => document.addEventListener(event, handleEvents));
|
|
29
|
+
return () => {
|
|
30
|
+
events.forEach((event) => document.removeEventListener(event, handleEvents));
|
|
31
|
+
};
|
|
32
|
+
}, [timeout]);
|
|
33
|
+
return idle;
|
|
50
34
|
}
|
|
51
35
|
|
|
52
36
|
export { useIdle };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-idle.js","sources":["../../src/use-idle/use-idle.ts"],"sourcesContent":["import { useState, useEffect, useRef } from 'react';\n\nconst DEFAULT_EVENTS: (keyof DocumentEventMap)[] = [\n 'keypress',\n 'mousemove',\n 'touchmove',\n 'click',\n 'scroll',\n];\nconst DEFAULT_OPTIONS = {\n events: DEFAULT_EVENTS,\n initialState: true,\n};\n\nexport function useIdle(\n timeout: number,\n options?: Partial<{ events: (keyof DocumentEventMap)[]; initialState: boolean }>\n) {\n const { events, initialState } = { ...DEFAULT_OPTIONS, ...options };\n const [idle, setIdle] = useState<boolean>(initialState);\n const timer = useRef<number>();\n\n useEffect(() => {\n const handleEvents = () => {\n setIdle(false);\n\n if (timer.current) {\n window.clearTimeout(timer.current);\n }\n\n timer.current = window.setTimeout(() => {\n setIdle(true);\n }, timeout);\n };\n\n events.forEach((event) => document.addEventListener(event, handleEvents));\n\n return () => {\n events.forEach((event) => document.removeEventListener(event, handleEvents));\n };\n }, [timeout]);\n\n return idle;\n}\n"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"use-idle.js","sources":["../../src/use-idle/use-idle.ts"],"sourcesContent":["import { useState, useEffect, useRef } from 'react';\n\nconst DEFAULT_EVENTS: (keyof DocumentEventMap)[] = [\n 'keypress',\n 'mousemove',\n 'touchmove',\n 'click',\n 'scroll',\n];\nconst DEFAULT_OPTIONS = {\n events: DEFAULT_EVENTS,\n initialState: true,\n};\n\nexport function useIdle(\n timeout: number,\n options?: Partial<{ events: (keyof DocumentEventMap)[]; initialState: boolean }>\n) {\n const { events, initialState } = { ...DEFAULT_OPTIONS, ...options };\n const [idle, setIdle] = useState<boolean>(initialState);\n const timer = useRef<number>();\n\n useEffect(() => {\n const handleEvents = () => {\n setIdle(false);\n\n if (timer.current) {\n window.clearTimeout(timer.current);\n }\n\n timer.current = window.setTimeout(() => {\n setIdle(true);\n }, timeout);\n };\n\n events.forEach((event) => document.addEventListener(event, handleEvents));\n\n return () => {\n events.forEach((event) => document.removeEventListener(event, handleEvents));\n };\n }, [timeout]);\n\n return idle;\n}\n"],"names":[],"mappings":";;AAEA,MAAM,cAAc,GAA+B;IACjD,UAAU;IACV,WAAW;IACX,WAAW;IACX,OAAO;IACP,QAAQ;CACT,CAAC;AACF,MAAM,eAAe,GAAG;IACtB,MAAM,EAAE,cAAc;IACtB,YAAY,EAAE,IAAI;CACnB,CAAC;SAEc,OAAO,CACrB,OAAe,EACf,OAAgF;IAEhF,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,mCAAQ,eAAe,GAAK,OAAO,CAAE,CAAC;IACpE,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAU,YAAY,CAAC,CAAC;IACxD,MAAM,KAAK,GAAG,MAAM,EAAU,CAAC;IAE/B,SAAS,CAAC;QACR,MAAM,YAAY,GAAG;YACnB,OAAO,CAAC,KAAK,CAAC,CAAC;YAEf,IAAI,KAAK,CAAC,OAAO,EAAE;gBACjB,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;aACpC;YAED,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC;gBAChC,OAAO,CAAC,IAAI,CAAC,CAAC;aACf,EAAE,OAAO,CAAC,CAAC;SACb,CAAC;QAEF,MAAM,CAAC,OAAO,CAAC,CAAC,KAAK,KAAK,QAAQ,CAAC,gBAAgB,CAAC,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;QAE1E,OAAO;YACL,MAAM,CAAC,OAAO,CAAC,CAAC,KAAK,KAAK,QAAQ,CAAC,mBAAmB,CAAC,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;SAC9E,CAAC;KACH,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,OAAO,IAAI,CAAC;AACd;;;;"}
|
|
@@ -1,26 +1,30 @@
|
|
|
1
1
|
import { useState } from 'react';
|
|
2
2
|
|
|
3
3
|
function getInputOnChange(setValue) {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
4
|
+
return (val) => {
|
|
5
|
+
if (!val) {
|
|
6
|
+
setValue(val);
|
|
7
|
+
}
|
|
8
|
+
else if (typeof val === 'function') {
|
|
9
|
+
setValue(val);
|
|
10
|
+
}
|
|
11
|
+
else if (typeof val === 'object' && 'nativeEvent' in val) {
|
|
12
|
+
const { currentTarget } = val;
|
|
13
|
+
if (currentTarget.type === 'checkbox') {
|
|
14
|
+
setValue(currentTarget.checked);
|
|
15
|
+
}
|
|
16
|
+
else {
|
|
17
|
+
setValue(currentTarget.value);
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
else {
|
|
21
|
+
setValue(val);
|
|
22
|
+
}
|
|
23
|
+
};
|
|
20
24
|
}
|
|
21
25
|
function useInputState(initialState) {
|
|
22
|
-
|
|
23
|
-
|
|
26
|
+
const [value, setValue] = useState(initialState);
|
|
27
|
+
return [value, getInputOnChange(setValue)];
|
|
24
28
|
}
|
|
25
29
|
|
|
26
30
|
export { getInputOnChange, useInputState };
|