rumext.v2

browser-context?

A boolean var, indicates if the current code is running on browser main thread or not.

catch

(catch component {:keys [fallback on-error]})

High order component that adds an error boundary

check-props

(check-props props)(check-props props eqfn?)

Utility function to use with memo'. Will check the props keys to see if they are equal.

Usage:

(mf/defc my-component
  {::mf/wrap [#(mf/memo' % (mf/check-props ["prop1" "prop2"]))]}
  [props]

)

check-props

macro

(check-props props & [eq-f :as rest])

A macro version of the check-props function

Component

The react.Component class

create-context

Create a react context

create-ref

create-root

Creates react root

defc

macro

(defc & args)

A macro for defining component functions. Look the user guide for understand how to use it.

defc

macro

(defc & args)

A macro for defining component functions. Look the user guide for understand how to use it.

deferred

(deferred component)(deferred component sfn)

A higher-order component that just deffers the first render to the next tick

deps

(deps)(deps a)(deps a b)(deps a b c)(deps a b c d)(deps a b c d e)(deps a b c d e f)(deps a b c d e f g)(deps a b c d e f g h)(deps a b c d e f g h & rest)

A helper for creating hook deps array, that handles some adaptations for clojure specific data types such that UUID and keywords

deref

(deref iref)

A rumext hook for deref and watch an atom or atom like object. It internally uses the react.useSyncExternalSource API

element

(element klass)(element klass props)

Create a react element. This is a public API for the internal jsx function

fnc

macro

(fnc & args)

A macro for defining inline component functions. Look the user guide for understand how to use it.

fnc

macro

(fnc & args)

A macro for defining inline component functions. Look the user guide for understand how to use it.

forward-ref

lets your component expose a DOM node to parent component with a ref.

Fragment

The `react.Fragment class

html

macro

(html body)

html

macro

(html body)

hydrate-root

Lets you display React components inside a browser DOM node whose HTML content was previously generated by react-dom/server

lazy

A helper for creating lazy loading components.

lazy-component

macro

(lazy-component ns-sym)

A macro that helps defining lazy-loading components with the help of shadow-cljs tooling.

lazy-component

macro

(lazy-component ns-sym)

A macro that helps defining lazy-loading components with the help of shadow-cljs tooling.

memo

(memo component)(memo component eq?)

High order component for memoizing component props. Is a rumext variant of React.memo what accepts a value comparator function (instead of props comparator)

memo'

A raw variant of React.memo.

merge-props

(merge-props props1 props2)

mount

Add element to the DOM tree. Idempotent. Subsequent mounts will just update element.

noop

portal

Render element in a DOM node that is ouside of current DOM hierarchy.

Profiler

The react.Profiler class

provider

(provider ctx)

Get the current provider for specified context

ref-val

(ref-val ref)

Given state and ref handle, returns React component.

render!

(render! root element)

set-ref-val!

(set-ref-val! ref val)

spread

macro

(spread target & [other :as rest])

A helper for create spread js object operations. Leaves the keys untouched.

spread

macro

(spread target & [other :as rest])

A helper for create spread js object operations. Leaves the keys untouched.

spread-props

macro

(spread-props target & [other :as rest])

A helper for create spread js object operations. Adapts compile time known keys to the react props standard transformations.

spread-props

macro

(spread-props target & [other :as rest])

A helper for create spread js object operations. Adapts compile time known keys to the react props standard transformations.

start-transition

An alias for react.startTransition function

Suspense

The react.Suspense class

throttle

(throttle component ms)

A higher-order component that throttles the rendering

undefined

unmount

Removes component from the DOM tree.

unmount!

(unmount! root)

Removes component from the DOM tree.

use-callback

(use-callback f)(use-callback deps f)

A rumext variant of the useCallback hook function with order of arguments inverted

use-ctx

A lisp-case short alias for the useContext hook function

use-debounce

(use-debounce ms value)

A rumext custom hook that debounces the value changes

use-deferred

A lisp-case shorter alias for useDeferredValue

use-effect

(use-effect f)(use-effect deps f)

A rumext variant of the useEffect hook function with order of arguments inverted

use-equal-memo

(use-equal-memo val)(use-equal-memo eqfn val)

A rumext custom hook that preserves object identity through using a = (value equality). Optionally, you can provide your own function.

use-fn

(use-fn f)(use-fn deps f)

A convenience short alias for use-callback

use-id

A lisp-case alias fro useId hook function

use-insertion-effect

(use-insertion-effect f)(use-insertion-effect deps f)

A rumext variant of the useInsertionEffect hook function with order of arguments inverted

use-layout-effect

(use-layout-effect f)(use-layout-effect deps f)

A rumext variant of the useLayoutEffect hook function with order of arguments inverted

use-memo

(use-memo f)(use-memo deps f)

A rumext variant of the useMemo hook function with order of arguments inverted

use-previous

(use-previous value)

A rumext custom hook that returns a value from previous render

use-ref

A lisp-case alias for useRef

use-ref-fn

(use-ref-fn f)

A rumext custom hook that returns a stable callback pointer what calls the interned callback. The interned callback will be automatically updated on each render if the reference changes and works as noop if the pointer references to nil value.

use-ssr-effect

(use-ssr-effect deps effect-fn)

An EXPERIMENTAL use-effect version that detects if we are in a NON browser context and runs the effect fn inmediatelly.

use-state

(use-state)(use-state initial)

A rumext variant of useState. Returns an object that implements the Atom protocols.

use-transition

(use-transition)

A rumext version of the useTransition hook function. Returns a function object that implements the IPending protocol for check the state of the transition.

use-update-ref

(use-update-ref value)

A rumext custom hook that updates the ref value if the value changes

use-var

(use-var)(use-var initial)

A rumext custom hook that uses useRef under the hood. Returns an object that implements the Atom protocols. The updates does not trigger rerender.

useCallback

The react.useCallback hook function

useContext

The react.useContext hook function

useDeferredValue

The `react.useDeferredValue hook function

useEffect

The react.useEffect hook function

useId

The react.useId hook function

useInsertionEffect

The react.useInsertionEffect` hook function

useLayoutEffect

The react.useLayoutEffect hook function

useMemo

The react.useMemo hook function

useRef

The react.useRef hook function

useState

The react.useState hook function

useTransition

The react.useTransition hook function

with-effect

macro

(with-effect deps & body)

A convenience syntactic abstraction (macro) for useEffect

with-effect

macro

(with-effect deps & body)

A convenience syntactic abstraction (macro) for useEffect

with-layout-effect

macro

(with-layout-effect deps & body)

A convenience syntactic abstraction (macro) for useLayoutEffect

with-layout-effect

macro

(with-layout-effect deps & body)

A convenience syntactic abstraction (macro) for useLayoutEffect

with-memo

macro

(with-memo deps & body)

A convenience syntactic abstraction (macro) for useMemo

with-memo

macro

(with-memo deps & body)

A convenience syntactic abstraction (macro) for useMemo