UNPKG

@expofp/floorplan

Version:

Interactive floor plan library for expos and events

106 lines (104 loc) 7.3 kB
function __vite_inject_css__(css, id, forceLightDom){ if (typeof document==='undefined') return; var shadow=!forceLightDom&&typeof window!=='undefined'&&window.__efpShadowDOMStyleParent; var parent=shadow||document.head; var s=document.createElement('style'); s.setAttribute('data-chunk-style', id); s.appendChild(document.createTextNode(css)); parent.appendChild(s);} (function() { try { var e = typeof window < "u" ? window : typeof global < "u" ? global : typeof globalThis < "u" ? globalThis : typeof self < "u" ? self : {}; e.SENTRY_RELEASE = { id: "3.7.8" }; var t = new e.Error().stack; t && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[t] = "8fdffd0f-ff4c-4286-aaf9-a8ba20205633", e._sentryDebugIdIdentifier = "sentry-dbid-8fdffd0f-ff4c-4286-aaf9-a8ba20205633"); } catch {} })(); import { n as e, r as t } from "./rolldown-runtime-YBAZwyzS.js"; import { t as n } from "./react-Di3Pmpio.js"; import { t as r } from "./jsx-runtime-C8yjdFgZ.js"; import { s as i } from "./i18n-BEer1tI4.js"; import { t as a } from "./react-dom-xeogvqlp.js"; import { t as o } from "./classnames-BRCgwycl.js"; import { t as s } from "./Button-C4gPbjAY.js"; import { t as c } from "./useRenderTarget-Cpdl_o5r.js"; //#region src/components/Modal.tsx var l = /* @__PURE__ */ e({ default: () => m }), u = /* @__PURE__ */ t(o(), 1), d = /* @__PURE__ */ t(n(), 1), f = /* @__PURE__ */ t(a(), 1), p = r(), m = ({ open: e, className: t, type: n = "default", title: r, badge: a, maxWidth: o, children: l, closeLabel: m, footerLeft: h = [], footerRight: g = [], onClickClose: _ }) => { let v = c(), y = (0, d.useRef)(null), [b, x] = (0, d.useState)(e), [S, C] = (0, d.useState)(e); if ((0, d.useEffect)(() => { if (e) C(!0), setTimeout(() => { x(!0); }, 10), document.body.style.overflow = "hidden", setTimeout(() => { var e; return (e = y.current) == null ? void 0 : e.focus(); }, 0); else { x(!1); let e = setTimeout(() => { C(!1); }, 200); return () => clearTimeout(e); } let t = (e) => { e.key === "Escape" && _(); }; return document.addEventListener("keydown", t), () => { document.removeEventListener("keydown", t), document.body.style.overflow = ""; }; }, [e, _]), !S || !v) return null; let w = m == null ? i("Close") : m, T = (e) => e == null ? void 0 : e.map(({ label: e, onClick: t, variant: n = "primary", disabled: r, withBadge: i }, a) => /* @__PURE__ */ (0, p.jsx)(s, { onClick: t, variant: n, size: "md", inline: !0, disabled: r, withBadge: i, children: e }, a)); return (0, f.createPortal)(/* @__PURE__ */ (0, p.jsx)("div", { className: (0, u.default)("modal", `modal--${n}`, { isOpen: b }, t), role: "dialog", "aria-modal": "true", ref: y, tabIndex: -1, onClick: _, children: /* @__PURE__ */ (0, p.jsxs)("div", { className: "modal__box", style: o ? { maxWidth: `${o}px` } : void 0, onClick: (e) => e.stopPropagation(), children: [ /* @__PURE__ */ (0, p.jsxs)("div", { className: "modal__header", children: [/* @__PURE__ */ (0, p.jsx)("div", { className: "modal__title-container", children: /* @__PURE__ */ (0, p.jsx)("div", { className: "modal__title", children: r }) }), /* @__PURE__ */ (0, p.jsx)("button", { type: "button", className: "modal__close", onClick: _, "aria-label": w, title: w, children: /* @__PURE__ */ (0, p.jsx)("i", { className: "icon-close", "aria-hidden": "true" }) })] }), /* @__PURE__ */ (0, p.jsx)("div", { className: "modal__body", children: l }), (h.length > 0 || g.length > 0) && /* @__PURE__ */ (0, p.jsxs)("div", { className: "modal__footer", children: [/* @__PURE__ */ (0, p.jsx)("div", { className: "modal__footer-left", children: h.length > 0 && T(h) }), g.length > 0 && /* @__PURE__ */ (0, p.jsx)("div", { className: "modal__footer-right", children: T(g) })] }) ] }) }), v); }; //#endregion export { l as n, m as t }; ;/* vite-per-chunk-css */ __vite_inject_css__(".modal{z-index:999;width:100%;height:100%;padding:calc(1.25rem * var(--ui-scale));opacity:0;visibility:hidden;background:#a3a8afcc;justify-content:center;align-items:center;transition:opacity .2s,visibility .2s;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}.modal__box{width:100%;max-height:94vh;background:var(--color-white);border-radius:var(--border-radius-xl);max-height:94dvh;box-shadow:var(--shadow-md);opacity:0;flex-direction:column;transition:opacity .1s,transform .2s;display:flex;position:relative;overflow:hidden;transform:translateY(100px)}.modal__header{width:100%;min-height:calc(3.75rem * var(--ui-scale));padding:calc(.625rem * var(--ui-scale)) calc(3.125rem * var(--ui-scale)) calc(.625rem * var(--ui-scale)) calc(1.5rem * var(--ui-scale));border-bottom:1px solid var(--color-gray-200);flex-shrink:0;align-items:center;display:flex}.modal__title-container{align-items:center;gap:calc(1.25rem * var(--ui-scale));display:flex}.modal__title{align-items:center;gap:calc(.625rem * var(--ui-scale));font-size:var(--font-size-xxl);font-weight:var(--font-weight-bold);display:flex}.modal__badge{min-width:calc(1.625rem * var(--ui-scale));height:calc(1.625rem * var(--ui-scale));background:var(--color-primary-ultra-light);border-radius:var(--border-radius-full);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-primary);justify-content:center;align-items:center;display:flex}.modal__close{top:calc(.5rem * var(--ui-scale));right:calc(.5rem * var(--ui-scale));width:calc(2.5rem * var(--ui-scale));height:calc(2.5rem * var(--ui-scale));border-radius:var(--border-radius-md);opacity:.6;color:var(--color-gray-700);cursor:pointer;background:0 0;border:0;justify-content:center;align-items:center;transition:opacity .1s,background-color .1s;display:flex;position:absolute}.modal__close:hover{background-color:var(--color-gray-100);opacity:1;color:var(--color-black)}.modal__body{padding:calc(1.5rem * var(--ui-scale)) calc(1.25rem * var(--ui-scale));flex:1;min-height:0;overflow:auto}.modal__footer{justify-content:space-between;gap:calc(.625rem * var(--ui-scale));padding:calc(1.25rem * var(--ui-scale));border-top:1px solid var(--color-gray-200);flex-flow:wrap;flex-shrink:0;display:flex}@media (max-width:480px){.modal__footer{padding:calc(.875rem * var(--ui-scale)) calc(1.25rem * var(--ui-scale));gap:calc(.875rem * var(--ui-scale))}.modal__footer .efp-button{width:100%;max-width:100%}}.modal__footer-left,.modal__footer-right{align-items:center;gap:calc(0rem * var(--ui-scale));display:flex}.modal__footer-right{flex:1;justify-content:flex-end}@media (max-width:480px){.modal__footer-right{align-self:flex-end}}.modal--default .modal__box{max-width:900px}.modal--share .modal__box{max-width:420px}.modal.isOpen{opacity:1;visibility:visible}.modal.isOpen .modal__box{opacity:1;transform:translateY(0)}@media (max-width:768px){.modal{padding:calc(1.25rem * var(--ui-scale)) 0 0 0;align-items:flex-end}.modal .modal__box{border-radius:0;border-top-left-radius:var(--border-radius-xl);border-top-right-radius:var(--border-radius-xl)}}.layout[dir=rtl] .modal__close{right:unset;left:0}\n/*$vite$:1*/", "Modal.css", false);