npm - @ably/ui - Versions diffs - 15.8.0-dev.1527ef06 → 16.0.0-dev.2051d9aa - Mend

@ably/ui 15.8.0-dev.1527ef06 → 16.0.0-dev.2051d9aa

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.

Files changed (136) hide show

package/core/Meganav/data.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../src/core/Meganav/data.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconName } from \"../Icon/types\";\nimport { MeganavPanel } from \"./MeganavPanel\";\nimport Status, { StatusUrl } from \"../Status\";\nimport FanEngagementNavImage from \"./images/fan-engagement-nav-image.png\";\nimport CompanyNavImage from \"./images/founders-nav-image.png\";\nimport BestRequirementsWinter2025 from \"../images/g2-best-meets-requirements-2025.svg\";\nimport BestSupportWinter2025 from \"../images/g2-best-support-2025.svg\";\nimport HighPerformerWinter2025 from \"../images/g2-high-performer-2025.svg\";\n\nexport type FlyoutPanelList = {\n label: string;\n icon: IconName;\n link: string;\n isMobile?: boolean;\n};\n\nexport type FlyoutPanelHighlight = {\n heading: string;\n content: string;\n labelLink: string;\n url: string;\n image: string;\n};\n\nexport type MenuItem = {\n name: string;\n link?: string;\n isHiddenMobile?: boolean;\n content?: React.ReactNode;\n panelClassName?: string;\n};\n\nconst panelClassName = \"w-full sm:w-[815px]\";\n\nconst panelLeftFeatureClassName =\n \"bg-neutral-100 dark:bg-neutral-1200 hidden md:grid border border-neutral-300 dark:border-neutral-1000 hover:border-neutral-500 dark:hover:border-neutral-700 rounded-lg cursor-pointer group/meganav-panel\";\n\nconst productsMenu: FlyoutPanelList[] = [\n {\n label: \"Infrastructure\",\n icon: \"icon-gui-globe-alt-outline\",\n link: \"/infrastructure\",\n },\n {\n label: \"Integrations\",\n icon: \"icon-gui-puzzle-piece-outline\",\n link: \"/integrations\",\n },\n {\n label: \"SDKs\",\n icon: \"icon-gui-cube-transparent-outline\",\n link: \"/docs/sdks\",\n },\n {\n label: \"Security & Compliance\",\n icon: \"icon-gui-shield-check-outline\",\n link: \"/security-and-compliance\",\n },\n];\n\nconst solutionsHighlight: FlyoutPanelHighlight = {\n heading: \"Fan Engagement\",\n content: \"Capture the attention of millions of fans during live events.\",\n labelLink: \"Learn more\",\n url: \"/fan-engagement\",\n image: FanEngagementNavImage,\n};\n\nconst solutionsMenu: FlyoutPanelList[] = [\n {\n label: \"Fan Engagement\",\n icon: \"icon-gui-hand-thumb-up-outline\",\n link: \"/fan-engagement\",\n isMobile: true,\n },\n {\n label: \"BizTech\",\n icon: \"icon-gui-building-office-outline\",\n link: \"/solutions/ecommerce-and-retail\",\n },\n {\n label: \"FinTech\",\n icon: \"icon-gui-currency-dollar-outline\",\n link: \"/solutions/fintech\",\n },\n {\n label: \"HealthTech\",\n icon: \"icon-gui-heart-outline\",\n link: \"/solutions/healthcare\",\n },\n {\n label: \"EdTech\",\n icon: \"icon-gui-academic-cap-outline\",\n link: \"/solutions/edtech\",\n },\n];\n\nconst companyHighlight: FlyoutPanelHighlight = {\n heading: \"Leading the realtime revolution\",\n content:\n \"Hear from our founders about Ably’s ambitious plans to become the world’s definitive realtime platform.\",\n labelLink: \"About Ably\",\n url: \"/about\",\n image: CompanyNavImage,\n};\n\nconst companyMenu: FlyoutPanelList[] = [\n {\n label: \"About Ably\",\n icon: \"icon-gui-ably-badge\",\n link: \"/about\",\n isMobile: true,\n },\n {\n label: \"Customer stories\",\n icon: \"icon-gui-star-outline\",\n link: \"/case-studies\",\n },\n {\n label: \"Careers\",\n icon: \"icon-gui-briefcase-outline\",\n link: \"/careers\",\n },\n {\n label: \"Blog\",\n icon: \"icon-gui-light-bulb-outline\",\n link: \"/blog\",\n },\n];\n\nconst ablyAwards = [\n {\n image: BestRequirementsWinter2025,\n desc: \"G2 Best Requirements Winter 2025\",\n },\n {\n image: BestSupportWinter2025,\n desc: \"G2 Best Support Winter 2025\",\n },\n {\n image: HighPerformerWinter2025,\n desc: \"G2 High Performer Winter 2025\",\n },\n];\n\nexport const menuItemLinks = [\n { name: \"Pricing\", link: \"/pricing\", isHiddenMobile: true },\n { name: \"Docs\", link: \"/docs\", isHiddenMobile: true },\n];\n\nexport const menuItemsForHeader: MenuItem[] = [\n {\n name: \"Products\",\n content: (\n <MeganavPanel\n displayProductTile={true}\n panelLeftClassName=\"grid\"\n panelRightItems={productsMenu}\n panelRightHeading=\"platform\"\n panelRightBottom={<Status statusUrl={StatusUrl} showDescription />}\n />\n ),\n panelClassName,\n },\n {\n name: \"Solutions\",\n content: (\n <MeganavPanel\n panelLeft={solutionsHighlight}\n panelLeftClassName={panelLeftFeatureClassName}\n panelRightItems={solutionsMenu}\n />\n ),\n panelClassName,\n },\n {\n name: \"Company\",\n content: (\n <MeganavPanel\n panelLeft={companyHighlight}\n panelLeftClassName={panelLeftFeatureClassName}\n panelRightItems={companyMenu}\n panelRightBottom={\n <div className=\"flex-1 gap-x-8 hidden md:flex\">\n {ablyAwards.map((award) => (\n <img\n key={award.desc}\n src={award.image}\n alt={award.desc}\n width=\"57\"\n height=\"64\"\n />\n ))}\n </div>\n }\n />\n ),\n panelClassName,\n },\n ...menuItemLinks,\n];\n"],"names":["React","MeganavPanel","Status","StatusUrl","FanEngagementNavImage","CompanyNavImage","BestRequirementsWinter2025","BestSupportWinter2025","HighPerformerWinter2025","panelClassName","panelLeftFeatureClassName","productsMenu","label","icon","link","solutionsHighlight","heading","content","labelLink","url","image","solutionsMenu","isMobile","companyHighlight","companyMenu","ablyAwards","desc","menuItemLinks","name","isHiddenMobile","menuItemsForHeader","displayProductTile","panelLeftClassName","panelRightItems","panelRightHeading","panelRightBottom","statusUrl","showDescription","panelLeft","div","className","map","award","img","key","src","alt","width","height"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAE1B,QAASC,YAAY,KAAQ,gBAAiB,AAC9C,QAAOC,QAAUC,SAAS,KAAQ,WAAY,AAC9C,QAAOC,0BAA2B,uCAAwC,AAC1E,QAAOC,oBAAqB,iCAAkC,AAC9D,QAAOC,+BAAgC,+CAAgD,AACvF,QAAOC,0BAA2B,oCAAqC,AACvE,QAAOC,4BAA6B,sCAAuC,CAyB3E,MAAMC,eAAiB,sBAEvB,MAAMC,0BACJ,6MAEF,MAAMC,aAAkC,CACtC,CACEC,MAAO,iBACPC,KAAM,6BACNC,KAAM,iBACR,EACA,CACEF,MAAO,eACPC,KAAM,gCACNC,KAAM,eACR,EACA,CACEF,MAAO,OACPC,KAAM,oCACNC,KAAM,YACR,EACA,CACEF,MAAO,wBACPC,KAAM,gCACNC,KAAM,0BACR,EACD,CAED,MAAMC,mBAA2C,CAC/CC,QAAS,iBACTC,QAAS,gEACTC,UAAW,aACXC,IAAK,kBACLC,MAAOhB,qBACT,EAEA,MAAMiB,cAAmC,CACvC,CACET,MAAO,iBACPC,KAAM,iCACNC,KAAM,kBACNQ,SAAU,IACZ,EACA,CACEV,MAAO,UACPC,KAAM,mCACNC,KAAM,iCACR,EACA,CACEF,MAAO,UACPC,KAAM,mCACNC,KAAM,oBACR,EACA,CACEF,MAAO,aACPC,KAAM,yBACNC,KAAM,uBACR,EACA,CACEF,MAAO,SACPC,KAAM,gCACNC,KAAM,mBACR,EACD,CAED,MAAMS,iBAAyC,CAC7CP,QAAS,kCACTC,QACE,0GACFC,UAAW,aACXC,IAAK,SACLC,MAAOf,eACT,EAEA,MAAMmB,YAAiC,CACrC,CACEZ,MAAO,aACPC,KAAM,sBACNC,KAAM,SACNQ,SAAU,IACZ,EACA,CACEV,MAAO,mBACPC,KAAM,wBACNC,KAAM,eACR,EACA,CACEF,MAAO,UACPC,KAAM,6BACNC,KAAM,UACR,EACA,CACEF,MAAO,OACPC,KAAM,8BACNC,KAAM,OACR,EACD,CAED,MAAMW,WAAa,CACjB,CACEL,MAAOd,2BACPoB,KAAM,kCACR,EACA,CACEN,MAAOb,sBACPmB,KAAM,6BACR,EACA,CACEN,MAAOZ,wBACPkB,KAAM,+BACR,EACD,AAED,QAAO,MAAMC,cAAgB,CAC3B,CAAEC,KAAM,UAAWd,KAAM,WAAYe,eAAgB,IAAK,EAC1D,CAAED,KAAM,OAAQd,KAAM,QAASe,eAAgB,IAAK,EACrD,AAAC,AAEF,QAAO,MAAMC,mBAAiC,CAC5C,CACEF,KAAM,WACNX,QACE,oBAAChB,cACC8B,mBAAoB,KACpBC,mBAAmB,OACnBC,gBAAiBtB,aACjBuB,kBAAkB,WAClBC,iBAAkB,oBAACjC,QAAOkC,UAAWjC,UAAWkC,gBAAAA,SAGpD5B,cACF,EACA,CACEmB,KAAM,YACNX,QACE,oBAAChB,cACCqC,UAAWvB,mBACXiB,mBAAoBtB,0BACpBuB,gBAAiBZ,gBAGrBZ,cACF,EACA,CACEmB,KAAM,UACNX,QACE,oBAAChB,cACCqC,UAAWf,iBACXS,mBAAoBtB,0BACpBuB,gBAAiBT,YACjBW,iBACE,oBAACI,OAAIC,UAAU,iCACZf,WAAWgB,GAAG,CAAC,AAACC,OACf,oBAACC,OACCC,IAAKF,MAAMhB,IAAI,CACfmB,IAAKH,MAAMtB,KAAK,CAChB0B,IAAKJ,MAAMhB,IAAI,CACfqB,MAAM,KACNC,OAAO,WAOnBvC,cACF,KACGkB,cACJ,AAAC"}

package/core/Meganav/images/fan-engagement-nav-image.png ADDED Viewed

Binary file

package/core/Meganav/images/founders-nav-image.png ADDED Viewed

Binary file

package/core/Meganav.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import React,{useEffect,useState}from"react";import{connectState}from"./remote-data-store.js";import{selectSessionData}from"./remote-session-data.js";import Logo from"./Logo";import MeganavData from"./Meganav/component.json";import MeganavScripts from"./Meganav/component.js";import MeganavItemsDesktop from"./MeganavItemsDesktop";import MeganavItemsSignedIn from"./MeganavItemsSignedIn";import MeganavItemsMobile from"./MeganavItemsMobile";import Notice from"./Notice";import _absUrl from"./url-base.js";import MeganavContentProducts from"./MeganavContentProducts";import MeganavContentUseCases from"./MeganavContentUseCases";import MeganavContentCompany from"./MeganavContentCompany";import MeganavContentDevelopers from"./MeganavContentDevelopers";import MeganavSearch from"./MeganavSearch";const SignIn=({sessionState,theme,loginLink,absUrl,searchDataId})=>{return sessionState.signedIn?React.createElement(MeganavItemsSignedIn,{absUrl:absUrl,sessionState:sessionState,theme:theme,searchDataId:searchDataId}):React.createElement("ul",{className:"hidden md:flex items-center"},React.createElement("li",{className:"ui-meganav-item"},React.createElement("a",{href:absUrl("/contact"),className:`ui-meganav-link ${theme.textColor}`,"data-id":"meganav-link"},"Contact us")),React.createElement("li",{className:"ui-meganav-item"},React.createElement("a",{href:absUrl(loginLink),className:`ui-meganav-link mr-0 ${theme.textColor}`,"data-id":"meganav-link"},"Login")),React.createElement("li",{className:"ui-meganav-item"},React.createElement(MeganavSearch,{absUrl:absUrl,dataId:searchDataId})),React.createElement("li",{className:"ui-meganav-item"},React.createElement("a",{href:absUrl("/sign-up"),"data-id":"meganav-sign-up-btn",className:`ui-btn p-btn-small ${theme.buttonBackgroundColor} ${theme.buttonTextColor}`},"Sign up free")))};const SignInPlaceholder=()=>React.createElement("div",null);const panels={MeganavContentProducts,MeganavContentUseCases,MeganavContentCompany,MeganavContentDevelopers};const Meganav=({paths,themeName="white",notice,loginLink="/login",urlBase,addSearchApiKey,statusUrl,searchDataId})=>{const[sessionState,setSessionState]=useState();useEffect(()=>{connectState(selectSessionData,setSessionState)},[]);useEffect(()=>{const teardown=MeganavScripts({themeName,addSearchApiKey});return()=>teardown()},[sessionState]);const theme=MeganavData.themes[themeName];const absUrl=path=>_absUrl(path,urlBase);return React.createElement("nav",{className:`ui-meganav-wrapper ${theme.backgroundColor} ${theme.barShadow}`,"data-id":"meganav","aria-label":"Main"},notice&&React.createElement(Notice,{...notice.props,config:notice.config}),React.createElement("div",{className:"ui-meganav ui-grid-px"},React.createElement("div",{className:"mr-24"},React.createElement(Logo,{dataId:"meganav-logo",href:urlBase,logoUrl:paths?.logo})),React.createElement(MeganavItemsDesktop,{panels:panels,paths:paths,theme:theme,absUrl:absUrl,statusUrl:statusUrl}),sessionState?React.createElement(SignIn,{sessionState:sessionState,theme:theme,loginLink:loginLink,absUrl:absUrl,searchDataId:searchDataId}):React.createElement(SignInPlaceholder,null),React.createElement(MeganavItemsMobile,{panels:panels,sessionState:sessionState,paths:paths,theme:theme,loginLink:loginLink,absUrl:absUrl,statusUrl:statusUrl,searchDataId:searchDataId})))};export default Meganav;
+import React,{useEffect,useMemo}from"react";import Header from"./Header";import Icon from"./Icon";import Flyout from"./Flyout";import{menuItemsForHeader}from"./Meganav/data";import{MeganavMobile}from"./Meganav/MeganavMobile";import Notice from"./Notice";import{HEADER_HEIGHT}from"./utils/heights";const Meganav=({sessionState,searchDataId,notice,theme})=>{const[noticeHeight,setNoticeHeight]=React.useState(0);const mobileNavItems=useMemo(()=>menuItemsForHeader.filter(item=>!item.isHiddenMobile).map(({name,link,content})=>({name,link,content})),[]);useEffect(()=>{const observeNoticeResize=()=>{const noticeElement=document.querySelector('[data-id="ui-notice"]');if(noticeElement){setNoticeHeight(noticeElement.getBoundingClientRect().height)}};observeNoticeResize();window.addEventListener("resize",observeNoticeResize);return()=>window.removeEventListener("resize",observeNoticeResize)},[]);return React.createElement(React.Fragment,null,React.createElement("div",{className:"absolute inset-0 w-full z-50",id:theme==="dark"?"meganav-theme-dark":"meganav","data-testid":"meganav",style:{height:HEADER_HEIGHT+noticeHeight}},notice&&React.createElement(Notice,{...notice.props,config:notice.config}),React.createElement(Header,{className:"max-w-screen-xl mx-auto px-0 sm:px-32 md:px-40 lg:px-64",isNoticeVisible:!!notice,nav:React.createElement(Flyout,{menuItems:menuItemsForHeader,className:"justify-left z-40",flyOutClassName:"flex justify-left",viewPortClassName:"ui-shadow-lg-medium border border-neutral-000 dark:border-neutral-1300 rounded-2xl mt-8 bg-neutral-000 dark:bg-neutral-1300",hasAnimation:true}),mobileNav:React.createElement(MeganavMobile,{mobileNavItems:mobileNavItems}),searchButton:React.createElement("button",{type:"button","data-control":"search","data-id":searchDataId,className:"cursor-pointer w-auto group focus:outline-none mx-0 px-0 flex justify-center","aria-expanded":"false","aria-controls":"panel-search","aria-label":"Ask AI"},React.createElement(Icon,{name:"icon-gui-magnifying-glass-outline",color:"text-neutral-1000 hover:text-neutral-1300 dark:text-neutral-300 hover:dark:text-neutral-000",size:"24px"})),headerLinks:[{href:"/contact",label:"Contact us"}],sessionState:sessionState,themedScrollpoints:[{id:"meganav",className:"ui-theme-light !bg-transparent !border-none"},{id:"meganav-theme-dark",className:"ui-theme-dark !bg-transparent !border-none"},{id:"main",className:"ui-theme-light"},{id:"main-theme-light",className:"ui-theme-light"},{id:"main-theme-dark",className:"ui-theme-dark"}]})))};export default Meganav;
 //# sourceMappingURL=Meganav.js.map

package/core/Meganav.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/core/Meganav.tsx"],"sourcesContent":["import React, { ~~ReactNode,~~ useEffect, ~~useState~~ } from \"react\";\n\nimport { ~~connectState~~ } from \"./~~remote-data-store.js~~\";\nimport { ~~selectSessionData }~~ from \"./~~remote-session-data.js~~\";\n\nimport ~~Logo~~ from \"./~~Logo~~\";\nimport ~~MeganavData~~ ~~from~~ ~~\"./Meganav/component.json\";\nimport~~ ~~MeganavScripts~~ from \"./Meganav/~~component.js~~\";\nimport ~~MeganavItemsDesktop~~ ~~from~~ ~~\"./MeganavItemsDesktop\";\nimport~~ ~~MeganavItemsSignedIn~~ from \"./~~MeganavItemsSignedIn~~\";\nimport ~~MeganavItemsMobile from \"./MeganavItemsMobile\";\nimport~~ Notice from \"./Notice\";\nimport _absUrl from \"./url-base.js\";\nimport MeganavContentProducts from \"./MeganavContentProducts\";\nimport MeganavContentUseCases from \"./MeganavContentUseCases\";\nimport MeganavContentCompany from \"./MeganavContentCompany\";\nimport MeganavContentDevelopers from \"./MeganavContentDevelopers\";\nimport MeganavSearch from \"./MeganavSearch\";\nimport { ~~ColorClass~~ } from \"./~~styles~~/~~colors/types~~\";\n\nexport type ~~MeganavTheme~~ = {\n ~~backgroundColor?: ColorClass;\n textColor?: ColorClass;\n buttonBackgroundColor?: ColorClass;\n buttonTextColor?: ColorClass;\n mobileMenuColor~~: ~~ColorClass;\n logoTextColor?: ColorClass;\n barShadow?: string;\n};\n\nexport type AbsUrl = (path: string) => string;\n\nexport type MeganavPaths =~~ {\n ~~logo?: string;\n iconSprites~~: string;\n ~~ablyStack~~: string;\n ~~awsLogo?: string;\n};\n\nexport type MeganavPanels = {\n [index~~: string~~]: ({\n paths,\n absUrl,\n statusUrl,\n }: {\n paths?: MeganavPaths~~;\n ~~absUrl~~: ~~(path:~~ string~~) => string~~;\n ~~statusUrl~~: ~~string~~;\n }~~) => ReactNode~~;\n~~};\n\nexport type MeganavSessionState = {\n~~ ~~signedIn~~: ~~boolean;\n logOut:~~ {\n ~~token~~: string;\n ~~href~~: string~~;\n text:~~ ~~string;\n };\n accountName:~~ ~~string~~;\n ~~preferredEmail: string;\n account: {\n~~ ~~links~~: {\n ~~dashboard~~: ~~{\n href: string~~;\n };\n };\n };\n ~~mySettings:~~ {\n ~~text~~: ~~string~~;\n ~~href~~: string;\n };\n ~~myAccessTokens:~~ ~~{\n text:~~ string;\n ~~href: string;\n~~ };\n~~};\n~~\~~ntype~~ ~~SignInProps~~ = {\n sessionState~~: MeganavSessionState;\~~n ~~theme: MeganavTheme;\~~n ~~loginLink: string;\~~n ~~absUrl: AbsUrl;\~~n ~~searchDataId?: string;\n~~}~~;\n\n//~~ ~~This~~ ~~type~~ ~~is based on the API response from the notice API and the data~~\n// ~~passed into the Meganav component~~, ~~which~~ ~~then~~ ~~turns~~ it ~~into~~ ~~something~~\n// ~~the~~ ~~Notice~~ ~~component can use~~. ~~The type is exported for the benefit of~~\n// ~~Voltaire\nexport~~ ~~type~~ ~~NoticeApiProps~~ = ~~{\n props:~~ {~~\n title:~~ ~~string;\n bodyText:~~ ~~string;\n buttonLink:~~ ~~string;\n buttonLabel:~~ ~~string;\~~n ~~closeBtn: boolean;\~~n };\n ~~config:~~ {\n ~~cookieId:~~ ~~string;\n noticeId:~~ ~~string~~ \| ~~number;\n options:~~ {\n ~~collapse:~~ ~~boolean~~;\n };\n };\n};\n~~\ntype MeganavProps = {\n paths?: MeganavPaths~~;\n ~~themeName:~~ \"~~white~~\" \| ~~\"black\"~~ \| \"~~transparentToWhite~~\"~~;\n notice?:~~ ~~NoticeApiProps~~;\n ~~loginLink?:~~ ~~string~~;\n ~~urlBase?: string;\n addSearchApiKey: string;\n statusUrl: string;\n searchDataId?: string;\n};\n~~\~~nconst SignIn = ({\~~n ~~sessionState,\n theme,\n loginLink,\n absUrl,\n searchDataId,\n}: SignInProps) => {\n~~ return ~~sessionState.signedIn ?~~ (\n ~~<MeganavItemsSignedIn\~~n ~~absUrl={absUrl}~~\n ~~sessionState={sessionState}\n theme={theme}\n searchDataId={searchDataId}\n />\n ) : (\n <ul~~ className=\"~~hidden~~ ~~md:flex~~ ~~items~~-~~center\">\n <li~~ ~~className=\"ui~~-~~meganav-item~~\">\n ~~<a\n href~~={~~absUrl(~~\"~~/contact~~\")}\~~n className={`ui-~~meganav-~~link~~ ~~${theme.textColor~~}`}\n data-id=\"meganav~~-link~~\"\n ~~>\n Contact~~ us\n ~~</a>\n~~ ~~</li~~>\n <li ~~className=\"ui-meganav-item~~\~~">\~~n <a\n ~~href={absUrl(loginLink)}\n~~ className~~={`ui~~-~~meganav~~-~~link~~ mr-0 ~~${theme.textColor}`}\n data~~-~~id=\"meganav~~-~~link~~\"\n >\n ~~Login~~\n ~~</a>\n </li>\n~~ <~~li className=\"ui-meganav-item~~\~~">\~~n ~~<MeganavSearch absUrl~~={~~absUrl~~} ~~dataId={searchDataId} />\~~n ~~</li>\n <li~~ className=\"ui-~~meganav~~-~~item~~\"~~>\n <a~~\n ~~href={absUrl(\~~"~~/sign~~-up\")}\n ~~data-id~~=\"~~meganav~~-~~sign~~-up-~~btn\"\n className={`ui~~-~~btn~~ p-~~btn~~-~~small~~ ~~${theme.buttonBackgroundColor}~~ ~~${theme.buttonTextColor}`}\n >\n Sign~~ up ~~free~~\~~n </a>\n </li>\n </ul>\n );\n};\n~~\~~nconst SignInPlaceholder = () => <div />;\~~n~~\nconst panels~~ = {\n ~~MeganavContentProducts,\~~n ~~MeganavContentUseCases,\n MeganavContentCompany,\n MeganavContentDevelopers,\n~~};\n~~\nconst Meganav~~ = ({~~\n paths,\n themeName~~ = \~~"white\",\~~n ~~notice,\n loginLink~~ = ~~\"/login\",\n urlBase,\n addSearchApiKey,\n statusUrl,\n searchDataId,\n}: MeganavProps) =>~~ {\n ~~const [sessionState, setSessionState] = useState~~<~~MeganavSessionState>();\n~~\n ~~useEffect(() => {~~\~~n // Note if state is never updated, sessionState stays null and never removes the placeholder.\n // This makes SSR consistent (ie. we always show the placeholder)~~\n ~~connectState(selectSessionData, setSessionState);\n }, []);\n~~\~~n useEffect(() => {~~\n ~~const teardown~~ = ~~MeganavScripts(~~{ ~~themeName, addSearchApiKey~~ }~~);\n return () => teardown();\n }, [sessionState]);\n~~\n ~~const~~ ~~theme~~ = ~~MeganavData.themes[themeName] as MeganavTheme;\n const absUrl = (path~~: ~~string)~~ => ~~_absUrl(path,~~ ~~urlBase);\n~~\~~n return (~~\n ~~<nav\n className={`ui~~-~~meganav-wrapper ${theme.backgroundColor} ${theme.barShadow}`}~~\n ~~data~~-id=\"~~meganav~~\"\n aria-label=\"~~Main~~\"\n >\n ~~{notice &&~~ <~~Notice {...notice.props} config={notice.config} />}~~\n ~~<div className~~=\"ui-~~meganav ui~~-~~grid~~-px\">\n ~~<div className~~=\"mr-24\">\n ~~<Logo dataId~~=\"~~meganav-logo~~\" ~~href={urlBase} logoUrl={paths?.logo}~~ />\n </~~div~~>\n~~\n <MeganavItemsDesktop\n~~ ~~panels={panels~~}\n ~~paths~~={~~paths~~}\n ~~theme~~={~~theme~~}\n ~~absUrl~~={~~absUrl}~~\n ~~statusUrl=~~{~~statusUrl}~~\n ~~/>\n~~\n {/* ~~Because we load the session state through fetch, we display a placeholder until fetch returns */}~~\~~n {sessionState~~ ? (\n ~~<SignIn\~~n ~~sessionState=~~{~~sessionState}~~\n theme~~={theme}~~\n ~~loginLink={loginLink}~~\n ~~absUrl={absUrl~~}\n ~~searchDataId=~~{~~searchDataId}~~\n ~~/>\n )~~ : (\n ~~<SignInPlaceholder~~ ~~/>\~~n )}\n\n ~~<MeganavItemsMobile~~\n ~~panels={panels~~}\n ~~sessionState=~~{~~sessionState}~~\n ~~paths={paths}~~\n theme~~={theme}~~\n ~~loginLink={loginLink}~~\~~n absUrl={absUrl}~~\n ~~statusUrl={statusUrl~~}\n ~~searchDataId={searchDataId~~}\n />\n </div>\n ~~</nav>\~~n );\n};\n\nexport default Meganav;\n"],"names":["React","useEffect","~~useState~~","~~connectState~~","~~selectSessionData~~","~~Logo~~","~~MeganavData~~","~~MeganavScripts~~","~~MeganavItemsDesktop~~","~~MeganavItemsSignedIn~~","~~MeganavItemsMobile~~","~~Notice~~","~~_absUrl~~","~~MeganavContentProducts~~","~~MeganavContentUseCases~~","~~MeganavContentCompany~~","~~MeganavContentDevelopers~~","~~MeganavSearch~~","~~SignIn~~","~~sessionState~~","~~theme~~","~~loginLink~~","~~absUrl~~","~~searchDataId~~","~~signedIn~~","ul","~~className~~","li","a","~~href~~","~~textColor~~","~~data-id~~","~~dataId~~","~~buttonBackgroundColor~~","~~buttonTextColor~~","~~SignInPlaceholder~~","~~div~~","~~panels~~","~~Meganav~~","~~paths~~","~~themeName~~","~~notice~~","~~urlBase~~","~~addSearchApiKey~~","~~statusUrl~~","~~setSessionState~~","~~teardown~~","~~themes~~","~~path~~","~~nav~~","~~backgroundColor~~","~~barShadow~~","aria-label","~~props~~","~~config~~","~~logoUrl~~","~~logo~~"],"mappings":"AAAA,OAAOA,~~OAAoBC~~,SAAS,CAAEC,~~QAAQ~~,KAAQ,OAAQ,~~AAE9D~~,~~QAASC~~,~~YAAY~~,~~KAAQ~~,~~wBAAyB,~~AACtD,~~QAASC,iBAAiB,KAAQ,0BAA2B,AAE7D,~~QAAOC,SAAU,QAAS,AAC1B,QAAOC,~~gBAAiB~~,~~0BAA2B~~,~~AACnD~~,~~QAAOC~~,~~mBAAoB~~,~~wBAAyB~~,AACpD,~~QAAOC~~,~~wBAAyB~~,~~uBAAwB~~,~~AACxD,QAAOC,~~yBAA0B,~~wBAAyB~~,~~AAC1D,~~QAAOC,~~uBAAwB,sBAAuB,AACtD,QAAOC,~~WAAY,UAAW,AAC9B,~~QAAOC~~,~~YAAa~~,~~eAAgB~~,~~AACpC,QAAOC,2BAA4B,0BAA2B,AAC9D,QAAOC,2BAA4B,0BAA2B,AAC9D,QAAOC,0BAA2B,yBAA0B,AAC5D,QAAOC,6BAA8B,4BAA6B,AAClE,QAAOC,kBAAmB,~~iBAAkB,~~CAoG5C~~,MAAMC,~~OAAS~~,CAAC,~~CACdC~~,YAAY,CACZC,~~KAAK~~,~~CACLC~~,~~SAAS,CACTC,~~MAAM,CACNC,~~YAAY~~,~~CACA~~,~~IACZ~~,~~OAAOJ~~,~~aAAaK~~,~~QAAQ~~,~~CAC1B~~,~~oBAACf~~,~~sBACCa~~,~~OAAQA~~,~~OACRH~~,~~aAAcA~~,~~aACdC~~,~~MAAOA~~,~~MACPG~~,~~aAAcA~~,~~eAGhB~~,~~oBAACE~~,~~MAAGC~~,~~UAAU,+BACZ~~,~~oBAACC~~,~~MAAGD~~,~~UAAU~~,~~mBACZ~~,~~oBAACE~~,~~KACCC~~,~~KAAMP~~,~~OAAO,YACbI,UAAW,~~CAAC,~~gBAAgB~~,~~EAAEN~~,~~MAAMU~~,~~SAAS~~,~~CAAC~~,~~CAAC~~,~~CAC/CC~~,~~UAAQ~~,~~gBACT~~,~~eAIH~~,~~oBAACJ~~,~~MAAGD~~,~~UAAU~~,~~mBACZ~~,~~oBAACE~~,~~KACCC~~,~~KAAMP~~,~~OAAOD~~,~~WACbK~~,~~UAAW~~,~~CAAC~~,~~qBAAqB~~,~~EAAEN~~,~~MAAMU~~,~~SAAS~~,~~CAAC~~,CAAC,~~CACpDC~~,~~UAAQ~~,~~gBACT~~,~~UAIH~~,~~oBAACJ~~,~~MAAGD~~,~~UAAU~~,~~mBACZ~~,~~oBAACT~~,~~eAAcK~~,~~OAAQA~~,~~OAAQU~~,~~OAAQT~~,~~gBAEzC~~,~~oBAACI~~,~~MAAGD~~,~~UAAU~~,~~mBACZ~~,~~oBAACE~~,~~KACCC~~,~~KAAMP~~,~~OAAO,YACbS,UAAQ,sBACRL,UAAW,CAAC,~~mBAAmB,~~EAAEN,MAAMa,qBAAqB,~~CAAC,~~CAAC~~,~~EAAEb~~,~~MAAMc~~,~~eAAe~~,~~CAAC~~,~~CAAC~~,~~EACxF~~,~~iBAMT~~,~~EAEA~~,~~MAAMC~~,~~kBAAoB~~,~~IAAM~~,~~oBAACC~~,~~YAEjC~~,~~MAAMC~~,~~OAAS~~,~~CACbxB~~,~~uBACAC~~,~~uBACAC~~,~~sBACAC~~,~~wBACF~~,~~EAEA~~,~~MAAMsB~~,QAAU,~~CAAC~~,~~CACfC,KAAK,CACLC,UAAY,OAAO,CACnBC,MAAM,CACNpB,UAAY,~~QAAQ,~~CACpBqB~~,~~OAAO~~,~~CACPC~~,~~eAAe~~,~~CACfC~~,~~SAAS~~,~~CACTrB~~,~~YAAY~~,~~CACC~~,~~IACb~~,~~KAAM,CAACJ,aAAc0B,gBAAgB,CAAG3C,WAExCD,~~UAAU,~~KAGRE~~,~~aAAaC~~,~~kBAAmByC~~,~~gBAClC~~,~~EAAG~~,~~EAAE~~,~~EAEL5C~~,~~UAAU~~,~~KACR~~,~~MAAM6C~~,~~SAAWvC,eAAe,CAAEiC,UAAWG,eAAgB,GAC7D,MAAO,IAAMG,UACf,EAAG,CAAC3B,aAAa,EAEjB,MAAMC,MAAQd,YAAYyC,MAAM,CAACP,~~UAAU,~~CAC3C~~,~~MAAMlB~~,~~OAAS~~,~~AAAC0B~~,~~MAAiBpC~~,~~QAAQoC~~,~~KAAMN~~,~~SAE/C,OACE,oBAACO,OACCvB,~~UAAW,~~CAAC~~,~~mBAAmB~~,~~EAAEN~~,~~MAAM8B,eAAe,CAAC,CAAC,EAAE9B,MAAM~~+B,~~SAAS~~,~~CAAC~~,~~CAAC~~,~~CAC3EpB,UAAQ,UACRqB,aAAW,QAEVX,QAAU,oBAAC9B,QAAQ,GAAG8B,OAAOY,~~KAAK,~~CAAEC~~,~~OAAQb~~,~~OAAOa~~,~~MAAM~~,~~GAC1D~~,~~oBAAClB,OAAIV,~~UAAU,~~yBACb~~,~~oBAACU~~,~~OAAIV~~,~~UAAU~~,~~SACb~~,~~oBAACrB~~,~~MAAK2B~~,~~OAAO~~,~~eAAeH~~,~~KAAMa~~,~~QAASa~~,~~QAAShB~~,~~OAAOiB~~,~~QAG7D~~,~~oBAAChD~~,~~qBACC6B~~,~~OAAQA~~,~~OACRE~~,~~MAAOA~~,~~MACPnB~~,~~MAAOA~~,~~MACPE~~,~~OAAQA~~,~~OACRsB~~,~~UAAWA~~,~~YAIZzB~~,~~aACC~~,~~oBAACD~~,~~QACCC~~,~~aAAcA~~,~~aACdC~~,~~MAAOA~~,~~MACPC~~,~~UAAWA~~,~~UACXC~~,~~OAAQA~~,~~OACRC~~,~~aAAcA~~,~~eAGhB~~,~~oBAACY~~,~~wBAGH~~,~~oBAACzB~~,~~oBACC2B~~,~~OAAQA~~,~~OACRlB~~,~~aAAcA~~,~~aACdoB~~,~~MAAOA~~,~~MACPnB~~,~~MAAOA~~,~~MACPC~~,~~UAAWA~~,~~UACXC~~,~~OAAQA~~,~~OACRsB~~,~~UAAWA~~,~~UACXrB~~,~~aAAcA~~,~~gBAKxB,~~CAEA,~~gBAAee~~,OAAQ"}
1	+ {"version":3,"sources":["../../src/core/Meganav.tsx"],"sourcesContent":["import React, { useEffect, useMemo } from \"react\";\nimport Header, { HeaderSessionState } from \"./Header\";\nimport Icon from \"./Icon\";\nimport Flyout from \"./Flyout\";\nimport { menuItemsForHeader } from \"./Meganav/data\";\nimport { MeganavMobile } from \"./Meganav/MeganavMobile\";\nimport Notice from \"./Notice\";\nimport { HEADER_HEIGHT } from \"./utils/heights\";\n\nexport type MeganavNoticeBannerProps = {\n props: {\n title: string;\n bodyText: string;\n buttonLink: string;\n buttonLabel: string;\n closeBtn: boolean;\n };\n config: {\n cookieId: string;\n noticeId: string \| number;\n options: {\n collapse: boolean;\n };\n };\n};\n\nexport type MeganavProps = {\n sessionState: HeaderSessionState;\n searchDataId: string;\n notice?: MeganavNoticeBannerProps;\n theme?: string;\n};\n\nconst Meganav = ({\n sessionState,\n searchDataId,\n notice,\n theme,\n}: MeganavProps) => {\n const [noticeHeight, setNoticeHeight] = React.useState(0);\n const mobileNavItems = useMemo(\n () =>\n menuItemsForHeader\n .filter((item) => !item.isHiddenMobile)\n .map(({ name, link, content }) => ({ name, link, content })),\n [],\n );\n\n useEffect(() => {\n const observeNoticeResize = () => {\n const noticeElement = document.querySelector('[data-id=\"ui-notice\"]');\n if (noticeElement) {\n setNoticeHeight(noticeElement.getBoundingClientRect().height);\n }\n };\n observeNoticeResize();\n window.addEventListener(\"resize\", observeNoticeResize);\n return () => window.removeEventListener(\"resize\", observeNoticeResize);\n }, []);\n\n return (\n <>\n <div\n className=\"absolute inset-0 w-full z-50\"\n id={theme === \"dark\" ? \"meganav-theme-dark\" : \"meganav\"}\n data-testid=\"meganav\"\n style={{ height: HEADER_HEIGHT + noticeHeight }}\n >\n {notice && <Notice {...notice.props} config={notice.config} />}\n <Header\n className=\"max-w-screen-xl mx-auto px-0 sm:px-32 md:px-40 lg:px-64\"\n isNoticeVisible={!!notice}\n nav={\n <Flyout\n menuItems={menuItemsForHeader}\n className=\"justify-left z-40\"\n flyOutClassName=\"flex justify-left\"\n viewPortClassName=\"ui-shadow-lg-medium border border-neutral-000 dark:border-neutral-1300 rounded-2xl mt-8 bg-neutral-000 dark:bg-neutral-1300\"\n hasAnimation={true}\n />\n }\n mobileNav={<MeganavMobile mobileNavItems={mobileNavItems} />}\n searchButton={\n <button\n type=\"button\"\n data-control=\"search\"\n data-id={searchDataId}\n className=\"cursor-pointer w-auto group focus:outline-none mx-0 px-0 flex justify-center\"\n aria-expanded=\"false\"\n aria-controls=\"panel-search\"\n aria-label=\"Ask AI\"\n >\n <Icon\n name=\"icon-gui-magnifying-glass-outline\"\n color=\"text-neutral-1000 hover:text-neutral-1300\n dark:text-neutral-300 hover:dark:text-neutral-000\"\n size=\"24px\"\n />\n </button>\n }\n headerLinks={[{ href: \"/contact\", label: \"Contact us\" }]}\n sessionState={sessionState}\n themedScrollpoints={[\n {\n id: \"meganav\",\n className: \"ui-theme-light !bg-transparent !border-none\",\n },\n {\n id: \"meganav-theme-dark\",\n className: \"ui-theme-dark !bg-transparent !border-none\",\n },\n {\n id: \"main\",\n className: \"ui-theme-light\",\n },\n {\n id: \"main-theme-light\",\n className: \"ui-theme-light\",\n },\n {\n id: \"main-theme-dark\",\n className: \"ui-theme-dark\",\n },\n ]}\n />\n </div>\n </>\n );\n};\n\nexport default Meganav;\n"],"names":["React","useEffect","useMemo","Header","Icon","Flyout","menuItemsForHeader","MeganavMobile","Notice","HEADER_HEIGHT","Meganav","sessionState","searchDataId","notice","theme","noticeHeight","setNoticeHeight","useState","mobileNavItems","filter","item","isHiddenMobile","map","name","link","content","observeNoticeResize","noticeElement","document","querySelector","getBoundingClientRect","height","window","addEventListener","removeEventListener","div","className","id","data-testid","style","props","config","isNoticeVisible","nav","menuItems","flyOutClassName","viewPortClassName","hasAnimation","mobileNav","searchButton","button","type","data-control","data-id","aria-expanded","aria-controls","aria-label","color","size","headerLinks","href","label","themedScrollpoints"],"mappings":"AAAA,OAAOA,OAASC,SAAS,CAAEC,OAAO,KAAQ,OAAQ,AAClD,QAAOC,WAAoC,UAAW,AACtD,QAAOC,SAAU,QAAS,AAC1B,QAAOC,WAAY,UAAW,AAC9B,QAASC,kBAAkB,KAAQ,gBAAiB,AACpD,QAASC,aAAa,KAAQ,yBAA0B,AACxD,QAAOC,WAAY,UAAW,AAC9B,QAASC,aAAa,KAAQ,iBAAkB,CA0BhD,MAAMC,QAAU,CAAC,CACfC,YAAY,CACZC,YAAY,CACZC,MAAM,CACNC,KAAK,CACQ,IACb,KAAM,CAACC,aAAcC,gBAAgB,CAAGhB,MAAMiB,QAAQ,CAAC,GACvD,MAAMC,eAAiBhB,QACrB,IACEI,mBACGa,MAAM,CAAC,AAACC,MAAS,CAACA,KAAKC,cAAc,EACrCC,GAAG,CAAC,CAAC,CAAEC,IAAI,CAAEC,IAAI,CAAEC,OAAO,CAAE,GAAM,CAAA,CAAEF,KAAMC,KAAMC,OAAQ,CAAA,GAC7D,EAAE,EAGJxB,UAAU,KACR,MAAMyB,oBAAsB,KAC1B,MAAMC,cAAgBC,SAASC,aAAa,CAAC,yBAC7C,GAAIF,cAAe,CACjBX,gBAAgBW,cAAcG,qBAAqB,GAAGC,MAAM,CAC9D,CACF,EACAL,sBACAM,OAAOC,gBAAgB,CAAC,SAAUP,qBAClC,MAAO,IAAMM,OAAOE,mBAAmB,CAAC,SAAUR,oBACpD,EAAG,EAAE,EAEL,OACE,wCACE,oBAACS,OACCC,UAAU,+BACVC,GAAIvB,QAAU,OAAS,qBAAuB,UAC9CwB,cAAY,UACZC,MAAO,CAAER,OAAQtB,cAAgBM,YAAa,GAE7CF,QAAU,oBAACL,QAAQ,GAAGK,OAAO2B,KAAK,CAAEC,OAAQ5B,OAAO4B,MAAM,GAC1D,oBAACtC,QACCiC,UAAU,0DACVM,gBAAiB,CAAC,CAAC7B,OACnB8B,IACE,oBAACtC,QACCuC,UAAWtC,mBACX8B,UAAU,oBACVS,gBAAgB,oBAChBC,kBAAkB,8HAClBC,aAAc,OAGlBC,UAAW,oBAACzC,eAAcW,eAAgBA,iBAC1C+B,aACE,oBAACC,UACCC,KAAK,SACLC,eAAa,SACbC,UAASzC,aACTwB,UAAU,+EACVkB,gBAAc,QACdC,gBAAc,eACdC,aAAW,UAEX,oBAACpD,MACCmB,KAAK,oCACLkC,MAAM,8FAENC,KAAK,UAIXC,YAAa,CAAC,CAAEC,KAAM,WAAYC,MAAO,YAAa,EAAE,CACxDlD,aAAcA,aACdmD,mBAAoB,CAClB,CACEzB,GAAI,UACJD,UAAW,6CACb,EACA,CACEC,GAAI,qBACJD,UAAW,4CACb,EACA,CACEC,GAAI,OACJD,UAAW,gBACb,EACA,CACEC,GAAI,mBACJD,UAAW,gBACb,EACA,CACEC,GAAI,kBACJD,UAAW,eACb,EACD,IAKX,CAEA,gBAAe1B,OAAQ"}

