phx-react
Version:
PHX REACT
9 lines • 1.02 kB
JavaScript
import React from 'react';
import { classNames } from '../types';
import { spacingMap } from '../Box';
export function PHXHorizontalStack({ justify, items, gapX, gapY, children, fullWidth = false }) {
const customHorizon = classNames(justify === 'start' && 'justify-start', justify === 'end' && 'justify-end', justify === 'center' && 'justify-center', justify === 'around' && 'justify-around', justify === 'between' && 'justify-between', justify === 'evenly' && 'justify-evenly', justify === 'stretch' && 'justify-stretch', items === 'start' && 'items-start', items === 'end' && 'items-end', items === 'center' && 'items-center', items === 'baseline' && 'items-baseline', items === 'stretch' && 'items-stretch');
const getSpacing = (prefix, val) => (val ? `${prefix}-${spacingMap[val]}` : '');
return (React.createElement("div", { className: `flex ${getSpacing('gap-x', gapX)} ${getSpacing('gap-y', gapY)} ${customHorizon} ${fullWidth ? 'w-full' : ''}` }, children));
}
//# sourceMappingURL=HorizontalStack.js.map