Fix drawer story

The original implementation was relying on a quirk of how the container rect used to be measured without considering transforms. The new measuring strategy is no longer transform agnostic, therefore we cannot rely on the `top` coordinates of the container node rect as they include transforms.

In the future, it may be possible to open up configuring how the container node rect is measured to consumers if the need arises.

Author: clauderic

stories/3 - Examples/Drawer/Drawer.module.css

@@ -20,7 +20,7 @@ $content-background-color: #fefefe;
   flex-direction: column;
   width: 100%;
   max-width: 500px;
-  max-height: 75vh;
+  max-height: var(--max-height);
   transition: transform 200ms ease;
   transform: translate3d(
     0,

stories/3 - Examples/Drawer/Sheet.tsx

@@ -3,6 +3,7 @@ import classNames from 'classnames';
 import {useDraggable} from '@dnd-kit/core';
 
 import {Header} from './Header';
+import {MAX_DRAWER_HEIGHT_PERCENT} from './constants';
 
 import styles from './Drawer.module.css';
 
@@ -31,6 +32,7 @@ export function Sheet({children, expanded, header}: Props) {
       })}
       style={
         {
+          '--max-height': `${MAX_DRAWER_HEIGHT_PERCENT * 100}vh`,
           '--transform': transform ? `${transform.y}px` : undefined,
         } as React.CSSProperties
       }

stories/3 - Examples/Drawer/constants.ts

@@ -2,3 +2,5 @@ export enum Region {
   Collapse = 'collapse',
   Expand = 'expand',
 }
+
+export const MAX_DRAWER_HEIGHT_PERCENT = 0.75;

stories/3 - Examples/Drawer/modifiers.ts

@@ -1,16 +1,22 @@
 import type {ClientRect, Modifier} from '@dnd-kit/core';
 import type {Transform} from '@dnd-kit/utilities';
 
+import {MAX_DRAWER_HEIGHT_PERCENT} from './constants';
+
 export const rubberbandModifier: Modifier = ({
-  containerNodeRect,
   draggingNodeRect,
   transform,
+  windowRect,
 }) => {
-  if (!draggingNodeRect || !containerNodeRect) {
+  if (!draggingNodeRect || !windowRect) {
     return transform;
   }
 
-  return rubberbandBoundingRect(transform, draggingNodeRect, containerNodeRect);
+  return rubberbandBoundingRect(transform, draggingNodeRect, {
+    ...windowRect,
+    top: (1 - MAX_DRAWER_HEIGHT_PERCENT) * windowRect.height,
+    height: MAX_DRAWER_HEIGHT_PERCENT * windowRect.height,
+  });
 };
 
 function rubberbandBoundingRect(