@botonic/react
Version:
Build Chatbots using React
40 lines • 1.93 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.useWebchatDimensions = void 0;
const react_1 = require("react");
const context_1 = require("../../webchat/context");
const useWebchatDimensions = () => {
const { webchatContainerRef, headerRef, inputPanelRef, webchatState: { isWebchatOpen }, } = (0, react_1.useContext)(context_1.WebchatContext);
const calculateResizedPercentualWebchatHeight = (0, react_1.useCallback)(() => {
const webchatElement = webchatContainerRef.current;
if (!isWebchatOpen || !webchatElement)
return 0;
const webchatHeight = webchatElement.clientHeight || 0;
const keyboardOffset = (window.visualViewport && window.visualViewport.height) ||
window.innerHeight;
let newWebchatPercentualHeight = keyboardOffset / webchatHeight;
newWebchatPercentualHeight =
Math.round(newWebchatPercentualHeight * 100 * 100) / 100; // Two decimal places
return newWebchatPercentualHeight;
}, [isWebchatOpen]);
const calculateResizedPxChatAreaHeight = (0, react_1.useCallback)(() => {
const webchatElement = webchatContainerRef.current;
const headerElement = headerRef.current;
const inputPanelElement = inputPanelRef.current;
if (!isWebchatOpen || !webchatElement)
return 0;
const headerElementHeight = headerElement ? headerElement.clientHeight : 0;
const inputPanelElementHeight = inputPanelElement
? inputPanelElement.clientHeight
: 0;
return (webchatElement.clientHeight -
headerElementHeight -
inputPanelElementHeight);
}, [isWebchatOpen]);
return {
calculateResizedPercentualWebchatHeight,
calculateResizedPxChatAreaHeight,
};
};
exports.useWebchatDimensions = useWebchatDimensions;
//# sourceMappingURL=use-webchat-dimensions.js.map