"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.UISection = exports.UISectionLayout = void 0;
const react_1 = __importDefault(require("react"));
const react_2 = require("@fluentui/react");
require("./UISection.scss");
var UISectionLayout;
(function (UISectionLayout) {
    UISectionLayout["Standard"] = "standard";
    UISectionLayout["Extended"] = "extended";
})(UISectionLayout || (exports.UISectionLayout = UISectionLayout = {}));
/**
 * Section Component.
 *
 * @exports
 * @class {UISection}
 * @extends {React.Component<UISectionProps>}
 */
class UISection extends react_1.default.Component {
    onScroll() {
        if (this.props.onScroll) {
            this.props.onScroll();
        }
    }
    /**
     * @returns {React.ReactElement}
     */
    render() {
        const scrollable = this.props.scrollable === undefined || this.props.scrollable;
        const style = {};
        const layout = this.props.layout ?? UISectionLayout.Standard;
        if ('height' in this.props) {
            style.height = this.props.height;
        }
        const divProps = (0, react_2.getNativeProps)(this.props, react_2.divProperties, [
            'onScroll',
            'className',
            'children'
        ]);
        return (react_1.default.createElement("div", { ...divProps, className: `section${this.props.className ? ' ' + this.props.className : ''} section--${layout}${scrollable ? ' section--scrollable' : ''}${this.props.cleanPadding ? ' section--clean' : ''}${this.props.hidden ? ' section--hidden' : ''}`, style: style, ref: this.props.rootRef },
            this.props.title && (react_1.default.createElement("div", { className: "section__header" },
                react_1.default.createElement("div", null,
                    react_1.default.createElement("span", { className: "section__header__title ui-medium-header" }, this.props.title)))),
            react_1.default.createElement("div", { className: "section__body", onScroll: this.onScroll.bind(this) }, this.props.children)));
    }
}
exports.UISection = UISection;
//# sourceMappingURL=UISection.js.map