components: move ViewHeightSensor

we've moved all of the other components already
This commit is contained in:
David Lechner
2022-11-29 10:59:15 -06:00
committed by David Lechner
parent 670f4a0d07
commit 49f3c5d8f3
3 changed files with 1 additions and 1 deletions
-11
View File
@@ -1,11 +0,0 @@
// SPDX-License-Identifier: MIT
// Copyright (c) 2021 The Pybricks Authors
import { render } from '@testing-library/react';
import React from 'react';
import ViewHeightSensor from './ViewHeightSensor';
it('should set the --pb-vh variable on resize', () => {
render(<ViewHeightSensor />);
// REVISIT: it is not easy to test the resize event since jest-dom doesn't do layout
});
-29
View File
@@ -1,29 +0,0 @@
// SPDX-License-Identifier: MIT
// Copyright (c) 2022 The Pybricks Authors
/* This is a hack for correctly sizing to view height on mobile when not running in fullscreen mode. */
import { ResizeSensor } from '@blueprintjs/core';
import React from 'react';
/* https://css-tricks.com/the-trick-to-viewport-units-on-mobile/ */
function ViewHeightSensor(): JSX.Element {
return (
<ResizeSensor
onResize={(e): void => {
document.documentElement.style.setProperty(
'--pb-vh',
`${e[0].contentRect.height}px`,
);
}}
>
<div
id="pb-vh"
style={{ height: '100%', width: '100%', position: 'absolute' }}
/>
</ResizeSensor>
);
}
export default ViewHeightSensor;