koval-ui/dist/src/lib/Drawer/Drawer.js

React components collection with minimalistic design. Supports theming, layout, and input validation.

"use client";
import { jsx as r } from "react/jsx-runtime";
import { forwardRef as p, useMemo as u } from "react";
import { useRootTheme as w, useLocalTheme as R } from "css-vars-hook";
import g from "classnames";
import { Portal as D } from "../../internal/Portal/Portal.js";
import { useInternalRef as N } from "../../internal/hooks/useInternalRef.js";
import { useDismiss as T } from "../../internal/hooks/useDismiss.js";
import { SlideLeft as v } from "../../internal/Transitions/SlideLeft.js";
import { SlideRight as L } from "../../internal/Transitions/SlideRight.js";
import e from "./Drawer.module.css.js";
import { useDrawerState as S } from "./useDrawerState.js";
const x = p(
  ({ children: i, className: m, placement: o = "left", id: a, ...f }, l) => {
    const t = N(l), { isOpen: s, closeDrawer: c } = S(a), { getTheme: n } = w(), { LocalRoot: d } = R(), h = u(
      () => ({
        left: v,
        right: L
      })[o],
      [o]
    );
    return T(c, t, s), /* @__PURE__ */ r(D, { children: /* @__PURE__ */ r(h, { show: s, nodeRef: t, children: /* @__PURE__ */ r(d, { theme: n(), className: e.provider, children: /* @__PURE__ */ r("div", { className: e.backdrop, children: /* @__PURE__ */ r(
      "div",
      {
        ...f,
        className: g(
          e.drawer,
          {
            [e.left]: o === "left",
            [e.right]: o === "right"
            /* right */
          },
          m
        ),
        ref: t,
        children: i
      }
    ) }) }) }) });
  }
);
x.displayName = "Drawer";
export {
  x as Drawer
};
//# sourceMappingURL=Drawer.js.map