@ably/ui 8.7.0-dev.2b71529 → 8.7.0-dev.3453cca

package/core/Code/component.css

@@ -1,7 +1,5 @@
 @layer base {
   @import url("https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,600;0,700;1,600;1,700&display=swap");
-  @import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@100;200;300;400;500;600;700;800&display=swap");
-  @import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap");
 }
 
 @layer components {

package/core/FeaturedLink/component.css

@@ -1,6 +1,6 @@
 @layer components {
   .ui-featured-link {
-    @apply font-manrope font-bold block;
+    @apply font-sans font-medium block;
     @apply text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus;
   }
 

package/core/Footer/component.css

@@ -1,14 +1,14 @@
 @layer components {
   .ui-footer-col-title {
-    @apply font-jetbrains_mono text-overline2 p-menu-row-title font-medium uppercase tracking-widen-0.16;
+    @apply text-overline2 p-menu-row-title font-normal uppercase tracking-widen-0.1;
   }
 
   .ui-footer-menu-row-link {
-    @apply text-menu3 text-cool-black font-manrope font-medium hover:text-gui-hover block;
+    @apply text-menu3 text-cool-black font-light hover:text-gui-hover block;
   }
 
   .ui-footer-link {
-    @apply text-gui-default hover:text-gui-hover text-menu3 font-manrope font-medium;
+    @apply text-gui-default hover:text-gui-hover text-menu3 font-light;
   }
 
   .ui-footer-compliance-text {

package/core/Footer.jsx

@@ -188,7 +188,7 @@ function Footer(_ref) {
   };
 
   return /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("footer", {
-    className: "bg-light-grey font-manrope antialiased leading-normal",
+    className: "bg-light-grey font-sans antialiased",
     "data-id": "footer"
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", {
     className: "max-w-screen-xl mx-auto py-32 sm:py-40 md:py-64 ui-grid-gap ui-grid-px grid grid-cols-6"
@@ -201,17 +201,17 @@ function Footer(_ref) {
     src: paths.ablyStack,
     alt: "Ably homepage"
   }), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("h2", {
-    className: "text-overline2 font-jetbrains_mono font-bold col-span-full uppercase tracking-widen-0.16"
+    className: "text-overline2 col-span-full font-medium uppercase tracking-widen-0.1"
   }, "The Ably Platform")), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", {
     className: "md:col-span-4 md:w-3/4 xs:w-3/5 w-full"
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("p", {
-    className: "font-manrope text-p3 py-16 font-bold p-menu-row-snug"
+    className: "text-p3 py-16 font-medium p-menu-row-snug"
   }, "Easily power any realtime experience in your application via a simple API that handles everything realtime.")), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("ul", {
     className: "grid grid-cols-1"
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("li", {
     className: "p-menu-row-snug"
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("a", {
-    href: absUrl("/pub-sub-messaging"),
+    href: absUrl("/solutions/channels"),
     className: "ui-footer-menu-row-link"
   }, "Pub/sub messaging")), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("li", {
     className: "p-menu-row-snug"
@@ -228,12 +228,7 @@ function Footer(_ref) {
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("a", {
     href: absUrl("/protocols"),
     className: "ui-footer-menu-row-link"
-  }, "Multiple protocol messaging")), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("li", {
-    className: "p-menu-row-snug"
-  }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("a", {
-    href: absUrl("/hub"),
-    className: "ui-footer-menu-row-link"
-  }, "Streaming data sources")))), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", {
+  }, "Multiple protocol messaging")))), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", {
     className: "col-span-full xs:col-span-3 md:col-span-1"
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("h2", {
     className: "ui-footer-col-title"
@@ -269,11 +264,6 @@ function Footer(_ref) {
     className: "ui-footer-menu-row-link"
   }, "Healthcare")), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("li", {
     className: "p-menu-row-snug"
-  }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("a", {
-    href: absUrl("/hub"),
-    className: "ui-footer-menu-row-link"
-  }, "Streaming data sources")), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("li", {
-    className: "p-menu-row-snug"
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("a", {
     href: absUrl("/solutions/ecommerce-and-retail"),
     className: "ui-footer-menu-row-link"
@@ -428,9 +418,9 @@ function Footer(_ref) {
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("a", {
     className: "h-24 pr-24 text-cool-black hover:text-icon-twitter",
     href: "https://twitter.com/ablyrealtime",
-    title: "Ably on Twitter"
+    title: "Ably on X"
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(component["default"], {
-    name: "twitter",
+    name: "icon-social-x",
     size: "1.5rem"
   })), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("a", {
     className: "h-24 pr-24 text-cool-black hover:text-icon-linkedin",
@@ -465,7 +455,7 @@ function Footer(_ref) {
     name: "glassdoor",
     size: "1.5rem"
   })), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", {
-    className: "pl-16 text-menu3 font-manrope font-medium"
+    className: "pl-16 text-menu3 font-light"
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("strong", {
     className: "block font-medium"
   }, "We're hiring!"), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("a", {
@@ -485,7 +475,7 @@ function Footer(_ref) {
     name: "glassdoor",
     size: "1.5rem"
   })), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", {
-    className: "text-menu3 font-manrope font-medium"
+    className: "text-menu3 font-light"
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("strong", {
     className: "block font-medium"
   }, "We're hiring!"), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("a", {
@@ -496,15 +486,19 @@ function Footer(_ref) {
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("img", {
     className: "mr-24 h-80",
     src: paths.highestUserAdoption,
-    alt: "Highest User Adoption 2022"
+    alt: "Highest User Adoption 2023"
+  }), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("img", {
+    className: "mr-24 h-80",
+    src: paths.bestSupport,
+    alt: "Best Support 2023"
   }), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("img", {
     className: "mr-24 h-80",
-    src: paths.usersLoveUs,
-    alt: "Users Love Us"
+    src: paths.fastestImplementation,
+    alt: "Fastest Implementation 2023"
   }), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("img", {
     className: "mr-24 h-80",
     src: paths.highestPerformer,
-    alt: "High Performer 2022"
+    alt: "High Performer 2023"
   }))), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", {
     className: "max-w-screen-xl ui-grid-px mx-auto"
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("hr", {
@@ -537,9 +531,9 @@ function Footer(_ref) {
     size: "1.5rem",
     additionalCSS: "bg-white rounded-full mr-12 ui-footer-tick-icon"
   }), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", null, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("p", {
-    className: "ui-footer-compliance-text font-bold whitespace-nowrap"
+    className: "ui-footer-compliance-text font-medium whitespace-nowrap"
   }, "SOC 2 Type 2"), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("p", {
-    className: "ui-footer-compliance-text font-medium mb-24"
+    className: "ui-footer-compliance-text font-light mb-24"
   }, "Certified"))), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", {
     className: "flex mr-24 md:col-start-2"
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(component["default"], {
@@ -548,9 +542,9 @@ function Footer(_ref) {
     size: "1.5rem",
     additionalCSS: "bg-white rounded-full mr-12 ui-footer-tick-icon"
   }), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", null, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("p", {
-    className: "ui-footer-compliance-text font-bold whitespace-nowrap"
+    className: "ui-footer-compliance-text font-medium whitespace-nowrap"
   }, "HIPAA"), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("p", {
-    className: "ui-footer-compliance-text font-medium mb-24"
+    className: "ui-footer-compliance-text font-light mb-24"
   }, "Compliant"))), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", {
     className: "flex mr-24 md:col-start-3"
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(component["default"], {
@@ -559,9 +553,9 @@ function Footer(_ref) {
     size: "1.5rem",
     additionalCSS: "bg-white rounded-full mr-12  ui-footer-tick-icon"
   }), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", null, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("p", {
-    className: "ui-footer-compliance-text font-bold whitespace-nowrap"
+    className: "ui-footer-compliance-text font-medium whitespace-nowrap"
   }, "EU GDPR"), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("p", {
-    className: "ui-footer-compliance-text font-medium mb-24"
+    className: "ui-footer-compliance-text font-light mb-24"
   }, "Certified"))), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", {
     className: "flex mr-24 md:col-start-4"
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(component["default"], {
@@ -570,9 +564,9 @@ function Footer(_ref) {
     size: "1.5rem",
     additionalCSS: "bg-white rounded-full mr-12  ui-footer-tick-icon"
   }), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", null, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("p", {
-    className: "ui-footer-compliance-text font-bold whitespace-nowrap"
+    className: "ui-footer-compliance-text font-medium whitespace-nowrap"
   }, "256-bit AES"), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("p", {
-    className: "ui-footer-compliance-text font-medium mb-24"
+    className: "ui-footer-compliance-text font-light mb-24"
   }, "Encryption"))))));
 }
 Footer.propTypes = {
@@ -580,7 +574,8 @@ Footer.propTypes = {
     ablyStack: (external_commonjs_prop_types_commonjs2_prop_types_default()).string,
     highestPerformer: (external_commonjs_prop_types_commonjs2_prop_types_default()).string,
     highestUserAdoption: (external_commonjs_prop_types_commonjs2_prop_types_default()).string,
-    usersLoveUs: (external_commonjs_prop_types_commonjs2_prop_types_default()).string
+    bestSupport: (external_commonjs_prop_types_commonjs2_prop_types_default()).string,
+    fastestImplementation: (external_commonjs_prop_types_commonjs2_prop_types_default()).string
   }),
   urlBase: (external_commonjs_prop_types_commonjs2_prop_types_default()).string
 };