package/core/Notice/component.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import Cookie from"js-cookie";import throttle from"lodash.throttle";import{queryId}from"../dom-query";import{FLASH_DATA_ID}from"../Flash";const COOKIE_EXPIRY=90;const COLLAPSE_TRIGGER_DISTANCE=5;const SCROLL_LISTENER_THROTTLE=100;const RESIZE_LISTENER_THROTTLE=100;const isMdViewport=()=>!window.matchMedia(`(min-width: 65rem)`).matches;const adjustFlashMargin=open=>{const flash=queryId(FLASH_DATA_ID);if(flash){flash.style.marginTop=open?`4rem`:null}};const hideOnMobile=bannerContainer=>{if(isMdViewport()){bannerContainer.style.display="none"}else{bannerContainer.style.display=null}};const hideNotice=bannerContainer=>{bannerContainer.style.maxHeight=0;bannerContainer.style.overflow="hidden";adjustFlashMargin(false)};const showNotice=bannerContainer=>{bannerContainer.style.maxHeight=null;bannerContainer.style.overflow=null;adjustFlashMargin(true)};const setupRememberClosed=(cookieId,noticeId)=>{const cookie=Cookie.get(cookieId)||"";Cookie.set(cookieId,`${cookie.replace(`${noticeId},`,"")+noticeId},`,{expires:COOKIE_EXPIRY})};const hasBeenClosedBefore=(cookieId,noticeId)=>(Cookie.get(cookieId)||"").includes(noticeId);const setupNoticeCollapse=bannerContainer=>{const scrollTop=window.scrollY;if(scrollTop>COLLAPSE_TRIGGER_DISTANCE){hideNotice(bannerContainer)}const listener=throttle(()=>{const scrollTop=window.scrollY;if(scrollTop>COLLAPSE_TRIGGER_DISTANCE){hideNotice(bannerContainer)}else if(bannerContainer.style.overflow){showNotice(bannerContainer)}},SCROLL_LISTENER_THROTTLE);document.addEventListener("scroll",listener);return()=>document.removeEventListener("scroll",listener)};const setupCloseBtn=(bannerContainer,cookieId,noticeId,collapseUnmountListeners)=>{const closeBtn=bannerContainer.querySelector("button");if(!closeBtn)return()=>{};const listener=()=>{if(cookieId&&noticeId)setupRememberClosed(cookieId,noticeId);hideNotice(bannerContainer);collapseUnmountListeners()};closeBtn.addEventListener("click",listener);return()=>document.removeEventListener("click",listener)};const resizeHandler=bannerContainer=>{const handler=throttle(()=>{hideOnMobile(bannerContainer)},RESIZE_LISTENER_THROTTLE);window.addEventListener("resize",handler);return()=>window.removeEventListener("resize",handler)};const Notice=({bannerContainer,cookieId,noticeId,options})=>{if(typeof window==="undefined")return()=>{};if(!bannerContainer){console.warn("A Notice component was initited but no notice container was found.");return()=>{}}if(hasBeenClosedBefore(cookieId,noticeId))return()=>{};hideOnMobile(bannerContainer);showNotice(bannerContainer);const opts={collapse:true,...options};const collapseUnmountListeners=opts.collapse?setupNoticeCollapse(bannerContainer):()=>{};const closeBtnUnmountListeners=setupCloseBtn(bannerContainer,cookieId,noticeId,collapseUnmountListeners);const resizeUnmountListener=resizeHandler(bannerContainer);return()=>{[closeBtnUnmountListeners,collapseUnmountListeners,resizeUnmountListener].forEach(unmount=>unmount())}};export default Notice;
+import Cookie from"js-cookie";import throttle from"lodash.throttle";import{queryId}from"../dom-query";import{FLASH_DATA_ID}from"../Flash";const COOKIE_EXPIRY=90;export const COLLAPSE_TRIGGER_DISTANCE=5;const SCROLL_LISTENER_THROTTLE=100;const RESIZE_LISTENER_THROTTLE=100;const isMdViewport=()=>!window.matchMedia(`(min-width: 65rem)`).matches;const adjustFlashMargin=open=>{const flash=queryId(FLASH_DATA_ID);if(flash){flash.style.marginTop=open?`4rem`:null}};const hideOnMobile=bannerContainer=>{if(isMdViewport()){bannerContainer.style.display="none"}else{bannerContainer.style.display=null}};const hideNotice=bannerContainer=>{bannerContainer.style.maxHeight=0;bannerContainer.style.overflow="hidden";adjustFlashMargin(false)};const showNotice=bannerContainer=>{bannerContainer.style.maxHeight=null;bannerContainer.style.overflow=null;adjustFlashMargin(true)};const setupRememberClosed=(cookieId,noticeId)=>{const cookie=Cookie.get(cookieId)||"";Cookie.set(cookieId,`${cookie.replace(`${noticeId},`,"")+noticeId},`,{expires:COOKIE_EXPIRY})};const hasBeenClosedBefore=(cookieId,noticeId)=>(Cookie.get(cookieId)||"").includes(noticeId);const setupNoticeCollapse=bannerContainer=>{const scrollTop=window.scrollY;if(scrollTop>COLLAPSE_TRIGGER_DISTANCE){hideNotice(bannerContainer)}const listener=throttle(()=>{const scrollTop=window.scrollY;if(scrollTop>COLLAPSE_TRIGGER_DISTANCE){hideNotice(bannerContainer)}else if(bannerContainer.style.overflow){showNotice(bannerContainer)}},SCROLL_LISTENER_THROTTLE);document.addEventListener("scroll",listener);return()=>document.removeEventListener("scroll",listener)};const setupCloseBtn=(bannerContainer,cookieId,noticeId,collapseUnmountListeners)=>{const closeBtn=bannerContainer.querySelector("button");if(!closeBtn)return()=>{};const listener=()=>{if(cookieId&&noticeId)setupRememberClosed(cookieId,noticeId);hideNotice(bannerContainer);collapseUnmountListeners()};closeBtn.addEventListener("click",listener);return()=>document.removeEventListener("click",listener)};const resizeHandler=bannerContainer=>{const handler=throttle(()=>{hideOnMobile(bannerContainer)},RESIZE_LISTENER_THROTTLE);window.addEventListener("resize",handler);return()=>window.removeEventListener("resize",handler)};const Notice=({bannerContainer,cookieId,noticeId,options})=>{if(typeof window==="undefined")return()=>{};if(!bannerContainer){console.warn("A Notice component was initited but no notice container was found.");return()=>{}}if(hasBeenClosedBefore(cookieId,noticeId))return()=>{};hideOnMobile(bannerContainer);showNotice(bannerContainer);const opts={collapse:true,...options};const collapseUnmountListeners=opts.collapse?setupNoticeCollapse(bannerContainer):()=>{};const closeBtnUnmountListeners=setupCloseBtn(bannerContainer,cookieId,noticeId,collapseUnmountListeners);const resizeUnmountListener=resizeHandler(bannerContainer);return()=>{[closeBtnUnmountListeners,collapseUnmountListeners,resizeUnmountListener].forEach(unmount=>unmount())}};export default Notice;
 //# sourceMappingURL=component.js.map

