"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var _chunkZUAO4DW3cjs = require('./chunk-ZUAO4DW3.cjs');


var _chunkKKOBB4X5cjs = require('./chunk-KKOBB4X5.cjs');


var _chunkSNSG4HBQcjs = require('./chunk-SNSG4HBQ.cjs');


var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');


var _chunkWF7Z2VITcjs = require('./chunk-WF7Z2VIT.cjs');


var _chunkRSHN4K6Ncjs = require('./chunk-RSHN4K6N.cjs');

// src/components/Drawer.tsx
var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
var _react = require('react');
var _jsxruntime = require('@emotion/react/jsx-runtime');
var Drawer = (props) => {
  const [isOpen, setIsOpen] = _react.useState.call(void 0, true);
  const [lastY, setLastY] = _react.useState.call(void 0, null);
  const [totalDeltaY, setTotalDeltaY] = _react.useState.call(void 0, 0);
  const [fractionVisible, setFractionVisible] = _react.useState.call(void 0, 1);
  const [grabbing, setGrabbing] = _react.useState.call(void 0, false);
  const drawerContainerRef = _react.useRef.call(void 0, null);
  const handleClose = () => {
    if (props.nonDismissable) {
      return;
    }
    setIsOpen(false);
    setTimeout(() => {
      props.onClose && props.onClose();
      setTotalDeltaY(0);
      setLastY(null);
    }, 300);
  };
  const handleTouchMove = (event) => {
    var _a, _b;
    if (props.nonDismissable || props.disableTouchMove) {
      return;
    }
    if (lastY === null) {
      setLastY(event.touches[0].clientY);
    } else {
      const deltaY = event.touches[0].clientY - lastY;
      const topOfDrawer = (((_a = drawerContainerRef.current) == null ? void 0 : _a.getBoundingClientRect().top) || 0) + window.scrollY;
      const drawerContainerHeight = ((_b = drawerContainerRef.current) == null ? void 0 : _b.getBoundingClientRect().height) || 1;
      const newFractionVisible = Math.min(
        1,
        (window.innerHeight - topOfDrawer) / drawerContainerHeight
      );
      setFractionVisible(newFractionVisible);
      setLastY(event.touches[0].clientY);
      setTotalDeltaY((prev) => Math.max(prev + deltaY, 0));
    }
  };
  const handleTouchStart = () => {
    if (props.nonDismissable || props.disableTouchMove) {
      return;
    }
    setGrabbing(true);
  };
  const handleTouchEnd = () => {
    if (props.nonDismissable || props.disableTouchMove) {
      return;
    }
    setGrabbing(false);
    if (fractionVisible < 0.8) {
      handleClose();
    }
    setTotalDeltaY(0);
    setLastY(null);
  };
  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
      Background,
      {
        isOpen,
        fractionVisible,
        onClick: handleClose
      }
    ),
    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
      DrawerContainer,
      {
        isOpen,
        onTouchMove: handleTouchMove,
        onTouchStart: handleTouchStart,
        onTouchEnd: handleTouchEnd,
        totalDeltaY,
        grabbing,
        ref: drawerContainerRef,
        top: props.top,
        children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
          DrawerInnerContainer,
          {
            kind: props.kind,
            padding: props.padding,
            alignBottom: props.alignBottom,
            children: [
              props.grabber && !props.nonDismissable && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Grabber, { onClick: handleClose, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, GrabberBar, {}) }),
              props.handleBack && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, BackButtonContainer, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                _chunkKKOBB4X5cjs.Button,
                {
                  onClick: props.handleBack,
                  icon: { name: "ChevronLeft" },
                  kind: "ghost",
                  size: "Small"
                }
              ) }),
              props.closeButton && !props.nonDismissable && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CloseButtonContainer, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CloseButton, { onClick: handleClose, type: "button", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                _chunkWF7Z2VITcjs.Icon,
                {
                  name: "CentralCrossLarge",
                  square: true,
                  width: 16,
                  color: "grayBlue43"
                }
              ) }) }),
              props.children
            ]
          }
        )
      }
    )
  ] });
};
var Background = _styled2.default.div`
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: ${_chunkZU72XWNEcjs.z.modalOverlay};

  // Animate opacity
  transition: opacity 0.3s ease-in-out;
  opacity: ${(props) => props.isOpen ? props.fractionVisible : "0"};

  animation: open 0.3s ease-in-out;

  @keyframes open {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
`;
var DrawerContainer = _styled2.default.div`
  position: fixed;
  max-height: 100dvh;
  width: 100%;
  right: 0;
  bottom: 0;
  transform: translateY(${(props) => `${props.totalDeltaY}px`});
  z-index: ${_chunkZU72XWNEcjs.z.modalContainer};
  display: flex;
  flex-direction: column;
  align-items: center;

  ${(props) => props.top && `top: ${props.top}px;`}

  // Only smooth transition when not grabbing, otherwise dragging will feel very laggy
  ${(props) => props.grabbing && props.isOpen ? "" : "transition: transform 0.3s ease-in-out;"};

  // Animate the drawer opening and closing, and make sure the the drawer stays closed.
  animation: 0.3s ease-in-out
    ${(props) => props.isOpen ? "openDrawer" : "closeDrawer forwards"};

  @keyframes openDrawer {
    from {
      transform: translateY(100%);
    }
    to {
      transform: translateY(0%);
    }
  }

  @keyframes closeDrawer {
    from {
      transform: translateY(${(props) => `${props.totalDeltaY}px`});
    }
    to {
      transform: translateY(100%);
    }
  }
`;
var DrawerInnerContainer = _styled2.default.div`
  ${(props) => props.alignBottom ? "margin-top: auto;" : ""}
  position: relative;
  display: flex;
  flex-direction: column;
  width: ${(props) => props.kind === "floating" ? `calc(100% - ${_chunkZUAO4DW3cjs.Spacing.md * 2}px)` : "100%"};
  min-width: 320px;
  ${(props) => props.kind === "floating" ? `bottom: ${_chunkZUAO4DW3cjs.Spacing.px.md};` : ""}
  height: auto;
  border-radius: ${(props) => props.kind === "floating" ? _chunkZUAO4DW3cjs.Spacing.px.lg : `${_chunkZUAO4DW3cjs.Spacing.px.lg} ${_chunkZUAO4DW3cjs.Spacing.px.lg} 0 0`};
  background-color: ${({ theme }) => theme.bg};
  padding: ${(props) => props.padding ? `${props.padding}` : `${_chunkZUAO4DW3cjs.Spacing.px["6xl"]} ${_chunkZUAO4DW3cjs.Spacing.px.xl} ${_chunkZUAO4DW3cjs.Spacing.px["2xl"]}
    ${_chunkZUAO4DW3cjs.Spacing.px.xl}`};
`;
var Grabber = _styled2.default.div`
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: ${_chunkZUAO4DW3cjs.Spacing.px.lg};
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 9px;
  cursor: pointer;
`;
var CloseButtonContainer = _styled2.default.div`
  position: absolute;
  top: 20px;
  right: 20px;
  border-radius: 50%;
  background-color: #edeef1; /* TODO: Use semantic token */
  padding: ${_chunkZUAO4DW3cjs.Spacing.px["2xs"]};
  height: 28px;
  width: 28px;
  display: flex;
  align-items: center;

  * > * {
    line-height: 14px;
  }
`;
var CloseButton = _styled2.default.call(void 0, _chunkSNSG4HBQcjs.UnstyledButton)`
  ${_chunkRSHN4K6Ncjs.standardFocusOutline}
  width: 24px;
  height: 24px;
  justify-self: flex-end;
`;
var BackButtonContainer = _styled2.default.div`
  position: absolute;
  top: 20px;
  left: 20px;
  border-radius: 50%;
  padding: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
  height: 30px;
  width: 30px;
  display: flex;
  align-items: center;
`;
var GrabberBar = _styled2.default.div`
  width: 36px;
  height: 5px;
  border-radius: 2.5px;
  background: #c0c9d6;
`;



exports.Drawer = Drawer;
