From 4f1181581e177dd80a76165a0f930ef4577f9c6a Mon Sep 17 00:00:00 2001 From: Armand Philippot Date: Wed, 22 Nov 2023 19:07:25 +0100 Subject: refactor(components): integrate sectioned page template into Page * replace Section component by a generic one (other components should be able to use it) * add a PageSection component * add `hasSections` prop to Page component * remove sectioned-page template --- src/components/atoms/layout/section/section.tsx | 41 +++++-------------------- 1 file changed, 7 insertions(+), 34 deletions(-) (limited to 'src/components/atoms/layout/section/section.tsx') diff --git a/src/components/atoms/layout/section/section.tsx b/src/components/atoms/layout/section/section.tsx index 63c658a..63a2499 100644 --- a/src/components/atoms/layout/section/section.tsx +++ b/src/components/atoms/layout/section/section.tsx @@ -2,45 +2,18 @@ import { forwardRef, type ForwardRefRenderFunction, type HTMLAttributes, - type ReactNode, } from 'react'; -import styles from './section.module.scss'; -export type SectionVariant = 'dark' | 'light'; - -export type SectionProps = Omit, 'children'> & { - /** - * The section content. - */ - children: ReactNode | ReactNode[]; - /** - * Add a border at the bottom of the section. - * - * @default false - */ - hasBorder?: boolean; - /** - * The section variant. - * - * @default 'light' - */ - variant?: SectionVariant; -}; +export type SectionProps = HTMLAttributes; const SectionWithRef: ForwardRefRenderFunction = ( - { children, className = '', hasBorder = false, variant = 'light', ...props }, + { children, ...props }, ref -) => { - const borderClass = hasBorder ? styles[`wrapper--borders`] : ''; - const variantClass = styles[`wrapper--${variant}`]; - const sectionClass = `${styles.wrapper} ${borderClass} ${variantClass} ${className}`; - - return ( -
- {children} -
- ); -}; +) => ( +
+ {children} +
+); /** * Section component -- cgit v1.2.3