dialog quick

This commit is contained in:
2026-05-15 00:36:52 +02:00
parent 8df06d9c12
commit d83aff6229
5 changed files with 30 additions and 29 deletions

2
dist/sigpro.ui.css vendored

File diff suppressed because one or more lines are too long

2
dist/sigpro.ui.js vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -116,32 +116,33 @@ export const ui = {
watch(show, s => s ? setTimeout(() => anim(true), 10) : anim(false)); watch(show, s => s ? setTimeout(() => anim(true), 10) : anim(false));
return h("div", { return h("div", {
class: () => `fixed z-50 transition-all duration-300 ${show() ? (anim() ? 'opacity-100 scale-100' : 'opacity-0 scale-95') : 'opacity-0 scale-95 pointer-events-none' class: () => `fixed z-50 transition-opacity duration-300 ${
show() ? (anim() ? 'opacity-100 scale-100' : 'opacity-0 scale-95') : 'opacity-0 scale-95 pointer-events-none'
}`, }`,
style: () => `left: ${pos().x}px; top: ${pos().y}px;` style: () => `left: ${pos().x}px; top: ${pos().y}px; transition: left 50ms, top 50ms;`
}, [ }, [
h("div", { h("div", {
class: `bg-base-100 rounded-box shadow-2xl border border-base-300 ${p.class || ''}`, class: `bg-base-100 rounded-box shadow-2xl border border-base-300 ${p.class || ''}`,
onclick: e => e.stopPropagation() onclick: e => e.stopPropagation()
}, [
p.title ? h("div", {
class: "flex justify-between items-center cursor-move p-2 border-b select-none bg-base-200 rounded-t-box",
onmousedown: e => {
const sx = e.clientX - pos().x, sy = e.clientY - pos().y;
const mv = ev => pos({ x: ev.clientX - sx, y: ev.clientY - sy });
const up = () => { document.removeEventListener('mousemove', mv); document.removeEventListener('mouseup', up); };
document.addEventListener('mousemove', mv); document.addEventListener('mouseup', up);
e.preventDefault();
}
}, [ }, [
h("span", { class: "font-bold" }, p.title), p.title ? h("div", {
h("button", { class: "btn btn-sm btn-circle btn-ghost", onclick: () => show(false) }, "✕") class: "flex justify-between items-center cursor-move p-2 border-b select-none bg-base-200 rounded-t-box",
]) : null, onmousedown: e => {
h("div", { class: "p-4" }, c), const sx = e.clientX - pos().x, sy = e.clientY - pos().y;
p.footer ? h("div", { class: "p-2 border-t flex justify-end gap-2" }, p.footer) : null const mv = ev => pos({ x: ev.clientX - sx, y: ev.clientY - sy });
]) const up = () => { document.removeEventListener('mousemove', mv); document.removeEventListener('mouseup', up); };
document.addEventListener('mousemove', mv); document.addEventListener('mouseup', up);
e.preventDefault();
}
}, [
h("span", { class: "font-bold" }, p.title),
h("button", { class: "btn btn-sm btn-circle btn-ghost", onclick: () => show(false) }, "✕")
]) : null,
h("div", { class: "p-4" }, c),
p.footer ? h("div", { class: "p-2 border-t flex justify-end gap-2" }, p.footer) : null
])
]); ]);
}, },
divider: (p) => h("div", { ...p, class: `divider ${p.class || ''}` }), divider: (p) => h("div", { ...p, class: `divider ${p.class || ''}` }),
drawer: (p, c) => h("div", { ...p, class: `drawer ${p.class || ''}` }, c), drawer: (p, c) => h("div", { ...p, class: `drawer ${p.class || ''}` }, c),
drawer_toggle: (p) => h("input", { ...p, type: "checkbox", class: `drawer-toggle ${p.class || ''}` }), drawer_toggle: (p) => h("input", { ...p, type: "checkbox", class: `drawer-toggle ${p.class || ''}` }),