import { o as W } from "./rolldown-runtime.js";
import { i as A, t as q } from "./vendor/react.js";
import { t as M } from "./x.js";
import { t as x } from "./Button.js";
import { t as K } from "./dist.js";
import { t as d } from "./utils.js";
import { a as c, i as X, n as G, o as I, r as J, t as Q } from "./_shared.js";
import { t as U } from "./use-controllable-state.js";
import { c as Y, d as _, f as Z, n as $, r as L, s as ee, t as te, u as ae } from "./DialogTrigger.js";
import { t as se } from "./DialogViewport.js";
var i = /* @__PURE__ */ W(A(), 1), a = q(), oe = K("", {
  variants: { size: {
    sm: "",
    md: "",
    lg: ""
  } },
  defaultVariants: { size: "sm" }
}), re = {
  sm: "icon-sm",
  md: "icon",
  lg: "icon-lg"
}, y = i.forwardRef(({ className: e, size: t = "sm", "aria-label": s = "Close", ...o }, r) => /* @__PURE__ */ (0, a.jsxs)(x, {
  ref: r,
  "data-slot": "close-button",
  appearance: "ghost",
  variant: "secondary",
  size: re[t ?? "sm"],
  className: d(oe({ size: t }), e),
  "aria-label": s,
  ...o,
  children: [/* @__PURE__ */ (0, a.jsx)(M, {}), /* @__PURE__ */ (0, a.jsx)("span", {
    className: "sr-only",
    children: s
  })]
}));
y.displayName = "CloseButton";
var j = i.forwardRef(function({ ...t }, s) {
  return /* @__PURE__ */ (0, a.jsx)(L, {
    "data-slot": "sheet",
    ...t
  });
});
j.displayName = "Sheet.Root";
var N = i.forwardRef(function({ ...t }, s) {
  return /* @__PURE__ */ (0, a.jsx)(te, {
    ref: s,
    "data-slot": "sheet-trigger",
    ...t
  });
});
N.displayName = "Sheet.Trigger";
var h = i.forwardRef(function({ ...t }, s) {
  return /* @__PURE__ */ (0, a.jsx)(_, {
    ref: s,
    "data-slot": "sheet-close",
    ...t
  });
});
h.displayName = "Sheet.Close";
function w({ ...e }) {
  return /* @__PURE__ */ (0, a.jsx)(ee, {
    "data-slot": "sheet-portal",
    ...e
  });
}
w.displayName = "Sheet.Portal";
var v = i.forwardRef(function({ className: t, disableAnimation: s, disableBackdropBlur: o, ...r }, l) {
  return /* @__PURE__ */ (0, a.jsx)(Z, {
    ref: l,
    "data-slot": "sheet-backdrop",
    className: d("bg-background/80/10 fixed inset-0 z-50", !s && "data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 duration-100 data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:animate-none", !o && "supports-backdrop-filter:backdrop-blur-xs", t),
    ...r
  });
});
v.displayName = "Sheet.Backdrop";
var E = i.forwardRef(function({ className: t, children: s, ...o }, r) {
  return /* @__PURE__ */ (0, a.jsx)(se, {
    ref: r,
    "data-slot": "sheet-viewport",
    className: d("fixed inset-0 z-50", t),
    ...o,
    children: s
  });
});
E.displayName = "Sheet.Viewport";
function P({ className: e, children: t, side: s = "right", showCloseButton: o = !0, disableAnimation: r, disableBackdropBlur: l, ...n }) {
  return /* @__PURE__ */ (0, a.jsxs)(w, { children: [/* @__PURE__ */ (0, a.jsx)(v, {
    disableAnimation: r,
    disableBackdropBlur: l
  }), /* @__PURE__ */ (0, a.jsxs)(Y, {
    "data-slot": "sheet-popup",
    "data-side": s,
    className: d("bg-background fixed z-50 flex flex-col gap-4 bg-clip-padding text-sm shadow-lg data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm", !r && "data-open:animate-in data-closed:animate-out data-[side=right]:data-closed:slide-out-to-right-full data-[side=right]:data-open:slide-in-from-right-full data-[side=left]:data-closed:slide-out-to-left-full data-[side=left]:data-open:slide-in-from-left-full data-[side=top]:data-closed:slide-out-to-top-full data-[side=top]:data-open:slide-in-from-top-full data-closed:fade-out-0 data-open:fade-in-0 data-[side=bottom]:data-closed:slide-out-to-bottom-full data-[side=bottom]:data-open:slide-in-from-bottom-full data-open:duration-300 data-closed:duration-200 data-open:ease-(--ease-decelerate) data-closed:ease-in motion-reduce:animate-none", e),
    ...n,
    children: [t, o && /* @__PURE__ */ (0, a.jsx)(_, { render: /* @__PURE__ */ (0, a.jsx)(y, { className: "absolute top-4 end-4" }) })]
  })] });
}
P.displayName = "PopupBase";
function R({ className: e, ...t }) {
  return /* @__PURE__ */ (0, a.jsx)("div", {
    "data-slot": "sheet-header",
    className: d("gap-1.5 p-4 flex flex-col", e),
    ...t
  });
}
R.displayName = "HeaderBase";
function g({ className: e, ...t }) {
  return /* @__PURE__ */ (0, a.jsx)("div", {
    "data-slot": "sheet-footer",
    className: d("gap-2 p-4 mt-auto flex flex-col", e),
    ...t
  });
}
g.displayName = "FooterBase";
function T({ className: e, ...t }) {
  return /* @__PURE__ */ (0, a.jsx)($, {
    "data-slot": "sheet-title",
    className: d("text-foreground font-medium", e),
    ...t
  });
}
T.displayName = "TitleBase";
function z({ className: e, ...t }) {
  return /* @__PURE__ */ (0, a.jsx)(ae, {
    "data-slot": "sheet-description",
    className: d("text-muted-foreground text-sm", e),
    ...t
  });
}
z.displayName = "DescriptionBase";
function O({ trigger: e, open: t, defaultOpen: s = !1, onOpenChange: o, children: r, ...l }) {
  const [n, m] = U({
    value: t,
    defaultValue: s,
    onChange: o
  });
  return /* @__PURE__ */ (0, a.jsxs)(j, {
    open: n,
    onOpenChange: m,
    ...l,
    children: [e && /* @__PURE__ */ (0, a.jsx)(N, { render: e }), r]
  });
}
O.displayName = "Sheet";
var de = {
  sm: "data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm",
  md: "data-[side=left]:sm:max-w-md data-[side=right]:sm:max-w-md",
  lg: "data-[side=left]:sm:max-w-lg data-[side=right]:sm:max-w-lg",
  xl: "data-[side=left]:sm:max-w-xl data-[side=right]:sm:max-w-xl",
  full: "data-[side=left]:sm:max-w-full data-[side=right]:sm:max-w-full"
};
function S({ className: e, width: t = "md", children: s, showCloseButton: o = !1, ...r }) {
  return /* @__PURE__ */ (0, a.jsx)(P, {
    className: d("shadow-xl border-border", de[t], e),
    showCloseButton: o,
    ...r,
    children: s
  });
}
S.displayName = "Sheet.Popup";
function C({ className: e, children: t, icon: s, showCloseButton: o = !0, onClose: r, ...l }) {
  return /* @__PURE__ */ (0, a.jsxs)(R, {
    className: d("relative flex flex-row items-start gap-4 px-6 pt-6 pb-0", e),
    ...l,
    children: [
      s && /* @__PURE__ */ (0, a.jsx)("div", {
        className: "flex size-10 shrink-0 items-center justify-center rounded-md border border-border bg-background shadow-xs delight-bounce-in motion-reduce:!animate-none",
        children: /* @__PURE__ */ (0, a.jsx)("span", {
          className: "text-secondary-foreground [&>svg]:size-5",
          children: s
        })
      }),
      /* @__PURE__ */ (0, a.jsx)("div", {
        className: "flex min-w-0 flex-1 flex-col gap-0.5",
        children: t
      }),
      o && /* @__PURE__ */ (0, a.jsx)(h, {
        onClick: r,
        render: /* @__PURE__ */ (0, a.jsx)(y, {
          size: "md",
          className: "absolute end-4 top-3"
        })
      })
    ]
  });
}
C.displayName = "Sheet.Header";
function B({ className: e, ...t }) {
  return /* @__PURE__ */ (0, a.jsx)(T, {
    className: d("text-xl font-semibold text-foreground delight-stagger motion-reduce:!animate-none", e),
    ...t,
    style: { "--delight-delay": "50ms" }
  });
}
B.displayName = "Sheet.Title";
function k({ className: e, ...t }) {
  return /* @__PURE__ */ (0, a.jsx)(z, {
    className: d("text-sm text-tertiary-foreground delight-stagger motion-reduce:!animate-none", e),
    ...t,
    style: { "--delight-delay": "100ms" }
  });
}
k.displayName = "Sheet.Description";
function u({ className: e, children: t, ...s }) {
  return /* @__PURE__ */ (0, a.jsx)("div", {
    "data-slot": "sheet-body",
    className: d("flex flex-1 flex-col gap-6 overflow-y-auto px-6", e),
    ...s,
    children: t
  });
}
u.displayName = "Sheet.Body";
function V({ className: e, children: t, label: s, description: o, ...r }) {
  return /* @__PURE__ */ (0, a.jsxs)("div", {
    "data-slot": "sheet-section",
    className: d("flex flex-col gap-4", e),
    ...r,
    children: [(s || o) && /* @__PURE__ */ (0, a.jsxs)("div", {
      className: "flex flex-col gap-1",
      children: [s && /* @__PURE__ */ (0, a.jsx)("p", {
        className: "text-sm font-medium text-secondary-foreground",
        children: s
      }), o && /* @__PURE__ */ (0, a.jsx)("p", {
        className: "text-sm text-tertiary-foreground",
        children: o
      })]
    }), t]
  });
}
V.displayName = "Sheet.Section";
function F({ className: e, ...t }) {
  return /* @__PURE__ */ (0, a.jsx)("div", {
    "data-slot": "sheet-divider",
    className: d("h-px w-full bg-border-secondary", e),
    ...t
  });
}
F.displayName = "Sheet.Divider";
function D({ className: e, children: t, primaryAction: s, secondaryAction: o, onPrimaryAction: r, onSecondaryAction: l, primaryLoading: n, primaryDisabled: m, ...p }) {
  return t ? /* @__PURE__ */ (0, a.jsx)(g, {
    className: d("flex-row items-center justify-end gap-3 border-t border-border px-6 py-4", e),
    ...p,
    children: t
  }) : /* @__PURE__ */ (0, a.jsxs)(g, {
    className: d("flex-row items-center justify-end gap-3 border-t border-border px-6 py-4", e),
    ...p,
    children: [o && /* @__PURE__ */ (0, a.jsx)(h, { render: /* @__PURE__ */ (0, a.jsx)(x, {
      appearance: "outline",
      variant: "secondary",
      onClick: l,
      children: o
    }) }), s && /* @__PURE__ */ (0, a.jsx)(x, {
      onClick: r,
      loading: n,
      disabled: m,
      children: s
    })]
  });
}
D.displayName = "Sheet.Footer";
var ie = Object.assign(O, {
  Root: j,
  Trigger: N,
  Portal: w,
  Backdrop: v,
  Viewport: E,
  Popup: S,
  Header: C,
  Body: u,
  Footer: D,
  Title: B,
  Description: k,
  Close: h,
  Section: V,
  Divider: F
}), b = {
  open: "boolean",
  defaultOpen: "boolean",
  side: "string",
  width: "string",
  showCloseButton: "boolean",
  disableAnimation: "boolean",
  modal: "boolean"
}, H = class extends Q {
  get propDefs() {
    return b;
  }
  static get observedAttributes() {
    return Object.keys(b).map(G);
  }
  _renderReact() {
    const e = this._readAllProps(), t = this._getSlot("trigger"), s = this._getSlot("title"), o = this._getSlot("description"), r = this._getSlot("body"), l = this._getSlot("footer"), n = this._getSlot("icon"), m = [];
    if (s || o || n) {
      const f = [];
      s && f.push(i.createElement(B, { key: "title" }, c(s))), o && f.push(i.createElement(k, { key: "description" }, c(o))), m.push(i.createElement(C, {
        key: "header",
        icon: n ? c(n) : void 0
      }, ...f));
    }
    r && m.push(i.createElement(u, { key: "body" }, c(r)));
    const p = this._getDefaultSlot();
    return p && !r && m.push(i.createElement(u, { key: "default-body" }, c(p))), l && m.push(i.createElement(D, { key: "footer" }, c(l))), i.createElement(ie, {
      open: e.open,
      defaultOpen: e.defaultOpen || !1,
      onOpenChange: (f) => J(this, "open-change", f),
      modal: e.modal,
      trigger: t ? i.createElement("span", { style: { display: "contents" } }, c(t)) : void 0
    }, i.createElement(S, {
      side: e.side || "right",
      width: e.width || "md",
      showCloseButton: e.showCloseButton !== !1,
      disableAnimation: e.disableAnimation || !1
    }, ...m));
  }
};
X(H, b);
I("hf-sheet", H);
export {
  H as SheetWC,
  H as default
};

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