yup | Dead simple Object schema validation | Validation library

 by   jquense TypeScript Version: 1.3.3 License: MIT

kandi X-RAY | yup Summary

kandi X-RAY | yup Summary

yup is a TypeScript library typically used in Utilities, Validation applications. yup has no bugs, it has no vulnerabilities, it has a Permissive License and it has medium support. You can download it from GitHub.

Yup is a schema builder for runtime value parsing and validation. Define a schema, transform a value to match, assert the shape of an existing value, or both. Yup schema are extremely expressive and allow modeling complex, interdependent validations, or value transformation.

            kandi-support Support

              yup has a medium active ecosystem.
              It has 20559 star(s) with 876 fork(s). There are 71 watchers for this library.
              There were 4 major release(s) in the last 6 months.
              There are 105 open issues and 1432 have been closed. On average issues are closed in 109 days. There are 74 open pull requests and 0 closed requests.
              It has a neutral sentiment in the developer community.
              The latest version of yup is 1.3.3

            kandi-Quality Quality

              yup has 0 bugs and 0 code smells.

            kandi-Security Security

              yup has no vulnerabilities reported, and its dependent libraries have no vulnerabilities reported.
              yup code analysis shows 0 unresolved vulnerabilities.
              There are 0 security hotspots that need review.

            kandi-License License

              yup is licensed under the MIT License. This license is Permissive.
              Permissive licenses have the least restrictions, and you can use them in most projects.

            kandi-Reuse Reuse

              yup releases are available to install and integrate.
              Installation instructions, examples and code snippets are available.

            Top functions reviewed by kandi - BETA

            kandi's functional review helps you automatically verify the functionalities of the libraries and avoid rework.
            Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of yup
            Get all kandi verified functions for this library.

            yup Key Features

            No Key Features are available at this moment for yup.

            yup Examples and Code Snippets

            yup-by-example,Custom Generators
            JavaScriptdot img1Lines of Code : 92dot img1License : Permissive (MIT)
            copy iconCopy
              id, // the generator id
              params, // the generator parameters
              chance: // an instance of Chance
              now, // The date the factory was initialised
              session, // The session
              schema, // The schema (supplied by yup),
              value, // The value (supplied b  
            Yup Decorators,Usage
            TypeScriptdot img2Lines of Code : 72dot img2no licencesLicense : No License
            copy iconCopy
            import { a, is, namedSchema, getNamedSchema } from 'yup-decorator';
            class User {
            	constructor({ email, age }) {
            		this.email = email;
            		this.age = age;
            	@is(a.string().email('Not a valid email'))
            	email: string;
            yup-by-example,TL;DR,1. Define the schema, specifying examples
            JavaScriptdot img3Lines of Code : 64dot img3License : Permissive (MIT)
            copy iconCopy
            // schemas.js
            const yupByExample = require('yup-by-example');
            const { mixed, array, object, string, number, ...yup } = require('yup');
            // This must be done before you build any schema that uses yup-by-example
            yup.addMethod(mixed, 'example', yupByExa  
            How to debounce async formik/yup validation, that it will validate when user will stop entering data?
            JavaScriptdot img4Lines of Code : 44dot img4License : Strong Copyleft (CC BY-SA 4.0)
            copy iconCopy
            import debounce from 'lodash/debounce';
            import { isEmailExists } from "./api";
            const validationSchema = yup.object({
              email: yup
                .test("unique_email", "Email must be unique", async (email, v
            Validating a child input type file with react-hook-form and Yup
            JavaScriptdot img5Lines of Code : 70dot img5License : Strong Copyleft (CC BY-SA 4.0)
            copy iconCopy
              onChange: function(){},
              ref: function(){}
            const MyComp = ()=> {
              const {onChange, ...registerParams} = register('photo');
            Need to set up yup validation which is not required and works on only one condition
            JavaScriptdot img6Lines of Code : 16dot img6License : Strong Copyleft (CC BY-SA 4.0)
            copy iconCopy
            const validationSchema = yup.object().shape({
              date_of_birth: yup
                  "Is date greater",
                  "DOB cannot be greater than today's date",
                  (value) => {
                    if (!value
            How to validate that an object property is required?
            JavaScriptdot img7Lines of Code : 33dot img7License : Strong Copyleft (CC BY-SA 4.0)
            copy iconCopy
            import { setLocale } from 'yup';
              mixed: {
                default: 'Não é válido',
              number: {
                min: 'Deve ser maior que ${min}',
            // now use Yup schemas AFTER you defined your custom dictionary
            let schema = yup.object(
            Validating that 2 fields are equal with Formik and Yup
            JavaScriptdot img8Lines of Code : 11dot img8License : Strong Copyleft (CC BY-SA 4.0)
            copy iconCopy
            const validationSchema = yup.object().shape({
                email: yup
                  .email("*Must be a valid email address")
                  .required("*Email is required"),
                confirmEmail: yup
                  .oneOf([yup.ref("email"), null],
            react-hook-forms's onSubmit function not getting triggered in my code
            JavaScriptdot img9Lines of Code : 88dot img9License : Strong Copyleft (CC BY-SA 4.0)
            copy iconCopy
            const schema = yup
                voucherPrice: yup.number().positive().required()
            const priceBox1 = 25;
            const priceBox2 = 50;
            const priceBox3 = 75;
            const priceBox4 = 100;
            const selectedStyles = { outline: "2px solid
            is there a way to change form values on submit
            JavaScriptdot img10Lines of Code : 98dot img10License : Strong Copyleft (CC BY-SA 4.0)
            copy iconCopy
            import React, { useState, useEffect } from 'react';
            import { Form, Formik, useField } from 'formik';
            import * as Yup from 'yup';
            const FORM_INPUT_BOX = "m-2 border border-gray-300 bg-white text-gray-700 placeholder-gray-400 shadow-sm tex

            Community Discussions


            Cannot find module 'react-dom/client' from 'node_modules/@testing-library/react/dist/pure.js'
            Asked 2022-Apr-05 at 14:17

            hope someone could help me here. while running npm test got following mistake

            all neccesserry packages seem to be installed. I was trying to reinstall react-dom and didnot help. Below providing imports used in my test file:



            Answered 2022-Apr-02 at 09:43

            I think it's because your @testing-library/react using the newer version, just test with version of 12.1.2

            Source https://stackoverflow.com/questions/71713405


            How to debounce async formik/yup validation, that it will validate when user will stop entering data?
            Asked 2022-Mar-29 at 22:42

            I want to validate user input asynchronously. For example, to check if email already exists, and perform validation while the user typing. To decrease API calls I'd like to debounce API calls with lodash or custom debounce function and to perform validation when the user stops typing.

            So far this is my form right now. The issue is that it doesn't work as intended. It looks that denounced function returns a value from the previous call, and I can't understand where is the problem.

            You can see a live example here: https://codesandbox.io/s/still-wave-qwww6



            Answered 2021-Nov-10 at 15:42

            It looks that denounced function returns a value from the previous call

            This is how lodash debounce is supposed to work:

            Subsequent calls to the debounced function return the result of the last func invocation.

            SEE: https://lodash.com/docs/4.17.15#debounce

            You could set validateOnChange to false and then call formik.validateForm manually as a side effect:

            Source https://stackoverflow.com/questions/69859193


            Z_DATA_ERROR, ERRNO -3, zlib: incorrect data check, MBA M1
            Asked 2022-Mar-17 at 00:11

            Recently I face an issues to install my dependencies using latest Node and NPM on my MacBook Air M1 machine. Then I found out M1 is not supported latest Node version. So my solution, to using NVM and change them to Node v14.16

            Everything works well, but when our team apply new eslint configuration. Yet, I still not sure whether eslint was causes the error or not.

            .eslintrc ...


            Answered 2022-Mar-17 at 00:11

            I had a similar problem with another module.

            The solution I found was to update both node (to v16) and npm (to v8).

            For Node, I used brew (but nvm should be OK).

            For npm, I used what the official doc says :

            npm install -g npm@latest

            Source https://stackoverflow.com/questions/69793334


            Async function not waiting for results even when used inside useEffect with await
            Asked 2022-Feb-25 at 15:16

            I have the following code within a component where I am using a cookie value to decide which component or div block to show.

            This works eventually as expected. But there is a short while where it seems like the cookie value is not checked yet.

            During this period, I keep entering the else block first. After a couple of seconds, I enter the if block correctly.

            But why? That Cookies.get is an async call. But I am calling it inside useEffect and using await.

            Could I please know how I could modify this so that if the cookie is existing, I will never enter the else block?



            Answered 2022-Feb-25 at 15:16

            Well first of all there is something that may be a future problem:

            Because Cookies.get('my-cookie') returns a Promise, it's an object. Using !! on objects always returns true (objects are truthy).

            So hasCookie should always return true?

            To make it properly test if it exists you should await the Promise until it resolves, then use !! on the resolved value:

            Source https://stackoverflow.com/questions/71267842


            typescript inferred never is not never?
            Asked 2022-Feb-20 at 11:13

            statement 1



            Answered 2022-Feb-20 at 11:13

            Conditional types distribute over unions. Distribution is the process by which a conditional type is applied to each union constituent and the result of each application is unioned. Distribution happens only if the condition is applied over a naked type parameter.

            Source https://stackoverflow.com/questions/71193522


            React slick compatibility with Nextjs
            Asked 2022-Jan-29 at 13:37

            I am planning to add React-slick library into my nextjs project for image slider, but getting an issue

            Tries installing "react-slick" and "slick-carousel" as mentioned in the docs by



            Answered 2021-Sep-22 at 23:05

            Just removed the tilde prefix

            Source https://stackoverflow.com/questions/69287823


            proxy server working in one case and failed in another case
            Asked 2022-Jan-23 at 14:57

            So i am working on eCommerce website in react and Node. coming to the point, at the time of login the proxy works totally fine but when i made get request to API it shows an error. I spent 2 days resolving this but at last came here with the hope to get the answer.

            My server.js file



            Answered 2022-Jan-23 at 14:57

            After hours of exploring the internet i couldn't get the answer of my problem, but debugging the code i found the problem. Actually it was one extra trailing slash in URL which made it to misbehave. I was like this before.

            The correct version will be.

            EXTRA NOTE: All those who have not found the solution from here should move forward to this link and look for trailing slash if found in your current URL, for making successful proxy you need to eliminate that trailing slash at the end of URL.

            Source https://stackoverflow.com/questions/70816731


            Issue with Upgrade from Tailwind v2 to v3 React Js using Craco
            Asked 2022-Jan-13 at 06:36

            I was using Tailwind v2 and when I am upgrading it to v3 it is giving me Postcss 8 Error (Error: PostCSS plugin tailwindcss requires PostCSS 8.). I tried to resolve this Error but did not succeed. Is there any way I can use Tailwind Cli in React Js. Error ScreenShoot



            Answered 2022-Jan-13 at 06:36

            tailwindcss v3 only supports Postcss8 and only create-react-app v5 supports Postcss8 for now. So you need to upgrade the create-react-app to v5. No need for craco in create-react-app v5 as well

            First make sure to checkout to different branch or push your code to github before migrating, just for safety.

            1.First run npm uninstall @craco/craco autoprefixer postcss tailwindcss
            Delete the craco.config.js file
            Delete the tailwind.config.js
            Now just follow the offical tailwindcss docs
            2. Run npm install -D tailwindcss postcss autoprefixer
            3. npx tailwindcss init -p
            copy paste the tailwind.config.js file from tailwindcss docs
            4. npm install react-scripts@latest
            5. Now npm start

            Later paste your previous tailwind.config theme in the new tailwind.config.js file.

            The order of steps may or may not matter but following this steps worked for me.

            Source https://stackoverflow.com/questions/70627316


            Using the MUI DatePicker with yup and react-hook-form - the error prop doesn't work as intended
            Asked 2022-Jan-09 at 13:32

            I'm working on a registration form made with yup, react-hook-form and MUI DatePicker/TextField. I'd like to have a date of birth field that checks if the user is above 18 years old. The error message is displayed correcly but the red color of the error state works only if the input is empty (and not when the age is below 18). I'm console logging the value of "invalid" that dictates the red color, and it is set to true when it should.

            Here is a sandbox link: https://codesandbox.io/s/datepicker-yup-validation-8rod3?file=/src/App.js



            Answered 2022-Jan-09 at 06:04

            this solution was wrote with formik , yup and material datepicker :

            Source https://stackoverflow.com/questions/70634443


            how to remove whitespace from password validation in react
            Asked 2021-Dec-21 at 05:41

            In password field if I give "Password@345" its accepted and right but if I give "Password @ 345" its also accepted but its should not accepted because condition is there is no whitespace, how to remove the whitespace that if I type password with whitespace it should give error.



            Answered 2021-Dec-21 at 05:38

            By using yup you can define multiple match on your schema, so in your issue, you can define a separate match to check if password contains space or not and then apply other validation terms. like below example:

            Source https://stackoverflow.com/questions/70430896

            Community Discussions, Code Snippets contain sources that include Stack Exchange Network


            No vulnerabilities reported

            Install yup

            Schema are comprised of parsing actions (transforms) as well as assertions (tests) about the input value. Validate an input value to parse it and run the configured set of assertions. Chain together methods to build a schema. Use a schema to coerce or "cast" an input value into the correct type, and optionally transform that value into more concrete and specific values, without making further assertions. Know that your input value is already parsed? You can "strictly" validate an input, and avoid the overhead of running parsing logic.


            For any new features, suggestions and bugs create an issue on GitHub. If you have any questions check and ask questions on community page Stack Overflow .
            Find more information at:

            Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items

            Find more libraries
          • npm

            npm i yup

          • CLONE
          • HTTPS


          • CLI

            gh repo clone jquense/yup

          • sshUrl


          • Stay Updated

            Subscribe to our newsletter for trending solutions and developer bootcamps

            Agree to Sign up and Terms & Conditions

            Share this Page

            share link

            Explore Related Topics

            Consider Popular Validation Libraries


            by validatorjs


            by sideway


            by jquense


            by jquery-validation


            by go-playground

            Try Top Libraries by jquense


            by jquenseJavaScript


            by jquenseTypeScript


            by jquenseTypeScript


            by jquenseJavaScript


            by jquenseJavaScript