npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@heridux/form

v0.0.1

Published

Manage your forms easily with heridux-form

Downloads

3

Readme

Table of Contents

HeriduxForm

Extends Heridux

Form store constructor

Parameters

  • STATE_PROPERTY String? string name for this store (if you plan to use it with redux)

Examples

import HeriduxForm from "@heridux/form"
import Rules from "@heridux/rules"

const store = new HeriduxForm("myForm")

store.defineForm({
  name : Rules.string.isRequired,
  age : Rules.number,
  address : {
    street : Rules.string,
    city : Rules.string,
    zipCode : Rules.number
  }
})

// register store in redux store (see @heridux/core for more details)
store.register()

store.initFormValues({
  name : "Roger",
  age : 56
})

store.setFieldValue(["address", "city"], "Paris")

store.getFieldValue("age") // 56

Returns undefined

defineForm

Defines structure of the form

Parameters

  • fields Object object describing the form (field name in key, Rules object in value)

Examples

import HeriduxForm from "@heridux/form"
import Rules from "@heridux/rules"

const store = new HeriduxForm("myForm")

store.defineForm({
  name : Rules.string.isRequired,
  age : Rules.number,
  address : {
    street : Rules.string,
    city : Rules.string,
    zipCode : Rules.number
  }
})

// register store in redux store (see @heridux/core for more details)
store.register()

Returns undefined

initFormValues

Initialization of the form. Undeclared fields will be ignored.

Parameters

  • values Object initialization values

Examples

import HeriduxForm from "@heridux/form"
import Rules from "@heridux/rules"

const store = new HeriduxForm("myForm")

store.defineForm({
  name : Rules.string.isRequired,
  age : Rules.number
})

store.register()

store.initFormValues({
  name : "Roger",
  age : 56,
  address : "Paris"
})

// initFormValues won't consider form has been touched
store.get("touched") // false

// unknown keys are ignored
store.getFieldValue("address") // null

Returns undefined

initFormValuesIn

Initialization of part of the form. Undeclared fields will be ignored.

Parameters

  • path Array entry point
  • values Object initialization values

Examples

import HeriduxForm from "@heridux/form"
import Rules from "@heridux/rules"

const store = new HeriduxForm("myForm")

store.defineForm({
  name : Rules.string.isRequired,
  age : Rules.number,
  address : {
    street : Rules.string,
    city : Rules.string,
    zipCode : Rules.number
}
})

store.register()

store.initFormValuesIn(["address"], {
  street : "Victor Hugo",
  city : "Toulouse",
  zipCode : 31000
})

// initFormValuesIn won't consider form has been touched
store.get("touched") // false

store.getFormValues()
// {
//   name : null,
//   age : null,
//   address : {
//     street : "Victor Hugo",
//     city : "Toulouse",
//     zipCode : 31000
//   }
//}

Returns undefined

checkForm

Check validity of the form

Parameters

  • _formValues Object? values to check if they are not those of the store (optional, default null)

Returns Boolean true if all fields are valid, false otherwise

cancelFormValues

Cancel modifications (return to the initial values defined by the initFormValues method)

Returns undefined

cancelFormValuesIn

Cancel modifications to part of form (return to the initial values defined by the initFormValues method)

Parameters

Returns undefined

resetFormValues

Réinitialisation des valeurs du formulaires (toutes fixées à null)

Returns undefined

resetFormValuesIn

Réinitialisation d'une partie des valeurs du formulaires (toutes fixées à null)

Parameters

  • path Array point d'entrée

Returns undefined

addFields

Ajout dynamique de champs dans le formulaire (postérieur à la méthode defineForm)

Parameters

  • path (Array | String) chemin où insérer les nouveaux champs
  • fields Object objet dont les clés sont les noms des champs et les valeurs les règles de validation

Returns undefined

removeFields

Suppression dynamique de champs de formulaire

Parameters

Returns undefined

setFieldValue

Attribution d'une valeur à un champ

