{"version":3,"file":"AramcoWorld_CategoryNavigation-CLyNkEMG.js","sources":["../../../src/project/AramcoWorld/Navigation/CategoryNavigation/index.tsx?chunkName=AramcoWorld_CategoryNavigation"],"sourcesContent":["import React, { type FC } from \"react\";\r\nimport { type CategoryNavigationProps } from \"../../generated-types\";\r\nimport { type MainNavigationItemModel } from \"~/feature/Navigation/generated-types\";\r\nimport { Flex } from \"@chakra-ui/react\";\r\nimport { NavLink } from \"react-router-dom\";\r\nimport { Text as ThemeTextStyling } from \"../../_Base/Theme/components/Text\";\r\n\r\nconst CategoryNavigation: FC<CategoryNavigationProps> = ({ rendering }) => {\r\n\r\n\tif (!rendering.customData?.menuItems) {\r\n\t\treturn <></>\r\n\t}\r\n\r\n\treturn (\r\n\t\t<Flex\r\n\t\t\tas=\"nav\"\r\n\t\t\tdata-rendering=\"Navigation/CategoryNavigation\"\r\n\t\t\taria-label=\"Category\"\r\n\t\t\tdisplay={[\"none\", null, null, null, \"flex\"]}\r\n\t\t\tms=\"10\"\r\n\t\t\tgap=\"8\"\r\n\t\t\tsx={{\r\n\t\t\t\t\"> a\": {\r\n\t\t\t\t\twhiteSpace: \"nowrap !important\",\r\n\t\t\t\t\t\"_hover\": {\r\n\t\t\t\t\t\tcolor: \"var(--chakra-colors-AWPrimary-midBlue) !important\" //NavLink does not support hover styling directly on item\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t}}>\r\n\t\t\t{rendering.customData?.menuItems?.map((categoryNavItem: MainNavigationItemModel, index) => {\r\n\t\t\t\tif (!categoryNavItem.url) return <></>\r\n\t\t\t\treturn (\r\n\t\t\t\t\t<NavLink\r\n\t\t\t\t\t\tkey={index}\r\n\t\t\t\t\t\tto={categoryNavItem.url}\r\n\t\t\t\t\t\tstyle={({ isActive }) => {\r\n\t\t\t\t\t\t\treturn {\r\n\t\t\t\t\t\t\t\t...ThemeTextStyling().variants.navigationLinks,\r\n\t\t\t\t\t\t\t\tcolor: isActive ? \"var(--chakra-colors-AWPrimary-midBlue)\" : \"currentcolor\",\r\n\t\t\t\t\t\t\t\ttextDecoration: isActive ? \"underline\" : \"none\",\r\n\t\t\t\t\t\t\t};\r\n\t\t\t\t\t\t}}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{/*\r\n\t\t\t\t\t\t\tTruncated at 1 line\r\n\t\t\t\t\t\t\tHomepage header anim can make it overflow\r\n\t\t\t\t\t\t\tOn smaller breakpoints before navlinks are hidden\r\n\t\t\t\t\t\t\tThe design does not handle overflow\r\n\t\t\t\t\t\t\tThis is handled with whiteSpace: \"nowrap\" instead of extra tag inside links,\r\n\t\t\t\t\t\t*/}\r\n\t\t\t\t\t\t{categoryNavItem.title}\r\n\t\t\t\t\t</NavLink>\r\n\t\t\t\t)\r\n\t\t\t})}\r\n\t\t</Flex>\r\n\t);\r\n};\r\n\r\nexport default CategoryNavigation;"],"names":["CategoryNavigation","rendering","_a","jsx","Flex","categoryNavItem","index","NavLink","isActive","ThemeTextStyling","Fragment"],"mappings":"gXAOA,MAAMA,EAAkD,CAAC,CAAE,UAAAC,KAAgB,WAEtE,OAACC,EAAAD,EAAU,aAAV,MAAAC,EAAsB,UAK1BC,EAAA,IAACC,EAAA,CACA,GAAG,MACH,iBAAe,gCACf,aAAW,WACX,QAAS,CAAC,OAAQ,KAAM,KAAM,KAAM,MAAM,EAC1C,GAAG,KACH,IAAI,IACJ,GAAI,CACH,MAAO,CACN,WAAY,oBACZ,OAAU,CACT,MAAO,mDACR,CACD,CACD,EACC,iBAAU,2BAAY,0BAAW,IAAI,CAACC,EAA0CC,IAC3ED,EAAgB,IAEpBF,EAAA,IAACI,EAAA,CAEA,GAAIF,EAAgB,IACpB,MAAO,CAAC,CAAE,SAAAG,MACF,CACN,GAAGC,EAAiB,EAAE,SAAS,gBAC/B,MAAOD,EAAW,yCAA2C,eAC7D,eAAgBA,EAAW,YAAc,MAAA,GAW1C,SAAgBH,EAAA,KAAA,EAjBZC,CAAA,EAH4BH,EAAAA,IAAAO,EAAAA,SAAA,CAAA,CAAA,EAuBnC,CAAA,EA3COP,EAAA,IAAAO,WAAA,CAAA,CAAA,CA8CX"}