@expofp/floorplan/dist/esm/components/Exhibitor.js

Interactive floor plan library for expos and events

import{jsx as i,jsxs as n,Fragment as N}from"react/jsx-runtime";import"./Exhibitor.scss";import g from"classnames";import{observer as Q,useLocalStore as Z,useObserver as R}from"mobx-react-lite";import ee,{Suspense as T,useEffect as ie,useRef as C,useState as O}from"react";import{Transition as te}from"react-transition-group";import p from"../data";import a,{uiState as o}from"../store";import{RegularBooth as oe}from"../store/BoothStore";import{GaEventActions as d,sendEventToGa as D}from"../tools/gtag";import re from"../tools/logger";import y from"../tools/settings";import I from"../ui/Button";import{t as h}from"../utils/i18n";import ne from"../utils/is-mobile";import{useReaction as ae}from"../utils/mobx";import se from"../utils/useHeatmapOverlay";import le from"./AlertContainer";import U from"./ErrorBoundary";import ce from"./MarketMaterialList";import de from"./RebookingNotes";import he,{defaultRebookingOptions as me}from"./RebookingRadioGroup";import ue from"./Schedule";import be from"./ShowMoreButton";import ke from"./SidebarActions";import{getDescription as ge}from"./utils/getDescription";const G=ee.lazy(()=>import("./Gallery/Gallery")),pe=Q(function(){const S=C(null),r=Z(()=>({collapsed:!0,updateOverlayContent:null,get exhibitor(){return o.selectedExhibitor},get websiteTrimmed(){return this.exhibitor.website?this.exhibitor.website.replace(/^(http(s?):\/\/)([^/]+)(\/)?$/i,"$3"):""},get anySocial(){return o.kiosk?!1:!!["facebook","instagram","linkedin","twitter","googlePlus","xing","youtube"].find(e=>this.exhibitor[e])},get anyAddress(){return!!["address","address2","phone1","website","email"].find(e=>this.exhibitor[e])},get anyMedia(){return!!this.exhibitor.videoUrl||!!(this.exhibitor.gallery&&this.exhibitor.gallery.length)},get anyButtons(){return!!(this.exhibitor.customButtonTitle||this.exhibitor.customButton2Title||this.exhibitor.customButton3Title)},get disableCollapse(){return!this.anySocial&&!this.anyAddress&&!this.anyMedia&&!this.anyButtons||o.overlayPosition==="left"&&(this.exhibitor.description||"").length<800},get showEdit(){return!!(p.sendLoginLinkUrl&&this.sendLinkEmail)},get sendLinkEmail(){return this.exhibitor.privateEmail||this.exhibitor.email}})),{heatmapBar:A}=se(r.exhibitor),[w,M]=O(!1),[f,z]=O(!1),x=C(null);ie(()=>((()=>{if(x.current){const c=x.current.offsetHeight;M(c>300)}})(),()=>{a.exhibitorStore.rebookingStateChangeRequested=!1}),[]),ae(()=>r.exhibitor,()=>{S.current&&(S.current.parentElement.scrollTop=0),r.collapsed=!0});function _(e,c){if(u(c),o.kiosk)return e.preventDefault()}function H(e,c,m){D(d.ClickCustomButton,r.exhibitor.name);const b={externalId:r.exhibitor.externalId,buttonNumber:e,buttonUrl:c,preventDefault:m.preventDefault.bind(m)};o.onExhibitorCustomButtonClick&&o.onExhibitorCustomButtonClick(b)}function u(e){D(e,r.exhibitor.name)}const B=C(),V={entering:{opacity:1},entered:{opacity:1},exiting:{opacity:0},exited:{opacity:0}},E=150;return R(()=>{const e=r.exhibitor,c=p.isRebooking?(()=>{const t=new Set;for(const s of e.booths)s instanceof oe&&s.size&&t.add(s.size);const l=Array.from(t);return n("div",{children:[l.length>0&&i("div",{className:"booth__infos",style:{padding:"0 15px",marginBottom:"1rem"},children:n("div",{className:"booth__info",children:[i("div",{className:"booth__info-icon",children:i("i",{className:"icon-size"})}),n("div",{className:"booth__info-body",children:[i("div",{className:"booth__info-title",children:h("Size")}),i("div",{className:"booth__info-val",children:l.join(", ")})]})]})}),i(he,{showTitle:!1,options:me,checked:e.rebookingState.toString(),onChange:s=>a.exhibitorStore.setRebookingState(e,parseInt(s.target.value),e.rebookingNote)}),i(de,{state:"default",value:e.rebookingNote||"",onClickSave:s=>a.exhibitorStore.setRebookingState(e,e.rebookingState,s)}),i(te,{in:a.exhibitorStore.rebookingStateChangeRequested,nodeRef:B,timeout:E,appear:!0,enter:!0,exit:!0,mountOnEnter:!0,unmountOnExit:!0,children:s=>i("div",{ref:B,style:{position:"fixed",bottom:"1rem",left:"1rem",zIndex:9999,transition:`opacity ${E}ms ease-in-out`,opacity:0,...V[s]},children:i(le,{title:a.exhibitorStore.rebookingStateSaved?h("Changes saved"):h("Oops! Something went wrong"),variant:a.exhibitorStore.rebookingStateSaved?"success":"error",inline:!0,closable:!0,onClose:()=>{a.exhibitorStore.rebookingStateChangeRequested=!1}})})})]})})():null,m=g({exhibitor:!0,"is-featured":e.featured,bookmarked:e.bookmarked,[o.responsiveClass]:!0}),b=()=>{r.collapsed=!1,setTimeout(r.updateOverlayContent)};function k(t,l,s){return!t||!l||o.kiosk||o.previewMode?null:i("div",{className:"exhibitor-custom-button",children:i(I,{link:l,inline:!0,onClick:v=>{H(s,l,v)},target:"_blank",children:t})},s)}const X=({exhibitor:t})=>{const s=[k(t.customButtonTitle,t.customButtonUrl,1),k(t.customButton2Title,t.customButton2Url,2),k(t.customButton3Title,t.customButton3Url,3)].filter(Boolean);return s.length===0?null:i("div",{className:"exhibitor-custom-buttons",children:s})};function K(){return!p.hideShareButton&&!o.kiosk&&window.location.host.endsWith(".expofp.com")&&y.EXPO!=="globalaltsmiami2024"}function L(){r.updateOverlayContent()}const W=()=>{a.routeStore.clickRoute(null,a.routeStore.tempToBooth||e.booths[0]),a.routeStore.currentRouteExhibitor=e},J=t=>/^\d+$/.test(t),Y=t=>p.shortLevelName?t.layer?.shortName:t.layer?.description;return n("div",{className:m,"aria-label":h("Details"),children:[n("div",{className:"exhibitor__header",children:[n("div",{className:"exhibitor__header-name",children:[i("div",{className:"exhibitor__header-icon",children:i("i",{className:"icon-exhibitor-solid"})}),i("span",{dir:"auto",children:e.name}),A]}),i("button",{type:"button",onClick:()=>a.searchStore.handleBackAction(),className:"exhibitor__header-close",children:i("i",{className:"icon-close"})})]}),c||n(N,{children:[i("div",{className:"exhibitor__buttons",children:!o.isGuidedToursActive&&i(ke,{showBookmark:!o.disableBookmarked&&!p.hideBookmarks&&!o.kiosk,showDirections:e.booths.length>0&&y.wayfinding,inBookmark:e.bookmarked,showShare:K(),showVisited:!o.kiosk,visited:e.visited,onClickBookmark:F,onClickShare:P,onClickDirections:W,onClickVisited:$})}),e.leadingImageUrl?i("div",{className:"exhibitor__leading-image-container exhibitor-slider",children:e.leadingImageLinkUrl?i("a",{href:e.leadingImageLinkUrl,target:"_blank",rel:"noopener noreferrer",children:i("img",{src:e.leadingImageUrl,className:"exhibitor__leading-image",alt:"",crossOrigin:"anonymous"})}):i(U,{children:i(T,{fallback:null,children:i(G,{className:o.responsiveClass,onOpenGallery:()=>a.openGallery(),onCloseGallery:()=>a.closeGallery(),onImageLoadHeightUpdate:L,leading:!0,images:[e.leadingImageUrl]})})})}):null,n("div",{className:g("exhibitor__details",{"details-hidden":o.kiosk&&w&&!f}),ref:x,children:[n("div",{className:g("exhibitor-categories",{"is-links-disabled":o.isGuidedToursActive}),children:[e.featured&&i("div",{className:"exhibitor-featured",children:h("Featured")}),e.booths.map(t=>{const l=Y(t),s=v=>{v.preventDefault(),a.toggleMapOverlay(),a.selectBooth(t)};return n("a",{href:`?${t.slug}`,onClick:s,className:"exhibitor-categories__booth",children:[i("div",{className:"exhibitor-categories__booth-name",children:t.name}),l&&n("div",{className:"exhibitor-categories__booth-level",children:[J(l)?h("Level")+" ":"",l]})]},t.id)}),e.categories.map(t=>i("a",{href:"?"+encodeURIComponent(t.slug),onClick:l=>{l.preventDefault(),j(t)},className:t.sponsorship?"exhibitor-categories__sponsorship":"exhibitor-categories__cat",children:t.name},t.id))]}),e.description||e.logo?n("div",{className:g("exhibitor-description",{collapsed:r.collapsed&&!r.disableCollapse}),children:[e.logo?i("div",{className:g("exhibitor-description__logo",{"exhibitor-description__logo--left":!e.description}),children:i("img",{src:e.logo,alt:e.name,crossOrigin:"anonymous"})}):null,e.description?i("span",{className:"exhibitor-description__content",dir:"auto",dangerouslySetInnerHTML:{__html:ge(e.description)},onClick:b}):null]}):null,(!!e.schedule?.length||!!e.booths[0]?.schedule.length)&&i(ue,{events:[...e.schedule||e.booths[0]?.schedule||[]].sort((t,l)=>new Date(t.startDate).getTime()-new Date(l.startDate).getTime())}),!o.kiosk&&e.videoUrl&&navigator.onLine&&i("div",{className:"exhibitor-video",children:i("iframe",{src:e.videoUrl,"data-allow":"encrypted-media; autoplay; fullscreen",title:h("Exhibitor Video"),allowFullScreen:!0})}),e.gallery&&i("div",{className:"exhibitor-slider",onClick:()=>u(d.ViewGallery),children:i(U,{children:i(T,{fallback:null,children:i(G,{className:o.responsiveClass,onOpenGallery:()=>a.openGallery(),onCloseGallery:()=>a.closeGallery(),onImageLoadHeightUpdate:L,images:e.gallery})})})}),!o.kiosk&&e.marketMaterials&&n(N,{children:[i("div",{className:"exhibitor-sep"}),i(ce,{list:e.marketMaterials})]}),r.showEdit&&i("div",{className:"exhibitor-sep"}),!o.kiosk&&r.showEdit&&i("div",{className:"exhibitor-edit",children:i(I,{size:"sm",variant:"secondary",onClick:q,children:h("Edit")})}),r.anyAddress&&n("div",{className:"exhibitor-meta",children:[!!(e.address||e.address2)&&n("div",{className:"exhibitor-meta__item",children:[i("div",{className:"exhibitor-meta__icon",children:i("i",{className:"icon-marker-pin-solid"})}),n("div",{className:"exhibitor-meta__content",children:[e.address,!!e.address2&&i("div",{children:e.address2}),!!(e.city||e.state||e.zip)&&n("div",{children:[e.city,!!(e.city&&e.state)&&i("span",{children:" "}),e.state,!!(e.state&&e.zip)&&i("span",{children:"\xA0"})," ",e.zip]}),!!e.country&&i("div",{children:e.country})]})]}),!!e.phone1&&n("div",{className:"exhibitor-meta__item",children:[i("div",{className:"exhibitor-meta__icon",children:i("i",{className:"icon-phone-solid"})}),i("div",{className:"exhibitor-meta__content",children:i("a",{dir:"ltr",href:"tel:"+e.phone1,className:"exhibitor-meta__link",onClick:t=>_(t,d.ClickPhone),children:e.phone1})})]}),!!e.website&&n("div",{className:"exhibitor-meta__item",children:[i("div",{className:"exhibitor-meta__icon",children:i("i",{className:"icon-globe-solid"})}),i("div",{className:"exhibitor-meta__content",children:i("a",{href:e.website,target:"_blank",rel:"noopener noreferrer",className:"exhibitor-meta__link",onClick:t=>_(t,d.ClickWebsite),children:r.websiteTrimmed})})]}),!!e.email&&n("div",{className:"exhibitor-meta__item",children:[i("div",{className:"exhibitor-meta__icon",children:i("i",{className:"icon-mail-at-solid"})}),i("div",{className:"exhibitor-meta__content",children:i("a",{href:"mailto:"+e.email,target:"_blank",rel:"noopener noreferrer",className:"exhibitor-meta__link",onClick:t=>_(t,d.ClickEmail),children:e.email})})]}),r.anySocial&&n("div",{className:"exhibitor-meta__socials",children:[i("a",{href:e.facebook,className:"exhibitor-meta__social",onClick:()=>u(d.ClickFacebook),target:"_blank",rel:"noopener noreferrer",children:i("i",{className:"icon-facebook"})}),i("a",{href:e.instagram,className:"exhibitor-meta__social",onClick:()=>u(d.ClickInstagaram),target:"_blank",rel:"noopener noreferrer",children:i("i",{className:"icon-instagram"})}),i("a",{href:e.linkedin,className:"exhibitor-meta__social",onClick:()=>u(d.ClickLinkedin),target:"_blank",rel:"noopener noreferrer",children:i("i",{className:"icon-linkedin"})}),i("a",{href:e.twitter,className:"exhibitor-meta__social",onClick:()=>u(d.ClickTwitter),target:"_blank",rel:"noopener noreferrer",children:i("i",{className:"icon-twitter-x"})}),i("a",{href:e.xing,className:"exhibitor-meta__social",onClick:()=>u(d.ClickXing),target:"_blank",rel:"noopener noreferrer",children:i("i",{className:"icon-xing"})}),i("a",{href:e.youtube,className:"exhibitor-meta__social",onClick:()=>u(d.ClickYoutube),target:"_blank",rel:"noopener noreferrer",children:i("i",{className:"icon-youtube"})})]})]}),i(X,{exhibitor:e})]}),o.kiosk&&w&&i(be,{className:g("exhibitor__show-more",{"is-sticky":f}),expanded:f,onClick:()=>z(t=>!t)})]})]})});function P(){const e=window.navigator,c={title:o.selectedExhibitor.name,url:window.location.href};ne&&e?.canShare&&e.canShare(c)?e.share(c):a.toggleModal("share")}function j(e){a.clickCategory(e)}function q(e){if(o.kiosk)return e.preventDefault();e.target.blur();const c=r.sendLinkEmail;if(!window.confirm(h("Send login instructions to {{email}} to edit profile?",{email:c}))||y.EXPO==="expo")return;const m=new XMLHttpRequest;m.open("POST",p.sendLoginLinkUrl),m.setRequestHeader("Content-Type","application/json");function b(){alert(h("Error sending login instructions"))}m.onload=function(k){if(this.status!==200){b();return}alert(h("A link to edit profile was sent to {{email}}",{email:c}))},m.onerror=function(k){re.error("Error",k),b()},m.send(JSON.stringify({id:r.exhibitor.id}))}function F(){r.exhibitor.bookmarked=!r.exhibitor.bookmarked,o.onBookmarkClick&&o.onBookmarkClick({name:r.exhibitor.name,bookmarked:r.exhibitor.bookmarked,externalId:r.exhibitor.externalId})}function $(){r.exhibitor.visited=!r.exhibitor.visited,o.onVisitedClick&&o.onVisitedClick({name:r.exhibitor.name,visited:r.exhibitor.visited,externalId:r.exhibitor.externalId})}});export default()=>R(()=>i(N,{children:!o.menu&&o.selectedExhibitor?i(pe,{}):null}));