@maker-ui/layout - npm Package Compare versions

Comparing version 1.0.0-beta.11 to 1.0.0-beta.12

dist/layout.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("react-use-measure")),n=require("react"),r=e(require("deepmerge")),a=require("@emotion/react"),o=require("@maker-ui/css"),i=require("@maker-ui/primitives"),s={fonts:{body:"sans-serif",heading:"sans-serif",monospace:"monospace"},breakpoints:["768px","960px","1440px"],colors:{light:{link:"red",link_hover:"green",text:"#333",background:"#ffffff",primary:"#1858dc",secondary:"#355cac",accent:"#1858dc",muted:"#f6f6f6",border:"#e6e6e6",bg_topbar:"#355cac",bg_header:"#ffffff",bg_mobileMenu:"black",bg_sideNav:"#eee",bg_footer:"#d3d3d3",bg_toolbar:"#fbfbfb"}},persistentColorMode:!0,useColorDefaults:!0,useMeasurementDefaults:!0,variables:{},topbar:{maxWidth:1260,hideOnMobile:!1,breakpoint:0},header:{navType:"basic",mobileNavType:"basic",maxWidth:1460,sticky:!1,stickyOnMobile:!1,stickyUpScroll:!1,showColorButton:!0,hideColorButtonOnMobile:!1,hideWidgetsOnMobile:!0,menuOverflow:"wrap",dropdown:{caret:"default",transition:"fade"},breakpoint:0},mobileMenu:{width:"60vw",transition:"slide-left",cssTransition:"all ease 0.3s",visibleOnDesktop:!1,showCloseButton:!0,closeOnBlur:!0,closeOnRouteChange:!1},sideNav:{width:[250,300],isHeader:!1,isPrimaryMobileNav:!1,showToggleOnMobile:!0,toggleButton:"default",closeOnBlur:!0,closeOnRouteChange:!0,cssTransition:"transform ease 0.3s",breakpoint:0},content:{maxWidth:1020,maxWidthSection:1020,sidebarGap:30,breakpoint:0},sidebar:{width:300,secondWidth:200},footer:{maxWidth:1020},a11y:{skiplinks:!0},errors:{showStackTrace:!1}},l=n.createContext({}),c=n.createContext((function(){}));function u(e,t){return r(e,t,{arrayMerge:function(e,t,n){return t}})}var d=function(e){var t=e.options,r=e.children,a=n.useState(u(function(e){var t=s;return e||(t.colors={}),t}(!1!==(null==t?void 0:t.useColorDefaults)),t)),o=a[0],i=a[1];return n.useEffect((function(){i((function(e){return u(e,t)}))}),[t]),n.createElement(l.Provider,{value:o},n.createElement(c.Provider,{value:i},r))};function m(){var e=n.useContext(l);if(void 0===e)throw new Error("useOptions must be used within a Maker UI Layout component");return e}function v(){return(v=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function p(e,t){return(p=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function f(e,t){if(null==e)return{};var n,r,a={},o=Object.keys(e);for(r=0;r<o.length;r++)t.indexOf(n=o[r])>=0||(a[n]=e[n]);return a}function h(e,t){switch(t.type){case"MENU":return v({},e,{menuActive:!e.menuActive});case"SIDENAV":return v({},e,{sideNavActive:!e.sideNavActive});case"PANEL-LEFT":return v({},e,{leftPanelActive:!e.leftPanelActive});case"PANEL-RIGHT":return v({},e,{rightPanelActive:!e.rightPanelActive});default:throw new Error("Unhandled action type.")}}var b=n.createContext({}),g=n.createContext((function(){})),y=function(e){var t=e.children,r=n.useReducer(h,{menuActive:!1,sideNavActive:!1,leftPanelActive:!0,rightPanelActive:!0,toolbarActive:!0});return n.createElement(b.Provider,{value:r[0]},n.createElement(g.Provider,{value:r[1]},t))};function x(){var e=n.useContext(b).menuActive,t=n.useContext(g);if(void 0===typeof e)throw new Error("useMenu must be used within an Maker UI layout");return[e,function(){t({type:"MENU"})}]}function k(){var e=n.useContext(b).sideNavActive,t=n.useContext(g);if(void 0===typeof e)throw new Error("useSideNav must be used within an Maker UI layout");return[e,function(){t({type:"SIDENAV"})}]}var w=function(e,t){return"string"==typeof e?[e]:e<t.length?[t[e]]:[e]},N=function(e){return isNaN(e)?e:e+"px"},E=["fade","fade-up","fade-down"],j=function(e,t,n){var r=t.includes("fade")?e?1:0:1,a=e?"visible":"hidden",o=t.includes("right")?{right:0,width:n,transform:e?null:"translateX(100%)"}:{left:0,width:n,transform:e?null:"translateX(-100%)"},i=E.includes(t)?v({width:"100%",left:0},"fade"!==t?{transform:e?null:"translateY("+("fade-up"===t?"":"-")+"20px)"}:null):o;return v({opacity:r,visibility:a},i)};function M(e){return e?e.join(" ").replace(/ +(?= )/g,"").trim():void 0}var C={"*":{boxSizing:"border-box"},body:{margin:0,fontFamily:"var(--font-body)",color:"var(--color-text)",backgroundColor:"var(--color-background)"},"h1, h2, h3, h4, h5, h6":{fontFamily:"var(--font-heading)"},"code, pre":{fontFamily:"var(--font-monospace)"},"b, strong":{fontWeight:"bold"},a:{color:"var(--color-link)","&:hover":{color:"var(--color-link_hover)"}}},O=["content sidebar","content sidenav","content","sidebar content","sidebar content sidebar","sidenav content","page-transition"],_=n.createContext({state:{},setState:function(){}}),S=function(e){var t=e.styles,a=void 0===t?{}:t,i=e.children,l=m(),c=n.useState({layout_nav:l.header.navType,layout_navMobile:l.header.mobileNavType,layout_content:"content",height_header:0,height_topbar:0,height_toolbar:0,colorTheme:Object.keys(l.colors)[0]||"light"}),u=c[0],d=c[1];n.useEffect((function(){d((function(e){return v({},e,{layout_nav:l.header.navType,layout_navMobile:l.header.mobileNavType})}))}),[l]),n.useEffect((function(){var e="object"==typeof l.persistentColorMode&&null!==l.persistentColorMode;if(e||l.persistentColorMode){var t=e?l.persistentColorMode.key:"color-theme";if(localStorage.getItem(t)){var n=JSON.parse(localStorage.getItem(t)).theme;document.body.dataset.theme=n,d((function(e){return v({},e,{colorTheme:n})}))}else{var r=Object.keys(null==l?void 0:l.colors)[0];localStorage.setItem(t,JSON.stringify({theme:r})),document.body.dataset.theme=r,d((function(e){return v({},e,{colorTheme:r})}))}}}),[]);var p=r(function(e){var t=Object.keys(e),n={};return t.forEach((function(t){for(var r,a="body[data-theme='"+t+"']",o=((r={})[a]={},r),i=0,s=Object.entries(e[t]);i<s.length;i++){var l=s[i];o[a]["--color-"+l[0]]=l[1]}n=v({},n,o)})),n}(l.colors),function(e){for(var t=r(s,e,{arrayMerge:function(e,t,n){return t}}),n=t.breakpoints,a=t.fonts,o=t.topbar,i=t.header,l=t.mobileMenu,c=t.variables,u=t.content,d=t.sidebar,m=t.sideNav,v=t.footer,p=n.map((function(e){return"@media(min-width: "+N(e)+")"})),f={},h={},b=0,g=Object.entries(c);b<g.length;b++){var y=g[b];h["--"+y[0]]=y[1]}function x(e){for(var t=function(){var e=a[n],t=e[0],o=e[1];if(o)if(Array.isArray(o)){var i={};i[t]=N(o[0]),o.forEach((function(e,n){var r;0!==n&&(i[p[n]]=((r={})[t]=N(e),r))})),f=r(f,i)}else f[t]=N(o)},n=0,a=Object.entries(e);n<a.length;n++)t()}x({"--maxWidth_header":null==i?void 0:i.maxWidth,"--maxWidth_topbar":null==o?void 0:o.maxWidth,"--maxWidth_content":null==u?void 0:u.maxWidth,"--maxWidth_section":null==u?void 0:u.maxWidthSection,"--maxWidth_footer":null==v?void 0:v.maxWidth,"--width_mobileMenu":null==l?void 0:l.width,"--width_sidebar":null==d?void 0:d.width,"--width_second_sidebar":null==d?void 0:d.secondWidth,"--width_sideNav":null==m?void 0:m.width,"--gap_content":null==u?void 0:u.sidebarGap}),x(h);for(var k=0,w=Object.entries(a);k<w.length;k++){var E=w[k];f["--font-"+E[0]]=E[1]}return f["--breakpoints"]=n.join(","),{html:f}}(l));return n.createElement(_.Provider,{value:{state:u,setState:d}},n.createElement(o.Global,{styles:p}),n.createElement(o.Global,{styles:C}),n.createElement(o.Global,{styles:a}),i)};function A(e){var t=n.useContext(_),r=t.state,a=t.setState;if(void 0===r)throw new Error("useLayout must be used within a Maker UI Layout component");function o(t){a((function(n){var r;return v({},n,((r={})["layout_"+e]=t,r))}))}return"nav"===e?[r.layout_nav,o]:"mobileNav"===e?[r.layout_navMobile,o]:[r.layout_content,o]}function T(){var e=n.useContext(_),t=e.state,r=e.setState;if(void 0===t)throw new Error("useMeasurement must be used within an Maker UI Layout component");return{measurements:t,setMeasurement:function(e,t){r((function(n){var r;return v({},n,((r={})["height_"+e]=t,r))}))}}}var B=function(e){var t=m().a11y,n=A("content"),r=[];return r=e.links?e.links:[{id:"#content",label:"Skip to content"},{id:"#footer",label:"Skip to footer"}],n[0].includes("sidenav")&&r.splice(1,0,{id:"#sidenav",label:"Skip to side navigation"}),t.skiplinks?o.jsx("ul",{className:"skiplinks",css:{listStyle:"none",position:"relative",zIndex:1e3,padding:0,margin:0,a:{background:"var(--color-bg_header)",display:"block",position:"absolute",fontFamily:"var(--font-body)",left:-9999,padding:"1em","&:focus":{left:0}}}},r.map((function(e){var t=e.id;return o.jsx("li",{key:t},o.jsx("a",{href:t},e.label))}))):null};B.displayName="Skiplinks";var W=function(e){var t=e.options,o=e.styles,i=e.theme,s=void 0===i?{}:i,l=e.skiplinks,c=e.children;return n.createElement(a.ThemeProvider,{theme:t.breakpoints?r(s,{breakpoints:t.breakpoints}):s},n.createElement(d,{options:t},n.createElement(S,{styles:o},n.createElement(y,null,n.createElement(B,{links:l}),c))))};W.displayName="MakerUI_Layout";var I=function(e){return n.createElement(i.SVG,Object.assign({viewBox:"0 0 512 512"},e),n.createElement("path",{d:"M256 0C114.497 0 0 114.507 0 256c0 141.503 114.507 256 256 256 141.503 0 256-114.507 256-256C512 114.497 397.493 0 256 0zm0 472c-119.393 0-216-96.615-216-216 0-119.393 96.615-216 216-216 119.393 0 216 96.615 216 216 0 119.393-96.615 216-216 216z"}),n.createElement("path",{d:"M256 128.877c-11.046 0-20 8.954-20 20V277.67c0 11.046 8.954 20 20 20s20-8.954 20-20V148.877c0-11.046-8.954-20-20-20z"}),n.createElement("circle",{cx:"256",cy:"349.16",r:"27"}))},P=function(e){var t=e.showStackTrace,r=e.errorInfo;return n.createElement(i.Div,{className:"error-boundary"},n.createElement(I,{css:{height:30}}),n.createElement("div",null,"There was an issue loading this section of the app.",n.createElement(i.Span,{css:{marginLeft:"5px",cursor:"pointer",color:"var(--color-primary)"},onClick:function(){var e;return null===(e=window)||void 0===e?void 0:e.location.reload()}},"Try reloading the page.")),t?n.createElement(i.Div,{css:{details:{paddingLeft:"20px",whiteSpace:"pre"},summary:{cursor:"pointer"}}},n.createElement("details",{className:"error-details"},n.createElement("summary",null,"Click for error details"),r?r.componentStack.toString():null)):null)},F=["Main","SideNav","Sidebar","PageTransition"],L=function(){return n.createElement(i.Div,{css:{margin:"150px auto",maxWidth:600,fontSize:"20px",lineHeight:1.5,"li, span":{padding:"0 8px",fontFamily:"monospace",backgroundColor:"var(--color-muted)",fontSize:"18px",borderRadius:3,border:"1px solid gainsboro"}}},n.createElement(i.Flex,{inline:!0,align:"center",justify:"center",css:{width:"100%",padding:"20px",mb:"30px",background:"var(--color-muted)",strong:{marginRight:"20px"}}},n.createElement(I,{css:{height:35,marginRight:"10px"}}),n.createElement("strong",null,"Error")," Invalid layout configuration."),n.createElement(i.Div,null,n.createElement("p",null,"The ",n.createElement("span",null,"Content")," component only accepts the following direct children:"),n.createElement(i.UList,{css:{columns:2,margin:"50px 0 35px",li:{marginBottom:"10px",width:"min-content"}}},F.map((function(e,t){return n.createElement("li",{key:t},e)}))),n.createElement("p",null,"If your custom child component has fixed positioning or is a Provider, you can still use it here by assigning the component a"," ",n.createElement("strong",null,"displayName")," of 'Fixed', 'Provider', or 'Context'."),n.createElement("p",null,n.createElement("a",{href:"https://maker-ui.com/docs/content",target:"_blank",rel:"noreferrer"},"See the docs")," ","for a complete list of layout configurations.")))},H=function(e){var t,r;function a(){var t;return(t=e.apply(this,arguments)||this).state={error:"",errorInfo:"",hasError:!1},t}r=e,(t=a).prototype=Object.create(r.prototype),t.prototype.constructor=t,p(t,r),a.getDerivedStateFromError=function(e){return{error:e,hasError:!0}};var o=a.prototype;return o.componentDidCatch=function(e,t){var n=this.props.logFunction||this.context.errors.logFunction||!1;n&&n(e,t,this.props.errorKey),this.setState({errorInfo:t})},o.render=function(){return this.state.hasError?this.props.errorMessage||this.context.errors.errorMessage[""+this.props.errorKey]?this.context.errors.errorMessage[""+this.props.errorKey]:n.createElement(P,{showStackTrace:this.context.errors.errorMessage.showStackTrace,errorInfo:this.state.errorInfo}):this.props.children},a}(n.Component);H.contextType=l;var z=["id","background","maxWidth","sticky","stickyOnMobile","scrollOverflow","className","_css","css","children"],R=function(e){var r=m(),a=r.topbar,i=r.breakpoints,s=t(),l=s[0],c=s[1].height,u=T().setMeasurement;n.useEffect((function(){0!==c&&u("topbar",c)}),[c]);var d=e.id,p=e.background,h=void 0===p?"var(--color-bg_topbar)":p,b=e.maxWidth,g=void 0===b?"var(--maxWidth_topbar)":b,y=e.sticky,x=void 0===y?a.sticky:y,k=e.stickyOnMobile,N=void 0===k?a.stickyOnMobile:k,E=e.scrollOverflow,j=void 0!==E&&E,C=e.className,O=e._css,_=e.css,S=e.children,A=f(e,z),B=x?N?"sticky":["relative","sticky"]:!x&&N?["sticky","relative"]:void 0;return o.jsx("aside",{ref:l,id:M(["topbar",d]),className:C,breakpoints:w(a.breakpoint,i),css:v({background:h,top:0,zIndex:101,position:B,display:a.hideOnMobile?["none","block"]:["block"]},O)},o.jsx("div",Object.assign({className:"container",css:v({margin:"0 auto",overflowX:j?"scroll":void 0,whiteSpace:j?"nowrap":void 0,maxWidth:g},_)},A),o.jsx(H,{errorKey:"topbar"},S)))};R.displayName="Topbar";var D="undefined"!=typeof window;function U(){if(!D)return 0;var e=document.body.getBoundingClientRect();return Math.abs(e.top)}function K(e,t,r){void 0===r&&(r=!0);var a=n.useRef(U());n.useEffect((function(){if(r&&D){var n,o=function(){var t=U();e({prevPos:a.current,currPos:t}),a.current=t,n=void 0},i=function(){t?void 0===n&&(n=setTimeout(o,t)):o()};return window.addEventListener("scroll",i),function(){return window.removeEventListener("scroll",i)}}}),[e,t,r])}var G=["absolute","background","sticky","stickyOnMobile","stickyUpScroll","className","css","children"],V=function(e){var r=n.useState(""),a=r[0],i=r[1],s=n.useState(!0),l=s[0],c=s[1],u=n.useState(!0),d=u[0],p=u[1],h=T(),b=h.measurements,g=h.setMeasurement,y=m(),x=y.header,k=y.topbar,N=y.breakpoints,E=!!x.scrollClass,j=t(),C=j[0],O=j[1].height;n.useEffect((function(){0!==O&&g("header",O)}),[O]),n.useEffect((function(){c(!1)}),[]);var _=e.absolute,S=void 0===_?x.absolute:_,A=e.background,B=void 0===A?"var(--color-bg_header)":A,W=e.sticky,I=void 0===W?x.sticky:W,P=e.stickyOnMobile,F=void 0===P?x.stickyOnMobile:P,L=e.stickyUpScroll,z=void 0===L?x.stickyUpScroll:L,R=e.className,D=e.css,U=e.children,V=f(e,G);K((function(e){var t=e.currPos,n=t>e.prevPos,r=t>500;r||d||p(!0),r&&n&&d&&p(!1),!r||n||d||p(!0)}),350,z),K((function(e){if(E){var t=x.scrollClass,n=e.currPos>t.scrollTop?t.className:"";n!==a&&i(n)}}),0,E);var q=function(){return k.sticky&&!k.stickyOnMobile?[0,b.height_topbar]:k.sticky&&k.stickyOnMobile?b.height_topbar:!k.sticky&&k.stickyOnMobile?[b.height_topbar,0]:0},Y=S?"fixed":"sticky",X=S?"absolute":"relative",J=[a,z&&!d?"scroll-active":""].join(" ");return o.jsx("header",Object.assign({ref:C,className:M([J,R]),role:"banner",breakpoints:w(x.breakpoint,N),css:v({background:B,zIndex:100,width:S?"100%":void 0,visibility:l?"hidden":void 0},z?{position:Y,top:q(),transition:"transform .3s ease-in","&.scroll-active":{transform:"translateY(-100%)"}}:I?{top:q(),position:F?[Y]:[X,Y]}:!I&&F?{top:q(),position:[Y,X]}:{position:X},D)},V),o.jsx(H,{errorKey:"header"},U))};V.displayName="Header";var q=function(e){var t=e.children,r=m().linkFunction,a={id:"site-logo","aria-label":"Home page"};return r?r("/",t,a):n.createElement(i.Link,Object.assign({href:"/"},a,{css:{display:"inline-flex"}}),t)};q.displayName="Logo";var Y=["isHeaderButton","customButton","breakpoints","className","css"],X=function(e){var t,r,a,o=e.isHeaderButton,s=e.customButton,l=e.breakpoints,c=e.className,u=e.css,d=f(e,Y),p=m(),h=p.header,b=p.breakpoints,g=(t=m(),r=n.useContext(_),a=r.setState,{colorTheme:r.state.colorTheme,setColorTheme:function(e){t.persistentColorMode&&localStorage.setItem("color-theme",JSON.stringify({theme:e})),document.body.dataset.theme=e,a((function(t){return v({},t,{colorTheme:e})}))},colors:t.colors?Object.keys(t.colors):["light"]}),y=g.colorTheme,x=g.setColorTheme,k=g.colors,N=v({title:"Color Theme",className:M(["color-button",c]),"aria-label":"Toggle Color Mode",onClick:function(){var e=k.indexOf(y);x(k[(e+1)%k.length])},breakpoints:o?w(h.breakpoint,b):l},d),E=s||h.colorButton;return 1===k.length?null:o&&h.showColorButton||!o?"function"==typeof E?E(y,N):n.createElement(i.Button,Object.assign({},N,{css:v({display:o&&h.hideColorButtonOnMobile?["none","block"]:["block"]},u)}),E||y):null};X.displayName="ColorButton";var J=function(e){var t=e.show,r=e.set;return n.createElement(i.Button,{title:"Expand Section",className:"submenu-toggle","aria-expanded":t?"true":"false","aria-label":"Expand Section",onClick:function(){return r(!t)},css:{border:"none",background:"transparent"}},n.createElement(i.SVG,{viewBox:"0 0 16 16",width:"12",height:"12",css:{transition:"transform ease .2s",transformOrigin:"50% 55%",transform:t?"rotate(180deg)":void 0}},n.createElement("path",{stroke:"currentcolor",strokeWidth:"2",fill:"none",d:"M14 6 L8 12 L2 6"})))};J.displayName="ExpandButton";var Q={opacity:1,visibility:"visible"},Z={transition:"all ease .3s"},$=function(e){switch(e){case"scale":return{transform:"scale(1, 1)",li:{opacity:1,transition:"opacity ease-in-out .2s .2s"}};case"fade-down":case"fade-up":return v({},Q,{transform:"translateY(0)"});case"fade":default:return Q}},ee={display:"inline-block",background:"var(--color-bg_header)",width:"max-content",opacity:0,visibility:"hidden",margin:0,padding:0,zIndex:1,listStyle:"none",a:{width:"100%"},li:{display:"block"}},te=function(e){switch(e){case"scale":return v({},Q,{transform:"scale(1, 0)",transformOrigin:"0 0",transition:"transform ease-in-out .25s",li:{opacity:0,transition:"opacity .03s ease-in-out"}});case"fade-up":return v({},Z,{transform:"translateY(10px)"});case"fade-down":return v({},Z,{transform:"translateY(-10px)"});case"fade":return v({},Z,{transform:"translateY(0)"});default:return{}}},ne={position:"absolute",top:"99%",left:0},re={position:"fixed",height:"100%",left:"100%",top:0},ae=function(e,t,n){return e?r.all([ee,0===n?ne:re,te(t)],{arrayMerge:function(e,t,n){return t}}):{}},oe={content:'""',display:"inline-block",width:0,height:0,marginLeft:".4em",verticalAlign:".25em",borderTop:".25em solid",borderRight:".25em solid transparent",borderLeft:".25em solid transparent"},ie=n.memo((function(e){var t=e.data,r=t.label,a=t.path,s=t.newTab,l=t.submenu,c=t.openNested,u=void 0!==c&&c,d=t.classes,p=void 0===d?"":d,f=t.icon,h=e.caret,b=void 0!==h&&h,g=e.menuControls,y=e.pathname,x=e.isHeader,k=void 0!==x&&x,w=e.linkFunction,N=e.depth,E=void 0===N?0:N,j=m().header,C=n.useState(u),O=C[0],_=C[1],S="submenu depth-"+E,A=v({className:y===a?"current":void 0,target:s&&"_blank",rel:s&&"noopener noreferrer","aria-label":f&&r,"aria-haspopup":l&&"true","aria-current":y===a&&"page"},g);return o.jsx("li",{className:M(["menu-item",p]),css:k?{position:"relative",display:"inline-flex","&:focus-within > .submenu, &:hover > .submenu":v({},$(j.dropdown.transition)),"> a .menu-text:after":l&&"default"===b&&oe}:void 0},o.jsx(se,{condition:!(k||!l),wrapper:function(e){return o.jsx("div",{css:{display:"flex"}},e)}},o.jsx(n.Fragment,null,w?w(a,r,A,f):o.jsx(i.Link,Object.assign({href:a},A),f?o.jsx("span",{className:"menu-icon"},f):void 0,o.jsx("span",{className:"menu-text"},r),l&&b&&n.isValidElement(b)?b:null),!k&&l?o.jsx(J,{set:_,show:O}):null)),l&&o.jsx(n.Fragment,null,k||!k&&O?o.jsx("ul",{className:S,role:"menu","aria-label":"submenu",css:v({},ae(k,j.dropdown.transition,E))},l.map((function(e,t){return o.jsx(ie,{key:t,data:e,caret:b,menuControls:g,pathname:y,isHeader:k,depth:E+1})}))):null))}));ie.displayName="MenuItem";var se=function(e){var t=e.children;return e.condition?(0,e.wrapper)(t):t},le=["menu","menuType","pathname","className","css"],ce=n.forwardRef((function(e,t){var n=e.menu,r=void 0===n?[]:n,a=e.menuType,i=e.pathname,s=e.className,l=e.css,c=f(e,le),u=m(),d=u.mobileMenu,p=u.sideNav,h=u.linkFunction,b=x()[1],g=k()[1],y=function(){if("mobile"===a&&d.closeOnRouteChange)return{onClick:function(){return b()}};if("undefined"!=typeof window&&"sideNav"===a&&p.closeOnRouteChange){var e=document.getElementById("sidenav");if(!window||!e)return;return{onClick:"fixed"===window.getComputedStyle(e,"").position?function(){return g()}:void 0}}};return o.jsx("ul",Object.assign({ref:t,className:M(["collapse-menu",s]),role:"navigation",css:v({},l)},c),r.map((function(e,t){return o.jsx(ie,{key:t,data:e,menuControls:y(),pathname:i,linkFunction:h})})))}));ce.displayName="CollapsibleMenu";var ue=["customButton","visibleOnDesktop","isCloseButton","className","css"],de=function(e){var t=e.customButton,r=e.visibleOnDesktop,a=e.isCloseButton,o=e.className,s=e.css,l=f(e,ue),c=x(),u=c[0],d=c[1],p=k(),h=p[0],b=p[1],g=m(),y=g.header,N=g.sideNav,E=g.breakpoints,j=t||(null==y?void 0:y.menuButton),C=r?"block":["block","none"],O=null!=N&&N.isPrimaryMobileNav?{"aria-expanded":!!h,onClick:b}:{"aria-expanded":!!u,onClick:d},_=v({title:"Menu",className:M(["menu-button",o]),"aria-label":"Toggle Menu"},O,l);return"function"==typeof j?j(N.isPrimaryMobileNav?h:u,_):n.createElement(i.Button,Object.assign({},_,{breakpoints:w(null==y?void 0:y.breakpoint,E),css:v({display:C,margin:0,border:"none",background:"none",svg:{margin:"0 auto"}},s)}),j||n.createElement(i.SVG,{viewBox:"0 0 24 24",css:{display:"block",height:a?35:27}},n.createElement("path",a?{d:"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"}:{d:"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"})))};de.displayName="MenuButton";var me=function(e){var t=e.menuItems,n=void 0===t?[]:t,r=e.pathname,a=m(),i=a.header,s=a.linkFunction;return o.jsx("nav",{className:"nav-primary",role:"navigation",breakpoints:w(i.breakpoint,a.breakpoints),css:{display:["none","flex"]}},o.jsx("ul",{className:"menu-primary"},n.map((function(e,t){var n;return o.jsx(ie,{key:t,data:e,caret:null===(n=i.dropdown)||void 0===n?void 0:n.caret,pathname:r,linkFunction:s,isHeader:!0})}))))};me.displayName="NavMenu";var ve=function(e){var t=e.content,n=m(),r=n.header;return t?o.jsx("div",{className:"widget-area",breakpoints:r?w(r.breakpoint,n.breakpoints):void 0,css:{display:null!=r&&r.hideWidgetsOnMobile?["none","flex"]:"flex"}},t):null};ve.displayName="WidgetArea";var pe={basic:{areas:'"logo menu nav"',columns:"auto 1fr auto",navArea:"flex-start",menuArea:"flex-end"},"basic-left":{areas:'"logo menu nav"',columns:"auto 1fr auto",navArea:"flex-start",menuArea:"flex-start"},"basic-center":{areas:'"logo menu nav"',columns:"auto 1fr auto",navArea:"flex-start",menuArea:"center"},center:{areas:'"logo logo" "menu nav"',columns:"1fr",navArea:"flex-start",menuArea:"center"},split:{areas:'"menu-split logo menu nav"',columns:"1fr auto 1fr",navArea:"flex-start",menuArea:!1},reverse:{areas:'"menu logo nav"',columns:"1fr auto 1fr",navArea:"flex-end",menuArea:!1},minimal:{areas:'"logo nav"',columns:"auto 1fr",navArea:"flex-end",menuArea:!1},"minimal-left":{areas:'"button logo nav"',columns:"auto auto 1fr",navArea:"flex-end",menuArea:!1},"minimal-center":{areas:'"button logo nav"',columns:"1fr auto 1fr",navArea:"flex-end",menuArea:!1}},fe={basic:{areas:'"logo nav"',columns:"auto 1fr",navArea:"flex-end"},"basic-menu-left":{areas:'"button logo nav"',columns:"auto auto 1fr",navArea:"flex-end"},"logo-center":{areas:'"button logo nav"',columns:"1fr auto 1fr",navArea:"flex-end"},"logo-center-alt":{areas:'"nav logo button"',columns:"1fr auto 1fr",navArea:"flex-start"}};function he(e,t){return{gridTemplateAreas:[fe[t].areas,pe[e].areas],gridTemplateColumns:[fe[t].columns,pe[e].columns],gridTemplateRows:["1fr","center"!==e?"1fr":"1fr 1fr"],gap:0,".nav-area":v({},be(e),{justifyContent:[fe[t].navArea,pe[e].navArea]}),".menu-area":{justifyContent:pe[e].menuArea?pe[e].menuArea:void 0},".menu-area.split":{justifyContent:"flex-end"},"&.layout-center .logo-area":{justifyContent:"center"},"&.layout-minimal, &.layout-minimal-left, &.layout-minimal-center":{".menu-area":{display:"none"}},"&.layout-minimal-center .button-area":{justifyContent:"flex-start"},"&.m-layout-logo-center-alt .button-area":{justifyContent:["flex-end","flex-start"]}}}function be(e){return["center","split"].includes(e)?{position:["relative","absolute"],top:0,right:0,height:"100%"}:void 0}var ge=["minimal-left","minimal-center"],ye=["basic-menu-left","logo-center","logo-center-alt"],xe=function(e){var t=m(),r=t.header,a=t.mobileMenu,o=t.breakpoints,s=A("nav"),l=s[0],c=s[1],u=A("mobileNav"),d=u[0],p=u[1],f=w(r.breakpoint,o),h=e.type,b=e.mobileType,g=e.logo,y=void 0===g?"Logo":g,x=e.menu,k=e.logoArea,N=e.navArea,E=e.menuArea,j=e.menuButton,C=e.colorButton,O=e.maxWidth,_=void 0===O?"var(--maxWidth_header)":O,S=e.className,T=e.id,B=e.css,W=x&&Math.ceil(x.length/2);n.useEffect((function(){void 0!==h&&h!==l&&c(h),void 0!==b&&b!==d&&p(b)}),[h,b,l,d]);var I="scroll"===r.menuOverflow?{".menu-area":{overflowX:"scroll",whiteSpace:"nowrap"}}:void 0;return n.createElement(i.Grid,{id:T,className:M(["nav-grid layout-"+l,"m-layout-"+d,S]),breakpoints:f,css:v({maxWidth:_,margin:"0 auto",position:"relative"},he(l,d),I,B)},ge.includes(l)||ye.includes(d)?n.createElement(i.Flex,{align:"center",className:"button-area",breakpoints:f,css:{gridArea:"button",display:[ye.includes(d)?"flex":"none",ge.includes(l)?"flex":"none"]}},n.createElement(de,{breakpoints:f,customButton:j,visibleOnDesktop:!0})):null,"split"===l?n.createElement(i.Flex,{align:"center",className:"menu-area split",breakpoints:f,css:{gridArea:"menu-split",display:["none","flex"]}},E?null:n.createElement(me,{menuItems:null==x?void 0:x.slice(0,W)})):null,n.createElement(i.Flex,{align:"center",className:"logo-area",css:{gridArea:"logo"}},k||n.createElement(q,null,y)),n.createElement(i.Flex,{align:"center",className:"menu-area",breakpoints:f,css:{gridArea:"menu",display:["none","flex"]}},E||n.createElement(me,{menuItems:"split"===l?null==x?void 0:x.slice(W):x})),n.createElement(i.Flex,{align:"center",className:"nav-area",css:{gridArea:"nav"}},n.createElement(ve,{content:N}),n.createElement(de,{customButton:j,breakpoints:f,css:{display:[ye.includes(d)?"none":"block","minimal"===l||a.visibleOnDesktop?"block":"none"]}}),n.createElement(X,{isHeaderButton:!0,customButton:C})))};xe.displayName="Navbar";var ke=function(e){return o.jsx("div",{className:"menu-overlay"+(e.show?" active":""),role:"button",onClick:e.toggle,css:{position:"fixed",top:0,left:0,right:0,bottom:0,background:"rgba(0, 0, 0, 0.15)",zIndex:100,willChange:"opacity",transition:"all ease .4s",visibility:"hidden",opacity:0,"&.active":{visibility:"visible",opacity:1}}})};ke.displayName="Overlay";var we=["id","background","center","closeButton","closeButtonPosition","width","transition","menu","pathname","header","footer","className","css","children"],Ne=n.forwardRef((function(e,t){var r=x(),a=r[0],i=r[1],s=m().mobileMenu,l=e.id,c=e.background,u=void 0===c?"var(--color-bg_mobileMenu)":c,d=e.center,p=e.closeButton,h=void 0===p?s.closeButton:p,b=e.closeButtonPosition,g=void 0===b?"top-right":b,y=e.width,k=void 0===y?"var(--width_mobileMenu)":y,w=e.transition,N=void 0===w?s.transition:w,C=e.menu,O=void 0===C?[]:C,_=e.pathname,S=e.header,A=e.footer,T=e.className,B=e.css,W=e.children,I=f(e,we),P=d?{display:"flex",alignItems:"center",justifyContent:"center",flexDirection:"column"}:void 0,F=g.includes("right")?{right:0}:{left:0},L=g.includes("top")?{top:0}:{bottom:0};return o.jsx(n.Fragment,null,s.closeOnBlur&&!E.includes(N)?o.jsx(ke,{show:a,toggle:i}):null,o.jsx("div",Object.assign({ref:t,id:M(["mobile-menu",l]),className:M([a?"active":"",T]),css:v({position:"fixed",background:u,top:0,bottom:0,zIndex:100,willChange:"transform, opacity",transition:s.cssTransition},j(a,N,k),P,B)},I),o.jsx(H,{errorKey:"mobileMenu"},s.showCloseButton||h?o.jsx(de,{customButton:h,isCloseButton:!0,css:v({position:"absolute"},L,F)}):null,S||null,W||o.jsx(ce,{menu:O,menuType:"mobile",pathname:_}),A||null)))}));Ne.displayName="MobileMenu";var Ee=["id","children","css"],je=function(e){var t=e.id,r=e.children,a=e.css,i=f(e,Ee),s=n.useState(!0),l=s[0],c=s[1],u=m(),d=u.content,p=u.sideNav,h=u.breakpoints,b=function(e,t){var r=A("content"),a=r[0],o=r[1],i=n.useState(!1),s=i[0],l=i[1];return n.useEffect((function(){if(t){var e=function(e,t){if("string"==typeof t)return"unknown";var r=n.Children.toArray(t);return r?r.map((function(e){return e.type.displayName?e.type.displayName.toLowerCase():"unknown"})).join(" ").replace("main","content").replace(/fixed|provider|context/g,"").replace(/ {2,}/g," ").trim():"unknown"}(0,t);O.find((function(t){return t===e}))?a!==e&&o(e):l(!0)}}),[a,o,"content",t]),{layout:a,showError:s}}(0,r),g=b.layout,y=b.showError;n.useEffect((function(){c(!1)}),[]);var x=function(e){var t,n=T().measurements,r=m(),a=r.topbar,o=r.header,i=r.sideNav;if(e&&e.includes("sidebar"))return v({display:"grid",gap:"var(--gap_content)",maxWidth:"var(--maxWidth_content)",margin:"0 auto",minHeight:"80vh"},"sidebar content"===e?{".sidebar":{gridRow:[2,"auto"]}}:"sidebar content sidebar"===e?{".sidebar:first-of-type":{gridRow:[2,"auto"]}}:null,{gridTemplateColumns:["1fr",(t="var(--width_sidebar)","sidebar content"===e?t+" 1fr":"sidebar content sidebar"===e?t+" 1fr var(--width_second_sidebar)":"content sidebar"===e?"1fr "+t:null)]});if(e&&e.includes("sidenav")){var s=function(){var e=o.sticky?n.height_header:0;return a.sticky&&(e+=n.height_topbar),e};return{display:"flex","#sidenav":{position:["fixed","relative"],zIndex:[101,0],top:0,bottom:0,width:"var(--width_sideNav)",right:"content sidenav"===e&&0,left:"sidenav content"===e&&0,willChange:"transform",transform:"translateX(0)",transition:i.isHeader||0!==n.height_header?i.cssTransition:null,"&.hide":{transform:["translateX("+("sidenav content"===e?"calc(-1 * var(--width_sideNav))":"var(--width_sideNav)")+")","none"]},"> .container":{position:"sticky",top:[0,s()],height:"calc(100vh - "+s()+"px)",overflowY:"auto"}},"#content":{maxWidth:"var(--maxWidth_content)",margin:"0 auto"},"#toggle-sidenav":{right:"sidenav content"===e&&30,left:"content sidenav"===e&&30}}}return{display:"block",maxWidth:"var(--maxWidth_content)",margin:"0 auto"}}(g),k=g.includes("sidenav")?p.breakpoint:d.breakpoint;return o.jsx("div",Object.assign({id:M(["site-inner",t]),breakpoints:w(k,h),css:v({position:"relative",visibility:l?"hidden":void 0},x,a)},i),y?o.jsx(L,null):o.jsx(H,{errorKey:"content"},r))};je.displayName="Content";var Me=["id","background","css","children"],Ce=function(e){var t=e.id,n=e.background,r=e.css,a=e.children,i=f(e,Me);return o.jsx("main",Object.assign({id:M(["content",t]),role:"main",css:v({background:n,position:"relative",flex:1},r)},i),o.jsx(H,{errorKey:"main"},a))};Ce.displayName="Main";var Oe=["isHeader"],_e=["id","background","toggleButton","menu","pathname","header","footer","className","_css","css","children"],Se=function(e){var t=e.isHeader,n=f(e,Oe);return o.jsx(t?"header":"div",Object.assign({},n))},Ae=function(e){var t=e.id,n=e.background,r=void 0===n?"var(--color-bg_sideNav)":n,a=e.toggleButton,s=e.menu,l=e.pathname,c=e.header,u=e.footer,d=e.className,p=e._css,h=e.css,b=e.children,g=f(e,_e),y=k(),x=y[0],N=y[1],E=m(),j=E.sideNav,C=a||j.toggleButton,O={id:"toggle-sidenav",title:"Toggle side navigation","aria-label":"Toggle side navigation",onClick:N,breakpoints:w(j.breakpoint,E.breakpoints)};return o.jsx(H,{errorKey:"sideNav"},j.closeOnBlur?o.jsx(ke,{show:x,toggle:N}):null,o.jsx(Se,Object.assign({isHeader:j.isHeader,id:M(["sidenav",t]),className:M([x?"":"hide",d]),css:v({background:r},p)},g),o.jsx("div",{className:"container",css:h},c||null,b||null,s?o.jsx(ce,{menu:s,menuType:"sideNav",pathname:l}):null,u||null)),"function"==typeof C?C(x,O):j.showToggleOnMobile?o.jsx(i.Button,Object.assign({},O,{css:{position:"fixed",display:["inline-block","none"],bottom:30,zIndex:100}}),"default"===C?x?"close":"open":C):null)};Ae.displayName="SideNav";var Te=["background","className","css","children"],Be=function(e){var t=e.background,n=e.className,r=e.css,a=e.children,i=f(e,Te);return o.jsx("div",Object.assign({className:M(["sidebar",n]),role:"complementary",css:v({background:t},r)},i),o.jsx(H,{errorKey:"sidebar"},a))};Be.displayName="Sidebar";var We=["id","maxWidth","background","_css","css","children"],Ie=function(e){var t=e.id,n=e.maxWidth,r=void 0===n?"var(--maxWidth_footer)":n,a=e.background,i=void 0===a?"var(--color-bg_footer)":a,s=e._css,l=e.css,c=e.children,u=f(e,We);return o.jsx("footer",Object.assign({id:M(["footer",t]),role:"contentinfo",css:v({background:i},s)},u),o.jsx("div",{className:"container",css:v({display:"flex",maxWidth:r,margin:"0 auto"},l)},o.jsx(H,{errorKey:"footer"},c)))};Ie.displayName="Footer";var Pe=["maxWidth","background","color","container","id","className","_css","css","children"],Fe=n.forwardRef((function(e,t){var n=e.maxWidth,r=void 0===n?"var(--maxWidth_section)":n,a=e.background,i=e.color,s=e.container,l=void 0===s||s,c=e.id,u=e.className,d=e._css,m=e.css,p=e.children,h=f(e,Pe),b=l?d:v({},d,m);return o.jsx("section",{ref:t,id:c,className:u,css:v({background:a,color:i,width:"100%"},b)},o.jsx(H,{errorKey:"section"},l?o.jsx("div",Object.assign({className:"container",css:v({maxWidth:r,margin:"0 auto"},m)},h),p):p))}));Fe.displayName="Section";var Le=function(e){var t=e.sideNav,r=e.sidebar,a=e.sidebarTwo,o=e.menu,i=e.children;switch(e.layout){case"content sidebar":return n.createElement(je,null,n.createElement(Ce,null,i),n.createElement(Be,null,r));case"sidebar content":return n.createElement(je,null,n.createElement(Be,null,r),n.createElement(Ce,null,i));case"sidebar content sidebar":return n.createElement(je,null,n.createElement(Be,null,r),n.createElement(Ce,null,i),n.createElement(Be,null,a));case"content sidenav":return n.createElement(je,null,n.createElement(Ce,null,i),n.createElement(Ae,{menu:o,toggleButton:t[1],pathname:t[2]},t[0]));case"sidenav content":return n.createElement(je,null,n.createElement(Ae,{menu:o,toggleButton:t[1],pathname:t[2]},t[0]),n.createElement(Ce,null,i));default:return n.createElement(je,null,n.createElement(Ce,null,i))}};exports.useMeasure=t,exports.CollapsibleMenu=ce,exports.ColorButton=X,exports.Content=je,exports.ErrorBoundary=H,exports.Footer=Ie,exports.Header=V,exports.Layout=W,exports.Main=Ce,exports.MobileMenu=Ne,exports.Navbar=xe,exports.Section=Fe,exports.SideNav=Ae,exports.Sidebar=Be,exports.Template=function(e){var t=e.topbar,r=e.menuButton,a=e.colorButton,o=e.layoutType,i=e.navType,s=e.logo,l=e.menu,c=e.mobileMenu,u=void 0===c?"default":c,d=e.sideNav,m=e.sideNavToggle,v=e.sidebar,p=e.sidebarTwo,f=e.footer,h=e.pathname,b=e.children;return n.createElement(W,{options:e.options},t&&n.createElement(R,null,t),n.createElement(V,null,n.createElement(xe,{type:i,logo:s,menu:l,menuButton:r,colorButton:a,pathname:h}),"default"===u?n.createElement(Ne,{menu:l}):n.isValidElement(u)?n.createElement(Ne,null,u):null),n.createElement(Le,{layout:o,sideNav:[d,m,h],sidebar:v,sidebarTwo:p,menu:l},b),f?n.createElement(Ie,null,f):null)},exports.Topbar=R,exports.generateId=function(e){void 0===e&&(e=5);for(var t="",n="abcdefghijklmnopqrstuv1234567890",r=n.length,a=0;a<e;a++)t+=n.charAt(Math.floor(Math.random()*r));return t},exports.mergeSelectors=M,exports.useMakerUI=function(){return{options:m()}},exports.useMenu=x,exports.useScrollPosition=K,exports.useSideNav=k;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("react-use-measure")),n=require("react"),r=e(require("deepmerge")),a=require("@emotion/react"),o=require("@maker-ui/css"),i=require("@maker-ui/primitives"),s={fonts:{body:"sans-serif",heading:"sans-serif",monospace:"monospace"},breakpoints:["768px","960px","1440px"],colors:{light:{link:"red",link_hover:"green",text:"#333",background:"#ffffff",primary:"#1858dc",secondary:"#355cac",accent:"#1858dc",muted:"#f6f6f6",border:"#e6e6e6",bg_topbar:"#355cac",bg_header:"#ffffff",bg_mobileMenu:"black",bg_sideNav:"#eee",bg_footer:"#d3d3d3",bg_toolbar:"#fbfbfb"}},persistentColorMode:!0,useColorDefaults:!0,useMeasurementDefaults:!0,variables:{},topbar:{maxWidth:1260,hideOnMobile:!1,breakpoint:0},header:{navType:"basic",mobileNavType:"basic",maxWidth:1460,sticky:!1,stickyOnMobile:!1,stickyUpScroll:!1,showColorButton:!0,hideColorButtonOnMobile:!1,hideWidgetsOnMobile:!0,menuOverflow:"wrap",dropdown:{caret:"default",transition:"fade"},breakpoint:0},mobileMenu:{width:"60vw",transition:"slide-left",cssTransition:"all ease 0.3s",visibleOnDesktop:!1,showCloseButton:!0,closeOnBlur:!0,closeOnRouteChange:!1},sideNav:{width:[250,300],isHeader:!1,isPrimaryMobileNav:!1,showToggleOnMobile:!0,toggleButton:"default",closeOnBlur:!0,closeOnRouteChange:!0,cssTransition:"transform ease 0.3s",breakpoint:0},content:{maxWidth:1020,maxWidthSection:1020,sidebarGap:30,breakpoint:0},sidebar:{width:300,secondWidth:200},footer:{maxWidth:1020},a11y:{skiplinks:!0},errors:{showStackTrace:!1}},l=n.createContext({}),c=n.createContext((function(){}));function u(e,t){return r(e,t,{arrayMerge:function(e,t,n){return t}})}var d=function(e){var t=e.options,r=e.children,a=n.useState(u(function(e){var t=s;return e||(t.colors={}),t}(!1!==(null==t?void 0:t.useColorDefaults)),t)),o=a[0],i=a[1];return n.useEffect((function(){i((function(e){return u(e,t)}))}),[t]),n.createElement(l.Provider,{value:o},n.createElement(c.Provider,{value:i},r))};function m(){var e=n.useContext(l);if(void 0===e)throw new Error("useOptions must be used within a Maker UI Layout component");return e}function v(){return(v=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function p(e,t){return(p=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function f(e,t){if(null==e)return{};var n,r,a={},o=Object.keys(e);for(r=0;r<o.length;r++)t.indexOf(n=o[r])>=0||(a[n]=e[n]);return a}function h(e,t){switch(t.type){case"MENU":return v({},e,{menuActive:!e.menuActive});case"SIDENAV":return v({},e,{sideNavActive:!e.sideNavActive});case"PANEL-LEFT":return v({},e,{leftPanelActive:!e.leftPanelActive});case"PANEL-RIGHT":return v({},e,{rightPanelActive:!e.rightPanelActive});default:throw new Error("Unhandled action type.")}}var b=n.createContext({}),g=n.createContext((function(){})),y=function(e){var t=e.children,r=n.useReducer(h,{menuActive:!1,sideNavActive:!1,leftPanelActive:!0,rightPanelActive:!0,toolbarActive:!0});return n.createElement(b.Provider,{value:r[0]},n.createElement(g.Provider,{value:r[1]},t))};function x(){var e=n.useContext(b).menuActive,t=n.useContext(g);if(void 0===typeof e)throw new Error("useMenu must be used within an Maker UI layout");return[e,function(){t({type:"MENU"})}]}function k(){var e=n.useContext(b).sideNavActive,t=n.useContext(g);if(void 0===typeof e)throw new Error("useSideNav must be used within an Maker UI layout");return[e,function(){t({type:"SIDENAV"})}]}var w=function(e,t){return"string"==typeof e?[e]:e<t.length?[t[e]]:[e]},N=function(e){return isNaN(e)?e:e+"px"},E=["fade","fade-up","fade-down"],j=function(e,t,n){var r=t.includes("fade")?e?1:0:1,a=e?"visible":"hidden",o=t.includes("right")?{right:0,width:n,transform:e?null:"translateX(100%)"}:{left:0,width:n,transform:e?null:"translateX(-100%)"},i=E.includes(t)?v({width:"100%",left:0},"fade"!==t?{transform:e?null:"translateY("+("fade-up"===t?"":"-")+"20px)"}:null):o;return v({opacity:r,visibility:a},i)};function M(e){return e?e.join(" ").replace(/ +(?= )/g,"").trim():void 0}var C={"*":{boxSizing:"border-box"},body:{margin:0,fontFamily:"var(--font-body)",color:"var(--color-text)",backgroundColor:"var(--color-background)"},"h1, h2, h3, h4, h5, h6":{fontFamily:"var(--font-heading)"},"code, pre":{fontFamily:"var(--font-monospace)"},"b, strong":{fontWeight:"bold"},a:{color:"var(--color-link)","&:hover":{color:"var(--color-link_hover)"}}},O=["content sidebar","content sidenav","content","sidebar content","sidebar content sidebar","sidenav content","page-transition"],_=n.createContext({state:{},setState:function(){}}),S=function(e){var t=e.styles,a=void 0===t?{}:t,i=e.children,l=m(),c=n.useState({layout_nav:l.header.navType,layout_navMobile:l.header.mobileNavType,layout_content:"content",height_header:0,height_topbar:0,height_toolbar:0,colorTheme:Object.keys(l.colors)[0]||"light"}),u=c[0],d=c[1];n.useEffect((function(){d((function(e){return v({},e,{layout_nav:l.header.navType,layout_navMobile:l.header.mobileNavType})}))}),[l]),n.useEffect((function(){var e="object"==typeof l.persistentColorMode&&null!==l.persistentColorMode;if(e||l.persistentColorMode){var t=e?l.persistentColorMode.key:"color-theme",n=function(){var e=Object.keys(null==l?void 0:l.colors)[0];localStorage.setItem(t,JSON.stringify({theme:e})),document.body.dataset.theme=e,d((function(t){return v({},t,{colorTheme:e})}))};if(localStorage.getItem(t)){var r=JSON.parse(localStorage.getItem(t)).theme;(l.colors?Object.keys(l.colors):[]).includes(r)?(document.body.dataset.theme=r,d((function(e){return v({},e,{colorTheme:r})}))):n()}else n()}}),[]);var p=r(function(e){var t=Object.keys(e),n={};return t.forEach((function(t){for(var r,a="body[data-theme='"+t+"']",o=((r={})[a]={},r),i=0,s=Object.entries(e[t]);i<s.length;i++){var l=s[i];o[a]["--color-"+l[0]]=l[1]}n=v({},n,o)})),n}(l.colors),function(e){for(var t=r(s,e,{arrayMerge:function(e,t,n){return t}}),n=t.breakpoints,a=t.fonts,o=t.topbar,i=t.header,l=t.mobileMenu,c=t.variables,u=t.content,d=t.sidebar,m=t.sideNav,v=t.footer,p=n.map((function(e){return"@media(min-width: "+N(e)+")"})),f={},h={},b=0,g=Object.entries(c);b<g.length;b++){var y=g[b];h["--"+y[0]]=y[1]}function x(e){for(var t=function(){var e=a[n],t=e[0],o=e[1];if(o)if(Array.isArray(o)){var i={};i[t]=N(o[0]),o.forEach((function(e,n){var r;0!==n&&(i[p[n]]=((r={})[t]=N(e),r))})),f=r(f,i)}else f[t]=N(o)},n=0,a=Object.entries(e);n<a.length;n++)t()}x({"--maxWidth_header":null==i?void 0:i.maxWidth,"--maxWidth_topbar":null==o?void 0:o.maxWidth,"--maxWidth_content":null==u?void 0:u.maxWidth,"--maxWidth_section":null==u?void 0:u.maxWidthSection,"--maxWidth_footer":null==v?void 0:v.maxWidth,"--width_mobileMenu":null==l?void 0:l.width,"--width_sidebar":null==d?void 0:d.width,"--width_second_sidebar":null==d?void 0:d.secondWidth,"--width_sideNav":null==m?void 0:m.width,"--gap_content":null==u?void 0:u.sidebarGap}),x(h);for(var k=0,w=Object.entries(a);k<w.length;k++){var E=w[k];f["--font-"+E[0]]=E[1]}return f["--breakpoints"]=n.join(","),{html:f}}(l));return n.createElement(_.Provider,{value:{state:u,setState:d}},n.createElement(o.Global,{styles:p}),n.createElement(o.Global,{styles:C}),n.createElement(o.Global,{styles:a}),i)};function A(e){var t=n.useContext(_),r=t.state,a=t.setState;if(void 0===r)throw new Error("useLayout must be used within a Maker UI Layout component");function o(t){a((function(n){var r;return v({},n,((r={})["layout_"+e]=t,r))}))}return"nav"===e?[r.layout_nav,o]:"mobileNav"===e?[r.layout_navMobile,o]:[r.layout_content,o]}function T(){var e=n.useContext(_),t=e.state,r=e.setState;if(void 0===t)throw new Error("useMeasurement must be used within an Maker UI Layout component");return{measurements:t,setMeasurement:function(e,t){r((function(n){var r;return v({},n,((r={})["height_"+e]=t,r))}))}}}var B=function(e){var t=m().a11y,n=A("content"),r=[];return r=e.links?e.links:[{id:"#content",label:"Skip to content"},{id:"#footer",label:"Skip to footer"}],n[0].includes("sidenav")&&r.splice(1,0,{id:"#sidenav",label:"Skip to side navigation"}),t.skiplinks?o.jsx("ul",{className:"skiplinks",css:{listStyle:"none",position:"relative",zIndex:1e3,padding:0,margin:0,a:{background:"var(--color-bg_header)",display:"block",position:"absolute",fontFamily:"var(--font-body)",left:-9999,padding:"1em","&:focus":{left:0}}}},r.map((function(e){var t=e.id;return o.jsx("li",{key:t},o.jsx("a",{href:t},e.label))}))):null};B.displayName="Skiplinks";var W=function(e){var t=e.options,o=e.styles,i=e.theme,s=void 0===i?{}:i,l=e.skiplinks,c=e.children;return n.createElement(a.ThemeProvider,{theme:t.breakpoints?r(s,{breakpoints:t.breakpoints}):s},n.createElement(d,{options:t},n.createElement(S,{styles:o},n.createElement(y,null,n.createElement(B,{links:l}),c))))};W.displayName="MakerUI_Layout";var I=function(e){return n.createElement(i.SVG,Object.assign({viewBox:"0 0 512 512"},e),n.createElement("path",{d:"M256 0C114.497 0 0 114.507 0 256c0 141.503 114.507 256 256 256 141.503 0 256-114.507 256-256C512 114.497 397.493 0 256 0zm0 472c-119.393 0-216-96.615-216-216 0-119.393 96.615-216 216-216 119.393 0 216 96.615 216 216 0 119.393-96.615 216-216 216z"}),n.createElement("path",{d:"M256 128.877c-11.046 0-20 8.954-20 20V277.67c0 11.046 8.954 20 20 20s20-8.954 20-20V148.877c0-11.046-8.954-20-20-20z"}),n.createElement("circle",{cx:"256",cy:"349.16",r:"27"}))},P=function(e){var t=e.showStackTrace,r=e.errorInfo;return n.createElement(i.Div,{className:"error-boundary"},n.createElement(I,{css:{height:30}}),n.createElement("div",null,"There was an issue loading this section of the app.",n.createElement(i.Span,{css:{marginLeft:"5px",cursor:"pointer",color:"var(--color-primary)"},onClick:function(){var e;return null===(e=window)||void 0===e?void 0:e.location.reload()}},"Try reloading the page.")),t?n.createElement(i.Div,{css:{details:{paddingLeft:"20px",whiteSpace:"pre"},summary:{cursor:"pointer"}}},n.createElement("details",{className:"error-details"},n.createElement("summary",null,"Click for error details"),r?r.componentStack.toString():null)):null)},F=["Main","SideNav","Sidebar","PageTransition"],L=function(){return n.createElement(i.Div,{css:{margin:"150px auto",maxWidth:600,fontSize:"20px",lineHeight:1.5,"li, span":{padding:"0 8px",fontFamily:"monospace",backgroundColor:"var(--color-muted)",fontSize:"18px",borderRadius:3,border:"1px solid gainsboro"}}},n.createElement(i.Flex,{inline:!0,align:"center",justify:"center",css:{width:"100%",padding:"20px",mb:"30px",background:"var(--color-muted)",strong:{marginRight:"20px"}}},n.createElement(I,{css:{height:35,marginRight:"10px"}}),n.createElement("strong",null,"Error")," Invalid layout configuration."),n.createElement(i.Div,null,n.createElement("p",null,"The ",n.createElement("span",null,"Content")," component only accepts the following direct children:"),n.createElement(i.UList,{css:{columns:2,margin:"50px 0 35px",li:{marginBottom:"10px",width:"min-content"}}},F.map((function(e,t){return n.createElement("li",{key:t},e)}))),n.createElement("p",null,"If your custom child component has fixed positioning or is a Provider, you can still use it here by assigning the component a"," ",n.createElement("strong",null,"displayName")," of 'Fixed', 'Provider', or 'Context'."),n.createElement("p",null,n.createElement("a",{href:"https://maker-ui.com/docs/content",target:"_blank",rel:"noreferrer"},"See the docs")," ","for a complete list of layout configurations.")))},H=function(e){var t,r;function a(){var t;return(t=e.apply(this,arguments)||this).state={error:"",errorInfo:"",hasError:!1},t}r=e,(t=a).prototype=Object.create(r.prototype),t.prototype.constructor=t,p(t,r),a.getDerivedStateFromError=function(e){return{error:e,hasError:!0}};var o=a.prototype;return o.componentDidCatch=function(e,t){var n=this.props.logFunction||this.context.errors.logFunction||!1;n&&n(e,t,this.props.errorKey),this.setState({errorInfo:t})},o.render=function(){return this.state.hasError?this.props.errorMessage||this.context.errors.errorMessage[""+this.props.errorKey]?this.context.errors.errorMessage[""+this.props.errorKey]:n.createElement(P,{showStackTrace:this.context.errors.errorMessage.showStackTrace,errorInfo:this.state.errorInfo}):this.props.children},a}(n.Component);H.contextType=l;var z=["id","background","maxWidth","sticky","stickyOnMobile","scrollOverflow","className","_css","css","children"],R=function(e){var r=m(),a=r.topbar,i=r.breakpoints,s=t(),l=s[0],c=s[1].height,u=T().setMeasurement;n.useEffect((function(){0!==c&&u("topbar",c)}),[c]);var d=e.id,p=e.background,h=void 0===p?"var(--color-bg_topbar)":p,b=e.maxWidth,g=void 0===b?"var(--maxWidth_topbar)":b,y=e.sticky,x=void 0===y?a.sticky:y,k=e.stickyOnMobile,N=void 0===k?a.stickyOnMobile:k,E=e.scrollOverflow,j=void 0!==E&&E,C=e.className,O=e._css,_=e.css,S=e.children,A=f(e,z),B=x?N?"sticky":["relative","sticky"]:!x&&N?["sticky","relative"]:void 0;return o.jsx("aside",{ref:l,id:M(["topbar",d]),className:C,breakpoints:w(a.breakpoint,i),css:v({background:h,top:0,zIndex:101,position:B,display:a.hideOnMobile?["none","block"]:["block"]},O)},o.jsx("div",Object.assign({className:"container",css:v({margin:"0 auto",overflowX:j?"scroll":void 0,whiteSpace:j?"nowrap":void 0,maxWidth:g},_)},A),o.jsx(H,{errorKey:"topbar"},S)))};R.displayName="Topbar";var D="undefined"!=typeof window;function U(){if(!D)return 0;var e=document.body.getBoundingClientRect();return Math.abs(e.top)}function K(e,t,r){void 0===r&&(r=!0);var a=n.useRef(U());n.useEffect((function(){if(r&&D){var n,o=function(){var t=U();e({prevPos:a.current,currPos:t}),a.current=t,n=void 0},i=function(){t?void 0===n&&(n=setTimeout(o,t)):o()};return window.addEventListener("scroll",i),function(){return window.removeEventListener("scroll",i)}}}),[e,t,r])}var G=["absolute","background","sticky","stickyOnMobile","stickyUpScroll","className","css","children"],V=function(e){var r=n.useState(""),a=r[0],i=r[1],s=n.useState(!0),l=s[0],c=s[1],u=n.useState(!0),d=u[0],p=u[1],h=T(),b=h.measurements,g=h.setMeasurement,y=m(),x=y.header,k=y.topbar,N=y.breakpoints,E=!!x.scrollClass,j=t(),C=j[0],O=j[1].height;n.useEffect((function(){0!==O&&g("header",O)}),[O]),n.useEffect((function(){c(!1)}),[]);var _=e.absolute,S=void 0===_?x.absolute:_,A=e.background,B=void 0===A?"var(--color-bg_header)":A,W=e.sticky,I=void 0===W?x.sticky:W,P=e.stickyOnMobile,F=void 0===P?x.stickyOnMobile:P,L=e.stickyUpScroll,z=void 0===L?x.stickyUpScroll:L,R=e.className,D=e.css,U=e.children,V=f(e,G);K((function(e){var t=e.currPos,n=t>e.prevPos,r=t>500;r||d||p(!0),r&&n&&d&&p(!1),!r||n||d||p(!0)}),350,z),K((function(e){if(E){var t=x.scrollClass,n=e.currPos>t.scrollTop?t.className:"";n!==a&&i(n)}}),0,E);var q=function(){return k.sticky&&!k.stickyOnMobile?[0,b.height_topbar]:k.sticky&&k.stickyOnMobile?b.height_topbar:!k.sticky&&k.stickyOnMobile?[b.height_topbar,0]:0},Y=S?"fixed":"sticky",X=S?"absolute":"relative",J=[a,z&&!d?"scroll-active":""].join(" ");return o.jsx("header",Object.assign({ref:C,className:M([J,R]),role:"banner",breakpoints:w(x.breakpoint,N),css:v({background:B,zIndex:100,width:S?"100%":void 0,visibility:l?"hidden":void 0},z?{position:Y,top:q(),transition:"transform .3s ease-in","&.scroll-active":{transform:"translateY(-100%)"}}:I?{top:q(),position:F?[Y]:[X,Y]}:!I&&F?{top:q(),position:[Y,X]}:{position:X},D)},V),o.jsx(H,{errorKey:"header"},U))};V.displayName="Header";var q=function(e){var t=e.children,r=m().linkFunction,a={id:"site-logo","aria-label":"Home page"};return r?r("/",t,a):n.createElement(i.Link,Object.assign({href:"/"},a,{css:{display:"inline-flex"}}),t)};q.displayName="Logo";var Y=["isHeaderButton","customButton","breakpoints","className","css"],X=function(e){var t,r,a,o=e.isHeaderButton,s=e.customButton,l=e.breakpoints,c=e.className,u=e.css,d=f(e,Y),p=m(),h=p.header,b=p.breakpoints,g=(t=m(),r=n.useContext(_),a=r.setState,{colorTheme:r.state.colorTheme,setColorTheme:function(e){t.persistentColorMode&&localStorage.setItem("color-theme",JSON.stringify({theme:e})),document.body.dataset.theme=e,a((function(t){return v({},t,{colorTheme:e})}))},colors:t.colors?Object.keys(t.colors):["light"]}),y=g.colorTheme,x=g.setColorTheme,k=g.colors,N=v({title:"Color Theme",className:M(["color-button",c]),"aria-label":"Toggle Color Mode",onClick:function(){var e=k.indexOf(y);x(k[(e+1)%k.length])},breakpoints:o?w(h.breakpoint,b):l},d),E=s||h.colorButton;return 1===k.length?null:o&&h.showColorButton||!o?"function"==typeof E?E(y,N):n.createElement(i.Button,Object.assign({},N,{css:v({display:o&&h.hideColorButtonOnMobile?["none","block"]:["block"]},u)}),E||y):null};X.displayName="ColorButton";var J=function(e){var t=e.show,r=e.set;return n.createElement(i.Button,{title:"Expand Section",className:"submenu-toggle","aria-expanded":t?"true":"false","aria-label":"Expand Section",onClick:function(){return r(!t)},css:{border:"none",background:"transparent"}},n.createElement(i.SVG,{viewBox:"0 0 16 16",width:"12",height:"12",css:{transition:"transform ease .2s",transformOrigin:"50% 55%",transform:t?"rotate(180deg)":void 0}},n.createElement("path",{stroke:"currentcolor",strokeWidth:"2",fill:"none",d:"M14 6 L8 12 L2 6"})))};J.displayName="ExpandButton";var Q={opacity:1,visibility:"visible"},Z={transition:"all ease .3s"},$=function(e){switch(e){case"scale":return{transform:"scale(1, 1)",li:{opacity:1,transition:"opacity ease-in-out .2s .2s"}};case"fade-down":case"fade-up":return v({},Q,{transform:"translateY(0)"});case"fade":default:return Q}},ee={display:"inline-block",background:"var(--color-bg_header)",width:"max-content",opacity:0,visibility:"hidden",margin:0,padding:0,zIndex:1,listStyle:"none",a:{width:"100%"},li:{display:"block"}},te=function(e){switch(e){case"scale":return v({},Q,{transform:"scale(1, 0)",transformOrigin:"0 0",transition:"transform ease-in-out .25s",li:{opacity:0,transition:"opacity .03s ease-in-out"}});case"fade-up":return v({},Z,{transform:"translateY(10px)"});case"fade-down":return v({},Z,{transform:"translateY(-10px)"});case"fade":return v({},Z,{transform:"translateY(0)"});default:return{}}},ne={position:"absolute",top:"99%",left:0},re={position:"fixed",height:"100%",left:"100%",top:0},ae=function(e,t,n){return e?r.all([ee,0===n?ne:re,te(t)],{arrayMerge:function(e,t,n){return t}}):{}},oe={content:'""',display:"inline-block",width:0,height:0,marginLeft:".4em",verticalAlign:".25em",borderTop:".25em solid",borderRight:".25em solid transparent",borderLeft:".25em solid transparent"},ie=n.memo((function(e){var t=e.data,r=t.label,a=t.path,s=t.newTab,l=t.submenu,c=t.openNested,u=void 0!==c&&c,d=t.classes,p=void 0===d?"":d,f=t.icon,h=e.caret,b=void 0!==h&&h,g=e.menuControls,y=e.pathname,x=e.isHeader,k=void 0!==x&&x,w=e.linkFunction,N=e.depth,E=void 0===N?0:N,j=m().header,C=n.useState(u),O=C[0],_=C[1],S="submenu depth-"+E,A=v({className:y===a?"current":void 0,target:s&&"_blank",rel:s&&"noopener noreferrer","aria-label":f&&r,"aria-haspopup":l&&"true","aria-current":y===a&&"page"},g);return o.jsx("li",{className:M(["menu-item",p]),css:k?{position:"relative",display:"inline-flex","&:focus-within > .submenu, &:hover > .submenu":v({},$(j.dropdown.transition)),"> a .menu-text:after":l&&"default"===b&&oe}:void 0},o.jsx(se,{condition:!(k||!l),wrapper:function(e){return o.jsx("div",{css:{display:"flex"}},e)}},o.jsx(n.Fragment,null,w?w(a,r,A,f):o.jsx(i.Link,Object.assign({href:a},A),f?o.jsx("span",{className:"menu-icon"},f):void 0,o.jsx("span",{className:"menu-text"},r),l&&b&&n.isValidElement(b)?b:null),!k&&l?o.jsx(J,{set:_,show:O}):null)),l&&o.jsx(n.Fragment,null,k||!k&&O?o.jsx("ul",{className:S,role:"menu","aria-label":"submenu",css:v({},ae(k,j.dropdown.transition,E))},l.map((function(e,t){return o.jsx(ie,{key:t,data:e,caret:b,menuControls:g,pathname:y,isHeader:k,depth:E+1})}))):null))}));ie.displayName="MenuItem";var se=function(e){var t=e.children;return e.condition?(0,e.wrapper)(t):t},le=["menu","menuType","pathname","className","css"],ce=n.forwardRef((function(e,t){var n=e.menu,r=void 0===n?[]:n,a=e.menuType,i=e.pathname,s=e.className,l=e.css,c=f(e,le),u=m(),d=u.mobileMenu,p=u.sideNav,h=u.linkFunction,b=x()[1],g=k()[1],y=function(){if("mobile"===a&&d.closeOnRouteChange)return{onClick:function(){return b()}};if("undefined"!=typeof window&&"sideNav"===a&&p.closeOnRouteChange){var e=document.getElementById("sidenav");if(!window||!e)return;return{onClick:"fixed"===window.getComputedStyle(e,"").position?function(){return g()}:void 0}}};return o.jsx("ul",Object.assign({ref:t,className:M(["collapse-menu",s]),role:"navigation",css:v({},l)},c),r.map((function(e,t){return o.jsx(ie,{key:t,data:e,menuControls:y(),pathname:i,linkFunction:h})})))}));ce.displayName="CollapsibleMenu";var ue=["customButton","visibleOnDesktop","isCloseButton","className","css"],de=function(e){var t=e.customButton,r=e.visibleOnDesktop,a=e.isCloseButton,o=e.className,s=e.css,l=f(e,ue),c=x(),u=c[0],d=c[1],p=k(),h=p[0],b=p[1],g=m(),y=g.header,N=g.sideNav,E=g.breakpoints,j=t||(null==y?void 0:y.menuButton),C=r?"block":["block","none"],O=null!=N&&N.isPrimaryMobileNav?{"aria-expanded":!!h,onClick:b}:{"aria-expanded":!!u,onClick:d},_=v({title:"Menu",className:M(["menu-button",o]),"aria-label":"Toggle Menu"},O,l);return"function"==typeof j?j(N.isPrimaryMobileNav?h:u,_):n.createElement(i.Button,Object.assign({},_,{breakpoints:w(null==y?void 0:y.breakpoint,E),css:v({display:C,margin:0,border:"none",background:"none",svg:{margin:"0 auto"}},s)}),j||n.createElement(i.SVG,{viewBox:"0 0 24 24",css:{display:"block",height:a?35:27}},n.createElement("path",a?{d:"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"}:{d:"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"})))};de.displayName="MenuButton";var me=function(e){var t=e.menuItems,n=void 0===t?[]:t,r=e.pathname,a=m(),i=a.header,s=a.linkFunction;return o.jsx("nav",{className:"nav-primary",role:"navigation",breakpoints:w(i.breakpoint,a.breakpoints),css:{display:["none","flex"]}},o.jsx("ul",{className:"menu-primary"},n.map((function(e,t){var n;return o.jsx(ie,{key:t,data:e,caret:null===(n=i.dropdown)||void 0===n?void 0:n.caret,pathname:r,linkFunction:s,isHeader:!0})}))))};me.displayName="NavMenu";var ve=function(e){var t=e.content,n=m(),r=n.header;return t?o.jsx("div",{className:"widget-area",breakpoints:r?w(r.breakpoint,n.breakpoints):void 0,css:{display:null!=r&&r.hideWidgetsOnMobile?["none","flex"]:"flex"}},t):null};ve.displayName="WidgetArea";var pe={basic:{areas:'"logo menu nav"',columns:"auto 1fr auto",navArea:"flex-start",menuArea:"flex-end"},"basic-left":{areas:'"logo menu nav"',columns:"auto 1fr auto",navArea:"flex-start",menuArea:"flex-start"},"basic-center":{areas:'"logo menu nav"',columns:"auto 1fr auto",navArea:"flex-start",menuArea:"center"},center:{areas:'"logo logo" "menu nav"',columns:"1fr",navArea:"flex-start",menuArea:"center"},split:{areas:'"menu-split logo menu nav"',columns:"1fr auto 1fr",navArea:"flex-start",menuArea:!1},reverse:{areas:'"menu logo nav"',columns:"1fr auto 1fr",navArea:"flex-end",menuArea:!1},minimal:{areas:'"logo nav"',columns:"auto 1fr",navArea:"flex-end",menuArea:!1},"minimal-left":{areas:'"button logo nav"',columns:"auto auto 1fr",navArea:"flex-end",menuArea:!1},"minimal-center":{areas:'"button logo nav"',columns:"1fr auto 1fr",navArea:"flex-end",menuArea:!1}},fe={basic:{areas:'"logo nav"',columns:"auto 1fr",navArea:"flex-end"},"basic-menu-left":{areas:'"button logo nav"',columns:"auto auto 1fr",navArea:"flex-end"},"logo-center":{areas:'"button logo nav"',columns:"1fr auto 1fr",navArea:"flex-end"},"logo-center-alt":{areas:'"nav logo button"',columns:"1fr auto 1fr",navArea:"flex-start"}};function he(e,t){return{gridTemplateAreas:[fe[t].areas,pe[e].areas],gridTemplateColumns:[fe[t].columns,pe[e].columns],gridTemplateRows:["1fr","center"!==e?"1fr":"1fr 1fr"],gap:0,".nav-area":v({},be(e),{justifyContent:[fe[t].navArea,pe[e].navArea]}),".menu-area":{justifyContent:pe[e].menuArea?pe[e].menuArea:void 0},".menu-area.split":{justifyContent:"flex-end"},"&.layout-center .logo-area":{justifyContent:"center"},"&.layout-minimal, &.layout-minimal-left, &.layout-minimal-center":{".menu-area":{display:"none"}},"&.layout-minimal-center .button-area":{justifyContent:"flex-start"},"&.m-layout-logo-center-alt .button-area":{justifyContent:["flex-end","flex-start"]}}}function be(e){return["center","split"].includes(e)?{position:["relative","absolute"],top:0,right:0,height:"100%"}:void 0}var ge=["minimal-left","minimal-center"],ye=["basic-menu-left","logo-center","logo-center-alt"],xe=function(e){var t=m(),r=t.header,a=t.mobileMenu,o=t.breakpoints,s=A("nav"),l=s[0],c=s[1],u=A("mobileNav"),d=u[0],p=u[1],f=w(r.breakpoint,o),h=e.type,b=e.mobileType,g=e.logo,y=void 0===g?"Logo":g,x=e.menu,k=e.logoArea,N=e.navArea,E=e.menuArea,j=e.menuButton,C=e.colorButton,O=e.maxWidth,_=void 0===O?"var(--maxWidth_header)":O,S=e.className,T=e.id,B=e.css,W=x&&Math.ceil(x.length/2);n.useEffect((function(){void 0!==h&&h!==l&&c(h),void 0!==b&&b!==d&&p(b)}),[h,b,l,d]);var I="scroll"===r.menuOverflow?{".menu-area":{overflowX:"scroll",whiteSpace:"nowrap"}}:void 0;return n.createElement(i.Grid,{id:T,className:M(["nav-grid layout-"+l,"m-layout-"+d,S]),breakpoints:f,css:v({maxWidth:_,margin:"0 auto",position:"relative"},he(l,d),I,B)},ge.includes(l)||ye.includes(d)?n.createElement(i.Flex,{align:"center",className:"button-area",breakpoints:f,css:{gridArea:"button",display:[ye.includes(d)?"flex":"none",ge.includes(l)?"flex":"none"]}},n.createElement(de,{breakpoints:f,customButton:j,visibleOnDesktop:!0})):null,"split"===l?n.createElement(i.Flex,{align:"center",className:"menu-area split",breakpoints:f,css:{gridArea:"menu-split",display:["none","flex"]}},E?null:n.createElement(me,{menuItems:null==x?void 0:x.slice(0,W)})):null,n.createElement(i.Flex,{align:"center",className:"logo-area",css:{gridArea:"logo"}},k||n.createElement(q,null,y)),n.createElement(i.Flex,{align:"center",className:"menu-area",breakpoints:f,css:{gridArea:"menu",display:["none","flex"]}},E||n.createElement(me,{menuItems:"split"===l?null==x?void 0:x.slice(W):x})),n.createElement(i.Flex,{align:"center",className:"nav-area",css:{gridArea:"nav"}},n.createElement(ve,{content:N}),n.createElement(de,{customButton:j,breakpoints:f,css:{display:[ye.includes(d)?"none":"block","minimal"===l||a.visibleOnDesktop?"block":"none"]}}),n.createElement(X,{isHeaderButton:!0,customButton:C})))};xe.displayName="Navbar";var ke=function(e){return o.jsx("div",{className:"menu-overlay"+(e.show?" active":""),role:"button",onClick:e.toggle,css:{position:"fixed",top:0,left:0,right:0,bottom:0,background:"rgba(0, 0, 0, 0.15)",zIndex:100,willChange:"opacity",transition:"all ease .4s",visibility:"hidden",opacity:0,"&.active":{visibility:"visible",opacity:1}}})};ke.displayName="Overlay";var we=["id","background","center","closeButton","closeButtonPosition","width","transition","menu","pathname","header","footer","className","css","children"],Ne=n.forwardRef((function(e,t){var r=x(),a=r[0],i=r[1],s=m().mobileMenu,l=e.id,c=e.background,u=void 0===c?"var(--color-bg_mobileMenu)":c,d=e.center,p=e.closeButton,h=void 0===p?s.closeButton:p,b=e.closeButtonPosition,g=void 0===b?"top-right":b,y=e.width,k=void 0===y?"var(--width_mobileMenu)":y,w=e.transition,N=void 0===w?s.transition:w,C=e.menu,O=void 0===C?[]:C,_=e.pathname,S=e.header,A=e.footer,T=e.className,B=e.css,W=e.children,I=f(e,we),P=d?{display:"flex",alignItems:"center",justifyContent:"center",flexDirection:"column"}:void 0,F=g.includes("right")?{right:0}:{left:0},L=g.includes("top")?{top:0}:{bottom:0};return o.jsx(n.Fragment,null,s.closeOnBlur&&!E.includes(N)?o.jsx(ke,{show:a,toggle:i}):null,o.jsx("div",Object.assign({ref:t,id:M(["mobile-menu",l]),className:M([a?"active":"",T]),css:v({position:"fixed",background:u,top:0,bottom:0,zIndex:100,willChange:"transform, opacity",transition:s.cssTransition},j(a,N,k),P,B)},I),o.jsx(H,{errorKey:"mobileMenu"},s.showCloseButton||h?o.jsx(de,{customButton:h,isCloseButton:!0,css:v({position:"absolute"},L,F)}):null,S||null,W||o.jsx(ce,{menu:O,menuType:"mobile",pathname:_}),A||null)))}));Ne.displayName="MobileMenu";var Ee=["id","children","css"],je=function(e){var t=e.id,r=e.children,a=e.css,i=f(e,Ee),s=n.useState(!0),l=s[0],c=s[1],u=m(),d=u.content,p=u.sideNav,h=u.breakpoints,b=function(e,t){var r=A("content"),a=r[0],o=r[1],i=n.useState(!1),s=i[0],l=i[1];return n.useEffect((function(){if(t){var e=function(e,t){if("string"==typeof t)return"unknown";var r=n.Children.toArray(t);return r?r.map((function(e){return e.type.displayName?e.type.displayName.toLowerCase():"unknown"})).join(" ").replace("main","content").replace(/fixed|provider|context/g,"").replace(/ {2,}/g," ").trim():"unknown"}(0,t);O.find((function(t){return t===e}))?a!==e&&o(e):l(!0)}}),[a,o,"content",t]),{layout:a,showError:s}}(0,r),g=b.layout,y=b.showError;n.useEffect((function(){c(!1)}),[]);var x=function(e){var t,n=T().measurements,r=m(),a=r.topbar,o=r.header,i=r.sideNav;if(e&&e.includes("sidebar"))return v({display:"grid",gap:"var(--gap_content)",maxWidth:"var(--maxWidth_content)",margin:"0 auto",minHeight:"80vh"},"sidebar content"===e?{".sidebar":{gridRow:[2,"auto"]}}:"sidebar content sidebar"===e?{".sidebar:first-of-type":{gridRow:[2,"auto"]}}:null,{gridTemplateColumns:["1fr",(t="var(--width_sidebar)","sidebar content"===e?t+" 1fr":"sidebar content sidebar"===e?t+" 1fr var(--width_second_sidebar)":"content sidebar"===e?"1fr "+t:null)]});if(e&&e.includes("sidenav")){var s=function(){var e=o.sticky?n.height_header:0;return a.sticky&&(e+=n.height_topbar),e};return{display:"flex","#sidenav":{position:["fixed","relative"],zIndex:[101,0],top:0,bottom:0,width:"var(--width_sideNav)",right:"content sidenav"===e&&0,left:"sidenav content"===e&&0,willChange:"transform",transform:"translateX(0)",transition:i.isHeader||0!==n.height_header?i.cssTransition:null,"&.hide-sidenav":{transform:["translateX("+("sidenav content"===e?"calc(-1 * var(--width_sideNav))":"var(--width_sideNav)")+")","none"]},"> .container":{position:"sticky",top:[0,s()],height:"calc(100vh - "+s()+"px)",overflowY:"auto"}},"#content":{maxWidth:"var(--maxWidth_content)",margin:"0 auto"},"#toggle-sidenav":{right:"sidenav content"===e&&30,left:"content sidenav"===e&&30}}}return{display:"block",maxWidth:"var(--maxWidth_content)",margin:"0 auto"}}(g),k=g.includes("sidenav")?p.breakpoint:d.breakpoint;return o.jsx("div",Object.assign({id:M(["site-inner",t]),breakpoints:w(k,h),css:v({position:"relative",visibility:l?"hidden":void 0},x,a)},i),y?o.jsx(L,null):o.jsx(H,{errorKey:"content"},r))};je.displayName="Content";var Me=["id","background","css","children"],Ce=function(e){var t=e.id,n=e.background,r=e.css,a=e.children,i=f(e,Me);return o.jsx("main",Object.assign({id:M(["content",t]),role:"main",css:v({background:n,position:"relative",flex:1},r)},i),o.jsx(H,{errorKey:"main"},a))};Ce.displayName="Main";var Oe=["isHeader"],_e=["id","background","toggleButton","menu","pathname","header","footer","className","_css","css","children"],Se=function(e){var t=e.isHeader,n=f(e,Oe);return o.jsx(t?"header":"div",Object.assign({},n))},Ae=function(e){var t=e.id,n=e.background,r=void 0===n?"var(--color-bg_sideNav)":n,a=e.toggleButton,s=e.menu,l=e.pathname,c=e.header,u=e.footer,d=e.className,p=e._css,h=e.css,b=e.children,g=f(e,_e),y=k(),x=y[0],N=y[1],E=m(),j=E.sideNav,C=a||j.toggleButton,O={id:"toggle-sidenav",title:"Toggle side navigation","aria-label":"Toggle side navigation",onClick:N,breakpoints:w(j.breakpoint,E.breakpoints)};return o.jsx(H,{errorKey:"sideNav"},j.closeOnBlur?o.jsx(ke,{show:x,toggle:N}):null,o.jsx(Se,Object.assign({isHeader:j.isHeader,id:M(["sidenav",t]),className:M([x?"":"hide-sidenav",d]),css:v({background:r},p)},g),o.jsx("div",{className:"container",css:h},c||null,b||null,s?o.jsx(ce,{menu:s,menuType:"sideNav",pathname:l}):null,u||null)),"function"==typeof C?C(x,O):j.showToggleOnMobile?o.jsx(i.Button,Object.assign({},O,{css:{position:"fixed",display:["inline-block","none"],bottom:30,zIndex:100}}),"default"===C?x?"close":"open":C):null)};Ae.displayName="SideNav";var Te=["background","className","css","children"],Be=function(e){var t=e.background,n=e.className,r=e.css,a=e.children,i=f(e,Te);return o.jsx("div",Object.assign({className:M(["sidebar",n]),role:"complementary",css:v({background:t},r)},i),o.jsx(H,{errorKey:"sidebar"},a))};Be.displayName="Sidebar";var We=["id","maxWidth","background","_css","css","children"],Ie=function(e){var t=e.id,n=e.maxWidth,r=void 0===n?"var(--maxWidth_footer)":n,a=e.background,i=void 0===a?"var(--color-bg_footer)":a,s=e._css,l=e.css,c=e.children,u=f(e,We);return o.jsx("footer",Object.assign({id:M(["footer",t]),role:"contentinfo",css:v({background:i},s)},u),o.jsx("div",{className:"container",css:v({display:"flex",maxWidth:r,margin:"0 auto"},l)},o.jsx(H,{errorKey:"footer"},c)))};Ie.displayName="Footer";var Pe=["maxWidth","background","color","container","id","className","_css","css","children"],Fe=n.forwardRef((function(e,t){var n=e.maxWidth,r=void 0===n?"var(--maxWidth_section)":n,a=e.background,i=e.color,s=e.container,l=void 0===s||s,c=e.id,u=e.className,d=e._css,m=e.css,p=e.children,h=f(e,Pe),b=l?d:v({},d,m);return o.jsx("section",{ref:t,id:c,className:u,css:v({background:a,color:i,width:"100%"},b)},o.jsx(H,{errorKey:"section"},l?o.jsx("div",Object.assign({className:"container",css:v({maxWidth:r,margin:"0 auto"},m)},h),p):p))}));Fe.displayName="Section";var Le=function(e){var t=e.sideNav,r=e.sidebar,a=e.sidebarTwo,o=e.menu,i=e.children;switch(e.layout){case"content sidebar":return n.createElement(je,null,n.createElement(Ce,null,i),n.createElement(Be,null,r));case"sidebar content":return n.createElement(je,null,n.createElement(Be,null,r),n.createElement(Ce,null,i));case"sidebar content sidebar":return n.createElement(je,null,n.createElement(Be,null,r),n.createElement(Ce,null,i),n.createElement(Be,null,a));case"content sidenav":return n.createElement(je,null,n.createElement(Ce,null,i),n.createElement(Ae,{menu:o,toggleButton:t[1],pathname:t[2]},t[0]));case"sidenav content":return n.createElement(je,null,n.createElement(Ae,{menu:o,toggleButton:t[1],pathname:t[2]},t[0]),n.createElement(Ce,null,i));default:return n.createElement(je,null,n.createElement(Ce,null,i))}};exports.useMeasure=t,exports.CollapsibleMenu=ce,exports.ColorButton=X,exports.Content=je,exports.ErrorBoundary=H,exports.Footer=Ie,exports.Header=V,exports.Layout=W,exports.Main=Ce,exports.MobileMenu=Ne,exports.Navbar=xe,exports.Section=Fe,exports.SideNav=Ae,exports.Sidebar=Be,exports.Template=function(e){var t=e.topbar,r=e.menuButton,a=e.colorButton,o=e.layoutType,i=e.navType,s=e.logo,l=e.menu,c=e.mobileMenu,u=void 0===c?"default":c,d=e.sideNav,m=e.sideNavToggle,v=e.sidebar,p=e.sidebarTwo,f=e.footer,h=e.pathname,b=e.children;return n.createElement(W,{options:e.options},t&&n.createElement(R,null,t),n.createElement(V,null,n.createElement(xe,{type:i,logo:s,menu:l,menuButton:r,colorButton:a,pathname:h}),"default"===u?n.createElement(Ne,{menu:l}):n.isValidElement(u)?n.createElement(Ne,null,u):null),n.createElement(Le,{layout:o,sideNav:[d,m,h],sidebar:v,sidebarTwo:p,menu:l},b),f?n.createElement(Ie,null,f):null)},exports.Topbar=R,exports.generateId=function(e){void 0===e&&(e=5);for(var t="",n="abcdefghijklmnopqrstuv1234567890",r=n.length,a=0;a<e;a++)t+=n.charAt(Math.floor(Math.random()*r));return t},exports.mergeSelectors=M,exports.useMakerUI=function(){return{options:m()}},exports.useMenu=x,exports.useScrollPosition=K,exports.useSideNav=k;
 //# sourceMappingURL=layout.cjs.production.min.js.map

dist/types.d.ts

@@ -73,6 +73,2 @@ import * as React from 'react';
     /**
-     * SSG framework optimizations for Gatsby and NextJS.
-     */
-    framework?: 'gatsby' | 'next';
-    /**
      * An array of browser widths that is used as the default breakpoints for
@@ -79,0 +75,0 @@ * all nested Maker UI components and primitives.

package.json

 {
   "name": "@maker-ui/layout",
   "description": "The fastest way to build themeable, responsive layouts in React",
-  "version": "1.0.0-beta.11",
+  "version": "1.0.0-beta.12",
   "license": "MIT",
@@ -23,4 +23,4 @@ "author": "Mike Darche <[e-mail]>",
     "@emotion/react": "^11.1.4",
-    "@maker-ui/css": "1.0.0-beta.11",
-    "@maker-ui/primitives": "1.0.0-beta.11",
+    "@maker-ui/css": "1.0.0-beta.12",
+    "@maker-ui/primitives": "1.0.0-beta.12",
     "deepmerge": "^4.2.2",
@@ -27,0 +27,0 @@ "react-use-measure": "^2.0.4",

No alert changes

Improved metrics

Total package byte prevSize

691609

increased by0.3%

Lines of code

6502

increased by0.18%

Dependency changes

• + Added@maker-ui/css@1.0.0-beta.12(transitive)

• + Added@maker-ui/primitives@1.0.0-beta.12(transitive)

• - Removed@maker-ui/css@1.0.0-beta.11(transitive)

• - Removed@maker-ui/primitives@1.0.0-beta.11(transitive)

• Updated@maker-ui/css@1.0.0-beta.12

• Updated@maker-ui/primitives@1.0.0-beta.12