ai / frontend /build /_app /immutable /chunks /8Pg1zo_Z.js
dev-rexpro's picture
Upload 946 files
537a6f0 verified
Raw
History Blame Contribute Delete
6.87 kB
import "./DKem_M_z.js";
import "./DwLkIEu4.js";
import { p as push, o as onMount, j as onDestroy, l as legacy_pre_effect, n as legacy_pre_effect_reset, y as event, h as first_child, t as template_effect, a as append, b as pop, k as get, A as tick, m as deep_read_state, aU as $window, z as sibling, f as from_html, q as mutable_source, c as child, r as reset, aV as mutate, w as set, U as effect } from "./B-Kw_l3V.js";
import { i as if_block } from "./DWHK2A9K.js";
import { s as slot } from "./zXynQJya.js";
import { t as transition } from "./CDUneY82.js";
import { a as action } from "./CHLP_p7V.js";
import { s as set_attribute, a as set_class, c as clsx } from "./B9yCN616.js";
import { b as bind_prop } from "./CoY6LkZW.js";
import { b as bind_this } from "./BSYzg88z.js";
import { i as init } from "./CUpGYt-B.js";
import { p as prop } from "./COqmMDwI.js";
import { f as flyAndScale } from "./GVdwQ4e6.js";
var root = from_html(`<div role="menu"><!></div>`);
var root_1 = from_html(`<span style="display: contents; cursor: pointer;" role="button" aria-haspopup="true"><!></span> <!>`, 1);
function Dropdown($$anchor, $$props) {
push($$props, false);
let show = prop($$props, "show", 12, false);
let side = prop($$props, "side", 8, "bottom");
let align = prop($$props, "align", 8, "start");
let closeOnOutsideClick = prop($$props, "closeOnOutsideClick", 8, true);
let onOpenChange = prop($$props, "onOpenChange", 8, () => {
});
let contentClass = prop($$props, "contentClass", 8, "");
let sideOffset = prop($$props, "sideOffset", 8, 4);
let triggerEl;
let contentEl = mutable_source();
function portal(node) {
document.body.appendChild(node);
return {
destroy() {
if (node.parentNode) {
node.parentNode.removeChild(node);
}
}
};
}
function trigger(node) {
triggerEl = node.firstElementChild || node;
function handleClick(e) {
e.preventDefault();
toggleOpen();
}
function handleKeydown2(e) {
if (e.key === "Enter" || e.key === " ") {
e.preventDefault();
toggleOpen();
}
}
node.addEventListener("click", handleClick);
node.addEventListener("keydown", handleKeydown2);
return {
destroy() {
node.removeEventListener("click", handleClick);
node.removeEventListener("keydown", handleKeydown2);
}
};
}
function positionContent() {
if (!triggerEl || !get(contentEl)) return;
const rect = triggerEl.getBoundingClientRect();
mutate(contentEl, get(contentEl).style.position = "fixed");
mutate(contentEl, get(contentEl).style.zIndex = "9999");
const contentHeight = get(contentEl).offsetHeight || 0;
const spaceBelow = window.innerHeight - rect.bottom - sideOffset();
const spaceAbove = rect.top - sideOffset();
let openAbove = side() === "top";
if (side() === "bottom" && spaceBelow < contentHeight && spaceAbove > spaceBelow) {
openAbove = true;
} else if (side() === "top" && spaceAbove < contentHeight && spaceBelow > spaceAbove) {
openAbove = false;
}
if (openAbove) {
mutate(contentEl, get(contentEl).style.bottom = `${window.innerHeight - rect.top + sideOffset()}px`);
mutate(contentEl, get(contentEl).style.top = "auto");
} else {
mutate(contentEl, get(contentEl).style.top = `${rect.bottom + sideOffset()}px`);
mutate(contentEl, get(contentEl).style.bottom = "auto");
}
if (align() === "end") {
let right = window.innerWidth - rect.right;
const contentWidth = get(contentEl).offsetWidth || 0;
if (right + contentWidth > window.innerWidth) {
right = window.innerWidth - contentWidth - 16;
}
mutate(contentEl, get(contentEl).style.right = `${Math.max(16, right)}px`);
mutate(contentEl, get(contentEl).style.left = "auto");
} else {
let left = rect.left;
const contentWidth = get(contentEl).offsetWidth || 0;
if (left + contentWidth + 16 > window.innerWidth) {
left = window.innerWidth - contentWidth - 16;
}
mutate(contentEl, get(contentEl).style.left = `${Math.max(16, left)}px`);
mutate(contentEl, get(contentEl).style.right = "auto");
}
}
async function toggleOpen() {
show(!show());
onOpenChange()(show());
if (show()) {
await tick();
positionContent();
setTimeout(positionContent, 50);
}
}
function handleWindowPointerDown(event2) {
var _a;
if (!show() || !closeOnOutsideClick()) return;
if (triggerEl == null ? void 0 : triggerEl.contains(event2.target)) return;
if ((_a = get(contentEl)) == null ? void 0 : _a.contains(event2.target)) return;
show(false);
onOpenChange()(false);
}
function handleKeydown(event2) {
if (event2.key === "Escape" && show()) {
show(false);
onOpenChange()(false);
}
}
function close() {
show(false);
onOpenChange()(false);
}
let onPointerDown;
onMount(() => {
onPointerDown = (e) => handleWindowPointerDown(e);
document.addEventListener("pointerdown", onPointerDown, true);
});
onDestroy(() => {
if (onPointerDown) {
document.removeEventListener("pointerdown", onPointerDown, true);
}
});
legacy_pre_effect(() => (deep_read_state(show()), tick), () => {
if (show()) {
tick().then(() => {
positionContent();
setTimeout(positionContent, 50);
});
}
});
legacy_pre_effect_reset();
var $$exports = { close };
init();
var fragment = root_1();
event(
"keydown",
$window,
/** Close the dropdown programmatically */
handleKeydown
);
event("scroll", $window, positionContent, true);
event("resize", $window, positionContent);
var span = first_child(fragment);
var node_1 = child(span);
slot(node_1, $$props, "default", {}, null);
reset(span);
action(span, ($$node) => trigger == null ? void 0 : trigger($$node));
var node_2 = sibling(span, 2);
{
var consequent = ($$anchor2) => {
var div = root();
var node_3 = child(div);
slot(node_3, $$props, "content", {}, null);
reset(div);
action(div, ($$node) => portal == null ? void 0 : portal($$node));
bind_this(div, ($$value) => set(contentEl, $$value), () => get(contentEl));
effect(() => event("click", div, (e) => e.stopPropagation()));
effect(() => event("pointerdown", div, (e) => e.stopPropagation()));
template_effect(() => set_class(div, 1, clsx(contentClass())));
transition(3, div, () => flyAndScale);
append($$anchor2, div);
};
if_block(node_2, ($$render) => {
if (show()) $$render(consequent);
});
}
template_effect(() => set_attribute(span, "aria-expanded", show()));
append($$anchor, fragment);
bind_prop($$props, "close", close);
return pop($$exports);
}
export {
Dropdown as D
};