"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 StatusBar
 */
Object.defineProperty(exports, "__esModule", { value: true });
exports.SectionsStatusField = void 0;
const section_tool_svg_1 = require("@bentley/icons-generic/icons/section-tool.svg");
const core_frontend_1 = require("@itwin/core-frontend");
const core_react_1 = require("@itwin/core-react");
const itwinui_react_1 = require("@itwin/itwinui-react");
const classnames_1 = require("classnames");
const React = require("react");
const useActiveViewport_1 = require("../hooks/useActiveViewport");
const Dialog_1 = require("../statusbar/dialog/Dialog");
require("./SectionsField.scss");
const useTranslation_1 = require("../hooks/useTranslation");
const StatusBarPopover_1 = require("../statusbar/popup/StatusBarPopover");
/** Status Field for showing section extra tools for clearing and showing manipulators
 * @beta
 */
function SectionsStatusField(props) {
    const { translate } = (0, useTranslation_1.useTranslation)();
    const tooltip = translate("tools.sectionTools");
    const activeViewport = (0, useActiveViewport_1.useActiveViewport)();
    const [showIndicator, setShowIndicator] = React.useState(false);
    const [isPopupOpen, setPopupOpen] = React.useState(false);
    const [hasManipulatorsShown, setHasManipulatorsShown] = React.useState(false);
    React.useEffect(() => {
        const clipActive = !!activeViewport && !!activeViewport.view.getViewClip();
        setShowIndicator(clipActive || !props.hideWhenUnused);
        setHasManipulatorsShown(clipActive && !!activeViewport && !!core_frontend_1.ViewClipDecoration.get(activeViewport));
        return core_frontend_1.ViewClipDecorationProvider.create().onActiveClipChanged.addListener((viewport) => {
            if (viewport !== activeViewport)
                return;
            setHasManipulatorsShown(!!core_frontend_1.ViewClipDecoration.get(activeViewport));
            const isClipActive = !!activeViewport.view.getViewClip();
            setShowIndicator(isClipActive || !props.hideWhenUnused);
        });
    }, [activeViewport, props.hideWhenUnused, isPopupOpen]);
    const toggleManipulators = async (e) => {
        if (activeViewport) {
            setHasManipulatorsShown(e.target.checked);
            await core_frontend_1.ViewClipDecorationProvider.create().toggleDecoration(activeViewport);
        }
    };
    const handleClear = async () => {
        await core_frontend_1.IModelApp.tools.run(core_frontend_1.ViewClipClearTool.toolId, core_frontend_1.ViewClipDecorationProvider.create());
        setPopupOpen(false);
    };
    return (React.createElement(React.Fragment, null, showIndicator && (React.createElement(StatusBarPopover_1.StatusBarPopover, { visible: isPopupOpen, onVisibleChange: setPopupOpen, content: React.createElement(Dialog_1.StatusBarDialog, { titleBar: React.createElement(Dialog_1.StatusBarDialog.TitleBar, { title: tooltip }) },
            React.createElement("div", { className: "uifw-sections-footer-contents" },
                React.createElement(itwinui_react_1.Button, { onClick: handleClear }, translate("tools.sectionClear")),
                React.createElement("div", { className: "uifw-uifw-sections-toggle-container" },
                    React.createElement("div", { className: (0, classnames_1.default)("uifw-sections-label") }, translate("tools.sectionShowHandles")),
                    React.createElement(itwinui_react_1.ToggleSwitch, { className: "uifw-sections-toggle", onChange: toggleManipulators, checked: hasManipulatorsShown })))) },
        React.createElement(itwinui_react_1.IconButton, { label: tooltip, styleType: "borderless", "data-testid": "sections-status-field-button" },
            React.createElement(core_react_1.Icon, { iconSpec: section_tool_svg_1.default }),
            React.createElement(StatusBarPopover_1.StatusBarPopover.ExpandIndicator, null))))));
}
exports.SectionsStatusField = SectionsStatusField;
//# sourceMappingURL=SectionsField.js.map