@awsui/components-react
Version:
On July 19th, 2022, we launched [Cloudscape Design System](https://cloudscape.design). Cloudscape is an evolution of AWS-UI. It consists of user interface guidelines, front-end components, design resources, and development tools for building intuitive, en
39 lines • 2.5 kB
JavaScript
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
// SPDX-License-Identifier: Apache-2.0
import React, { forwardRef } from 'react';
import clsx from 'clsx';
import InternalBox from '../../../box/internal.js';
import InternalSpaceBetween from '../../../space-between/internal.js';
import { getBaseProps } from '../../base-component/index.js';
import styles from './styles.css.js';
export const ChartWrapper = forwardRef(({ defaultFilter, additionalFilters, reserveFilterSpace, reserveLegendSpace, chartStatus, chart, legend, onBlur, contentClassName, contentMinHeight, fitHeight, ...props }, ref) => {
const baseProps = getBaseProps(props);
const filtersNode = (defaultFilter || additionalFilters) && (React.createElement(InternalBox, { className: styles['filter-container'], margin: { bottom: 'l' } },
React.createElement(InternalSpaceBetween, { size: "l", direction: "horizontal", className: clsx({ [styles['has-default-filter']]: !!defaultFilter }) },
defaultFilter,
additionalFilters)));
const legendNode = legend && React.createElement(InternalBox, { margin: { top: 'm' } }, legend);
if (fitHeight) {
return (React.createElement("div", { ref: ref, ...baseProps, className: clsx(baseProps.className, styles.wrapper, styles['wrapper--fit-height']), onBlur: onBlur },
React.createElement("div", { className: clsx(styles['inner-wrapper'], styles['inner-wrapper--fit-height']) },
filtersNode,
React.createElement("div", { className: clsx(styles.content, contentClassName, {
[styles['content--reserve-filter']]: reserveFilterSpace,
[styles['content--reserve-legend']]: reserveLegendSpace,
[styles['content--fit-height']]: true,
}) },
chartStatus,
chart),
legendNode)));
}
return (React.createElement("div", { ref: ref, ...baseProps, className: clsx(baseProps.className, styles.wrapper), onBlur: onBlur },
filtersNode,
React.createElement("div", { className: clsx(styles.content, contentClassName, {
[styles['content--reserve-filter']]: reserveFilterSpace,
[styles['content--reserve-legend']]: reserveLegendSpace,
}), style: { minHeight: contentMinHeight } },
chartStatus,
chart),
legendNode));
});
//# sourceMappingURL=index.js.map