package/core/Meganav/component.css

@@ -7,7 +7,7 @@
     z-index: var(--stacking-context-page-meganav);
 
     @apply fixed top-0 w-full;
-    @apply antialiased font-manrope transition-colors;
+    @apply antialiased font-sans transition-colors;
   }
 
   .ui-meganav {
@@ -51,7 +51,7 @@
   }
 
   .ui-meganav-link {
-    @apply text-menu2 font-bold block font-manrope;
+    @apply text-menu2 font-medium block;
     @apply mr-12 lg:mr-24 px-0 py-20;
     @apply hover:text-gui-hover focus:text-gui-focus focus:outline-none;
     @apply transition-colors;
@@ -63,13 +63,13 @@
 
   .ui-meganav-mobile-link {
     @apply p-menu-row relative -left-8 w-extend-8;
-    @apply text-menu2  font-bold font-jetbrains_mono font-medium block text-cool-black text-left;
+    @apply text-menu2 font-medium block text-cool-black text-left;
     @apply flex items-center;
     @apply focus:text-gui-focus focus:outline-none;
   }
 
   .ui-meganav-account-link {
-    @apply block px-8 py-8 hover:bg-light-grey hover:text-gui-hover rounded relative -left-8 text-menu3 w-extend-8 font-bold font-jetbrains_mono;
+    @apply block px-8 py-8 hover:bg-light-grey hover:text-gui-hover rounded relative -left-8 text-menu3 w-extend-8 font-light;
   }
 
   .ui-meganav-content {
@@ -97,15 +97,15 @@
   }
 
   .ui-meganav-media-heading {
-    @apply text-menu3 text-cool-black font-bold font-manrope group-hover:text-gui-hover group-focus:text-gui-focus leading-normal;
+    @apply text-menu3 text-cool-black font-medium group-hover:text-gui-hover group-focus:text-gui-focus;
   }
 
   .ui-meganav-media-copy {
-    @apply text-p3 font-manrope font-medium text-dark-grey leading-normal;
+    @apply text-p3 text-dark-grey font-light;
   }
 
   .ui-meganav-overline {
-    @apply text-overline2 text-cool-black uppercase font-bold font-jetbrains_mono tracking-widen-0.16 p-overline;
+    @apply text-overline2 text-cool-black uppercase font-medium tracking-widen-0.15 p-overline;
   }
 
   .ui-meganav-hr {

package/core/Meganav/component.json

@@ -29,7 +29,7 @@
     }
   },
   "panels": [
-    { "label": "Platform", "shortLabel": "Platform", "id": "platform-panel", "component": "MeganavContentPlatform" },
+    { "label": "Products", "shortLabel": "Products", "id": "products-panel", "component": "MeganavContentProducts" },
     { "label": "Solutions", "shortLabel": "Solutions", "id": "use-cases-panel", "component": "MeganavContentUseCases" },
     { "label": "Company", "shortLabel": "Company", "id": "company-panel", "component": "MeganavContentCompany" },
     { "label": "Developers", "shortLabel": "Developers", "id": "developers-panel", "component": "MeganavContentDevelopers" }

package/core/Meganav.jsx

@@ -984,7 +984,19 @@ var MeganavContentDevelopers = function MeganavContentDevelopers(_ref) {
     className: "ui-meganav-media-heading"
   }, "Integrations"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-copy"
-  }, "Find out more about Ably integrations. ")))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
+  }, "Find out more about Ably integrations. ")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
+    href: absUrl("/examples"),
+    className: "ui-meganav-media-with-image group"
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
+    name: "icon-display-examples-col",
+    size: "2.5rem"
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
+    className: "flex flex-col justify-center"
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
+    className: "ui-meganav-media-heading"
+  }, "Live examples"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
+    className: "ui-meganav-media-copy"
+  }, "Discover our features and their use cases.")))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     className: "col-span-full md:col-span-4 pb-8 md:py-24 lg:py-32 px-24 sm:px-32 md:px-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
     className: "md:mt-40",
