/* @oracle/oraclejet-preact: undefined */
import { jsx, jsxs } from 'preact/jsx-runtime';
import { F as Flex } from './Flex-ce31b351.js';
import { p as paddingInterpolations } from './padding-28c96aec.js';
import { m as mergeInterpolations } from './mergeInterpolations-e2db2a66.js';
import './DatePickerLayoutStyles.styles.css';
import { u as useTestId } from './useTestId-9b504481.js';
import './classNames-4e12b00d.js';
import './boxalignment-a90bc50d.js';
import './size-18139a3a.js';
import './utils-a4102e03.js';
import './Common/themes/themeContract.css.js';
import './colorUtils-16eb823f.js';
import './_curry1-25297e59.js';
import './arrayUtils-35a58161.js';
import './boxalignment.styles.css';
import './vanilla-extract-sprinkles-createRuntimeSprinkles.esm-2d655d37.js';
import './dimensions-d4159ace.js';
import './flexbox-529f25da.js';
import './flexbox.styles.css';
import './flexitem-7b7f7920.js';
import './flexitem.styles.css';
import './FlexStyles.styles.css';
import './mergeDeepWithKey-08531060.js';
import './_curry3-0b4222d7.js';
import './_curry2-34316bcf.js';
import './_isObject-1fab0f5b.js';
import './LayerHost-e6402730.js';
import './Common/themes/redwood/theme.js';
import 'preact';
import 'preact/compat';
import './UNSAFE_Layer/themes/LayerHostStyles.css.js';
import './LayerHostStyles.styles.css';
import 'preact/hooks';

var containerStyles = 'DatePickerLayoutStyles_containerStyles__q124vl0';

const interpolations = [...Object.values(paddingInterpolations)];
const mergedInterpolations = mergeInterpolations(interpolations);
/**
 * The DatePickerLayout component can be used to layout the contents
 * of the DatePicker, like header and the main content.
 */
const DatePickerLayout = ({ children, gap = '4x', header, padding, paddingBlockEnd = '4x', paddingBlockStart = '4x', paddingInlineEnd = '4x', paddingInlineStart = '4x', testId }) => {
    const styles = mergedInterpolations({
        padding,
        paddingBlockEnd,
        paddingBlockStart,
        paddingInlineEnd,
        paddingInlineStart
    });
    const testIdProps = useTestId(testId);
    return (jsx("div", { className: containerStyles, style: styles, ...testIdProps, children: jsxs(Flex, { direction: "column", gap: gap, children: [header, children] }) }));
};

export { DatePickerLayout };
//# sourceMappingURL=PRIVATE_DatePickerLayout.js.map
