Skip to main content

Preact

PCR works out of the box with Preact 10 due to the simplicity of the components. Literally can't get any easier 😉.

Install#

npx preact-cli preactjs-templates/simple preact_appcd preact_appnpm i pretty-checkbox pretty-checkbox-react

Usage#

From the index.js file in your Preact app:

import { Checkbox, useCheckboxState } from 'pretty-checkbox-react';import '~/pretty-checkbox';
export default function App() {    const checkbox = useCheckboxState();
    return (        <>            <Checkbox {...checkbox}>It lives!</Checkbox>            <p>Checked: {checkbox.state + ''}</p>        </>    );}

Wowza 🤯 so easy!

Usage with Hooks#

As per the Preact docs, we can use hooks from preact/hooks or from preact/compat:

import { useRef, useEffect } from 'preact/hooks';import { Checkbox } from 'pretty-checkbox-react';
import '~/pretty-checkbox';
export default function App() {    const ref = useRef(null);
    useEffect(() => {        console.log(ref);    }, []);
    return <Checkbox ref={ref}>It lives!</Checkbox>;}