@@ -1088,7 +1100,7 @@ MeganavContentDevelopers.propTypes = {
 
 /***/ }),
 
-/***/ 6654:
+/***/ 8254:
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
@@ -1104,7 +1116,7 @@ MeganavContentDevelopers.propTypes = {
 
 
 
-var MeganavContentPlatform = function MeganavContentPlatform(_ref) {
+var MeganavContentProducts = function MeganavContentProducts(_ref) {
   var paths = _ref.paths,
       absUrl = _ref.absUrl;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
@@ -1123,7 +1135,7 @@ var MeganavContentPlatform = function MeganavContentPlatform(_ref) {
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", {
     className: "ui-meganav-overline ml-24"
   }, "The Ably Platform")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "text-p2 font-bold text-cool-black mb-24 leading-normal",
+    className: "text-p2 font-medium text-cool-black mb-24",
     style: {
       maxWidth: "330px"
     }
@@ -1134,63 +1146,39 @@ var MeganavContentPlatform = function MeganavContentPlatform(_ref) {
     className: "col-span-full md:col-span-4 pt-24 pb-8 md:py-24 lg:py-32 px-24 sm:px-32 md:px-0 bg-white"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", {
     className: "ui-meganav-overline",
-    id: "meganav-platform-panel-list-examples"
-  }, "Our Examples"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
+    id: "meganav-products-panel-list-examples"
+  }, "Products"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
     className: "mb-16",
-    "aria-labelledby": "meganav-platform-panel-list-examples"
+    "aria-labelledby": "meganav-products-panel-list-examples"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
-    href: absUrl("/examples/avatar-stack"),
+    href: absUrl("/solutions/channels"),
     className: "group ui-meganav-media"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-heading"
-  }, "Avatar Stack"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "ui-meganav-media-copy"
-  }, "See who is connected in a digital space."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
-    href: absUrl("/examples/emoji-reactions"),
-    className: "ui-meganav-media group"
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "ui-meganav-media-heading"
-  }, "Emoji Reactions"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
+  }, "Pub/Sub Channels"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-copy"
-  }, "React with an emoji to a message."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
-    href: absUrl("/examples/activity-feed"),
-    className: "ui-meganav-media group"
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "ui-meganav-media-heading"
-  }, "Activity Feed"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "ui-meganav-media-copy"
-  }, "Display a list of user actions in realtime."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
-    href: absUrl("/examples/live-cursors"),
-    className: "ui-meganav-media group"
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "ui-meganav-media-heading"
-  }, "Live Cursors"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "ui-meganav-media-copy"
-  }, "Track all cursors in realtime."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
-    href: absUrl("/examples/typing-indicator"),
-    className: "ui-meganav-media group"
+  }, "Build infinitely scalable realtime applications."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
+    href: absUrl("/spaces"),
+    className: "group ui-meganav-media"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-heading"
-  }, "Typing Indicator"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
+  }, "Spaces (Beta)"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-copy"
-  }, "See when a user is typing a message."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
-    href: absUrl("/examples/chat-admin-privileges"),
-    className: "ui-meganav-media group"
+  }, "Create multi-user collaborative environments."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
+    href: absUrl("/livesync"),
+    className: "group ui-meganav-media"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-heading"
-  }, "Chat Admin Privileges"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
+  }, "LiveSync (Pre release)"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-copy"
-  }, "Control who can take admin actions in a digital space.")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_FeaturedLink_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
-    url: absUrl("/examples"),
-    textSize: "text-p3"
-  }, "Explore all live examples")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
+  }, "Keep clients in sync with any relational database."))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     className: "col-span-full md:col-span-4 pt-8 pb-24 md:py-24 lg:py-32 px-24 sm:px-32 md:px-0 bg-white"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", {
     className: "ui-meganav-overline",
