Reim V4

react-reim.tsx

function Counter() {
    const { data: { count }, fire } = useReim(counter);

    return (
        <div>
            <button onClick={() => fire(Increment)}>-</button>
            <input value={count} /> 
            <button onClick={() => fire(Decrement)}>-</button>
        </div>
    )
}

reim-form.tsx

function LoginForm() {
    const { refetch: { validateEmail }} = validateEmailQuery();

    const loginForm = useReim(() => {
        const email = data();
        const password = data();

        const NativeOnChange = event();

        on(NativeOnChange, {
            filter: { name: 'email' },
            effect(event) {
                validateEmail({ variables: { email: event.target.value });
            }
        });
    });

    return (
        <form>
        </form>
    );
}

reim.ts

const count = data();

const Previewing = state();
const Editting = state();

const Increment = event();
const Reset = event();

on(Increment, {
    condition: Previewing,
    target: Editting,
    effect: (payload) => (state) => {
        return {
            ...state,
            value: state.value + 1
        }
    }
});

on({
    event: Reset,
    condition: Previewing,
    target: Editting,
    effect: p((state) { // Using immer
        state.value = 0
    })
});

Reset.flow(
    debounce(30),
    ({ delta }) => {
        
    })
)

export default reim({ count })