app-layout-frame 0.0.21 → 0.0.23

package/dist/index.modern.js

@@ -1,2 +1,2 @@
-import"@7shifts/sous-chef/dist/index.css";import e,{useState as a,useCallback as t,useRef as n,useLayoutEffect as r}from"react";import l from"classnames";import{Inline as i,Badge as o,Chip as c,IconAward as m,IconChevronRight as s,IconChevronLeft as u,Avatar as d,Tooltip as p,Dropdown as f,Card as _,Stack as g}from"@7shifts/sous-chef";import{Link as v}from"react-router-dom";var E,y,h={"layout-frame":"_2C1bf","layout-frame--no-height":"___2VV","layout-frame__banner":"_32ZI5","layout-frame__banner--expanded":"_2R4LD","layout-frame__middle-area":"_34YPL","layout-frame__middle-area--full-size":"_jG606","layout-frame__middle-area--no-footer-padding":"_2q-8S","layout-frame__side-bar":"_2dNiZ","layout-frame__side-bar--expanded":"_3kzKX","layout-frame__side-bar--with-banner":"_pHsH6","layout-frame__top-bar":"_299Kx","layout-frame__top-bar--hidden":"_3Gz0Y","layout-frame__content":"_Ri_78"},b=function(){return Boolean(window.navigator.maxTouchPoints)},N=function(a){var t,n=a.as,r=void 0===n?"li":n,o=a.isActive,c=a.children,m={className:l("_1ycHa",(t={},t._1D7jK=void 0!==o&&o,t))},s=e.createElement(i,{alignItems:"center",space:16,flex:["0 1 auto","0 0 142px"]},c);return e.createElement(r,m,s)},w=function(a){var t,n=a.isActive,r=a.icon,i=a.badge,m=a.children,s="string"==typeof i&&""!==i,u="number"==typeof i&&i>0;return e.createElement("li",{className:l("_amex_",(t={},t._WdXeV=void 0!==n&&n,t._1zt6h=!r,t))},r,e.createElement("div",{className:"_lLwWh"},m,u&&e.createElement(o,null,function(e){if("number"==typeof e){if(e>0&&e<=99)return String(e);if(e>99)return"99+"}else if("string"==typeof e)return"0"===e?null:parseInt(e)>99?"99+":e;return null}(i)),s&&e.createElement(c,null,i)))},x=function(a){var t,n=a.children;return e.createElement("span",{className:l("_1ne7X",(t={},t["_3jq-L"]="boolean"==typeof n,t["_1caO-"]="number"==typeof n,t)),"data-testid":"notification-badge"},n)},L={"side-nav-menu-item-group__submenu":"_3_Pzu"},I=function(t){var n=t.isExpanded,r=t.toggleExpand,l=t.item,i=l.label,o=l.badge,c=Boolean(l.items.find(function(e){return e.isActive})),s=a(!!c),u=s[0],d=s[1],p=l.items.sort(function(e,a){return Number(e.isPaywalled||!1)-Number(a.isPaywalled||!1)}),f=l.icon;return e.createElement("li",{className:L["side-nav-menu-item-group"]},e.createElement(v,{to:l.url||l.items[0].url,key:i,onClick:function(){if(!n&&c&&r)return r(),void d(!0);u&&!c||d(!u)}},e.createElement(N,{as:"div",isActive:c},f&&e.createElement(e.Fragment,null,e.createElement(f,null),o>0?e.createElement(x,null):void 0),n&&i)),n&&c&&e.createElement("ul",{className:L["side-nav-menu-item-group__submenu"]},p.map(function(a){return e.createElement(v,{to:a.url,key:a.label,onClick:function(){a.onClick&&a.onClick()}},e.createElement(w,{isActive:a.isActive,badge:a.badge,icon:a.isPaywalled?e.createElement(m,{size:"medium",color:"eggplant-500"}):void 0},a.label))})))};function k(e,a){if(!e){"undefined"!=typeof console&&console.warn(a);try{throw new Error(a)}catch(e){}}}!function(e){e.Pop="POP",e.Push="PUSH",e.Replace="REPLACE"}(E||(E={})),function(e){e.data="data",e.deferred="deferred",e.redirect="redirect",e.error="error"}(y||(y={}));var P=function(a){var t=a.isExpanded,n=a.item,r=n.url,l=n.label,i=n.badge,o=n.icon,c=!!function(e,a){"string"==typeof e&&(e={path:e,caseSensitive:!1,end:!0});let[t,n]=function(e,a,t){void 0===a&&(a=!1),void 0===t&&(t=!0),k("*"===e||!e.endsWith("*")||e.endsWith("/*"),'Route path "'+e+'" will be treated as if it were "'+e.replace(/\*$/,"/*")+'" because the `*` character must always follow a `/` in the pattern. To get rid of this warning, please change the route path to "'+e.replace(/\*$/,"/*")+'".');let n=[],r="^"+e.replace(/\/*\*?$/,"").replace(/^\/*/,"/").replace(/[\\.*+^$?{}|()[\]]/g,"\\$&").replace(/\/:(\w+)/g,(e,a)=>(n.push(a),"/([^\\/]+)"));return e.endsWith("*")?(n.push("*"),r+="*"===e||"/*"===e?"(.*)$":"(?:\\/(.+)|\\/*)$"):t?r+="\\/*$":""!==e&&"/"!==e&&(r+="(?:(?=\\/|$))"),[new RegExp(r,a?void 0:"i"),n]}(e.path,e.caseSensitive,e.end),r=a.match(t);if(!r)return null;let l=r[0],i=l.replace(/(.)\/+$/,"$1"),o=r.slice(1);return{params:n.reduce((e,a,t)=>("*"===a&&(i=l.slice(0,l.length-(o[t]||"").length).replace(/(.)\/+$/,"$1")),e[a]=function(e,a){try{return decodeURIComponent(e)}catch(t){return k(!1,'The value for the URL param "'+a+'" will not be decoded because the string "'+e+'" is a malformed URL segment. This is probably due to a bad percent encoding ('+t+")."),e}}(o[t]||"",a),e),{}),pathname:l,pathnameBase:i,pattern:e}}(window.location.pathname,r);return e.createElement(v,{to:r,key:l,onClick:function(e){c&&e.preventDefault(),n.onClick&&n.onClick()}},e.createElement(N,{isActive:c},o&&e.createElement(e.Fragment,null,e.createElement(o,null),i>0?e.createElement(x,null):void 0),t&&l))},R=function(a){var t=a.isExpanded,n=a.toggleExpand;return e.createElement("ul",{className:"_244gq"},a.navItems.map(function(a,r){return"type"in a?e.createElement("div",{key:r,className:"_BLBDK"}):"items"in a?e.createElement(I,{key:a.label,isExpanded:t,item:a,toggleExpand:n}):e.createElement(P,{key:a.label,isExpanded:t,item:a})}))},C=function(a){var t=a.navPosition,n=void 0===t?"collapsed":t,r=a.toggleExpand,l=a.navItems,o=a.appLogo,c="expanded"===n||a.isHovering,m=b();return e.createElement("nav",{className:"_9eWEa"},e.createElement("div",{className:"_2gqbS"},e.createElement(i,{alignItems:"center",justifyContent:"space-between"},(!m||c)&&e.createElement("div",{className:"_2l01n"},o),(c||m)&&e.createElement("button",{onClick:r,className:"_1Ccg2"},e.createElement("collapsed"===n?s:u,null)))),e.createElement(R,{isExpanded:c,toggleExpand:r,navItems:l}))},U=function(a){var t=a.companyLogoURL,n=a.companyName;return e.createElement("div",{className:"_9ii6i"},t&&e.createElement("div",{className:"_3iCo3"},e.createElement(d,{size:"large",url:t})),e.createElement(p,{overlay:"Company name"},e.createElement("span",{className:"_2IZqu"},n)))},$=function(a){var t=a.accountMenuDropdown,n=e.createElement("div",{className:"_2yvUY"},e.createElement(d,{size:"large",url:a.userPrifileImageURL}));return e.createElement(f,{trigger:n,triggersOn:"hover",zIndex:6},t)},z=function(a){var t=a.actions,n=a.accountMenuDropdown,r=a.userPrifileImageURL;return e.createElement("div",{className:"_1Hpad"},e.createElement("div",null,e.createElement(U,{companyLogoURL:a.companyLogoURL,companyName:a.companyName})),e.createElement(i,{space:24,alignItems:"center"},e.createElement(i,{space:12,alignItems:"center"},t),e.createElement($,{accountMenuDropdown:n,userPrifileImageURL:r})))},D=function(i){var o,c,m,s=i.navItems,u=i.appLogo,d=i.actions,p=i.companyLogoURL,f=i.companyName,_=i.userPrifileImageURL,g=i.accountMenuDropdown,v=i.banner,E=i.children,y=n(null),N=n(null),w=a(45),x=w[0],L=w[1];r(function(){N&&N.current&&L(N.current.clientHeight)});var I=function(e,n){var r=a(function(){try{var a=window.localStorage.getItem(e);return!a||JSON.parse(a)}catch(e){return!0}}),l=r[0],i=r[1],o=t(function(a){try{var t=a instanceof Function?a(l):a;i(t),window.localStorage.setItem(e,JSON.stringify(t))}catch(e){throw new Error(e)}},[e,l]);return[l,o]}("vertical-nav-is-expanded"),k=I[0],P=I[1],R=a(!1),U=R[0],$=R[1],D=b();return e.createElement("div",{className:h["layout-frame"]},e.createElement("div",{ref:y,className:l(h["layout-frame__side-bar"],(o={},o[h["layout-frame__side-bar--expanded"]]=k,o[h["layout-frame__side-bar--collapsed"]]=!k,o[h["layout-frame__side-bar--with-banner"]]=!!v,o)),onMouseEnter:function(){!D&&$(!0)},onMouseLeave:function(){!D&&$(!1)},style:{width:k||U?240:72,paddingTop:v?x:0}},e.createElement(C,{isHovering:U,navPosition:k?"expanded":"collapsed",toggleExpand:function(){P(!k),k&&y&&$(!1)},navItems:s,appLogo:u})),e.createElement("div",{className:l(h["layout-frame__middle-area"],(c={},c[h["layout-frame__middle-area--full-size"]]=!1,c))},v&&e.createElement("div",{ref:N,className:l(h["layout-frame__banner"],(m={},m[h["layout-frame__banner--expanded"]]=k,m))},v),e.createElement("div",{className:h["layout-frame__top-bar"]},e.createElement(z,{companyLogoURL:p,companyName:f,actions:d,userPrifileImageURL:_,accountMenuDropdown:g})),e.createElement("div",{className:h["layout-frame__content"]},E)))},S=function(a){var t=a.badge,n=void 0!==t&&t,r=a.onClick;return e.createElement(p,{overlay:a.tooltipContent},e.createElement("button",{className:"_3RkpO",tabIndex:0,onClick:function(){return r()}},a.children,!!n&&e.createElement(x,null,n)))},M=function(a){var t=a.marketingPane,n=a.formBackground,r=a.children;return e.createElement("div",{className:"_3zD6l"},e.createElement("div",{className:"_1Ny96",style:{background:void 0===n?"linear-gradient(235deg, #3a6d7c -8.99%, #2e7eed 85.7%)":n}},e.createElement("div",{className:"_1m5-W"},e.createElement("div",{className:"_2jkua"},a.logo),e.createElement(_,null,r))),e.createElement("div",{className:"_2MMwX"},e.createElement(g,{justifyContent:"center",alignItems:"center"},t)))};export{D as LayoutFrame,M as LoginLayoutFrame,S as NavButton};
+import"@7shifts/sous-chef/dist/index.css";import e,{useState as t,useCallback as a,useRef as n,useLayoutEffect as r}from"react";import l from"classnames";import{Inline as i,Badge as o,Chip as c,IconAward as m,IconChevronRight as s,IconChevronLeft as u,Avatar as d,Tooltip as p,Dropdown as f,Card as _,Stack as g}from"@7shifts/sous-chef";import{Link as v}from"react-router-dom";var E,y,h={"layout-frame":"_2C1bf","layout-frame--no-height":"___2VV","layout-frame__banner":"_32ZI5","layout-frame__banner--expanded":"_2R4LD","layout-frame__middle-area":"_34YPL","layout-frame__middle-area--full-size":"_jG606","layout-frame__middle-area--no-footer-padding":"_2q-8S","layout-frame__side-bar":"_2dNiZ","layout-frame__side-bar--expanded":"_3kzKX","layout-frame__side-bar--with-banner":"_pHsH6","layout-frame__top-bar":"_299Kx","layout-frame__top-bar--hidden":"_3Gz0Y","layout-frame__content":"_Ri_78"},b=function(){return Boolean(window.navigator.maxTouchPoints)},N=function(t){var a,n=t.as,r=void 0===n?"li":n,o=t.isActive,c=t.children,m={className:l("_1ycHa",(a={},a._1D7jK=void 0!==o&&o,a))},s=e.createElement(i,{alignItems:"center",space:16,flex:["0 1 auto","0 0 142px"]},c);return e.createElement(r,m,s)},w=function(t){var a,n=t.isActive,r=t.icon,i=t.badge,m=t.children,s="string"==typeof i&&""!==i,u="number"==typeof i&&i>0;return e.createElement("li",{className:l("_amex_",(a={},a._WdXeV=void 0!==n&&n,a._1zt6h=!r,a))},r,e.createElement("div",{className:"_lLwWh"},m,u&&e.createElement(o,null,function(e){if("number"==typeof e){if(e>0&&e<=99)return String(e);if(e>99)return"99+"}else if("string"==typeof e)return"0"===e?null:parseInt(e)>99?"99+":e;return null}(i)),s&&e.createElement(c,null,i)))},x=function(t){var a,n=t.children;return e.createElement("span",{className:l("_1ne7X",(a={},a["_3jq-L"]="boolean"==typeof n,a["_1caO-"]="number"==typeof n,a)),"data-testid":"notification-badge"},n)},L={"side-nav-menu-item-group__submenu":"_3_Pzu"},I=function(a){var n=a.isExpanded,r=a.toggleExpand,l=a.item,i=l.label,o=l.badge,c=Boolean(l.items.find(function(e){return e.isActive})),s=t(!!c),u=s[0],d=s[1],p=l.items.sort(function(e,t){return Number(e.isPaywalled||!1)-Number(t.isPaywalled||!1)}),f=l.icon;return e.createElement("li",{className:L["side-nav-menu-item-group"]},e.createElement(v,{to:l.url||l.items[0].url,key:i,onClick:function(){if(!n&&c&&r)return r(),void d(!0);u&&!c||d(!u)}},e.createElement(N,{as:"div",isActive:c},f&&e.createElement(e.Fragment,null,e.createElement(f,null),o>0?e.createElement(x,null):void 0),n&&i)),n&&c&&e.createElement("ul",{className:L["side-nav-menu-item-group__submenu"]},p.map(function(t){return e.createElement(v,{to:t.url,key:t.label,onClick:function(){t.onClick&&t.onClick()}},e.createElement(w,{isActive:t.isActive,badge:t.badge,icon:t.isPaywalled?e.createElement(m,{size:"medium",color:"eggplant-500"}):void 0},t.label))})))};function k(e,t){if(!e){"undefined"!=typeof console&&console.warn(t);try{throw new Error(t)}catch(e){}}}!function(e){e.Pop="POP",e.Push="PUSH",e.Replace="REPLACE"}(E||(E={})),function(e){e.data="data",e.deferred="deferred",e.redirect="redirect",e.error="error"}(y||(y={}));var P=function(t){var a=t.isExpanded,n=t.item,r=n.url,l=n.label,i=n.badge,o=n.icon,c=!!function(e,t){"string"==typeof e&&(e={path:e,caseSensitive:!1,end:!0});let[a,n]=function(e,t,a){void 0===t&&(t=!1),void 0===a&&(a=!0),k("*"===e||!e.endsWith("*")||e.endsWith("/*"),'Route path "'+e+'" will be treated as if it were "'+e.replace(/\*$/,"/*")+'" because the `*` character must always follow a `/` in the pattern. To get rid of this warning, please change the route path to "'+e.replace(/\*$/,"/*")+'".');let n=[],r="^"+e.replace(/\/*\*?$/,"").replace(/^\/*/,"/").replace(/[\\.*+^$?{}|()[\]]/g,"\\$&").replace(/\/:(\w+)/g,(e,t)=>(n.push(t),"/([^\\/]+)"));return e.endsWith("*")?(n.push("*"),r+="*"===e||"/*"===e?"(.*)$":"(?:\\/(.+)|\\/*)$"):a?r+="\\/*$":""!==e&&"/"!==e&&(r+="(?:(?=\\/|$))"),[new RegExp(r,t?void 0:"i"),n]}(e.path,e.caseSensitive,e.end),r=t.match(a);if(!r)return null;let l=r[0],i=l.replace(/(.)\/+$/,"$1"),o=r.slice(1);return{params:n.reduce((e,t,a)=>("*"===t&&(i=l.slice(0,l.length-(o[a]||"").length).replace(/(.)\/+$/,"$1")),e[t]=function(e,t){try{return decodeURIComponent(e)}catch(a){return k(!1,'The value for the URL param "'+t+'" will not be decoded because the string "'+e+'" is a malformed URL segment. This is probably due to a bad percent encoding ('+a+")."),e}}(o[a]||"",t),e),{}),pathname:l,pathnameBase:i,pattern:e}}(window.location.pathname,r);return e.createElement(v,{to:r,key:l,onClick:function(e){c&&e.preventDefault(),n.onClick&&n.onClick()}},e.createElement(N,{isActive:c},o&&e.createElement(e.Fragment,null,e.createElement(o,null),i>0?e.createElement(x,null):void 0),a&&l))},R=function(t){var a=t.isExpanded,n=t.toggleExpand,r=C(t.navItems);return e.createElement("ul",{className:"_244gq"},r.map(function(t,r){return"type"in t?e.createElement("div",{key:r,className:"_BLBDK"}):"items"in t?e.createElement(I,{key:t.label,isExpanded:a,item:t,toggleExpand:n}):e.createElement(P,{key:t.label,isExpanded:a,item:t})}))},C=function(e){return e.filter(function(t,a){return"type"in t?!(a===e.length-1):t.isShowing})},U=function(t){var a=t.navPosition,n=void 0===a?"collapsed":a,r=t.toggleExpand,l=t.navItems,o=t.appLogo,c="expanded"===n||t.isHovering,m=b();return e.createElement("nav",{className:"_9eWEa"},e.createElement("div",{className:"_2gqbS"},e.createElement(i,{alignItems:"center",justifyContent:"space-between"},(!m||c)&&e.createElement("div",{className:"_2l01n"},o),(c||m)&&e.createElement("button",{onClick:r,className:"_1Ccg2"},e.createElement("collapsed"===n?s:u,null)))),e.createElement(R,{isExpanded:c,toggleExpand:r,navItems:l}))},$=function(t){var a=t.companyLogoURL,n=t.companyName;return e.createElement("div",{className:"_9ii6i"},a&&e.createElement("div",{className:"_3iCo3"},e.createElement(d,{size:"large",url:a})),e.createElement(p,{overlay:"Company name"},e.createElement("span",{className:"_2IZqu"},n)))},z=function(t){var a=t.accountMenuDropdown,n=e.createElement("div",{className:"_2yvUY"},e.createElement(d,{size:"large",url:t.userPrifileImageURL}));return e.createElement(f,{trigger:n,triggersOn:"hover",zIndex:6},a)},S=function(t){var a=t.actions,n=t.accountMenuDropdown,r=t.userPrifileImageURL;return e.createElement("div",{className:"_1Hpad"},e.createElement("div",null,e.createElement($,{companyLogoURL:t.companyLogoURL,companyName:t.companyName})),e.createElement(i,{space:24,alignItems:"center"},e.createElement(i,{space:12,alignItems:"center"},a),e.createElement(z,{accountMenuDropdown:n,userPrifileImageURL:r})))},D=function(i){var o,c,m,s=i.navItems,u=i.appLogo,d=i.actions,p=i.companyLogoURL,f=i.companyName,_=i.userPrifileImageURL,g=i.accountMenuDropdown,v=i.banner,E=i.children,y=n(null),N=n(null),w=t(45),x=w[0],L=w[1];r(function(){N&&N.current&&L(N.current.clientHeight)});var I=function(e,n){var r=t(function(){try{var t=window.localStorage.getItem(e);return!t||JSON.parse(t)}catch(e){return!0}}),l=r[0],i=r[1],o=a(function(t){try{var a=t instanceof Function?t(l):t;i(a),window.localStorage.setItem(e,JSON.stringify(a))}catch(e){throw new Error(e)}},[e,l]);return[l,o]}("vertical-nav-is-expanded"),k=I[0],P=I[1],R=t(!1),C=R[0],$=R[1],z=b();return e.createElement("div",{className:h["layout-frame"]},e.createElement("div",{ref:y,className:l(h["layout-frame__side-bar"],(o={},o[h["layout-frame__side-bar--expanded"]]=k,o[h["layout-frame__side-bar--collapsed"]]=!k,o[h["layout-frame__side-bar--with-banner"]]=!!v,o)),onMouseEnter:function(){!z&&$(!0)},onMouseLeave:function(){!z&&$(!1)},style:{width:k||C?240:72,paddingTop:v?x:0}},e.createElement(U,{isHovering:C,navPosition:k?"expanded":"collapsed",toggleExpand:function(){P(!k),k&&y&&$(!1)},navItems:s,appLogo:u})),e.createElement("div",{className:l(h["layout-frame__middle-area"],(c={},c[h["layout-frame__middle-area--full-size"]]=!1,c))},v&&e.createElement("div",{ref:N,className:l(h["layout-frame__banner"],(m={},m[h["layout-frame__banner--expanded"]]=k,m))},v),e.createElement("div",{className:h["layout-frame__top-bar"]},e.createElement(S,{companyLogoURL:p,companyName:f,actions:d,userPrifileImageURL:_,accountMenuDropdown:g})),e.createElement("div",{className:h["layout-frame__content"]},E)))},M=function(t){var a=t.badge,n=void 0!==a&&a,r=t.onClick;return e.createElement(p,{overlay:t.tooltipContent},e.createElement("button",{className:"_3RkpO",tabIndex:0,onClick:function(){return r()}},t.children,!!n&&e.createElement(x,null,n)))},A=function(t){var a=t.marketingPane,n=t.formBackground,r=t.children;return e.createElement("div",{className:"_3zD6l"},e.createElement("div",{className:"_1Ny96",style:{background:void 0===n?"linear-gradient(235deg, #3a6d7c -8.99%, #2e7eed 85.7%)":n}},e.createElement("div",{className:"_1m5-W"},e.createElement("div",{className:"_2jkua"},t.logo),e.createElement(_,null,r))),e.createElement("div",{className:"_2MMwX"},e.createElement(g,{justifyContent:"center",alignItems:"center"},a)))};export{D as LayoutFrame,A as LoginLayoutFrame,M as NavButton};
 //# sourceMappingURL=index.modern.js.map