import styled , { css } from 'styled-components' ; const ResponsiveWrapper = styled . div < { responsive : boolean ; fixedHeader ? : boolean ; fixedHeaderScrollHeight ? : string ; } > `
	position: relative;
	width: 100%;
	border-radius: inherit;
	${ ( { responsive , fixedHeader } ) => responsive && css `
			overflow-x: auto;

			// hidden prevents vertical scrolling in firefox when fixedHeader is disabled
			overflow-y: ${ fixedHeader ? 'auto' : 'hidden' };
			min-height: 0;
		` };

	${ ( { fixedHeader = false , fixedHeaderScrollHeight = '100vh' } ) => fixedHeader && css `
			max-height: ${ fixedHeaderScrollHeight };
			-webkit-overflow-scrolling: touch;
		` };

	${ ( { theme } ) => theme . responsiveWrapper . style };
` ; export default ResponsiveWrapper ;