'use strict';

var React = require('react');
var tslib_es6 = require('./tslib.es6-2c2ed574.js');
var core = require('@mantine/core');
var vaul = require('vaul');
var styled = require('@emotion/styled');
var index = require('./index-6ce6e395.js');

function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

function _interopNamespace(e) {
  if (e && e.__esModule) return e;
  var n = Object.create(null);
  if (e) {
    Object.keys(e).forEach(function (k) {
      if (k !== 'default') {
        var d = Object.getOwnPropertyDescriptor(e, k);
        Object.defineProperty(n, k, d.get ? d : {
          enumerable: true,
          get: function () { return e[k]; }
        });
      }
    });
  }
  n["default"] = e;
  return Object.freeze(n);
}

var React__namespace = /*#__PURE__*/_interopNamespace(React);
var styled__default = /*#__PURE__*/_interopDefault(styled);

/* eslint-disable prettier/prettier */
const Close = (props) => (React__namespace.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "currentColor" }, props),
    React__namespace.createElement("path", { d: "M3.99403 3.32695C3.86141 3.32698 3.73181 3.36657 3.62181 3.44065C3.5118 3.51472 3.42638 3.61992 3.37648 3.7428C3.32658 3.86567 3.31445 4.00064 3.34165 4.13044C3.36885 4.26024 3.43415 4.37898 3.52919 4.47148L7.05784 8.00013L3.52919 11.5288C3.46521 11.5902 3.41413 11.6638 3.37894 11.7452C3.34375 11.8266 3.32516 11.9142 3.32425 12.0029C3.32335 12.0916 3.34015 12.1796 3.37368 12.2617C3.40721 12.3438 3.45678 12.4185 3.5195 12.4812C3.58222 12.5439 3.65682 12.5935 3.73894 12.627C3.82106 12.6605 3.90904 12.6773 3.99774 12.6764C4.08643 12.6755 4.17405 12.6569 4.25547 12.6217C4.33689 12.5865 4.41047 12.5355 4.4719 12.4715L8.00054 8.94283L11.5292 12.4715C11.5906 12.5355 11.6642 12.5865 11.7456 12.6217C11.827 12.6569 11.9147 12.6755 12.0034 12.6764C12.092 12.6773 12.18 12.6605 12.2621 12.627C12.3443 12.5935 12.4189 12.5439 12.4816 12.4812C12.5443 12.4185 12.5939 12.3439 12.6274 12.2617C12.6609 12.1796 12.6777 12.0916 12.6768 12.0029C12.6759 11.9142 12.6573 11.8266 12.6222 11.7452C12.587 11.6638 12.5359 11.5902 12.4719 11.5288L8.94325 8.00013L12.4719 4.47148C12.5682 4.37784 12.634 4.25728 12.6607 4.1256C12.6873 3.99392 12.6735 3.85726 12.6212 3.73354C12.5688 3.60982 12.4803 3.5048 12.3672 3.43224C12.2542 3.35969 12.1218 3.32299 11.9875 3.32695C11.8143 3.33211 11.6499 3.4045 11.5292 3.52877L8.00054 7.05742L4.4719 3.52877C4.40977 3.46491 4.33548 3.41415 4.2534 3.37948C4.17132 3.34482 4.08313 3.32696 3.99403 3.32695Z" })));

const TIME_FOR_MOTION = 300;
const useDrawerDrag = (motionDelay = TIME_FOR_MOTION) => {
    const [isDragging, setIsDragging] = React.useState(false);
    const handleDragStart = React.useCallback(() => {
        setIsDragging(true);
    }, []);
    const handleDragEnd = React.useCallback(() => {
        setTimeout(() => {
            setIsDragging(false);
        }, motionDelay);
    }, [motionDelay]);
    return {
        isDragging,
        handleDragStart,
        handleDragEnd,
    };
};

