@contentful/f36-navbar 5.0.0-alpha.7 → 5.0.0-alpha.8

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.
package/dist/esm/index.js CHANGED
@@ -3,13 +3,13 @@ import { Box, Flex, Stack } from '@contentful/f36-core';
3
3
  import u, { forwardRef } from 'react';
4
4
  import { cx, css, keyframes } from 'emotion';
5
5
  import o from '@contentful/f36-tokens';
6
- import { generateIcon } from '@contentful/f36-icon';
6
+ import { generateIcon } from '@contentful/f36-icon-alpha';
7
7
  import { useDensity, hexToRGBA } from '@contentful/f36-utils';
8
8
  import { Avatar } from '@contentful/f36-avatar';
9
9
  import { SkeletonContainer, SkeletonImage, SkeletonText, SkeletonBodyText, SkeletonDisplayText } from '@contentful/f36-skeleton';
10
10
  import { ExternalLinkIcon, EnvironmentAliasIcon, EnvironmentIcon } from '@contentful/f36-icons';
11
11
 
12
- var Or=Object.defineProperty,Dr=Object.defineProperties;var _r=Object.getOwnPropertyDescriptors;var te=Object.getOwnPropertySymbols;var He=Object.prototype.hasOwnProperty,Oe=Object.prototype.propertyIsEnumerable;var Le=(e,r,t)=>r in e?Or(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,m=(e,r)=>{for(var t in r||(r={}))He.call(r,t)&&Le(e,t,r[t]);if(te)for(var t of te(r))Oe.call(r,t)&&Le(e,t,r[t]);return e},d=(e,r)=>Dr(e,_r(r));var f=(e,r)=>{var t={};for(var a in e)He.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&te)for(var a of te(e))r.indexOf(a)<0&&Oe.call(e,a)&&(t[a]=e[a]);return t};var M={medium:"@media (min-width: 480px)",large:"@media (min-width: 768px)",xlarge:"@media (min-width: 1920px)"},I=(e=o.glowPrimary)=>({"&:focus":{boxShadow:e},"&:focus:not(:focus-visible)":{boxShadow:"unset"},"&:focus-visible":{boxShadow:e}});var De=(e,r)=>({containerTop:css({justifyContent:"center",backgroundColor:o.gray100}),containerBottom:css({justifyContent:"center",backgroundColor:o.gray100}),containerTopContent:css({width:"100%",maxWidth:r==="wide"?"1524px":e,padding:o.spacingXs,minHeight:o.spacingL,[M.medium]:{padding:`${o.spacingXs} 20px`}}),containerBottomContent:css({width:"100%",maxWidth:r==="wide"?"1524px":e,padding:0,paddingTop:o.spacing2Xs,minHeight:"2.5rem",overflow:"auto",[M.medium]:{padding:`${o.spacing2Xs} ${o.spacingXs}`}}),logo:css({height:"28px",width:"28px"})});var _e=generateIcon({name:"CircleIcon",viewBox:"0 0 24 24",path:u.createElement("path",{d:"M11.994 6.526A5.47 5.47 0 0 0 6.526 12a5.47 5.47 0 0 0 5.468 5.473A5.476 5.476 0 0 0 17.473 12a5.477 5.477 0 0 0-5.479-5.474ZM12 15.447a3.448 3.448 0 1 1 0-6.896 3.448 3.448 0 0 1 0 6.896Z",fill:"currentFill"})});var We=generateIcon({name:"ArrowDownIcon",viewBox:"0 0 12 20",path:u.createElement("path",{d:"M3.03076 8C2.20109 8 1.73228 8.95209 2.23814 9.60971L5.20727 13.4696C5.60757 13.99 6.39223 13.99 6.79252 13.4696L9.76166 9.60971C10.2675 8.95209 9.79871 8 8.96904 8L3.03076 8Z",fill:"#9FA8B2"})});var Fe=generateIcon({name:"HelpIcon",viewBox:"0 0 24 24",path:u.createElement(u.Fragment,null,u.createElement("g",{clipPath:"url(#HelpIcon_svg__a)"},u.createElement("path",{d:"M12 2.25A9.75 9.75 0 1 0 21.75 12 9.769 9.769 0 0 0 12 2.25ZM12 18a1.125 1.125 0 1 1 0-2.25A1.125 1.125 0 0 1 12 18Zm.75-4.584v.084a.75.75 0 1 1-1.5 0v-.75A.75.75 0 0 1 12 12a1.875 1.875 0 1 0-1.875-1.875.75.75 0 1 1-1.5 0 3.375 3.375 0 1 1 4.125 3.29Z",fill:"currentFill"})),u.createElement("defs",null,u.createElement("clipPath",{id:"HelpIcon_svg__a"},u.createElement("path",{fill:"currentFill",d:"M0 0h24v24H0z"}))))});var $e=generateIcon({name:"SearchIcon",viewBox:"0 0 24 24",path:u.createElement(u.Fragment,null,u.createElement("g",{clipPath:"url(#SearchIcon_svg__a)"},u.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M6 11.125a5.125 5.125 0 1 1 10.25 0 5.125 5.125 0 0 1-10.25 0ZM11.125 4a7.125 7.125 0 1 0 4.282 12.82l2.886 2.887a1 1 0 0 0 1.414-1.414l-2.886-2.887A7.125 7.125 0 0 0 11.125 4Z",fill:"currentFill"})),u.createElement("defs",null,u.createElement("clipPath",{id:"SearchIcon_svg__a"},u.createElement("path",{fill:"#fff",d:"M0 0h24v24H0z"}))))});var Xe=generateIcon({name:"ContentfulLogoIcon",viewBox:"0 0 28 28",path:u.createElement(u.Fragment,null,u.createElement("path",{fill:"#1773EB",d:"M10.713 5.001c.845.843 1.167 2.079.845 3.228A6.663 6.663 0 0 1 15 7.276h.026a6.7 6.7 0 0 1 4.743 1.988 2.64 2.64 0 1 0 3.746-3.715A11.96 11.96 0 0 0 15.042 2h-.046a11.933 11.933 0 0 0-6.691 2.036h.074a3.287 3.287 0 0 1 2.334.967V5Z"}),u.createElement("path",{fill:"#E44F20",d:"M21.594 17.999a2.64 2.64 0 0 0-1.858.766 6.703 6.703 0 0 1-4.732 1.951h-.025a6.65 6.65 0 0 1-3.447-.968A3.3 3.3 0 0 1 8.35 23.93h-.086A11.926 11.926 0 0 0 14.96 26h.046a11.94 11.94 0 0 0 8.449-3.484 2.64 2.64 0 0 0-1.859-4.514V18h-.002Z"}),u.createElement("path",{fill:"#FFDA00",d:"M6.013 18.295a3.27 3.27 0 0 1 2.334-.967c.302 0 .603.04.894.122a6.7 6.7 0 0 1 .013-6.928A3.3 3.3 0 0 1 5.08 7.335v-.09a11.999 11.999 0 0 0-.032 13.453v-.07a3.27 3.27 0 0 1 .966-2.333Z"}),u.createElement("path",{fill:"#1773EB",d:"M8.379 4.62c-.75 0-1.276.312-1.913.949-.607.605-.798 1.135-.8 1.766A2.712 2.712 0 1 0 8.38 4.62Z"}),u.createElement("path",{fill:"#E44F20",d:"M5.628 20.631c0 .75.31 1.276.946 1.912.607.606 1.136.799 1.766.8a2.703 2.703 0 1 0-.017-5.407 2.703 2.703 0 0 0-2.695 2.704v-.009Z"}))});function qr(e,r){let Z=e,{account:t,badge:a,bottomRightItems:i,children:n,className:s,contentMaxWidth:c="100%",help:l,logo:p,search:v,switcher:x,testId:N="cf-ui-navbar",topRightItems:w,variant:E="wide"}=Z,D=f(Z,["account","badge","bottomRightItems","children","className","contentMaxWidth","help","logo","search","switcher","testId","topRightItems","variant"]),R=De(c,E);return u.createElement(Box,d(m({},D),{ref:r,testId:N,className:s}),u.createElement(Flex,{className:R.containerTop},u.createElement(Flex,{className:R.containerTopContent,justifyContent:"space-between"},u.createElement(Flex,{alignItems:"center",gap:"spacingL"},p||u.createElement(Xe,{className:R.logo}),x),u.createElement(Flex,{alignItems:"center",gap:"spacingXs"},w,a,v,l,t))),u.createElement(Flex,{className:R.containerBottom},u.createElement(Flex,{className:R.containerBottomContent,justifyContent:"space-between"},u.createElement(Flex,{as:"nav","aria-label":"Main Navigation"},n),i&&u.createElement(Flex,null,i))))}var Ge=u.forwardRef(qr);var Jr={warning:o.colorWarning,negative:o.colorNegative,info:o.blue500},Ve=()=>({navbarAccount:css({margin:0,padding:0,border:0,cursor:"pointer",background:"none",position:"relative",outline:"none",overflow:"visible",borderRadius:"50%","&:before":css({content:'""',display:"block",position:"absolute",height:"24px",width:"24px",backgroundColor:"transparent",borderRadius:"50%"}),"&:hover:before":css({backgroundColor:hexToRGBA(o.gray300,.15)})},I()),avatar:css({borderRadius:"50%",display:"block",height:"24px",width:"24px"}),notificationIcon:e=>css({position:"absolute",top:0,right:0,height:o.spacingS,width:o.spacingS,borderRadius:"50%",border:`2px solid ${o.gray100}`,backgroundColor:Jr[e],transform:"translate(30%, -30%)"})});var je=()=>({menuList:css({minWidth:"250px"})});var _=e=>{let{trigger:r,children:t,testId:a="cf-ui-navbar-menu-list",onOpen:i,onClose:n}=e,s=je();return u.createElement(Menu,{onOpen:i,onClose:n},u.createElement(Menu.Trigger,null,r),u.createElement(Menu.List,{className:s.menuList,testId:a},t))};function tt(e,r){let N=e,{children:t,className:a,testId:i="cf-ui-navbar-account-trigger",avatar:n,initials:s,username:c,hasNotification:l,notificationVariant:p="warning"}=N,v=f(N,["children","className","testId","avatar","initials","username","hasNotification","notificationVariant"]),x=Ve();return u.createElement(_,{trigger:u.createElement(Flex,d(m({as:"button"},v),{ref:r,className:cx(x.navbarAccount,a),testId:i,alignItems:"center"}),u.createElement(Avatar,{src:n,initials:s,size:"small",variant:"user"}),l?u.createElement("span",{className:x.notificationIcon(p)}):null)},t)}var ue=u.forwardRef(tt);function ge({ariaLabel:e}){return u.createElement(SkeletonContainer,{svgWidth:24,svgHeight:24,ariaLabel:e,backgroundColor:o.gray300,foregroundColor:o.gray200},u.createElement(SkeletonImage,{width:24,height:24,radiusX:12,radiusY:12}))}var qe=()=>css({"&::after":{content:'""',position:"absolute",width:`calc(100% - ${o.spacingM})`,height:"2px",bottom:`-${o.spacing2Xs}`,left:0,right:0,margin:"auto",backgroundColor:o.blue600,zIndex:0}}),Ye={display:"flex",justifyContent:"center",padding:`${o.spacing2Xs} ${o.spacingS}`,alignItems:"center",background:"none"},Je=()=>({navbarItem:css(Ye,{alignItems:"center",background:"none",border:0,margin:0,outline:"none",fontSize:o.fontSizeM,lineHeight:o.lineHeightS,fontWeight:o.fontWeightMedium,position:"relative",textAlign:"left",whiteSpace:"nowrap",cursor:"pointer",hyphens:"auto",textDecoration:"none",color:o.gray700,boxSizing:"border-box",transition:`color ${o.transitionDurationShort} ${o.transitionEasingCubicBezier}`,borderRadius:o.borderRadiusMedium,"&:hover":{backgroundColor:hexToRGBA(o.gray900,.05)},"&:hover::before":{opacity:1,scale:"1"},"&:active::before":{backgroundColor:"rgba(255, 255, 255, 0.1)"},"&:disabled":{cursor:"auto"},"& svg":{transition:`fill ${o.transitionDurationShort} ${o.transitionEasingCubicBezier}`},"& > svg, & > span":{zIndex:o.zIndexDefault}},I(`inset ${o.glowPrimary}`)),navbarItemMenuTrigger:css({paddingRight:o.spacingXs}),isActive:qe()}),Ke=()=>({itemSkeleton:css(Ye)});var Qe=()=>({navbarItemIcon:css({fill:o.gray700,"&:first-child":{marginRight:o.spacing2Xs},"&:last-child":{marginLeft:o.spacing2Xs},"img&":{borderRadius:o.borderRadiusSmall,maxWidth:o.spacingM,maxHeight:o.spacingM}})});var K=e=>{var i,n;let{icon:r,variant:t}=e,a=Qe();return u.cloneElement(r,{className:cx(r.props.className,a.navbarItemIcon),size:(i=r.props.size)!=null?i:"tiny",variant:(n=r.props.variant)!=null?n:t})};var ct="button";function mt(e,r){let D=e,{as:t=ct,icon:a,title:i,children:n,className:s,isActive:c,testId:l="cf-ui-navbar-item",onOpen:p,onClose:v}=D,x=f(D,["as","icon","title","children","className","isActive","testId","onOpen","onClose"]),N=Je(),w=dt(e),E=u.createElement(t,d(m({},x),{ref:r,"data-test-id":l,className:cx(N.navbarItem,w&&N.navbarItemMenuTrigger,c&&N.isActive,s)}),a&&u.createElement(K,{icon:a,variant:"secondary"}),u.createElement("span",null,i),w&&u.createElement(We,null));return w?u.createElement(_,{trigger:E,testId:l,onOpen:p,onClose:v},n):E}var dt=e=>!!e.children,be=u.forwardRef(mt);var ve=({estimatedWidth:e})=>{let r=Ke();return u.createElement(SkeletonContainer,{className:r.itemSkeleton,svgWidth:e,svgHeight:32,backgroundColor:o.gray300,foregroundColor:o.gray200},u.createElement(SkeletonText,{lineHeight:6,numberOfLines:1,offsetTop:10,radiusX:o.borderRadiusSmall,radiusY:o.borderRadiusSmall}))};var rr=()=>({navbarMenuItem:css({display:"flex",justifyContent:"flex-start",alignItems:"center"})});var xt="button";function yt(e,r){let p=e,{as:t=xt,icon:a,title:i,className:n}=p,s=f(p,["as","icon","title","className"]),c=rr(),l=Nt(e);return u.createElement(Menu.Item,d(m({},s),{ref:r,as:t,className:cx(c.navbarMenuItem,n)}),a?u.createElement(K,{icon:a,variant:"secondary"}):l&&tr,u.createElement("span",null,i),a&&l?tr:null)}var tr=u.createElement(K,{icon:u.createElement(ExternalLinkIcon,null),variant:"muted"}),Nt=e=>e.as==="a"&&e.target==="_blank",he=u.forwardRef(yt);var xe=({ariaLabel:e})=>u.createElement(Menu.Item,null,u.createElement(Flex,{alignItems:"center",gap:o.spacingXs},u.createElement(SkeletonContainer,{svgHeight:16,svgWidth:18},u.createElement(SkeletonImage,{width:16,height:16})),u.createElement(SkeletonContainer,{svgHeight:16,svgWidth:190,ariaLabel:e},u.createElement(SkeletonBodyText,{numberOfLines:1}))));var ar=()=>({navbarSwitcher:css({margin:0,padding:0,background:"none",border:"none",height:"max-content",color:o.gray700,cursor:"pointer",fontSize:o.fontSizeS,fontWeight:o.fontWeightMedium,position:"relative",outline:"none",borderRadius:"3rem","&:after":{content:'""',border:"1px solid #353A41",boxSizing:"border-box",height:"16px",right:"-1px",position:"absolute",width:0},"&:last-child:after":{display:"none"},"&:hover li":{backgroundColor:"#f2f4f6"}},I()),switcherMenuIcon:css({height:o.spacingM,width:o.spacingM,fill:o.gray700}),switcherBreadcrumbs:css({listStyleType:"none",margin:0,padding:0,position:"relative"})});function At(e,r){let c=e,{children:t,className:a,testId:i="cf-ui-navbar-switcher"}=c,n=f(c,["children","className","testId"]),s=ar();return u.createElement(Flex,d(m({},n),{as:"button",ref:r,className:cx(s.navbarSwitcher,a),testId:i,alignItems:"center",fullHeight:!0,gap:"spacingXs"}),u.createElement(Flex,{as:"ul",alignItems:"center",className:s.switcherBreadcrumbs},t))}var Ie=u.forwardRef(At);var Se=({estimatedWidth:e})=>u.createElement(SkeletonContainer,{svgWidth:e,svgHeight:24,backgroundColor:o.gray300,foregroundColor:o.gray200},u.createElement(SkeletonDisplayText,{lineHeight:24,numberOfLines:1,radiusX:12,radiusY:12}));var zt=Object.defineProperty,Lt=Object.defineProperties,Ht=Object.getOwnPropertyDescriptors,ne=Object.getOwnPropertySymbols,pr=Object.prototype.hasOwnProperty,cr=Object.prototype.propertyIsEnumerable,lr=(e,r,t)=>r in e?zt(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,Ot=(e,r)=>{for(var t in r||(r={}))pr.call(r,t)&&lr(e,t,r[t]);if(ne)for(var t of ne(r))cr.call(r,t)&&lr(e,t,r[t]);return e},Dt=(e,r)=>Lt(e,Ht(r)),_t=(e,r)=>{var t={};for(var a in e)pr.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&ne)for(var a of ne(e))r.indexOf(a)<0&&cr.call(e,a)&&(t[a]=e[a]);return t},Wt={large:"36px",medium:"20px",small:"14px"},Ft=()=>{let e={scale1:keyframes`
12
+ var Zr=Object.defineProperty,qr=Object.defineProperties;var Yr=Object.getOwnPropertyDescriptors;var ie=Object.getOwnPropertySymbols;var $e=Object.prototype.hasOwnProperty,Xe=Object.prototype.propertyIsEnumerable;var Fe=(e,r,t)=>r in e?Zr(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,m=(e,r)=>{for(var t in r||(r={}))$e.call(r,t)&&Fe(e,t,r[t]);if(ie)for(var t of ie(r))Xe.call(r,t)&&Fe(e,t,r[t]);return e},d=(e,r)=>qr(e,Yr(r));var f=(e,r)=>{var t={};for(var a in e)$e.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&ie)for(var a of ie(e))r.indexOf(a)<0&&Xe.call(e,a)&&(t[a]=e[a]);return t};var M={medium:"@media (min-width: 480px)",large:"@media (min-width: 768px)",xlarge:"@media (min-width: 1920px)"},S=(e=o.glowPrimary)=>({"&:focus":{boxShadow:e},"&:focus:not(:focus-visible)":{boxShadow:"unset"},"&:focus-visible":{boxShadow:e}});var Ge=(e,r)=>({containerTop:css({justifyContent:"center",backgroundColor:o.gray100}),containerBottom:css({justifyContent:"center",backgroundColor:o.gray100}),containerTopContent:css({width:"100%",maxWidth:r==="wide"?"1524px":e,padding:o.spacingXs,minHeight:o.spacingL,[M.medium]:{padding:`${o.spacingXs} 20px`}}),containerBottomContent:css({width:"100%",maxWidth:r==="wide"?"1524px":e,padding:0,paddingTop:o.spacing2Xs,minHeight:"2.5rem",overflow:"auto",[M.medium]:{padding:`${o.spacing2Xs} ${o.spacingXs}`}}),logo:css({height:"28px",width:"28px"})});var rt=Object.defineProperty,tt=Object.defineProperties,ot=Object.getOwnPropertyDescriptors,se=Object.getOwnPropertySymbols,Ze=Object.prototype.hasOwnProperty,qe=Object.prototype.propertyIsEnumerable,Ve=(e,r,t)=>r in e?rt(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,k=(e,r)=>{for(var t in r||(r={}))Ze.call(r,t)&&Ve(e,t,r[t]);if(se)for(var t of se(r))qe.call(r,t)&&Ve(e,t,r[t]);return e},ve=(e,r)=>tt(e,ot(r)),at=(e,r)=>{var t={};for(var a in e)Ze.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&se)for(var a of se(e))r.indexOf(a)<0&&qe.call(e,a)&&(t[a]=e[a]);return t},nt="svg",Ue={xlarge:{height:"48px",width:"48px"},large:{height:"32px",width:"32px"},medium:{height:"24px",width:"24px"},small:{height:"18px",width:"18px"},tiny:{height:"16px",width:"16px"}},it={muted:o.gray600,negative:o.red600,positive:o.green600,primary:o.blue600,secondary:o.gray900,warning:o.colorWarning,white:o.colorWhite,premium:o.purple500},st=e=>{let r=e["aria-label"],t=e["aria-labelledby"];return r||t?{}:{"aria-hidden":!0}};function lt(e,r){var t=e,{as:a,children:i,className:n,variant:s="primary",role:c="img",size:l="small",testId:p="cf-ui-icon",trimmed:g,viewBox:h="0 0 24 24"}=t,x=at(t,["as","children","className","variant","role","size","testId","trimmed","viewBox"]);let I={className:cx(css({fill:it[s],height:Ue[l].height,width:g?"auto":Ue[l].width}),n),ref:r,testId:p,role:c},P=st(x);return a?u.createElement(Box,ve(k(k(k({display:"inline-block"},P),x),I),{as:a})):u.createElement(Box,k(ve(k(k({viewBox:h,display:"inline-block"},P),x),{as:nt}),I),i)}var pt=forwardRef(lt);function T({name:e,path:r,props:t,trimmed:a,viewBox:i}){let n=function(s){return u.createElement(pt,ve(k(k({viewBox:i},t),s),{trimmed:a}),r)};return e&&(n.displayName=e),n}var Ye=T({name:"CircleIcon",viewBox:"0 0 24 24",path:u.createElement("path",{d:"M11.994 6.526A5.47 5.47 0 0 0 6.526 12a5.47 5.47 0 0 0 5.468 5.473A5.476 5.476 0 0 0 17.473 12a5.477 5.477 0 0 0-5.479-5.474ZM12 15.447a3.448 3.448 0 1 1 0-6.896 3.448 3.448 0 0 1 0 6.896Z",fill:"currentFill"})});var Je=T({name:"ArrowDownIcon",viewBox:"0 0 12 20",path:u.createElement("path",{d:"M3.03076 8C2.20109 8 1.73228 8.95209 2.23814 9.60971L5.20727 13.4696C5.60757 13.99 6.39223 13.99 6.79252 13.4696L9.76166 9.60971C10.2675 8.95209 9.79871 8 8.96904 8L3.03076 8Z",fill:"#9FA8B2"})});var Ke=T({name:"HelpIcon",viewBox:"0 0 24 24",path:u.createElement(u.Fragment,null,u.createElement("g",{clipPath:"url(#HelpIcon_svg__a)"},u.createElement("path",{d:"M12 2.25A9.75 9.75 0 1 0 21.75 12 9.769 9.769 0 0 0 12 2.25ZM12 18a1.125 1.125 0 1 1 0-2.25A1.125 1.125 0 0 1 12 18Zm.75-4.584v.084a.75.75 0 1 1-1.5 0v-.75A.75.75 0 0 1 12 12a1.875 1.875 0 1 0-1.875-1.875.75.75 0 1 1-1.5 0 3.375 3.375 0 1 1 4.125 3.29Z",fill:"currentFill"})),u.createElement("defs",null,u.createElement("clipPath",{id:"HelpIcon_svg__a"},u.createElement("path",{fill:"currentFill",d:"M0 0h24v24H0z"}))))});var Qe=T({name:"SearchIcon",viewBox:"0 0 24 24",path:u.createElement(u.Fragment,null,u.createElement("g",{clipPath:"url(#SearchIcon_svg__a)"},u.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M6 11.125a5.125 5.125 0 1 1 10.25 0 5.125 5.125 0 0 1-10.25 0ZM11.125 4a7.125 7.125 0 1 0 4.282 12.82l2.886 2.887a1 1 0 0 0 1.414-1.414l-2.886-2.887A7.125 7.125 0 0 0 11.125 4Z",fill:"currentFill"})),u.createElement("defs",null,u.createElement("clipPath",{id:"SearchIcon_svg__a"},u.createElement("path",{fill:"#fff",d:"M0 0h24v24H0z"}))))});var er=generateIcon({name:"ContentfulLogoIcon",viewBox:"0 0 28 28",path:u.createElement(u.Fragment,null,u.createElement("path",{fill:"#1773EB",d:"M10.713 5.001c.845.843 1.167 2.079.845 3.228A6.663 6.663 0 0 1 15 7.276h.026a6.7 6.7 0 0 1 4.743 1.988 2.64 2.64 0 1 0 3.746-3.715A11.96 11.96 0 0 0 15.042 2h-.046a11.933 11.933 0 0 0-6.691 2.036h.074a3.287 3.287 0 0 1 2.334.967V5Z"}),u.createElement("path",{fill:"#E44F20",d:"M21.594 17.999a2.64 2.64 0 0 0-1.858.766 6.703 6.703 0 0 1-4.732 1.951h-.025a6.65 6.65 0 0 1-3.447-.968A3.3 3.3 0 0 1 8.35 23.93h-.086A11.926 11.926 0 0 0 14.96 26h.046a11.94 11.94 0 0 0 8.449-3.484 2.64 2.64 0 0 0-1.859-4.514V18h-.002Z"}),u.createElement("path",{fill:"#FFDA00",d:"M6.013 18.295a3.27 3.27 0 0 1 2.334-.967c.302 0 .603.04.894.122a6.7 6.7 0 0 1 .013-6.928A3.3 3.3 0 0 1 5.08 7.335v-.09a11.999 11.999 0 0 0-.032 13.453v-.07a3.27 3.27 0 0 1 .966-2.333Z"}),u.createElement("path",{fill:"#1773EB",d:"M8.379 4.62c-.75 0-1.276.312-1.913.949-.607.605-.798 1.135-.8 1.766A2.712 2.712 0 1 0 8.38 4.62Z"}),u.createElement("path",{fill:"#E44F20",d:"M5.628 20.631c0 .75.31 1.276.946 1.912.607.606 1.136.799 1.766.8a2.703 2.703 0 1 0-.017-5.407 2.703 2.703 0 0 0-2.695 2.704v-.009Z"}))});function ut(e,r){let J=e,{account:t,badge:a,bottomRightItems:i,children:n,className:s,contentMaxWidth:c="100%",help:l,logo:p,search:g,switcher:h,testId:x="cf-ui-navbar",topRightItems:I,variant:P="wide"}=J,F=f(J,["account","badge","bottomRightItems","children","className","contentMaxWidth","help","logo","search","switcher","testId","topRightItems","variant"]),O=Ge(c,P);return u.createElement(Box,d(m({},F),{ref:r,testId:x,className:s}),u.createElement(Flex,{className:O.containerTop},u.createElement(Flex,{className:O.containerTopContent,justifyContent:"space-between"},u.createElement(Flex,{alignItems:"center",gap:"spacingL"},p||u.createElement(er,{className:O.logo}),h),u.createElement(Flex,{alignItems:"center",gap:"spacingXs"},I,a,g,l,t))),u.createElement(Flex,{className:O.containerBottom},u.createElement(Flex,{className:O.containerBottomContent,justifyContent:"space-between"},u.createElement(Flex,{as:"nav","aria-label":"Main Navigation"},n),i&&u.createElement(Flex,null,i))))}var rr=u.forwardRef(ut);var bt={warning:o.colorWarning,negative:o.colorNegative,info:o.blue500},tr=()=>({navbarAccount:css({margin:0,padding:0,border:0,cursor:"pointer",background:"none",position:"relative",outline:"none",overflow:"visible",borderRadius:"50%","&:before":css({content:'""',display:"block",position:"absolute",height:"24px",width:"24px",backgroundColor:"transparent",borderRadius:"50%"}),"&:hover:before":css({backgroundColor:hexToRGBA(o.gray300,.15)})},S()),avatar:css({borderRadius:"50%",display:"block",height:"24px",width:"24px"}),notificationIcon:e=>css({position:"absolute",top:0,right:0,height:o.spacingS,width:o.spacingS,borderRadius:"50%",border:`2px solid ${o.gray100}`,backgroundColor:bt[e],transform:"translate(30%, -30%)"})});var or=()=>({menuList:css({minWidth:"250px"})});var $=e=>{let{trigger:r,children:t,testId:a="cf-ui-navbar-menu-list",onOpen:i,onClose:n}=e,s=or();return u.createElement(Menu,{onOpen:i,onClose:n},u.createElement(Menu.Trigger,null,r),u.createElement(Menu.List,{className:s.menuList,testId:a},t))};function Nt(e,r){let x=e,{children:t,className:a,testId:i="cf-ui-navbar-account-trigger",avatar:n,initials:s,username:c,hasNotification:l,notificationVariant:p="warning"}=x,g=f(x,["children","className","testId","avatar","initials","username","hasNotification","notificationVariant"]),h=tr();return u.createElement($,{trigger:u.createElement(Flex,d(m({as:"button"},g),{ref:r,className:cx(h.navbarAccount,a),testId:i,alignItems:"center"}),u.createElement(Avatar,{src:n,initials:s,size:"small",variant:"user"}),l?u.createElement("span",{className:h.notificationIcon(p)}):null)},t)}var ye=u.forwardRef(Nt);function Ne({ariaLabel:e}){return u.createElement(SkeletonContainer,{svgWidth:24,svgHeight:24,ariaLabel:e,backgroundColor:o.gray300,foregroundColor:o.gray200},u.createElement(SkeletonImage,{width:24,height:24,radiusX:12,radiusY:12}))}var ir=()=>css({"&::after":{content:'""',position:"absolute",width:`calc(100% - ${o.spacingM})`,height:"2px",bottom:`-${o.spacing2Xs}`,left:0,right:0,margin:"auto",backgroundColor:o.blue600,zIndex:0}}),sr={display:"flex",justifyContent:"center",padding:`${o.spacing2Xs} ${o.spacingS}`,alignItems:"center",background:"none"},lr=()=>({navbarItem:css(sr,{alignItems:"center",background:"none",border:0,margin:0,outline:"none",fontSize:o.fontSizeM,lineHeight:o.lineHeightS,fontWeight:o.fontWeightMedium,position:"relative",textAlign:"left",whiteSpace:"nowrap",cursor:"pointer",hyphens:"auto",textDecoration:"none",color:o.gray700,boxSizing:"border-box",transition:`color ${o.transitionDurationShort} ${o.transitionEasingCubicBezier}`,borderRadius:o.borderRadiusMedium,"&:hover":{backgroundColor:hexToRGBA(o.gray900,.05)},"&:hover::before":{opacity:1,scale:"1"},"&:active::before":{backgroundColor:"rgba(255, 255, 255, 0.1)"},"&:disabled":{cursor:"auto"},"& svg":{transition:`fill ${o.transitionDurationShort} ${o.transitionEasingCubicBezier}`},"& > svg, & > span":{zIndex:o.zIndexDefault}},S(`inset ${o.glowPrimary}`)),navbarItemMenuTrigger:css({paddingRight:o.spacingXs}),isActive:ir()}),pr=()=>({itemSkeleton:css(sr)});var cr=()=>({navbarItemIcon:css({fill:o.gray700,"&:first-child":{marginRight:o.spacing2Xs},"&:last-child":{marginLeft:o.spacing2Xs},"img&":{borderRadius:o.borderRadiusSmall,maxWidth:o.spacingM,maxHeight:o.spacingM}})});var te=e=>{var i,n;let{icon:r,variant:t}=e,a=cr();return u.cloneElement(r,{className:cx(r.props.className,a.navbarItemIcon),size:(i=r.props.size)!=null?i:"tiny",variant:(n=r.props.variant)!=null?n:t})};var At="button";function kt(e,r){let F=e,{as:t=At,icon:a,title:i,children:n,className:s,isActive:c,testId:l="cf-ui-navbar-item",onOpen:p,onClose:g}=F,h=f(F,["as","icon","title","children","className","isActive","testId","onOpen","onClose"]),x=lr(),I=Tt(e),P=u.createElement(t,d(m({},h),{ref:r,"data-test-id":l,className:cx(x.navbarItem,I&&x.navbarItemMenuTrigger,c&&x.isActive,s)}),a&&u.createElement(te,{icon:a,variant:"secondary"}),u.createElement("span",null,i),I&&u.createElement(Je,null));return I?u.createElement($,{trigger:P,testId:l,onOpen:p,onClose:g},n):P}var Tt=e=>!!e.children,Ie=u.forwardRef(kt);var Se=({estimatedWidth:e})=>{let r=pr();return u.createElement(SkeletonContainer,{className:r.itemSkeleton,svgWidth:e,svgHeight:32,backgroundColor:o.gray300,foregroundColor:o.gray200},u.createElement(SkeletonText,{lineHeight:6,numberOfLines:1,offsetTop:10,radiusX:o.borderRadiusSmall,radiusY:o.borderRadiusSmall}))};var dr=()=>({navbarMenuItem:css({display:"flex",justifyContent:"flex-start",alignItems:"center"})});var Dt="button";function _t(e,r){let p=e,{as:t=Dt,icon:a,title:i,className:n}=p,s=f(p,["as","icon","title","className"]),c=dr(),l=Wt(e);return u.createElement(Menu.Item,d(m({},s),{ref:r,as:t,className:cx(c.navbarMenuItem,n)}),a?u.createElement(te,{icon:a,variant:"secondary"}):l&&fr,u.createElement("span",null,i),a&&l?fr:null)}var fr=u.createElement(te,{icon:u.createElement(ExternalLinkIcon,null),variant:"muted"}),Wt=e=>e.as==="a"&&e.target==="_blank",we=u.forwardRef(_t);var Pe=({ariaLabel:e})=>u.createElement(Menu.Item,null,u.createElement(Flex,{alignItems:"center",gap:o.spacingXs},u.createElement(SkeletonContainer,{svgHeight:16,svgWidth:18},u.createElement(SkeletonImage,{width:16,height:16})),u.createElement(SkeletonContainer,{svgHeight:16,svgWidth:190,ariaLabel:e},u.createElement(SkeletonBodyText,{numberOfLines:1}))));var gr=()=>({navbarSwitcher:css({margin:0,padding:0,background:"none",border:"none",height:"max-content",color:o.gray700,cursor:"pointer",fontSize:o.fontSizeS,fontWeight:o.fontWeightMedium,position:"relative",outline:"none",borderRadius:"3rem","&:after":{content:'""',border:"1px solid #353A41",boxSizing:"border-box",height:"16px",right:"-1px",position:"absolute",width:0},"&:last-child:after":{display:"none"},"&:hover li":{backgroundColor:"#f2f4f6"}},S()),switcherMenuIcon:css({height:o.spacingM,width:o.spacingM,fill:o.gray700}),switcherBreadcrumbs:css({listStyleType:"none",margin:0,padding:0,position:"relative"})});function Ut(e,r){let c=e,{children:t,className:a,testId:i="cf-ui-navbar-switcher"}=c,n=f(c,["children","className","testId"]),s=gr();return u.createElement(Flex,d(m({},n),{as:"button",ref:r,className:cx(s.navbarSwitcher,a),testId:i,alignItems:"center",fullHeight:!0,gap:"spacingXs"}),u.createElement(Flex,{as:"ul",alignItems:"center",className:s.switcherBreadcrumbs},t))}var Ce=u.forwardRef(Ut);var Ae=({estimatedWidth:e})=>u.createElement(SkeletonContainer,{svgWidth:e,svgHeight:24,backgroundColor:o.gray300,foregroundColor:o.gray200},u.createElement(SkeletonDisplayText,{lineHeight:24,numberOfLines:1,radiusX:12,radiusY:12}));var Qt=Object.defineProperty,eo=Object.defineProperties,ro=Object.getOwnPropertyDescriptors,ce=Object.getOwnPropertySymbols,yr=Object.prototype.hasOwnProperty,Nr=Object.prototype.propertyIsEnumerable,xr=(e,r,t)=>r in e?Qt(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,to=(e,r)=>{for(var t in r||(r={}))yr.call(r,t)&&xr(e,t,r[t]);if(ce)for(var t of ce(r))Nr.call(r,t)&&xr(e,t,r[t]);return e},oo=(e,r)=>eo(e,ro(r)),ao=(e,r)=>{var t={};for(var a in e)yr.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&ce)for(var a of ce(e))r.indexOf(a)<0&&Nr.call(e,a)&&(t[a]=e[a]);return t},no={large:"36px",medium:"20px",small:"14px"},io=()=>{let e={scale1:keyframes`
13
13
  0% {
14
14
  transform: scale(1, 1);
15
15
  }
@@ -207,10 +207,10 @@ var Or=Object.defineProperty,Dr=Object.defineProperties;var _r=Object.getOwnProp
207
207
  100% {
208
208
  transform: translate(50px, 33.528168px);
209
209
  }
210
- `};return {root:r=>css({height:r.customSize?`${r.customSize}px`:void 0,verticalAlign:"middle",width:r.customSize?`${r.customSize}px`:Wt[r.size]}),circle1Scale:css({animation:`${e.scale1} 1s linear infinite normal forwards;`}),circle2Scale:css({animation:`${e.scale2} 1s linear infinite normal forwards;`}),circle3Scale:css({animation:`${e.scale3} 1s linear infinite normal forwards;`}),circle1Translate:css({animation:`${e.translate1} 1s linear infinite normal forwards;`}),circle2Translate:css({animation:`${e.translate2} 1s linear infinite normal forwards;`}),circle3Translate:css({animation:`${e.translate3} 1s linear infinite normal forwards;`})}},$t="div",Xt={default:o.gray700,primary:o.blue500,white:o.colorWhite},we=forwardRef((e,r)=>{var t=e,{className:a,customSize:i,size:n="medium",variant:s="default",testId:c="cf-ui-spinner"}=t,l=_t(t,["className","customSize","size","variant","testId"]);let p=Ft();return u.createElement(Box,Dt(Ot({as:$t,display:"inline-block"},l),{className:cx(p.root({size:n,customSize:i}),a),ref:r,testId:c}),u.createElement("svg",{className:css({display:"block",fill:Xt[s]}),viewBox:"0 0 60 51",xmlns:"http://www.w3.org/2000/svg"},u.createElement("title",null,"Loading\u2026"),u.createElement("g",{className:p.circle1Translate,transform:"translate(10,33.528168)"},u.createElement("g",{className:p.circle1Scale},u.createElement("circle",{r:"6",transform:"translate(0,10.471832)"}))),u.createElement("g",{className:p.circle2Translate,transform:"translate(30,33.528168)"},u.createElement("g",{className:p.circle2Scale},u.createElement("circle",{r:"6",transform:"translate(0,10.471832)"}))),u.createElement("g",{className:p.circle3Translate,transform:"translate(50,33.528168)"},u.createElement("g",{className:p.circle3Scale},u.createElement("circle",{r:"6",transform:"translate(0,10.471832)"})))))});we.displayName="Spinner";var jt=Object.defineProperty,Ut=Object.defineProperties,Zt=Object.getOwnPropertyDescriptors,ie=Object.getOwnPropertySymbols,fr=Object.prototype.hasOwnProperty,ur=Object.prototype.propertyIsEnumerable,mr=(e,r,t)=>r in e?jt(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,y=(e,r)=>{for(var t in r||(r={}))fr.call(r,t)&&mr(e,t,r[t]);if(ie)for(var t of ie(r))ur.call(r,t)&&mr(e,t,r[t]);return e},Me=(e,r)=>Ut(e,Zt(r)),Ce=(e,r)=>{var t={};for(var a in e)fr.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&ie)for(var a of ie(e))r.indexOf(a)<0&&ur.call(e,a)&&(t[a]=e[a]);return t},qt=({withDivider:e})=>{let r=Yt(e);return {buttonGroup:css({display:"inline-flex",position:"relative"}),groupContent:css(y({borderRadius:"0 !important",marginRight:"-1px","&:first-child":{borderBottomLeftRadius:`${o.borderRadiusMedium} !important`,borderTopLeftRadius:`${o.borderRadiusMedium} !important`},"&:last-child":{borderBottomRightRadius:`${o.borderRadiusMedium} !important`,borderTopRightRadius:`${o.borderRadiusMedium} !important`,marginRight:0},"&:focus":{zIndex:o.zIndexDefault}},r))}},Yt=e=>{if(!e)return {};let r=`1px solid ${hexToRGBA(o.colorWhite,.2)}`;return {borderTop:"none",borderBottom:"none","&:not(:first-child,:focus-visible)":{borderLeft:r},"&:not(:last-child,:focus-visible)":{borderRight:r}}};function gr(e,r){let{variant:t="merged",withDivider:a,testId:i="cf-ui-button-group",children:n,className:s,spacing:c}=e,l=qt({withDivider:a});return t==="spaced"?u.createElement(Stack,{className:s,isInline:!0,flexDirection:"row",testId:i,ref:r,spacing:c},n):u.createElement(Box,{testId:i,ref:r,className:cx(l.buttonGroup,s)},u.Children.map(n,(p,v)=>p?u.cloneElement(p,{key:v,className:cx(l.groupContent,p.props.className)}):null))}gr.displayName="ButtonGroup";u.forwardRef(gr);var j=e=>{switch(e){case"primary":return {backgroundColor:o.blue700};case"secondary":return {backgroundColor:o.gray200};case"positive":return {backgroundColor:o.green700};case"negative":return {backgroundColor:o.gray200};case"transparent":return {backgroundColor:hexToRGBA(o.gray900,.1)};default:return {}}},Jt=e=>{switch(e){case"primary":return {color:o.colorWhite,backgroundColor:o.blue500,borderColor:"transparent","&:hover":{backgroundColor:o.blue600,color:o.colorWhite},"&:active":j(e),"&:focus-visible":{boxShadow:o.glowPrimary}};case"secondary":return {color:o.gray900,backgroundColor:o.colorWhite,borderColor:o.gray300,"&:hover":{backgroundColor:o.gray100,color:o.gray900},"&:active":j(e),"&:focus":{boxShadow:o.glowPrimary},"&:focus:not(:focus-visible)":{boxShadow:"unset"},"&:focus-visible":{boxShadow:o.glowPrimary}};case"positive":return {color:o.colorWhite,backgroundColor:o.green500,borderColor:"transparent","&:hover":{backgroundColor:o.green600,color:o.colorWhite},"&:active":j(e),"&:focus-visible":{boxShadow:o.glowPositive}};case"negative":return {color:o.red600,backgroundColor:o.colorWhite,borderColor:o.gray300,"&:hover":{backgroundColor:o.gray100,color:o.red600},"&:active":j(e),"&:focus-visible":{boxShadow:o.glowNegative}};case"transparent":return {color:o.gray900,background:"none",borderColor:"transparent",boxShadow:"none","&:hover":{backgroundColor:hexToRGBA(o.gray900,.05)},"&:active":j(e),"&:focus":{boxShadow:o.glowPrimary},"&:focus:not(:focus-visible)":{boxShadow:"unset"},"&:focus-visible":{boxShadow:o.glowPrimary}};default:return {}}},Kt=(e,r)=>{let t=r==="high";switch(e){case"small":return {fontSize:t?o.fontSizeS:o.fontSizeM,lineHeight:o.lineHeightCondensed,padding:t?`${o.spacing2Xs} ${o.spacingXs}`:`${o.spacing2Xs} ${o.spacingS}`,minHeight:t?o.spacingL:o.spacingXl};case"medium":return {fontSize:t?o.fontSizeS:o.fontSizeM,lineHeight:o.lineHeightCondensed,padding:t?`${o.spacingXs} ${o.spacingS}`:`${o.spacingXs} ${o.spacingM}`,minHeight:t?o.spacingXl:"40px"};case"large":return {fontSize:o.fontSizeXl,lineHeight:o.lineHeightXl,padding:`${o.spacingXs} ${o.spacingM}`,minHeight:"48px"};default:return {}}},Qt=({hasChildren:e,variant:r})=>{let t={"&:first-child":{marginRight:o.spacing2Xs},"&:last-child":{marginLeft:o.spacing2Xs}};return css([e?t:{},r!=="transparent"&&e&&{"& svg":{fill:"currentColor"}}])},eo=()=>({button:({variant:e,size:r,density:t,isActive:a,isDisabled:i,isFullWidth:n})=>css(y(y(y({boxSizing:"border-box",border:"1px solid",boxShadow:"0px 1px 0px rgb(25, 37, 50, 0.08)",borderRadius:t==="high"?o.borderRadiusSmall:o.borderRadiusMedium,cursor:i?"not-allowed":"pointer",fontFamily:o.fontStackPrimary,opacity:i?.5:1,display:n?"flex":"inline-flex",minWidth:n?"100%":"auto",maxWidth:n?"100%":"240px",overflow:"hidden",flexShrink:0,justifyContent:"center",alignItems:"center",fontWeight:o.fontWeightMedium,outline:"none",textDecoration:"none",margin:0,transition:`background ${o.transitionDurationShort} ${o.transitionEasingDefault},
210
+ `};return {root:r=>css({height:r.customSize?`${r.customSize}px`:void 0,verticalAlign:"middle",width:r.customSize?`${r.customSize}px`:no[r.size]}),circle1Scale:css({animation:`${e.scale1} 1s linear infinite normal forwards;`}),circle2Scale:css({animation:`${e.scale2} 1s linear infinite normal forwards;`}),circle3Scale:css({animation:`${e.scale3} 1s linear infinite normal forwards;`}),circle1Translate:css({animation:`${e.translate1} 1s linear infinite normal forwards;`}),circle2Translate:css({animation:`${e.translate2} 1s linear infinite normal forwards;`}),circle3Translate:css({animation:`${e.translate3} 1s linear infinite normal forwards;`})}},so="div",lo={default:o.gray700,primary:o.blue500,white:o.colorWhite},Te=forwardRef((e,r)=>{var t=e,{className:a,customSize:i,size:n="medium",variant:s="default",testId:c="cf-ui-spinner"}=t,l=ao(t,["className","customSize","size","variant","testId"]);let p=io();return u.createElement(Box,oo(to({as:so,display:"inline-block"},l),{className:cx(p.root({size:n,customSize:i}),a),ref:r,testId:c}),u.createElement("svg",{className:css({display:"block",fill:lo[s]}),viewBox:"0 0 60 51",xmlns:"http://www.w3.org/2000/svg"},u.createElement("title",null,"Loading\u2026"),u.createElement("g",{className:p.circle1Translate,transform:"translate(10,33.528168)"},u.createElement("g",{className:p.circle1Scale},u.createElement("circle",{r:"6",transform:"translate(0,10.471832)"}))),u.createElement("g",{className:p.circle2Translate,transform:"translate(30,33.528168)"},u.createElement("g",{className:p.circle2Scale},u.createElement("circle",{r:"6",transform:"translate(0,10.471832)"}))),u.createElement("g",{className:p.circle3Translate,transform:"translate(50,33.528168)"},u.createElement("g",{className:p.circle3Scale},u.createElement("circle",{r:"6",transform:"translate(0,10.471832)"})))))});Te.displayName="Spinner";var mo=Object.defineProperty,fo=Object.defineProperties,uo=Object.getOwnPropertyDescriptors,me=Object.getOwnPropertySymbols,wr=Object.prototype.hasOwnProperty,Pr=Object.prototype.propertyIsEnumerable,Ir=(e,r,t)=>r in e?mo(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,N=(e,r)=>{for(var t in r||(r={}))wr.call(r,t)&&Ir(e,t,r[t]);if(me)for(var t of me(r))Pr.call(r,t)&&Ir(e,t,r[t]);return e},Be=(e,r)=>fo(e,uo(r)),Oe=(e,r)=>{var t={};for(var a in e)wr.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&me)for(var a of me(e))r.indexOf(a)<0&&Pr.call(e,a)&&(t[a]=e[a]);return t},go=({withDivider:e})=>{let r=bo(e);return {buttonGroup:css({display:"inline-flex",position:"relative"}),groupContent:css(N({borderRadius:"0 !important",marginRight:"-1px","&:first-child":{borderBottomLeftRadius:`${o.borderRadiusMedium} !important`,borderTopLeftRadius:`${o.borderRadiusMedium} !important`},"&:last-child":{borderBottomRightRadius:`${o.borderRadiusMedium} !important`,borderTopRightRadius:`${o.borderRadiusMedium} !important`,marginRight:0},"&:focus":{zIndex:o.zIndexDefault}},r))}},bo=e=>{if(!e)return {};let r=`1px solid ${hexToRGBA(o.colorWhite,.2)}`;return {borderTop:"none",borderBottom:"none","&:not(:first-child,:focus-visible)":{borderLeft:r},"&:not(:last-child,:focus-visible)":{borderRight:r}}};function Er(e,r){let{variant:t="merged",withDivider:a,testId:i="cf-ui-button-group",children:n,className:s,spacing:c}=e,l=go({withDivider:a});return t==="spaced"?u.createElement(Stack,{className:s,isInline:!0,flexDirection:"row",testId:i,ref:r,spacing:c},n):u.createElement(Box,{testId:i,ref:r,className:cx(l.buttonGroup,s)},u.Children.map(n,(p,g)=>p?u.cloneElement(p,{key:g,className:cx(l.groupContent,p.props.className)}):null))}Er.displayName="ButtonGroup";u.forwardRef(Er);var q=e=>{switch(e){case"primary":return {backgroundColor:o.blue700};case"secondary":return {backgroundColor:o.gray200};case"positive":return {backgroundColor:o.green700};case"negative":return {backgroundColor:o.gray200};case"transparent":return {backgroundColor:hexToRGBA(o.gray900,.1)};default:return {}}},vo=e=>{switch(e){case"primary":return {color:o.colorWhite,backgroundColor:o.blue500,borderColor:"transparent","&:hover":{backgroundColor:o.blue600,color:o.colorWhite},"&:active":q(e),"&:focus-visible":{boxShadow:o.glowPrimary}};case"secondary":return {color:o.gray900,backgroundColor:o.colorWhite,borderColor:o.gray300,"&:hover":{backgroundColor:o.gray100,color:o.gray900},"&:active":q(e),"&:focus":{boxShadow:o.glowPrimary},"&:focus:not(:focus-visible)":{boxShadow:"unset"},"&:focus-visible":{boxShadow:o.glowPrimary}};case"positive":return {color:o.colorWhite,backgroundColor:o.green500,borderColor:"transparent","&:hover":{backgroundColor:o.green600,color:o.colorWhite},"&:active":q(e),"&:focus-visible":{boxShadow:o.glowPositive}};case"negative":return {color:o.red600,backgroundColor:o.colorWhite,borderColor:o.gray300,"&:hover":{backgroundColor:o.gray100,color:o.red600},"&:active":q(e),"&:focus-visible":{boxShadow:o.glowNegative}};case"transparent":return {color:o.gray900,background:"none",borderColor:"transparent",boxShadow:"none","&:hover":{backgroundColor:hexToRGBA(o.gray900,.05)},"&:active":q(e),"&:focus":{boxShadow:o.glowPrimary},"&:focus:not(:focus-visible)":{boxShadow:"unset"},"&:focus-visible":{boxShadow:o.glowPrimary}};default:return {}}},ho=(e,r)=>{let t=r==="high";switch(e){case"small":return {fontSize:t?o.fontSizeS:o.fontSizeM,lineHeight:o.lineHeightCondensed,padding:t?`${o.spacing2Xs} ${o.spacingXs}`:`${o.spacing2Xs} ${o.spacingS}`,minHeight:t?o.spacingL:o.spacingXl};case"medium":return {fontSize:t?o.fontSizeS:o.fontSizeM,lineHeight:o.lineHeightCondensed,padding:t?`${o.spacingXs} ${o.spacingS}`:`${o.spacingXs} ${o.spacingM}`,minHeight:t?o.spacingXl:"40px"};case"large":return {fontSize:o.fontSizeXl,lineHeight:o.lineHeightXl,padding:`${o.spacingXs} ${o.spacingM}`,minHeight:"48px"};default:return {}}},xo=({hasChildren:e,variant:r})=>{let t={"&:first-child":{marginRight:o.spacing2Xs},"&:last-child":{marginLeft:o.spacing2Xs}};return css([e?t:{},r!=="transparent"&&e&&{"& svg":{fill:"currentColor"}}])},yo=()=>({button:({variant:e,size:r,density:t,isActive:a,isDisabled:i,isFullWidth:n})=>css(N(N(N({boxSizing:"border-box",border:"1px solid",boxShadow:"0px 1px 0px rgb(25, 37, 50, 0.08)",borderRadius:t==="high"?o.borderRadiusSmall:o.borderRadiusMedium,cursor:i?"not-allowed":"pointer",fontFamily:o.fontStackPrimary,opacity:i?.5:1,display:n?"flex":"inline-flex",minWidth:n?"100%":"auto",maxWidth:n?"100%":"240px",overflow:"hidden",flexShrink:0,justifyContent:"center",alignItems:"center",fontWeight:o.fontWeightMedium,outline:"none",textDecoration:"none",margin:0,transition:`background ${o.transitionDurationShort} ${o.transitionEasingDefault},
211
211
  opacity ${o.transitionDurationDefault} ${o.transitionEasingDefault},
212
- border-color ${o.transitionDurationDefault} ${o.transitionEasingDefault}`},Jt(e)),Kt(r,t)),a?{transition:"none","&, &:focus":j(e)}:{})),buttonIcon:Qt,buttonContent:css({whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"})}),ro="button";function br(e,r){let t=eo(),a=e,{as:i=ro,children:n,className:s,testId:c="cf-ui-button",variant:l="secondary",size:p="medium",startIcon:v,endIcon:x,isActive:N,isDisabled:w,isLoading:E,isFullWidth:D,style:R}=a,Z=Ce(a,["as","children","className","testId","variant","size","startIcon","endIcon","isActive","isDisabled","isLoading","isFullWidth","style"]),zr=useDensity(),Lr=cx(t.button({variant:l,size:p,density:zr,isActive:N,isDisabled:w,isFullWidth:D}),s),Te=me=>{var ze;let Hr={primary:"white",secondary:"secondary",positive:"white",negative:"negative",transparent:"secondary"};return !E&&u.createElement(Flex,{as:"span",className:t.buttonIcon({hasChildren:!!n,variant:l})},u.cloneElement(me,{size:(ze=me.props.size)!=null?ze:`${p==="large"?"medium":"small"}`,variant:l==="transparent"&&me.props.variant||Hr[l]}))},Re=u.createElement(u.Fragment,null,v&&Te(v),n&&u.createElement(Box,{as:"span",display:"block",className:t.buttonContent},n),x&&Te(x),E&&u.createElement(Box,{as:"span",marginLeft:n||!E?"spacingXs":"none"},u.createElement(we,{customSize:18,variant:l==="secondary"||l==="negative"||l==="transparent"?"default":"white"}))),Be={"data-test-id":c,className:Lr,ref:r,style:R};return i==="a"?u.createElement("a",Me(y(y({},Z),Be),{disabled:w}),Re):u.createElement("button",Me(y(y({type:"button"},Z),Be),{disabled:w}),Re)}br.displayName="Button";var se=u.forwardRef(br),to=({isActive:e,isDisabled:r})=>{let t={background:o.blue100,borderColor:o.blue600,"&":{zIndex:o.zIndexDefault+1},"&:hover":{background:o.blue100}},a={"&:focus":{boxShadow:o.glowPrimary},"&:focus-visible:not([disabled])":{zIndex:o.zIndexDefault+2},"&:active, &:active:hover":r?{background:o.colorWhite,borderColor:o.gray300}:{background:o.blue100,borderColor:o.blue600}};return e?y(y({},a),t):a},oo=({isActive:e,isDisabled:r})=>({toggleButton:css(to({isActive:e,isDisabled:r}))});function vr(e,r){let t=e,{testId:a="cf-ui-toggle-button",children:i,className:n,isDisabled:s=!1,isActive:c=!1,icon:l,onToggle:p,size:v="medium"}=t,x=Ce(t,["testId","children","className","isDisabled","isActive","icon","onToggle","size"]),N=oo({isActive:c,isDisabled:s});return u.createElement(se,y({testId:a,type:"button",ref:r,size:v,onClick:()=>{!s&&p&&p();},className:cx(N.toggleButton,n),startIcon:l,isDisabled:s,"aria-pressed":c,"data-state":c?"on":"off"},x),i)}vr.displayName="ToggleButton";u.forwardRef(vr);function ao(e,r){let t=r==="high";switch(e){case"small":return {padding:t?`${o.spacing2Xs}`:o.spacing2Xs,minHeight:t?o.spacingL:o.spacingXl,minWidth:t?o.spacingL:o.spacingXl};case"medium":return {padding:o.spacingXs,minHeight:t?o.spacingXl:"40px",minWidth:t?o.spacingXl:"40px"};default:return {}}}function no({size:e,density:r}){return {iconButton:css(y({},ao(e,r)))}}function hr(e,r){let t=e,{testId:a="cf-ui-icon-button",variant:i="transparent",icon:n,className:s,size:c="medium"}=t,l=Ce(t,["testId","variant","icon","className","size"]),p=useDensity(),v=no({size:c,density:p});return u.createElement(se,Me(y({testId:a,ref:r,variant:i,className:cx(v.iconButton,s),size:c},l),{startIcon:n}))}hr.displayName="IconButton";var xr=u.forwardRef(hr);var yr=()=>({navbarSearch:css({minWidth:"24px",width:"24px",minHeight:"24px",height:"24px",svg:{fill:o.gray700}},I())});function po(e,r){let s=e,{className:t,testId:a="cf-ui-navbar-search"}=s,i=f(s,["className","testId"]),n=yr();return u.createElement(xr,d(m({"aria-label":"Quick Search"},i),{variant:"transparent",ref:r,size:"small",className:cx(n.navbarSearch,t),testId:a,icon:u.createElement($e,{size:"medium"})}))}var Nr=u.forwardRef(po);var Ir={display:"none","&:first-child":{display:"block"},[M.medium]:{display:"block","&:first-child":{display:"none"}}},Sr=()=>({breadcrumbsItem:css({position:"relative",alignItems:"center",justifyContent:"center",border:`solid 1px ${o.gray300}`,borderLeft:"none",display:"inline-flex",margin:0,minWidth:0,padding:`0 ${o.spacingXs}`,height:o.spacingL,borderRadius:"3rem",zIndex:2,whiteSpace:"nowrap","&:first-child":{minWidth:"24px"},"&:nth-child(2)":{zIndex:1,marginLeft:"-10px",paddingLeft:o.spacingM,borderRadius:"0 3rem 3rem 0",span:{maxWidth:"80px",textOverflow:"ellipsis",overflow:"hidden",[M.large]:{maxWidth:"100%"}}},"&:nth-child(3)":{marginLeft:"-10px",paddingLeft:o.spacingM,borderRadius:"0 3rem 3rem 0",fontFamily:o.fontStackMonospace,fontSize:o.fontSizeS,fontWeight:o.fontWeightMedium,zIndex:0,span:{maxWidth:"40px",textOverflow:"ellipsis",overflow:"hidden",[M.large]:{maxWidth:"100%"}},"> div":{[M.medium]:{gap:o.spacing2Xs}}}}),breadcrumbsItemCircle:css({border:`solid 1px ${o.gray300}`,borderRadius:"50%",color:o.gray400,padding:0,display:"flex",justifyContent:"center",fontSize:"11px",width:o.spacingL,height:o.spacingL}),breadcrumbsItemEnvMaster:css({color:o.green600," svg":d(m({},Ir),{fill:o.green600})}),breadcrumbsItemEnvNonMaster:css({color:o.orange500,svg:d(m({},Ir),{fill:o.orange500})})});function Pr({isAlias:e}){return u.createElement(u.Fragment,null,u.createElement(_e,{key:"mobile-icon",size:"tiny"}),e?u.createElement(EnvironmentAliasIcon,{key:"full-icon",size:"tiny"}):u.createElement(EnvironmentIcon,{key:"full-icon",size:"tiny"}))}function go(e,r){let x=e,{children:t,isCircle:a,className:i,envVariant:n,isAlias:s,testId:c="cf-ui-navbar-switcher-item"}=x,l=f(x,["children","isCircle","className","envVariant","isAlias","testId"]),p=Sr(),v=cx(p.breadcrumbsItem,i,{[p.breadcrumbsItemCircle]:a,[p.breadcrumbsItemEnvMaster]:n==="master",[p.breadcrumbsItemEnvNonMaster]:n==="non-master"});return u.createElement("li",d(m({},l),{ref:r,className:v,"data-test-id":c}),u.createElement(Flex,{fullHeight:!0,justifyContent:"center",alignItems:"center"},n&&u.createElement(Pr,{isAlias:s}),u.createElement("span",null,t)))}var wr=u.forwardRef(go);var Er=()=>({navbarHelp:css({fontSize:o.fontSizeS,padding:`0 ${o.spacing2Xs}`,width:"max-content",minHeight:"24px",height:"24px",color:o.gray700,svg:{fill:o.gray700}},I())});function ho(e,r){let c=e,{children:t,className:a,testId:i="cf-ui-navbar-help-trigger"}=c,n=f(c,["children","className","testId"]),s=Er();return u.createElement(_,{testId:"cf-ui-navbar-help-menu",trigger:u.createElement(se,d(m({"aria-label":"Help Menu"},n),{as:"button",ref:r,className:cx(s.navbarHelp,a),testId:i,variant:"transparent",size:"small",startIcon:u.createElement(Fe,{size:"medium"})}),"Help")},t)}var Mr=u.forwardRef(ho);var Ar=()=>({navbarBadge:css({display:"flex",justifyContent:"center",alignItems:"center",background:"none",border:`1px solid ${o.purple600}`,margin:0,outline:"none",fontSize:o.fontSizeS,lineHeight:o.lineHeightS,fontWeight:o.fontWeightMedium,textAlign:"center",padding:`0 ${o.spacingXs}`,textDecoration:"none",color:`${o.purple600}!important`,borderRadius:"1.75rem"})});var No="div";function Io(e,r){let l=e,{as:t=No,children:a,className:i,testId:n="cf-ui-navbar-badge"}=l,s=f(l,["as","children","className","testId"]),c=Ar();return u.createElement(t,d(m({},s),{ref:r,className:cx(c.navbarBadge,i),"data-test-id":n}),a)}var kr=u.forwardRef(Io);var Tr=()=>({navbarTopItem:css({margin:0,background:"none",border:"1px solid",borderColor:"transparent",cursor:"pointer",display:"flex",gap:o.spacing2Xs,alignItems:"center",lineHeight:o.lineHeightDefault,color:o.gray700,padding:`0 ${o.spacing2Xs}`,minHeight:"24px",fontSize:o.fontSizeS,fontWeight:o.fontWeightMedium,outline:"none",borderRadius:o.borderRadiusMedium,"&:hover":{backgroundColor:hexToRGBA(o.gray900,.05)},svg:{fill:"currentColor"}},I())});var Eo="button";function Mo(e,r){let l=e,{as:t=Eo,children:a,className:i,testId:n="cf-ui-navbar-topbar-item"}=l,s=f(l,["as","children","className","testId"]),c=Tr();return u.createElement(t,d(m({},s),{ref:r,className:cx(c.navbarTopItem,i),"data-test-id":n}),a)}var Br=u.forwardRef(Mo);var h=Ge;h.Item=be;h.ItemSkeleton=ve;h.MenuItem=he;h.MenuItemSkeleton=xe;h.MenuDivider=MenuDivider;h.MenuSectionTitle=MenuSectionTitle;h.Switcher=Ie;h.SwitcherSkeleton=Se;h.SwitcherItem=wr;h.Search=Nr;h.Help=Mr;h.Account=ue;h.AccountSkeleton=ge;h.Badge=kr;h.TopbarItem=Br;
212
+ border-color ${o.transitionDurationDefault} ${o.transitionEasingDefault}`},vo(e)),ho(r,t)),a?{transition:"none","&, &:focus":q(e)}:{})),buttonIcon:xo,buttonContent:css({whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"})}),No="button";function Mr(e,r){let t=yo(),a=e,{as:i=No,children:n,className:s,testId:c="cf-ui-button",variant:l="secondary",size:p="medium",startIcon:g,endIcon:h,isActive:x,isDisabled:I,isLoading:P,isFullWidth:F,style:O}=a,J=Oe(a,["as","children","className","testId","variant","size","startIcon","endIcon","isActive","isDisabled","isLoading","isFullWidth","style"]),jr=useDensity(),Vr=cx(t.button({variant:l,size:p,density:jr,isActive:x,isDisabled:I,isFullWidth:F}),s),He=K=>{var We;let Ur={primary:"white",secondary:"secondary",positive:"white",negative:"negative",transparent:"secondary"};return !P&&u.createElement(Flex,{as:"span",className:t.buttonIcon({hasChildren:!!n,variant:l})},u.cloneElement(K,{size:(We=K.props.size)!=null?We:`${p==="large"?"medium":"small"}`,color:l==="transparent"&&K.props.variant===void 0&&K.props.color||"currentColor",variant:l==="transparent"&&K.props.variant||Ur[l]}))},De=u.createElement(u.Fragment,null,g&&He(g),n&&u.createElement(Box,{as:"span",display:"block",className:t.buttonContent},n),h&&He(h),P&&u.createElement(Box,{as:"span",marginLeft:n||!P?"spacingXs":"none"},u.createElement(Te,{customSize:18,variant:l==="secondary"||l==="negative"||l==="transparent"?"default":"white"}))),_e={"data-test-id":c,className:Vr,ref:r,style:O};return i==="a"?u.createElement("a",Be(N(N({},J),_e),{disabled:I}),De):u.createElement("button",Be(N(N({type:"button"},J),_e),{disabled:I}),De)}Mr.displayName="Button";var de=u.forwardRef(Mr),Io=({isActive:e,isDisabled:r})=>{let t={background:o.blue100,borderColor:o.blue600,"&":{zIndex:o.zIndexDefault+1},"&:hover":{background:o.blue100}},a={"&:focus":{boxShadow:o.glowPrimary},"&:focus-visible:not([disabled])":{zIndex:o.zIndexDefault+2},"&:active, &:active:hover":r?{background:o.colorWhite,borderColor:o.gray300}:{background:o.blue100,borderColor:o.blue600}};return e?N(N({},a),t):a},So=({isActive:e,isDisabled:r})=>({toggleButton:css(Io({isActive:e,isDisabled:r}))});function Cr(e,r){let t=e,{testId:a="cf-ui-toggle-button",children:i,className:n,isDisabled:s=!1,isActive:c=!1,icon:l,onToggle:p,size:g="medium"}=t,h=Oe(t,["testId","children","className","isDisabled","isActive","icon","onToggle","size"]),x=So({isActive:c,isDisabled:s});return u.createElement(de,N({testId:a,type:"button",ref:r,size:g,onClick:()=>{!s&&p&&p();},className:cx(x.toggleButton,n),startIcon:l,isDisabled:s,"aria-pressed":c,"data-state":c?"on":"off"},h),i)}Cr.displayName="ToggleButton";u.forwardRef(Cr);function wo(e,r){let t=r==="high";switch(e){case"small":return {padding:t?`${o.spacing2Xs}`:o.spacing2Xs,minHeight:t?o.spacingL:o.spacingXl,minWidth:t?o.spacingL:o.spacingXl};case"medium":return {padding:o.spacingXs,minHeight:t?o.spacingXl:"40px",minWidth:t?o.spacingXl:"40px"};default:return {}}}function Po({size:e,density:r}){return {iconButton:css(N({},wo(e,r)))}}function Ar(e,r){let t=e,{testId:a="cf-ui-icon-button",variant:i="transparent",icon:n,className:s,size:c="medium"}=t,l=Oe(t,["testId","variant","icon","className","size"]),p=useDensity(),g=Po({size:c,density:p});return u.createElement(de,Be(N({testId:a,ref:r,variant:i,className:cx(g.iconButton,s),size:c},l),{startIcon:n}))}Ar.displayName="IconButton";var kr=u.forwardRef(Ar);var Tr=()=>({navbarSearch:css({minWidth:"24px",width:"24px",minHeight:"24px",height:"24px",svg:{fill:o.gray700}},S())});function Ao(e,r){let s=e,{className:t,testId:a="cf-ui-navbar-search"}=s,i=f(s,["className","testId"]),n=Tr();return u.createElement(kr,d(m({"aria-label":"Quick Search"},i),{variant:"transparent",ref:r,size:"small",className:cx(n.navbarSearch,t),testId:a,icon:u.createElement(Qe,{size:"medium"})}))}var Rr=u.forwardRef(Ao);var Br={display:"none","&:first-child":{display:"block"},[M.medium]:{display:"block","&:first-child":{display:"none"}}},zr=()=>({breadcrumbsItem:css({position:"relative",alignItems:"center",justifyContent:"center",border:`solid 1px ${o.gray300}`,borderLeft:"none",display:"inline-flex",margin:0,minWidth:0,padding:`0 ${o.spacingXs}`,height:o.spacingL,borderRadius:"3rem",zIndex:2,whiteSpace:"nowrap","&:first-child":{minWidth:"24px"},"&:nth-child(2)":{zIndex:1,marginLeft:"-10px",paddingLeft:o.spacingM,borderRadius:"0 3rem 3rem 0",span:{maxWidth:"80px",textOverflow:"ellipsis",overflow:"hidden",[M.large]:{maxWidth:"100%"}}},"&:nth-child(3)":{marginLeft:"-10px",paddingLeft:o.spacingM,borderRadius:"0 3rem 3rem 0",fontFamily:o.fontStackMonospace,fontSize:o.fontSizeS,fontWeight:o.fontWeightMedium,zIndex:0,span:{maxWidth:"40px",textOverflow:"ellipsis",overflow:"hidden",[M.large]:{maxWidth:"100%"}},"> div":{[M.medium]:{gap:o.spacing2Xs}}}}),breadcrumbsItemCircle:css({border:`solid 1px ${o.gray300}`,borderRadius:"50%",color:o.gray400,padding:0,display:"flex",justifyContent:"center",fontSize:"11px",width:o.spacingL,height:o.spacingL}),breadcrumbsItemEnvMaster:css({color:o.green600," svg":d(m({},Br),{fill:o.green600})}),breadcrumbsItemEnvNonMaster:css({color:o.orange500,svg:d(m({},Br),{fill:o.orange500})})});function Or({isAlias:e}){return u.createElement(u.Fragment,null,u.createElement(Ye,{key:"mobile-icon",size:"tiny"}),e?u.createElement(EnvironmentAliasIcon,{key:"full-icon",size:"tiny"}):u.createElement(EnvironmentIcon,{key:"full-icon",size:"tiny"}))}function zo(e,r){let h=e,{children:t,isCircle:a,className:i,envVariant:n,isAlias:s,testId:c="cf-ui-navbar-switcher-item"}=h,l=f(h,["children","isCircle","className","envVariant","isAlias","testId"]),p=zr(),g=cx(p.breadcrumbsItem,i,{[p.breadcrumbsItemCircle]:a,[p.breadcrumbsItemEnvMaster]:n==="master",[p.breadcrumbsItemEnvNonMaster]:n==="non-master"});return u.createElement("li",d(m({},l),{ref:r,className:g,"data-test-id":c}),u.createElement(Flex,{fullHeight:!0,justifyContent:"center",alignItems:"center"},n&&u.createElement(Or,{isAlias:s}),u.createElement("span",null,t)))}var Lr=u.forwardRef(zo);var Hr=()=>({navbarHelp:css({fontSize:o.fontSizeS,padding:`0 ${o.spacing2Xs}`,width:"max-content",minHeight:"24px",height:"24px",color:o.gray700,svg:{fill:o.gray700}},S())});function Ho(e,r){let c=e,{children:t,className:a,testId:i="cf-ui-navbar-help-trigger"}=c,n=f(c,["children","className","testId"]),s=Hr();return u.createElement($,{testId:"cf-ui-navbar-help-menu",trigger:u.createElement(de,d(m({"aria-label":"Help Menu"},n),{as:"button",ref:r,className:cx(s.navbarHelp,a),testId:i,variant:"transparent",size:"small",startIcon:u.createElement(Ke,{size:"medium"})}),"Help")},t)}var Dr=u.forwardRef(Ho);var _r=()=>({navbarBadge:css({display:"flex",justifyContent:"center",alignItems:"center",background:"none",border:`1px solid ${o.purple600}`,margin:0,outline:"none",fontSize:o.fontSizeS,lineHeight:o.lineHeightS,fontWeight:o.fontWeightMedium,textAlign:"center",padding:`0 ${o.spacingXs}`,textDecoration:"none",color:`${o.purple600}!important`,borderRadius:"1.75rem"})});var Wo="div";function Fo(e,r){let l=e,{as:t=Wo,children:a,className:i,testId:n="cf-ui-navbar-badge"}=l,s=f(l,["as","children","className","testId"]),c=_r();return u.createElement(t,d(m({},s),{ref:r,className:cx(c.navbarBadge,i),"data-test-id":n}),a)}var Fr=u.forwardRef(Fo);var $r=()=>({navbarTopItem:css({margin:0,background:"none",border:"1px solid",borderColor:"transparent",cursor:"pointer",display:"flex",gap:o.spacing2Xs,alignItems:"center",lineHeight:o.lineHeightDefault,color:o.gray700,padding:`0 ${o.spacing2Xs}`,minHeight:"24px",fontSize:o.fontSizeS,fontWeight:o.fontWeightMedium,outline:"none",borderRadius:o.borderRadiusMedium,"&:hover":{backgroundColor:hexToRGBA(o.gray900,.05)},svg:{fill:"currentColor"}},S())});var jo="button";function Vo(e,r){let l=e,{as:t=jo,children:a,className:i,testId:n="cf-ui-navbar-topbar-item"}=l,s=f(l,["as","children","className","testId"]),c=$r();return u.createElement(t,d(m({},s),{ref:r,className:cx(c.navbarTopItem,i),"data-test-id":n}),a)}var Gr=u.forwardRef(Vo);var y=rr;y.Item=Ie;y.ItemSkeleton=Se;y.MenuItem=we;y.MenuItemSkeleton=Pe;y.MenuDivider=MenuDivider;y.MenuSectionTitle=MenuSectionTitle;y.Switcher=Ce;y.SwitcherSkeleton=Ae;y.SwitcherItem=Lr;y.Search=Rr;y.Help=Dr;y.Account=ye;y.AccountSkeleton=Ne;y.Badge=Fr;y.TopbarItem=Gr;
213
213
 
214
- export { h as Navbar, qe as getNavbarItemActiveStyles };
214
+ export { y as Navbar, ir as getNavbarItemActiveStyles };
215
215
  //# sourceMappingURL=out.js.map
216
216
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/CompoundNavbar.ts","../../src/Navbar.tsx","../../src/Navbar.styles.ts","../../src/utils.styles.ts","../../src/icons/CircleIcon.tsx","../../src/icons/ArrowDownIcon.tsx","../../src/icons/HelpIcon.tsx","../../src/icons/SearchIcon.tsx","../../src/icons/ContentfulLogoIcon.tsx","../../src/NavbarAccount/NavbarAccount.tsx","../../src/NavbarAccount/NavbarAccount.styles.ts","../../src/NavbarMenu/NavbarMenu.tsx","../../src/NavbarMenu/NavbarMenu.styles.ts","../../src/NavbarAccount/NavbarAccountSkeleton.tsx","../../src/NavbarItem/NavbarItem.tsx","../../src/NavbarItem/NavbarItem.styles.ts","../../src/NavbarItemIcon/NavbarItemIcon.tsx","../../src/NavbarItemIcon/NavbarItemIcon.styles.ts","../../src/NavbarItem/NavbarItemSkeleton.tsx","../../src/NavbarMenuItem/NavbarMenuItem.tsx","../../src/NavbarMenuItem/NavbarMenuItem.styles.ts","../../src/NavbarMenuItem/NavbarMenuItemSkeleton.tsx","../../src/NavbarSwitcher/NavbarSwitcher.tsx","../../src/NavbarSwitcher/NavbarSwitcher.styles.ts","../../src/NavbarSwitcher/NavbarSwitcherSkeleton.tsx","../../src/NavbarSearch/NavbarSearch.tsx","../../../button/src/Button/Button.styles.ts","../../../spinner/src/Spinner.styles.ts","../../src/NavbarSearch/NavbarSearch.styles.ts","../../src/NavbarSwitcherItem/NavbarSwitcherItem.tsx","../../src/NavbarSwitcherItem/NavbarSwitcherItem.styles.ts","../../src/NavbarSwitcherItem/NavbarEnvVariant.tsx","../../src/NavbarHelp/NavbarHelp.tsx","../../src/NavbarHelp/NavbarHelp.styles.ts","../../src/NavbarBadge/NavbarBadge.tsx","../../src/NavbarBadge/NavbarBadge.styles.ts","../../src/NavbarTopbarItem/NavbarTopbarItem.tsx","../../src/NavbarTopbarItem/NavbarTopbarItem.styles.ts"],"names":["MenuDivider","MenuSectionTitle","Box","Flex","React","css","tokens","mqs","getGlowOnFocusStyles","shadow","getNavbarStyles","maxWidth","variant","generateIcon","CircleIcon","ArrowDownIcon","HelpIcon","SearchIcon","ContentfulLogoIcon","_Navbar","props","ref","_a","account","badge","bottomRightItems","children","className","contentMaxWidth","help","logo","search","switcher","testId","topRightItems","otherProps","__objRest","styles","__spreadProps","__spreadValues","Navbar","cx","hexToRGBA","notificationVarianColorMap","getNavbarAccountStyles","Menu","getNavbarMenuStyles","NavbarMenu","trigger","onOpen","onClose","Avatar","_NavbarAccount","avatar","initials","username","hasNotification","notificationVariant","NavbarAccount","SkeletonContainer","SkeletonImage","NavbarAccountSkeleton","ariaLabel","getNavbarItemActiveStyles","commonItemStyles","getNavbarItemStyles","getNavbarItemSkeletonStyles","getNavbarItemIconStyles","NavbarItemIcon","_b","icon","NAVBAR_ITEM_DEFAULT_TAG","_NavbarItem","Comp","title","isActive","isMenuTrigger","isNavbarItemHasMenu","item","NavbarItem","SkeletonText","NavbarItemSkeleton","estimatedWidth","getNavbarMenuItemStyles","ExternalLinkIcon","NAVBAR_MENU_ITEM_DEFAULT_TAG","_NavbarMenuItem","itemIsExternalLink","isExternalLink","externalIcon","NavbarMenuItem","SkeletonBodyText","NavbarMenuItemSkeleton","getNavbarSwitcherStyles","_NavbarSwitcher","NavbarSwitcher","SkeletonDisplayText","NavbarSwitcherSkeleton","m","Stack","s","forwardRef","i","N","T","v","c","x","f","r","a","S","d","g","n","h","y","keyframes","getNavbarSearchStyles","_NavbarSearch","Z","NavbarSearch","mobileIcon","getNavbarSwitcherItemStyles","EnvironmentAliasIcon","EnvironmentIcon","NavbarEnvVariant","isAlias","_NavbarSwitcherItem","isCircle","envVariant","classes","NavbarSwitcherItem","getNavbarHelpStyles","_NavbarHelp","B","NavbarHelp","getNavbarBadgeStyles","NAVBAR_BADGE_DEFAULT_TAG","_NavbarBadge","NavbarBadge","getNavbarTopbarItemStyles","_NavbarTopbarItem","NavbarTopbarItem"],"mappings":"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","sourcesContent":["import { MenuDivider } from '@contentful/f36-menu';\nimport { MenuSectionTitle } from '@contentful/f36-menu';\nimport { Navbar as OriginalNavbar } from './Navbar';\n\nimport { NavbarAccount, NavbarAccountSkeleton } from './NavbarAccount';\nimport { NavbarItem, NavbarItemSkeleton } from './NavbarItem';\nimport { NavbarMenuItem, NavbarMenuItemSkeleton } from './NavbarMenuItem';\nimport { NavbarSwitcher, NavbarSwitcherSkeleton } from './NavbarSwitcher';\n\nimport { NavbarSearch } from './NavbarSearch/NavbarSearch';\nimport { NavbarSwitcherItem } from './NavbarSwitcherItem/NavbarSwitcherItem';\nimport { NavbarHelp } from './NavbarHelp/NavbarHelp';\nimport { NavbarBadge } from './NavbarBadge/NavbarBadge';\nimport { NavbarTopbarItem } from './NavbarTopbarItem/NavbarTopbarItem';\n\ntype CompoundNavbar = typeof OriginalNavbar & {\n Item: typeof NavbarItem;\n ItemSkeleton: typeof NavbarItemSkeleton;\n MenuItem: typeof NavbarMenuItem;\n MenuItemSkeleton: typeof NavbarMenuItemSkeleton;\n MenuDivider: typeof MenuDivider;\n MenuSectionTitle: typeof MenuSectionTitle;\n Switcher: typeof NavbarSwitcher;\n SwitcherSkeleton: typeof NavbarSwitcherSkeleton;\n SwitcherItem: typeof NavbarSwitcherItem;\n Search: typeof NavbarSearch;\n Help: typeof NavbarHelp;\n Account: typeof NavbarAccount;\n AccountSkeleton: typeof NavbarAccountSkeleton;\n Badge: typeof NavbarBadge;\n TopbarItem: typeof NavbarTopbarItem;\n};\n\nexport const Navbar = OriginalNavbar as CompoundNavbar;\nNavbar.Item = NavbarItem;\nNavbar.ItemSkeleton = NavbarItemSkeleton;\nNavbar.MenuItem = NavbarMenuItem;\nNavbar.MenuItemSkeleton = NavbarMenuItemSkeleton;\nNavbar.MenuDivider = MenuDivider;\nNavbar.MenuSectionTitle = MenuSectionTitle;\nNavbar.Switcher = NavbarSwitcher;\nNavbar.SwitcherSkeleton = NavbarSwitcherSkeleton;\nNavbar.SwitcherItem = NavbarSwitcherItem;\nNavbar.Search = NavbarSearch;\nNavbar.Help = NavbarHelp;\nNavbar.Account = NavbarAccount;\nNavbar.AccountSkeleton = NavbarAccountSkeleton;\nNavbar.Badge = NavbarBadge;\nNavbar.TopbarItem = NavbarTopbarItem;\n","import {\n Box,\n type CommonProps,\n type ExpandProps,\n Flex,\n} from '@contentful/f36-core';\nimport React from 'react';\nimport { getNavbarStyles } from './Navbar.styles';\nimport { ContentfulLogoIcon } from './icons';\n\ntype NavbarOwnProps = CommonProps & {\n account?: React.ReactNode;\n badge?: React.ReactNode;\n /**\n * Items that will be rendered on the bottom-right of the navbar.\n * Useful for separating other navigation items from main ones, (e.g. separating \"Settings\" from all other navigation items).\n */\n bottomRightItems?: React.ReactNode;\n children?: React.ReactNode;\n /**\n * Defines the max-width of the content inside the navbar.\n * @default '100%'\n */\n contentMaxWidth?: string;\n help?: React.ReactNode;\n /**\n * Will be displayed instead of the default Contentful logo\n */\n logo?: React.ReactNode;\n search?: React.ReactNode;\n switcher?: React.ReactNode;\n /**\n * Items that will be rendered on the top-right of the navbar.\n * Useful for providing additional context or actions to the user (e.g. a Feedback form link).\n */\n topRightItems?: React.ReactNode;\n /**\n * Describes the size variation of the navbar\n */\n variant?: 'wide' | 'fullscreen';\n};\n\n// expose only the HTML props that are needed to not pollute the API\ntype NavbarHTMLElementProps = Pick<React.ComponentPropsWithoutRef<'div'>, 'id'>;\n\nexport type NavbarProps = NavbarHTMLElementProps & NavbarOwnProps;\n\nfunction _Navbar(props: ExpandProps<NavbarProps>, ref: React.Ref<HTMLElement>) {\n const {\n account,\n badge,\n bottomRightItems,\n children,\n className,\n contentMaxWidth = '100%',\n help,\n logo,\n search,\n switcher,\n testId = 'cf-ui-navbar',\n topRightItems,\n variant = 'wide',\n ...otherProps\n } = props;\n const styles = getNavbarStyles(contentMaxWidth, variant);\n\n return (\n <Box {...otherProps} ref={ref} testId={testId} className={className}>\n <Flex className={styles.containerTop}>\n <Flex\n className={styles.containerTopContent}\n justifyContent=\"space-between\"\n >\n <Flex alignItems=\"center\" gap=\"spacingL\">\n {logo || <ContentfulLogoIcon className={styles.logo} />}\n {switcher}\n </Flex>\n <Flex alignItems=\"center\" gap=\"spacingXs\">\n {topRightItems}\n {badge}\n {search}\n {help}\n {account}\n </Flex>\n </Flex>\n </Flex>\n\n <Flex className={styles.containerBottom}>\n <Flex\n className={styles.containerBottomContent}\n justifyContent=\"space-between\"\n >\n <Flex as=\"nav\" aria-label=\"Main Navigation\">\n {children}\n </Flex>\n {bottomRightItems && <Flex>{bottomRightItems}</Flex>}\n </Flex>\n </Flex>\n </Box>\n );\n}\n\nexport const Navbar = React.forwardRef(_Navbar);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { mqs } from './utils.styles';\n\nexport const getNavbarStyles = (maxWidth: string, variant: string) => ({\n containerTop: css({\n justifyContent: 'center',\n backgroundColor: tokens.gray100,\n }),\n containerBottom: css({\n justifyContent: 'center',\n backgroundColor: tokens.gray100,\n }),\n containerTopContent: css({\n width: '100%',\n maxWidth: variant === 'wide' ? '1524px' : maxWidth,\n padding: tokens.spacingXs,\n minHeight: tokens.spacingL,\n [mqs.medium]: {\n padding: `${tokens.spacingXs} 20px`,\n },\n }),\n containerBottomContent: css({\n width: '100%',\n maxWidth: variant === 'wide' ? '1524px' : maxWidth,\n padding: 0,\n paddingTop: tokens.spacing2Xs,\n minHeight: '2.5rem',\n overflow: 'auto',\n [mqs.medium]: {\n padding: `${tokens.spacing2Xs} ${tokens.spacingXs}`,\n },\n }),\n logo: css({\n height: '28px',\n width: '28px',\n }),\n});\n","import tokens from '@contentful/f36-tokens';\n\ntype screens = 'medium' | 'large' | 'xlarge';\ntype mediaqueries = Record<screens, string>;\nexport const mqs: mediaqueries = {\n medium: '@media (min-width: 480px)',\n large: '@media (min-width: 768px)',\n xlarge: '@media (min-width: 1920px)',\n};\n\nexport const getGlowOnFocusStyles = (shadow: string = tokens.glowPrimary) => ({\n '&:focus': {\n boxShadow: shadow,\n },\n '&:focus:not(:focus-visible)': {\n boxShadow: 'unset',\n },\n '&:focus-visible': {\n boxShadow: shadow,\n },\n});\n","import React from 'react';\nimport { generateIcon } from '@contentful/f36-icon';\n\nexport const CircleIcon = /*#__PURE__*/ generateIcon({\n name: 'CircleIcon',\n viewBox: '0 0 24 24',\n path: (\n <path\n d=\"M11.994 6.526A5.47 5.47 0 0 0 6.526 12a5.47 5.47 0 0 0 5.468 5.473A5.476 5.476 0 0 0 17.473 12a5.477 5.477 0 0 0-5.479-5.474ZM12 15.447a3.448 3.448 0 1 1 0-6.896 3.448 3.448 0 0 1 0 6.896Z\"\n fill=\"currentFill\"\n />\n ),\n});\n","import React from 'react';\nimport { generateIcon } from '@contentful/f36-icon';\n\nexport const ArrowDownIcon = /*#__PURE__*/ generateIcon({\n name: 'ArrowDownIcon',\n viewBox: '0 0 12 20',\n path: (\n <path\n d=\"M3.03076 8C2.20109 8 1.73228 8.95209 2.23814 9.60971L5.20727 13.4696C5.60757 13.99 6.39223 13.99 6.79252 13.4696L9.76166 9.60971C10.2675 8.95209 9.79871 8 8.96904 8L3.03076 8Z\"\n fill=\"#9FA8B2\"\n />\n ),\n});\n","import React from 'react';\nimport { generateIcon } from '@contentful/f36-icon';\n\nexport const HelpIcon = /*#__PURE__*/ generateIcon({\n name: 'HelpIcon',\n viewBox: '0 0 24 24',\n path: (\n <>\n <g clipPath=\"url(#HelpIcon_svg__a)\">\n <path\n d=\"M12 2.25A9.75 9.75 0 1 0 21.75 12 9.769 9.769 0 0 0 12 2.25ZM12 18a1.125 1.125 0 1 1 0-2.25A1.125 1.125 0 0 1 12 18Zm.75-4.584v.084a.75.75 0 1 1-1.5 0v-.75A.75.75 0 0 1 12 12a1.875 1.875 0 1 0-1.875-1.875.75.75 0 1 1-1.5 0 3.375 3.375 0 1 1 4.125 3.29Z\"\n fill=\"currentFill\"\n />\n </g>\n <defs>\n <clipPath id=\"HelpIcon_svg__a\">\n <path fill=\"currentFill\" d=\"M0 0h24v24H0z\" />\n </clipPath>\n </defs>\n </>\n ),\n});\n","import React from 'react';\nimport { generateIcon } from '@contentful/f36-icon';\n\nexport const SearchIcon = /*#__PURE__*/ generateIcon({\n name: 'SearchIcon',\n viewBox: '0 0 24 24',\n path: (\n <>\n <g clipPath=\"url(#SearchIcon_svg__a)\">\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M6 11.125a5.125 5.125 0 1 1 10.25 0 5.125 5.125 0 0 1-10.25 0ZM11.125 4a7.125 7.125 0 1 0 4.282 12.82l2.886 2.887a1 1 0 0 0 1.414-1.414l-2.886-2.887A7.125 7.125 0 0 0 11.125 4Z\"\n fill=\"currentFill\"\n />\n </g>\n <defs>\n <clipPath id=\"SearchIcon_svg__a\">\n <path fill=\"#fff\" d=\"M0 0h24v24H0z\" />\n </clipPath>\n </defs>\n </>\n ),\n});\n","import React from 'react';\nimport { generateIcon } from '@contentful/f36-icon';\n\nexport const ContentfulLogoIcon = /*#__PURE__*/ generateIcon({\n name: 'ContentfulLogoIcon',\n viewBox: '0 0 28 28',\n path: (\n <>\n <path\n fill=\"#1773EB\"\n d=\"M10.713 5.001c.845.843 1.167 2.079.845 3.228A6.663 6.663 0 0 1 15 7.276h.026a6.7 6.7 0 0 1 4.743 1.988 2.64 2.64 0 1 0 3.746-3.715A11.96 11.96 0 0 0 15.042 2h-.046a11.933 11.933 0 0 0-6.691 2.036h.074a3.287 3.287 0 0 1 2.334.967V5Z\"\n />\n <path\n fill=\"#E44F20\"\n d=\"M21.594 17.999a2.64 2.64 0 0 0-1.858.766 6.703 6.703 0 0 1-4.732 1.951h-.025a6.65 6.65 0 0 1-3.447-.968A3.3 3.3 0 0 1 8.35 23.93h-.086A11.926 11.926 0 0 0 14.96 26h.046a11.94 11.94 0 0 0 8.449-3.484 2.64 2.64 0 0 0-1.859-4.514V18h-.002Z\"\n />\n <path\n fill=\"#FFDA00\"\n d=\"M6.013 18.295a3.27 3.27 0 0 1 2.334-.967c.302 0 .603.04.894.122a6.7 6.7 0 0 1 .013-6.928A3.3 3.3 0 0 1 5.08 7.335v-.09a11.999 11.999 0 0 0-.032 13.453v-.07a3.27 3.27 0 0 1 .966-2.333Z\"\n />\n <path\n fill=\"#1773EB\"\n d=\"M8.379 4.62c-.75 0-1.276.312-1.913.949-.607.605-.798 1.135-.8 1.766A2.712 2.712 0 1 0 8.38 4.62Z\"\n />\n <path\n fill=\"#E44F20\"\n d=\"M5.628 20.631c0 .75.31 1.276.946 1.912.607.606 1.136.799 1.766.8a2.703 2.703 0 1 0-.017-5.407 2.703 2.703 0 0 0-2.695 2.704v-.009Z\"\n />\n </>\n ),\n});\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { getNavbarAccountStyles } from './NavbarAccount.styles';\nimport {\n type PropsWithHTMLElement,\n type CommonProps,\n type ExpandProps,\n} from '@contentful/f36-core';\nimport { NavbarMenu } from '../NavbarMenu/NavbarMenu';\nimport { Avatar } from '@contentful/f36-avatar';\nimport { Flex } from '@contentful/f36-core';\n\ntype NavbarAccountOwnProps = CommonProps & {\n children: React.ReactNode;\n username: string;\n avatar?: string;\n initials?: string;\n hasNotification?: boolean;\n /**\n * @default 'warning'\n */\n notificationVariant?: 'warning' | 'negative' | 'info';\n};\n\nexport type NavbarAccountProps = PropsWithHTMLElement<\n NavbarAccountOwnProps,\n 'button'\n>;\n\nfunction _NavbarAccount(\n props: ExpandProps<NavbarAccountProps>,\n ref: React.Ref<HTMLButtonElement>,\n) {\n const {\n children,\n className,\n testId = 'cf-ui-navbar-account-trigger',\n avatar,\n initials,\n username,\n hasNotification,\n notificationVariant = 'warning',\n ...otherProps\n } = props;\n const styles = getNavbarAccountStyles();\n\n return (\n <NavbarMenu\n trigger={\n <Flex\n as=\"button\"\n {...otherProps}\n ref={ref}\n className={cx(styles.navbarAccount, className)}\n testId={testId}\n alignItems=\"center\"\n >\n <Avatar\n src={avatar}\n initials={initials}\n size=\"small\"\n variant=\"user\"\n />\n {hasNotification ? (\n <span className={styles.notificationIcon(notificationVariant)} />\n ) : null}\n </Flex>\n }\n >\n {children}\n </NavbarMenu>\n );\n}\n\nexport const NavbarAccount = React.forwardRef(_NavbarAccount);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { NavbarAccountProps } from './NavbarAccount';\nimport { getGlowOnFocusStyles } from '../utils.styles';\nimport { hexToRGBA } from '@contentful/f36-utils';\n\nconst notificationVarianColorMap: Record<\n NavbarAccountProps['notificationVariant'],\n string\n> = {\n warning: tokens.colorWarning,\n negative: tokens.colorNegative,\n info: tokens.blue500,\n};\n\nexport const getNavbarAccountStyles = () => ({\n navbarAccount: css(\n {\n // default button reset styles\n margin: 0,\n padding: 0,\n border: 0,\n cursor: 'pointer',\n background: 'none',\n position: 'relative',\n outline: 'none',\n overflow: 'visible',\n borderRadius: '50%',\n '&:before': css({\n content: '\"\"',\n display: 'block',\n position: 'absolute',\n height: '24px',\n width: '24px',\n backgroundColor: 'transparent',\n borderRadius: '50%',\n }),\n '&:hover:before': css({\n backgroundColor: hexToRGBA(tokens.gray300, 0.15),\n }),\n },\n getGlowOnFocusStyles(),\n ),\n avatar: css({\n borderRadius: '50%',\n display: 'block',\n height: '24px',\n width: '24px',\n }),\n notificationIcon: (variant: NavbarAccountProps['notificationVariant']) =>\n css({\n position: 'absolute',\n top: 0,\n right: 0,\n height: tokens.spacingS,\n width: tokens.spacingS,\n borderRadius: '50%',\n border: `2px solid ${tokens.gray100}`,\n backgroundColor: notificationVarianColorMap[variant],\n transform: 'translate(30%, -30%)',\n }),\n});\n","import React from 'react';\nimport { Menu, type MenuListProps, type MenuProps } from '@contentful/f36-menu';\nimport { getNavbarMenuStyles } from './NavbarMenu.styles';\n\nexport type NavbarMenuProps = {\n trigger: React.ReactNode;\n children?: React.ReactNode;\n} & Pick<MenuListProps, 'testId'> &\n Pick<MenuProps, 'onOpen' | 'onClose'>;\n\nexport const NavbarMenu = (props: NavbarMenuProps) => {\n const {\n trigger,\n children,\n testId = 'cf-ui-navbar-menu-list',\n onOpen,\n onClose,\n } = props;\n const styles = getNavbarMenuStyles();\n\n return (\n <Menu onOpen={onOpen} onClose={onClose}>\n <Menu.Trigger>{trigger}</Menu.Trigger>\n <Menu.List className={styles.menuList} testId={testId}>\n {children}\n </Menu.List>\n </Menu>\n );\n};\n","import { css } from 'emotion';\n\nexport const getNavbarMenuStyles = () => ({\n menuList: css({\n minWidth: '250px',\n }),\n});\n","import React from 'react';\nimport { SkeletonContainer, SkeletonImage } from '@contentful/f36-skeleton';\nimport tokens from '@contentful/f36-tokens';\n\nexport function NavbarAccountSkeleton({ ariaLabel }: { ariaLabel?: string }) {\n return (\n <SkeletonContainer\n svgWidth={24}\n svgHeight={24}\n ariaLabel={ariaLabel}\n backgroundColor={tokens.gray300}\n foregroundColor={tokens.gray200}\n >\n <SkeletonImage width={24} height={24} radiusX={12} radiusY={12} />\n </SkeletonContainer>\n );\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { getNavbarItemStyles } from './NavbarItem.styles';\nimport { NavbarMenu, type NavbarMenuProps } from '../NavbarMenu/NavbarMenu';\nimport {\n NavbarItemIcon,\n type NavbarItemIconProps,\n} from '../NavbarItemIcon/NavbarItemIcon';\nimport { ArrowDownIcon } from '../icons';\nimport type {\n CommonProps,\n ExpandProps,\n PolymorphicComponent,\n PolymorphicProps,\n} from '@contentful/f36-core';\n\nconst NAVBAR_ITEM_DEFAULT_TAG = 'button';\n\ntype NavbarItemTriggerProps = CommonProps & {\n title: string;\n icon?: NavbarItemIconProps['icon'];\n isActive?: boolean;\n as?: React.ElementType;\n};\n\ntype NavbarItemAsMenuProps = NavbarItemTriggerProps &\n Pick<NavbarMenuProps, 'onOpen' | 'onClose'> & {\n children: React.ReactNode;\n };\ntype NavbarItemAsItemProps = NavbarItemTriggerProps & {\n children?: never;\n onOpen?: never;\n onClose?: never;\n};\ntype NavbarItemOwnProps = NavbarItemAsItemProps | NavbarItemAsMenuProps;\n\nexport type NavbarItemProps<\n E extends React.ElementType = typeof NAVBAR_ITEM_DEFAULT_TAG,\n> = PolymorphicProps<NavbarItemOwnProps, E>;\n\nfunction _NavbarItem(\n props: NavbarItemProps<React.ElementType>,\n ref: React.Ref<any>,\n) {\n const {\n as: Comp = NAVBAR_ITEM_DEFAULT_TAG,\n icon,\n title,\n children,\n className,\n isActive,\n testId = 'cf-ui-navbar-item',\n onOpen,\n onClose,\n ...otherProps\n } = props;\n const styles = getNavbarItemStyles();\n const isMenuTrigger = isNavbarItemHasMenu(props);\n const item = (\n <Comp\n {...otherProps}\n ref={ref}\n data-test-id={testId}\n className={cx(\n styles.navbarItem,\n isMenuTrigger && styles.navbarItemMenuTrigger,\n isActive && styles.isActive,\n className,\n )}\n >\n {icon && <NavbarItemIcon icon={icon} variant=\"secondary\" />}\n <span>{title}</span>\n {isMenuTrigger && <ArrowDownIcon />}\n </Comp>\n );\n\n if (isMenuTrigger) {\n return (\n <NavbarMenu\n trigger={item}\n testId={testId}\n onOpen={onOpen}\n onClose={onClose}\n >\n {children}\n </NavbarMenu>\n );\n }\n\n return item;\n}\n\nconst isNavbarItemHasMenu = <E extends React.ElementType>(\n props: NavbarItemProps<E>,\n): props is PolymorphicProps<NavbarItemAsMenuProps, E> =>\n Boolean(props.children);\n\nexport const NavbarItem: PolymorphicComponent<\n ExpandProps<NavbarItemOwnProps>,\n typeof NAVBAR_ITEM_DEFAULT_TAG\n> = React.forwardRef(_NavbarItem);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { hexToRGBA } from '@contentful/f36-utils';\nimport { getGlowOnFocusStyles } from '../utils.styles';\n\nexport const getNavbarItemActiveStyles = () =>\n css({\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n width: `calc(100% - ${tokens.spacingM})`,\n height: '2px',\n bottom: `-${tokens.spacing2Xs}`,\n left: 0,\n right: 0,\n margin: 'auto',\n backgroundColor: tokens.blue600,\n zIndex: 0,\n },\n });\n\nconst commonItemStyles = {\n display: 'flex',\n justifyContent: 'center',\n padding: `${tokens.spacing2Xs} ${tokens.spacingS}`,\n alignItems: 'center',\n background: 'none',\n};\n\nexport const getNavbarItemStyles = () => ({\n navbarItem: css(\n commonItemStyles,\n {\n alignItems: 'center',\n background: 'none',\n border: 0,\n margin: 0,\n outline: 'none',\n fontSize: tokens.fontSizeM,\n lineHeight: tokens.lineHeightS,\n fontWeight: tokens.fontWeightMedium,\n position: 'relative',\n textAlign: 'left',\n whiteSpace: 'nowrap',\n cursor: 'pointer',\n hyphens: 'auto',\n textDecoration: 'none',\n color: tokens.gray700,\n boxSizing: 'border-box',\n transition: `color ${tokens.transitionDurationShort} ${tokens.transitionEasingCubicBezier}`,\n borderRadius: tokens.borderRadiusMedium,\n\n '&:hover': {\n backgroundColor: hexToRGBA(tokens.gray900, 0.05),\n },\n\n '&:hover::before': {\n opacity: 1,\n scale: '1',\n },\n\n '&:active::before': {\n backgroundColor: `rgba(255, 255, 255, 0.1)`,\n },\n '&:disabled': {\n cursor: 'auto',\n },\n\n '& svg': {\n transition: `fill ${tokens.transitionDurationShort} ${tokens.transitionEasingCubicBezier}`,\n },\n '& > svg, & > span': {\n zIndex: tokens.zIndexDefault,\n },\n },\n getGlowOnFocusStyles(`inset ${tokens.glowPrimary}`),\n ),\n navbarItemMenuTrigger: css({\n paddingRight: tokens.spacingXs,\n }),\n isActive: getNavbarItemActiveStyles(),\n});\n\nexport const getNavbarItemSkeletonStyles = () => ({\n itemSkeleton: css(commonItemStyles),\n});\n","import React from 'react';\nimport type { IconProps } from '@contentful/f36-icons';\nimport { getNavbarItemIconStyles } from './NavbarItemIcon.styles';\nimport { cx } from 'emotion';\n\nexport type NavbarItemIconProps = {\n icon: React.ReactElement<IconProps>;\n} & Pick<IconProps, 'variant'>;\n\nexport const NavbarItemIcon = (props: NavbarItemIconProps) => {\n const { icon, variant } = props;\n const styles = getNavbarItemIconStyles();\n\n return React.cloneElement(icon, {\n className: cx(icon.props.className, styles.navbarItemIcon),\n size: icon.props.size ?? 'tiny',\n variant: icon.props.variant ?? variant,\n });\n};\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getNavbarItemIconStyles = () => ({\n navbarItemIcon: css({\n fill: tokens.gray700,\n '&:first-child': {\n marginRight: tokens.spacing2Xs,\n },\n '&:last-child': {\n marginLeft: tokens.spacing2Xs,\n },\n 'img&': {\n borderRadius: tokens.borderRadiusSmall,\n maxWidth: tokens.spacingM,\n maxHeight: tokens.spacingM,\n },\n }),\n});\n","import React from 'react';\nimport { SkeletonContainer, SkeletonText } from '@contentful/f36-skeleton';\nimport tokens from '@contentful/f36-tokens';\nimport { getNavbarItemSkeletonStyles } from './NavbarItem.styles';\n\nexport const NavbarItemSkeleton = ({\n estimatedWidth,\n}: {\n estimatedWidth: number;\n}) => {\n const styles = getNavbarItemSkeletonStyles();\n\n return (\n <SkeletonContainer\n className={styles.itemSkeleton}\n svgWidth={estimatedWidth}\n svgHeight={32}\n backgroundColor={tokens.gray300}\n foregroundColor={tokens.gray200}\n >\n <SkeletonText\n lineHeight={6}\n numberOfLines={1}\n offsetTop={10}\n radiusX={tokens.borderRadiusSmall}\n radiusY={tokens.borderRadiusSmall}\n />\n </SkeletonContainer>\n );\n};\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { getNavbarMenuItemStyles } from './NavbarMenuItem.styles';\nimport { Menu, type MenuItemProps } from '@contentful/f36-menu';\nimport {\n NavbarItemIcon,\n type NavbarItemIconProps,\n} from '../NavbarItemIcon/NavbarItemIcon';\nimport { ExternalLinkIcon } from '@contentful/f36-icons';\nimport type {\n ExpandProps,\n PolymorphicComponent,\n PolymorphicProps,\n} from '@contentful/f36-core';\n\nconst NAVBAR_MENU_ITEM_DEFAULT_TAG = 'button';\n\ntype NavbarMenuItemOwnProps = {\n children?: null;\n title: string;\n icon?: NavbarItemIconProps['icon'];\n as?: React.ElementType;\n} & Omit<MenuItemProps, 'children' | 'as'>;\n\nexport type NavbarMenuItemProps<\n E extends React.ElementType = typeof NAVBAR_MENU_ITEM_DEFAULT_TAG,\n> = PolymorphicProps<NavbarMenuItemOwnProps, E>;\n\nfunction _NavbarMenuItem(\n props: NavbarMenuItemProps<React.ElementType>,\n ref: React.Ref<any>,\n) {\n const {\n as: Comp = NAVBAR_MENU_ITEM_DEFAULT_TAG,\n icon,\n title,\n className,\n ...otherProps\n } = props;\n const styles = getNavbarMenuItemStyles();\n\n const itemIsExternalLink = isExternalLink(\n props as unknown as NavbarMenuItemProps<'a'>,\n );\n\n return (\n <Menu.Item\n {...otherProps}\n ref={ref}\n as={Comp as MenuItemProps['as']}\n className={cx(styles.navbarMenuItem, className)}\n >\n {icon ? (\n <NavbarItemIcon icon={icon} variant=\"secondary\" />\n ) : (\n itemIsExternalLink && externalIcon\n )}\n <span>{title}</span>\n {icon && itemIsExternalLink ? externalIcon : null}\n </Menu.Item>\n );\n}\n\nconst externalIcon = (\n <NavbarItemIcon icon={<ExternalLinkIcon />} variant=\"muted\" />\n);\n\nconst isExternalLink = (props: NavbarMenuItemProps<'a'>) =>\n props.as === 'a' && props.target === '_blank';\n\nexport const NavbarMenuItem: PolymorphicComponent<\n ExpandProps<NavbarMenuItemOwnProps>,\n typeof NAVBAR_MENU_ITEM_DEFAULT_TAG\n> = React.forwardRef(_NavbarMenuItem);\n","import { css } from 'emotion';\nexport const getNavbarMenuItemStyles = () => ({\n navbarMenuItem: css({\n display: 'flex',\n justifyContent: 'flex-start',\n alignItems: 'center',\n }),\n});\n","import React from 'react';\nimport { Menu } from '@contentful/f36-menu';\nimport {\n SkeletonBodyText,\n SkeletonContainer,\n SkeletonImage,\n} from '@contentful/f36-skeleton';\nimport { Flex } from '@contentful/f36-core';\n\nimport tokens from '@contentful/f36-tokens';\n\nexport const NavbarMenuItemSkeleton = ({\n ariaLabel,\n}: {\n ariaLabel?: string;\n}) => (\n <Menu.Item>\n <Flex alignItems=\"center\" gap={tokens.spacingXs}>\n <SkeletonContainer svgHeight={16} svgWidth={18}>\n <SkeletonImage width={16} height={16} />\n </SkeletonContainer>\n <SkeletonContainer svgHeight={16} svgWidth={190} ariaLabel={ariaLabel}>\n <SkeletonBodyText numberOfLines={1} />\n </SkeletonContainer>\n </Flex>\n </Menu.Item>\n);\n","import React from 'react';\nimport { getNavbarSwitcherStyles } from './NavbarSwitcher.styles';\nimport {\n Flex,\n type CommonProps,\n type PropsWithHTMLElement,\n type ExpandProps,\n} from '@contentful/f36-core';\nimport { cx } from 'emotion';\n\ntype NavbarSwitcherOwnProps = CommonProps & {\n children?: React.ReactNode;\n};\n\nexport type NavbarSwitcherProps = PropsWithHTMLElement<\n NavbarSwitcherOwnProps,\n 'button'\n>;\n\nfunction _NavbarSwitcher(\n props: ExpandProps<NavbarSwitcherProps>,\n ref: React.Ref<HTMLButtonElement>,\n) {\n const {\n children,\n className,\n testId = 'cf-ui-navbar-switcher',\n ...otherProps\n } = props;\n const styles = getNavbarSwitcherStyles();\n\n return (\n <Flex\n {...otherProps}\n as=\"button\"\n ref={ref}\n className={cx(styles.navbarSwitcher, className)}\n testId={testId}\n alignItems=\"center\"\n fullHeight\n gap=\"spacingXs\"\n >\n <Flex as=\"ul\" alignItems=\"center\" className={styles.switcherBreadcrumbs}>\n {children}\n </Flex>\n </Flex>\n );\n}\n\nexport const NavbarSwitcher = React.forwardRef(_NavbarSwitcher);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { getGlowOnFocusStyles } from '../utils.styles';\n\nexport const getNavbarSwitcherStyles = () => ({\n navbarSwitcher: css(\n {\n // default button reset styles\n margin: 0,\n padding: 0,\n background: 'none',\n border: 'none',\n height: 'max-content',\n\n color: tokens.gray700,\n cursor: 'pointer',\n fontSize: tokens.fontSizeS,\n fontWeight: tokens.fontWeightMedium,\n position: 'relative',\n outline: 'none',\n borderRadius: '3rem',\n\n '&:after': {\n content: '\"\"',\n border: '1px solid #353A41',\n boxSizing: 'border-box',\n height: '16px',\n right: '-1px',\n position: 'absolute',\n width: 0,\n },\n '&:last-child:after': {\n display: 'none',\n },\n '&:hover li': {\n backgroundColor: '#f2f4f6', // Using a calculated hover alpha color because when using a RGBA value layers overlapping occur and show darker areas\n },\n },\n getGlowOnFocusStyles(),\n ),\n switcherMenuIcon: css({\n height: tokens.spacingM,\n width: tokens.spacingM,\n fill: tokens.gray700,\n }),\n switcherBreadcrumbs: css({\n listStyleType: 'none',\n margin: 0,\n padding: 0,\n position: 'relative',\n }),\n});\n","import React from 'react';\nimport {\n SkeletonContainer,\n SkeletonDisplayText,\n} from '@contentful/f36-skeleton';\nimport tokens from '@contentful/f36-tokens';\n\nexport const NavbarSwitcherSkeleton = ({\n estimatedWidth,\n}: {\n estimatedWidth: number;\n}) => (\n <SkeletonContainer\n svgWidth={estimatedWidth}\n svgHeight={24}\n backgroundColor={tokens.gray300}\n foregroundColor={tokens.gray200}\n >\n <SkeletonDisplayText\n lineHeight={24}\n numberOfLines={1}\n radiusX={12}\n radiusY={12}\n />\n </SkeletonContainer>\n);\n","import { cx } from 'emotion';\nimport React from 'react';\nimport { SearchIcon } from '../icons';\nimport {\n type CommonProps,\n type ExpandProps,\n type PropsWithHTMLElement,\n} from '@contentful/f36-core';\nimport { IconButton } from '@contentful/f36-button';\nimport { getNavbarSearchStyles } from './NavbarSearch.styles';\ntype NavbarSearchOwnProps = CommonProps;\n\nexport type NavbarSearchProps = PropsWithHTMLElement<\n NavbarSearchOwnProps,\n 'button'\n>;\n\nfunction _NavbarSearch(\n props: ExpandProps<NavbarSearchProps>,\n ref: React.Ref<HTMLButtonElement>,\n) {\n const { className, testId = 'cf-ui-navbar-search', ...otherProps } = props;\n const styles = getNavbarSearchStyles();\n return (\n <IconButton\n aria-label=\"Quick Search\"\n {...otherProps}\n variant=\"transparent\"\n ref={ref}\n size=\"small\"\n className={cx(styles.navbarSearch, className)}\n testId={testId}\n icon={<SearchIcon size=\"medium\" />}\n />\n );\n}\n\nexport const NavbarSearch = React.forwardRef(_NavbarSearch);\n","import { css } from 'emotion';\nimport type { CSSObject } from '@emotion/serialize';\nimport tokens from '@contentful/f36-tokens';\nimport { ButtonSize, ButtonVariant, ButtonStylesProps } from '../types';\nimport { hexToRGBA, type Density } from '@contentful/f36-utils';\n\nconst variantActiveStyles = (variant: ButtonVariant): CSSObject => {\n switch (variant) {\n case 'primary':\n return { backgroundColor: tokens.blue700 };\n case 'secondary':\n return { backgroundColor: tokens.gray200 };\n case 'positive':\n return { backgroundColor: tokens.green700 };\n case 'negative':\n return { backgroundColor: tokens.gray200 };\n case 'transparent':\n return { backgroundColor: hexToRGBA(tokens.gray900, 0.1) };\n default:\n return {};\n }\n};\n\nconst variantToStyles = (variant: ButtonVariant): CSSObject => {\n switch (variant) {\n case 'primary':\n return {\n color: tokens.colorWhite,\n backgroundColor: tokens.blue500,\n borderColor: 'transparent',\n '&:hover': {\n backgroundColor: tokens.blue600,\n color: tokens.colorWhite,\n },\n '&:active': variantActiveStyles(variant),\n '&:focus-visible': {\n boxShadow: tokens.glowPrimary,\n },\n };\n case 'secondary':\n return {\n color: tokens.gray900,\n backgroundColor: tokens.colorWhite,\n borderColor: tokens.gray300,\n '&:hover': {\n backgroundColor: tokens.gray100,\n color: tokens.gray900,\n },\n '&:active': variantActiveStyles(variant),\n '&:focus': {\n boxShadow: tokens.glowPrimary,\n },\n '&:focus:not(:focus-visible)': {\n boxShadow: 'unset',\n },\n '&:focus-visible': {\n boxShadow: tokens.glowPrimary,\n },\n };\n case 'positive':\n return {\n color: tokens.colorWhite,\n backgroundColor: tokens.green500,\n borderColor: 'transparent',\n '&:hover': {\n backgroundColor: tokens.green600,\n color: tokens.colorWhite,\n },\n '&:active': variantActiveStyles(variant),\n '&:focus-visible': {\n boxShadow: tokens.glowPositive,\n },\n };\n case 'negative':\n return {\n color: tokens.red600,\n backgroundColor: tokens.colorWhite,\n borderColor: tokens.gray300,\n '&:hover': {\n backgroundColor: tokens.gray100,\n color: tokens.red600,\n },\n '&:active': variantActiveStyles(variant),\n '&:focus-visible': {\n boxShadow: tokens.glowNegative,\n },\n };\n case 'transparent':\n return {\n color: tokens.gray900,\n background: 'none',\n borderColor: 'transparent',\n boxShadow: 'none',\n '&:hover': {\n backgroundColor: hexToRGBA(tokens.gray900, 0.05),\n },\n '&:active': variantActiveStyles(variant),\n '&:focus': {\n boxShadow: tokens.glowPrimary,\n },\n '&:focus:not(:focus-visible)': {\n boxShadow: 'unset',\n },\n '&:focus-visible': {\n boxShadow: tokens.glowPrimary,\n },\n };\n default:\n return {};\n }\n};\n\nconst sizeToStyles = (size: ButtonSize, density: Density): CSSObject => {\n const isHighDensity = density === 'high';\n\n switch (size) {\n case 'small':\n return {\n fontSize: isHighDensity ? tokens.fontSizeS : tokens.fontSizeM,\n lineHeight: tokens.lineHeightCondensed,\n padding: isHighDensity\n ? `${tokens.spacing2Xs} ${tokens.spacingXs}`\n : `${tokens.spacing2Xs} ${tokens.spacingS}`,\n minHeight: isHighDensity ? tokens.spacingL : tokens.spacingXl,\n };\n case 'medium':\n return {\n fontSize: isHighDensity ? tokens.fontSizeS : tokens.fontSizeM,\n lineHeight: tokens.lineHeightCondensed,\n padding: isHighDensity\n ? `${tokens.spacingXs} ${tokens.spacingS}`\n : `${tokens.spacingXs} ${tokens.spacingM}`,\n minHeight: isHighDensity ? tokens.spacingXl : '40px',\n };\n case 'large':\n return {\n fontSize: tokens.fontSizeXl,\n lineHeight: tokens.lineHeightXl,\n padding: `${tokens.spacingXs} ${tokens.spacingM}`,\n minHeight: '48px',\n };\n default:\n return {};\n }\n};\n\nconst getButtonIconStyle = ({ hasChildren, variant }) => {\n const align = {\n '&:first-child': { marginRight: tokens.spacing2Xs },\n '&:last-child': { marginLeft: tokens.spacing2Xs },\n };\n\n const margin = hasChildren ? align : {};\n\n return css([\n margin,\n // we want to allow variants for icons, but only in the transparent IconButton\n variant !== 'transparent' &&\n hasChildren && {\n '& svg': {\n fill: 'currentColor',\n },\n },\n ]);\n};\n\nexport const getStyles = () => ({\n button: ({\n variant,\n size,\n density,\n isActive,\n isDisabled,\n isFullWidth,\n }: ButtonStylesProps & { density: Density }) =>\n css({\n boxSizing: 'border-box',\n border: `1px solid`,\n boxShadow: '0px 1px 0px rgb(25, 37, 50, 0.08)',\n borderRadius:\n density === 'high'\n ? tokens.borderRadiusSmall\n : tokens.borderRadiusMedium,\n cursor: isDisabled ? 'not-allowed' : 'pointer',\n fontFamily: tokens.fontStackPrimary,\n opacity: isDisabled ? 0.5 : 1,\n display: isFullWidth ? 'flex' : 'inline-flex',\n minWidth: isFullWidth ? '100%' : 'auto',\n maxWidth: isFullWidth ? '100%' : '240px',\n overflow: 'hidden',\n flexShrink: 0,\n justifyContent: 'center',\n alignItems: 'center',\n fontWeight: tokens.fontWeightMedium,\n outline: 'none',\n textDecoration: 'none',\n margin: 0, // remove the default margin in Safari.\n transition: `background ${tokens.transitionDurationShort} ${tokens.transitionEasingDefault},\n opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault},\n border-color ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n ...variantToStyles(variant),\n ...sizeToStyles(size, density),\n ...(isActive\n ? {\n transition: 'none',\n '&, &:focus': variantActiveStyles(variant),\n }\n : {}),\n }),\n buttonIcon: getButtonIconStyle,\n buttonContent: css({\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n }),\n});\n","import { css, keyframes } from 'emotion';\nimport type { SpinnerSize } from './types';\n\nconst sizes: { [key in SpinnerSize]: string } = {\n large: '36px',\n medium: '20px',\n small: '14px',\n};\n\nexport const getStyles = () => {\n const animations = {\n scale1: keyframes`\n 0% {\n transform: scale(1, 1);\n }\n 6.666667% {\n transform: scale(1.5, 0.5);\n }\n 13.333333% {\n transform: scale(1, 1);\n }\n 26.666667% {\n transform: scale(1, 1);\n }\n 33.333333% {\n transform: scale(1, 1);\n }\n 40% {\n transform: scale(1, 1);\n }\n 53.333333% {\n transform: scale(1, 1);\n }\n 60% {\n transform: scale(1.5, 0.5);\n }\n 66.666667% {\n transform: scale(1, 1);\n }\n 100% {\n transform: scale(1, 1);\n }\n `,\n scale2: keyframes`\n 0% {\n transform: scale(1, 1);\n }\n 13.333333% {\n transform: scale(1, 1);\n }\n 20% {\n transform: scale(1.5, 0.5);\n }\n 26.666667% {\n transform: scale(1, 1);\n }\n 40% {\n transform: scale(1, 1);\n }\n 46.666667% {\n transform: scale(1, 1);\n }\n 53.333333% {\n transform: scale(1, 1);\n }\n 66.666667% {\n transform: scale(1, 1);\n }\n 73.333333% {\n transform: scale(1.5, 0.5);\n }\n 80% {\n transform: scale(1, 1);\n }\n 100% {\n transform: scale(1, 1);\n }\n `,\n scale3: keyframes`\n 0% {\n transform: scale(1, 1);\n }\n 26.666667% {\n transform: scale(1, 1);\n }\n 33.333333% {\n transform: scale(1.5, 0.5);\n }\n 40% {\n transform: scale(1, 1);\n }\n 53.333333% {\n transform: scale(1, 1);\n }\n 60% {\n transform: scale(1, 1);\n }\n 66.666667% {\n transform: scale(1, 1);\n }\n 80% {\n transform: scale(1, 1);\n }\n 86.666667% {\n transform: scale(1.5, 0.5);\n }\n 93.333333% {\n transform: scale(1, 1);\n }\n 100% {\n transform: scale(1, 1);\n }\n `,\n translate1: keyframes`\n 0% {\n transform: translate(10px, 33.528168px);\n }\n 6.666667% {\n transform: translate(10px, 41.764084px);\n }\n 13.333333% {\n transform: translate(10px, 33.528168px);\n }\n 26.666667% {\n transform: translate(10px, -2.651608px);\n }\n 33.333333% {\n transform: translate(10px, -4.471832px);\n }\n 40% {\n transform: translate(10px, -2.651608px);\n }\n 53.333333% {\n transform: translate(10px, 33.528168px);\n }\n 60% {\n transform: translate(10px, 41.764084px);\n }\n 66.666667% {\n transform: translate(10px, 33.528168px);\n }\n 100% {\n transform: translate(10px, 33.528168px);\n }\n `,\n translate2: keyframes`\n 0% {\n transform: translate(30px, 33.528168px);\n }\n 13.333333% {\n transform: translate(30px, 33.528168px);\n }\n 20% {\n transform: translate(30px, 41.764084px);\n }\n 26.666667% {\n transform: translate(30px, 33.528168px);\n }\n 40% {\n transform: translate(30px, -2.651608px);\n }\n 46.666667% {\n transform: translate(30px, -4.471832px);\n }\n 53.333333% {\n transform: translate(30px, -2.651608px);\n }\n 66.666667% {\n transform: translate(30px, 33.528168px);\n }\n 73.333333% {\n transform: translate(30px, 41.764084px);\n }\n 80% {\n transform: translate(30px, 33.528168px);\n }\n 100% {\n transform: translate(30px, 33.528168px);\n }\n `,\n translate3: keyframes`\n 0% {\n transform: translate(50px, 33.528168px);\n }\n 26.666667% {\n transform: translate(50px, 33.528168px);\n }\n 33.333333% {\n transform: translate(50px, 41.764084px);\n }\n 40% {\n transform: translate(50px, 33.528168px);\n }\n 53.333333% {\n transform: translate(50px, -2.651608px);\n }\n 60% {\n transform: translate(50px, -4.471832px);\n }\n 66.666667% {\n transform: translate(50px, -2.651608px);\n }\n 80% {\n transform: translate(50px, 33.528168px);\n }\n 86.666667% {\n transform: translate(50px, 41.764084px);\n }\n 93.333333% {\n transform: translate(50px, 33.528168px);\n }\n 100% {\n transform: translate(50px, 33.528168px);\n }\n `,\n };\n\n return {\n root: (props: { size: SpinnerSize; customSize?: number }) =>\n css({\n height: props.customSize ? `${props.customSize}px` : undefined,\n verticalAlign: 'middle',\n width: props.customSize ? `${props.customSize}px` : sizes[props.size],\n }),\n circle1Scale: css({\n animation: `${animations.scale1} 1s linear infinite normal forwards;`,\n }),\n circle2Scale: css({\n animation: `${animations.scale2} 1s linear infinite normal forwards;`,\n }),\n circle3Scale: css({\n animation: `${animations.scale3} 1s linear infinite normal forwards;`,\n }),\n circle1Translate: css({\n animation: `${animations.translate1} 1s linear infinite normal forwards;`,\n }),\n circle2Translate: css({\n animation: `${animations.translate2} 1s linear infinite normal forwards;`,\n }),\n circle3Translate: css({\n animation: `${animations.translate3} 1s linear infinite normal forwards;`,\n }),\n };\n};\n","import { css } from 'emotion';\nimport { getGlowOnFocusStyles } from '../utils.styles';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getNavbarSearchStyles = () => ({\n navbarSearch: css(\n {\n // default button reset styles\n minWidth: '24px',\n width: '24px',\n minHeight: '24px',\n height: '24px',\n svg: {\n fill: tokens.gray700,\n },\n },\n getGlowOnFocusStyles(),\n ),\n});\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { getNavbarSwitcherItemStyles } from './NavbarSwitcherItem.styles';\nimport { NavbarEnvVariant } from './NavbarEnvVariant';\nimport {\n Flex,\n type CommonProps,\n type ExpandProps,\n type PropsWithHTMLElement,\n} from '@contentful/f36-core';\n\ntype NavbarSwitcherItemOwnProps = CommonProps & {\n children?: React.ReactNode;\n isCircle?: boolean;\n envVariant?: 'master' | 'non-master';\n isAlias?: boolean;\n};\n\nexport type NavbarSwitcherItemProps = PropsWithHTMLElement<\n NavbarSwitcherItemOwnProps,\n 'li'\n>;\n\nfunction _NavbarSwitcherItem(\n props: ExpandProps<NavbarSwitcherItemProps>,\n ref: React.Ref<HTMLLIElement>,\n) {\n const {\n children,\n isCircle,\n className,\n envVariant,\n isAlias,\n testId = 'cf-ui-navbar-switcher-item',\n ...otherProps\n } = props;\n const styles = getNavbarSwitcherItemStyles();\n const classes = cx(styles.breadcrumbsItem, className, {\n [styles.breadcrumbsItemCircle]: isCircle,\n [styles.breadcrumbsItemEnvMaster]: envVariant === 'master',\n [styles.breadcrumbsItemEnvNonMaster]: envVariant === 'non-master',\n });\n\n return (\n <li {...otherProps} ref={ref} className={classes} data-test-id={testId}>\n <Flex fullHeight justifyContent=\"center\" alignItems=\"center\">\n {envVariant && <NavbarEnvVariant isAlias={isAlias} />}\n <span>{children}</span>\n </Flex>\n </li>\n );\n}\n\nexport const NavbarSwitcherItem = React.forwardRef(_NavbarSwitcherItem);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { mqs } from '../utils.styles';\n\nconst mobileIcon = {\n display: 'none',\n '&:first-child': {\n display: 'block',\n },\n\n [mqs.medium]: {\n display: 'block',\n '&:first-child': {\n display: 'none',\n },\n },\n};\n\nexport const getNavbarSwitcherItemStyles = () => ({\n breadcrumbsItem: css({\n position: 'relative',\n alignItems: 'center',\n justifyContent: 'center',\n border: `solid 1px ${tokens.gray300}`,\n borderLeft: 'none',\n display: 'inline-flex',\n margin: 0,\n minWidth: 0,\n padding: `0 ${tokens.spacingXs}`,\n height: tokens.spacingL,\n borderRadius: '3rem',\n zIndex: 2,\n\n whiteSpace: 'nowrap',\n '&:first-child': {\n minWidth: '24px',\n },\n '&:nth-child(2)': {\n zIndex: 1,\n marginLeft: '-10px',\n paddingLeft: tokens.spacingM,\n borderRadius: `0 3rem 3rem 0`,\n span: {\n maxWidth: '80px',\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n [mqs.large]: {\n maxWidth: '100%',\n },\n },\n },\n '&:nth-child(3)': {\n marginLeft: '-10px',\n paddingLeft: tokens.spacingM,\n borderRadius: `0 3rem 3rem 0`,\n fontFamily: tokens.fontStackMonospace,\n fontSize: tokens.fontSizeS,\n fontWeight: tokens.fontWeightMedium,\n zIndex: 0,\n span: {\n maxWidth: '40px',\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n [mqs.large]: {\n maxWidth: '100%',\n },\n },\n '> div': {\n [mqs.medium]: {\n gap: tokens.spacing2Xs,\n },\n },\n },\n }),\n breadcrumbsItemCircle: css({\n border: `solid 1px ${tokens.gray300}`,\n borderRadius: '50%',\n color: tokens.gray400,\n padding: 0,\n display: 'flex',\n justifyContent: 'center',\n fontSize: '11px',\n width: tokens.spacingL,\n height: tokens.spacingL,\n }),\n breadcrumbsItemEnvMaster: css({\n color: tokens.green600,\n ' svg': {\n ...mobileIcon,\n fill: tokens.green600,\n },\n }),\n breadcrumbsItemEnvNonMaster: css({\n color: tokens.orange500,\n svg: {\n ...mobileIcon,\n fill: tokens.orange500,\n },\n }),\n});\n","import React from 'react';\nimport { NavbarSwitcherItemProps } from './NavbarSwitcherItem';\nimport { CircleIcon } from '../icons';\nimport { EnvironmentAliasIcon, EnvironmentIcon } from '@contentful/f36-icons';\n\nexport type NavbarEnvVariantProps = Pick<NavbarSwitcherItemProps, 'isAlias'>;\n\nexport function NavbarEnvVariant({ isAlias }: NavbarEnvVariantProps) {\n return (\n <>\n <CircleIcon key=\"mobile-icon\" size=\"tiny\" />\n {isAlias ? (\n <EnvironmentAliasIcon key=\"full-icon\" size=\"tiny\" />\n ) : (\n <EnvironmentIcon key=\"full-icon\" size=\"tiny\" />\n )}\n </>\n );\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { HelpIcon } from '../icons';\nimport {\n type CommonProps,\n type PropsWithHTMLElement,\n type ExpandProps,\n} from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { NavbarMenu } from '../NavbarMenu/NavbarMenu';\nimport { getNavbarHelpStyles } from './NavbarHelp.styles';\n\ntype NavbarHelpOwnProps = CommonProps & {\n children: React.ReactNode;\n};\n\nexport type NavbarHelpProps = PropsWithHTMLElement<\n NavbarHelpOwnProps,\n 'button'\n>;\n\nfunction _NavbarHelp(\n props: ExpandProps<NavbarHelpProps>,\n ref: React.Ref<HTMLButtonElement>,\n) {\n const {\n children,\n className,\n testId = 'cf-ui-navbar-help-trigger',\n ...otherProps\n } = props;\n\n const styles = getNavbarHelpStyles();\n\n return (\n <NavbarMenu\n testId=\"cf-ui-navbar-help-menu\"\n trigger={\n <Button\n aria-label=\"Help Menu\"\n {...otherProps}\n as=\"button\"\n ref={ref}\n className={cx(styles.navbarHelp, className)}\n testId={testId}\n variant=\"transparent\"\n size=\"small\"\n startIcon={<HelpIcon size=\"medium\" />}\n >\n Help\n </Button>\n }\n >\n {children}\n </NavbarMenu>\n );\n}\n\nexport const NavbarHelp = React.forwardRef(_NavbarHelp);\n","import { css } from 'emotion';\nimport { getGlowOnFocusStyles } from '../utils.styles';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getNavbarHelpStyles = () => ({\n navbarHelp: css(\n {\n // default button reset styles\n fontSize: tokens.fontSizeS,\n padding: `0 ${tokens.spacing2Xs}`,\n width: 'max-content',\n minHeight: '24px',\n height: '24px',\n color: tokens.gray700,\n svg: {\n fill: tokens.gray700,\n },\n },\n getGlowOnFocusStyles(),\n ),\n});\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { getNavbarBadgeStyles } from './NavbarBadge.styles';\nimport type {\n CommonProps,\n ExpandProps,\n PolymorphicComponent,\n PolymorphicProps,\n} from '@contentful/f36-core';\n\nconst NAVBAR_BADGE_DEFAULT_TAG = 'div';\n\ntype NavbarBadgeOwnProps = CommonProps & {\n children?: React.ReactNode;\n as?: React.ElementType;\n};\n\nexport type NavbarBadgeProps<\n E extends React.ElementType = typeof NAVBAR_BADGE_DEFAULT_TAG,\n> = PolymorphicProps<NavbarBadgeOwnProps, E>;\n\nfunction _NavbarBadge(\n props: NavbarBadgeProps<React.ElementType>,\n ref: React.Ref<any>,\n) {\n const {\n as: Comp = NAVBAR_BADGE_DEFAULT_TAG,\n children,\n className,\n testId = 'cf-ui-navbar-badge',\n ...otherProps\n } = props;\n const styles = getNavbarBadgeStyles();\n\n return (\n <Comp\n {...otherProps}\n ref={ref}\n className={cx(styles.navbarBadge, className)}\n data-test-id={testId}\n >\n {children}\n </Comp>\n );\n}\n\nexport const NavbarBadge: PolymorphicComponent<\n ExpandProps<NavbarBadgeOwnProps>,\n typeof NAVBAR_BADGE_DEFAULT_TAG\n> = React.forwardRef(_NavbarBadge);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getNavbarBadgeStyles = () => ({\n navbarBadge: css({\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n background: 'none',\n border: `1px solid ${tokens.purple600}`,\n margin: 0,\n outline: 'none',\n fontSize: tokens.fontSizeS,\n lineHeight: tokens.lineHeightS,\n fontWeight: tokens.fontWeightMedium,\n textAlign: 'center',\n padding: `0 ${tokens.spacingXs}`,\n textDecoration: 'none',\n color: `${tokens.purple600}!important`,\n borderRadius: '1.75rem',\n }),\n});\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { getNavbarTopbarItemStyles } from './NavbarTopbarItem.styles';\nimport type {\n CommonProps,\n ExpandProps,\n PolymorphicComponent,\n PolymorphicProps,\n} from '@contentful/f36-core';\n\nconst NAVBAR_BADGE_DEFAULT_TAG = 'button';\n\ntype NavbarTopbarItemOwnProps = CommonProps & {\n children?: React.ReactNode;\n};\n\nexport type NavbarTopbarItemProps<\n E extends React.ElementType = typeof NAVBAR_BADGE_DEFAULT_TAG,\n> = PolymorphicProps<NavbarTopbarItemOwnProps, E>;\n\nfunction _NavbarTopbarItem<\n E extends React.ElementType = typeof NAVBAR_BADGE_DEFAULT_TAG,\n>(props: NavbarTopbarItemProps<E>, ref: React.Ref<any>) {\n const {\n as: Comp = NAVBAR_BADGE_DEFAULT_TAG,\n children,\n className,\n testId = 'cf-ui-navbar-topbar-item',\n ...otherProps\n } = props;\n const styles = getNavbarTopbarItemStyles();\n\n return (\n <Comp\n {...otherProps}\n ref={ref}\n className={cx(styles.navbarTopItem, className)}\n data-test-id={testId}\n >\n {children}\n </Comp>\n );\n}\n\nexport const NavbarTopbarItem: PolymorphicComponent<\n ExpandProps<NavbarTopbarItemOwnProps>,\n typeof NAVBAR_BADGE_DEFAULT_TAG\n> = React.forwardRef(_NavbarTopbarItem);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { getGlowOnFocusStyles } from '../utils.styles';\nimport { hexToRGBA } from '@contentful/f36-utils';\nexport const getNavbarTopbarItemStyles = () => ({\n navbarTopItem: css(\n {\n // default button reset styles\n margin: 0,\n background: 'none',\n border: '1px solid',\n borderColor: 'transparent',\n cursor: 'pointer',\n display: 'flex',\n gap: tokens.spacing2Xs,\n alignItems: 'center',\n lineHeight: tokens.lineHeightDefault,\n color: tokens.gray700,\n padding: `0 ${tokens.spacing2Xs}`,\n minHeight: '24px',\n fontSize: tokens.fontSizeS,\n fontWeight: tokens.fontWeightMedium,\n outline: 'none',\n borderRadius: tokens.borderRadiusMedium,\n\n '&:hover': {\n backgroundColor: hexToRGBA(tokens.gray900, 0.05),\n },\n svg: {\n fill: 'currentColor',\n },\n },\n getGlowOnFocusStyles(),\n ),\n});\n"]}
1
+ {"version":3,"sources":["../../src/CompoundNavbar.ts","../../src/Navbar.tsx","../../src/Navbar.styles.ts","../../src/utils.styles.ts","../../src/icons/CircleIcon.tsx","../../src/icons/ArrowDownIcon.tsx","../../src/icons/HelpIcon.tsx","../../src/icons/SearchIcon.tsx","../../src/icons/ContentfulLogoIcon.tsx","../../src/NavbarAccount/NavbarAccount.tsx","../../src/NavbarAccount/NavbarAccount.styles.ts","../../src/NavbarMenu/NavbarMenu.tsx","../../src/NavbarMenu/NavbarMenu.styles.ts","../../src/NavbarAccount/NavbarAccountSkeleton.tsx","../../src/NavbarItem/NavbarItem.tsx","../../src/NavbarItem/NavbarItem.styles.ts","../../src/NavbarItemIcon/NavbarItemIcon.tsx","../../src/NavbarItemIcon/NavbarItemIcon.styles.ts","../../src/NavbarItem/NavbarItemSkeleton.tsx","../../src/NavbarMenuItem/NavbarMenuItem.tsx","../../src/NavbarMenuItem/NavbarMenuItem.styles.ts","../../src/NavbarMenuItem/NavbarMenuItemSkeleton.tsx","../../src/NavbarSwitcher/NavbarSwitcher.tsx","../../src/NavbarSwitcher/NavbarSwitcher.styles.ts","../../src/NavbarSwitcher/NavbarSwitcherSkeleton.tsx","../../src/NavbarSearch/NavbarSearch.tsx","../../../button/src/Button/Button.styles.ts","../../../spinner/src/Spinner.styles.ts","../../src/NavbarSearch/NavbarSearch.styles.ts","../../src/NavbarSwitcherItem/NavbarSwitcherItem.tsx","../../src/NavbarSwitcherItem/NavbarSwitcherItem.styles.ts","../../src/NavbarSwitcherItem/NavbarEnvVariant.tsx","../../src/NavbarHelp/NavbarHelp.tsx","../../src/NavbarHelp/NavbarHelp.styles.ts","../../src/NavbarBadge/NavbarBadge.tsx","../../src/NavbarBadge/NavbarBadge.styles.ts","../../src/NavbarTopbarItem/NavbarTopbarItem.tsx","../../src/NavbarTopbarItem/NavbarTopbarItem.styles.ts"],"names":["MenuDivider","MenuSectionTitle","Box","Flex","React","css","tokens","mqs","getGlowOnFocusStyles","shadow","getNavbarStyles","maxWidth","variant","CircleIcon","N","ArrowDownIcon","HelpIcon","SearchIcon","generateIcon","ContentfulLogoIcon","_Navbar","props","ref","_a","account","badge","bottomRightItems","children","className","contentMaxWidth","help","logo","search","switcher","testId","topRightItems","otherProps","__objRest","styles","__spreadProps","__spreadValues","Navbar","cx","hexToRGBA","notificationVarianColorMap","getNavbarAccountStyles","Menu","getNavbarMenuStyles","NavbarMenu","trigger","onOpen","onClose","Avatar","_NavbarAccount","avatar","initials","username","hasNotification","notificationVariant","NavbarAccount","SkeletonContainer","SkeletonImage","NavbarAccountSkeleton","ariaLabel","getNavbarItemActiveStyles","commonItemStyles","getNavbarItemStyles","getNavbarItemSkeletonStyles","getNavbarItemIconStyles","NavbarItemIcon","_b","icon","NAVBAR_ITEM_DEFAULT_TAG","_NavbarItem","Comp","title","isActive","isMenuTrigger","isNavbarItemHasMenu","item","NavbarItem","SkeletonText","NavbarItemSkeleton","estimatedWidth","getNavbarMenuItemStyles","ExternalLinkIcon","NAVBAR_MENU_ITEM_DEFAULT_TAG","_NavbarMenuItem","itemIsExternalLink","isExternalLink","externalIcon","NavbarMenuItem","SkeletonBodyText","NavbarMenuItemSkeleton","getNavbarSwitcherStyles","_NavbarSwitcher","NavbarSwitcher","SkeletonDisplayText","NavbarSwitcherSkeleton","m","Stack","s","forwardRef","i","T","v","c","x","f","r","a","S","d","g","n","h","y","keyframes","getNavbarSearchStyles","_NavbarSearch","Z","NavbarSearch","mobileIcon","getNavbarSwitcherItemStyles","EnvironmentAliasIcon","EnvironmentIcon","NavbarEnvVariant","isAlias","_NavbarSwitcherItem","isCircle","envVariant","classes","NavbarSwitcherItem","getNavbarHelpStyles","_NavbarHelp","B","NavbarHelp","getNavbarBadgeStyles","NAVBAR_BADGE_DEFAULT_TAG","_NavbarBadge","NavbarBadge","getNavbarTopbarItemStyles","_NavbarTopbarItem","NavbarTopbarItem"],"mappings":"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","sourcesContent":["import { MenuDivider } from '@contentful/f36-menu';\nimport { MenuSectionTitle } from '@contentful/f36-menu';\nimport { Navbar as OriginalNavbar } from './Navbar';\n\nimport { NavbarAccount, NavbarAccountSkeleton } from './NavbarAccount';\nimport { NavbarItem, NavbarItemSkeleton } from './NavbarItem';\nimport { NavbarMenuItem, NavbarMenuItemSkeleton } from './NavbarMenuItem';\nimport { NavbarSwitcher, NavbarSwitcherSkeleton } from './NavbarSwitcher';\n\nimport { NavbarSearch } from './NavbarSearch/NavbarSearch';\nimport { NavbarSwitcherItem } from './NavbarSwitcherItem/NavbarSwitcherItem';\nimport { NavbarHelp } from './NavbarHelp/NavbarHelp';\nimport { NavbarBadge } from './NavbarBadge/NavbarBadge';\nimport { NavbarTopbarItem } from './NavbarTopbarItem/NavbarTopbarItem';\n\ntype CompoundNavbar = typeof OriginalNavbar & {\n Item: typeof NavbarItem;\n ItemSkeleton: typeof NavbarItemSkeleton;\n MenuItem: typeof NavbarMenuItem;\n MenuItemSkeleton: typeof NavbarMenuItemSkeleton;\n MenuDivider: typeof MenuDivider;\n MenuSectionTitle: typeof MenuSectionTitle;\n Switcher: typeof NavbarSwitcher;\n SwitcherSkeleton: typeof NavbarSwitcherSkeleton;\n SwitcherItem: typeof NavbarSwitcherItem;\n Search: typeof NavbarSearch;\n Help: typeof NavbarHelp;\n Account: typeof NavbarAccount;\n AccountSkeleton: typeof NavbarAccountSkeleton;\n Badge: typeof NavbarBadge;\n TopbarItem: typeof NavbarTopbarItem;\n};\n\nexport const Navbar = OriginalNavbar as CompoundNavbar;\nNavbar.Item = NavbarItem;\nNavbar.ItemSkeleton = NavbarItemSkeleton;\nNavbar.MenuItem = NavbarMenuItem;\nNavbar.MenuItemSkeleton = NavbarMenuItemSkeleton;\nNavbar.MenuDivider = MenuDivider;\nNavbar.MenuSectionTitle = MenuSectionTitle;\nNavbar.Switcher = NavbarSwitcher;\nNavbar.SwitcherSkeleton = NavbarSwitcherSkeleton;\nNavbar.SwitcherItem = NavbarSwitcherItem;\nNavbar.Search = NavbarSearch;\nNavbar.Help = NavbarHelp;\nNavbar.Account = NavbarAccount;\nNavbar.AccountSkeleton = NavbarAccountSkeleton;\nNavbar.Badge = NavbarBadge;\nNavbar.TopbarItem = NavbarTopbarItem;\n","import {\n Box,\n type CommonProps,\n type ExpandProps,\n Flex,\n} from '@contentful/f36-core';\nimport React from 'react';\nimport { getNavbarStyles } from './Navbar.styles';\nimport { ContentfulLogoIcon } from './icons';\n\ntype NavbarOwnProps = CommonProps & {\n account?: React.ReactNode;\n badge?: React.ReactNode;\n /**\n * Items that will be rendered on the bottom-right of the navbar.\n * Useful for separating other navigation items from main ones, (e.g. separating \"Settings\" from all other navigation items).\n */\n bottomRightItems?: React.ReactNode;\n children?: React.ReactNode;\n /**\n * Defines the max-width of the content inside the navbar.\n * @default '100%'\n */\n contentMaxWidth?: string;\n help?: React.ReactNode;\n /**\n * Will be displayed instead of the default Contentful logo\n */\n logo?: React.ReactNode;\n search?: React.ReactNode;\n switcher?: React.ReactNode;\n /**\n * Items that will be rendered on the top-right of the navbar.\n * Useful for providing additional context or actions to the user (e.g. a Feedback form link).\n */\n topRightItems?: React.ReactNode;\n /**\n * Describes the size variation of the navbar\n */\n variant?: 'wide' | 'fullscreen';\n};\n\n// expose only the HTML props that are needed to not pollute the API\ntype NavbarHTMLElementProps = Pick<React.ComponentPropsWithoutRef<'div'>, 'id'>;\n\nexport type NavbarProps = NavbarHTMLElementProps & NavbarOwnProps;\n\nfunction _Navbar(props: ExpandProps<NavbarProps>, ref: React.Ref<HTMLElement>) {\n const {\n account,\n badge,\n bottomRightItems,\n children,\n className,\n contentMaxWidth = '100%',\n help,\n logo,\n search,\n switcher,\n testId = 'cf-ui-navbar',\n topRightItems,\n variant = 'wide',\n ...otherProps\n } = props;\n const styles = getNavbarStyles(contentMaxWidth, variant);\n\n return (\n <Box {...otherProps} ref={ref} testId={testId} className={className}>\n <Flex className={styles.containerTop}>\n <Flex\n className={styles.containerTopContent}\n justifyContent=\"space-between\"\n >\n <Flex alignItems=\"center\" gap=\"spacingL\">\n {logo || <ContentfulLogoIcon className={styles.logo} />}\n {switcher}\n </Flex>\n <Flex alignItems=\"center\" gap=\"spacingXs\">\n {topRightItems}\n {badge}\n {search}\n {help}\n {account}\n </Flex>\n </Flex>\n </Flex>\n\n <Flex className={styles.containerBottom}>\n <Flex\n className={styles.containerBottomContent}\n justifyContent=\"space-between\"\n >\n <Flex as=\"nav\" aria-label=\"Main Navigation\">\n {children}\n </Flex>\n {bottomRightItems && <Flex>{bottomRightItems}</Flex>}\n </Flex>\n </Flex>\n </Box>\n );\n}\n\nexport const Navbar = React.forwardRef(_Navbar);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { mqs } from './utils.styles';\n\nexport const getNavbarStyles = (maxWidth: string, variant: string) => ({\n containerTop: css({\n justifyContent: 'center',\n backgroundColor: tokens.gray100,\n }),\n containerBottom: css({\n justifyContent: 'center',\n backgroundColor: tokens.gray100,\n }),\n containerTopContent: css({\n width: '100%',\n maxWidth: variant === 'wide' ? '1524px' : maxWidth,\n padding: tokens.spacingXs,\n minHeight: tokens.spacingL,\n [mqs.medium]: {\n padding: `${tokens.spacingXs} 20px`,\n },\n }),\n containerBottomContent: css({\n width: '100%',\n maxWidth: variant === 'wide' ? '1524px' : maxWidth,\n padding: 0,\n paddingTop: tokens.spacing2Xs,\n minHeight: '2.5rem',\n overflow: 'auto',\n [mqs.medium]: {\n padding: `${tokens.spacing2Xs} ${tokens.spacingXs}`,\n },\n }),\n logo: css({\n height: '28px',\n width: '28px',\n }),\n});\n","import tokens from '@contentful/f36-tokens';\n\ntype screens = 'medium' | 'large' | 'xlarge';\ntype mediaqueries = Record<screens, string>;\nexport const mqs: mediaqueries = {\n medium: '@media (min-width: 480px)',\n large: '@media (min-width: 768px)',\n xlarge: '@media (min-width: 1920px)',\n};\n\nexport const getGlowOnFocusStyles = (shadow: string = tokens.glowPrimary) => ({\n '&:focus': {\n boxShadow: shadow,\n },\n '&:focus:not(:focus-visible)': {\n boxShadow: 'unset',\n },\n '&:focus-visible': {\n boxShadow: shadow,\n },\n});\n","import React from 'react';\nimport { generateIcon } from '@contentful/f36-icon';\n\nexport const CircleIcon = /*#__PURE__*/ generateIcon({\n name: 'CircleIcon',\n viewBox: '0 0 24 24',\n path: (\n <path\n d=\"M11.994 6.526A5.47 5.47 0 0 0 6.526 12a5.47 5.47 0 0 0 5.468 5.473A5.476 5.476 0 0 0 17.473 12a5.477 5.477 0 0 0-5.479-5.474ZM12 15.447a3.448 3.448 0 1 1 0-6.896 3.448 3.448 0 0 1 0 6.896Z\"\n fill=\"currentFill\"\n />\n ),\n});\n","import React from 'react';\nimport { generateIcon } from '@contentful/f36-icon';\n\nexport const ArrowDownIcon = /*#__PURE__*/ generateIcon({\n name: 'ArrowDownIcon',\n viewBox: '0 0 12 20',\n path: (\n <path\n d=\"M3.03076 8C2.20109 8 1.73228 8.95209 2.23814 9.60971L5.20727 13.4696C5.60757 13.99 6.39223 13.99 6.79252 13.4696L9.76166 9.60971C10.2675 8.95209 9.79871 8 8.96904 8L3.03076 8Z\"\n fill=\"#9FA8B2\"\n />\n ),\n});\n","import React from 'react';\nimport { generateIcon } from '@contentful/f36-icon';\n\nexport const HelpIcon = /*#__PURE__*/ generateIcon({\n name: 'HelpIcon',\n viewBox: '0 0 24 24',\n path: (\n <>\n <g clipPath=\"url(#HelpIcon_svg__a)\">\n <path\n d=\"M12 2.25A9.75 9.75 0 1 0 21.75 12 9.769 9.769 0 0 0 12 2.25ZM12 18a1.125 1.125 0 1 1 0-2.25A1.125 1.125 0 0 1 12 18Zm.75-4.584v.084a.75.75 0 1 1-1.5 0v-.75A.75.75 0 0 1 12 12a1.875 1.875 0 1 0-1.875-1.875.75.75 0 1 1-1.5 0 3.375 3.375 0 1 1 4.125 3.29Z\"\n fill=\"currentFill\"\n />\n </g>\n <defs>\n <clipPath id=\"HelpIcon_svg__a\">\n <path fill=\"currentFill\" d=\"M0 0h24v24H0z\" />\n </clipPath>\n </defs>\n </>\n ),\n});\n","import React from 'react';\nimport { generateIcon } from '@contentful/f36-icon';\n\nexport const SearchIcon = /*#__PURE__*/ generateIcon({\n name: 'SearchIcon',\n viewBox: '0 0 24 24',\n path: (\n <>\n <g clipPath=\"url(#SearchIcon_svg__a)\">\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M6 11.125a5.125 5.125 0 1 1 10.25 0 5.125 5.125 0 0 1-10.25 0ZM11.125 4a7.125 7.125 0 1 0 4.282 12.82l2.886 2.887a1 1 0 0 0 1.414-1.414l-2.886-2.887A7.125 7.125 0 0 0 11.125 4Z\"\n fill=\"currentFill\"\n />\n </g>\n <defs>\n <clipPath id=\"SearchIcon_svg__a\">\n <path fill=\"#fff\" d=\"M0 0h24v24H0z\" />\n </clipPath>\n </defs>\n </>\n ),\n});\n","import React from 'react';\nimport { generateIcon } from '@contentful/f36-icon-alpha';\n\nexport const ContentfulLogoIcon = /*#__PURE__*/ generateIcon({\n name: 'ContentfulLogoIcon',\n viewBox: '0 0 28 28',\n path: (\n <>\n <path\n fill=\"#1773EB\"\n d=\"M10.713 5.001c.845.843 1.167 2.079.845 3.228A6.663 6.663 0 0 1 15 7.276h.026a6.7 6.7 0 0 1 4.743 1.988 2.64 2.64 0 1 0 3.746-3.715A11.96 11.96 0 0 0 15.042 2h-.046a11.933 11.933 0 0 0-6.691 2.036h.074a3.287 3.287 0 0 1 2.334.967V5Z\"\n />\n <path\n fill=\"#E44F20\"\n d=\"M21.594 17.999a2.64 2.64 0 0 0-1.858.766 6.703 6.703 0 0 1-4.732 1.951h-.025a6.65 6.65 0 0 1-3.447-.968A3.3 3.3 0 0 1 8.35 23.93h-.086A11.926 11.926 0 0 0 14.96 26h.046a11.94 11.94 0 0 0 8.449-3.484 2.64 2.64 0 0 0-1.859-4.514V18h-.002Z\"\n />\n <path\n fill=\"#FFDA00\"\n d=\"M6.013 18.295a3.27 3.27 0 0 1 2.334-.967c.302 0 .603.04.894.122a6.7 6.7 0 0 1 .013-6.928A3.3 3.3 0 0 1 5.08 7.335v-.09a11.999 11.999 0 0 0-.032 13.453v-.07a3.27 3.27 0 0 1 .966-2.333Z\"\n />\n <path\n fill=\"#1773EB\"\n d=\"M8.379 4.62c-.75 0-1.276.312-1.913.949-.607.605-.798 1.135-.8 1.766A2.712 2.712 0 1 0 8.38 4.62Z\"\n />\n <path\n fill=\"#E44F20\"\n d=\"M5.628 20.631c0 .75.31 1.276.946 1.912.607.606 1.136.799 1.766.8a2.703 2.703 0 1 0-.017-5.407 2.703 2.703 0 0 0-2.695 2.704v-.009Z\"\n />\n </>\n ),\n});\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { getNavbarAccountStyles } from './NavbarAccount.styles';\nimport {\n type PropsWithHTMLElement,\n type CommonProps,\n type ExpandProps,\n} from '@contentful/f36-core';\nimport { NavbarMenu } from '../NavbarMenu/NavbarMenu';\nimport { Avatar } from '@contentful/f36-avatar';\nimport { Flex } from '@contentful/f36-core';\n\ntype NavbarAccountOwnProps = CommonProps & {\n children: React.ReactNode;\n username: string;\n avatar?: string;\n initials?: string;\n hasNotification?: boolean;\n /**\n * @default 'warning'\n */\n notificationVariant?: 'warning' | 'negative' | 'info';\n};\n\nexport type NavbarAccountProps = PropsWithHTMLElement<\n NavbarAccountOwnProps,\n 'button'\n>;\n\nfunction _NavbarAccount(\n props: ExpandProps<NavbarAccountProps>,\n ref: React.Ref<HTMLButtonElement>,\n) {\n const {\n children,\n className,\n testId = 'cf-ui-navbar-account-trigger',\n avatar,\n initials,\n username,\n hasNotification,\n notificationVariant = 'warning',\n ...otherProps\n } = props;\n const styles = getNavbarAccountStyles();\n\n return (\n <NavbarMenu\n trigger={\n <Flex\n as=\"button\"\n {...otherProps}\n ref={ref}\n className={cx(styles.navbarAccount, className)}\n testId={testId}\n alignItems=\"center\"\n >\n <Avatar\n src={avatar}\n initials={initials}\n size=\"small\"\n variant=\"user\"\n />\n {hasNotification ? (\n <span className={styles.notificationIcon(notificationVariant)} />\n ) : null}\n </Flex>\n }\n >\n {children}\n </NavbarMenu>\n );\n}\n\nexport const NavbarAccount = React.forwardRef(_NavbarAccount);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { NavbarAccountProps } from './NavbarAccount';\nimport { getGlowOnFocusStyles } from '../utils.styles';\nimport { hexToRGBA } from '@contentful/f36-utils';\n\nconst notificationVarianColorMap: Record<\n NavbarAccountProps['notificationVariant'],\n string\n> = {\n warning: tokens.colorWarning,\n negative: tokens.colorNegative,\n info: tokens.blue500,\n};\n\nexport const getNavbarAccountStyles = () => ({\n navbarAccount: css(\n {\n // default button reset styles\n margin: 0,\n padding: 0,\n border: 0,\n cursor: 'pointer',\n background: 'none',\n position: 'relative',\n outline: 'none',\n overflow: 'visible',\n borderRadius: '50%',\n '&:before': css({\n content: '\"\"',\n display: 'block',\n position: 'absolute',\n height: '24px',\n width: '24px',\n backgroundColor: 'transparent',\n borderRadius: '50%',\n }),\n '&:hover:before': css({\n backgroundColor: hexToRGBA(tokens.gray300, 0.15),\n }),\n },\n getGlowOnFocusStyles(),\n ),\n avatar: css({\n borderRadius: '50%',\n display: 'block',\n height: '24px',\n width: '24px',\n }),\n notificationIcon: (variant: NavbarAccountProps['notificationVariant']) =>\n css({\n position: 'absolute',\n top: 0,\n right: 0,\n height: tokens.spacingS,\n width: tokens.spacingS,\n borderRadius: '50%',\n border: `2px solid ${tokens.gray100}`,\n backgroundColor: notificationVarianColorMap[variant],\n transform: 'translate(30%, -30%)',\n }),\n});\n","import React from 'react';\nimport { Menu, type MenuListProps, type MenuProps } from '@contentful/f36-menu';\nimport { getNavbarMenuStyles } from './NavbarMenu.styles';\n\nexport type NavbarMenuProps = {\n trigger: React.ReactNode;\n children?: React.ReactNode;\n} & Pick<MenuListProps, 'testId'> &\n Pick<MenuProps, 'onOpen' | 'onClose'>;\n\nexport const NavbarMenu = (props: NavbarMenuProps) => {\n const {\n trigger,\n children,\n testId = 'cf-ui-navbar-menu-list',\n onOpen,\n onClose,\n } = props;\n const styles = getNavbarMenuStyles();\n\n return (\n <Menu onOpen={onOpen} onClose={onClose}>\n <Menu.Trigger>{trigger}</Menu.Trigger>\n <Menu.List className={styles.menuList} testId={testId}>\n {children}\n </Menu.List>\n </Menu>\n );\n};\n","import { css } from 'emotion';\n\nexport const getNavbarMenuStyles = () => ({\n menuList: css({\n minWidth: '250px',\n }),\n});\n","import React from 'react';\nimport { SkeletonContainer, SkeletonImage } from '@contentful/f36-skeleton';\nimport tokens from '@contentful/f36-tokens';\n\nexport function NavbarAccountSkeleton({ ariaLabel }: { ariaLabel?: string }) {\n return (\n <SkeletonContainer\n svgWidth={24}\n svgHeight={24}\n ariaLabel={ariaLabel}\n backgroundColor={tokens.gray300}\n foregroundColor={tokens.gray200}\n >\n <SkeletonImage width={24} height={24} radiusX={12} radiusY={12} />\n </SkeletonContainer>\n );\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { getNavbarItemStyles } from './NavbarItem.styles';\nimport { NavbarMenu, type NavbarMenuProps } from '../NavbarMenu/NavbarMenu';\nimport {\n NavbarItemIcon,\n type NavbarItemIconProps,\n} from '../NavbarItemIcon/NavbarItemIcon';\nimport { ArrowDownIcon } from '../icons';\nimport type {\n CommonProps,\n ExpandProps,\n PolymorphicComponent,\n PolymorphicProps,\n} from '@contentful/f36-core';\n\nconst NAVBAR_ITEM_DEFAULT_TAG = 'button';\n\ntype NavbarItemTriggerProps = CommonProps & {\n title: string;\n icon?: NavbarItemIconProps['icon'];\n isActive?: boolean;\n as?: React.ElementType;\n};\n\ntype NavbarItemAsMenuProps = NavbarItemTriggerProps &\n Pick<NavbarMenuProps, 'onOpen' | 'onClose'> & {\n children: React.ReactNode;\n };\ntype NavbarItemAsItemProps = NavbarItemTriggerProps & {\n children?: never;\n onOpen?: never;\n onClose?: never;\n};\ntype NavbarItemOwnProps = NavbarItemAsItemProps | NavbarItemAsMenuProps;\n\nexport type NavbarItemProps<\n E extends React.ElementType = typeof NAVBAR_ITEM_DEFAULT_TAG,\n> = PolymorphicProps<NavbarItemOwnProps, E>;\n\nfunction _NavbarItem(\n props: NavbarItemProps<React.ElementType>,\n ref: React.Ref<any>,\n) {\n const {\n as: Comp = NAVBAR_ITEM_DEFAULT_TAG,\n icon,\n title,\n children,\n className,\n isActive,\n testId = 'cf-ui-navbar-item',\n onOpen,\n onClose,\n ...otherProps\n } = props;\n const styles = getNavbarItemStyles();\n const isMenuTrigger = isNavbarItemHasMenu(props);\n const item = (\n <Comp\n {...otherProps}\n ref={ref}\n data-test-id={testId}\n className={cx(\n styles.navbarItem,\n isMenuTrigger && styles.navbarItemMenuTrigger,\n isActive && styles.isActive,\n className,\n )}\n >\n {icon && <NavbarItemIcon icon={icon} variant=\"secondary\" />}\n <span>{title}</span>\n {isMenuTrigger && <ArrowDownIcon />}\n </Comp>\n );\n\n if (isMenuTrigger) {\n return (\n <NavbarMenu\n trigger={item}\n testId={testId}\n onOpen={onOpen}\n onClose={onClose}\n >\n {children}\n </NavbarMenu>\n );\n }\n\n return item;\n}\n\nconst isNavbarItemHasMenu = <E extends React.ElementType>(\n props: NavbarItemProps<E>,\n): props is PolymorphicProps<NavbarItemAsMenuProps, E> =>\n Boolean(props.children);\n\nexport const NavbarItem: PolymorphicComponent<\n ExpandProps<NavbarItemOwnProps>,\n typeof NAVBAR_ITEM_DEFAULT_TAG\n> = React.forwardRef(_NavbarItem);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { hexToRGBA } from '@contentful/f36-utils';\nimport { getGlowOnFocusStyles } from '../utils.styles';\n\nexport const getNavbarItemActiveStyles = () =>\n css({\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n width: `calc(100% - ${tokens.spacingM})`,\n height: '2px',\n bottom: `-${tokens.spacing2Xs}`,\n left: 0,\n right: 0,\n margin: 'auto',\n backgroundColor: tokens.blue600,\n zIndex: 0,\n },\n });\n\nconst commonItemStyles = {\n display: 'flex',\n justifyContent: 'center',\n padding: `${tokens.spacing2Xs} ${tokens.spacingS}`,\n alignItems: 'center',\n background: 'none',\n};\n\nexport const getNavbarItemStyles = () => ({\n navbarItem: css(\n commonItemStyles,\n {\n alignItems: 'center',\n background: 'none',\n border: 0,\n margin: 0,\n outline: 'none',\n fontSize: tokens.fontSizeM,\n lineHeight: tokens.lineHeightS,\n fontWeight: tokens.fontWeightMedium,\n position: 'relative',\n textAlign: 'left',\n whiteSpace: 'nowrap',\n cursor: 'pointer',\n hyphens: 'auto',\n textDecoration: 'none',\n color: tokens.gray700,\n boxSizing: 'border-box',\n transition: `color ${tokens.transitionDurationShort} ${tokens.transitionEasingCubicBezier}`,\n borderRadius: tokens.borderRadiusMedium,\n\n '&:hover': {\n backgroundColor: hexToRGBA(tokens.gray900, 0.05),\n },\n\n '&:hover::before': {\n opacity: 1,\n scale: '1',\n },\n\n '&:active::before': {\n backgroundColor: `rgba(255, 255, 255, 0.1)`,\n },\n '&:disabled': {\n cursor: 'auto',\n },\n\n '& svg': {\n transition: `fill ${tokens.transitionDurationShort} ${tokens.transitionEasingCubicBezier}`,\n },\n '& > svg, & > span': {\n zIndex: tokens.zIndexDefault,\n },\n },\n getGlowOnFocusStyles(`inset ${tokens.glowPrimary}`),\n ),\n navbarItemMenuTrigger: css({\n paddingRight: tokens.spacingXs,\n }),\n isActive: getNavbarItemActiveStyles(),\n});\n\nexport const getNavbarItemSkeletonStyles = () => ({\n itemSkeleton: css(commonItemStyles),\n});\n","import React from 'react';\nimport type { IconProps } from '@contentful/f36-icons';\nimport { getNavbarItemIconStyles } from './NavbarItemIcon.styles';\nimport { cx } from 'emotion';\n\nexport type NavbarItemIconProps = {\n icon: React.ReactElement<IconProps>;\n} & Pick<IconProps, 'variant'>;\n\nexport const NavbarItemIcon = (props: NavbarItemIconProps) => {\n const { icon, variant } = props;\n const styles = getNavbarItemIconStyles();\n\n return React.cloneElement(icon, {\n className: cx(icon.props.className, styles.navbarItemIcon),\n size: icon.props.size ?? 'tiny',\n variant: icon.props.variant ?? variant,\n });\n};\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getNavbarItemIconStyles = () => ({\n navbarItemIcon: css({\n fill: tokens.gray700,\n '&:first-child': {\n marginRight: tokens.spacing2Xs,\n },\n '&:last-child': {\n marginLeft: tokens.spacing2Xs,\n },\n 'img&': {\n borderRadius: tokens.borderRadiusSmall,\n maxWidth: tokens.spacingM,\n maxHeight: tokens.spacingM,\n },\n }),\n});\n","import React from 'react';\nimport { SkeletonContainer, SkeletonText } from '@contentful/f36-skeleton';\nimport tokens from '@contentful/f36-tokens';\nimport { getNavbarItemSkeletonStyles } from './NavbarItem.styles';\n\nexport const NavbarItemSkeleton = ({\n estimatedWidth,\n}: {\n estimatedWidth: number;\n}) => {\n const styles = getNavbarItemSkeletonStyles();\n\n return (\n <SkeletonContainer\n className={styles.itemSkeleton}\n svgWidth={estimatedWidth}\n svgHeight={32}\n backgroundColor={tokens.gray300}\n foregroundColor={tokens.gray200}\n >\n <SkeletonText\n lineHeight={6}\n numberOfLines={1}\n offsetTop={10}\n radiusX={tokens.borderRadiusSmall}\n radiusY={tokens.borderRadiusSmall}\n />\n </SkeletonContainer>\n );\n};\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { getNavbarMenuItemStyles } from './NavbarMenuItem.styles';\nimport { Menu, type MenuItemProps } from '@contentful/f36-menu';\nimport {\n NavbarItemIcon,\n type NavbarItemIconProps,\n} from '../NavbarItemIcon/NavbarItemIcon';\nimport { ExternalLinkIcon } from '@contentful/f36-icons';\nimport type {\n ExpandProps,\n PolymorphicComponent,\n PolymorphicProps,\n} from '@contentful/f36-core';\n\nconst NAVBAR_MENU_ITEM_DEFAULT_TAG = 'button';\n\ntype NavbarMenuItemOwnProps = {\n children?: null;\n title: string;\n icon?: NavbarItemIconProps['icon'];\n as?: React.ElementType;\n} & Omit<MenuItemProps, 'children' | 'as'>;\n\nexport type NavbarMenuItemProps<\n E extends React.ElementType = typeof NAVBAR_MENU_ITEM_DEFAULT_TAG,\n> = PolymorphicProps<NavbarMenuItemOwnProps, E>;\n\nfunction _NavbarMenuItem(\n props: NavbarMenuItemProps<React.ElementType>,\n ref: React.Ref<any>,\n) {\n const {\n as: Comp = NAVBAR_MENU_ITEM_DEFAULT_TAG,\n icon,\n title,\n className,\n ...otherProps\n } = props;\n const styles = getNavbarMenuItemStyles();\n\n const itemIsExternalLink = isExternalLink(\n props as unknown as NavbarMenuItemProps<'a'>,\n );\n\n return (\n <Menu.Item\n {...otherProps}\n ref={ref}\n as={Comp as MenuItemProps['as']}\n className={cx(styles.navbarMenuItem, className)}\n >\n {icon ? (\n <NavbarItemIcon icon={icon} variant=\"secondary\" />\n ) : (\n itemIsExternalLink && externalIcon\n )}\n <span>{title}</span>\n {icon && itemIsExternalLink ? externalIcon : null}\n </Menu.Item>\n );\n}\n\nconst externalIcon = (\n <NavbarItemIcon icon={<ExternalLinkIcon />} variant=\"muted\" />\n);\n\nconst isExternalLink = (props: NavbarMenuItemProps<'a'>) =>\n props.as === 'a' && props.target === '_blank';\n\nexport const NavbarMenuItem: PolymorphicComponent<\n ExpandProps<NavbarMenuItemOwnProps>,\n typeof NAVBAR_MENU_ITEM_DEFAULT_TAG\n> = React.forwardRef(_NavbarMenuItem);\n","import { css } from 'emotion';\nexport const getNavbarMenuItemStyles = () => ({\n navbarMenuItem: css({\n display: 'flex',\n justifyContent: 'flex-start',\n alignItems: 'center',\n }),\n});\n","import React from 'react';\nimport { Menu } from '@contentful/f36-menu';\nimport {\n SkeletonBodyText,\n SkeletonContainer,\n SkeletonImage,\n} from '@contentful/f36-skeleton';\nimport { Flex } from '@contentful/f36-core';\n\nimport tokens from '@contentful/f36-tokens';\n\nexport const NavbarMenuItemSkeleton = ({\n ariaLabel,\n}: {\n ariaLabel?: string;\n}) => (\n <Menu.Item>\n <Flex alignItems=\"center\" gap={tokens.spacingXs}>\n <SkeletonContainer svgHeight={16} svgWidth={18}>\n <SkeletonImage width={16} height={16} />\n </SkeletonContainer>\n <SkeletonContainer svgHeight={16} svgWidth={190} ariaLabel={ariaLabel}>\n <SkeletonBodyText numberOfLines={1} />\n </SkeletonContainer>\n </Flex>\n </Menu.Item>\n);\n","import React from 'react';\nimport { getNavbarSwitcherStyles } from './NavbarSwitcher.styles';\nimport {\n Flex,\n type CommonProps,\n type PropsWithHTMLElement,\n type ExpandProps,\n} from '@contentful/f36-core';\nimport { cx } from 'emotion';\n\ntype NavbarSwitcherOwnProps = CommonProps & {\n children?: React.ReactNode;\n};\n\nexport type NavbarSwitcherProps = PropsWithHTMLElement<\n NavbarSwitcherOwnProps,\n 'button'\n>;\n\nfunction _NavbarSwitcher(\n props: ExpandProps<NavbarSwitcherProps>,\n ref: React.Ref<HTMLButtonElement>,\n) {\n const {\n children,\n className,\n testId = 'cf-ui-navbar-switcher',\n ...otherProps\n } = props;\n const styles = getNavbarSwitcherStyles();\n\n return (\n <Flex\n {...otherProps}\n as=\"button\"\n ref={ref}\n className={cx(styles.navbarSwitcher, className)}\n testId={testId}\n alignItems=\"center\"\n fullHeight\n gap=\"spacingXs\"\n >\n <Flex as=\"ul\" alignItems=\"center\" className={styles.switcherBreadcrumbs}>\n {children}\n </Flex>\n </Flex>\n );\n}\n\nexport const NavbarSwitcher = React.forwardRef(_NavbarSwitcher);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { getGlowOnFocusStyles } from '../utils.styles';\n\nexport const getNavbarSwitcherStyles = () => ({\n navbarSwitcher: css(\n {\n // default button reset styles\n margin: 0,\n padding: 0,\n background: 'none',\n border: 'none',\n height: 'max-content',\n\n color: tokens.gray700,\n cursor: 'pointer',\n fontSize: tokens.fontSizeS,\n fontWeight: tokens.fontWeightMedium,\n position: 'relative',\n outline: 'none',\n borderRadius: '3rem',\n\n '&:after': {\n content: '\"\"',\n border: '1px solid #353A41',\n boxSizing: 'border-box',\n height: '16px',\n right: '-1px',\n position: 'absolute',\n width: 0,\n },\n '&:last-child:after': {\n display: 'none',\n },\n '&:hover li': {\n backgroundColor: '#f2f4f6', // Using a calculated hover alpha color because when using a RGBA value layers overlapping occur and show darker areas\n },\n },\n getGlowOnFocusStyles(),\n ),\n switcherMenuIcon: css({\n height: tokens.spacingM,\n width: tokens.spacingM,\n fill: tokens.gray700,\n }),\n switcherBreadcrumbs: css({\n listStyleType: 'none',\n margin: 0,\n padding: 0,\n position: 'relative',\n }),\n});\n","import React from 'react';\nimport {\n SkeletonContainer,\n SkeletonDisplayText,\n} from '@contentful/f36-skeleton';\nimport tokens from '@contentful/f36-tokens';\n\nexport const NavbarSwitcherSkeleton = ({\n estimatedWidth,\n}: {\n estimatedWidth: number;\n}) => (\n <SkeletonContainer\n svgWidth={estimatedWidth}\n svgHeight={24}\n backgroundColor={tokens.gray300}\n foregroundColor={tokens.gray200}\n >\n <SkeletonDisplayText\n lineHeight={24}\n numberOfLines={1}\n radiusX={12}\n radiusY={12}\n />\n </SkeletonContainer>\n);\n","import { cx } from 'emotion';\nimport React from 'react';\nimport { SearchIcon } from '../icons';\nimport {\n type CommonProps,\n type ExpandProps,\n type PropsWithHTMLElement,\n} from '@contentful/f36-core';\nimport { IconButton } from '@contentful/f36-button';\nimport { getNavbarSearchStyles } from './NavbarSearch.styles';\ntype NavbarSearchOwnProps = CommonProps;\n\nexport type NavbarSearchProps = PropsWithHTMLElement<\n NavbarSearchOwnProps,\n 'button'\n>;\n\nfunction _NavbarSearch(\n props: ExpandProps<NavbarSearchProps>,\n ref: React.Ref<HTMLButtonElement>,\n) {\n const { className, testId = 'cf-ui-navbar-search', ...otherProps } = props;\n const styles = getNavbarSearchStyles();\n return (\n <IconButton\n aria-label=\"Quick Search\"\n {...otherProps}\n variant=\"transparent\"\n ref={ref}\n size=\"small\"\n className={cx(styles.navbarSearch, className)}\n testId={testId}\n icon={<SearchIcon size=\"medium\" />}\n />\n );\n}\n\nexport const NavbarSearch = React.forwardRef(_NavbarSearch);\n","import { css } from 'emotion';\nimport type { CSSObject } from '@emotion/serialize';\nimport tokens from '@contentful/f36-tokens';\nimport { ButtonSize, ButtonVariant, ButtonStylesProps } from '../types';\nimport { hexToRGBA, type Density } from '@contentful/f36-utils';\n\nconst variantActiveStyles = (variant: ButtonVariant): CSSObject => {\n switch (variant) {\n case 'primary':\n return { backgroundColor: tokens.blue700 };\n case 'secondary':\n return { backgroundColor: tokens.gray200 };\n case 'positive':\n return { backgroundColor: tokens.green700 };\n case 'negative':\n return { backgroundColor: tokens.gray200 };\n case 'transparent':\n return { backgroundColor: hexToRGBA(tokens.gray900, 0.1) };\n default:\n return {};\n }\n};\n\nconst variantToStyles = (variant: ButtonVariant): CSSObject => {\n switch (variant) {\n case 'primary':\n return {\n color: tokens.colorWhite,\n backgroundColor: tokens.blue500,\n borderColor: 'transparent',\n '&:hover': {\n backgroundColor: tokens.blue600,\n color: tokens.colorWhite,\n },\n '&:active': variantActiveStyles(variant),\n '&:focus-visible': {\n boxShadow: tokens.glowPrimary,\n },\n };\n case 'secondary':\n return {\n color: tokens.gray900,\n backgroundColor: tokens.colorWhite,\n borderColor: tokens.gray300,\n '&:hover': {\n backgroundColor: tokens.gray100,\n color: tokens.gray900,\n },\n '&:active': variantActiveStyles(variant),\n '&:focus': {\n boxShadow: tokens.glowPrimary,\n },\n '&:focus:not(:focus-visible)': {\n boxShadow: 'unset',\n },\n '&:focus-visible': {\n boxShadow: tokens.glowPrimary,\n },\n };\n case 'positive':\n return {\n color: tokens.colorWhite,\n backgroundColor: tokens.green500,\n borderColor: 'transparent',\n '&:hover': {\n backgroundColor: tokens.green600,\n color: tokens.colorWhite,\n },\n '&:active': variantActiveStyles(variant),\n '&:focus-visible': {\n boxShadow: tokens.glowPositive,\n },\n };\n case 'negative':\n return {\n color: tokens.red600,\n backgroundColor: tokens.colorWhite,\n borderColor: tokens.gray300,\n '&:hover': {\n backgroundColor: tokens.gray100,\n color: tokens.red600,\n },\n '&:active': variantActiveStyles(variant),\n '&:focus-visible': {\n boxShadow: tokens.glowNegative,\n },\n };\n case 'transparent':\n return {\n color: tokens.gray900,\n background: 'none',\n borderColor: 'transparent',\n boxShadow: 'none',\n '&:hover': {\n backgroundColor: hexToRGBA(tokens.gray900, 0.05),\n },\n '&:active': variantActiveStyles(variant),\n '&:focus': {\n boxShadow: tokens.glowPrimary,\n },\n '&:focus:not(:focus-visible)': {\n boxShadow: 'unset',\n },\n '&:focus-visible': {\n boxShadow: tokens.glowPrimary,\n },\n };\n default:\n return {};\n }\n};\n\nconst sizeToStyles = (size: ButtonSize, density: Density): CSSObject => {\n const isHighDensity = density === 'high';\n\n switch (size) {\n case 'small':\n return {\n fontSize: isHighDensity ? tokens.fontSizeS : tokens.fontSizeM,\n lineHeight: tokens.lineHeightCondensed,\n padding: isHighDensity\n ? `${tokens.spacing2Xs} ${tokens.spacingXs}`\n : `${tokens.spacing2Xs} ${tokens.spacingS}`,\n minHeight: isHighDensity ? tokens.spacingL : tokens.spacingXl,\n };\n case 'medium':\n return {\n fontSize: isHighDensity ? tokens.fontSizeS : tokens.fontSizeM,\n lineHeight: tokens.lineHeightCondensed,\n padding: isHighDensity\n ? `${tokens.spacingXs} ${tokens.spacingS}`\n : `${tokens.spacingXs} ${tokens.spacingM}`,\n minHeight: isHighDensity ? tokens.spacingXl : '40px',\n };\n case 'large':\n return {\n fontSize: tokens.fontSizeXl,\n lineHeight: tokens.lineHeightXl,\n padding: `${tokens.spacingXs} ${tokens.spacingM}`,\n minHeight: '48px',\n };\n default:\n return {};\n }\n};\n\nconst getButtonIconStyle = ({ hasChildren, variant }) => {\n const align = {\n '&:first-child': { marginRight: tokens.spacing2Xs },\n '&:last-child': { marginLeft: tokens.spacing2Xs },\n };\n\n const margin = hasChildren ? align : {};\n\n return css([\n margin,\n // we want to allow variants for icons, but only in the transparent IconButton\n variant !== 'transparent' &&\n hasChildren && {\n '& svg': {\n fill: 'currentColor',\n },\n },\n ]);\n};\n\nexport const getStyles = () => ({\n button: ({\n variant,\n size,\n density,\n isActive,\n isDisabled,\n isFullWidth,\n }: ButtonStylesProps & { density: Density }) =>\n css({\n boxSizing: 'border-box',\n border: `1px solid`,\n boxShadow: '0px 1px 0px rgb(25, 37, 50, 0.08)',\n borderRadius:\n density === 'high'\n ? tokens.borderRadiusSmall\n : tokens.borderRadiusMedium,\n cursor: isDisabled ? 'not-allowed' : 'pointer',\n fontFamily: tokens.fontStackPrimary,\n opacity: isDisabled ? 0.5 : 1,\n display: isFullWidth ? 'flex' : 'inline-flex',\n minWidth: isFullWidth ? '100%' : 'auto',\n maxWidth: isFullWidth ? '100%' : '240px',\n overflow: 'hidden',\n flexShrink: 0,\n justifyContent: 'center',\n alignItems: 'center',\n fontWeight: tokens.fontWeightMedium,\n outline: 'none',\n textDecoration: 'none',\n margin: 0, // remove the default margin in Safari.\n transition: `background ${tokens.transitionDurationShort} ${tokens.transitionEasingDefault},\n opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault},\n border-color ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n ...variantToStyles(variant),\n ...sizeToStyles(size, density),\n ...(isActive\n ? {\n transition: 'none',\n '&, &:focus': variantActiveStyles(variant),\n }\n : {}),\n }),\n buttonIcon: getButtonIconStyle,\n buttonContent: css({\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n }),\n});\n","import { css, keyframes } from 'emotion';\nimport type { SpinnerSize } from './types';\n\nconst sizes: { [key in SpinnerSize]: string } = {\n large: '36px',\n medium: '20px',\n small: '14px',\n};\n\nexport const getStyles = () => {\n const animations = {\n scale1: keyframes`\n 0% {\n transform: scale(1, 1);\n }\n 6.666667% {\n transform: scale(1.5, 0.5);\n }\n 13.333333% {\n transform: scale(1, 1);\n }\n 26.666667% {\n transform: scale(1, 1);\n }\n 33.333333% {\n transform: scale(1, 1);\n }\n 40% {\n transform: scale(1, 1);\n }\n 53.333333% {\n transform: scale(1, 1);\n }\n 60% {\n transform: scale(1.5, 0.5);\n }\n 66.666667% {\n transform: scale(1, 1);\n }\n 100% {\n transform: scale(1, 1);\n }\n `,\n scale2: keyframes`\n 0% {\n transform: scale(1, 1);\n }\n 13.333333% {\n transform: scale(1, 1);\n }\n 20% {\n transform: scale(1.5, 0.5);\n }\n 26.666667% {\n transform: scale(1, 1);\n }\n 40% {\n transform: scale(1, 1);\n }\n 46.666667% {\n transform: scale(1, 1);\n }\n 53.333333% {\n transform: scale(1, 1);\n }\n 66.666667% {\n transform: scale(1, 1);\n }\n 73.333333% {\n transform: scale(1.5, 0.5);\n }\n 80% {\n transform: scale(1, 1);\n }\n 100% {\n transform: scale(1, 1);\n }\n `,\n scale3: keyframes`\n 0% {\n transform: scale(1, 1);\n }\n 26.666667% {\n transform: scale(1, 1);\n }\n 33.333333% {\n transform: scale(1.5, 0.5);\n }\n 40% {\n transform: scale(1, 1);\n }\n 53.333333% {\n transform: scale(1, 1);\n }\n 60% {\n transform: scale(1, 1);\n }\n 66.666667% {\n transform: scale(1, 1);\n }\n 80% {\n transform: scale(1, 1);\n }\n 86.666667% {\n transform: scale(1.5, 0.5);\n }\n 93.333333% {\n transform: scale(1, 1);\n }\n 100% {\n transform: scale(1, 1);\n }\n `,\n translate1: keyframes`\n 0% {\n transform: translate(10px, 33.528168px);\n }\n 6.666667% {\n transform: translate(10px, 41.764084px);\n }\n 13.333333% {\n transform: translate(10px, 33.528168px);\n }\n 26.666667% {\n transform: translate(10px, -2.651608px);\n }\n 33.333333% {\n transform: translate(10px, -4.471832px);\n }\n 40% {\n transform: translate(10px, -2.651608px);\n }\n 53.333333% {\n transform: translate(10px, 33.528168px);\n }\n 60% {\n transform: translate(10px, 41.764084px);\n }\n 66.666667% {\n transform: translate(10px, 33.528168px);\n }\n 100% {\n transform: translate(10px, 33.528168px);\n }\n `,\n translate2: keyframes`\n 0% {\n transform: translate(30px, 33.528168px);\n }\n 13.333333% {\n transform: translate(30px, 33.528168px);\n }\n 20% {\n transform: translate(30px, 41.764084px);\n }\n 26.666667% {\n transform: translate(30px, 33.528168px);\n }\n 40% {\n transform: translate(30px, -2.651608px);\n }\n 46.666667% {\n transform: translate(30px, -4.471832px);\n }\n 53.333333% {\n transform: translate(30px, -2.651608px);\n }\n 66.666667% {\n transform: translate(30px, 33.528168px);\n }\n 73.333333% {\n transform: translate(30px, 41.764084px);\n }\n 80% {\n transform: translate(30px, 33.528168px);\n }\n 100% {\n transform: translate(30px, 33.528168px);\n }\n `,\n translate3: keyframes`\n 0% {\n transform: translate(50px, 33.528168px);\n }\n 26.666667% {\n transform: translate(50px, 33.528168px);\n }\n 33.333333% {\n transform: translate(50px, 41.764084px);\n }\n 40% {\n transform: translate(50px, 33.528168px);\n }\n 53.333333% {\n transform: translate(50px, -2.651608px);\n }\n 60% {\n transform: translate(50px, -4.471832px);\n }\n 66.666667% {\n transform: translate(50px, -2.651608px);\n }\n 80% {\n transform: translate(50px, 33.528168px);\n }\n 86.666667% {\n transform: translate(50px, 41.764084px);\n }\n 93.333333% {\n transform: translate(50px, 33.528168px);\n }\n 100% {\n transform: translate(50px, 33.528168px);\n }\n `,\n };\n\n return {\n root: (props: { size: SpinnerSize; customSize?: number }) =>\n css({\n height: props.customSize ? `${props.customSize}px` : undefined,\n verticalAlign: 'middle',\n width: props.customSize ? `${props.customSize}px` : sizes[props.size],\n }),\n circle1Scale: css({\n animation: `${animations.scale1} 1s linear infinite normal forwards;`,\n }),\n circle2Scale: css({\n animation: `${animations.scale2} 1s linear infinite normal forwards;`,\n }),\n circle3Scale: css({\n animation: `${animations.scale3} 1s linear infinite normal forwards;`,\n }),\n circle1Translate: css({\n animation: `${animations.translate1} 1s linear infinite normal forwards;`,\n }),\n circle2Translate: css({\n animation: `${animations.translate2} 1s linear infinite normal forwards;`,\n }),\n circle3Translate: css({\n animation: `${animations.translate3} 1s linear infinite normal forwards;`,\n }),\n };\n};\n","import { css } from 'emotion';\nimport { getGlowOnFocusStyles } from '../utils.styles';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getNavbarSearchStyles = () => ({\n navbarSearch: css(\n {\n // default button reset styles\n minWidth: '24px',\n width: '24px',\n minHeight: '24px',\n height: '24px',\n svg: {\n fill: tokens.gray700,\n },\n },\n getGlowOnFocusStyles(),\n ),\n});\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { getNavbarSwitcherItemStyles } from './NavbarSwitcherItem.styles';\nimport { NavbarEnvVariant } from './NavbarEnvVariant';\nimport {\n Flex,\n type CommonProps,\n type ExpandProps,\n type PropsWithHTMLElement,\n} from '@contentful/f36-core';\n\ntype NavbarSwitcherItemOwnProps = CommonProps & {\n children?: React.ReactNode;\n isCircle?: boolean;\n envVariant?: 'master' | 'non-master';\n isAlias?: boolean;\n};\n\nexport type NavbarSwitcherItemProps = PropsWithHTMLElement<\n NavbarSwitcherItemOwnProps,\n 'li'\n>;\n\nfunction _NavbarSwitcherItem(\n props: ExpandProps<NavbarSwitcherItemProps>,\n ref: React.Ref<HTMLLIElement>,\n) {\n const {\n children,\n isCircle,\n className,\n envVariant,\n isAlias,\n testId = 'cf-ui-navbar-switcher-item',\n ...otherProps\n } = props;\n const styles = getNavbarSwitcherItemStyles();\n const classes = cx(styles.breadcrumbsItem, className, {\n [styles.breadcrumbsItemCircle]: isCircle,\n [styles.breadcrumbsItemEnvMaster]: envVariant === 'master',\n [styles.breadcrumbsItemEnvNonMaster]: envVariant === 'non-master',\n });\n\n return (\n <li {...otherProps} ref={ref} className={classes} data-test-id={testId}>\n <Flex fullHeight justifyContent=\"center\" alignItems=\"center\">\n {envVariant && <NavbarEnvVariant isAlias={isAlias} />}\n <span>{children}</span>\n </Flex>\n </li>\n );\n}\n\nexport const NavbarSwitcherItem = React.forwardRef(_NavbarSwitcherItem);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { mqs } from '../utils.styles';\n\nconst mobileIcon = {\n display: 'none',\n '&:first-child': {\n display: 'block',\n },\n\n [mqs.medium]: {\n display: 'block',\n '&:first-child': {\n display: 'none',\n },\n },\n};\n\nexport const getNavbarSwitcherItemStyles = () => ({\n breadcrumbsItem: css({\n position: 'relative',\n alignItems: 'center',\n justifyContent: 'center',\n border: `solid 1px ${tokens.gray300}`,\n borderLeft: 'none',\n display: 'inline-flex',\n margin: 0,\n minWidth: 0,\n padding: `0 ${tokens.spacingXs}`,\n height: tokens.spacingL,\n borderRadius: '3rem',\n zIndex: 2,\n\n whiteSpace: 'nowrap',\n '&:first-child': {\n minWidth: '24px',\n },\n '&:nth-child(2)': {\n zIndex: 1,\n marginLeft: '-10px',\n paddingLeft: tokens.spacingM,\n borderRadius: `0 3rem 3rem 0`,\n span: {\n maxWidth: '80px',\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n [mqs.large]: {\n maxWidth: '100%',\n },\n },\n },\n '&:nth-child(3)': {\n marginLeft: '-10px',\n paddingLeft: tokens.spacingM,\n borderRadius: `0 3rem 3rem 0`,\n fontFamily: tokens.fontStackMonospace,\n fontSize: tokens.fontSizeS,\n fontWeight: tokens.fontWeightMedium,\n zIndex: 0,\n span: {\n maxWidth: '40px',\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n [mqs.large]: {\n maxWidth: '100%',\n },\n },\n '> div': {\n [mqs.medium]: {\n gap: tokens.spacing2Xs,\n },\n },\n },\n }),\n breadcrumbsItemCircle: css({\n border: `solid 1px ${tokens.gray300}`,\n borderRadius: '50%',\n color: tokens.gray400,\n padding: 0,\n display: 'flex',\n justifyContent: 'center',\n fontSize: '11px',\n width: tokens.spacingL,\n height: tokens.spacingL,\n }),\n breadcrumbsItemEnvMaster: css({\n color: tokens.green600,\n ' svg': {\n ...mobileIcon,\n fill: tokens.green600,\n },\n }),\n breadcrumbsItemEnvNonMaster: css({\n color: tokens.orange500,\n svg: {\n ...mobileIcon,\n fill: tokens.orange500,\n },\n }),\n});\n","import React from 'react';\nimport { NavbarSwitcherItemProps } from './NavbarSwitcherItem';\nimport { CircleIcon } from '../icons';\nimport { EnvironmentAliasIcon, EnvironmentIcon } from '@contentful/f36-icons';\n\nexport type NavbarEnvVariantProps = Pick<NavbarSwitcherItemProps, 'isAlias'>;\n\nexport function NavbarEnvVariant({ isAlias }: NavbarEnvVariantProps) {\n return (\n <>\n <CircleIcon key=\"mobile-icon\" size=\"tiny\" />\n {isAlias ? (\n <EnvironmentAliasIcon key=\"full-icon\" size=\"tiny\" />\n ) : (\n <EnvironmentIcon key=\"full-icon\" size=\"tiny\" />\n )}\n </>\n );\n}\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { HelpIcon } from '../icons';\nimport {\n type CommonProps,\n type PropsWithHTMLElement,\n type ExpandProps,\n} from '@contentful/f36-core';\nimport { Button } from '@contentful/f36-button';\nimport { NavbarMenu } from '../NavbarMenu/NavbarMenu';\nimport { getNavbarHelpStyles } from './NavbarHelp.styles';\n\ntype NavbarHelpOwnProps = CommonProps & {\n children: React.ReactNode;\n};\n\nexport type NavbarHelpProps = PropsWithHTMLElement<\n NavbarHelpOwnProps,\n 'button'\n>;\n\nfunction _NavbarHelp(\n props: ExpandProps<NavbarHelpProps>,\n ref: React.Ref<HTMLButtonElement>,\n) {\n const {\n children,\n className,\n testId = 'cf-ui-navbar-help-trigger',\n ...otherProps\n } = props;\n\n const styles = getNavbarHelpStyles();\n\n return (\n <NavbarMenu\n testId=\"cf-ui-navbar-help-menu\"\n trigger={\n <Button\n aria-label=\"Help Menu\"\n {...otherProps}\n as=\"button\"\n ref={ref}\n className={cx(styles.navbarHelp, className)}\n testId={testId}\n variant=\"transparent\"\n size=\"small\"\n startIcon={<HelpIcon size=\"medium\" />}\n >\n Help\n </Button>\n }\n >\n {children}\n </NavbarMenu>\n );\n}\n\nexport const NavbarHelp = React.forwardRef(_NavbarHelp);\n","import { css } from 'emotion';\nimport { getGlowOnFocusStyles } from '../utils.styles';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getNavbarHelpStyles = () => ({\n navbarHelp: css(\n {\n // default button reset styles\n fontSize: tokens.fontSizeS,\n padding: `0 ${tokens.spacing2Xs}`,\n width: 'max-content',\n minHeight: '24px',\n height: '24px',\n color: tokens.gray700,\n svg: {\n fill: tokens.gray700,\n },\n },\n getGlowOnFocusStyles(),\n ),\n});\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { getNavbarBadgeStyles } from './NavbarBadge.styles';\nimport type {\n CommonProps,\n ExpandProps,\n PolymorphicComponent,\n PolymorphicProps,\n} from '@contentful/f36-core';\n\nconst NAVBAR_BADGE_DEFAULT_TAG = 'div';\n\ntype NavbarBadgeOwnProps = CommonProps & {\n children?: React.ReactNode;\n as?: React.ElementType;\n};\n\nexport type NavbarBadgeProps<\n E extends React.ElementType = typeof NAVBAR_BADGE_DEFAULT_TAG,\n> = PolymorphicProps<NavbarBadgeOwnProps, E>;\n\nfunction _NavbarBadge(\n props: NavbarBadgeProps<React.ElementType>,\n ref: React.Ref<any>,\n) {\n const {\n as: Comp = NAVBAR_BADGE_DEFAULT_TAG,\n children,\n className,\n testId = 'cf-ui-navbar-badge',\n ...otherProps\n } = props;\n const styles = getNavbarBadgeStyles();\n\n return (\n <Comp\n {...otherProps}\n ref={ref}\n className={cx(styles.navbarBadge, className)}\n data-test-id={testId}\n >\n {children}\n </Comp>\n );\n}\n\nexport const NavbarBadge: PolymorphicComponent<\n ExpandProps<NavbarBadgeOwnProps>,\n typeof NAVBAR_BADGE_DEFAULT_TAG\n> = React.forwardRef(_NavbarBadge);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getNavbarBadgeStyles = () => ({\n navbarBadge: css({\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n background: 'none',\n border: `1px solid ${tokens.purple600}`,\n margin: 0,\n outline: 'none',\n fontSize: tokens.fontSizeS,\n lineHeight: tokens.lineHeightS,\n fontWeight: tokens.fontWeightMedium,\n textAlign: 'center',\n padding: `0 ${tokens.spacingXs}`,\n textDecoration: 'none',\n color: `${tokens.purple600}!important`,\n borderRadius: '1.75rem',\n }),\n});\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { getNavbarTopbarItemStyles } from './NavbarTopbarItem.styles';\nimport type {\n CommonProps,\n ExpandProps,\n PolymorphicComponent,\n PolymorphicProps,\n} from '@contentful/f36-core';\n\nconst NAVBAR_BADGE_DEFAULT_TAG = 'button';\n\ntype NavbarTopbarItemOwnProps = CommonProps & {\n children?: React.ReactNode;\n};\n\nexport type NavbarTopbarItemProps<\n E extends React.ElementType = typeof NAVBAR_BADGE_DEFAULT_TAG,\n> = PolymorphicProps<NavbarTopbarItemOwnProps, E>;\n\nfunction _NavbarTopbarItem<\n E extends React.ElementType = typeof NAVBAR_BADGE_DEFAULT_TAG,\n>(props: NavbarTopbarItemProps<E>, ref: React.Ref<any>) {\n const {\n as: Comp = NAVBAR_BADGE_DEFAULT_TAG,\n children,\n className,\n testId = 'cf-ui-navbar-topbar-item',\n ...otherProps\n } = props;\n const styles = getNavbarTopbarItemStyles();\n\n return (\n <Comp\n {...otherProps}\n ref={ref}\n className={cx(styles.navbarTopItem, className)}\n data-test-id={testId}\n >\n {children}\n </Comp>\n );\n}\n\nexport const NavbarTopbarItem: PolymorphicComponent<\n ExpandProps<NavbarTopbarItemOwnProps>,\n typeof NAVBAR_BADGE_DEFAULT_TAG\n> = React.forwardRef(_NavbarTopbarItem);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { getGlowOnFocusStyles } from '../utils.styles';\nimport { hexToRGBA } from '@contentful/f36-utils';\nexport const getNavbarTopbarItemStyles = () => ({\n navbarTopItem: css(\n {\n // default button reset styles\n margin: 0,\n background: 'none',\n border: '1px solid',\n borderColor: 'transparent',\n cursor: 'pointer',\n display: 'flex',\n gap: tokens.spacing2Xs,\n alignItems: 'center',\n lineHeight: tokens.lineHeightDefault,\n color: tokens.gray700,\n padding: `0 ${tokens.spacing2Xs}`,\n minHeight: '24px',\n fontSize: tokens.fontSizeS,\n fontWeight: tokens.fontWeightMedium,\n outline: 'none',\n borderRadius: tokens.borderRadiusMedium,\n\n '&:hover': {\n backgroundColor: hexToRGBA(tokens.gray900, 0.05),\n },\n svg: {\n fill: 'currentColor',\n },\n },\n getGlowOnFocusStyles(),\n ),\n});\n"]}