-    id: "meganav-platform-panel-list-our-technology"
-  }, "Our technology"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
+    id: "meganav-products-panel-list-our-technology"
+  }, "Technology"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
     className: "mb-16",
-    "aria-labelledby": "meganav-platform-panel-list-our-technology"
+    "aria-labelledby": "meganav-products-panel-list-our-technology"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/four-pillars-of-dependability#performance"),
     className: "ui-meganav-media group"
@@ -1234,14 +1222,14 @@ var MeganavContentPlatform = function MeganavContentPlatform(_ref) {
   }));
 };
 
-MeganavContentPlatform.propTypes = {
+MeganavContentProducts.propTypes = {
   paths: prop_types__WEBPACK_IMPORTED_MODULE_1___default().shape({
     ablyStack: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
     iconSprites: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
   }),
   absUrl: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
 };
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MeganavContentPlatform);
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MeganavContentProducts);
 
 /***/ }),
 
@@ -1337,18 +1325,18 @@ var MeganavContentUseCases = function MeganavContentUseCases(_ref) {
   }, "Notifications"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-copy"
   }, "Deliver cross-platform push notifications with a simple unified API.")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
-    href: absUrl("/solutions/extend-kafka-to-the-edge"),
+    href: absUrl("/solutions/asset-tracking"),
     className: "ui-meganav-media-with-image group"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
