@platformos/pos-cli
Version:
Manage your platformOS application
220 lines (192 loc) • 6.22 kB
JavaScript
import { S as SvelteComponent, i as init, s as safe_not_equal, m as globals, e as element, a as append, C as create_slot, b as space, t as text, c as claim_element, d as children, g as detach, h as claim_space, f as claim_text, j as attr, k as insert, p as listen, G as update_slot, z as transition_in, A as transition_out, L as run_all, U as createEventDispatcher, B as onDestroy, M as binding_callbacks } from './main2.js';
/* src\pages\Logs\Modal.svelte generated by Svelte v3.24.1 */
const { document: document_1 } = globals;
function add_css() {
var style = element("style");
style.id = "svelte-11g0cp4-style";
style.textContent = ".modal-background.svelte-11g0cp4{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.3)}.modal.svelte-11g0cp4{position:absolute;left:50%;top:50%;width:calc(100vw - 4em);max-width:32em;max-height:calc(100vh - 4em);overflow:auto;transform:translate(-50%,-50%);padding:1em;border-radius:0.2em;background:white}button.svelte-11g0cp4{display:block}";
append(document_1.head, style);
}
const get_header_slot_changes = dirty => ({});
const get_header_slot_context = ctx => ({});
function create_fragment(ctx) {
let div0;
let t0;
let div1;
let t1;
let hr0;
let t2;
let t3;
let hr1;
let t4;
let button;
let t5;
let current;
let mounted;
let dispose;
const header_slot_template = /*$$slots*/ ctx[4].header;
const header_slot = create_slot(header_slot_template, ctx, /*$$scope*/ ctx[3], get_header_slot_context);
const default_slot_template = /*$$slots*/ ctx[4].default;
const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[3], null);
return {
c() {
div0 = element("div");
t0 = space();
div1 = element("div");
if (header_slot) header_slot.c();
t1 = space();
hr0 = element("hr");
t2 = space();
if (default_slot) default_slot.c();
t3 = space();
hr1 = element("hr");
t4 = space();
button = element("button");
t5 = text("close modal");
this.h();
},
l(nodes) {
div0 = claim_element(nodes, "DIV", { class: true });
children(div0).forEach(detach);
t0 = claim_space(nodes);
div1 = claim_element(nodes, "DIV", {
class: true,
role: true,
"aria-modal": true
});
var div1_nodes = children(div1);
if (header_slot) header_slot.l(div1_nodes);
t1 = claim_space(div1_nodes);
hr0 = claim_element(div1_nodes, "HR", {});
t2 = claim_space(div1_nodes);
if (default_slot) default_slot.l(div1_nodes);
t3 = claim_space(div1_nodes);
hr1 = claim_element(div1_nodes, "HR", {});
t4 = claim_space(div1_nodes);
button = claim_element(div1_nodes, "BUTTON", { autofocus: true, class: true });
var button_nodes = children(button);
t5 = claim_text(button_nodes, "close modal");
button_nodes.forEach(detach);
div1_nodes.forEach(detach);
this.h();
},
h() {
attr(div0, "class", "modal-background svelte-11g0cp4");
button.autofocus = true;
attr(button, "class", "svelte-11g0cp4");
attr(div1, "class", "modal svelte-11g0cp4");
attr(div1, "role", "dialog");
attr(div1, "aria-modal", "true");
},
m(target, anchor) {
insert(target, div0, anchor);
insert(target, t0, anchor);
insert(target, div1, anchor);
if (header_slot) {
header_slot.m(div1, null);
}
append(div1, t1);
append(div1, hr0);
append(div1, t2);
if (default_slot) {
default_slot.m(div1, null);
}
append(div1, t3);
append(div1, hr1);
append(div1, t4);
append(div1, button);
append(button, t5);
/*div1_binding*/ ctx[5](div1);
current = true;
button.focus();
if (!mounted) {
dispose = [
listen(window, "keydown", /*handle_keydown*/ ctx[2]),
listen(div0, "click", /*close*/ ctx[1]),
listen(button, "click", /*close*/ ctx[1])
];
mounted = true;
}
},
p(ctx, [dirty]) {
if (header_slot) {
if (header_slot.p && dirty & /*$$scope*/ 8) {
update_slot(header_slot, header_slot_template, ctx, /*$$scope*/ ctx[3], dirty, get_header_slot_changes, get_header_slot_context);
}
}
if (default_slot) {
if (default_slot.p && dirty & /*$$scope*/ 8) {
update_slot(default_slot, default_slot_template, ctx, /*$$scope*/ ctx[3], dirty, null, null);
}
}
},
i(local) {
if (current) return;
transition_in(header_slot, local);
transition_in(default_slot, local);
current = true;
},
o(local) {
transition_out(header_slot, local);
transition_out(default_slot, local);
current = false;
},
d(detaching) {
if (detaching) detach(div0);
if (detaching) detach(t0);
if (detaching) detach(div1);
if (header_slot) header_slot.d(detaching);
if (default_slot) default_slot.d(detaching);
/*div1_binding*/ ctx[5](null);
mounted = false;
run_all(dispose);
}
};
}
function instance($$self, $$props, $$invalidate) {
const dispatch = createEventDispatcher();
const close = () => dispatch("close");
let modal;
const handle_keydown = e => {
if (e.key === "Escape") {
close();
return;
}
if (e.key === "Tab") {
// trap focus
const nodes = modal.querySelectorAll("*");
const tabbable = Array.from(nodes).filter(n => n.tabIndex >= 0);
let index = tabbable.indexOf(document.activeElement);
if (index === -1 && e.shiftKey) index = 0;
index += tabbable.length + (e.shiftKey ? -1 : 1);
index %= tabbable.length;
tabbable[index].focus();
e.preventDefault();
}
};
const previously_focused = typeof document !== "undefined" && document.activeElement;
if (previously_focused) {
onDestroy(() => {
previously_focused.focus();
});
}
let { $$slots = {}, $$scope } = $$props;
function div1_binding($$value) {
binding_callbacks[$$value ? "unshift" : "push"](() => {
modal = $$value;
$$invalidate(0, modal);
});
}
$$self.$$set = $$props => {
if ("$$scope" in $$props) $$invalidate(3, $$scope = $$props.$$scope);
};
return [modal, close, handle_keydown, $$scope, $$slots, div1_binding];
}
class Modal extends SvelteComponent {
constructor(options) {
super();
if (!document_1.getElementById("svelte-11g0cp4-style")) add_css();
init(this, options, instance, create_fragment, safe_not_equal, {});
}
}
export default Modal;