package/core/Notice/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/core/Notice/component.js"],"sourcesContent":["import Cookie from \"js-cookie\";\nimport throttle from \"lodash.throttle\";\n\nimport { queryId } from \"../dom-query\";\nimport { FLASH_DATA_ID } from \"../Flash\";\n\nconst COOKIE_EXPIRY = 90;\~~nconst~~ COLLAPSE_TRIGGER_DISTANCE = 5;\nconst SCROLL_LISTENER_THROTTLE = 100;\nconst RESIZE_LISTENER_THROTTLE = 100;\n\nconst isMdViewport = () => !window.matchMedia(`(min-width: 65rem)`).matches;\n\nconst adjustFlashMargin = (open) => {\n // HACK ALERT\n // Add margin to flashes when opening the notice.\n // Flashes are react components and this notice needs to work as a view-component and react component.\n // We could do this with redux but then we potentially update state on every scroll event, which\n // even with debounce will deplate our frame budget.\n\n const flash = queryId(FLASH_DATA_ID);\n\n if (flash) {\n flash.style.marginTop = open ? `4rem` : null;\n }\n};\n\nconst hideOnMobile = (bannerContainer) => {\n if (isMdViewport()) {\n bannerContainer.style.display = \"none\";\n } else {\n bannerContainer.style.display = null;\n }\n};\n\nconst hideNotice = (bannerContainer) => {\n bannerContainer.style.maxHeight = 0;\n bannerContainer.style.overflow = \"hidden\";\n\n adjustFlashMargin(false);\n};\n\nconst showNotice = (bannerContainer) => {\n bannerContainer.style.maxHeight = null;\n bannerContainer.style.overflow = null;\n\n adjustFlashMargin(true);\n};\n\nconst setupRememberClosed = (cookieId, noticeId) => {\n const cookie = Cookie.get(cookieId) \|\| \"\";\n\n Cookie.set(cookieId, `${cookie.replace(`${noticeId},`, \"\") + noticeId},`, {\n expires: COOKIE_EXPIRY,\n });\n};\n\nconst hasBeenClosedBefore = (cookieId, noticeId) =>\n (Cookie.get(cookieId) \|\| \"\").includes(noticeId);\n\nconst setupNoticeCollapse = (bannerContainer) => {\n const scrollTop = window.scrollY;\n\n if (scrollTop > COLLAPSE_TRIGGER_DISTANCE) {\n hideNotice(bannerContainer);\n }\n\n const listener = throttle(() => {\n const scrollTop = window.scrollY;\n\n if (scrollTop > COLLAPSE_TRIGGER_DISTANCE) {\n hideNotice(bannerContainer);\n } else if (bannerContainer.style.overflow) {\n showNotice(bannerContainer);\n }\n }, SCROLL_LISTENER_THROTTLE);\n\n document.addEventListener(\"scroll\", listener);\n\n return () => document.removeEventListener(\"scroll\", listener);\n};\n\nconst setupCloseBtn = (\n bannerContainer,\n cookieId,\n noticeId,\n collapseUnmountListeners,\n) => {\n const closeBtn = bannerContainer.querySelector(\"button\");\n\n if (!closeBtn) return () => {};\n\n const listener = () => {\n if (cookieId && noticeId) setupRememberClosed(cookieId, noticeId);\n\n hideNotice(bannerContainer);\n collapseUnmountListeners();\n };\n\n closeBtn.addEventListener(\"click\", listener);\n\n return () => document.removeEventListener(\"click\", listener);\n};\n\nconst resizeHandler = (bannerContainer) => {\n const handler = throttle(() => {\n hideOnMobile(bannerContainer);\n }, RESIZE_LISTENER_THROTTLE);\n\n window.addEventListener(\"resize\", handler);\n\n return () => window.removeEventListener(\"resize\", handler);\n};\n\nconst Notice = ({ bannerContainer, cookieId, noticeId, options }) => {\n if (typeof window === \"undefined\") return () => {};\n\n if (!bannerContainer) {\n console.warn(\n \"A Notice component was initited but no notice container was found.\",\n );\n return () => {};\n }\n\n if (hasBeenClosedBefore(cookieId, noticeId)) return () => {};\n\n hideOnMobile(bannerContainer);\n showNotice(bannerContainer);\n\n const opts = { collapse: true, ...options };\n\n const collapseUnmountListeners = opts.collapse\n ? setupNoticeCollapse(bannerContainer)\n : () => {};\n\n const closeBtnUnmountListeners = setupCloseBtn(\n bannerContainer,\n cookieId,\n noticeId,\n collapseUnmountListeners,\n );\n\n const resizeUnmountListener = resizeHandler(bannerContainer);\n\n return () => {\n [\n closeBtnUnmountListeners,\n collapseUnmountListeners,\n resizeUnmountListener,\n ].forEach((unmount) => unmount());\n };\n};\n\nexport default Notice;\n"],"names":["Cookie","throttle","queryId","FLASH_DATA_ID","COOKIE_EXPIRY","COLLAPSE_TRIGGER_DISTANCE","SCROLL_LISTENER_THROTTLE","RESIZE_LISTENER_THROTTLE","isMdViewport","window","matchMedia","matches","adjustFlashMargin","open","flash","style","marginTop","hideOnMobile","bannerContainer","display","hideNotice","maxHeight","overflow","showNotice","setupRememberClosed","cookieId","noticeId","cookie","get","set","replace","expires","hasBeenClosedBefore","includes","setupNoticeCollapse","scrollTop","scrollY","listener","document","addEventListener","removeEventListener","setupCloseBtn","collapseUnmountListeners","closeBtn","querySelector","resizeHandler","handler","Notice","options","console","warn","opts","collapse","closeBtnUnmountListeners","resizeUnmountListener","forEach","unmount"],"mappings":"AAAA,OAAOA,WAAY,WAAY,AAC/B,QAAOC,aAAc,iBAAkB,AAEvC,QAASC,OAAO,KAAQ,cAAe,AACvC,QAASC,aAAa,KAAQ,UAAW,CAEzC,MAAMC,cAAgB,~~GACtB~~,MAAMC,0BAA4B,~~EAClC~~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"}
1	+ {"version":3,"sources":["../../../src/core/Notice/component.js"],"sourcesContent":["import Cookie from \"js-cookie\";\nimport throttle from \"lodash.throttle\";\n\nimport { queryId } from \"../dom-query\";\nimport { FLASH_DATA_ID } from \"../Flash\";\n\nconst COOKIE_EXPIRY = 90;\nexport const COLLAPSE_TRIGGER_DISTANCE = 5;\nconst SCROLL_LISTENER_THROTTLE = 100;\nconst RESIZE_LISTENER_THROTTLE = 100;\n\nconst isMdViewport = () => !window.matchMedia(`(min-width: 65rem)`).matches;\n\nconst adjustFlashMargin = (open) => {\n // HACK ALERT\n // Add margin to flashes when opening the notice.\n // Flashes are react components and this notice needs to work as a view-component and react component.\n // We could do this with redux but then we potentially update state on every scroll event, which\n // even with debounce will deplate our frame budget.\n\n const flash = queryId(FLASH_DATA_ID);\n\n if (flash) {\n flash.style.marginTop = open ? `4rem` : null;\n }\n};\n\nconst hideOnMobile = (bannerContainer) => {\n if (isMdViewport()) {\n bannerContainer.style.display = \"none\";\n } else {\n bannerContainer.style.display = null;\n }\n};\n\nconst hideNotice = (bannerContainer) => {\n bannerContainer.style.maxHeight = 0;\n bannerContainer.style.overflow = \"hidden\";\n\n adjustFlashMargin(false);\n};\n\nconst showNotice = (bannerContainer) => {\n bannerContainer.style.maxHeight = null;\n bannerContainer.style.overflow = null;\n\n adjustFlashMargin(true);\n};\n\nconst setupRememberClosed = (cookieId, noticeId) => {\n const cookie = Cookie.get(cookieId) \|\| \"\";\n\n Cookie.set(cookieId, `${cookie.replace(`${noticeId},`, \"\") + noticeId},`, {\n expires: COOKIE_EXPIRY,\n });\n};\n\nconst hasBeenClosedBefore = (cookieId, noticeId) =>\n (Cookie.get(cookieId) \|\| \"\").includes(noticeId);\n\nconst setupNoticeCollapse = (bannerContainer) => {\n const scrollTop = window.scrollY;\n\n if (scrollTop > COLLAPSE_TRIGGER_DISTANCE) {\n hideNotice(bannerContainer);\n }\n\n const listener = throttle(() => {\n const scrollTop = window.scrollY;\n\n if (scrollTop > COLLAPSE_TRIGGER_DISTANCE) {\n hideNotice(bannerContainer);\n } else if (bannerContainer.style.overflow) {\n showNotice(bannerContainer);\n }\n }, SCROLL_LISTENER_THROTTLE);\n\n document.addEventListener(\"scroll\", listener);\n\n return () => document.removeEventListener(\"scroll\", listener);\n};\n\nconst setupCloseBtn = (\n bannerContainer,\n cookieId,\n noticeId,\n collapseUnmountListeners,\n) => {\n const closeBtn = bannerContainer.querySelector(\"button\");\n\n if (!closeBtn) return () => {};\n\n const listener = () => {\n if (cookieId && noticeId) setupRememberClosed(cookieId, noticeId);\n\n hideNotice(bannerContainer);\n collapseUnmountListeners();\n };\n\n closeBtn.addEventListener(\"click\", listener);\n\n return () => document.removeEventListener(\"click\", listener);\n};\n\nconst resizeHandler = (bannerContainer) => {\n const handler = throttle(() => {\n hideOnMobile(bannerContainer);\n }, RESIZE_LISTENER_THROTTLE);\n\n window.addEventListener(\"resize\", handler);\n\n return () => window.removeEventListener(\"resize\", handler);\n};\n\nconst Notice = ({ bannerContainer, cookieId, noticeId, options }) => {\n if (typeof window === \"undefined\") return () => {};\n\n if (!bannerContainer) {\n console.warn(\n \"A Notice component was initited but no notice container was found.\",\n );\n return () => {};\n }\n\n if (hasBeenClosedBefore(cookieId, noticeId)) return () => {};\n\n hideOnMobile(bannerContainer);\n showNotice(bannerContainer);\n\n const opts = { collapse: true, ...options };\n\n const collapseUnmountListeners = opts.collapse\n ? setupNoticeCollapse(bannerContainer)\n : () => {};\n\n const closeBtnUnmountListeners = setupCloseBtn(\n bannerContainer,\n cookieId,\n noticeId,\n collapseUnmountListeners,\n );\n\n const resizeUnmountListener = resizeHandler(bannerContainer);\n\n return () => {\n [\n closeBtnUnmountListeners,\n collapseUnmountListeners,\n resizeUnmountListener,\n ].forEach((unmount) => unmount());\n };\n};\n\nexport default Notice;\n"],"names":["Cookie","throttle","queryId","FLASH_DATA_ID","COOKIE_EXPIRY","COLLAPSE_TRIGGER_DISTANCE","SCROLL_LISTENER_THROTTLE","RESIZE_LISTENER_THROTTLE","isMdViewport","window","matchMedia","matches","adjustFlashMargin","open","flash","style","marginTop","hideOnMobile","bannerContainer","display","hideNotice","maxHeight","overflow","showNotice","setupRememberClosed","cookieId","noticeId","cookie","get","set","replace","expires","hasBeenClosedBefore","includes","setupNoticeCollapse","scrollTop","scrollY","listener","document","addEventListener","removeEventListener","setupCloseBtn","collapseUnmountListeners","closeBtn","querySelector","resizeHandler","handler","Notice","options","console","warn","opts","collapse","closeBtnUnmountListeners","resizeUnmountListener","forEach","unmount"],"mappings":"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"}

