Skip to content

Instantly share code, notes, and snippets.

@beardcoder

beardcoder/01_before.js

Last active Jan 12, 2021
Embed
What would you like to do?
Mapping Pattern
export const useColorName = (color: string): any => {
const additionalColorClassNames = []
const additionalTextColorClassNames = []
switch (color) {
case 'primary':
additionalColorClassNames.push('bg-primary border-primary-light')
break
case 'secondary':
additionalColorClassNames.push('bg-secondary border-secondary-light')
break
case 'tertiary':
additionalColorClassNames.push('bg-tertiary border-tertiary-light')
break
case 'quaternary':
additionalColorClassNames.push('bg-quaternary border-quaternary-light')
break
case 'quinary':
additionalColorClassNames.push('bg-quinary border-quinary-light')
break
case 'gray':
additionalColorClassNames.push('bg-gray border-gray-light')
break
default:
additionalColorClassNames.push('bg-primary border-primary-light')
break
}
return { additionalColorClassNames }
}
export default useColorName
const mappingColorClasses = {
primary: 'bg-primary border-primary-light',
secondary: 'bg-secondary border-secondary-light',
tertiary: 'bg-tertiary border-tertiary-light',
quaternary: 'bg-quaternary border-quaternary-light',
quinary: 'bg-quinary border-quinary-light',
gray: 'bg-gray border-gray-light',
}
export const useColorName = (color: keyof typeof mappingColorClasses): any => {
const additionalColorClassNames =
mappingColorClasses[color] || mappingColorClasses.primary
return { additionalColorClassNames }
}
export default useColorName
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment