@adaptabletools/adaptable
Version:
Powerful AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
42 lines (41 loc) • 1.61 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import * as React from 'react';
import { twMerge } from '../twMerge';
import { cn } from '../lib/utils';
const ALIGN_ITEMS_MAP = {
center: 'twa:items-center',
'flex-start': 'twa:items-start',
start: 'twa:items-start',
'flex-end': 'twa:items-end',
end: 'twa:items-end',
stretch: 'twa:items-stretch',
baseline: 'twa:items-baseline',
};
const FLEX_DIRECTION_MAP = {
row: 'twa:flex-row',
column: 'twa:flex-col',
};
const JUSTIFY_CONTENT_MAP = {
'space-between': 'twa:justify-between',
'space-around': 'twa:justify-around',
'space-evenly': 'twa:justify-evenly',
'space-start': 'twa:justify-start',
'space-end': 'twa:justify-end',
center: 'twa:justify-center',
};
const FLEX_WRAP_MAP = {
wrap: 'twa:flex-wrap',
nowrap: 'twa:flex-nowrap',
'wrap-reverse': 'twa:flex-wrap-reverse',
};
export const Flex = React.forwardRef((props, ref) => {
const { className: _, flexDirection, alignItems, justifyContent, flexWrap, as, ...domProps } = props;
const className = cn('twa:flex', 'twa:box-border', FLEX_DIRECTION_MAP[flexDirection], ALIGN_ITEMS_MAP[alignItems], JUSTIFY_CONTENT_MAP[justifyContent], FLEX_WRAP_MAP[flexWrap]);
const Cmp = (as || 'div');
return (_jsx(Cmp, { ref: ref, ...domProps, className: twMerge(className, props.className) }));
});
export const Box = React.forwardRef((props, ref) => {
const { className, as, ...domProps } = props;
const Cmp = (as || 'div');
return (_jsx(Cmp, { ref: ref, ...domProps, className: twMerge('twa:box-border', className) }));
});