uix.core — com.pitch/uix.core 0.9.0

Public API

$ clj/s macro

($ tag)

($ tag props & children)

Creates React element

DOM element: ($ :button#id.class {:on-click handle-click} "click me") React component: ($ title-bar {:title "Title"})

*current-component* cljs

as-react cljs

(as-react f)

Interop with React components. Takes UIx component function and returns same component wrapped into interop layer.

create-class cljs

(create-class {:keys [constructor getInitialState render componentDidMount
                      componentDidUpdate componentDidCatch shouldComponentUpdate
                      getSnapshotBeforeUpdate componentWillUnmount
                      childContextTypes contextTypes contextType
                      getDerivedStateFromProps getDerivedStateFromError
                      defaultProps displayName]
               :as fields})

Creates class based React component

create-context cljs

(create-context)

(create-context default-value)

Creates React Context with an optional default value

create-error-boundary clj/s≠

(create-error-boundary {:keys [display-name derive-error-state did-catch]
                        :or {display-name (str (gensym "uix.error-boundary"))}}
                       render-fn)

clj

Creates React's error boundary component

display-name — the name of the component to be displayed in stack trace derive-error-state — maps error object to component's state that is used in render-fn did-catch — 2 arg function for side-effects, logging etc. receives the exception and additional component info as args render-fn — takes state value returned from derive-error-state and a vector of arguments passed into error boundary

cljs

Creates React's error boundary component

display-name — the name of the component to be displayed in stack trace derive-error-state — maps error object to component's state that is used in render-fn did-catch — 2 arg function for side-effects, logging etc. receives the exception and additional component info as args render-fn — takes state value returned from error->state and a vector of arguments passed into error boundary

create-ref cljs

(create-ref)

Creates React's ref type object.

defui clj/s macro

(defui sym & fdecl)

Creates UIx component. Similar to defn, but doesn't support multi arity. A component should have a single argument of props.

fn clj/s macro

(fn & fdecl)

Creates anonymous UIx component. Similar to fn, but doesn't support multi arity. A component should have a single argument of props.

glue-args cljs

(glue-args props)

jsfy-deps cljs

(jsfy-deps coll)

lazy cljs

(lazy f)

Like React.lazy, but supposed to be used with UIx components

memo cljs

(memo f)

(memo f should-update?)

Takes component f and optional comparator function should-update? that takes previous and next props of the component. Returns memoized f.

When should-update? is not provided uses default comparator that compares props with clojure.core/=

parse-sig clj

(parse-sig form name fdecl)

source clj/s macro

(source sym)

Returns source string of UIx component

start-transition cljs

(start-transition f)

Marks updates in f as transitions See: https://reactjs.org/docs/react-api.html#starttransition

stringify-clojure-primitives cljs

(stringify-clojure-primitives v)

use-callback clj/s macro

(use-callback f deps)

Takes function f and required vector of dependencies, and returns memoized f.

See: https://reactjs.org/docs/hooks-reference.html#usecallback

use-context clj/s≠

clj

(use-context value)

cljs

(use-context context)

Takes React context and returns its current value

use-debug clj

(use-debug v)

(use-debug v fmt)

use-deferred-value clj/s≠

(use-deferred-value v)

cljs

Accepts a value and returns a new copy of the value that will defer to more urgent updates. If the current render is the result of an urgent update, like user input, React will return the previous value and then render the new value after the urgent render has completed.

See: https://reactjs.org/docs/hooks-reference.html#usedeferredvalue

use-effect clj/s macro

(use-effect f)

(use-effect f deps)

Takes a function to be executed in an effect and optional vector of dependencies.

See: https://reactjs.org/docs/hooks-reference.html#useeffect

use-id clj/s≠

(use-id)

cljs

Returns unique ID that is stable across the server and client, while avoiding hydration mismatches.

See: https://reactjs.org/docs/hooks-reference.html#useid

use-imperative-handle clj/s macro

(use-imperative-handle ref f)

(use-imperative-handle ref f deps)

Customizes the instance value that is exposed to parent components when using ref.

See: https://reactjs.org/docs/hooks-reference.html#useimperativehandle

use-insertion-effect clj/s macro

(use-insertion-effect f)

(use-insertion-effect f deps)

Takes a function to be executed synchronously before all DOM mutations and optional vector of dependencies. Use this to inject styles into the DOM before reading layout in useLayoutEffect.

See: https://reactjs.org/docs/hooks-reference.html#useinsertioneffect

use-layout-effect clj/s macro

(use-layout-effect f)

(use-layout-effect f deps)

Takes a function to be executed in a layout effect and optional vector of dependencies.

See: https://reactjs.org/docs/hooks-reference.html#uselayouteffect

use-memo clj/s macro

(use-memo f deps)

Takes function f and required vector of dependencies, and returns memoized result of f.

See: https://reactjs.org/docs/hooks-reference.html#usememo

use-reducer clj/s≠

(use-reducer f value)

(use-reducer f value init-state)

cljs

An alternative to use-state. Accepts a reducer of type (state, action) => new-state, and returns the current state paired with a dispatch method.

See: https://reactjs.org/docs/hooks-reference.html#usereducer

use-ref clj/s≠

clj

(use-ref value)

cljs

(use-ref)

(use-ref value)

Takes optional initial value and returns React's ref hook wrapped in atom-like type.

use-state clj/s≠

(use-state value)

cljs

Takes initial value or a function that computes it and returns a stateful value, and a function to update it.

See: https://reactjs.org/docs/hooks-reference.html#usestate

use-sync-external-store clj/s≠

(use-sync-external-store subscribe get-snapshot)

(use-sync-external-store subscribe get-snapshot get-server-snapshot)

cljs

For reading and subscribing from external data sources in a way that’s compatible with concurrent rendering features like selective hydration and time slicing.

subscribe: function to register a callback that is called whenever the store changes get-snapshot: function that returns the current value of the store get-server-snapshot: function that returns the snapshot used during server rendering

See: https://reactjs.org/docs/hooks-reference.html#usesyncexternalstore

use-transition clj/s≠

(use-transition)

cljs

Returns a stateful value for the pending state of the transition, and a function to start it.

See: https://reactjs.org/docs/hooks-reference.html#usetransition

vector->js-array clj

(vector->js-array coll)