const StyledDrawerComponentContent = styled__default["default"](vaul.Drawer.Content) `
  position: fixed;
  z-index: ${index.ZINDEX_SSO - 9e6 + 1};
  inset: 0;
  background-color: #fff;
  outline: none !important;

  &::-webkit-scrollbar {
    width: 6px;
    height: 6px;
  }

  &::-webkit-scrollbar-track {
    background-color: transparent;
  }

  &::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 6px;
  }

  &[data-vaul-drawer-direction='bottom'] {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
  }

  &[data-vaul-drawer-direction='top'] {
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
  }

  &[data-vaul-drawer-direction='left'] {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
  }

  &[data-vaul-drawer-direction='right'] {
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
  }

  ${(props) => props.isDragging &&
    `
      input {
        caret-color: transparent;
      }
    `}
`;
const StyledDrawerComponentOverlay = styled__default["default"](vaul.Drawer.Overlay) `
  position: fixed;
  inset: 0;
  z-index: ${index.ZINDEX_SSO - 9e6};
  width: 100%;
  max-height: 100%;

  &[data-state='open'] {
    opacity: 0.6 !important;
  }
`;

const DrawerComponent = (props) => {
    const { open: openProps, onOpenChange: onOpenChangeProps, snapPoints, activeSnapPoint, setActiveSnapPoint, children, overlayClassName, className, fadeFromIndex = index.ZINDEX_SSO - 9e6, onClose } = props, restProps = tslib_es6.__rest(props, ["open", "onOpenChange", "snapPoints", "activeSnapPoint", "setActiveSnapPoint", "children", "overlayClassName", "className", "fadeFromIndex", "onClose"]);
    const [open, setOpen] = React.useState(openProps);
    const [snap, setSnap] = React.useState(snapPoints ? snapPoints === null || snapPoints === void 0 ? void 0 : snapPoints[0] : null);
    const { isDragging, handleDragStart, handleDragEnd } = useDrawerDrag();
    const onOpenChange = React.useCallback((_open) => {
        setOpen(_open);
        onOpenChangeProps === null || onOpenChangeProps === void 0 ? void 0 : onOpenChangeProps(_open);
    }, [onOpenChangeProps]);
    const isFullSnapPoint = React.useMemo(() => {
        if (snapPoints && snapPoints.length) {
            return Boolean(snap === snapPoints[snapPoints.length - 1]);
        }
        return open;
    }, [snap, snapPoints]);
    const mergedProps = React.useMemo(() => {
        const _mergedProps = {
            open,
            onOpenChange,
            fadeFromIndex,
        };
        if (snapPoints && (snapPoints === null || snapPoints === void 0 ? void 0 : snapPoints.length)) {
            _mergedProps.snapPoints = snapPoints;
            _mergedProps.activeSnapPoint = snap;
            _mergedProps.setActiveSnapPoint = (snP) => {
                setSnap(snP);
                setActiveSnapPoint === null || setActiveSnapPoint === void 0 ? void 0 : setActiveSnapPoint(snP);
            };
        }
        return _mergedProps;
    }, [
        open,
        onOpenChange,
        snap,
        setSnap,
        setActiveSnapPoint,
        snapPoints,
        fadeFromIndex,
    ]);
    React.useEffect(() => {
        setOpen(openProps);
    }, [openProps]);
    React.useEffect(() => {
        setSnap(activeSnapPoint);
    }, [activeSnapPoint]);
    return (React__namespace["default"].createElement(vaul.Drawer.Root, Object.assign({ onDrag: handleDragStart, onRelease: handleDragEnd, onClose: onClose }, restProps, mergedProps),
        React__namespace["default"].createElement(vaul.Drawer.Portal, null,
            React__namespace["default"].createElement(StyledDrawerComponentOverlay, { className: core.clsx(overlayClassName, 'drawer__overlay', {
                    drawer__overlay_full: isFullSnapPoint,
                }) }),
            React__namespace["default"].createElement(StyledDrawerComponentContent, { isDragging: isDragging, className: core.clsx(className, 'drawer__content', {
                    drawer__content_full: isFullSnapPoint,
                }) },
                React__namespace["default"].createElement(vaul.Drawer.Handle, { className: "drawer__handle" }),
                React__namespace["default"].createElement(vaul.Drawer.Title, { style: { display: 'none' } }),
                children))));
};

exports.Close = Close;
exports.DrawerComponent = DrawerComponent;
exports.useDrawerDrag = useDrawerDrag;