package/core/Notice.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import React,{useEffect}from"react";import DOMPurify from"dompurify";import Icon from"./Icon";import cn from"./utils/cn.js";import NoticeScripts from"./Notice/component.js";import useRailsUjsLinks from"./hooks/use-rails-ujs-hooks";const defaultTextColor="text-neutral-1300";const contentWrapperClasses="w-full pr-8 ui-text-p4 self-center";const ContentWrapper=({buttonLink,textColor=defaultTextColor,children})=>buttonLink?React.createElement("a",{href:buttonLink,className:cn(contentWrapperClasses,textColor)},children):React.createElement("div",{className:cn(contentWrapperClasses,textColor)},children);const Notice=({buttonLink,buttonLabel,bodyText="",title,config,closeBtn,bgColor="bg-orange-100",textColor=defaultTextColor})=>{useEffect(()=>{NoticeScripts({bannerContainer:document.querySelector('[data-id="ui-notice"]'),cookieId:config?.cookieId,noticeId:config?.noticeId,options:{collapse:config?.options?.collapse||false}})},[]);const safeContent=DOMPurify.sanitize(bodyText,{ALLOWED_TAGS:["a"],ALLOWED_ATTR:["href","data-method","rel"]});const contentRef=useRailsUjsLinks();return React.createElement("div",{className:cn("ui-announcement",bgColor,textColor),"data-id":"ui-notice",style:{maxHeight:0,overflow:"hidden"}},React.createElement("div",{className:"ui-grid-px py-16 max-w-screen-xl mx-auto flex items-start"},React.createElement(ContentWrapper,{buttonLink:buttonLink??"#"},React.createElement("strong",{className:"font-bold whitespace-nowrap pr-4"},title),React.createElement("span",{ref:contentRef,className:"pr-4",dangerouslySetInnerHTML:{__html:safeContent}}),buttonLabel&&React.createElement("span",{className:"cursor-pointer whitespace-nowrap text-gui-blue-default-light"},buttonLabel)),closeBtn&&React.createElement("button",{type:"button",className:"ml-auto h-20 w-20 border-none bg-none self-baseline"},React.createElement(Icon,{name:"icon-gui-x-mark-outline",size:"1.25rem",color:textColor}))))};export default Notice;
+import React,{useEffect}from"react";import Icon from"./Icon";import cn from"./utils/cn.js";import NoticeScripts from"./Notice/component.js";const defaultTextColor="text-neutral-1300 dark:text-neutral-000";const contentWrapperClasses="w-full pr-8 ui-text-p4 self-center";const ContentWrapper=({buttonLink,textColor=defaultTextColor,children})=>buttonLink?React.createElement("a",{href:buttonLink,className:cn(contentWrapperClasses,textColor)},children):React.createElement("div",{className:cn(contentWrapperClasses,textColor)},children);const Notice=({buttonLink,buttonLabel,bodyText,title,config,closeBtn,bgColor="bg-orange-100 dark:bg-orange-1100",textColor=defaultTextColor})=>{useEffect(()=>{NoticeScripts({bannerContainer:document.querySelector('[data-id="ui-notice"]'),cookieId:config?.cookieId,noticeId:config?.noticeId,options:{collapse:config?.options?.collapse||false}})},[]);return React.createElement("div",{className:cn("ui-announcement",bgColor,textColor),"data-id":"ui-notice",style:{maxHeight:0,overflow:"hidden"}},React.createElement("div",{className:"ui-grid-px py-16 max-w-screen-xl mx-auto flex items-start"},React.createElement(ContentWrapper,{buttonLink:buttonLink??"#"},React.createElement("strong",{className:"font-bold whitespace-nowrap pr-4"},title),React.createElement("span",{className:"pr-4"},bodyText),buttonLabel&&React.createElement("span",{className:"cursor-pointer whitespace-nowrap text-gui-blue-default-light dark:text-gui-blue-default-dark"},buttonLabel)),closeBtn&&React.createElement("button",{type:"button",className:"ml-auto h-20 w-20 border-none bg-none self-baseline"},React.createElement(Icon,{name:"icon-gui-x-mark-outline",size:"1.25rem",color:textColor}))))};export default Notice;
 //# sourceMappingURL=Notice.js.map

