@nrk/nrkno-sanity-react-utils
TypeScript icon, indicating that this package has built-in type declarations

1.1.1 • Public • Published

@nrk/nrkno-sanity-react-utils

Various React related utility functions and libs used by nrkno-sanity.

Installation

npm install --save @nrk/nrkno-sanity-react-utils

Usage

useSetRefs

Callback that sets all provided refs. Useful when you need multiple reference handles to the same component.

For instance, a ref for your local state and for forwarded Sanity ref in custom input component.

function SomeComponent(props: any, forwardRef: ForwardedRef<HTMLDivElement>) {
  const ref = useRef<HTMLDivElement | null>(null)
  const setRefs = useSetRefs(ref, forwardRef);
  return <div ref={setRefs} />;
}

useResizeObserver

Get a callback whenever an observed element changes size.

function SomeComponent() {
 //useState and NOT useRef
  const [ref, setRef] = useState<HTMLDivElement | null>(null);

  const onResize= useCallback((domRect: DOMRect) => {
      // invoked whenever the div is resized
    }, [])
    
  useResizeObserver(onResize, ref);
  return <div ref={setRef} />;
}

useDebouncedEffect

Takes an effect callback and dependency array (same arguments as React.useEffect), and a debounce delay.

When dependencies change (including component mount, ala useEffect), the effect will be invoked after milliseconds.

The effect is debounced: Delay restarts whenever dependencies change, and only the last change to dependencies will be used.

function SomeComponent({prop}: {prop: string}) {
    useDebouncedEffect(() => {
        // delays invoking this func until after 500 milliseconds have elapsed 
        // since the last time dependencies changed
    }, [prop], 500)
    return null;
}

/@nrk/nrkno-sanity-react-utils/

    Package Sidebar

    Install

    npm i @nrk/nrkno-sanity-react-utils

    Weekly Downloads

    11

    Version

    1.1.1

    License

    MIT

    Unpacked Size

    32 kB

    Total Files

    35

    Last publish

    Collaborators

    • mmep
    • shieldyarmor
    • theasparrowhawk
    • n07073
    • siddise
    • stians
    • kjellovenordlien
    • maar1052
    • joakimmohn
    • mariehovland
    • sondrbw
    • ingryee
    • ellenulrik
    • kristjgr
    • henrk
    • sokkemannen
    • ihlnrk
    • knutbo
    • janerikbr
    • thormodb
    • siivers
    • torsrex
    • haraldsk
    • eskilgh
    • ragnaroh-nrk
    • daardal
    • arevjensen
    • julusian
    • madsern
    • andrefau
    • jfjeldskaar
    • muddah
    • jensrage
    • phajsi
    • jorn_georg
    • bjornhels
    • halvorh
    • morten-nrk
    • nicklassvendsrud
    • kjellvnnrk
    • sanderknrk
    • eirikjstnrk
    • carinafraning
    • helenper
    • stefanogdennrk
    • jimmeloysund
    • tobiasrp
    • martiosk
    • jimalexberger
    • gunderwonder
    • luminrk
    • supermeisen
    • vagifabilov
    • claudio-nrk
    • haakemon
    • zenangst
    • rannveignc
    • eschoien
    • balte
    • toshb
    • emte123
    • opet
    • klizter
    • mikkelnygard
    • feiring
    • dervodev
    • grimbur
    • gardkroyer
    • kariaan
    • edplayz
    • miatollaksvik
    • ytterbo
    • machineboycom
    • trulsl
    • mslhm
    • cbjerkan
    • hermangudesen
    • andreeldareide
    • henningkoller
    • espenhalstensen
    • danjohnrk
    • olapeter
    • teodor-elstad
    • lorecaster
    • nrk-ps-teamcity
    • swla
    • nrk-midas-jenkins
    • andorpandor
    • nrkrichard
    • gesi
    • gundelsby-nrk
    • jonstalecarlsen
    • nrk-sofie-ci
    • nytamin
    • jesperstarkar
    • skjalgepalg
    • eirikhalvard
    • astokke
    • n640071
    • henrik-mattsson
    • haavardm
    • yr
    • nrk-kurator-jenkins
    • torgeilo
    • nrk-user-sync
    • dhdeploy
    • espenwa
    • ovstetun
    • stianlj
    • haraldkj
    • mariusu
    • cristobal
    • knuthaug
    • thohalv
    • johnarne
    • eshaswini
    • morrow
    • oyvindeh
    • laat
    • toggu
    • nrk-jenkins
    • plomma
    • evjand
    • moltubakk
    • ingridguren
    • lu-lux
    • andersli
    • silje
    • stiandg
    • sjurlur
    • andipodnrk
    • pkej
    • yosrimti
    • morten.nyhaug
    • ingvildcath
    • erlend.jones
    • brneirik
    • mollerse
    • tbnrk
    • nordanke
    • simonmitternacht
    • martintorgersen
    • rebchr
    • steipal
    • discobus
    • martingundersen
    • tinkajts
    • hallvardlid
    • tomivar
    • ajaco
    • tobinus
    • mortenok
    • nrk-ark-deploy
    • jeangilbertlouis
    • heidimork
    • ingriddraagen
    • fridajalborg
    • bruusi
    • rosvoll
    • christianeide
    • enordby
    • glen_imrie
    • mia.aasbakken
    • elathamna
    • evjjan17
    • olatoft
    • kongsrud
    • chrpeter
    • ingvildforseth
    • haraldk76
    • stigok
    • johannesodland
    • anders993
    • vildefj
    • vildepk
    • rolerboler
    • meloygutt
    • anders.baggethun