Hytzen-helpers NPM

📌 hytzen-helpers

Helper functions for react projects.

🚀 Getting started

npm:

npm install hytzen-helpers

yarn:

yarn add hytzen-helpers

📃 Documentation

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

Hooks

useBreakpoint
useSkipFirstRender
useLocalStorage
useToggle
useFetch
useKeyPress
useDebounce
useOnScreen

💻 Examples

money()

money(100)

// result: R$100,00

money(100, {
  locale: 'en-US',
  currency: 'USD',
})

// result: $100.00

percent()

percent(100)

// result: 100%

percent(0.2525, {
  locale: 'pt-BR',
  maximumFractionDigits: 2,
})

// result: 0.25%

date()

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()

isValidateEmail('johndoe@mail.com')

// result: true

isValidateEmail('johndoe')

// result: false

isValidateCPF()

isValidateCPF('123.456.789-00')

// result: false

numonly()

numonly('123.456.789-09')

// result: 12345678909

numtostr()

numtostr(123)

// result: '123'

strtonum()

strtonum('123')

// result: 123

randonfy()

randonfy([1, 2, 3, 4, 5])

// result: [3, 5, 1, 4, 2]

generateArrayOfNumbers()

generateArrayOfNumbers(1, 4)

// result: [1, 2, 3, 4]

generateArrayWithXPositions()

generateArrayOfNumbers(4)

// result: [0, 1, 2, 3]

generateMongoObjectId()

generateMongoObjectId()

// result: 63e2ab7da20f7c26aaab97e9

getFirstLetters()

getFirstLetters('John Doe')

// result: JD

getFirstLetters('John')

// result: JO

getFirstName()

getFirstName('John Doe')

// result: John

ctc()

<div className={c('w-full', 'bg-black')} />

makePrismaFilter()

const filterString = JSON.stringify({
  ...makePrismaFilter('johndoe', {
    OR: ['username'],
  }),
})

px2num()

px2num('16px')

// result: 16

convertPXToREM()

convertPXToREM('16px')

// result: 1rem

convertPXToVH()

convertPXToVH('16px')

// result: 1.62vh

⭐ Contributing

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.