27 lines
802 B
TypeScript
27 lines
802 B
TypeScript
import { createContext, FC, PropsWithChildren, useContext } from 'react'
|
|
import styles from './Section.module.css'
|
|
import cx from 'classnames'
|
|
|
|
type SectionContextType = 'primary' | 'secondary' | 'tertiary' | undefined
|
|
|
|
interface Props {
|
|
color?: SectionContextType
|
|
}
|
|
|
|
const SectionContext = createContext<SectionContextType>(undefined)
|
|
export const useSectionColor = () => useContext(SectionContext)
|
|
|
|
export const Section: FC<PropsWithChildren<Props>> = ({ color, children }) => {
|
|
return (
|
|
<div
|
|
className={cx(styles.content, {
|
|
[styles.primary]: color === 'primary',
|
|
[styles.secondary]: color === 'secondary',
|
|
[styles.tertiary]: color === 'tertiary'
|
|
})}
|
|
>
|
|
<SectionContext.Provider value={color}>{children}</SectionContext.Provider>
|
|
</div>
|
|
)
|
|
}
|