"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 Widget
 */
Object.defineProperty(exports, "__esModule", { value: true });
exports.FloatingTab = void 0;
require("./FloatingTab.scss");
const classnames_1 = require("classnames");
const React = require("react");
const core_react_1 = require("@itwin/core-react");
const DragManager_1 = require("../base/DragManager");
const NineZone_1 = require("../base/NineZone");
const LayoutStore_1 = require("../base/LayoutStore");
/** Component that displays a floating tab.
 * @internal
 */
function FloatingTab() {
    const { id, position } = (0, LayoutStore_1.useLayout)((state) => {
        const draggedTab = state.draggedTab;
        return {
            id: draggedTab?.tabId,
            position: draggedTab?.position,
        };
    }, true);
    const { iconSpec, label } = (0, LayoutStore_1.useLayout)((state) => {
        const tabId = state.draggedTab?.tabId;
        const tab = tabId ? state.tabs[tabId] : undefined;
        return {
            iconSpec: tab?.iconSpec,
            label: tab?.label,
        };
    }, true);
    const dispatch = React.useContext(NineZone_1.NineZoneDispatchContext);
    const onDrag = React.useCallback((dragBy) => {
        id &&
            dispatch({
                type: "WIDGET_TAB_DRAG",
                dragBy,
            });
    }, [dispatch, id]);
    const onDragEnd = React.useCallback((target) => {
        id &&
            dispatch({
                type: "WIDGET_TAB_DRAG_END",
                id,
                target,
            });
    }, [dispatch, id]);
    (0, DragManager_1.useDragTab)({
        tabId: id || "",
        onDrag,
        onDragEnd,
    });
    const showWidgetIcon = React.useContext(NineZone_1.ShowWidgetIconContext);
    const style = position && {
        transform: `translate(${position.x}px, ${position.y}px)`,
    };
    const className = (0, classnames_1.default)("nz-widget-floatingTab", !position && "nz-hidden");
    return (React.createElement("div", { className: className, style: style },
        showWidgetIcon && iconSpec && React.createElement(core_react_1.Icon, { iconSpec: iconSpec }),
        React.createElement("span", null, label)));
}
exports.FloatingTab = FloatingTab;
//# sourceMappingURL=FloatingTab.js.map