Shop-Storefront/src/modules/layout/templates/vt-banner/banner-nav.tsx

26 lines
1.1 KiB
TypeScript

import { DynamicLayoutRenderer } from "vibentec/renderer"
import { LayoutComponentDefinition, LayoutContext } from "vibentec/component-map";
interface BannerNavProps {
left?: LayoutComponentDefinition[]
center?: LayoutComponentDefinition[]
right?: LayoutComponentDefinition[]
}
export default function BannerNav({ node, context }: { node: LayoutComponentDefinition; context: LayoutContext }) {
const props = node.config as BannerNavProps ?? {};
return (
<nav className="content-container txt-xsmall-plus flex items-center justify-between w-full h-full text-small-regular">
<div className="flex items-center gap-x-4 w-full h-full">
{props.left && <DynamicLayoutRenderer nodes={props.left} context={context} />}
</div>
<div className="flex items-center gap-x-4 w-full h-full">
{props.center && <DynamicLayoutRenderer nodes={props.center} context={context} />}
</div>
<div className="flex items-center gap-x-4 w-full h-full justify-end">
{props.right && <DynamicLayoutRenderer nodes={props.right} context={context} />}
</div>
</nav>
)
}