@carto/ps-react-ui 2.1.0 → 2.1.2

package/dist/index.cjs

@@ -24,4 +24,4 @@ Check the render method of \``+e+"`."}return""}}function lr(e){{if(e!==void 0){v
 
 Check your code at `+r+":"+n+"."}return""}}var De={};function cr(e){{var r=ke();if(!r){var n=typeof e=="string"?e:e.displayName||e.name;n&&(r=`
 
-Check the top-level render call using <`+n+">.")}return r}}function Me(e,r){{if(!e._store||e._store.validated||e.key!=null)return;e._store.validated=!0;var n=cr(r);if(De[n])return;De[n]=!0;var o="";e&&e._owner&&e._owner!==fe.current&&(o=" It was passed a child from "+j(e._owner.type)+"."),V(e),C('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',n,o),V(null)}}function Ae(e,r){{if(typeof e!="object")return;if(le(e))for(var n=0;n<e.length;n++){var o=e[n];pe(o)&&Me(o,r)}else if(pe(e))e._store&&(e._store.validated=!0);else if(e){var c=E(e);if(typeof c=="function"&&c!==e.entries)for(var f=c.call(e),u;!(u=f.next()).done;)pe(u.value)&&Me(u.value,r)}}}function fr(e){{var r=e.type;if(r==null||typeof r=="string")return;var n;if(typeof r=="function")n=r.propTypes;else if(typeof r=="object"&&(r.$$typeof===p||r.$$typeof===O))n=r.propTypes;else return;if(n){var o=j(r);He(n,e.props,"prop",o,e)}else if(r.PropTypes!==void 0&&!de){de=!0;var c=j(r);C("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",c||"Unknown")}typeof r.getDefaultProps=="function"&&!r.getDefaultProps.isReactClassApproved&&C("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function dr(e){{for(var r=Object.keys(e.props),n=0;n<r.length;n++){var o=r[n];if(o!=="children"&&o!=="key"){V(e),C("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",o),V(null);break}}e.ref!==null&&(V(e),C("Invalid attribute `ref` supplied to `React.Fragment`."),V(null))}}function Ie(e,r,n,o,c,f){{var u=oe(e);if(!u){var s="";(e===void 0||typeof e=="object"&&e!==null&&Object.keys(e).length===0)&&(s+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var D=lr(c);D?s+=D:s+=ke();var x;e===null?x="null":le(e)?x="array":e!==void 0&&e.$$typeof===a?(x="<"+(j(e.type)||"Unknown")+" />",s=" Did you accidentally export a JSX literal instead of a component?"):x=typeof e,C("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",x,s)}var _=ur(e,r,n,c,f);if(_==null)return _;if(u){var F=r.children;if(F!==void 0)if(o)if(le(F)){for(var W=0;W<F.length;W++)Ae(F[W],e);Object.freeze&&Object.freeze(F)}else C("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else Ae(F,e)}return e===i?dr(_):fr(_),_}}function pr(e,r,n){return Ie(e,r,n,!0)}function vr(e,r,n){return Ie(e,r,n,!1)}var gr=vr,mr=pr;z.Fragment=i,z.jsx=gr,z.jsxs=mr}()),z}process.env.NODE_ENV==="production"?ve.exports=Rr():ve.exports=_r();var d=ve.exports;const Tr={box:{marginLeft:({spacing:t})=>t(1)}};function Cr({items:t,itemsToShow:a=10,label:l,ListProps:i,texts:{showMore:b="View all",showLess:v="Collapse list"}={},unit:w,formatter:R,onRowClick:p}){const[m,h]=y.useState(!0),O=()=>{h(!m)},g=S=>R?R(S):S,T=y.useMemo(()=>{const S=m?a:t.length;return t.slice(0,S)},[t,a,m]),k=t.length>a;return d.jsxs(P.Box,{width:"100%",height:"auto",children:[l&&d.jsx(P.Typography,{variant:"caption",color:"textSecondary",gutterBottom:!0,children:l}),d.jsx(P.List,{...i,component:"ul",children:T.map(S=>d.jsxs(P.ListItemButton,{divider:!0,onClick:E=>p?.(E,S),children:[d.jsx(P.ListItemText,{primary:S.name}),d.jsx(jr,{value:g(S.value),unit:w})]},S.id))}),k&&d.jsx(P.Button,{variant:"text",color:"primary",size:"small",onClick:O,children:m?b:v})]})}function jr({value:t,unit:a}){return d.jsx(P.Box,{sx:Tr.box,children:d.jsxs(P.Typography,{variant:"body2",align:"right",noWrap:!0,children:[a," ",t]})})}var re=(t=>(t.Roadmap="roadmap",t.Satellite="satellite",t.Terrain="terrain",t))(re||{}),te=(t=>(t.DarkMatter="dark-matter",t.Positron="positron",t.Voyager="voyager",t))(te||{});const Ye={positron:"https://basemaps.cartocdn.com/gl/positron-gl-style/style.json",voyager:"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json",["dark-matter"]:"https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json"};function Ne({basemap:t,instanceRef:a,layers:l,overlayRef:i,viewState:b,height:v="100%",id:w="deck-gl-map",style:R={},width:p="100%",getCursor:m,getTooltip:h,onClick:O,onDrag:g,onDragEnd:T,onDragStart:k,onHover:S,onResize:E,onViewStateChange:A}){if(!Object.values(te).includes(t))return d.jsx("div",{children:"Invalid basemap"});const $=Ye[t];return d.jsx(hr,{ref:i,viewState:{...b},controller:!0,layers:l,onViewStateChange:A,onResize:E,onHover:S,onDrag:g,onClick:O,onDragStart:k,onDragEnd:T,getCursor:m,id:w,height:v,width:p,style:R,getTooltip:h,children:d.jsx(yr.Map,{ref:a,reuseMaps:!0,mapStyle:$,mapLib:br})})}function qe(t){let a=null;return Object.values(re).includes(t?.basemap)||(a="Invalid basemap"),t?.apiKey||(a="Google Maps API key is required"),a?d.jsx("div",{children:a}):d.jsx(Sr,{...t})}function Sr({apiKey:t,basemap:a,instanceRef:l,layers:i,overlayRef:b,viewState:v,height:w="100%",id:R="google-map-script",language:p="en",mapOptions:m,style:h={},version:O,width:g="100%",getTooltip:T,onResize:k,onViewStateChange:S}){const E=l,A=y.useRef(null),C=y.useRef(),[$,ne]=y.useState(v),ae={position:"absolute",zIndex:0,left:0,top:0,width:g,height:w,...h},G=v.maxZoom??24,Z=v.minZoom??0,Y=y.useMemo(()=>({mapTypeControl:!1,fullscreenControl:!1,zoomControl:!1,streetViewControl:!1,mapTypeId:a,maxZoom:G,minZoom:Z,...m}),[a,G,Z,m]),{isLoaded:N}=Er.useJsApiLoader({id:R,googleMapsApiKey:t,language:p,version:O}),oe=()=>{const I=We(E?.current),j={zoom:$e(E?.current),longitude:I.lng,latitude:I.lat};Or(C.current,j)&&(C.current=j,typeof S=="function"&&S({viewState:j}))},J=y.useCallback(()=>{if(!A.current)return;const I=Ve(v),j={lat:v.latitude,lng:v.longitude},L={zoom:I,center:j,...Y},M=new google.maps.Map(A.current,L);b?.current&&(b.current=new xr.GoogleMapsOverlay({layers:i,getTooltip:T})),M.addListener("bounds_changed",oe),M.addListener("resize",()=>{typeof k=="function"&&k({height:M.getDiv().offsetHeight,width:M.getDiv().offsetWidth})}),E?.current&&(E.current=M)},[]);return y.useEffect(()=>{if(N)return J(),()=>{E?.current&&google.maps.event.clearInstanceListeners(E.current),b?.current&&b.current.finalize()}},[N,J,E,b]),y.useEffect(()=>{E?.current.setOptions(Y)},[Y,i,T,a,E]),y.useEffect(()=>{const I=setTimeout(()=>{ne(v)},300);return()=>{clearTimeout(I)}},[v]),y.useEffect(()=>{if(E?.current){const I=Ve($),j={lat:$.latitude,lng:$.longitude},L=$e(E?.current),M=We(E?.current);I!==L&&E?.current.setZoom(I),(M.lng!==j.lng||M.lat!==j.lat)&&E?.current.setCenter(j)}},[$,E]),d.jsx("div",{ref:A,style:ae})}const wr=["longitude","latitude","zoom"];function Or(t,a){return t?wr.some(l=>t[l]!==a[l]):!0}function $e(t){return t?.getZoom()-1}function Ve(t){return t.zoom+1}function We(t){const a=t?.getCenter();return{lat:a?.lat(),lng:a?.lng()}}function Pr(t){const a=y.useMemo(()=>Object.values(te).includes(t?.basemap)?Ne:Object.values(re).includes(t?.basemap)?qe:null,[t?.basemap]);return a?d.jsx(a,{...t}):d.jsx("div",{children:"MapComponent: Invalid basemap"})}const kr={contentBox:{paddingBottom:2,paddingX:2}},Dr=P.styled(P.Box,{shouldForwardProp:t=>t!=="scrollMarginTop"})(({scrollMarginTop:t})=>({height:"auto",scrollMarginTop:t,width:"100%"})),Mr=P.styled(P.Box,{shouldForwardProp:t=>t!=="scrollMarginTop"})(({scrollMarginTop:t,theme:{spacing:a,palette:l}})=>({alignItems:"center",backgroundColor:l.grey[100],display:"flex",height:a(3),justifyContent:"center",position:"sticky",top:t,width:"100%",zIndex:1}));function Ar({title:t,id:a,anchor:l=!1,scrollMarginTop:i=0,children:b,BoxProps:v}){return d.jsxs(Dr,{scrollMarginTop:i,id:a,"data-anchor":l,...v,children:[d.jsx(Mr,{scrollMarginTop:i,children:d.jsx(P.Typography,{variant:"caption",children:t})}),d.jsx(P.Box,{sx:kr.contentBox,children:d.jsx(d.Fragment,{children:b})})]})}const Ir={tabsWrapper:{backgroundColor:({palette:t})=>t.background.paper,left:0,position:"sticky",top:0,width:"100%",zIndex:2,"& .MuiTab-root:last-of-type":{marginRight:0},"& .MuiTab-textColorPrimary":{color:({palette:t})=>t.text.primary,"&.Mui-selected":{color:({palette:t})=>t.primary.main}},"& .MuiTabs-indicator.colorPrimary":{backgroundColor:({palette:t})=>t.primary.main}}};function Fr({children:t,anchor:a,TabsProps:l,variant:i="standard",onChange:b}){const v=(w,R)=>{w.preventDefault(),b?.(R)};return d.jsx(P.Box,{sx:Ir.tabsWrapper,children:d.jsx(P.Tabs,{indicatorColor:"primary",textColor:"primary","aria-label":"Explore sections",...l,value:a,variant:i,onChange:v,children:t})})}function Ue(t){var a,l,i="";if(typeof t=="string"||typeof t=="number")i+=t;else if(typeof t=="object")if(Array.isArray(t))for(a=0;a<t.length;a++)t[a]&&(l=Ue(t[a]))&&(i&&(i+=" "),i+=l);else for(a in t)t[a]&&(i&&(i+=" "),i+=a);return i}function Lr(){for(var t,a,l=0,i="";l<arguments.length;)(t=arguments[l++])&&(a=Ue(t))&&(i&&(i+=" "),i+=a);return i}const Br={box:{borderRadius:({spacing:t})=>`0 0 ${t(.5)} ${t(.5)}`,flex:1,height:"100%",margin:"0 auto",maxWidth:({breakpoints:t})=>t.values.lg,overflow:"auto",position:"relative",width:"100%"}};function $r({children:t,currentAnchor:a,BoxProps:l,className:i,timeout:b=50,onChange:v}){const w=y.useRef(null),R=y.useRef([]),p=y.useRef(0),m=y.useRef(a);y.useEffect(()=>{const g=Array.from(w.current?.querySelectorAll('[data-anchor="true"]')||[]);if(R.current=[...g].reverse(),!R.current.length)throw new Error('initialization of ScrollToAnchor: Missing sections with data-anchor="true" attribute.')},[]),y.useEffect(()=>{const g=T=>{const k=w.current?.querySelector(`#${T}`);if(!k){console.warn(`Warning: navigation of ScrollToAnchor: the section you want to navigate to does not exist. To create it add the #${T} id property to an element.`);return}if(k){k.scrollIntoView({behavior:"smooth"});const S=setInterval(()=>{k.offsetTop===p.current&&(m.current=T,clearInterval(S))},b)}};a!==m.current&&g(a)},[a,b]);const h=y.useCallback(()=>{const T=R.current.find(k=>p.current>=k.offsetTop)?.id||"";m.current!==T&&(m.current=T,v(T))},[v]),O=y.useCallback(g=>{g.stopPropagation(),p.current=g.currentTarget.scrollTop,a===m.current&&requestAnimationFrame(()=>h())},[a,h]);return d.jsx(P.Box,{ref:w,sx:Br.box,...l,className:Lr(i),"data-scroller":!0,onScroll:g=>O(g),children:t})}function Vr(t){return t.map(a=>{const l=a,i=String(a);return{value:l,label:i}})}exports.CartoBasemapURL=Ye;exports.CartoBasemapsNames=te;exports.DeckGLMapsComponent=Ne;exports.GMapsBasemap=re;exports.GoogleMapsComponent=qe;exports.ListData=Cr;exports.MapComponent=Pr;exports.ScrollToAnchor=$r;exports.SectionContainer=Ar;exports.TabsToAnchor=Fr;exports.createSelectOptionsFromArray=Vr;
+Check the top-level render call using <`+n+">.")}return r}}function Me(e,r){{if(!e._store||e._store.validated||e.key!=null)return;e._store.validated=!0;var n=cr(r);if(De[n])return;De[n]=!0;var o="";e&&e._owner&&e._owner!==fe.current&&(o=" It was passed a child from "+j(e._owner.type)+"."),V(e),C('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',n,o),V(null)}}function Ae(e,r){{if(typeof e!="object")return;if(le(e))for(var n=0;n<e.length;n++){var o=e[n];pe(o)&&Me(o,r)}else if(pe(e))e._store&&(e._store.validated=!0);else if(e){var c=E(e);if(typeof c=="function"&&c!==e.entries)for(var f=c.call(e),u;!(u=f.next()).done;)pe(u.value)&&Me(u.value,r)}}}function fr(e){{var r=e.type;if(r==null||typeof r=="string")return;var n;if(typeof r=="function")n=r.propTypes;else if(typeof r=="object"&&(r.$$typeof===p||r.$$typeof===O))n=r.propTypes;else return;if(n){var o=j(r);He(n,e.props,"prop",o,e)}else if(r.PropTypes!==void 0&&!de){de=!0;var c=j(r);C("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",c||"Unknown")}typeof r.getDefaultProps=="function"&&!r.getDefaultProps.isReactClassApproved&&C("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function dr(e){{for(var r=Object.keys(e.props),n=0;n<r.length;n++){var o=r[n];if(o!=="children"&&o!=="key"){V(e),C("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",o),V(null);break}}e.ref!==null&&(V(e),C("Invalid attribute `ref` supplied to `React.Fragment`."),V(null))}}function Ie(e,r,n,o,c,f){{var u=oe(e);if(!u){var s="";(e===void 0||typeof e=="object"&&e!==null&&Object.keys(e).length===0)&&(s+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var D=lr(c);D?s+=D:s+=ke();var x;e===null?x="null":le(e)?x="array":e!==void 0&&e.$$typeof===a?(x="<"+(j(e.type)||"Unknown")+" />",s=" Did you accidentally export a JSX literal instead of a component?"):x=typeof e,C("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",x,s)}var _=ur(e,r,n,c,f);if(_==null)return _;if(u){var F=r.children;if(F!==void 0)if(o)if(le(F)){for(var W=0;W<F.length;W++)Ae(F[W],e);Object.freeze&&Object.freeze(F)}else C("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else Ae(F,e)}return e===i?dr(_):fr(_),_}}function pr(e,r,n){return Ie(e,r,n,!0)}function vr(e,r,n){return Ie(e,r,n,!1)}var gr=vr,mr=pr;z.Fragment=i,z.jsx=gr,z.jsxs=mr}()),z}process.env.NODE_ENV==="production"?ve.exports=Rr():ve.exports=_r();var d=ve.exports;const Tr={box:{marginLeft:({spacing:t})=>t(1)}};function Cr({items:t,itemsToShow:a=10,label:l,ListProps:i,texts:{showMore:b="View all",showLess:v="Collapse list"}={},unit:w,formatter:R,onRowClick:p}){const[m,h]=y.useState(!0),O=()=>{h(!m)},g=S=>R?R(S):S,T=y.useMemo(()=>{const S=m?a:t.length;return t.slice(0,S)},[t,a,m]),k=t.length>a;return d.jsxs(P.Box,{width:"100%",height:"auto",children:[l&&d.jsx(P.Typography,{variant:"caption",color:"textSecondary",gutterBottom:!0,children:l}),d.jsx(P.List,{...i,component:"ul",children:T.map(S=>d.jsxs(P.ListItemButton,{divider:!0,onClick:E=>p?.(E,S),children:[d.jsx(P.ListItemText,{primary:S.name}),d.jsx(jr,{value:g(S.value),unit:w})]},S.id))}),k&&d.jsx(P.Button,{variant:"text",color:"primary",size:"small",onClick:O,children:m?b:v})]})}function jr({value:t,unit:a}){return d.jsx(P.Box,{sx:Tr.box,children:d.jsxs(P.Typography,{variant:"body2",align:"right",noWrap:!0,children:[a," ",t]})})}var re=(t=>(t.Roadmap="roadmap",t.Satellite="satellite",t.Terrain="terrain",t))(re||{}),te=(t=>(t.DarkMatter="dark-matter",t.Positron="positron",t.Voyager="voyager",t))(te||{});const Ye={positron:"https://basemaps.cartocdn.com/gl/positron-gl-style/style.json",voyager:"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json",["dark-matter"]:"https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json"};function Ne({basemap:t,instanceRef:a,layers:l,overlayRef:i,viewState:b,height:v="100%",id:w="deck-gl-map",style:R={},width:p="100%",getCursor:m,getTooltip:h,onClick:O,onDrag:g,onDragEnd:T,onDragStart:k,onHover:S,onResize:E,onViewStateChange:A}){if(!Object.values(te).includes(t))return d.jsx("div",{children:"Invalid basemap"});const $=Ye[t];return d.jsx(hr,{ref:i,viewState:{...b},controller:!0,layers:l,onViewStateChange:A,onResize:E,onHover:S,onDrag:g,onClick:O,onDragStart:k,onDragEnd:T,getCursor:m,id:w,height:v,width:p,style:R,getTooltip:h,children:d.jsx(yr.Map,{ref:a,reuseMaps:!0,mapStyle:$,mapLib:br})})}function qe(t){let a=null;return Object.values(re).includes(t?.basemap)||(a="Invalid basemap"),t?.apiKey||(a="Google Maps API key is required"),a?d.jsx("div",{children:a}):d.jsx(Sr,{...t})}function Sr({apiKey:t,basemap:a,instanceRef:l,layers:i,overlayRef:b,viewState:v,height:w="100%",id:R="google-map-script",language:p="en",mapOptions:m,style:h={},version:O,width:g="100%",getTooltip:T,onResize:k,onViewStateChange:S}){const E=l,A=y.useRef(null),C=y.useRef(),[$,ne]=y.useState(v),ae={position:"absolute",zIndex:0,left:0,top:0,width:g,height:w,...h},G=v.maxZoom??24,Z=v.minZoom??0,Y=y.useMemo(()=>({mapTypeControl:!1,fullscreenControl:!1,zoomControl:!1,streetViewControl:!1,mapTypeId:a,maxZoom:G,minZoom:Z,...m}),[a,G,Z,m]),{isLoaded:N}=Er.useJsApiLoader({id:R,googleMapsApiKey:t,language:p,version:O}),oe=()=>{const I=We(E?.current),j={zoom:$e(E?.current),longitude:I.lng,latitude:I.lat};Or(C.current,j)&&(C.current=j,typeof S=="function"&&S({viewState:j}))},J=y.useCallback(()=>{if(!A.current)return;const I=Ve(v),j={lat:v.latitude,lng:v.longitude},L={zoom:I,center:j,...Y},M=new google.maps.Map(A.current,L);b?.current&&(b.current=new xr.GoogleMapsOverlay({layers:i,getTooltip:T})),M.addListener("bounds_changed",oe),M.addListener("resize",()=>{typeof k=="function"&&k({height:M.getDiv().offsetHeight,width:M.getDiv().offsetWidth})}),E?.current&&(E.current=M)},[]);return y.useEffect(()=>{if(N)return J(),()=>{E?.current&&google.maps.event.clearInstanceListeners(E.current),b?.current&&b.current.finalize()}},[N,J,E,b]),y.useEffect(()=>{E?.current?.setOptions(Y)},[Y,i,T,a,E]),y.useEffect(()=>{const I=setTimeout(()=>{ne(v)},300);return()=>{clearTimeout(I)}},[v]),y.useEffect(()=>{if(E?.current){const I=Ve($),j={lat:$.latitude,lng:$.longitude},L=$e(E?.current),M=We(E?.current);I!==L&&E?.current.setZoom(I),(M.lng!==j.lng||M.lat!==j.lat)&&E?.current.setCenter(j)}},[$,E]),d.jsx("div",{ref:A,style:ae})}const wr=["longitude","latitude","zoom"];function Or(t,a){return t?wr.some(l=>t[l]!==a[l]):!0}function $e(t){return t?.getZoom()-1}function Ve(t){return t.zoom+1}function We(t){const a=t?.getCenter();return{lat:a?.lat(),lng:a?.lng()}}function Pr(t){const a=y.useMemo(()=>Object.values(te).includes(t?.basemap)?Ne:Object.values(re).includes(t?.basemap)?qe:null,[t?.basemap]);return a?d.jsx(a,{...t}):d.jsx("div",{children:"MapComponent: Invalid basemap"})}const kr={contentBox:{paddingBottom:2,paddingX:2}},Dr=P.styled(P.Box,{shouldForwardProp:t=>t!=="scrollMarginTop"})(({scrollMarginTop:t})=>({height:"auto",scrollMarginTop:t,width:"100%"})),Mr=P.styled(P.Box,{shouldForwardProp:t=>t!=="scrollMarginTop"})(({scrollMarginTop:t,theme:{spacing:a,palette:l}})=>({alignItems:"center",backgroundColor:l.grey[100],display:"flex",height:a(3),justifyContent:"center",position:"sticky",top:t,width:"100%",zIndex:1}));function Ar({title:t,id:a,anchor:l=!1,scrollMarginTop:i=0,children:b,BoxProps:v}){return d.jsxs(Dr,{scrollMarginTop:i,id:a,"data-anchor":l,...v,children:[d.jsx(Mr,{scrollMarginTop:i,children:d.jsx(P.Typography,{variant:"caption",children:t})}),d.jsx(P.Box,{sx:kr.contentBox,children:d.jsx(d.Fragment,{children:b})})]})}const Ir={tabsWrapper:{backgroundColor:({palette:t})=>t.background.paper,left:0,position:"sticky",top:0,width:"100%",zIndex:2,"& .MuiTab-root:last-of-type":{marginRight:0},"& .MuiTab-textColorPrimary":{color:({palette:t})=>t.text.primary,"&.Mui-selected":{color:({palette:t})=>t.primary.main}},"& .MuiTabs-indicator.colorPrimary":{backgroundColor:({palette:t})=>t.primary.main}}};function Fr({children:t,anchor:a,TabsProps:l,variant:i="standard",onChange:b}){const v=(w,R)=>{w.preventDefault(),b?.(R)};return d.jsx(P.Box,{sx:Ir.tabsWrapper,children:d.jsx(P.Tabs,{indicatorColor:"primary",textColor:"primary","aria-label":"Explore sections",...l,value:a,variant:i,onChange:v,children:t})})}function Ue(t){var a,l,i="";if(typeof t=="string"||typeof t=="number")i+=t;else if(typeof t=="object")if(Array.isArray(t))for(a=0;a<t.length;a++)t[a]&&(l=Ue(t[a]))&&(i&&(i+=" "),i+=l);else for(a in t)t[a]&&(i&&(i+=" "),i+=a);return i}function Lr(){for(var t,a,l=0,i="";l<arguments.length;)(t=arguments[l++])&&(a=Ue(t))&&(i&&(i+=" "),i+=a);return i}const Br={box:{borderRadius:({spacing:t})=>`0 0 ${t(.5)} ${t(.5)}`,flex:1,height:"100%",margin:"0 auto",maxWidth:({breakpoints:t})=>t.values.lg,overflow:"auto",position:"relative",width:"100%"}};function $r({children:t,currentAnchor:a,BoxProps:l,className:i,timeout:b=50,onChange:v}){const w=y.useRef(null),R=y.useRef([]),p=y.useRef(0),m=y.useRef(a);y.useEffect(()=>{const g=Array.from(w.current?.querySelectorAll('[data-anchor="true"]')||[]);if(R.current=[...g].reverse(),!R.current.length)throw new Error('initialization of ScrollToAnchor: Missing sections with data-anchor="true" attribute.')},[]),y.useEffect(()=>{const g=T=>{const k=w.current?.querySelector(`#${T}`);if(!k){console.warn(`Warning: navigation of ScrollToAnchor: the section you want to navigate to does not exist. To create it add the #${T} id property to an element.`);return}if(k){k.scrollIntoView({behavior:"smooth"});const S=setInterval(()=>{k.offsetTop===p.current&&(m.current=T,clearInterval(S))},b)}};a!==m.current&&g(a)},[a,b]);const h=y.useCallback(()=>{const T=R.current.find(k=>p.current>=k.offsetTop)?.id||"";m.current!==T&&(m.current=T,v(T))},[v]),O=y.useCallback(g=>{g.stopPropagation(),p.current=g.currentTarget.scrollTop,a===m.current&&requestAnimationFrame(()=>h())},[a,h]);return d.jsx(P.Box,{ref:w,sx:Br.box,...l,className:Lr(i),"data-scroller":!0,onScroll:g=>O(g),children:t})}function Vr(t){return t.map(a=>{const l=a,i=String(a);return{value:l,label:i}})}exports.CartoBasemapURL=Ye;exports.CartoBasemapsNames=te;exports.DeckGLMapsComponent=Ne;exports.GMapsBasemap=re;exports.GoogleMapsComponent=qe;exports.ListData=Cr;exports.MapComponent=Pr;exports.ScrollToAnchor=$r;exports.SectionContainer=Ar;exports.TabsToAnchor=Fr;exports.createSelectOptionsFromArray=Vr;

package/dist/index.js

@@ -834,7 +834,7 @@ function $r({
         b?.current && google.maps.event.clearInstanceListeners(b.current), y?.current && y.current.finalize();
       };
   }, [z, K, b, y]), B(() => {
-    b?.current.setOptions(N);
+    b?.current?.setOptions(N);
   }, [N, i, R, a, b]), B(() => {
     const I = setTimeout(() => {
       te(v);

package/dist/types/components/map/components/deckgl-map/deckgl-maps.stories.d.ts

@@ -52,8 +52,8 @@ declare const meta: {
             minZoom: number;
             maxZoom: number;
         };
-        instanceRef: null;
-        overlayRef: null;
+        instanceRef: undefined;
+        overlayRef: undefined;
     };
     decorators: ((Story: import("@storybook/types").PartialStoryFn<import("@storybook/react/dist/types-0a347bb9").R, {
         getCursor?: (({ isDragging }: {
@@ -65,9 +65,9 @@ declare const meta: {
         onDragStart?: ((info: unknown, event: unknown) => void) | null | undefined;
         onHover?: ((info: unknown, event: unknown) => void) | null | undefined;
         basemap: import("../../types").Basemap;
-        instanceRef: import("react").MutableRefObject<google.maps.Map | import("react-map-gl").MapRef> | null;
+        instanceRef: import("react").MutableRefObject<google.maps.Map | import("react-map-gl").MapRef | null>;
         layers: unknown[];
-        overlayRef: import("react").MutableRefObject<GoogleMapsOverlay> | null;
+        overlayRef: import("react").MutableRefObject<any>;
         viewState: import("../../types").ViewState;
         height?: import("csstype").Property.Height<0 | (string & {})> | undefined;
         id?: string | undefined;

package/dist/types/components/map/components/google-maps/google-maps.stories.d.ts

@@ -58,8 +58,8 @@ declare const meta: {
             maxZoom: number;
         };
         apiKey: string;
-        instanceRef: null;
-        overlayRef: null;
+        instanceRef: undefined;
+        overlayRef: undefined;
     };
     decorators: ((Story: import("@storybook/types").PartialStoryFn<import("@storybook/react/dist/types-0a347bb9").R, {
         apiKey: string;
@@ -67,9 +67,9 @@ declare const meta: {
         mapOptions?: Record<string, string | number> | undefined;
         version?: string | undefined;
         basemap: import("../../types").Basemap;
-        instanceRef: import("react").MutableRefObject<google.maps.Map | import("react-map-gl").MapRef> | null;
+        instanceRef: import("react").MutableRefObject<google.maps.Map | import("react-map-gl").MapRef | null>;
         layers: unknown[];
-        overlayRef: import("react").MutableRefObject<GoogleMapsOverlay> | null;
+        overlayRef: import("react").MutableRefObject<any>;
         viewState: import("../../types").ViewState;
         height?: import("csstype").Property.Height<0 | (string & {})> | undefined;
         id?: string | undefined;

package/dist/types/components/map/map.stories.d.ts

@@ -57,8 +57,8 @@ declare const meta: {
             maxZoom: number;
         };
         apiKey: string;
-        instanceRef: null;
-        overlayRef: null;
+        instanceRef: undefined;
+        overlayRef: undefined;
     };
     decorators: ((Story: import("@storybook/types").PartialStoryFn<import("@storybook/react/dist/types-0a347bb9").R, {
         getCursor?: (({ isDragging }: {
@@ -70,9 +70,9 @@ declare const meta: {
         onDragStart?: ((info: unknown, event: unknown) => void) | null | undefined;
         onHover?: ((info: unknown, event: unknown) => void) | null | undefined;
         basemap: import("./types").Basemap;
-        instanceRef: import("react").MutableRefObject<google.maps.Map | import("react-map-gl").MapRef> | null;
+        instanceRef: import("react").MutableRefObject<google.maps.Map | import("react-map-gl").MapRef | null>;
         layers: unknown[];
-        overlayRef: import("react").MutableRefObject<GoogleMapsOverlay> | null;
+        overlayRef: import("react").MutableRefObject<any>;
         viewState: import("./types").ViewState;
         height?: import("csstype").Property.Height<0 | (string & {})> | undefined;
         id?: string | undefined;

package/dist/types/components/map/types.d.ts

@@ -36,9 +36,9 @@ export type ViewStateProps = {
 export type MapsProps = DeckGLMapsProps & GoogleMapsProps;
 type CommonProps = {
     basemap: Basemap;
-    instanceRef: MutableRefObject<google.maps.Map | MapRef> | null;
+    instanceRef: MutableRefObject<google.maps.Map | MapRef | null>;
     layers: unknown[];
-    overlayRef: MutableRefObject<GoogleMapsOverlay> | null;
+    overlayRef: MutableRefObject<GoogleMapsOverlay | null>;
     viewState: ViewState;
     height?: Properties['height'];
     id?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@carto/ps-react-ui",
-  "version": "2.1.0",
+  "version": "2.1.2",
   "description": "CARTO's Professional Service React UI library",
   "files": [
     "dist"