"use strict";
/*---------------------------------------------------------------------------------------------
 * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
/** @packageDocumentation
 * @module WidgetPanels
 */
Object.defineProperty(exports, "__esModule", { value: true });
exports.SectionOutline = void 0;
require("./SectionOutline.scss");
const classnames_1 = require("classnames");
const React = require("react");
const core_bentley_1 = require("@itwin/core-bentley");
const DragManager_1 = require("../base/DragManager");
const Panel_1 = require("../widget-panels/Panel");
const SectionTarget_1 = require("../target/SectionTarget");
const DropTargetState_1 = require("../state/DropTargetState");
const LayoutStore_1 = require("../base/LayoutStore");
const SendBack_1 = require("../widget/SendBack");
/** @internal */
function SectionOutline(props) {
    const hidden = useHidden(props.sectionIndex);
    const direction = (0, SectionTarget_1.useTargetDirection)();
    const style = useSize(props.sectionIndex);
    const className = (0, classnames_1.default)("nz-outline-sectionOutline", `nz-${props.sectionIndex}`, `nz-${direction}`, hidden && "nz-hidden", props.className);
    return (React.createElement("div", { className: className, style: {
            ...(hidden ? {} : style),
            ...props.style,
        } }));
}
exports.SectionOutline = SectionOutline;
function useHidden(sectionIndex) {
    const side = React.useContext(Panel_1.PanelSideContext);
    const targeted = (0, DragManager_1.useTargeted)();
    const activeHomeState = (0, SendBack_1.useSendBackHomeState)();
    return React.useMemo(() => {
        if (activeHomeState &&
            activeHomeState.side === side &&
            activeHomeState.sectionIndex === sectionIndex)
            return false;
        if (!targeted)
            return true;
        if (!(0, DropTargetState_1.isSectionDropTargetState)(targeted))
            return true;
        if (targeted.sectionIndex !== sectionIndex)
            return true;
        if (targeted.side !== side)
            return true;
        return false;
    }, [targeted, side, sectionIndex, activeHomeState]);
}
function useSize(sectionIndex) {
    const side = React.useContext(Panel_1.PanelSideContext);
    (0, core_bentley_1.assert)(!!side);
    const splitterPercent = (0, LayoutStore_1.useLayout)((state) => state.panels[side].splitterPercent);
    return React.useMemo(() => {
        let size = splitterPercent;
        if (!size)
            return undefined;
        if (sectionIndex === 1)
            size = 100 - size;
        const style = {};
        if ((0, Panel_1.isHorizontalPanelSide)(side))
            style.width = `${size}%`;
        else
            style.height = `${size}%`;
        return style;
    }, [side, splitterPercent, sectionIndex]);
}
//# sourceMappingURL=SectionOutline.js.map