package/core/Notice.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/core/Notice.tsx"],"sourcesContent":["import React, { ReactNode, useEffect } from \"react\";\~~nimport DOMPurify from \"dompurify\";\~~n\nimport { ColorClass, ColorThemeSet } from \"./styles/colors/types\";\nimport Icon from \"./Icon\";\nimport cn from \"./utils/cn.js\";\nimport NoticeScripts from \"./Notice/component.js\";\n\ntype ContentWrapperProps = {\n buttonLink: string;\n children: ReactNode;\n textColor?: ColorClass \| ColorThemeSet;\n};\~~nimport useRailsUjsLinks from \"./hooks/use-rails-ujs-hooks\";\~~n\n// TODO(jamiehenson):\n// This type is a bit messed up currently due to the NoticeScripts import being interpreted as NoticeProps.\n// Plan is to TS-ify the JS assets too, so this can be rectified then. The NoticeScripts-oriented props are\n// the ones after the line break.\nexport type NoticeProps = {\n buttonLink?: string;\n buttonLabel?: string;\n bodyText?: string;\n title?: string;\n closeBtn?: boolean;\n config?: {\n options: {\n collapse: boolean;\n };\n noticeId: string \| number;\n cookieId: string;\n };\n bgColor?: string;\n textColor?: ColorClass \| ColorThemeSet;\n\n bannerContainer?: Element \| null;\n cookieId?: string;\n noticeId?: string;\n options?: { collapse: boolean };\n};\n\nconst defaultTextColor = \"text-neutral-1300\";\n\nconst contentWrapperClasses = \"w-full pr-8 ui-text-p4 self-center\";\n\nconst ContentWrapper = ({\n buttonLink,\n textColor = defaultTextColor,\n children,\n}: ContentWrapperProps) =>\n buttonLink ? (\n <a href={buttonLink} className={cn(contentWrapperClasses, textColor)}>\n {children}\n </a>\n ) : (\n <div className={cn(contentWrapperClasses, textColor)}>{children}</div>\n );\n\nconst Notice = ({\n buttonLink,\n buttonLabel,\n bodyText ~~= \"\"~~,\n title,\n config,\n closeBtn,\n bgColor = \"bg-orange-100\",\n textColor = defaultTextColor,\n}: NoticeProps) => {\n useEffect(() => {\n NoticeScripts({\n bannerContainer: document.querySelector('[data-id=\"ui-notice\"]'),\n cookieId: config?.cookieId,\n noticeId: config?.noticeId,\n options: {\n collapse: config?.options?.collapse \|\| false,\n },\n });\n }, []);\n\n ~~const safeContent = DOMPurify.sanitize(bodyText, {\n ALLOWED_TAGS: [\"a\"],\n ALLOWED_ATTR: [\"href\", \"data-method\", \"rel\"],\n });\n\n const contentRef = useRailsUjsLinks();\n\n~~ return (\n <div\n className={cn(\"ui-announcement\", bgColor, textColor)}\n data-id=\"ui-notice\"\n style={{ maxHeight: 0, overflow: \"hidden\" }}\n >\n <div className=\"ui-grid-px py-16 max-w-screen-xl mx-auto flex items-start\">\n <ContentWrapper buttonLink={buttonLink ?? \"#\"}>\n <strong className=\"font-bold whitespace-nowrap pr-4\">{title}</strong>\n <span~~\n ref={contentRef}\n~~ className=\"pr-4\"~~\n dangerouslySetInnerHTML=~~{~~{\n __html: safeContent,\n~~ }~~}\n ></~~span>\n {buttonLabel && (\n <span className=\"cursor-pointer whitespace-nowrap text-gui-blue-default-light\">\n {buttonLabel}\n </span>\n )}\n </ContentWrapper>\n\n {closeBtn && (\n <button\n type=\"button\"\n className=\"ml-auto h-20 w-20 border-none bg-none self-baseline\"\n >\n <Icon\n name=\"icon-gui-x-mark-outline\"\n size=\"1.25rem\"\n color={textColor}\n />\n </button>\n )}\n </div>\n </div>\n );\n};\n\nexport default Notice;\n"],"names":["React","useEffect","~~DOMPurify","~~Icon","cn","NoticeScripts","~~useRailsUjsLinks","~~defaultTextColor","contentWrapperClasses","ContentWrapper","buttonLink","textColor","children","a","href","className","div","Notice","buttonLabel","bodyText","title","config","closeBtn","bgColor","bannerContainer","document","querySelector","cookieId","noticeId","options","collapse","~~safeContent","sanitize","ALLOWED_TAGS","ALLOWED_ATTR","contentRef","~~data-id","style","maxHeight","overflow","strong","span","~~ref","dangerouslySetInnerHTML","__html","~~button","type","name","size","color"],"mappings":"AAAA,OAAOA,OAAoBC,SAAS,KAAQ,OAAQ,~~AACpD~~,QAAOC,~~cAAe,WAAY,AAGlC,QAAOC,~~SAAU,QAAS,AAC1B,QAAOC,OAAQ,eAAgB,AAC/B,QAAOC,kBAAmB,uBAAwB,~~AAOlD~~,~~QAAOC,qBAAsB,6BAA8B,CA4B3D,~~MAAMC,iBAAmB,~~oBAEzB~~,MAAMC,sBAAwB,qCAE9B,MAAMC,eAAiB,CAAC,CACtBC,UAAU,CACVC,UAAYJ,gBAAgB,CAC5BK,QAAQ,CACY,GACpBF,WACE,oBAACG,KAAEC,KAAMJ,WAAYK,~~UAAWX~~,~~GAAGI~~,sBAAuBG,YACvDC,UAGH,oBAACI,OAAID,~~UAAWX~~,~~GAAGI~~,sBAAuBG,YAAaC,UAG3D,MAAMK,OAAS,CAAC,CACdP,UAAU,CACVQ,WAAW,CACXC,~~SAAW~~,~~EAAE~~,~~CACbC,~~KAAK,CACLC,MAAM,CACNC,QAAQ,CACRC,QAAU,~~eAAe~~,~~CACzBZ~~,UAAYJ,gBAAgB,CAChB,~~IACZN~~,UAAU,~~KACRI~~,cAAc,~~CACZmB~~,gBAAiBC,SAASC,aAAa,CAAC,yBACxCC,SAAUN,QAAQM,SAClBC,SAAUP,QAAQO,SAClBC,QAAS,CACPC,SAAUT,QAAQQ,SAASC,UAAY,KACzC,CACF,EACF,EAAG,EAAE,EAEL,~~MAAMC,YAAc7B,UAAU8B,QAAQ,CAACb,SAAU,CAC/Cc,aAAc,CAAC,IAAI,CACnBC,aAAc,CAAC,OAAQ,cAAe,MAAM,AAC9C,GAEA,MAAMC,WAAa7B,mBAEnB,~~OACE,~~oBAACU~~,OACCD,~~UAAWX~~,GAAG,~~kBAAmBmB~~,QAASZ,~~WAC1CyB~~,UAAQ,YACRC,MAAO,CAAEC,UAAW,EAAGC,SAAU,QAAS,GAE1C,~~oBAACvB~~,OAAID,UAAU,6DACb,oBAACN,gBAAeC,WAAYA,YAAc,KACxC,~~oBAAC8B~~,~~UAAOzB~~,UAAU,oCAAoCK,OACtD,~~oBAACqB~~,~~QACCC~~,~~IAAKP,WACLpB,~~UAAU,~~OACV4B~~,~~wBAAyB~~,~~CACvBC,OAAQb,WACV,IAEDb,~~aACC,~~oBAACuB~~,~~QAAK1B~~,UAAU,~~gEACbG~~,cAKNI,UACC,~~oBAACuB~~,UACCC,KAAK,~~SACL/B~~,UAAU,uDAEV,~~oBAACZ~~,~~MACC4C~~,KAAK,0BACLC,KAAK,UACLC,~~MAAOtC~~,cAOrB,CAEA,gBAAeM,MAAO"}
1	+ {"version":3,"sources":["../../src/core/Notice.tsx"],"sourcesContent":["import React, { ReactNode, useEffect } from \"react\";\n\nimport { ColorClass, ColorThemeSet } from \"./styles/colors/types\";\nimport Icon from \"./Icon\";\nimport cn from \"./utils/cn.js\";\nimport NoticeScripts from \"./Notice/component.js\";\n\ntype ContentWrapperProps = {\n buttonLink: string;\n children: ReactNode;\n textColor?: ColorClass \| ColorThemeSet;\n};\n\n// TODO(jamiehenson):\n// This type is a bit messed up currently due to the NoticeScripts import being interpreted as NoticeProps.\n// Plan is to TS-ify the JS assets too, so this can be rectified then. The NoticeScripts-oriented props are\n// the ones after the line break.\nexport type NoticeProps = {\n buttonLink?: string;\n buttonLabel?: string;\n bodyText?: string;\n title?: string;\n closeBtn?: boolean;\n config?: {\n options: {\n collapse: boolean;\n };\n noticeId: string \| number;\n cookieId: string;\n };\n bgColor?: string;\n textColor?: ColorClass \| ColorThemeSet;\n\n bannerContainer?: Element \| null;\n cookieId?: string;\n noticeId?: string;\n options?: { collapse: boolean };\n};\n\nconst defaultTextColor = \"text-neutral-1300 dark:text-neutral-000\";\n\nconst contentWrapperClasses = \"w-full pr-8 ui-text-p4 self-center\";\n\nconst ContentWrapper = ({\n buttonLink,\n textColor = defaultTextColor,\n children,\n}: ContentWrapperProps) =>\n buttonLink ? (\n <a href={buttonLink} className={cn(contentWrapperClasses, textColor)}>\n {children}\n </a>\n ) : (\n <div className={cn(contentWrapperClasses, textColor)}>{children}</div>\n );\n\nconst Notice = ({\n buttonLink,\n buttonLabel,\n bodyText,\n title,\n config,\n closeBtn,\n bgColor = \"bg-orange-100 dark:bg-orange-1100\",\n textColor = defaultTextColor,\n}: NoticeProps) => {\n useEffect(() => {\n NoticeScripts({\n bannerContainer: document.querySelector('[data-id=\"ui-notice\"]'),\n cookieId: config?.cookieId,\n noticeId: config?.noticeId,\n options: {\n collapse: config?.options?.collapse \|\| false,\n },\n });\n }, []);\n\n return (\n <div\n className={cn(\"ui-announcement\", bgColor, textColor)}\n data-id=\"ui-notice\"\n style={{ maxHeight: 0, overflow: \"hidden\" }}\n >\n <div className=\"ui-grid-px py-16 max-w-screen-xl mx-auto flex items-start\">\n <ContentWrapper buttonLink={buttonLink ?? \"#\"}>\n <strong className=\"font-bold whitespace-nowrap pr-4\">{title}</strong>\n <span className=\"pr-4\">{bodyText}</span>\n {buttonLabel && (\n <span className=\"cursor-pointer whitespace-nowrap text-gui-blue-default-light dark:text-gui-blue-default-dark\">\n {buttonLabel}\n </span>\n )}\n </ContentWrapper>\n\n {closeBtn && (\n <button\n type=\"button\"\n className=\"ml-auto h-20 w-20 border-none bg-none self-baseline\"\n >\n <Icon\n name=\"icon-gui-x-mark-outline\"\n size=\"1.25rem\"\n color={textColor}\n />\n </button>\n )}\n </div>\n </div>\n );\n};\n\nexport default Notice;\n"],"names":["React","useEffect","Icon","cn","NoticeScripts","defaultTextColor","contentWrapperClasses","ContentWrapper","buttonLink","textColor","children","a","href","className","div","Notice","buttonLabel","bodyText","title","config","closeBtn","bgColor","bannerContainer","document","querySelector","cookieId","noticeId","options","collapse","data-id","style","maxHeight","overflow","strong","span","button","type","name","size","color"],"mappings":"AAAA,OAAOA,OAAoBC,SAAS,KAAQ,OAAQ,AAGpD,QAAOC,SAAU,QAAS,AAC1B,QAAOC,OAAQ,eAAgB,AAC/B,QAAOC,kBAAmB,uBAAwB,CAkClD,MAAMC,iBAAmB,0CAEzB,MAAMC,sBAAwB,qCAE9B,MAAMC,eAAiB,CAAC,CACtBC,UAAU,CACVC,UAAYJ,gBAAgB,CAC5BK,QAAQ,CACY,GACpBF,WACE,oBAACG,KAAEC,KAAMJ,WAAYK,UAAWV,GAAGG,sBAAuBG,YACvDC,UAGH,oBAACI,OAAID,UAAWV,GAAGG,sBAAuBG,YAAaC,UAG3D,MAAMK,OAAS,CAAC,CACdP,UAAU,CACVQ,WAAW,CACXC,QAAQ,CACRC,KAAK,CACLC,MAAM,CACNC,QAAQ,CACRC,QAAU,mCAAmC,CAC7CZ,UAAYJ,gBAAgB,CAChB,IACZJ,UAAU,KACRG,cAAc,CACZkB,gBAAiBC,SAASC,aAAa,CAAC,yBACxCC,SAAUN,QAAQM,SAClBC,SAAUP,QAAQO,SAClBC,QAAS,CACPC,SAAUT,QAAQQ,SAASC,UAAY,KACzC,CACF,EACF,EAAG,EAAE,EAEL,OACE,oBAACd,OACCD,UAAWV,GAAG,kBAAmBkB,QAASZ,WAC1CoB,UAAQ,YACRC,MAAO,CAAEC,UAAW,EAAGC,SAAU,QAAS,GAE1C,oBAAClB,OAAID,UAAU,6DACb,oBAACN,gBAAeC,WAAYA,YAAc,KACxC,oBAACyB,UAAOpB,UAAU,oCAAoCK,OACtD,oBAACgB,QAAKrB,UAAU,QAAQI,UACvBD,aACC,oBAACkB,QAAKrB,UAAU,gGACbG,cAKNI,UACC,oBAACe,UACCC,KAAK,SACLvB,UAAU,uDAEV,oBAACX,MACCmC,KAAK,0BACLC,KAAK,UACLC,MAAO9B,cAOrB,CAEA,gBAAeM,MAAO"}