-    name: "icon-display-kafka-at-the-edge-col",
+    name: "icon-display-asset-tracking-col",
     size: "2.5rem"
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     className: "flex flex-col justify-center"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-heading"
-  }, "Extend Kafka to the edge"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
+  }, "Asset Tracking (Beta)"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-copy"
-  }, "Reliably expand Kafka\u2019s event streaming beyond your private network.")))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
+  }, "Track assets in realtime with a solution optimised for last mile logistics.")))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     className: "col-span-full md:col-span-4 pt-24 pb-0 md:py-24 lg:py-32 px-24 sm:px-32 md:px-0 bg-white"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", {
     className: "ui-meganav-overline",
@@ -1646,7 +1634,7 @@ var MeganavDesktopItems = function MeganavDesktopItems(_ref) {
     "data-id": "meganav-items-desktop"
   }, _Meganav_component_json__WEBPACK_IMPORTED_MODULE_2__/* .panels.map */ .h.map(function (panel) {
     var PanelComponent = panels[panel.component];
-    var bgCSS = ["platform-panel", "use-cases-panel"].includes(panel.id) ? "ui-meganav-panel-split-bg" : "";
+    var bgCSS = ["products-panel", "use-cases-panel"].includes(panel.id) ? "ui-meganav-panel-split-bg" : "";
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
       className: "ui-meganav-item",
       key: panel.id
@@ -2341,7 +2329,7 @@ var Icon_component = __webpack_require__(9008);
 ;// CONCATENATED MODULE: ./src/core/Notice/component.jsx
 
 
-var contentWrapperClasses = "font-medium w-full pr-8 text-p3 self-center";
+var contentWrapperClasses = "font-light w-full pr-8 text-p3 self-center";
 
 
 
@@ -2395,7 +2383,7 @@ var component_Notice = function Notice(_ref2) {
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(ContentWrapper, {
     buttonLink: buttonLink
   }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("strong", {
-    className: "font-bold whitespace-nowrap pr-4"
+    className: "font-medium whitespace-nowrap pr-4"
   }, title), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("span", {
     className: "pr-4"
   }, bodyText), buttonLabel && /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("span", {
@@ -3371,7 +3359,7 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__9042__;
 /***/ ((module) => {
 
 "use strict";
-module.exports = JSON.parse('{"n":{"white":{"backgroundColor":"bg-white","textColor":"text-cool-black","buttonBackgroundColor":"","buttonTextColor":"","mobileMenuColor":"text-cool-black","logoTextColor":"text-cool-black","barShadow":"shadow-subtle"},"black":{"backgroundColor":"bg-cool-black","textColor":"text-white","buttonBackgroundColor":"bg-white","buttonTextColor":"text-cool-black","mobileMenuColor":"text-white","logoTextColor":"text-white","barShadow":""},"transparentToWhite":{"backgroundColor":"bg-transparent","textColor":"text-white","buttonBackgroundColor":"bg-white","buttonTextColor":"text-cool-black","mobileMenuColor":"text-white","logoTextColor":"text-white","barShadow":""}},"h":[{"label":"Platform","shortLabel":"Platform","id":"platform-panel","component":"MeganavContentPlatform"},{"label":"Solutions","shortLabel":"Solutions","id":"use-cases-panel","component":"MeganavContentUseCases"},{"label":"Company","shortLabel":"Company","id":"company-panel","component":"MeganavContentCompany"},{"label":"Developers","shortLabel":"Developers","id":"developers-panel","component":"MeganavContentDevelopers"}]}');
+module.exports = JSON.parse('{"n":{"white":{"backgroundColor":"bg-white","textColor":"text-cool-black","buttonBackgroundColor":"","buttonTextColor":"","mobileMenuColor":"text-cool-black","logoTextColor":"text-cool-black","barShadow":"shadow-subtle"},"black":{"backgroundColor":"bg-cool-black","textColor":"text-white","buttonBackgroundColor":"bg-white","buttonTextColor":"text-cool-black","mobileMenuColor":"text-white","logoTextColor":"text-white","barShadow":""},"transparentToWhite":{"backgroundColor":"bg-transparent","textColor":"text-white","buttonBackgroundColor":"bg-white","buttonTextColor":"text-cool-black","mobileMenuColor":"text-white","logoTextColor":"text-white","barShadow":""}},"h":[{"label":"Products","shortLabel":"Products","id":"products-panel","component":"MeganavContentProducts"},{"label":"Solutions","shortLabel":"Solutions","id":"use-cases-panel","component":"MeganavContentUseCases"},{"label":"Company","shortLabel":"Company","id":"company-panel","component":"MeganavContentCompany"},{"label":"Developers","shortLabel":"Developers","id":"developers-panel","component":"MeganavContentDevelopers"}]}');
 
 /***/ })
 
@@ -4344,8 +4332,8 @@ var absUrl = function absUrl(path) {
 };
 
 /* harmony default export */ const url_base = (absUrl);
-// EXTERNAL MODULE: ./src/core/MeganavContentPlatform/component.jsx
-var MeganavContentPlatform_component = __webpack_require__(6654);
+// EXTERNAL MODULE: ./src/core/MeganavContentProducts/component.jsx
+var MeganavContentProducts_component = __webpack_require__(8254);
 // EXTERNAL MODULE: ./src/core/MeganavContentUseCases/component.jsx
 var MeganavContentUseCases_component = __webpack_require__(1118);
 // EXTERNAL MODULE: ./src/core/MeganavContentCompany/component.jsx + 1 modules
@@ -4436,7 +4424,7 @@ var SignInPlaceholder = function SignInPlaceholder() {
 };
 
 var panels = {
-  MeganavContentPlatform: MeganavContentPlatform_component["default"],
+  MeganavContentProducts: MeganavContentProducts_component["default"],
   MeganavContentUseCases: MeganavContentUseCases_component["default"],
   MeganavContentCompany: MeganavContentCompany_component["default"],
   MeganavContentDevelopers: MeganavContentDevelopers_component["default"]

package/core/MeganavContentDevelopers.jsx

@@ -213,7 +213,19 @@ var MeganavContentDevelopers = function MeganavContentDevelopers(_ref) {
     className: "ui-meganav-media-heading"
   }, "Integrations"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-copy"
-  }, "Find out more about Ably integrations. ")))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
+  }, "Find out more about Ably integrations. ")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
+    href: absUrl("/examples"),
+    className: "ui-meganav-media-with-image group"
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
+    name: "icon-display-examples-col",
+    size: "2.5rem"
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
+    className: "flex flex-col justify-center"
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
+    className: "ui-meganav-media-heading"
+  }, "Live examples"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
+    className: "ui-meganav-media-copy"
+  }, "Discover our features and their use cases.")))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     className: "col-span-full md:col-span-4 pb-8 md:py-24 lg:py-32 px-24 sm:px-32 md:px-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
     className: "md:mt-40",

