@ably/ui 15.8.1 → 16.0.0-dev.0366f2cc
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/core/.DS_Store +0 -0
- package/core/FeaturedLink.js +1 -1
- package/core/FeaturedLink.js.map +1 -1
- package/core/Flyout.js +1 -1
- package/core/Flyout.js.map +1 -1
- package/core/Footer/data.js +2 -0
- package/core/Footer/data.js.map +1 -0
- package/core/Footer.js +1 -1
- package/core/Footer.js.map +1 -1
- package/core/Header/HeaderLinks.js +1 -1
- package/core/Header/HeaderLinks.js.map +1 -1
- package/core/Header.js +1 -1
- package/core/Header.js.map +1 -1
- package/core/LegacyFooter/LegacyFooter.js +2 -0
- package/core/LegacyFooter/LegacyFooter.js.map +1 -0
- package/core/LegacyMeganav/LegacyMeganav.js +2 -0
- package/core/LegacyMeganav/LegacyMeganav.js.map +1 -0
- package/core/LegacyMeganav/MeganavBlogPostsList/component.js +2 -0
- package/core/LegacyMeganav/MeganavBlogPostsList/component.js.map +1 -0
- package/core/LegacyMeganav/MeganavBlogPostsList.js +2 -0
- package/core/LegacyMeganav/MeganavBlogPostsList.js.map +1 -0
- package/core/LegacyMeganav/MeganavContentCompany.js +2 -0
- package/core/LegacyMeganav/MeganavContentCompany.js.map +1 -0
- package/core/LegacyMeganav/MeganavContentDevelopers.js +2 -0
- package/core/LegacyMeganav/MeganavContentDevelopers.js.map +1 -0
- package/core/LegacyMeganav/MeganavContentProducts.js +2 -0
- package/core/LegacyMeganav/MeganavContentProducts.js.map +1 -0
- package/core/LegacyMeganav/MeganavContentUseCases.js +2 -0
- package/core/LegacyMeganav/MeganavContentUseCases.js.map +1 -0
- package/core/LegacyMeganav/MeganavControl/component.js +2 -0
- package/core/LegacyMeganav/MeganavControl/component.js.map +1 -0
- package/core/LegacyMeganav/MeganavControl.js +2 -0
- package/core/LegacyMeganav/MeganavControl.js.map +1 -0
- package/core/LegacyMeganav/MeganavControlMobileDropdown/component.js +2 -0
- package/core/LegacyMeganav/MeganavControlMobileDropdown/component.js.map +1 -0
- package/core/LegacyMeganav/MeganavControlMobileDropdown.js +2 -0
- package/core/LegacyMeganav/MeganavControlMobileDropdown.js.map +1 -0
- package/core/LegacyMeganav/MeganavControlMobilePanelClose/component.js +2 -0
- package/core/LegacyMeganav/MeganavControlMobilePanelClose/component.js.map +1 -0
- package/core/LegacyMeganav/MeganavControlMobilePanelClose.js +2 -0
- package/core/LegacyMeganav/MeganavControlMobilePanelClose.js.map +1 -0
- package/core/LegacyMeganav/MeganavControlMobilePanelOpen/component.js +2 -0
- package/core/LegacyMeganav/MeganavControlMobilePanelOpen/component.js.map +1 -0
- package/core/LegacyMeganav/MeganavControlMobilePanelOpen.js +2 -0
- package/core/LegacyMeganav/MeganavControlMobilePanelOpen.js.map +1 -0
- package/core/LegacyMeganav/MeganavItemsDesktop.js +2 -0
- package/core/LegacyMeganav/MeganavItemsDesktop.js.map +1 -0
- package/core/LegacyMeganav/MeganavItemsMobile.js +2 -0
- package/core/LegacyMeganav/MeganavItemsMobile.js.map +1 -0
- package/core/LegacyMeganav/MeganavItemsSignedIn.js.map +1 -0
- package/core/LegacyMeganav/MeganavSearch.js +2 -0
- package/core/LegacyMeganav/MeganavSearch.js.map +1 -0
- package/core/LegacyMeganav/MeganavSearchAutocomplete/component.js +2 -0
- package/core/LegacyMeganav/MeganavSearchAutocomplete/component.js.map +1 -0
- package/core/LegacyMeganav/MeganavSearchAutocomplete.js.map +1 -0
- package/core/LegacyMeganav/MeganavSearchPanel.js +2 -0
- package/core/LegacyMeganav/MeganavSearchPanel.js.map +1 -0
- package/core/LegacyMeganav/MeganavSearchSuggestions/component.js +2 -0
- package/core/LegacyMeganav/MeganavSearchSuggestions/component.js.map +1 -0
- package/core/LegacyMeganav/MeganavSearchSuggestions.js +2 -0
- package/core/LegacyMeganav/MeganavSearchSuggestions.js.map +1 -0
- package/core/LegacyMeganav/SignOutLink.js.map +1 -0
- package/core/LegacyMeganav/component.js +2 -0
- package/core/{Meganav → LegacyMeganav}/component.js.map +1 -1
- package/core/Meganav/.DS_Store +0 -0
- package/core/Meganav/MeganavMobile.js +2 -0
- package/core/Meganav/MeganavMobile.js.map +1 -0
- package/core/Meganav/MeganavPanel.js +2 -0
- package/core/Meganav/MeganavPanel.js.map +1 -0
- package/core/Meganav/data.js +2 -0
- package/core/Meganav/data.js.map +1 -0
- package/core/Meganav/images/fan-engagement-nav-image.png +0 -0
- package/core/Meganav/images/founders-nav-image.png +0 -0
- package/core/Meganav.js +1 -1
- package/core/Meganav.js.map +1 -1
- package/core/Notice/component.js +1 -1
- package/core/Notice/component.js.map +1 -1
- package/core/Notice.js +1 -1
- package/core/Notice.js.map +1 -1
- package/core/ProductTile/ProductDescription.js +1 -1
- package/core/ProductTile/ProductDescription.js.map +1 -1
- package/core/ProductTile/ProductLabel.js +1 -1
- package/core/ProductTile/ProductLabel.js.map +1 -1
- package/core/ProductTile/data.js +1 -1
- package/core/ProductTile/data.js.map +1 -1
- package/index.d.ts +314 -131
- package/package.json +1 -1
- package/core/Meganav/component.js +0 -2
- package/core/MeganavBlogPostsList/component.js +0 -2
- package/core/MeganavBlogPostsList/component.js.map +0 -1
- package/core/MeganavBlogPostsList.js +0 -2
- package/core/MeganavBlogPostsList.js.map +0 -1
- package/core/MeganavContentCompany.js +0 -2
- package/core/MeganavContentCompany.js.map +0 -1
- package/core/MeganavContentDevelopers.js +0 -2
- package/core/MeganavContentDevelopers.js.map +0 -1
- package/core/MeganavContentProducts.js +0 -2
- package/core/MeganavContentProducts.js.map +0 -1
- package/core/MeganavContentUseCases.js +0 -2
- package/core/MeganavContentUseCases.js.map +0 -1
- package/core/MeganavControl/component.js +0 -2
- package/core/MeganavControl/component.js.map +0 -1
- package/core/MeganavControl.js +0 -2
- package/core/MeganavControl.js.map +0 -1
- package/core/MeganavControlMobileDropdown/component.js +0 -2
- package/core/MeganavControlMobileDropdown/component.js.map +0 -1
- package/core/MeganavControlMobileDropdown.js +0 -2
- package/core/MeganavControlMobileDropdown.js.map +0 -1
- package/core/MeganavControlMobilePanelClose/component.js +0 -2
- package/core/MeganavControlMobilePanelClose/component.js.map +0 -1
- package/core/MeganavControlMobilePanelClose.js +0 -2
- package/core/MeganavControlMobilePanelClose.js.map +0 -1
- package/core/MeganavControlMobilePanelOpen/component.js +0 -2
- package/core/MeganavControlMobilePanelOpen/component.js.map +0 -1
- package/core/MeganavControlMobilePanelOpen.js +0 -2
- package/core/MeganavControlMobilePanelOpen.js.map +0 -1
- package/core/MeganavItemsDesktop.js +0 -2
- package/core/MeganavItemsDesktop.js.map +0 -1
- package/core/MeganavItemsMobile.js +0 -2
- package/core/MeganavItemsMobile.js.map +0 -1
- package/core/MeganavItemsSignedIn.js.map +0 -1
- package/core/MeganavSearch.js +0 -2
- package/core/MeganavSearch.js.map +0 -1
- package/core/MeganavSearchAutocomplete/component.js +0 -2
- package/core/MeganavSearchAutocomplete/component.js.map +0 -1
- package/core/MeganavSearchAutocomplete.js.map +0 -1
- package/core/MeganavSearchPanel.js +0 -2
- package/core/MeganavSearchPanel.js.map +0 -1
- package/core/MeganavSearchSuggestions/component.js +0 -2
- package/core/MeganavSearchSuggestions/component.js.map +0 -1
- package/core/MeganavSearchSuggestions.js +0 -2
- package/core/MeganavSearchSuggestions.js.map +0 -1
- package/core/SignOutLink.js.map +0 -1
- /package/core/{Footer → LegacyFooter}/component.css +0 -0
- /package/core/{MeganavItemsSignedIn.js → LegacyMeganav/MeganavItemsSignedIn.js} +0 -0
- /package/core/{MeganavSearchAutocomplete.js → LegacyMeganav/MeganavSearchAutocomplete.js} +0 -0
- /package/core/{SignOutLink.js → LegacyMeganav/SignOutLink.js} +0 -0
- /package/core/{Meganav → LegacyMeganav}/component.css +0 -0
- /package/core/{Meganav → LegacyMeganav}/component.json +0 -0
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{queryId}from"../../dom-query";const DRAG_BUFFER=5;const getTranslateX=node=>new DOMMatrix(window.getComputedStyle(node).transform).e;const updateTranslateX=(node,value)=>node.style.transform=`translateX(${value}px)`;const dragLeftBoundary=(translateX,threshold)=>translateX>=threshold;const dragRightBoundary=(translateX,itemsWidth,windowWidth,threshold)=>Math.abs(translateX-windowWidth+threshold)>itemsWidth;const getDistance=(e,touchStartX)=>e.changedTouches[0]?.clientX-touchStartX;const withinBuffer=distance=>Math.abs(distance)<DRAG_BUFFER;const getItemsTotalWidth=nodes=>nodes.map(item=>item.getBoundingClientRect().width).reduce((acc,val)=>acc+val,0);const MeganavSearchSuggestions=()=>{const suggestionsToggle=queryId("meganav-mobile-search-input");const suggestions=queryId("meganav-mobile-search-suggestions");const list=suggestions.querySelector("ul");const listItems=Array.from(list.querySelectorAll("li"));const dragLeft=(distance,threshold)=>{const currentTranslateX=getTranslateX(list);const translateX=Math.round(currentTranslateX+distance);if(dragLeftBoundary(translateX,threshold))return;updateTranslateX(list,translateX)};const dragLeftEnd=(distance,threshold)=>{const currentTranslateX=getTranslateX(list);let translateX=Math.round(currentTranslateX+distance);if(dragLeftBoundary(translateX,threshold)){translateX=0}updateTranslateX(list,translateX)};const dragRight=(distance,threshold)=>{const listWidth=list.getBoundingClientRect().width;const currentTranslateX=getTranslateX(list);const translateX=Math.round(currentTranslateX+distance);const itemsTotalWidth=getItemsTotalWidth(listItems);if(dragRightBoundary(translateX,itemsTotalWidth,listWidth,threshold)){return}updateTranslateX(list,translateX)};const dragRightEnd=(distance,threshold)=>{const listWidth=list.getBoundingClientRect().width;const currentTranslateX=getTranslateX(list);const itemsTotalWidth=getItemsTotalWidth(listItems);let translateX=Math.round(currentTranslateX+distance);if(dragRightBoundary(translateX,itemsTotalWidth,listWidth,threshold)){translateX=-(itemsTotalWidth-listWidth+threshold)}updateTranslateX(list,translateX)};let touchStartX;const touchstartHandler=e=>{touchStartX=e.touches[0]?.clientX};const touchmoveHandler=e=>{const distance=getDistance(e,touchStartX);if(withinBuffer(distance))return;distance>0?dragLeft(distance,24):dragRight(distance,96)};const touchendHandler=e=>{const distance=getDistance(e,touchStartX);if(withinBuffer(distance))return;distance>0?dragLeftEnd(distance,24):dragRightEnd(distance,48)};const focusSuggestionsHandler=()=>{suggestions.classList.add("max-h-96")};const blurSuggestionsHandler=e=>{if(e.relatedTarget===suggestions.querySelectorAll("a")[0]){return}suggestions.classList.remove("max-h-96")};const wheelHandler=e=>{const distance=e.deltaY*4;if(withinBuffer(distance))return;distance>0?dragLeftEnd(distance,24):dragRightEnd(distance,48)};suggestionsToggle?.addEventListener("focus",focusSuggestionsHandler);suggestionsToggle?.addEventListener("blur",blurSuggestionsHandler);suggestions.addEventListener("touchstart",touchstartHandler);suggestions.addEventListener("touchmove",touchmoveHandler);suggestions.addEventListener("touchend",touchendHandler);suggestions.addEventListener("wheel",wheelHandler);return{teardown:()=>{suggestionsToggle?.removeEventListener("focus",focusSuggestionsHandler);suggestionsToggle?.removeEventListener("blur",blurSuggestionsHandler);suggestions.removeEventListener("touchstart",touchstartHandler);suggestions.removeEventListener("touchmove",touchmoveHandler);suggestions.removeEventListener("touchend",touchendHandler)},clear:()=>{suggestions.classList.remove("max-h-96");list.style.transform=`translateX(0px)`}}};export default MeganavSearchSuggestions;
|
|
2
|
+
//# sourceMappingURL=component.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/core/LegacyMeganav/MeganavSearchSuggestions/component.js"],"sourcesContent":["import { queryId } from \"../../dom-query\";\n\nconst DRAG_BUFFER = 5;\n\nconst getTranslateX = (node) =>\n new DOMMatrix(window.getComputedStyle(node).transform).e;\n\nconst updateTranslateX = (node, value) =>\n (node.style.transform = `translateX(${value}px)`);\n\nconst dragLeftBoundary = (translateX, threshold) => translateX >= threshold;\n\nconst dragRightBoundary = (translateX, itemsWidth, windowWidth, threshold) =>\n Math.abs(translateX - windowWidth + threshold) > itemsWidth;\n\nconst getDistance = (e, touchStartX) =>\n e.changedTouches[0]?.clientX - touchStartX;\n\nconst withinBuffer = (distance) => Math.abs(distance) < DRAG_BUFFER;\n\nconst getItemsTotalWidth = (nodes) =>\n nodes\n .map((item) => item.getBoundingClientRect().width)\n .reduce((acc, val) => acc + val, 0);\n\nconst MeganavSearchSuggestions = () => {\n const suggestionsToggle = queryId(\"meganav-mobile-search-input\");\n const suggestions = queryId(\"meganav-mobile-search-suggestions\");\n const list = suggestions.querySelector(\"ul\");\n const listItems = Array.from(list.querySelectorAll(\"li\"));\n\n const dragLeft = (distance, threshold) => {\n const currentTranslateX = getTranslateX(list);\n const translateX = Math.round(currentTranslateX + distance);\n if (dragLeftBoundary(translateX, threshold)) return;\n updateTranslateX(list, translateX);\n };\n\n const dragLeftEnd = (distance, threshold) => {\n const currentTranslateX = getTranslateX(list);\n let translateX = Math.round(currentTranslateX + distance);\n\n if (dragLeftBoundary(translateX, threshold)) {\n translateX = 0;\n }\n\n updateTranslateX(list, translateX);\n };\n\n const dragRight = (distance, threshold) => {\n const listWidth = list.getBoundingClientRect().width;\n const currentTranslateX = getTranslateX(list);\n const translateX = Math.round(currentTranslateX + distance);\n const itemsTotalWidth = getItemsTotalWidth(listItems);\n\n if (dragRightBoundary(translateX, itemsTotalWidth, listWidth, threshold)) {\n return;\n }\n\n updateTranslateX(list, translateX);\n };\n\n const dragRightEnd = (distance, threshold) => {\n const listWidth = list.getBoundingClientRect().width;\n const currentTranslateX = getTranslateX(list);\n const itemsTotalWidth = getItemsTotalWidth(listItems);\n let translateX = Math.round(currentTranslateX + distance);\n\n if (dragRightBoundary(translateX, itemsTotalWidth, listWidth, threshold)) {\n translateX = -(itemsTotalWidth - listWidth + threshold);\n }\n\n updateTranslateX(list, translateX);\n };\n\n let touchStartX;\n\n const touchstartHandler = (e) => {\n touchStartX = e.touches[0]?.clientX;\n };\n\n const touchmoveHandler = (e) => {\n const distance = getDistance(e, touchStartX);\n if (withinBuffer(distance)) return;\n distance > 0 ? dragLeft(distance, 24) : dragRight(distance, 96);\n };\n\n const touchendHandler = (e) => {\n const distance = getDistance(e, touchStartX);\n if (withinBuffer(distance)) return;\n distance > 0 ? dragLeftEnd(distance, 24) : dragRightEnd(distance, 48);\n };\n\n const focusSuggestionsHandler = () => {\n suggestions.classList.add(\"max-h-96\");\n };\n\n const blurSuggestionsHandler = (e) => {\n if (e.relatedTarget === suggestions.querySelectorAll(\"a\")[0]) {\n return;\n }\n suggestions.classList.remove(\"max-h-96\");\n };\n\n const wheelHandler = (e) => {\n const distance = e.deltaY * 4;\n if (withinBuffer(distance)) return;\n distance > 0 ? dragLeftEnd(distance, 24) : dragRightEnd(distance, 48);\n };\n\n suggestionsToggle?.addEventListener(\"focus\", focusSuggestionsHandler);\n suggestionsToggle?.addEventListener(\"blur\", blurSuggestionsHandler);\n suggestions.addEventListener(\"touchstart\", touchstartHandler);\n suggestions.addEventListener(\"touchmove\", touchmoveHandler);\n suggestions.addEventListener(\"touchend\", touchendHandler);\n suggestions.addEventListener(\"wheel\", wheelHandler);\n\n return {\n teardown: () => {\n suggestionsToggle?.removeEventListener(\"focus\", focusSuggestionsHandler);\n suggestionsToggle?.removeEventListener(\"blur\", blurSuggestionsHandler);\n suggestions.removeEventListener(\"touchstart\", touchstartHandler);\n suggestions.removeEventListener(\"touchmove\", touchmoveHandler);\n suggestions.removeEventListener(\"touchend\", touchendHandler);\n },\n clear: () => {\n suggestions.classList.remove(\"max-h-96\");\n list.style.transform = `translateX(0px)`;\n },\n };\n};\n\nexport default MeganavSearchSuggestions;\n"],"names":["queryId","DRAG_BUFFER","getTranslateX","node","DOMMatrix","window","getComputedStyle","transform","e","updateTranslateX","value","style","dragLeftBoundary","translateX","threshold","dragRightBoundary","itemsWidth","windowWidth","Math","abs","getDistance","touchStartX","changedTouches","clientX","withinBuffer","distance","getItemsTotalWidth","nodes","map","item","getBoundingClientRect","width","reduce","acc","val","MeganavSearchSuggestions","suggestionsToggle","suggestions","list","querySelector","listItems","Array","from","querySelectorAll","dragLeft","currentTranslateX","round","dragLeftEnd","dragRight","listWidth","itemsTotalWidth","dragRightEnd","touchstartHandler","touches","touchmoveHandler","touchendHandler","focusSuggestionsHandler","classList","add","blurSuggestionsHandler","relatedTarget","remove","wheelHandler","deltaY","addEventListener","teardown","removeEventListener","clear"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import React from"react";import FeaturedLink from"../FeaturedLink";const MeganavSearchSuggestions=({absUrl,displaySupportLink})=>React.createElement(React.Fragment,null,React.createElement("p",{className:"ui-text-overline2 text-cool-black py-12"},"Popular pages"),React.createElement("div",{className:"flex justify-between items-center overflow-hidden"},React.createElement("ul",{className:"flex transition-transform"},React.createElement("li",{className:"py-12 pr-8 flex-shrink-0"},React.createElement("a",{href:absUrl("/docs/how-ably-works"),className:"ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"},"How does Ably work?")),React.createElement("li",{className:"py-12 px-8 flex-shrink-0"},React.createElement("a",{href:absUrl("/docs/quick-start-guide"),className:"ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"},"Quickstart guide")),React.createElement("li",{className:"py-12 px-8 flex-shrink-0"},React.createElement("a",{href:absUrl("/docs/core-features/pubsub"),className:"ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"},"Publish/Subscribe Messaging")),React.createElement("li",{className:"py-12 pl-8 flex-shrink-0"},React.createElement("a",{href:absUrl("/platform"),className:"ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"},"Platform"))),displaySupportLink?React.createElement(FeaturedLink,{url:absUrl("/support"),textSize:"text-p2"},"Support"):null));export default MeganavSearchSuggestions;
|
|
2
|
+
//# sourceMappingURL=MeganavSearchSuggestions.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/core/LegacyMeganav/MeganavSearchSuggestions.tsx"],"sourcesContent":["import React from \"react\";\nimport { AbsUrl } from \"./LegacyMeganav\";\nimport FeaturedLink from \"../FeaturedLink\";\n\ntype MeganavSearchSuggestionsProps = {\n absUrl: AbsUrl;\n displaySupportLink: boolean;\n};\n\nconst MeganavSearchSuggestions = ({\n absUrl,\n displaySupportLink,\n}: MeganavSearchSuggestionsProps) => (\n <>\n <p className=\"ui-text-overline2 text-cool-black py-12\">Popular pages</p>\n\n <div className=\"flex justify-between items-center overflow-hidden\">\n <ul className=\"flex transition-transform\">\n <li className=\"py-12 pr-8 flex-shrink-0\">\n <a\n href={absUrl(\"/docs/how-ably-works\")}\n className=\"ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus\"\n >\n How does Ably work?\n </a>\n </li>\n <li className=\"py-12 px-8 flex-shrink-0\">\n <a\n href={absUrl(\"/docs/quick-start-guide\")}\n className=\"ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus\"\n >\n Quickstart guide\n </a>\n </li>\n <li className=\"py-12 px-8 flex-shrink-0\">\n <a\n href={absUrl(\"/docs/core-features/pubsub\")}\n className=\"ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus\"\n >\n Publish/Subscribe Messaging\n </a>\n </li>\n <li className=\"py-12 pl-8 flex-shrink-0\">\n <a\n href={absUrl(\"/platform\")}\n className=\"ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus\"\n >\n Platform\n </a>\n </li>\n </ul>\n {displaySupportLink ? (\n <FeaturedLink url={absUrl(\"/support\")} textSize=\"text-p2\">\n Support\n </FeaturedLink>\n ) : null}\n </div>\n </>\n);\n\nexport default MeganavSearchSuggestions;\n"],"names":["React","FeaturedLink","MeganavSearchSuggestions","absUrl","displaySupportLink","p","className","div","ul","li","a","href","url","textSize"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAE1B,QAAOC,iBAAkB,iBAAkB,CAO3C,MAAMC,yBAA2B,CAAC,CAChCC,MAAM,CACNC,kBAAkB,CACY,GAC9B,wCACE,oBAACC,KAAEC,UAAU,2CAA0C,iBAEvD,oBAACC,OAAID,UAAU,qDACb,oBAACE,MAAGF,UAAU,6BACZ,oBAACG,MAAGH,UAAU,4BACZ,oBAACI,KACCC,KAAMR,OAAO,wBACbG,UAAU,+EACX,wBAIH,oBAACG,MAAGH,UAAU,4BACZ,oBAACI,KACCC,KAAMR,OAAO,2BACbG,UAAU,+EACX,qBAIH,oBAACG,MAAGH,UAAU,4BACZ,oBAACI,KACCC,KAAMR,OAAO,8BACbG,UAAU,+EACX,gCAIH,oBAACG,MAAGH,UAAU,4BACZ,oBAACI,KACCC,KAAMR,OAAO,aACbG,UAAU,+EACX,cAKJF,mBACC,oBAACH,cAAaW,IAAKT,OAAO,YAAaU,SAAS,WAAU,WAGxD,MAKV,gBAAeX,wBAAyB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/core/LegacyMeganav/SignOutLink.tsx"],"sourcesContent":["import React, { MouseEvent, MouseEventHandler, ReactNode, useRef } from \"react\";\nimport { AbsUrl } from \"./LegacyMeganav\";\n\ntype SignOutLinkProps = {\n token: string;\n href: string;\n text: string;\n children: ({\n href,\n text,\n onClick,\n }: {\n href: string;\n text: string;\n onClick: MouseEventHandler<HTMLAnchorElement>;\n }) => ReactNode;\n absUrl: AbsUrl;\n};\n\nconst SignOutLink = ({\n token,\n href,\n text,\n children,\n absUrl,\n}: SignOutLinkProps) => {\n const formRef = useRef<HTMLFormElement>(null);\n\n const onClick = (e: MouseEvent) => {\n formRef.current?.submit();\n e.preventDefault();\n };\n\n return (\n <>\n <form\n ref={formRef}\n method=\"post\"\n action={absUrl(href)}\n className=\"hidden\"\n >\n <input name=\"_method\" value=\"delete\" type=\"hidden\" />\n <input name=\"authenticity_token\" value={token} type=\"hidden\" />\n </form>\n\n {children({ href, text, onClick })}\n </>\n );\n};\n\nexport default SignOutLink;\n"],"names":["React","useRef","SignOutLink","token","href","text","children","absUrl","formRef","onClick","e","current","submit","preventDefault","form","ref","method","action","className","input","name","value","type"],"mappings":"AAAA,OAAOA,OAAmDC,MAAM,KAAQ,OAAQ,CAmBhF,MAAMC,YAAc,CAAC,CACnBC,KAAK,CACLC,IAAI,CACJC,IAAI,CACJC,QAAQ,CACRC,MAAM,CACW,IACjB,MAAMC,QAAUP,OAAwB,MAExC,MAAMQ,QAAU,AAACC,IACfF,QAAQG,OAAO,EAAEC,SACjBF,EAAEG,cAAc,EAClB,EAEA,OACE,wCACE,oBAACC,QACCC,IAAKP,QACLQ,OAAO,OACPC,OAAQV,OAAOH,MACfc,UAAU,UAEV,oBAACC,SAAMC,KAAK,UAAUC,MAAM,SAASC,KAAK,WAC1C,oBAACH,SAAMC,KAAK,qBAAqBC,MAAOlB,MAAOmB,KAAK,YAGrDhB,SAAS,CAAEF,KAAMC,KAAMI,OAAQ,GAGtC,CAEA,gBAAeP,WAAY"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import throttle from"lodash.throttle";import{queryId,queryIdAll}from"../dom-query";import MeganavControl from"./MeganavControl/component.js";import MeganavControlMobileDropdown from"./MeganavControlMobileDropdown/component.js";import MobilePanelOpenClick from"./MeganavControlMobilePanelOpen/component.js";import MobilePanelCloseClick from"./MeganavControlMobilePanelClose/component.js";import MeganavSearchAutocomplete from"./MeganavSearchAutocomplete/component.js";import MeganavSearchSuggestions from"./MeganavSearchSuggestions/component.js";const windowOnBlur=closeAll=>{window.onblur=()=>closeAll();return{teardown:()=>window.onblur=null}};const documentClick=closeAll=>{const meganav=queryId("meganav");const clickHandler=e=>{if(meganav.contains(e.target))return;closeAll()};document.addEventListener("click",clickHandler);return{teardown:()=>document.removeEventListener("click",clickHandler)}};const documentScroll=themeName=>{if(themeName!=="transparentToWhite")return{teardown:()=>{}};const meganav=queryId("meganav");const navItems=queryIdAll("meganav-link");const controlMobileDropdownMenu=queryId("meganav-control-mobile-dropdown-menu");const controlMobileDropdownClose=queryId("meganav-control-mobile-dropdown-close");const controls=queryIdAll("meganav-control");const signUpBtn=queryId("meganav-sign-up-btn");const invertTextCollection=[...Array.from(controls),...Array.from(navItems),queryId("meganav-logo")];const invertMobleDropdownColor=invert=>{const whiteToBlack=["ui-icon-white","ui-icon-cool-black"];const blackToWhite=[...whiteToBlack].reverse();if(invert){controlMobileDropdownMenu?.classList.replace(...whiteToBlack);controlMobileDropdownClose?.classList.replace(...whiteToBlack)}else{controlMobileDropdownMenu?.classList.replace(...blackToWhite);controlMobileDropdownClose?.classList.replace(...blackToWhite)}};const inverSignupBtnColors=invert=>{if(invert){signUpBtn?.classList.replace("bg-white","bg-cool-black");signUpBtn?.classList.replace("text-cool-black","text-white")}else{signUpBtn?.classList.replace("bg-cool-black","bg-white");signUpBtn?.classList.replace("text-white","text-cool-black")}};const scrollHandler=throttle(()=>{if(window.scrollY>5){meganav.classList.replace("bg-transparent","bg-white");inverSignupBtnColors(true);invertMobleDropdownColor(true);invertTextCollection.forEach(n=>n.classList.replace("text-white","text-cool-black"))}else{meganav.classList.replace("bg-white","bg-transparent");inverSignupBtnColors(false);invertMobleDropdownColor(false);invertTextCollection.forEach(n=>n.classList.replace("text-cool-black","text-white"))}},150);document.addEventListener("scroll",scrollHandler);return{teardown:()=>document.removeEventListener("scroll",scrollHandler)}};export default function Meganav({themeName,addSearchApiKey}){const controls=MeganavControl();const panelOpenControls=MobilePanelOpenClick();const panelCloseControls=MobilePanelCloseClick();const search=MeganavSearchAutocomplete(addSearchApiKey);const searchSuggestions=MeganavSearchSuggestions();const mobileDropdownControl=MeganavControlMobileDropdown({clearPanels:()=>[...panelOpenControls,...panelCloseControls].forEach(i=>i.clear())});const closeAll=()=>[mobileDropdownControl,searchSuggestions,...panelOpenControls,...panelCloseControls,...controls,...search].forEach(i=>i.clear());const teardowns=[documentScroll(themeName??null),documentClick(closeAll),windowOnBlur(closeAll),mobileDropdownControl,searchSuggestions,...controls,...panelOpenControls,...panelCloseControls,...search].map(i=>i.teardown);return()=>teardowns.forEach(teardown=>teardown())}
|
|
2
|
+
//# sourceMappingURL=component.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/core/
|
|
1
|
+
{"version":3,"sources":["../../../src/core/LegacyMeganav/component.js"],"sourcesContent":["import throttle from \"lodash.throttle\";\n\n// Glossary:\n// item - is the element which contains both the control and the panel - these are adjacent\n// control - interactive element that controls showing and hiding of dropdown or panel\n// panel - container for meganav content\n// dropdown - container for top level items on mobile\n// clear - return to initial state\n// teardown - remove all event listeners (for example when removing nodes)\n\nimport { queryId, queryIdAll } from \"../dom-query\";\n\nimport MeganavControl from \"./MeganavControl/component.js\";\nimport MeganavControlMobileDropdown from \"./MeganavControlMobileDropdown/component.js\";\nimport MobilePanelOpenClick from \"./MeganavControlMobilePanelOpen/component.js\";\nimport MobilePanelCloseClick from \"./MeganavControlMobilePanelClose/component.js\";\nimport MeganavSearchAutocomplete from \"./MeganavSearchAutocomplete/component.js\";\nimport MeganavSearchSuggestions from \"./MeganavSearchSuggestions/component.js\";\n\n// Close menu when user clicks outside of viewport\nconst windowOnBlur = (closeAll) => {\n window.onblur = () => closeAll();\n return { teardown: () => (window.onblur = null) };\n};\n\n// Close menu when click/tap outside of nav\nconst documentClick = (closeAll) => {\n const meganav = queryId(\"meganav\");\n\n const clickHandler = (e) => {\n if (meganav.contains(e.target)) return;\n closeAll();\n };\n\n document.addEventListener(\"click\", clickHandler);\n\n return {\n teardown: () => document.removeEventListener(\"click\", clickHandler),\n };\n};\n\n// Invert from transparent to white\nconst documentScroll = (themeName) => {\n if (themeName !== \"transparentToWhite\") return { teardown: () => {} };\n\n const meganav = queryId(\"meganav\");\n const navItems = queryIdAll(\"meganav-link\");\n const controlMobileDropdownMenu = queryId(\n \"meganav-control-mobile-dropdown-menu\",\n );\n const controlMobileDropdownClose = queryId(\n \"meganav-control-mobile-dropdown-close\",\n );\n const controls = queryIdAll(\"meganav-control\");\n const signUpBtn = queryId(\"meganav-sign-up-btn\");\n\n const invertTextCollection = [\n ...Array.from(controls),\n ...Array.from(navItems),\n queryId(\"meganav-logo\"),\n ];\n\n const invertMobleDropdownColor = (invert) => {\n const whiteToBlack = [\"ui-icon-white\", \"ui-icon-cool-black\"];\n const blackToWhite = [...whiteToBlack].reverse();\n\n if (invert) {\n controlMobileDropdownMenu?.classList.replace(...whiteToBlack);\n controlMobileDropdownClose?.classList.replace(...whiteToBlack);\n } else {\n controlMobileDropdownMenu?.classList.replace(...blackToWhite);\n controlMobileDropdownClose?.classList.replace(...blackToWhite);\n }\n };\n\n const inverSignupBtnColors = (invert) => {\n if (invert) {\n signUpBtn?.classList.replace(\"bg-white\", \"bg-cool-black\");\n signUpBtn?.classList.replace(\"text-cool-black\", \"text-white\");\n } else {\n signUpBtn?.classList.replace(\"bg-cool-black\", \"bg-white\");\n signUpBtn?.classList.replace(\"text-white\", \"text-cool-black\");\n }\n };\n\n const scrollHandler = throttle(() => {\n if (window.scrollY > 5) {\n meganav.classList.replace(\"bg-transparent\", \"bg-white\");\n inverSignupBtnColors(true);\n invertMobleDropdownColor(true);\n\n invertTextCollection.forEach((n) =>\n n.classList.replace(\"text-white\", \"text-cool-black\"),\n );\n } else {\n meganav.classList.replace(\"bg-white\", \"bg-transparent\");\n inverSignupBtnColors(false);\n invertMobleDropdownColor(false);\n\n invertTextCollection.forEach((n) =>\n n.classList.replace(\"text-cool-black\", \"text-white\"),\n );\n }\n }, 150);\n\n document.addEventListener(\"scroll\", scrollHandler);\n\n return {\n teardown: () => document.removeEventListener(\"scroll\", scrollHandler),\n };\n};\n\nexport default function Meganav({ themeName, addSearchApiKey }) {\n const controls = MeganavControl();\n const panelOpenControls = MobilePanelOpenClick();\n const panelCloseControls = MobilePanelCloseClick();\n const search = MeganavSearchAutocomplete(addSearchApiKey);\n const searchSuggestions = MeganavSearchSuggestions();\n\n const mobileDropdownControl = MeganavControlMobileDropdown({\n clearPanels: () =>\n [...panelOpenControls, ...panelCloseControls].forEach((i) => i.clear()),\n });\n\n const closeAll = () =>\n [\n mobileDropdownControl,\n searchSuggestions,\n ...panelOpenControls,\n ...panelCloseControls,\n ...controls,\n ...search,\n ].forEach((i) => i.clear());\n\n const teardowns = [\n documentScroll(themeName ?? null),\n documentClick(closeAll),\n windowOnBlur(closeAll),\n mobileDropdownControl,\n searchSuggestions,\n ...controls,\n ...panelOpenControls,\n ...panelCloseControls,\n ...search,\n ].map((i) => i.teardown);\n\n return () => teardowns.forEach((teardown) => teardown());\n}\n"],"names":["throttle","queryId","queryIdAll","MeganavControl","MeganavControlMobileDropdown","MobilePanelOpenClick","MobilePanelCloseClick","MeganavSearchAutocomplete","MeganavSearchSuggestions","windowOnBlur","closeAll","window","onblur","teardown","documentClick","meganav","clickHandler","e","contains","target","document","addEventListener","removeEventListener","documentScroll","themeName","navItems","controlMobileDropdownMenu","controlMobileDropdownClose","controls","signUpBtn","invertTextCollection","Array","from","invertMobleDropdownColor","invert","whiteToBlack","blackToWhite","reverse","classList","replace","inverSignupBtnColors","scrollHandler","scrollY","forEach","n","Meganav","addSearchApiKey","panelOpenControls","panelCloseControls","search","searchSuggestions","mobileDropdownControl","clearPanels","i","clear","teardowns","map"],"mappings":"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"}
|
|
Binary file
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import React from"react";import Accordion from"../Accordion";import{menuItemLinks}from"./data";import cn from"../utils/cn";export const MeganavMobile=({navItems})=>{const menuItemClassname="text-[18px] py-12 font-bold text-neutral-1000 dark:text-neutral-000";return React.createElement("div",{className:"overflow-y-auto"},React.createElement(Accordion,{theme:"transparent",className:"px-16 pt-16",data:navItems,icons:{closed:{name:"icon-gui-chevron-down-outline"},open:{name:"icon-gui-chevron-up-outline"}},options:{autoClose:true,hideBorders:true,headerCSS:`px-0 ${menuItemClassname}`,contentCSS:"px-0",selectedHeaderCSS:"text-neutral-1300 dark:text-neutral-000",rowIconSize:"24px"}}),menuItemLinks&&React.createElement("div",{className:"mb-12"},menuItemLinks.map(link=>React.createElement("a",{href:link.link,key:link.name,className:cn("px-16 w-full block ui-text-p1",menuItemClassname)},link.name))))};
|
|
2
|
+
//# sourceMappingURL=MeganavMobile.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/core/Meganav/MeganavMobile.tsx"],"sourcesContent":["import React from \"react\";\nimport Accordion from \"../Accordion\";\nimport { AccordionData } from \"../Accordion/types\";\nimport { menuItemLinks } from \"./data\";\nimport cn from \"../utils/cn\";\n\nexport const MeganavMobile = ({ navItems }: { navItems: AccordionData[] }) => {\n const menuItemClassname =\n \"text-[18px] py-12 font-bold text-neutral-1000 dark:text-neutral-000\";\n return (\n <div className=\"overflow-y-auto\">\n <Accordion\n theme=\"transparent\"\n className=\"px-16 pt-16\"\n data={navItems}\n icons={{\n closed: { name: \"icon-gui-chevron-down-outline\" },\n open: { name: \"icon-gui-chevron-up-outline\" },\n }}\n options={{\n autoClose: true,\n hideBorders: true,\n headerCSS: `px-0 ${menuItemClassname}`,\n contentCSS: \"px-0\",\n selectedHeaderCSS: \"text-neutral-1300 dark:text-neutral-000\",\n rowIconSize: \"24px\",\n }}\n />\n {menuItemLinks && (\n <div className=\"mb-12\">\n {menuItemLinks.map((link) => (\n <a\n href={link.link}\n key={link.name}\n className={cn(\"px-16 w-full block ui-text-p1\", menuItemClassname)}\n >\n {link.name}\n </a>\n ))}\n </div>\n )}\n </div>\n );\n};\n"],"names":["React","Accordion","menuItemLinks","cn","MeganavMobile","navItems","menuItemClassname","div","className","theme","data","icons","closed","name","open","options","autoClose","hideBorders","headerCSS","contentCSS","selectedHeaderCSS","rowIconSize","map","link","a","href","key"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,cAAe,cAAe,AAErC,QAASC,aAAa,KAAQ,QAAS,AACvC,QAAOC,OAAQ,aAAc,AAE7B,QAAO,MAAMC,cAAgB,CAAC,CAAEC,QAAQ,CAAiC,IACvE,MAAMC,kBACJ,sEACF,OACE,oBAACC,OAAIC,UAAU,mBACb,oBAACP,WACCQ,MAAM,cACND,UAAU,cACVE,KAAML,SACNM,MAAO,CACLC,OAAQ,CAAEC,KAAM,+BAAgC,EAChDC,KAAM,CAAED,KAAM,6BAA8B,CAC9C,EACAE,QAAS,CACPC,UAAW,KACXC,YAAa,KACbC,UAAW,CAAC,KAAK,EAAEZ,kBAAkB,CAAC,CACtCa,WAAY,OACZC,kBAAmB,0CACnBC,YAAa,MACf,IAEDnB,eACC,oBAACK,OAAIC,UAAU,SACZN,cAAcoB,GAAG,CAAC,AAACC,MAClB,oBAACC,KACCC,KAAMF,KAAKA,IAAI,CACfG,IAAKH,KAAKV,IAAI,CACdL,UAAWL,GAAG,gCAAiCG,oBAE9CiB,KAAKV,IAAI,IAOxB,CAAE"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import React from"react";import cn from"../utils/cn";import Icon from"../Icon";import{productsForNav}from"./data";import FeaturedLink from"../FeaturedLink";import{productNames}from"../ProductTile/data";import ProductTile from"../ProductTile";export const MeganavPanel=({displayProductTile,panelLeft,panelLeftClassName,panelRightHeading,panelRightItems,panelRightBottom})=>{return React.createElement("div",{className:"flex flex-col md:flex-row gap-x-24 bg-neutral-000 dark:bg-neutral-1300"},React.createElement("div",{className:cn("flex-[7] flex-shrink-0 grid-cols-1 xs:grid-cols-2 group",panelLeftClassName),onClick:panelLeft&&!displayProductTile?()=>window.location.href=panelLeft.url:undefined},displayProductTile?productNames.map(product=>React.createElement(ProductTile,{name:product,key:product,selected:false,onClick:()=>{const productLink=productsForNav[product].link;if(productLink)window.location.href=productLink},animateIcons:true})):panelLeft&&React.createElement(React.Fragment,null,React.createElement("div",{className:"w-full p-24"},React.createElement("h4",{className:"ui-text-h4 text-neutral-1300 dark:text-neutral-000"},panelLeft.heading),React.createElement("p",{className:"ui-text-p3 text-neutral-800 dark:text-neutral-500 mt-8"},panelLeft.content),React.createElement(FeaturedLink,{url:panelLeft.url,additionalCSS:"text-neutral-1300 dark:text-neutral-000 mt-16 ui-text-p3 hover:text-neutral-1300 dark:hover:text-neutral-000",iconColor:"text-orange-600",iconClassName:"group-hover/meganav-panel:left-0"},panelLeft.labelLink)),React.createElement("div",{className:"flex justify-end"},React.createElement("img",{src:panelLeft.image,alt:panelLeft.heading,className:"w-full z-10 rounded-lg"})))),React.createElement("div",{className:"flex-[3] flex-shrink-0 flex flex-col justify-between"},React.createElement("ul",null,panelRightHeading&&React.createElement("p",{className:"ui-text-overline2 text-neutral-700 dark:text-neutral-600 my-12"},panelRightHeading),panelRightItems.map(item=>React.createElement("li",{className:cn("list-none py-[10px] md:py-8 my-0 flex gap-x-[10px] group hover:cursor-pointer",item.isMobile?"md:hidden":"md:flex"),key:item.label},React.createElement(Icon,{name:item.icon,size:"1.25rem",additionalCSS:"text-neutral-1000 dark:text-neutral-300"}),React.createElement("a",{className:"ui-text-menu2 md:ui-text-menu3 font-semibold text-neutral-1000 dark:text-neutral-300 group-hover:text-neutral-1300 dark:group-hover:text-neutral-000",href:item.link},item.label)))),panelRightBottom&&React.createElement("div",{className:"items-end mt-16 md:mt-0"},panelRightBottom)))};
|
|
2
|
+
//# sourceMappingURL=MeganavPanel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/core/Meganav/MeganavPanel.tsx"],"sourcesContent":["import React from \"react\";\nimport cn from \"../utils/cn\";\nimport Icon from \"../Icon\";\nimport { FlyoutPanelHighlight, FlyoutPanelList, productsForNav } from \"./data\";\nimport FeaturedLink from \"../FeaturedLink\";\nimport { ProductName, productNames } from \"../ProductTile/data\";\nimport ProductTile from \"../ProductTile\";\n\nexport const MeganavPanel = ({\n displayProductTile,\n panelLeft,\n panelLeftClassName,\n panelRightHeading,\n panelRightItems,\n panelRightBottom,\n}: {\n displayProductTile?: boolean;\n panelLeft?: FlyoutPanelHighlight;\n panelLeftClassName?: string;\n panelRightHeading?: string;\n panelRightItems: FlyoutPanelList[];\n panelRightBottom?: React.ReactNode;\n}) => {\n return (\n <div className=\"flex flex-col md:flex-row gap-x-24 bg-neutral-000 dark:bg-neutral-1300\">\n <div\n className={cn(\n \"flex-[7] flex-shrink-0 grid-cols-1 xs:grid-cols-2 group\",\n panelLeftClassName,\n )}\n onClick={\n panelLeft && !displayProductTile\n ? () => (window.location.href = panelLeft.url)\n : undefined\n }\n >\n {displayProductTile\n ? productNames.map((product) => (\n <ProductTile\n name={product as ProductName}\n key={product}\n selected={false}\n onClick={() => {\n const productLink = productsForNav[product].link;\n if (productLink) window.location.href = productLink;\n }}\n animateIcons={true}\n />\n ))\n : panelLeft && (\n <>\n <div className=\"w-full p-24\">\n <h4 className=\"ui-text-h4 text-neutral-1300 dark:text-neutral-000\">\n {panelLeft.heading}\n </h4>\n <p className=\"ui-text-p3 text-neutral-800 dark:text-neutral-500 mt-8\">\n {panelLeft.content}\n </p>\n <FeaturedLink\n url={panelLeft.url}\n additionalCSS=\"text-neutral-1300 dark:text-neutral-000 mt-16 ui-text-p3 hover:text-neutral-1300 dark:hover:text-neutral-000\"\n iconColor=\"text-orange-600\"\n iconClassName=\"group-hover/meganav-panel:left-0\"\n >\n {panelLeft.labelLink}\n </FeaturedLink>\n </div>\n <div className=\"flex justify-end\">\n <img\n src={panelLeft.image}\n alt={panelLeft.heading}\n className=\"w-full z-10 rounded-lg\"\n />\n </div>\n </>\n )}\n </div>\n <div className=\"flex-[3] flex-shrink-0 flex flex-col justify-between\">\n <ul>\n {panelRightHeading && (\n <p className=\"ui-text-overline2 text-neutral-700 dark:text-neutral-600 my-12\">\n {panelRightHeading}\n </p>\n )}\n\n {panelRightItems.map((item) => (\n <li\n className={cn(\n \"list-none py-[10px] md:py-8 my-0 flex gap-x-[10px] group hover:cursor-pointer\",\n item.isMobile ? \"md:hidden\" : \"md:flex\",\n )}\n key={item.label}\n >\n <Icon\n name={item.icon}\n size=\"1.25rem\"\n additionalCSS=\"text-neutral-1000 dark:text-neutral-300\"\n />\n <a\n className=\"ui-text-menu2 md:ui-text-menu3 font-semibold text-neutral-1000 dark:text-neutral-300 group-hover:text-neutral-1300 dark:group-hover:text-neutral-000\"\n href={item.link}\n >\n {item.label}\n </a>\n </li>\n ))}\n </ul>\n {panelRightBottom && (\n <div className=\"items-end mt-16 md:mt-0\">{panelRightBottom}</div>\n )}\n </div>\n </div>\n );\n};\n"],"names":["React","cn","Icon","productsForNav","FeaturedLink","productNames","ProductTile","MeganavPanel","displayProductTile","panelLeft","panelLeftClassName","panelRightHeading","panelRightItems","panelRightBottom","div","className","onClick","window","location","href","url","undefined","map","product","name","key","selected","productLink","link","animateIcons","h4","heading","p","content","additionalCSS","iconColor","iconClassName","labelLink","img","src","image","alt","ul","item","li","isMobile","label","icon","size","a"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,OAAQ,aAAc,AAC7B,QAAOC,SAAU,SAAU,AAC3B,QAAgDC,cAAc,KAAQ,QAAS,AAC/E,QAAOC,iBAAkB,iBAAkB,AAC3C,QAAsBC,YAAY,KAAQ,qBAAsB,AAChE,QAAOC,gBAAiB,gBAAiB,AAEzC,QAAO,MAAMC,aAAe,CAAC,CAC3BC,kBAAkB,CAClBC,SAAS,CACTC,kBAAkB,CAClBC,iBAAiB,CACjBC,eAAe,CACfC,gBAAgB,CAQjB,IACC,OACE,oBAACC,OAAIC,UAAU,0EACb,oBAACD,OACCC,UAAWd,GACT,0DACAS,oBAEFM,QACEP,WAAa,CAACD,mBACV,IAAOS,OAAOC,QAAQ,CAACC,IAAI,CAAGV,UAAUW,GAAG,CAC3CC,WAGLb,mBACGH,aAAaiB,GAAG,CAAC,AAACC,SAChB,oBAACjB,aACCkB,KAAMD,QACNE,IAAKF,QACLG,SAAU,MACVV,QAAS,KACP,MAAMW,YAAcxB,cAAc,CAACoB,QAAQ,CAACK,IAAI,CAChD,GAAID,YAAaV,OAAOC,QAAQ,CAACC,IAAI,CAAGQ,WAC1C,EACAE,aAAc,QAGlBpB,WACE,wCACE,oBAACK,OAAIC,UAAU,eACb,oBAACe,MAAGf,UAAU,sDACXN,UAAUsB,OAAO,EAEpB,oBAACC,KAAEjB,UAAU,0DACVN,UAAUwB,OAAO,EAEpB,oBAAC7B,cACCgB,IAAKX,UAAUW,GAAG,CAClBc,cAAc,+GACdC,UAAU,kBACVC,cAAc,oCAEb3B,UAAU4B,SAAS,GAGxB,oBAACvB,OAAIC,UAAU,oBACb,oBAACuB,OACCC,IAAK9B,UAAU+B,KAAK,CACpBC,IAAKhC,UAAUsB,OAAO,CACtBhB,UAAU,8BAMxB,oBAACD,OAAIC,UAAU,wDACb,oBAAC2B,UACE/B,mBACC,oBAACqB,KAAEjB,UAAU,kEACVJ,mBAIJC,gBAAgBU,GAAG,CAAC,AAACqB,MACpB,oBAACC,MACC7B,UAAWd,GACT,iFACA0C,KAAKE,QAAQ,CAAG,YAAc,WAEhCpB,IAAKkB,KAAKG,KAAK,EAEf,oBAAC5C,MACCsB,KAAMmB,KAAKI,IAAI,CACfC,KAAK,UACLd,cAAc,4CAEhB,oBAACe,KACClC,UAAU,uJACVI,KAAMwB,KAAKf,IAAI,EAEde,KAAKG,KAAK,KAKlBjC,kBACC,oBAACC,OAAIC,UAAU,2BAA2BF,mBAKpD,CAAE"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import React from"react";import{MeganavPanel}from"./MeganavPanel";import Status,{StatusUrl}from"../Status";import FanEngagementNavImage from"./images/fan-engagement-nav-image.png";import CompanyNavImage from"./images/founders-nav-image.png";import BestRequirementsWinter2025 from"../images/g2-best-meets-requirements-2025.svg";import BestSupportWinter2025 from"../images/g2-best-support-2025.svg";import HighPerformerWinter2025 from"../images/g2-high-performer-2025.svg";import UsersMostLikelyToRecommend from"../images/g2-users-most-likely-to-recommend-2025.svg";import{products}from"../ProductTile/data";const panelClassName="w-full sm:w-[815px]";const panelLeftFeatureClassName="bg-neutral-100 dark:bg-neutral-1200 hidden md:grid border border-neutral-300 dark:border-neutral-1000 hover:border-neutral-400 dark:hover:border-neutral-800 rounded-lg cursor-pointer group/meganav-panel";const productsMenu=[{label:"Infrastructure",icon:"icon-gui-globe-alt-outline",link:"/four-pillars-of-dependability"},{label:"Integrations",icon:"icon-gui-puzzle-piece-outline",link:"/integrations"},{label:"SDKs",icon:"icon-gui-cube-transparent-outline",link:"/docs/sdks"},{label:"Security & Compliance",icon:"icon-gui-shield-check-outline",link:"/security-and-compliance"}];const solutionsHighlight={heading:"Fan Engagement",content:"Capture the attention of millions of fans during live events.",labelLink:"Learn more",url:"/fan-engagement",image:FanEngagementNavImage};const solutionsMenu=[{label:"Fan Engagement",icon:"icon-gui-hand-thumb-up-outline",link:"/fan-engagement",isMobile:true},{label:"BizTech",icon:"icon-gui-building-office-outline",link:"/solutions/ecommerce-and-retail"},{label:"FinTech",icon:"icon-gui-currency-dollar-outline",link:"/solutions/fintech"},{label:"HealthTech",icon:"icon-gui-heart-outline",link:"/solutions/healthcare"},{label:"EdTech",icon:"icon-gui-academic-cap-outline",link:"/solutions/edtech"}];const companyHighlight={heading:"Leading the realtime revolution",content:"Hear from our founders about Ably’s ambitious plans to become the world’s definitive realtime platform.",labelLink:"About Ably",url:"/about",image:CompanyNavImage};const companyMenu=[{label:"About Ably",icon:"icon-gui-ably-badge",link:"/about",isMobile:true},{label:"Customer stories",icon:"icon-gui-star-outline",link:"/case-studies"},{label:"Careers",icon:"icon-gui-briefcase-outline",link:"/careers"},{label:"Blog",icon:"icon-gui-light-bulb-outline",link:"/blog"}];export const ablyAwards=[{image:BestRequirementsWinter2025,desc:"G2 Best Requirements Winter 2025"},{image:BestSupportWinter2025,desc:"G2 Best Support Winter 2025"},{image:HighPerformerWinter2025,desc:"G2 High Performer Winter 2025"},{image:UsersMostLikelyToRecommend,desc:"G2 Users Most Likely to Recommend Winter 2025"}];export const menuItemLinks=[{name:"Pricing",link:"/pricing",isHiddenMobile:true},{name:"Docs",link:"/docs",isHiddenMobile:true}];export const menuItemsForHeader=[{name:"Products",content:React.createElement(MeganavPanel,{displayProductTile:true,panelLeftClassName:"grid",panelRightItems:productsMenu,panelRightHeading:"platform",panelRightBottom:React.createElement(Status,{statusUrl:StatusUrl,showDescription:true})}),panelClassName},{name:"Solutions",content:React.createElement(MeganavPanel,{panelLeft:solutionsHighlight,panelLeftClassName:panelLeftFeatureClassName,panelRightItems:solutionsMenu}),panelClassName},{name:"Company",content:React.createElement(MeganavPanel,{panelLeft:companyHighlight,panelLeftClassName:panelLeftFeatureClassName,panelRightItems:companyMenu,panelRightBottom:React.createElement("div",{className:"flex-1 gap-x-8 hidden md:flex"},ablyAwards.slice(0,3).map(award=>React.createElement("img",{key:award.desc,src:award.image,alt:award.desc,width:"57",height:"64"})))}),panelClassName},...menuItemLinks];export const productsForNav={...products,pubsub:{...products.pubsub,link:"/pubsub"},liveSync:{...products.liveSync,link:"/livesync"},chat:{...products.chat,link:"/chat"},spaces:{...products.spaces,link:"/spaces"}};
|
|
2
|
+
//# sourceMappingURL=data.js.map
|
|
@@ -0,0 +1 @@
|
|
|
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\";\nimport UsersMostLikelyToRecommend from \"../images/g2-users-most-likely-to-recommend-2025.svg\";\nimport { products } from \"../ProductTile/data\";\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-400 dark:hover:border-neutral-800 rounded-lg cursor-pointer group/meganav-panel\";\n\nconst productsMenu: FlyoutPanelList[] = [\n {\n label: \"Infrastructure\",\n icon: \"icon-gui-globe-alt-outline\",\n link: \"/four-pillars-of-dependability\",\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\nexport const 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 image: UsersMostLikelyToRecommend,\n desc: \"G2 Users Most Likely to Recommend 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.slice(0, 3).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\nexport const productsForNav = {\n ...products,\n pubsub: { ...products.pubsub, link: \"/pubsub\" },\n liveSync: { ...products.liveSync, link: \"/livesync\" },\n chat: { ...products.chat, link: \"/chat\" },\n spaces: { ...products.spaces, link: \"/spaces\" },\n};\n"],"names":["React","MeganavPanel","Status","StatusUrl","FanEngagementNavImage","CompanyNavImage","BestRequirementsWinter2025","BestSupportWinter2025","HighPerformerWinter2025","UsersMostLikelyToRecommend","products","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","slice","map","award","img","key","src","alt","width","height","productsForNav","pubsub","liveSync","chat","spaces"],"mappings":"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"}
|
|
Binary file
|
|
Binary file
|
package/core/Meganav.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import React,{useEffect,
|
|
1
|
+
import React,{useEffect,useMemo}from"react";import Header from"./Header";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,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-200 dark:border-neutral-1100 rounded-2xl -mt-4 bg-neutral-000 dark:bg-neutral-1300"}),mobileNav:React.createElement(MeganavMobile,{navItems:mobileNavItems}),headerLinks:[{href:"/contact",label:"Contact us"}],headerLinksClassName:"md:gap-x-24 ",sessionState:sessionState,headerClassName:"bg-transparent border-b-0",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 bg-neutral-000 dark:bg-neutral-1300 border-b"},{id:"main-theme-dark",className:"ui-theme-dark bg-neutral-000 dark:bg-neutral-1300 border-b"}]})))};export default Meganav;
|
|
2
2
|
//# sourceMappingURL=Meganav.js.map
|
package/core/Meganav.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/core/Meganav.tsx"],"sourcesContent":["import React, {
|
|
1
|
+
{"version":3,"sources":["../../src/core/Meganav.tsx"],"sourcesContent":["import React, { useEffect, useMemo } from \"react\";\nimport Header, { HeaderSessionState } from \"./Header\";\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 notice?: MeganavNoticeBannerProps;\n theme?: string;\n};\n\nconst Meganav = ({ sessionState, notice, theme }: 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-200 dark:border-neutral-1100 rounded-2xl -mt-4 bg-neutral-000 dark:bg-neutral-1300\"\n />\n }\n mobileNav={<MeganavMobile navItems={mobileNavItems} />}\n headerLinks={[{ href: \"/contact\", label: \"Contact us\" }]}\n headerLinksClassName=\"md:gap-x-24 \"\n sessionState={sessionState}\n headerClassName=\"bg-transparent border-b-0\"\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:\n \"ui-theme-light bg-neutral-000 dark:bg-neutral-1300 border-b\",\n },\n {\n id: \"main-theme-dark\",\n className:\n \"ui-theme-dark bg-neutral-000 dark:bg-neutral-1300 border-b\",\n },\n ]}\n />\n </div>\n </>\n );\n};\n\nexport default Meganav;\n"],"names":["React","useEffect","useMemo","Header","Flyout","menuItemsForHeader","MeganavMobile","Notice","HEADER_HEIGHT","Meganav","sessionState","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","mobileNav","navItems","headerLinks","href","label","headerLinksClassName","headerClassName","themedScrollpoints"],"mappings":"AAAA,OAAOA,OAASC,SAAS,CAAEC,OAAO,KAAQ,OAAQ,AAClD,QAAOC,WAAoC,UAAW,AACtD,QAAOC,WAAY,UAAW,AAC9B,QAASC,kBAAkB,KAAQ,gBAAiB,AACpD,QAASC,aAAa,KAAQ,yBAA0B,AACxD,QAAOC,WAAY,UAAW,AAC9B,QAASC,aAAa,KAAQ,iBAAkB,CAyBhD,MAAMC,QAAU,CAAC,CAAEC,YAAY,CAAEC,MAAM,CAAEC,KAAK,CAAgB,IAC5D,KAAM,CAACC,aAAcC,gBAAgB,CAAGd,MAAMe,QAAQ,CAAC,GACvD,MAAMC,eAAiBd,QACrB,IACEG,mBACGY,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,EAGJtB,UAAU,KACR,MAAMuB,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,OAAQrB,cAAgBK,YAAa,GAE7CF,QAAU,oBAACJ,QAAQ,GAAGI,OAAO2B,KAAK,CAAEC,OAAQ5B,OAAO4B,MAAM,GAC1D,oBAACpC,QACC+B,UAAU,0DACVM,gBAAiB,CAAC,CAAC7B,OACnB8B,IACE,oBAACrC,QACCsC,UAAWrC,mBACX6B,UAAU,oBACVS,gBAAgB,oBAChBC,kBAAkB,iIAGtBC,UAAW,oBAACvC,eAAcwC,SAAU9B,iBACpC+B,YAAa,CAAC,CAAEC,KAAM,WAAYC,MAAO,YAAa,EAAE,CACxDC,qBAAqB,eACrBxC,aAAcA,aACdyC,gBAAgB,4BAChBC,mBAAoB,CAClB,CACEjB,GAAI,UACJD,UAAW,6CACb,EACA,CACEC,GAAI,qBACJD,UAAW,4CACb,EACA,CACEC,GAAI,OACJD,UACE,6DACJ,EACA,CACEC,GAAI,kBACJD,UACE,4DACJ,EACD,IAKX,CAEA,gBAAezB,OAAQ"}
|
package/core/Notice/component.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
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&¬iceId)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;
|
|
1
|
+
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&¬iceId)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;
|
|
2
2
|
//# sourceMappingURL=component.js.map
|
|
@@ -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;\
|
|
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
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
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";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}})},[]);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"},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;
|
|
1
|
+
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;
|
|
2
2
|
//# sourceMappingURL=Notice.js.map
|
package/core/Notice.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
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\";\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 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\">\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,
|
|
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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
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;
|
|
1
|
+
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;
|
|
2
2
|
//# sourceMappingURL=ProductDescription.js.map
|
|
@@ -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 {
|
|
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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
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;
|
|
1
|
+
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;
|
|
2
2
|
//# sourceMappingURL=ProductLabel.js.map
|
|
@@ -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,
|
|
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"}
|
package/core/ProductTile/data.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export const products={pubsub:{label:"Pub/Sub",description:"Low-level APIs to build any realtime experience",icon:"icon-product-pubsub-mono",hoverIcon:"icon-product-pubsub",link:"/docs/products/channels"},chat:{label:"Chat",description:"Rapidly build chat features and roll-out at scale",icon:"icon-product-chat-mono",hoverIcon:"icon-product-chat",link:"/docs/products/chat"},spaces:{label:"Spaces",description:"Create collaborative environments in a few lines of code",icon:"icon-product-spaces-mono",hoverIcon:"icon-product-spaces",link:"/docs/products/spaces"},liveSync:{label:"LiveSync",description:"Sync database changes with frontend clients",icon:"icon-product-livesync-mono",hoverIcon:"icon-product-livesync",link:"/docs/products/livesync"},assetTracking:{label:"Asset Tracking",description:"Simple APIs to build realtime tracking applications",icon:"icon-product-asset-tracking-mono",hoverIcon:"icon-product-asset-tracking",link:"/docs/products/asset-tracking"},liveObjects:{label:"LiveObjects",description:"Sync application state across multiple devices",icon:"icon-product-liveobjects-mono",hoverIcon:"icon-product-liveobjects",link:"/docs/products/asset-tracking",unavailable:true}};
|
|
1
|
+
export const productNames=["pubsub","chat","spaces","liveSync","assetTracking","liveObjects"];export const products={pubsub:{label:"Pub/Sub",description:"Low-level APIs to build any realtime experience",icon:"icon-product-pubsub-mono",hoverIcon:"icon-product-pubsub",link:"/docs/products/channels"},chat:{label:"Chat",description:"Rapidly build chat features and roll-out at scale",icon:"icon-product-chat-mono",hoverIcon:"icon-product-chat",link:"/docs/products/chat"},spaces:{label:"Spaces",description:"Create collaborative environments in a few lines of code",icon:"icon-product-spaces-mono",hoverIcon:"icon-product-spaces",link:"/docs/products/spaces"},liveSync:{label:"LiveSync",description:"Sync database changes with frontend clients",icon:"icon-product-livesync-mono",hoverIcon:"icon-product-livesync",link:"/docs/products/livesync"},assetTracking:{label:"Asset Tracking",description:"Simple APIs to build realtime tracking applications",icon:"icon-product-asset-tracking-mono",hoverIcon:"icon-product-asset-tracking",link:"/docs/products/asset-tracking"},liveObjects:{label:"LiveObjects",description:"Sync application state across multiple devices",icon:"icon-product-liveobjects-mono",hoverIcon:"icon-product-liveobjects",link:"/docs/products/asset-tracking",unavailable:true}};
|
|
2
2
|
//# sourceMappingURL=data.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/core/ProductTile/data.ts"],"sourcesContent":["import { IconName } from \"../Icon/types\";\n\nexport
|
|
1
|
+
{"version":3,"sources":["../../../src/core/ProductTile/data.ts"],"sourcesContent":["import { IconName } from \"../Icon/types\";\n\nexport const productNames = [\n \"pubsub\",\n \"chat\",\n \"spaces\",\n \"liveSync\",\n \"assetTracking\",\n \"liveObjects\",\n] as const;\n\nexport type ProductName = (typeof productNames)[number];\n\ntype Products = Record<\n ProductName,\n {\n label: string;\n description: string;\n link?: string;\n icon?: IconName;\n hoverIcon?: IconName;\n unavailable?: boolean;\n }\n>;\n\nexport const products: Products = {\n pubsub: {\n label: \"Pub/Sub\",\n description: \"Low-level APIs to build any realtime experience\",\n icon: \"icon-product-pubsub-mono\",\n hoverIcon: \"icon-product-pubsub\",\n link: \"/docs/products/channels\",\n },\n chat: {\n label: \"Chat\",\n description: \"Rapidly build chat features and roll-out at scale\",\n icon: \"icon-product-chat-mono\",\n hoverIcon: \"icon-product-chat\",\n link: \"/docs/products/chat\",\n },\n spaces: {\n label: \"Spaces\",\n description: \"Create collaborative environments in a few lines of code\",\n icon: \"icon-product-spaces-mono\",\n hoverIcon: \"icon-product-spaces\",\n link: \"/docs/products/spaces\",\n },\n liveSync: {\n label: \"LiveSync\",\n description: \"Sync database changes with frontend clients\",\n icon: \"icon-product-livesync-mono\",\n hoverIcon: \"icon-product-livesync\",\n link: \"/docs/products/livesync\",\n },\n assetTracking: {\n label: \"Asset Tracking\",\n description: \"Simple APIs to build realtime tracking applications\",\n icon: \"icon-product-asset-tracking-mono\",\n hoverIcon: \"icon-product-asset-tracking\",\n link: \"/docs/products/asset-tracking\",\n },\n liveObjects: {\n label: \"LiveObjects\",\n description: \"Sync application state across multiple devices\",\n icon: \"icon-product-liveobjects-mono\",\n hoverIcon: \"icon-product-liveobjects\",\n link: \"/docs/products/asset-tracking\",\n unavailable: true,\n },\n};\n"],"names":["productNames","products","pubsub","label","description","icon","hoverIcon","link","chat","spaces","liveSync","assetTracking","liveObjects","unavailable"],"mappings":"AAEA,OAAO,MAAMA,aAAe,CAC1B,SACA,OACA,SACA,WACA,gBACA,cACD,AAAU,AAgBX,QAAO,MAAMC,SAAqB,CAChCC,OAAQ,CACNC,MAAO,UACPC,YAAa,kDACbC,KAAM,2BACNC,UAAW,sBACXC,KAAM,yBACR,EACAC,KAAM,CACJL,MAAO,OACPC,YAAa,oDACbC,KAAM,yBACNC,UAAW,oBACXC,KAAM,qBACR,EACAE,OAAQ,CACNN,MAAO,SACPC,YAAa,2DACbC,KAAM,2BACNC,UAAW,sBACXC,KAAM,uBACR,EACAG,SAAU,CACRP,MAAO,WACPC,YAAa,8CACbC,KAAM,6BACNC,UAAW,wBACXC,KAAM,yBACR,EACAI,cAAe,CACbR,MAAO,iBACPC,YAAa,sDACbC,KAAM,mCACNC,UAAW,8BACXC,KAAM,+BACR,EACAK,YAAa,CACXT,MAAO,cACPC,YAAa,iDACbC,KAAM,gCACNC,UAAW,2BACXC,KAAM,gCACNM,YAAa,IACf,CACF,CAAE"}
|