"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 ToolSettings
 */
Object.defineProperty(exports, "__esModule", { value: true });
exports.ToolSettingsZone = void 0;
const React = require("react");
const appui_layout_react_1 = require("@itwin/appui-layout-react");
const SafeAreaContext_1 = require("../../safearea/SafeAreaContext");
const UiFramework_1 = require("../../UiFramework");
const FrameworkZone_1 = require("../FrameworkZone");
const Outline_1 = require("../Outline");
const useEscapeSetFocusToHome_1 = require("../../hooks/useEscapeSetFocusToHome");
const ZoneTargets_1 = require("../../dragdrop/ZoneTargets");
// cSpell:ignore safearea
/** State for the ToolSettingsZone content.
 */
var ToolSettingsZoneContent;
(function (ToolSettingsZoneContent) {
    ToolSettingsZoneContent[ToolSettingsZoneContent["Closed"] = 0] = "Closed";
    ToolSettingsZoneContent[ToolSettingsZoneContent["ToolSettings"] = 1] = "ToolSettings";
})(ToolSettingsZoneContent || (ToolSettingsZoneContent = {}));
/** Tool Settings Zone React component.
 * @internal
 */
class ToolSettingsZone extends React.PureComponent {
    constructor(props) {
        super(props);
        this._hiddenVisibility = {
            visibility: "hidden",
        };
        this._widget = React.createRef();
        this._handleToolActivatedEvent = () => {
            // Update tool settings title when active tool changes.
            const title = `${UiFramework_1.UiFramework.toolSettings.activeToolLabel}`;
            this.setState({ title });
        };
        this._processClick = () => {
            this.setState((prevState) => {
                let toolSettingsZoneContent = ToolSettingsZoneContent.Closed;
                if (prevState.toolSettingsZoneContent === ToolSettingsZoneContent.Closed)
                    toolSettingsZoneContent = ToolSettingsZoneContent.ToolSettings;
                return {
                    toolSettingsZoneContent,
                };
            });
        };
        this._handleDragStart = (initialPosition) => {
            if (!this._widget.current)
                return;
            const bounds = this._widget.current.getBounds();
            this.props.widgetChangeHandler.handleTabDragStart(this.props.zone.id, 0, initialPosition, bounds);
        };
        this._handleResize = (resizeBy, handle) => {
            this.props.widgetChangeHandler.handleResize(this.props.zone.id, resizeBy, handle, 0);
        };
        const title = `${UiFramework_1.UiFramework.toolSettings.activeToolLabel}`;
        this.state = {
            toolSettingsZoneContent: this.props.isClosed ? ToolSettingsZoneContent.Closed : ToolSettingsZoneContent.ToolSettings,
            title,
        };
    }
    componentDidMount() {
        UiFramework_1.UiFramework.frontstages.onToolActivatedEvent.addListener(this._handleToolActivatedEvent);
    }
    componentWillUnmount() {
        UiFramework_1.UiFramework.frontstages.onToolActivatedEvent.removeListener(this._handleToolActivatedEvent);
    }
    render() {
        const bounds = (0, FrameworkZone_1.getFloatingZoneBounds)(this.props.zone);
        const zIndexStyle = (0, FrameworkZone_1.getFloatingZoneStyle)(this.props.zone);
        return (React.createElement(SafeAreaContext_1.SafeAreaContext.Consumer, null, (safeAreaInsets) => (React.createElement("span", { style: zIndexStyle },
            React.createElement(appui_layout_react_1.Zone, { bounds: bounds, className: this.props.className, id: this.props.zone.id, isFloating: !!this.props.zone.floating, isHidden: this.props.isHidden, safeAreaInsets: safeAreaInsets, style: this.props.style }, this.getToolSettingsWidget()),
            React.createElement(appui_layout_react_1.Zone, { bounds: this.props.zone.bounds, id: this.props.zone.id, safeAreaInsets: safeAreaInsets },
                React.createElement(ZoneTargets_1.ZoneTargets, { zoneId: this.props.zone.id, dropTarget: this.props.dropTarget, targetChangeHandler: this.props.targetChangeHandler })),
            React.createElement(Outline_1.Outline, { bounds: this.props.targetedBounds })))));
    }
    getToolSettingsWidget() {
        if (this.state.toolSettingsZoneContent === ToolSettingsZoneContent.Closed) {
            return (React.createElement(appui_layout_react_1.ToolSettingsTab, { onClick: this._processClick, onKeyDown: useEscapeSetFocusToHome_1.onEscapeSetFocusToHome, title: this.state.title, onMouseEnter: UiFramework_1.UiFramework.visibility.handleWidgetMouseEnter },
                React.createElement("i", { className: "icon icon-settings" })));
        }
        return (React.createElement(appui_layout_react_1.ToolSettings, { buttons: React.createElement("div", { style: this.props.zone.floating && this._hiddenVisibility },
                React.createElement(appui_layout_react_1.TitleBarButton, { onClick: this._processClick, title: UiFramework_1.UiFramework.translate("general.minimize") },
                    React.createElement("i", { className: "icon icon-chevron-up" }))), contentRef: this.props.getWidgetContentRef(this.props.zone.id), fillZone: this.props.zone.isLayoutChanged && !!this.props.zone.floating, lastPosition: this.props.lastPosition, onDrag: this.props.zone.allowsMerging ? this.props.widgetChangeHandler.handleTabDrag : undefined, onDragEnd: this.props.widgetChangeHandler.handleTabDragEnd, onDragStart: this._handleDragStart, onResize: this.props.zone.floating && this._handleResize, onMouseEnter: UiFramework_1.UiFramework.visibility.handleWidgetMouseEnter, ref: this._widget, title: this.state.title }));
    }
}
exports.ToolSettingsZone = ToolSettingsZone;
//# sourceMappingURL=ToolSettingsZone.js.map