32 lines
890 B
TypeScript
32 lines
890 B
TypeScript
import type { ReactNode } from 'react';
|
|
import './layouts.css';
|
|
|
|
export interface EcommerceLayoutProps {
|
|
header?: ReactNode;
|
|
navigation?: ReactNode;
|
|
sidebar?: ReactNode;
|
|
mainContent: ReactNode;
|
|
footer?: ReactNode;
|
|
}
|
|
|
|
export function EcommerceLayout({
|
|
header,
|
|
navigation,
|
|
sidebar,
|
|
mainContent,
|
|
footer
|
|
}: EcommerceLayoutProps) {
|
|
return (
|
|
<div className="shared-layout shared-layout--ecommerce">
|
|
{header && <header className="shared-layout__header">{header}</header>}
|
|
{navigation && <nav className="shared-layout__navigation">{navigation}</nav>}
|
|
<div className="shared-layout__content">
|
|
{sidebar && <aside className="shared-layout__sidebar">{sidebar}</aside>}
|
|
<main className="shared-layout__main">{mainContent}</main>
|
|
</div>
|
|
{footer && <footer className="shared-layout__footer">{footer}</footer>}
|
|
</div>
|
|
);
|
|
}
|
|
|