Helper functions for react projects.
npm:
npm install hytzen-helpers
yarn:
yarn add hytzen-helpers
money
: Format a value to a currency shape.percent
: Format a value to a percentage shape.date
: Format a date string to specific shape.isValidateEmail
: Check if the input is valid email.isValidateCPF
: Check if the input is valid CPF.numonly
: Returns numeric characters only.numtostr
: Transform a number to a string.strtonum
: Transform a string to a number.randonfy
: Randomly change the order of an array.generateArrayOfNumbers
: Generate an array from x to y.generateArrayWithXPositions
: Generate an array with x positions.generateMongoObjectId
: Generate a random mongo object ID.getFirstLetters
: Return the two first letters of a string.getFirstName
: Return the first name of a string.ctc
: concat tailwind classNames.makePrismaFilter
: Generate a string filter for prisma queries.px2num
convertPXToREM
convertPXToVH
useBreakpoint
useSkipFirstRender
useLocalStorage
useToggle
useFetch
useKeyPress
useDebounce
useOnScreen
money(100)
// result: R$100,00
money(100, {
locale: 'en-US',
currency: 'USD',
})
// result: $100.00
percent(100)
// result: 100%
percent(0.2525, {
locale: 'pt-BR',
maximumFractionDigits: 2,
})
// result: 0.25%
date(new Date().toString())
// result: 01/01/2023
date(new Date().toString(), {
locale: 'pt-BR',
dateStyle: 'short' // 'full' | 'long' | 'medium' | 'short'
withHour: true
onlyHour: false
})
// result: 01/01/2023 às 12:00
isValidateEmail('[email protected]')
// result: true
isValidateEmail('johndoe')
// result: false
isValidateCPF('123.456.789-00')
// result: false
numonly('123.456.789-09')
// result: 12345678909
numtostr(123)
// result: '123'
strtonum('123')
// result: 123
randonfy([1, 2, 3, 4, 5])
// result: [3, 5, 1, 4, 2]
generateArrayOfNumbers(1, 4)
// result: [1, 2, 3, 4]
generateArrayOfNumbers(4)
// result: [0, 1, 2, 3]
generateMongoObjectId()
// result: 63e2ab7da20f7c26aaab97e9
getFirstLetters('John Doe')
// result: JD
getFirstLetters('John')
// result: JO
getFirstName('John Doe')
// result: John
<div className={c('w-full', 'bg-black')} />
const filterString = JSON.stringify({
...makePrismaFilter('johndoe', {
OR: ['username'],
}),
})
px2num('16px')
// result: 16
convertPXToREM('16px')
// result: 1rem
convertPXToVH('16px')
// result: 1.62vh
Each PR should be specific and isolated to the issue you're trying to fix. Please do not stack features/chores/refactors/enhancements in one PR. Describe your feature/implementation in the PR. If you're unsure its useful or if it is a major change, please open an issue first and get feedback.
- Comment your code
- Write clean code
MIT
Made with ❤️ by Samara Carvalho