package/core/MeganavContentPlatform.jsx

@@ -230,7 +230,7 @@ var MeganavContentPlatform = function MeganavContentPlatform(_ref) {
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", {
     className: "ui-meganav-overline ml-24"
   }, "The Ably Platform")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "text-p2 font-bold text-cool-black mb-24 leading-normal",
+    className: "text-p2 font-medium text-cool-black mb-24",
     style: {
       maxWidth: "330px"
     }
@@ -242,55 +242,31 @@ var MeganavContentPlatform = function MeganavContentPlatform(_ref) {
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", {
     className: "ui-meganav-overline",
     id: "meganav-platform-panel-list-examples"
-  }, "Our Examples"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
+  }, "Products"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
     className: "mb-16",
     "aria-labelledby": "meganav-platform-panel-list-examples"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
-    href: absUrl("/examples/avatar-stack"),
+    href: absUrl("/solutions/channels"),
     className: "group ui-meganav-media"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-heading"
-  }, "Avatar Stack"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
+  }, "Pub/Sub Channels"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-copy"
-  }, "See who is connected in a digital space."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
-    href: absUrl("/examples/emoji-reactions"),
-    className: "ui-meganav-media group"
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "ui-meganav-media-heading"
-  }, "Emoji Reactions"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "ui-meganav-media-copy"
-  }, "React with an emoji to a message."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
-    href: absUrl("/examples/activity-feed"),
-    className: "ui-meganav-media group"
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "ui-meganav-media-heading"
-  }, "Activity Feed"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "ui-meganav-media-copy"
-  }, "Display a list of user actions in realtime."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
-    href: absUrl("/examples/live-cursors"),
-    className: "ui-meganav-media group"
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "ui-meganav-media-heading"
-  }, "Live Cursors"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
-    className: "ui-meganav-media-copy"
-  }, "Track all cursors in realtime."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
-    href: absUrl("/examples/typing-indicator"),
-    className: "ui-meganav-media group"
+  }, "Build infinitely scalable realtime applications."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
+    href: absUrl("/spaces"),
+    className: "group ui-meganav-media"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-heading"
-  }, "Typing Indicator"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
+  }, "Spaces (Beta)"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-copy"
-  }, "See when a user is typing a message."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
-    href: absUrl("/examples/chat-admin-privileges"),
-    className: "ui-meganav-media group"
+  }, "Create multi-user collaborative environments."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
+    href: absUrl("/livesync"),
+    className: "group ui-meganav-media"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-heading"
-  }, "Chat Admin Privileges"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
+  }, "LiveSync (Beta)"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-meganav-media-copy"
-  }, "Control who can take admin actions in a digital space.")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_FeaturedLink_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
-    url: absUrl("/examples"),
-    textSize: "text-p3"
-  }, "Explore all live examples")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
+  }, "Build stateful interactive applications."))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     className: "col-span-full md:col-span-4 pt-8 pb-24 md:py-24 lg:py-32 px-24 sm:px-32 md:px-0 bg-white"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", {
     className: "ui-meganav-overline",

package/core/MeganavContentProducts/component.js

@@ -0,0 +1 @@
+!function(e,o){"object"==typeof exports&&"object"==typeof module?module.exports=o():"function"==typeof define&&define.amd?define([],o):"object"==typeof exports?exports.AblyUi=o():(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.MeganavContentProducts=o())}(this,(()=>({}.default)));