~/oss/redux-form
–master
branch ofredux-form/redux-form
~/oss/rfdocs
–master
branch ofredux-form/redux-form-docs
- This is auto deployed via Netlify to
redux-form.com
(or it was before I transfered ownership to theredux-form
org) - Contains
publish.js
, a horrible pre-Gatsby static site generator
- This is auto deployed via Netlify to
~/oss/redux-form-website-template
–website-template
branch ofredux-form/redux-form
- This is where styling tweaks sometimes need to be made
- It needs to be
npm publish
'd and the version updated in all the examplespackage.json
s andredux-form-docs
repos to get the new changes.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const government = Machine({ | |
id: 'USA 🇺🇸', | |
initial: 'Trump', | |
states: { | |
Trump: { | |
on: { | |
INAUGURATION: 'Biden' | |
} | |
}, | |
Biden: { |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const machine = Machine({ | |
id: 'labelEditing', | |
initial: 'idle', | |
context: {x:400,y:400}, | |
states: { | |
idle: { | |
on: { | |
ADD_LAYER: { | |
target: 'selection', | |
actions: 'addLayer', |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const machine = Machine({ | |
id: 'labelEditing', | |
initial: 'idle', | |
states: { | |
idle: { | |
on: { | |
ADD_LAYER: { | |
target: 'selection', | |
actions: 'addLayer', | |
}, |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Available variables: | |
// - Machine | |
// - interpret | |
// - assign | |
// - send | |
// - sendParent | |
// - spawn | |
// - raise | |
// - actions |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
interface Container<V> { | |
get: () => V; | |
set: (value: V) => void; | |
} | |
function createContainer<V>(value: V): Container<V> { | |
let v = value; | |
return { | |
get: () => v, | |
set: (newV: V) => { |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<MakeAsyncFunction | |
listener={promiseListener} | |
start="START_ACTION_TYPE" // the type of action to dispatch when this function is called | |
resolve="RESOLVE_ACTION_TYPE" // the type of action that will resolve the promise | |
reject="REJECT_ACTION_TYPE" // the type of action that will reject the promise | |
>{asyncFunc => ( | |
<SomeFormLibrary onSubmit={asyncFunc}> | |
... |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const WhenFieldChanges = ({ field, becomes, set, to }) => ( | |
<Field name={set} subscription={{}}> | |
{( | |
// No subscription. We only use Field to get to the change function | |
{ input: { onChange } } | |
) => ( | |
<OnChange name={field}> | |
{value => { | |
if (value === becomes) { | |
onChange(to) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function focusOnFirstError(formName, hasError) { | |
const form = document.forms[formName] | |
for (let i = 0; i < form.length; i++) { | |
if (hasError(form[i].name)) { | |
form[i].focus() | |
break | |
} | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react' | |
import { Form, Field } from 'react-final-form | |
import createDecorator from 'final-form-focus' | |
const focusOnErrors = createDecorator() | |
... | |
<Form | |
onSubmit={submit} | |
decorators={[ focusOnErrors ]} // <--------- 😎 | |
validate={validate} |