Parameters

  • path (Array | String) chemin du champ
  • value any valeur du champ

Returns undefined

initFieldValue

Initialisation d'un champ

Parameters

  • path (Array | String) chemin du champ
  • value any valeur du champ

Returns undefined

cancelFieldValue

Annulation des modifications d'un champ (retour à la valeur initiale)

Parameters

Returns undefined

setFieldWarning

Définition d'un message d'avetissement

Parameters

  • path (Array | String) chemin du champ
  • message String contenu du message
  • properties Object propriétés supplémentaires liées à l'erreur

Returns undefined

setFieldError

Définition d'un message d'erreur

Parameters

  • path (Array | String) chemin du champ
  • message String contenu du message
  • properties Object propriétés supplémentaires liées à l'erreur

Returns undefined

setGlobalError

Définition d'une erreur globale sur le formulaire

Parameters

  • error String contenu de l'erreur

Returns undefined

isFormTouched

Teste si le formulaire a été modifié

Parameters

  • state Immutable.Map optionnel état du store si on l'a sous la main

Returns Boolean true si le formulaire a été modifié, false sinon

isFormValid

Teste si le formulaire contient des erreurs. Attention, il ne lance pas les validations mais se contente de vérifier si des erreurs ont été levées.

Parameters

  • state Immutable.Map optionnel état du store si on l'a sous la main

Returns Boolean true si le formulaire contient des erreurs, false sinon

getFormErrors

Récupère l'ensemble des erreurs du formulaire sous forme de tableau

Parameters

  • state Immutable.Map optionnel état du store si on l'a sous la main

Returns Array tableau des erreurs

setFormValues

Attribue les valeurs au formulaire. Attention, les validations ne sont pas lancées car certaines peuvent être interdépendantes (si besoin exécuter la méthode checkForm ensuite)

Parameters

  • values Object objet contenant les valeurs

Returns undefined

setFormValuesIn

Attribue des valeurs au formulaire. Attention, les validations ne sont pas lancées car certaines peuvent être interdépendantes (si besoin exécuter la méthode checkForm ensuite)

Parameters

  • path Array optionnel, point d'entrée si on ne veut affecter qu'une partie du formulaire
  • values Object objet contenant les valeurs

Returns undefined

getFormValues

Retrieves form values

Parameters

  • _state Immutable.Map? state of the store if available

Returns Object object describing values

getFormValuesIn

Retrieves values of a form part

Parameters

  • path (Array | String) key path to form part
  • _state Immutable.Map? state of the store if available

Returns Object object describing values

getFieldValue

Retrieves field value

Parameters

  • path (Array | String) key path to the field
  • _state Immutable.Map? state of the store if available

Returns any field value

getFieldWarning

Retrieves the warning message of a field

Parameters

  • path (Array | String) key path to the field
  • _state Immutable.Map? state of the store if available

Returns String warning message

getFieldError

Retrieves the error message of a field

Parameters

  • path (Array | String) key path to the field
  • _state Immutable.Map? state of the store if available

Returns String error message

isFieldTouched

Tests if a field has been modified

Parameters

  • path (Array | String) key path to the field
  • _state Immutable.Map? state of the store if available

Returns Boolean true if the field has been modified

destroyForm

Completely reset the form structure

Returns undefined

validateForm

Set current values as initial values. Form will be considered unmodified. Warning : field rules won't be check (use checkForm if needed)

Examples

import HeriduxForm from "@heridux/form"
import Rules from "@heridux/rules"

const store = new HeriduxForm("myForm")

store.defineForm({
  name : Rules.string.isRequired,
  age : Rules.number
})

store.register()

store.setFieldValue("name", "Roger")
store.setFieldValue("age", "56")

store.get("touched") // true

store.validateForm()

store.get("touched") // false
store.cancelFormValues() // no effect since values are now considered as initial values

Returns undefined

isField

Checks if a field is registered at path passed as argument

Parameters

Returns Bool true if a field is registered