package/core/ProductTile/ProductDescription.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import React from"react";import cn from"../utils/cn";const ProductDescription=({description,selected,unavailable,showDescription=true})=>{if(!description||!showDescription){return null}return React.createElement("p",{className:cn("ui-text-p3 font-medium leading-snug",{"text-neutral-300 dark:text-neutral-1000":selected&&!unavailable},{"text-neutral-700 dark:text-neutral-600":!selected})},description)};export default ProductDescription;
+import React from"react";import cn from"../utils/cn";const ProductDescription=({description,selected,unavailable,showDescription=true})=>{if(!description||!showDescription){return null}return React.createElement("p",{className:cn("ui-text-p3 font-medium leading-snug",{"text-neutral-300 dark:text-neutral-1000":selected&&!unavailable},{"text-neutral-700 dark:text-neutral-600 group-hover/product-tile:text-neutral-1000 dark:group-hover/product-tile:text-neutral-300":!selected})},description)};export default ProductDescription;
 //# sourceMappingURL=ProductDescription.js.map

package/core/ProductTile/ProductDescription.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/core/ProductTile/ProductDescription.tsx"],"sourcesContent":["import React from \"react\";\nimport cn from \"../utils/cn\";\n\ntype ProductDescriptionProps = {\n description: string;\n selected?: boolean;\n unavailable: boolean;\n showDescription?: boolean;\n};\n\nconst ProductDescription = ({\n description,\n selected,\n unavailable,\n showDescription = true,\n}: ProductDescriptionProps) => {\n if (!description \|\| !showDescription) {\n return null;\n }\n\n return (\n <p\n className={cn(\n \"ui-text-p3 font-medium leading-snug\",\n {\n \"text-neutral-300 dark:text-neutral-1000\": selected && !unavailable,\n },\n { \"text-neutral-700 dark:text-neutral-600\": !selected },\n )}\n >\n {description}\n </p>\n );\n};\n\nexport default ProductDescription;\n"],"names":["React","cn","ProductDescription","description","selected","unavailable","showDescription","p","className"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,OAAQ,aAAc,CAS7B,MAAMC,mBAAqB,CAAC,CAC1BC,WAAW,CACXC,QAAQ,CACRC,WAAW,CACXC,gBAAkB,IAAI,CACE,IACxB,GAAI,CAACH,aAAe,CAACG,gBAAiB,CACpC,OAAO,IACT,CAEA,OACE,oBAACC,KACCC,UAAWP,GACT,sCACA,CACE,0CAA2CG,UAAY,CAACC,WAC1D,EACA,~~CAAE~~,~~yCAA0C~~,CAACD,~~QAAS~~,~~IAGvDD~~,YAGP,CAEA,gBAAeD,kBAAmB"}
1	+ {"version":3,"sources":["../../../src/core/ProductTile/ProductDescription.tsx"],"sourcesContent":["import React from \"react\";\nimport cn from \"../utils/cn\";\n\ntype ProductDescriptionProps = {\n description: string;\n selected?: boolean;\n unavailable: boolean;\n showDescription?: boolean;\n};\n\nconst ProductDescription = ({\n description,\n selected,\n unavailable,\n showDescription = true,\n}: ProductDescriptionProps) => {\n if (!description \|\| !showDescription) {\n return null;\n }\n\n return (\n <p\n className={cn(\n \"ui-text-p3 font-medium leading-snug\",\n {\n \"text-neutral-300 dark:text-neutral-1000\": selected && !unavailable,\n },\n {\n \"text-neutral-700 dark:text-neutral-600 group-hover/product-tile:text-neutral-1000 dark:group-hover/product-tile:text-neutral-300\":\n !selected,\n },\n )}\n >\n {description}\n </p>\n );\n};\n\nexport default ProductDescription;\n"],"names":["React","cn","ProductDescription","description","selected","unavailable","showDescription","p","className"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,OAAQ,aAAc,CAS7B,MAAMC,mBAAqB,CAAC,CAC1BC,WAAW,CACXC,QAAQ,CACRC,WAAW,CACXC,gBAAkB,IAAI,CACE,IACxB,GAAI,CAACH,aAAe,CAACG,gBAAiB,CACpC,OAAO,IACT,CAEA,OACE,oBAACC,KACCC,UAAWP,GACT,sCACA,CACE,0CAA2CG,UAAY,CAACC,WAC1D,EACA,CACE,mIACE,CAACD,QACL,IAGDD,YAGP,CAEA,gBAAeD,kBAAmB"}

package/core/ProductTile/ProductLabel.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import React from"react";import cn from"../utils/cn";const LABEL_FONT_SIZE_RATIO=4;const DESCRIPTION_FONT_SIZE_RATIO=2.6;const ProductLabel=({label,unavailable,selected,numericalSize,showLabel})=>{if(!label||!showLabel){return null}const dynamicFontSize=numericalSize/LABEL_FONT_SIZE_RATIO;return React.createElement("div",{className:"flex flex-col justify-center"},unavailable?React.createElement("div",null,React.createElement("div",{className:"table-cell font-sans bg-neutral-300 dark:bg-neutral-1000 rounded-full text-gui-unavailable tracking-widen-0.04 font-bold leading-snug",style:{fontSize:dynamicFontSize*.6,padding:`${dynamicFontSize*.25}px ${dynamicFontSize*.5}px`}},"COMING SOON")):React.createElement("p",{className:cn("font-bold uppercase ui-text-p2 leading-snug",{"text-neutral-500 dark:text-neutral-700":selected},{"text-neutral-700 dark:text-neutral-500":!selected}),style:{fontSize:dynamicFontSize,letterSpacing:"0.06em"}},"Ably"),React.createElement("p",{className:cn("ui-text-p2 font-bold",{"text-neutral-000 dark:text-neutral-1300":selected===true&&!unavailable},{"text-neutral-1000 dark:text-neutral-300":selected===false&&!unavailable},{"text-neutral-1300 dark:text-neutral-000":selected===undefined&&!unavailable},{"text-neutral-700 dark:text-neutral-600":unavailable},{"mt-[-3px]":!unavailable}),style:{fontSize:numericalSize/DESCRIPTION_FONT_SIZE_RATIO}},label))};export default ProductLabel;
+import React from"react";import cn from"../utils/cn";const LABEL_FONT_SIZE_RATIO=4;const DESCRIPTION_FONT_SIZE_RATIO=2.6;const ProductLabel=({label,unavailable,selected,numericalSize,showLabel})=>{if(!label||!showLabel){return null}const dynamicFontSize=numericalSize/LABEL_FONT_SIZE_RATIO;return React.createElement("div",{className:"flex flex-col justify-center"},unavailable?React.createElement("div",null,React.createElement("div",{className:"table-cell font-sans bg-neutral-300 dark:bg-neutral-1000 rounded-full text-gui-unavailable tracking-widen-0.04 font-bold leading-snug",style:{fontSize:dynamicFontSize*.6,padding:`${dynamicFontSize*.25}px ${dynamicFontSize*.5}px`}},"COMING SOON")):React.createElement("p",{className:cn("font-bold uppercase ui-text-p2 leading-snug",{"text-neutral-500 dark:text-neutral-700":selected},{"text-neutral-700 dark:text-neutral-500":!selected}),style:{fontSize:dynamicFontSize,letterSpacing:"0.06em"}},"Ably"),React.createElement("p",{className:cn("ui-text-p2 font-bold",{"text-neutral-000 dark:text-neutral-1300":selected===true&&!unavailable},{"text-neutral-1000 dark:text-neutral-300 group-hover/product-tile:text-neutral-1300 dark:group-hover/product-tile:text-neutral-000":selected===false&&!unavailable},{"text-neutral-1300 dark:text-neutral-000":selected===undefined&&!unavailable},{"text-neutral-700 dark:text-neutral-600":unavailable},{"mt-[-3px]":!unavailable}),style:{fontSize:numericalSize/DESCRIPTION_FONT_SIZE_RATIO}},label))};export default ProductLabel;
 //# sourceMappingURL=ProductLabel.js.map

package/core/ProductTile/ProductLabel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/core/ProductTile/ProductLabel.tsx"],"sourcesContent":["import React from \"react\";\nimport cn from \"../utils/cn\";\n\ntype ProductLabelProps = {\n label: string;\n unavailable: boolean;\n selected?: boolean;\n numericalSize: number;\n showLabel?: boolean;\n};\n\nconst LABEL_FONT_SIZE_RATIO = 4;\nconst DESCRIPTION_FONT_SIZE_RATIO = 2.6;\n\nconst ProductLabel = ({\n label,\n unavailable,\n selected,\n numericalSize,\n showLabel,\n}: ProductLabelProps) => {\n if (!label \|\| !showLabel) {\n return null;\n }\n\n const dynamicFontSize = numericalSize / LABEL_FONT_SIZE_RATIO;\n\n return (\n <div className=\"flex flex-col justify-center\">\n {unavailable ? (\n <div>\n <div\n className=\"table-cell font-sans bg-neutral-300 dark:bg-neutral-1000 rounded-full text-gui-unavailable tracking-widen-0.04 font-bold leading-snug\"\n style={{\n fontSize: dynamicFontSize * 0.6,\n padding: `${dynamicFontSize * 0.25}px ${dynamicFontSize * 0.5}px`,\n }}\n >\n COMING SOON\n </div>\n </div>\n ) : (\n <p\n className={cn(\n \"font-bold uppercase ui-text-p2 leading-snug\",\n { \"text-neutral-500 dark:text-neutral-700\": selected },\n { \"text-neutral-700 dark:text-neutral-500\": !selected },\n )}\n style={{\n fontSize: dynamicFontSize,\n letterSpacing: \"0.06em\",\n }}\n >\n Ably\n </p>\n )}\n <p\n className={cn(\n \"ui-text-p2 font-bold\",\n {\n \"text-neutral-000 dark:text-neutral-1300\":\n selected === true && !unavailable,\n },\n {\n \"text-neutral-1000 dark:text-neutral-300\":\n selected === false && !unavailable,\n },\n {\n \"text-neutral-1300 dark:text-neutral-000\":\n selected === undefined && !unavailable,\n },\n {\n \"text-neutral-700 dark:text-neutral-600\": unavailable,\n },\n { \"mt-[-3px]\": !unavailable },\n )}\n style={{ fontSize: numericalSize / DESCRIPTION_FONT_SIZE_RATIO }}\n >\n {label}\n </p>\n </div>\n );\n};\n\nexport default ProductLabel;\n"],"names":["React","cn","LABEL_FONT_SIZE_RATIO","DESCRIPTION_FONT_SIZE_RATIO","ProductLabel","label","unavailable","selected","numericalSize","showLabel","dynamicFontSize","div","className","style","fontSize","padding","p","letterSpacing","undefined"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,OAAQ,aAAc,CAU7B,MAAMC,sBAAwB,EAC9B,MAAMC,4BAA8B,IAEpC,MAAMC,aAAe,CAAC,CACpBC,KAAK,CACLC,WAAW,CACXC,QAAQ,CACRC,aAAa,CACbC,SAAS,CACS,IAClB,GAAI,CAACJ,OAAS,CAACI,UAAW,CACxB,OAAO,IACT,CAEA,MAAMC,gBAAkBF,cAAgBN,sBAExC,OACE,oBAACS,OAAIC,UAAU,gCACZN,YACC,oBAACK,WACC,oBAACA,OACCC,UAAU,wIACVC,MAAO,CACLC,SAAUJ,gBAAkB,GAC5BK,QAAS,CAAC,EAAEL,gBAAkB,IAAK,GAAG,EAAEA,gBAAkB,GAAI,EAAE,CAAC,AACnE,GACD,gBAKH,oBAACM,KACCJ,UAAWX,GACT,8CACA,CAAE,yCAA0CM,QAAS,EACrD,CAAE,yCAA0C,CAACA,QAAS,GAExDM,MAAO,CACLC,SAAUJ,gBACVO,cAAe,QACjB,GACD,QAIH,oBAACD,KACCJ,UAAWX,GACT,uBACA,CACE,0CACEM,WAAa,MAAQ,CAACD,WAC1B,EACA,CACE,~~0CACEC~~,WAAa,OAAS,CAACD,WAC3B,EACA,CACE,0CACEC,WAAaW,WAAa,CAACZ,WAC/B,EACA,CACE,yCAA0CA,WAC5C,EACA,CAAE,YAAa,CAACA,WAAY,GAE9BO,MAAO,CAAEC,SAAUN,cAAgBL,2BAA4B,GAE9DE,OAIT,CAEA,gBAAeD,YAAa"}
1	+ {"version":3,"sources":["../../../src/core/ProductTile/ProductLabel.tsx"],"sourcesContent":["import React from \"react\";\nimport cn from \"../utils/cn\";\n\ntype ProductLabelProps = {\n label: string;\n unavailable: boolean;\n selected?: boolean;\n numericalSize: number;\n showLabel?: boolean;\n};\n\nconst LABEL_FONT_SIZE_RATIO = 4;\nconst DESCRIPTION_FONT_SIZE_RATIO = 2.6;\n\nconst ProductLabel = ({\n label,\n unavailable,\n selected,\n numericalSize,\n showLabel,\n}: ProductLabelProps) => {\n if (!label \|\| !showLabel) {\n return null;\n }\n\n const dynamicFontSize = numericalSize / LABEL_FONT_SIZE_RATIO;\n\n return (\n <div className=\"flex flex-col justify-center\">\n {unavailable ? (\n <div>\n <div\n className=\"table-cell font-sans bg-neutral-300 dark:bg-neutral-1000 rounded-full text-gui-unavailable tracking-widen-0.04 font-bold leading-snug\"\n style={{\n fontSize: dynamicFontSize * 0.6,\n padding: `${dynamicFontSize * 0.25}px ${dynamicFontSize * 0.5}px`,\n }}\n >\n COMING SOON\n </div>\n </div>\n ) : (\n <p\n className={cn(\n \"font-bold uppercase ui-text-p2 leading-snug\",\n { \"text-neutral-500 dark:text-neutral-700\": selected },\n { \"text-neutral-700 dark:text-neutral-500\": !selected },\n )}\n style={{\n fontSize: dynamicFontSize,\n letterSpacing: \"0.06em\",\n }}\n >\n Ably\n </p>\n )}\n <p\n className={cn(\n \"ui-text-p2 font-bold\",\n {\n \"text-neutral-000 dark:text-neutral-1300\":\n selected === true && !unavailable,\n },\n {\n \"text-neutral-1000 dark:text-neutral-300 group-hover/product-tile:text-neutral-1300 dark:group-hover/product-tile:text-neutral-000\":\n selected === false && !unavailable,\n },\n {\n \"text-neutral-1300 dark:text-neutral-000\":\n selected === undefined && !unavailable,\n },\n {\n \"text-neutral-700 dark:text-neutral-600\": unavailable,\n },\n { \"mt-[-3px]\": !unavailable },\n )}\n style={{ fontSize: numericalSize / DESCRIPTION_FONT_SIZE_RATIO }}\n >\n {label}\n </p>\n </div>\n );\n};\n\nexport default ProductLabel;\n"],"names":["React","cn","LABEL_FONT_SIZE_RATIO","DESCRIPTION_FONT_SIZE_RATIO","ProductLabel","label","unavailable","selected","numericalSize","showLabel","dynamicFontSize","div","className","style","fontSize","padding","p","letterSpacing","undefined"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,OAAQ,aAAc,CAU7B,MAAMC,sBAAwB,EAC9B,MAAMC,4BAA8B,IAEpC,MAAMC,aAAe,CAAC,CACpBC,KAAK,CACLC,WAAW,CACXC,QAAQ,CACRC,aAAa,CACbC,SAAS,CACS,IAClB,GAAI,CAACJ,OAAS,CAACI,UAAW,CACxB,OAAO,IACT,CAEA,MAAMC,gBAAkBF,cAAgBN,sBAExC,OACE,oBAACS,OAAIC,UAAU,gCACZN,YACC,oBAACK,WACC,oBAACA,OACCC,UAAU,wIACVC,MAAO,CACLC,SAAUJ,gBAAkB,GAC5BK,QAAS,CAAC,EAAEL,gBAAkB,IAAK,GAAG,EAAEA,gBAAkB,GAAI,EAAE,CAAC,AACnE,GACD,gBAKH,oBAACM,KACCJ,UAAWX,GACT,8CACA,CAAE,yCAA0CM,QAAS,EACrD,CAAE,yCAA0C,CAACA,QAAS,GAExDM,MAAO,CACLC,SAAUJ,gBACVO,cAAe,QACjB,GACD,QAIH,oBAACD,KACCJ,UAAWX,GACT,uBACA,CACE,0CACEM,WAAa,MAAQ,CAACD,WAC1B,EACA,CACE,oIACEC,WAAa,OAAS,CAACD,WAC3B,EACA,CACE,0CACEC,WAAaW,WAAa,CAACZ,WAC/B,EACA,CACE,yCAA0CA,WAC5C,EACA,CAAE,YAAa,CAACA,WAAY,GAE9BO,MAAO,CAAEC,SAAUN,cAAgBL,2BAA4B,GAE9DE,OAIT,CAEA,gBAAeD,YAAa"}