Update layout components

This commit is contained in:
Bill 2021-12-29 11:45:05 -05:00
parent 84b8607b07
commit 0b6bb5c541
2 changed files with 26 additions and 9 deletions

View File

@ -0,0 +1,22 @@
import { FC, useMemo } from 'react';
import { Base, BaseProps } from './Base';
export interface ButtonGroupProps extends BaseProps<HTMLDivElement>
{
}
export const ButtonGroup: FC<ButtonGroupProps> = props =>
{
const { classNames = [], ...rest } = props;
const getClassNames = useMemo(() =>
{
const newClassNames: string[] = [ 'btn-group' ];
if(classNames.length) newClassNames.push(...classNames);
return newClassNames;
}, [ classNames ]);
return <Base classNames={ getClassNames } { ...rest } />;
}

View File

@ -44,16 +44,11 @@ export const Flex: FC<FlexProps> = props =>
if(gap) newClassNames.push('gap-' + gap);
if(center)
{
newClassNames.push('align-items-center', 'justify-content-center');
}
else
{
if(alignItems) newClassNames.push('align-items-' + alignItems);
if(alignItems) newClassNames.push('align-items-' + alignItems);
if(justifyContent) newClassNames.push('justify-content-' + justifyContent);
}
if(justifyContent) newClassNames.push('justify-content-' + justifyContent);
if(!alignItems && !justifyContent && center) newClassNames.push('align-items-center', 'justify-content-center');
if(classNames.length) newClassNames.push(...classNames);