🔥 take: spacing belongs to markup.

Whitespace and flow is so important I'd rather be explicit about it. It follows the reusability principle of being open to composing variants.

import {Spacer} from'@/core';

// Default min-height, aria-hidden="true"
<Spacer/>

// Composed variant
function SpacerSection(props: Omit<Props, 'em'>) {
    return <Spacer {...props} space={34} />;
}

// Use variant
import {SpacerSection} from'@/composed';
<TitleComponent/>
<SpacerSection/>
<ContentComponent/>

Code snippet hidden

Your screen is too small.