import { $n as e, D as t, E as n, Lt as r, On as i, Zn as a, _ as o, b as s, et as c, g as l, jt as u, mt as d, qt as f, tr as p, v as m, wn as h, xt as g, y as _, z as v } from "./runtime-core.esm-bundler-C_RgxGrN.js";
import { N as y, b, q as x, t as S, y as C } from "./Button-C1y42oVo.js";
import { A as w } from "./dist-BVQ2eZ4j.js";
import { d as T, i as E, v as D } from "./Tooltip-C9kG7ywk.js";
import { a as O, c as k, i as A, l as j, n as M, o as N, r as P, s as F } from "./useOverlay-Db99omlQ.js";
import { t as I } from "./overlay-DdDSYYrH.js";
var L = { slots: { overlay: `fixed inset-0 bg-elevated/75`, content: `fixed bg-default divide-y divide-default sm:ring ring-default sm:shadow-lg flex flex-col focus:outline-none`, header: `flex items-center gap-1.5 p-4 sm:px-6 min-h-(--ui-header-height)`, wrapper: ``, body: `flex-1 overflow-y-auto p-4 sm:p-6`, footer: `flex items-center gap-1.5 p-4 sm:px-6`, title: `text-highlighted font-semibold`, description: `mt-1 text-muted text-sm`, close: `absolute top-4 end-4` }, variants: { side: { top: { content: `` }, right: { content: `max-w-md` }, bottom: { content: `` }, left: { content: `max-w-md` } }, inset: { true: { content: `rounded-lg` } }, transition: { true: { overlay: `data-[state=open]:animate-[fade-in_200ms_ease-out] data-[state=closed]:animate-[fade-out_200ms_ease-in]` } } }, compoundVariants: [{ side: `top`, inset: true, class: { content: `max-h-[calc(100%-2rem)] inset-x-4 top-4` } }, { side: `top`, inset: false, class: { content: `max-h-full inset-x-0 top-0` } }, { side: `right`, inset: true, class: { content: `w-[calc(100%-2rem)] inset-y-4 right-4` } }, { side: `right`, inset: false, class: { content: `w-full inset-y-0 right-0` } }, { side: `bottom`, inset: true, class: { content: `max-h-[calc(100%-2rem)] inset-x-4 bottom-4` } }, { side: `bottom`, inset: false, class: { content: `max-h-full inset-x-0 bottom-0` } }, { side: `left`, inset: true, class: { content: `w-[calc(100%-2rem)] inset-y-4 left-4` } }, { side: `left`, inset: false, class: { content: `w-full inset-y-0 left-0` } }, { transition: true, side: `top`, class: { content: `data-[state=open]:animate-[slide-in-from-top_200ms_ease-in-out] data-[state=closed]:animate-[slide-out-to-top_200ms_ease-in-out]` } }, { transition: true, side: `right`, class: { content: `data-[state=open]:animate-[slide-in-from-right_200ms_ease-in-out] data-[state=closed]:animate-[slide-out-to-right_200ms_ease-in-out]` } }, { transition: true, side: `bottom`, class: { content: `data-[state=open]:animate-[slide-in-from-bottom_200ms_ease-in-out] data-[state=closed]:animate-[slide-out-to-bottom_200ms_ease-in-out]` } }, { transition: true, side: `left`, class: { content: `data-[state=open]:animate-[slide-in-from-left_200ms_ease-in-out] data-[state=closed]:animate-[slide-out-to-left_200ms_ease-in-out]` } }] }, R = { __name: `Slideover`, props: { title: { type: String, required: false }, description: { type: String, required: false }, content: { type: Object, required: false }, overlay: { type: Boolean, required: false, default: true }, transition: { type: Boolean, required: false, default: true }, side: { type: null, required: false, default: `right` }, inset: { type: Boolean, required: false }, portal: { type: [Boolean, String], required: false, skipCheck: true, default: true }, close: { type: [Boolean, Object], required: false, default: true }, closeIcon: { type: null, required: false }, dismissible: { type: Boolean, required: false, default: true }, class: { type: null, required: false }, ui: { type: Object, required: false }, open: { type: Boolean, required: false }, defaultOpen: { type: Boolean, required: false }, modal: { type: Boolean, required: false, default: true } }, emits: [`after:leave`, `after:enter`, `close:prevent`, `update:open`], setup(R2, { emit: z }) {
  let B = R2, V = z, H = r(), { t: U } = y(), W = x(), G = b(`slideover`, B), K = D(w(B, `open`, `defaultOpen`, `modal`), V), q = E(h(() => B.portal)), J = h(() => B.content), Y = l(() => B.dismissible ? { pointerDownOutside: I } : [`interactOutside`, `escapeKeyDown`].reduce((e2, t2) => (e2[t2] = (e3) => {
    e3.preventDefault(), V(`close:prevent`);
  }, e2), {})), X = l(() => C({ extend: C(L), ...W.ui?.slideover || {} })({ transition: B.transition, side: B.side, inset: B.inset }));
  return (r2, l2) => (d(), m(i(j), e(v(i(K))), { default: f(({ open: h2, close: y2 }) => [H.default ? (d(), m(i(M), { key: 0, "as-child": ``, class: a(B.class) }, { default: f(() => [g(r2.$slots, `default`, { open: h2 })]), _: 2 }, 1032, [`class`])) : _(``, true), t(i(A), e(v(i(q))), { default: f(() => [R2.overlay ? (d(), m(i(O), { key: 0, "data-slot": `overlay`, class: a(X.value.overlay({ class: i(G)?.overlay })) }, null, 8, [`class`])) : _(``, true), t(i(F), c({ "data-side": R2.side, "data-slot": `content`, class: X.value.content({ class: [!H.default && B.class, i(G)?.content] }) }, J.value, { onAfterEnter: l2[0] || (l2[0] = (e2) => V(`after:enter`)), onAfterLeave: l2[1] || (l2[1] = (e2) => V(`after:leave`)) }, u(Y.value)), { default: f(() => [!R2.title && !H.title || !R2.description && !H.description || H.content ? (d(), m(i(T), { key: 0 }, { default: f(() => [!R2.title && !H.title ? (d(), m(i(P), { key: 0 })) : H.content ? (d(), m(i(P), { key: 1 }, { default: f(() => [g(r2.$slots, `title`, {}, () => [n(p(R2.title), 1)])]), _: 3 })) : _(``, true), !R2.description && !H.description ? (d(), m(i(N), { key: 2 })) : H.content ? (d(), m(i(N), { key: 3 }, { default: f(() => [g(r2.$slots, `description`, {}, () => [n(p(R2.description), 1)])]), _: 3 })) : _(``, true)]), _: 3 })) : _(``, true), g(r2.$slots, `content`, { close: y2 }, () => [H.header || R2.title || H.title || R2.description || H.description || B.close || H.close ? (d(), s(`div`, { key: 0, "data-slot": `header`, class: a(X.value.header({ class: i(G)?.header })) }, [g(r2.$slots, `header`, { close: y2 }, () => [o(`div`, { "data-slot": `wrapper`, class: a(X.value.wrapper({ class: i(G)?.wrapper })) }, [R2.title || H.title ? (d(), m(i(P), { key: 0, "data-slot": `title`, class: a(X.value.title({ class: i(G)?.title })) }, { default: f(() => [g(r2.$slots, `title`, {}, () => [n(p(R2.title), 1)])]), _: 3 }, 8, [`class`])) : _(``, true), R2.description || H.description ? (d(), m(i(N), { key: 1, "data-slot": `description`, class: a(X.value.description({ class: i(G)?.description })) }, { default: f(() => [g(r2.$slots, `description`, {}, () => [n(p(R2.description), 1)])]), _: 3 }, 8, [`class`])) : _(``, true)], 2), g(r2.$slots, `actions`), B.close || H.close ? (d(), m(i(k), { key: 0, "as-child": `` }, { default: f(() => [g(r2.$slots, `close`, { ui: X.value }, () => [B.close ? (d(), m(S, c({ key: 0, icon: R2.closeIcon || i(W).ui.icons.close, color: `neutral`, variant: `ghost`, "aria-label": i(U)(`slideover.close`) }, typeof B.close == `object` ? B.close : {}, { "data-slot": `close`, class: X.value.close({ class: i(G)?.close }) }), null, 16, [`icon`, `aria-label`, `class`])) : _(``, true)])]), _: 2 }, 1024)) : _(``, true)])], 2)) : _(``, true), o(`div`, { "data-slot": `body`, class: a(X.value.body({ class: i(G)?.body })) }, [g(r2.$slots, `body`, { close: y2 })], 2), H.footer ? (d(), s(`div`, { key: 1, "data-slot": `footer`, class: a(X.value.footer({ class: i(G)?.footer })) }, [g(r2.$slots, `footer`, { close: y2 })], 2)) : _(``, true)])]), _: 2 }, 1040, [`data-side`, `class`])]), _: 2 }, 1040)]), _: 3 }, 16));
} };
export {
  R as t
};
