app-layout-frame 0.0.13 → 0.0.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,2 +1,2 @@
1
- import"@7shifts/sous-chef/dist/index.css";import e,{useState as t,useCallback as a,useRef as n}from"react";import r from"classnames";import{Inline as l,Badge as o,Chip as i,IconAward as c,IconChevronRight as m,IconChevronLeft as s,Avatar as u,Tooltip as d,Dropdown as p}from"@7shifts/sous-chef";import{Link as f}from"react-router-dom";var g,v,E={"layout-frame":"_2C1bf","layout-frame--no-height":"___2VV","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__top-bar":"_299Kx","layout-frame__top-bar--hidden":"_3Gz0Y","layout-frame__content":"_Ri_78"},_=function(){return Boolean(window.navigator.maxTouchPoints)},y=function(t){var a,n=t.as,o=void 0===n?"li":n,i=t.isActive,c=t.children,m={className:r("_1ycHa",(a={},a._1D7jK=void 0!==i&&i,a))},s=e.createElement(l,{alignItems:"center",space:16,flex:["0 1 auto","0 0 142px"]},c);return e.createElement(o,m,s)},h=function(t){var a,n=t.isActive,l=t.icon,c=t.badge,m=t.children,s="string"==typeof c&&""!==c,u="number"==typeof c&&c>0;return e.createElement("li",{className:r("_amex_",(a={},a._WdXeV=void 0!==n&&n,a._1zt6h=!l,a))},l,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}(c)),s&&e.createElement(i,null,c)))},b=function(t){var a,n=t.children;return e.createElement("span",{className:r("_1ne7X",(a={},a["_3jq-L"]="boolean"==typeof n,a["_1caO-"]="number"==typeof n,a)),"data-testid":"notification-badge"},n)},N={"side-nav-menu-item-group__submenu":"_3_Pzu"},w=function(a){var n=a.isExpanded,r=a.toggleExpand,l=a.item,o=l.label,i=l.badge,m=Boolean(l.items.find(function(e){return e.isActive})),s=t(!!m),u=s[0],d=s[1],p=l.items.sort(function(e,t){return Number(e.isPaywalled||!1)-Number(t.isPaywalled||!1)}),g=l.icon;return e.createElement("li",{className:N["side-nav-menu-item-group"]},e.createElement(f,{to:l.url||l.items[0].url,key:o,onClick:function(){if(!n&&m&&r)return r(),void d(!0);u&&!m||d(!u)}},e.createElement(y,{as:"div",isActive:m},g&&e.createElement(e.Fragment,null,e.createElement(g,null),i>0?e.createElement(b,null):void 0),n&&o)),n&&m&&e.createElement("ul",{className:N["side-nav-menu-item-group__submenu"]},p.map(function(t){return e.createElement(f,{to:t.url,key:t.label,onClick:function(){t.onClick&&t.onClick()}},e.createElement(h,{isActive:t.isActive,badge:t.badge,icon:t.isPaywalled?e.createElement(c,{size:"medium",color:"eggplant-500"}):void 0},t.label))})))};function x(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"}(g||(g={})),function(e){e.data="data",e.deferred="deferred",e.redirect="redirect",e.error="error"}(v||(v={}));var L=function(t){var a=t.isExpanded,n=t.item,r=n.url,l=n.label,o=n.badge,i=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),x("*"===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],o=l.replace(/(.)\/+$/,"$1"),i=r.slice(1);return{params:n.reduce((e,t,a)=>("*"===t&&(o=l.slice(0,l.length-(i[a]||"").length).replace(/(.)\/+$/,"$1")),e[t]=function(e,t){try{return decodeURIComponent(e)}catch(a){return x(!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}}(i[a]||"",t),e),{}),pathname:l,pathnameBase:o,pattern:e}}(window.location.pathname,r);return e.createElement(f,{to:r,key:l,onClick:function(e){c&&e.preventDefault(),n.onClick&&n.onClick()}},e.createElement(y,{isActive:c},i&&e.createElement(e.Fragment,null,e.createElement(i,null),o>0?e.createElement(b,null):void 0),a&&l))},I=function(t){var a=t.isExpanded,n=t.toggleExpand;return e.createElement("ul",{className:"_244gq"},t.navItems.map(function(t,r){return"type"in t?e.createElement("div",{key:r,className:"_BLBDK"}):"items"in t?e.createElement(w,{key:t.label,isExpanded:a,item:t,toggleExpand:n}):e.createElement(L,{key:t.label,isExpanded:a,item:t})}))},P=function(t){var a=t.navPosition,n=void 0===a?"collapsed":a,r=t.toggleExpand,o=t.navItems,i=t.appLogo,c="expanded"===n||t.isHovering,u=_();return e.createElement("nav",{className:"_9eWEa"},e.createElement("div",{className:"_2gqbS"},e.createElement(l,{alignItems:"center",justifyContent:"space-between"},(!u||c)&&e.createElement("div",{className:"_2l01n"},i),(c||u)&&e.createElement("button",{onClick:r,className:"_1Ccg2"},e.createElement("collapsed"===n?m:s,null)))),e.createElement(I,{isExpanded:c,toggleExpand:r,navItems:o}))},R=function(t){var a=t.companyName;return e.createElement("div",{className:"_9ii6i"},e.createElement("div",{className:"_3iCo3"},e.createElement(u,{size:"large",url:t.companyLogoURL})),e.createElement(d,{overlay:"Company name"},e.createElement("span",{className:"_2IZqu"},a)))},k=function(t){var a=t.accountMenuDropdown,n=e.createElement("div",{className:"_2yvUY"},e.createElement(u,{size:"large",url:t.userPrifileImageURL}));return e.createElement(p,{trigger:n,triggersOn:"hover",zIndex:6},a)},C=function(t){var a=t.actions,n=t.accountMenuDropdown,r=t.userPrifileImageURL;return e.createElement("div",{className:"_1Hpad"},e.createElement("div",null,e.createElement(R,{companyLogoURL:t.companyLogoURL,companyName:t.companyName})),e.createElement(l,{space:24,alignItems:"center"},e.createElement(l,{space:12,alignItems:"center"},a),e.createElement(k,{accountMenuDropdown:n,userPrifileImageURL:r})))},U=function(l){var o,i,c=l.navItems,m=l.appLogo,s=l.actions,u=l.companyLogoURL,d=l.companyName,p=l.userPrifileImageURL,f=l.accountMenuDropdown,g=l.children,v=n(null),y=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],o=r[1],i=a(function(t){try{var a=t instanceof Function?t(l):t;o(a),window.localStorage.setItem(e,JSON.stringify(a))}catch(e){throw new Error(e)}},[e,l]);return[l,i]}("vertical-nav-is-expanded"),h=y[0],b=y[1],N=t(!1),w=N[0],x=N[1],L=_();return e.createElement("div",{className:E["layout-frame"]},e.createElement("div",{ref:v,className:r(E["layout-frame__side-bar"],(o={},o[E["layout-frame__side-bar--expanded"]]=h,o[E["layout-frame__side-bar--collapsed"]]=!h,o)),onMouseEnter:function(){!L&&x(!0)},onMouseLeave:function(){!L&&x(!1)},style:{width:h||w?240:72}},e.createElement(P,{isHovering:w,navPosition:h?"expanded":"collapsed",toggleExpand:function(){b(!h),h&&v&&x(!1)},navItems:c,appLogo:m})),e.createElement("div",{className:r(E["layout-frame__middle-area"],(i={},i[E["layout-frame__middle-area--full-size"]]=!1,i))},e.createElement("div",{className:E["layout-frame__top-bar"]},e.createElement(C,{companyLogoURL:u,companyName:d,actions:s,userPrifileImageURL:p,accountMenuDropdown:f})),e.createElement("div",{className:E["layout-frame__content"]},g)))},$=function(t){var a=t.badge,n=void 0!==a&&a,r=t.onClick;return e.createElement(d,{overlay:t.tooltipContent},e.createElement("button",{className:"_3RkpO",tabIndex:0,onClick:function(){return r()}},t.children,!!n&&e.createElement(b,null,n)))};export{U as LayoutFrame,$ as NavButton};
1
+ 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 o,Badge as i,Chip as c,IconAward as m,IconChevronRight as s,IconChevronLeft as u,Avatar as d,Tooltip as p,Dropdown as f}from"@7shifts/sous-chef";import{Link as _}from"react-router-dom";var g,v,E={"layout-frame":"_2C1bf","layout-frame--no-height":"___2VV","layout-frame__banner":"_32ZI5","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"},y=function(){return Boolean(window.navigator.maxTouchPoints)},h=function(t){var a,n=t.as,r=void 0===n?"li":n,i=t.isActive,c=t.children,m={className:l("_1ycHa",(a={},a._1D7jK=void 0!==i&&i,a))},s=e.createElement(o,{alignItems:"center",space:16,flex:["0 1 auto","0 0 142px"]},c);return e.createElement(r,m,s)},b=function(t){var a,n=t.isActive,r=t.icon,o=t.badge,m=t.children,s="string"==typeof o&&""!==o,u="number"==typeof o&&o>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(i,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}(o)),s&&e.createElement(c,null,o)))},w=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)},N={"side-nav-menu-item-group__submenu":"_3_Pzu"},x=function(a){var n=a.isExpanded,r=a.toggleExpand,l=a.item,o=l.label,i=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:N["side-nav-menu-item-group"]},e.createElement(_,{to:l.url||l.items[0].url,key:o,onClick:function(){if(!n&&c&&r)return r(),void d(!0);u&&!c||d(!u)}},e.createElement(h,{as:"div",isActive:c},f&&e.createElement(e.Fragment,null,e.createElement(f,null),i>0?e.createElement(w,null):void 0),n&&o)),n&&c&&e.createElement("ul",{className:N["side-nav-menu-item-group__submenu"]},p.map(function(t){return e.createElement(_,{to:t.url,key:t.label,onClick:function(){t.onClick&&t.onClick()}},e.createElement(b,{isActive:t.isActive,badge:t.badge,icon:t.isPaywalled?e.createElement(m,{size:"medium",color:"eggplant-500"}):void 0},t.label))})))};function L(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"}(g||(g={})),function(e){e.data="data",e.deferred="deferred",e.redirect="redirect",e.error="error"}(v||(v={}));var I=function(t){var a=t.isExpanded,n=t.item,r=n.url,l=n.label,o=n.badge,i=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),L("*"===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],o=l.replace(/(.)\/+$/,"$1"),i=r.slice(1);return{params:n.reduce((e,t,a)=>("*"===t&&(o=l.slice(0,l.length-(i[a]||"").length).replace(/(.)\/+$/,"$1")),e[t]=function(e,t){try{return decodeURIComponent(e)}catch(a){return L(!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}}(i[a]||"",t),e),{}),pathname:l,pathnameBase:o,pattern:e}}(window.location.pathname,r);return e.createElement(_,{to:r,key:l,onClick:function(e){c&&e.preventDefault(),n.onClick&&n.onClick()}},e.createElement(h,{isActive:c},i&&e.createElement(e.Fragment,null,e.createElement(i,null),o>0?e.createElement(w,null):void 0),a&&l))},P=function(t){var a=t.isExpanded,n=t.toggleExpand;return e.createElement("ul",{className:"_244gq"},t.navItems.map(function(t,r){return"type"in t?e.createElement("div",{key:r,className:"_BLBDK"}):"items"in t?e.createElement(x,{key:t.label,isExpanded:a,item:t,toggleExpand:n}):e.createElement(I,{key:t.label,isExpanded:a,item:t})}))},R=function(t){var a=t.navPosition,n=void 0===a?"collapsed":a,r=t.toggleExpand,l=t.navItems,i=t.appLogo,c="expanded"===n||t.isHovering,m=y();return e.createElement("nav",{className:"_9eWEa"},e.createElement("div",{className:"_2gqbS"},e.createElement(o,{alignItems:"center",justifyContent:"space-between"},(!m||c)&&e.createElement("div",{className:"_2l01n"},i),(c||m)&&e.createElement("button",{onClick:r,className:"_1Ccg2"},e.createElement("collapsed"===n?s:u,null)))),e.createElement(P,{isExpanded:c,toggleExpand:r,navItems:l}))},k=function(t){var a=t.companyName;return e.createElement("div",{className:"_9ii6i"},e.createElement("div",{className:"_3iCo3"},e.createElement(d,{size:"large",url:t.companyLogoURL})),e.createElement(p,{overlay:"Company name"},e.createElement("span",{className:"_2IZqu"},a)))},C=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)},U=function(t){var a=t.actions,n=t.accountMenuDropdown,r=t.userPrifileImageURL;return e.createElement("div",{className:"_1Hpad"},e.createElement("div",null,e.createElement(k,{companyLogoURL:t.companyLogoURL,companyName:t.companyName})),e.createElement(o,{space:24,alignItems:"center"},e.createElement(o,{space:12,alignItems:"center"},a),e.createElement(C,{accountMenuDropdown:n,userPrifileImageURL:r})))},$=function(o){var i,c,m=o.navItems,s=o.appLogo,u=o.actions,d=o.companyLogoURL,p=o.companyName,f=o.userPrifileImageURL,_=o.accountMenuDropdown,g=o.banner,v=o.children,h=n(null),b=n(null),w=t(45),N=w[0],x=w[1];r(function(){b&&b.current&&x(b.current.clientHeight)});var L=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],o=r[1],i=a(function(t){try{var a=t instanceof Function?t(l):t;o(a),window.localStorage.setItem(e,JSON.stringify(a))}catch(e){throw new Error(e)}},[e,l]);return[l,i]}("vertical-nav-is-expanded"),I=L[0],P=L[1],k=t(!1),C=k[0],$=k[1],z=y();return e.createElement("div",{className:E["layout-frame"]},e.createElement("div",{ref:h,className:l(E["layout-frame__side-bar"],(i={},i[E["layout-frame__side-bar--expanded"]]=I,i[E["layout-frame__side-bar--collapsed"]]=!I,i[E["layout-frame__side-bar--with-banner"]]=!!g,i)),onMouseEnter:function(){!z&&$(!0)},onMouseLeave:function(){!z&&$(!1)},style:{width:I||C?240:72,paddingTop:g?N:0}},e.createElement(R,{isHovering:C,navPosition:I?"expanded":"collapsed",toggleExpand:function(){P(!I),I&&h&&$(!1)},navItems:m,appLogo:s})),e.createElement("div",{className:l(E["layout-frame__middle-area"],(c={},c[E["layout-frame__middle-area--full-size"]]=!1,c))},g&&e.createElement("div",{ref:b,className:l(E["layout-frame__banner"])},g),e.createElement("div",{className:E["layout-frame__top-bar"]},e.createElement(U,{companyLogoURL:d,companyName:p,actions:u,userPrifileImageURL:f,accountMenuDropdown:_})),e.createElement("div",{className:E["layout-frame__content"]},v)))},z=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(w,null,n)))};export{$ as LayoutFrame,z as NavButton};
2
2
  //# sourceMappingURL=index.modern.js.map