import { o as Q } from "./rolldown-runtime.js";
import { i as U, t as X } from "./vendor/react.js";
import { t as i } from "./utils.js";
import { a as m, i as Y, n as Z, o as ee, r as ae, t as re } from "./_shared.js";
import { c as R, d as P, f as S, n as T, r as E, s as O, t as B, u as H } from "./DialogTrigger.js";
import { t as te } from "./DialogViewport.js";
var d = /* @__PURE__ */ Q(U(), 1), r = X(), v = d.createContext("bottom");
function F() {
  return d.useContext(v);
}
function z({ direction: a = "bottom", ...e }) {
  return /* @__PURE__ */ (0, r.jsx)(v.Provider, {
    value: a,
    children: /* @__PURE__ */ (0, r.jsx)(E, {
      "data-slot": "drawer",
      ...e
    })
  });
}
function A({ ...a }) {
  return /* @__PURE__ */ (0, r.jsx)(B, {
    "data-slot": "drawer-trigger",
    ...a
  });
}
function g({ ...a }) {
  return /* @__PURE__ */ (0, r.jsx)(O, {
    "data-slot": "drawer-portal",
    ...a
  });
}
function V({ ...a }) {
  return /* @__PURE__ */ (0, r.jsx)(P, {
    "data-slot": "drawer-close",
    ...a
  });
}
function x({ className: a, disableAnimation: e, disableBackdropBlur: t, ...o }) {
  return /* @__PURE__ */ (0, r.jsx)(S, {
    "data-slot": "drawer-overlay",
    className: i("bg-background/80/10 fixed inset-0 z-50", !e && "data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0", !t && "supports-backdrop-filter:backdrop-blur-xs", a),
    ...o
  });
}
function W({ className: a, children: e, disableAnimation: t, disableBackdropBlur: o, ...l }) {
  const n = F();
  return /* @__PURE__ */ (0, r.jsxs)(g, {
    "data-slot": "drawer-portal",
    children: [/* @__PURE__ */ (0, r.jsx)(x, {
      disableAnimation: t,
      disableBackdropBlur: o
    }), /* @__PURE__ */ (0, r.jsxs)(R, {
      "data-slot": "drawer-content",
      "data-vaul-drawer-direction": n,
      className: i("bg-background flex h-auto flex-col text-sm data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-r-xl data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-l-xl data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm group/drawer-content fixed z-50", a),
      ...l,
      children: [/* @__PURE__ */ (0, r.jsx)("div", { className: "bg-muted mx-auto mt-4 hidden h-1.5 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }), e]
    })]
  });
}
function q({ className: a, ...e }) {
  return /* @__PURE__ */ (0, r.jsx)("div", {
    "data-slot": "drawer-header",
    className: i("gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left flex flex-col", a),
    ...e
  });
}
function K({ className: a, ...e }) {
  return /* @__PURE__ */ (0, r.jsx)("div", {
    "data-slot": "drawer-footer",
    className: i("gap-2 p-4 mt-auto flex flex-col", a),
    ...e
  });
}
function M({ className: a, ...e }) {
  return /* @__PURE__ */ (0, r.jsx)(T, {
    "data-slot": "drawer-title",
    className: i("text-foreground font-medium", a),
    ...e
  });
}
function $({ className: a, ...e }) {
  return /* @__PURE__ */ (0, r.jsx)(H, {
    "data-slot": "drawer-description",
    className: i("text-muted-foreground text-sm", a),
    ...e
  });
}
A.displayName = "Drawer.Trigger";
g.displayName = "Drawer.Portal";
V.displayName = "Drawer.Close";
x.displayName = "Drawer.Overlay";
W.displayName = "Drawer.Content";
q.displayName = "Drawer.Header";
K.displayName = "Drawer.Footer";
M.displayName = "Drawer.Title";
$.displayName = "Drawer.Description";
z.displayName = "Drawer";
var ue = Object.assign(z, {
  Trigger: A,
  Portal: g,
  Close: V,
  Overlay: x,
  Content: W,
  Header: q,
  Footer: K,
  Title: M,
  Description: $
}), p = d.forwardRef(function({ direction: e = "bottom", defaultOpen: t = !1, onOpenChange: o, children: l, ...n }, s) {
  const [u, w] = d.useState(t), c = d.useCallback((_) => {
    w(_), o?.(_);
  }, [o]);
  return /* @__PURE__ */ (0, r.jsx)(v.Provider, {
    value: e,
    children: /* @__PURE__ */ (0, r.jsx)(E, {
      "data-slot": "drawer",
      open: u,
      onOpenChange: c,
      ...n,
      children: l
    })
  });
});
p.displayName = "Drawer.Root";
var b = d.forwardRef(function({ ...e }, t) {
  return /* @__PURE__ */ (0, r.jsx)(B, {
    ref: t,
    "data-slot": "drawer-trigger",
    ...e
  });
});
b.displayName = "Drawer.Trigger";
function h({ ...a }) {
  return /* @__PURE__ */ (0, r.jsx)(O, {
    "data-slot": "drawer-portal",
    ...a
  });
}
h.displayName = "Drawer.Portal";
var G = d.forwardRef(function({ ...e }, t) {
  return /* @__PURE__ */ (0, r.jsx)(P, {
    ref: t,
    "data-slot": "drawer-close",
    ...e
  });
});
G.displayName = "Drawer.Close";
var D = d.forwardRef(function({ className: e, disableAnimation: t, disableBackdropBlur: o, ...l }, n) {
  return /* @__PURE__ */ (0, r.jsx)(S, {
    ref: n,
    "data-slot": "drawer-backdrop",
    className: i("bg-background/80/10 fixed inset-0 z-50", !t && "data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 motion-reduce:animate-none", !o && "supports-backdrop-filter:backdrop-blur-xs", e),
    ...l
  });
});
D.displayName = "Drawer.Backdrop";
var I = d.forwardRef(function({ className: e, children: t, ...o }, l) {
  return /* @__PURE__ */ (0, r.jsx)(te, {
    ref: l,
    "data-slot": "drawer-viewport",
    className: i("fixed inset-0 z-50", e),
    ...o,
    children: t
  });
});
I.displayName = "Drawer.Viewport";
var y = d.forwardRef(function({ className: e, children: t, disableAnimation: o, disableBackdropBlur: l, ...n }, s) {
  const u = F();
  return /* @__PURE__ */ (0, r.jsxs)(h, {
    "data-slot": "drawer-portal",
    children: [/* @__PURE__ */ (0, r.jsx)(D, {
      disableAnimation: o,
      disableBackdropBlur: l
    }), /* @__PURE__ */ (0, r.jsxs)(R, {
      ref: s,
      "data-slot": "drawer-popup",
      "data-vaul-drawer-direction": u,
      className: i("bg-background flex h-auto flex-col text-sm data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-r-xl data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-l-xl data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm group/drawer-content fixed z-50", !o && "data-open:animate-in data-closed:animate-out data-open:duration-300 data-closed:duration-200 data-open:ease-(--ease-decelerate) data-closed:ease-in data-[vaul-drawer-direction=bottom]:data-open:slide-in-from-bottom-full data-[vaul-drawer-direction=bottom]:data-closed:slide-out-to-bottom-full data-[vaul-drawer-direction=top]:data-open:slide-in-from-top-full data-[vaul-drawer-direction=top]:data-closed:slide-out-to-top-full data-[vaul-drawer-direction=left]:data-open:slide-in-from-left-full data-[vaul-drawer-direction=left]:data-closed:slide-out-to-left-full data-[vaul-drawer-direction=right]:data-open:slide-in-from-right-full data-[vaul-drawer-direction=right]:data-closed:slide-out-to-right-full motion-reduce:animate-none", e),
      ...n,
      children: [/* @__PURE__ */ (0, r.jsx)("div", {
        "aria-hidden": "true",
        className: "bg-muted mx-auto mt-4 hidden h-1.5 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block delight-fade-in motion-reduce:!animate-none"
      }), t]
    })]
  });
});
y.displayName = "Drawer.Popup";
var N = d.forwardRef(function({ className: e, ...t }, o) {
  return /* @__PURE__ */ (0, r.jsx)("div", {
    ref: o,
    "data-slot": "drawer-header",
    className: i("gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left flex flex-col", e),
    ...t
  });
});
N.displayName = "Drawer.Header";
var j = d.forwardRef(function({ className: e, ...t }, o) {
  return /* @__PURE__ */ (0, r.jsx)("div", {
    ref: o,
    "data-slot": "drawer-footer",
    className: i("gap-2 p-4 mt-auto flex flex-col", e),
    ...t
  });
});
j.displayName = "Drawer.Footer";
var k = d.forwardRef(function({ className: e, ...t }, o) {
  return /* @__PURE__ */ (0, r.jsx)(T, {
    ref: o,
    "data-slot": "drawer-title",
    className: i("text-foreground font-medium delight-stagger motion-reduce:!animate-none", e),
    ...t,
    style: { "--delight-delay": "50ms" }
  });
});
k.displayName = "Drawer.Title";
var C = d.forwardRef(function({ className: e, ...t }, o) {
  return /* @__PURE__ */ (0, r.jsx)(H, {
    ref: o,
    "data-slot": "drawer-description",
    className: i("text-muted-foreground text-sm delight-stagger motion-reduce:!animate-none", e),
    ...t,
    style: { "--delight-delay": "100ms" }
  });
});
C.displayName = "Drawer.Description";
var J = d.forwardRef(function({ className: e, ...t }, o) {
  return /* @__PURE__ */ (0, r.jsx)("div", {
    ref: o,
    "data-slot": "drawer-handle",
    "aria-hidden": "true",
    className: i("bg-muted mx-auto mt-4 h-1.5 w-[100px] shrink-0 rounded-full", e),
    ...t
  });
});
J.displayName = "Drawer.Handle";
var oe = Object.assign(p, {
  Root: p,
  Trigger: b,
  Portal: h,
  Backdrop: D,
  Viewport: I,
  Popup: y,
  Header: N,
  Footer: j,
  Title: k,
  Description: C,
  Close: G,
  Handle: J
}), f = {
  defaultOpen: "boolean",
  direction: "string",
  disableAnimation: "boolean",
  disableBackdropBlur: "boolean"
}, L = class extends re {
  get propDefs() {
    return f;
  }
  static get observedAttributes() {
    return Object.keys(f).map(Z);
  }
  _renderReact() {
    const a = this._readAllProps(), e = this._getSlot("trigger"), t = this._getSlot("title"), o = this._getSlot("description"), l = this._getSlot("body"), n = this._getSlot("footer"), s = [];
    if (t || o) {
      const c = [];
      t && c.push(d.createElement(k, { key: "title" }, m(t))), o && c.push(d.createElement(C, { key: "description" }, m(o))), s.push(d.createElement(N, { key: "header" }, ...c));
    }
    l && s.push(d.createElement("div", {
      key: "body",
      className: "flex-1 overflow-y-auto px-4"
    }, m(l)));
    const u = this._getDefaultSlot();
    u && !l && s.push(d.createElement("div", {
      key: "default-body",
      className: "flex-1 overflow-y-auto px-4"
    }, m(u))), n && s.push(d.createElement(j, { key: "footer" }, m(n)));
    const w = [];
    return e && w.push(d.createElement(b, {
      key: "trigger",
      render: d.createElement("span", { style: { display: "contents" } }, m(e))
    })), w.push(d.createElement(y, {
      key: "content",
      disableAnimation: a.disableAnimation || !1,
      disableBackdropBlur: a.disableBackdropBlur || !1
    }, ...s)), d.createElement(oe, {
      direction: a.direction || "bottom",
      defaultOpen: a.defaultOpen || !1,
      onOpenChange: (c) => ae(this, "open-change", c)
    }, ...w);
  }
};
Y(L, f);
ee("hf-drawer", L);
export {
  L as DrawerWC,
  L as default
};

//# sourceMappingURL=hf-drawer.js.map