@ably/ui 17.11.0-dev.672950e8 → 17.11.0

package/core/Meganav/MeganavPanel.js.map

@@ -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 { ProductName, productNames } from \"../ProductTile/data\";\nimport MeganavProductTile from \"./MeganavProductTile\";\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-6 bg-neutral-000 dark:bg-neutral-1300\">\n      <div\n        className={cn(\n          \"flex-[7] flex-shrink-0 group\",\n          { \"grid-cols-1 xs:grid-cols-2\": displayProductTile },\n          panelLeftClassName,\n        )}\n      >\n        {displayProductTile\n          ? productNames.map((product) => (\n              <MeganavProductTile\n                name={product as ProductName}\n                key={product}\n                productLink={productsForNav[product].link ?? \"#\"}\n                animateIcons={true}\n              />\n            ))\n          : panelLeft && (\n              <a\n                className=\"grid grid-cols-1 xs:grid-cols-2 pointer-events-auto\"\n                href={panelLeft.url}\n              >\n                <span className=\"block w-full p-6\">\n                  <h4 className=\"ui-text-h4 text-neutral-1300 dark:text-neutral-000\">\n                    {panelLeft.heading}\n                  </h4>\n                  <span className=\"block ui-text-p3 text-neutral-800 dark:text-neutral-500 mt-2\">\n                    {panelLeft.content}\n                  </span>\n                  <span className=\"py-2 font-sans font-bold block group/featured-link text-neutral-1300 dark:text-neutral-000 mt-4 ui-text-p3 hover:text-neutral-1300 dark:hover:text-neutral-000\">\n                    {panelLeft.labelLink}\n                    <Icon\n                      name=\"icon-gui-arrow-long-right-outline\"\n                      size=\"18px\"\n                      color=\"text-orange-600\"\n                      additionalCSS={cn(\n                        \"align-middle ml-2 relative -top-px -left-1 transition-[left]\",\n                        \"group-hover/featured-link:left-0 group-hover/meganav-panel:left-0\",\n                      )}\n                    />\n                  </span>\n                </span>\n                <span className=\"flex justify-end\">\n                  <img\n                    src={panelLeft.image}\n                    alt={panelLeft.heading}\n                    className=\"w-full z-10 rounded-lg\"\n                  />\n                </span>\n              </a>\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-3\">\n              {panelRightHeading}\n            </p>\n          )}\n\n          {panelRightItems.map((item) => (\n            <li\n              className={cn(\n                \"list-none py-2.5 md:py-2  my-0 flex gap-x-2.5 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=\"pointer-events-auto ui-text-label2 md:ui-text-label3 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-4 md:mt-0\">{panelRightBottom}</div>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["React","cn","Icon","productsForNav","productNames","MeganavProductTile","MeganavPanel","displayProductTile","panelLeft","panelLeftClassName","panelRightHeading","panelRightItems","panelRightBottom","div","className","map","product","name","key","productLink","link","animateIcons","a","href","url","span","h4","heading","content","labelLink","size","color","additionalCSS","img","src","image","alt","ul","p","item","li","isMobile","label","icon"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,OAAQ,aAAc,AAC7B,QAAOC,SAAU,SAAU,AAC3B,QAAgDC,cAAc,KAAQ,QAAS,AAC/E,QAAsBC,YAAY,KAAQ,qBAAsB,AAChE,QAAOC,uBAAwB,sBAAuB,AAEtD,QAAO,MAAMC,aAAe,CAAC,CAC3BC,kBAAkB,CAClBC,SAAS,CACTC,kBAAkB,CAClBC,iBAAiB,CACjBC,eAAe,CACfC,gBAAgB,CAQjB,IACC,OACE,oBAACC,OAAIC,UAAU,yEACb,oBAACD,OACCC,UAAWb,GACT,+BACA,CAAE,6BAA8BM,kBAAmB,EACnDE,qBAGDF,mBACGH,aAAaW,GAAG,CAAC,AAACC,SAChB,oBAACX,oBACCY,KAAMD,QACNE,IAAKF,QACLG,YAAahB,cAAc,CAACa,QAAQ,CAACI,IAAI,EAAI,IAC7CC,aAAc,QAGlBb,WACE,oBAACc,KACCR,UAAU,sDACVS,KAAMf,UAAUgB,GAAG,EAEnB,oBAACC,QAAKX,UAAU,oBACd,oBAACY,MAAGZ,UAAU,sDACXN,UAAUmB,OAAO,EAEpB,oBAACF,QAAKX,UAAU,gEACbN,UAAUoB,OAAO,EAEpB,oBAACH,QAAKX,UAAU,kKACbN,UAAUqB,SAAS,CACpB,oBAAC3B,MACCe,KAAK,oCACLa,KAAK,OACLC,MAAM,kBACNC,cAAe/B,GACb,+DACA,yEAKR,oBAACwB,QAAKX,UAAU,oBACd,oBAACmB,OACCC,IAAK1B,UAAU2B,KAAK,CACpBC,IAAK5B,UAAUmB,OAAO,CACtBb,UAAU,8BAMxB,oBAACD,OAAIC,UAAU,wDACb,oBAACuB,UACE3B,mBACC,oBAAC4B,KAAExB,UAAU,iEACVJ,mBAIJC,gBAAgBI,GAAG,CAAC,AAACwB,MACpB,oBAACC,MACC1B,UAAWb,GACT,2EACAsC,KAAKE,QAAQ,CAAG,YAAc,WAEhCvB,IAAKqB,KAAKG,KAAK,EAEf,oBAACxC,MACCe,KAAMsB,KAAKI,IAAI,CACfb,KAAK,UACLE,cAAc,4CAEhB,oBAACV,KACCR,UAAU,6KACVS,KAAMgB,KAAKnB,IAAI,EAEdmB,KAAKG,KAAK,KAKlB9B,kBACC,oBAACC,OAAIC,UAAU,0BAA0BF,mBAKnD,CAAE"}
+{"version":3,"sources":["../../../src/core/Meganav/MeganavPanel.tsx"],"sourcesContent":["import React from \"react\";\nimport { FlyoutPanelList, productsForNav } from \"./data\";\nimport { ProductName, productNames } from \"../ProductTile/data\";\nimport MeganavPanelItemLinks, {\n  MeganavPanelItemLink,\n} from \"./MeganavPanelItemLinks\";\nimport MeganavTile from \"./MeganavTile\";\nimport cn from \"../utils/cn\";\n\ntype MeganavPanelProps = {\n  displayProductTile?: boolean;\n  panelLeft?: React.ReactNode;\n  panelMiddleItems?: React.ReactNode;\n  panelRightItems?: MeganavPanelItemLink[];\n  panelRightBottom?: React.ReactNode;\n  panelRightBottomClassName?: string;\n};\n\nconst basePanelClassName = \"bg-neutral-000 dark:bg-neutral-1300 m-0 md:m-6\";\n\nconst gridPanelClassName = cn(\n  basePanelClassName,\n  \"grid grid-cols-1 md:grid-cols-3 gap-x-4\",\n);\n\nexport const MeganavPanel = ({\n  displayProductTile,\n  panelLeft,\n  panelMiddleItems,\n  panelRightItems,\n  panelRightBottom,\n  panelRightBottomClassName,\n}: MeganavPanelProps) => {\n  const renderProductsGrid = () => (\n    <div className=\"grid grid-cols-1 sm:grid-cols-2 col-span-1 sm:col-span-2\">\n      {productNames.map((product) => (\n        <MeganavTile\n          key={product}\n          productName={product as ProductName}\n          link={productsForNav[product].link ?? \"#\"}\n          animateIcons\n        />\n      ))}\n    </div>\n  );\n\n  return (\n    <div className={cn(gridPanelClassName, \"items-start\")}>\n      {displayProductTile ? (\n        renderProductsGrid()\n      ) : (\n        <>\n          {panelLeft}\n          {panelMiddleItems}\n        </>\n      )}\n\n      <div className=\"flex flex-col justify-between gap-y-6 mt-3 self-stretch\">\n        {panelRightItems?.map((rightItem) => (\n          <MeganavPanelItemLinks\n            key={rightItem.link?.label || rightItem.label}\n            label={rightItem.label}\n            listItems={rightItem.listItems}\n            link={rightItem.link}\n            displayTitleInMobile={rightItem.displayTitleInMobile ?? true}\n          />\n        ))}\n        {panelRightBottom && (\n          <div\n            className={cn(\"items-end mt-4 md:mt-0\", panelRightBottomClassName)}\n          >\n            {panelRightBottom}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport const MeganavPanelFullwidth = ({\n  panelItems,\n}: {\n  panelItems: FlyoutPanelList[];\n}) => (\n  <>\n    <div className={cn(gridPanelClassName, \"hidden md:grid\")}>\n      {panelItems.map((item) => (\n        <MeganavTile\n          key={item.label}\n          navLabel={item.label}\n          navIcon={item.icon}\n          navDescription={item.description}\n          link={item.link}\n          showAblyText={false}\n        />\n      ))}\n    </div>\n    <div className={cn(basePanelClassName, \"block md:hidden\")}>\n      <MeganavPanelItemLinks listItems={panelItems} />\n    </div>\n  </>\n);\n"],"names":["React","productsForNav","productNames","MeganavPanelItemLinks","MeganavTile","cn","basePanelClassName","gridPanelClassName","MeganavPanel","displayProductTile","panelLeft","panelMiddleItems","panelRightItems","panelRightBottom","panelRightBottomClassName","renderProductsGrid","div","className","map","product","key","productName","link","animateIcons","rightItem","label","listItems","displayTitleInMobile","MeganavPanelFullwidth","panelItems","item","navLabel","navIcon","icon","navDescription","description","showAblyText"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAA0BC,cAAc,KAAQ,QAAS,AACzD,QAAsBC,YAAY,KAAQ,qBAAsB,AAChE,QAAOC,0BAEA,yBAA0B,AACjC,QAAOC,gBAAiB,eAAgB,AACxC,QAAOC,OAAQ,aAAc,CAW7B,MAAMC,mBAAqB,iDAE3B,MAAMC,mBAAqBF,GACzBC,mBACA,0CAGF,QAAO,MAAME,aAAe,CAAC,CAC3BC,kBAAkB,CAClBC,SAAS,CACTC,gBAAgB,CAChBC,eAAe,CACfC,gBAAgB,CAChBC,yBAAyB,CACP,IAClB,MAAMC,mBAAqB,IACzB,oBAACC,OAAIC,UAAU,4DACZf,aAAagB,GAAG,CAAC,AAACC,SACjB,oBAACf,aACCgB,IAAKD,QACLE,YAAaF,QACbG,KAAMrB,cAAc,CAACkB,QAAQ,CAACG,IAAI,EAAI,IACtCC,aAAAA,SAMR,OACE,oBAACP,OAAIC,UAAWZ,GAAGE,mBAAoB,gBACpCE,mBACCM,qBAEA,wCACGL,UACAC,kBAIL,oBAACK,OAAIC,UAAU,2DACZL,iBAAiBM,IAAI,AAACM,WACrB,oBAACrB,uBACCiB,IAAKI,UAAUF,IAAI,EAAEG,OAASD,UAAUC,KAAK,CAC7CA,MAAOD,UAAUC,KAAK,CACtBC,UAAWF,UAAUE,SAAS,CAC9BJ,KAAME,UAAUF,IAAI,CACpBK,qBAAsBH,UAAUG,oBAAoB,EAAI,QAG3Dd,kBACC,oBAACG,OACCC,UAAWZ,GAAG,yBAA0BS,4BAEvCD,mBAMb,CAAE,AAEF,QAAO,MAAMe,sBAAwB,CAAC,CACpCC,UAAU,CAGX,GACC,wCACE,oBAACb,OAAIC,UAAWZ,GAAGE,mBAAoB,mBACpCsB,WAAWX,GAAG,CAAC,AAACY,MACf,oBAAC1B,aACCgB,IAAKU,KAAKL,KAAK,CACfM,SAAUD,KAAKL,KAAK,CACpBO,QAASF,KAAKG,IAAI,CAClBC,eAAgBJ,KAAKK,WAAW,CAChCb,KAAMQ,KAAKR,IAAI,CACfc,aAAc,UAIpB,oBAACpB,OAAIC,UAAWZ,GAAGC,mBAAoB,oBACrC,oBAACH,uBAAsBuB,UAAWG,cAGtC"}

package/core/Meganav/MeganavPanelItemLinks.js

@@ -0,0 +1,2 @@
+import React from"react";import Icon from"../Icon";import cn from"../utils/cn";import Badge from"../Badge";import{PanelTitle}from"./PanelTitle";const MeganavPanelItemLinks=({label,listItems,link,displayTitleInMobile=true})=>{return React.createElement("ul",{className:cn(!displayTitleInMobile&&"-mt-3 md:mt-0")},(link?.label||label)&&React.createElement(PanelTitle,{title:link?.label||label||"",link:link?.link??"",displayTitleInMobile:displayTitleInMobile}),listItems&&listItems.map(listItem=>React.createElement("li",{className:cn("list-none py-2.5 md:py-2 px-3 my-0 flex gap-x-2.5 rounded-lg group hover:cursor-pointer","hover:bg-neutral-100 dark:hover:bg-neutral-1200 active:bg-neutral-200 dark:active:bg-neutral-1100",listItem.isMobile?"md:hidden":"md:flex"),key:listItem.label},listItem.icon&&React.createElement(Icon,{name:listItem.icon,size:"1.25rem",additionalCSS:"text-neutral-1000 dark:text-neutral-300"}),React.createElement("a",{className:"pointer-events-auto font-sans text-label2 md:text-label3 font-semibold text-neutral-1000 dark:text-neutral-300  group-hover:text-neutral-1300 dark:group-hover:text-neutral-000 focus-base",href:listItem.link},listItem.label),listItem.badge&&React.createElement(Badge,{size:"xs"},listItem.badge))))};export default MeganavPanelItemLinks;
+//# sourceMappingURL=MeganavPanelItemLinks.js.map

package/core/Meganav/MeganavPanelItemLinks.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/core/Meganav/MeganavPanelItemLinks.tsx"],"sourcesContent":["import React from \"react\";\nimport Icon from \"../Icon\";\nimport cn from \"../utils/cn\";\nimport Badge from \"../Badge\";\nimport { PanelTitle } from \"./PanelTitle\";\nimport { IconName } from \"../Icon/types\";\nimport { FlyoutPanelList } from \"./data\";\n\nexport type MeganavPanelItemLink = {\n  label?: string;\n  listItems: FlyoutPanelList[];\n  icon?: IconName;\n  link?: {\n    label: string;\n    link: string;\n  };\n  displayTitleInMobile?: boolean;\n};\n\nconst MeganavPanelItemLinks = ({\n  label,\n  listItems,\n  link,\n  displayTitleInMobile = true,\n}: MeganavPanelItemLink) => {\n  return (\n    <ul className={cn(!displayTitleInMobile && \"-mt-3 md:mt-0\")}>\n      {(link?.label || label) && (\n        <PanelTitle\n          title={link?.label || label || \"\"}\n          link={link?.link ?? \"\"}\n          displayTitleInMobile={displayTitleInMobile}\n        />\n      )}\n\n      {listItems &&\n        listItems.map((listItem) => (\n          <li\n            className={cn(\n              \"list-none py-2.5 md:py-2 px-3 my-0 flex gap-x-2.5 rounded-lg group hover:cursor-pointer\",\n              \"hover:bg-neutral-100 dark:hover:bg-neutral-1200 active:bg-neutral-200 dark:active:bg-neutral-1100\",\n              listItem.isMobile ? \"md:hidden\" : \"md:flex\",\n            )}\n            key={listItem.label}\n          >\n            {listItem.icon && (\n              <Icon\n                name={listItem.icon}\n                size=\"1.25rem\"\n                additionalCSS=\"text-neutral-1000 dark:text-neutral-300\"\n              />\n            )}\n            <a\n              className=\"pointer-events-auto font-sans text-label2 md:text-label3 font-semibold text-neutral-1000 dark:text-neutral-300 \n              group-hover:text-neutral-1300 dark:group-hover:text-neutral-000 focus-base\"\n              href={listItem.link}\n            >\n              {listItem.label}\n            </a>\n            {listItem.badge && <Badge size=\"xs\">{listItem.badge}</Badge>}\n          </li>\n        ))}\n    </ul>\n  );\n};\n\nexport default MeganavPanelItemLinks;\n"],"names":["React","Icon","cn","Badge","PanelTitle","MeganavPanelItemLinks","label","listItems","link","displayTitleInMobile","ul","className","title","map","listItem","li","isMobile","key","icon","name","size","additionalCSS","a","href","badge"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,SAAU,SAAU,AAC3B,QAAOC,OAAQ,aAAc,AAC7B,QAAOC,UAAW,UAAW,AAC7B,QAASC,UAAU,KAAQ,cAAe,CAe1C,MAAMC,sBAAwB,CAAC,CAC7BC,KAAK,CACLC,SAAS,CACTC,IAAI,CACJC,qBAAuB,IAAI,CACN,IACrB,OACE,oBAACC,MAAGC,UAAWT,GAAG,CAACO,sBAAwB,kBACxC,AAACD,CAAAA,MAAMF,OAASA,KAAI,GACnB,oBAACF,YACCQ,MAAOJ,MAAMF,OAASA,OAAS,GAC/BE,KAAMA,MAAMA,MAAQ,GACpBC,qBAAsBA,uBAIzBF,WACCA,UAAUM,GAAG,CAAC,AAACC,UACb,oBAACC,MACCJ,UAAWT,GACT,0FACA,oGACAY,SAASE,QAAQ,CAAG,YAAc,WAEpCC,IAAKH,SAASR,KAAK,EAElBQ,SAASI,IAAI,EACZ,oBAACjB,MACCkB,KAAML,SAASI,IAAI,CACnBE,KAAK,UACLC,cAAc,4CAGlB,oBAACC,KACCX,UAAU,6LAEVY,KAAMT,SAASN,IAAI,EAElBM,SAASR,KAAK,EAEhBQ,SAASU,KAAK,EAAI,oBAACrB,OAAMiB,KAAK,MAAMN,SAASU,KAAK,IAK/D,CAEA,gBAAenB,qBAAsB"}

package/core/Meganav/MeganavTile.js

@@ -0,0 +1,2 @@
+import React from"react";import cn from"../utils/cn";import{products}from"../ProductTile/data";import ProductIcon from"../ProductTile/ProductIcon";import ProductLabel from"../ProductTile/ProductLabel";import ProductDescription from"../ProductTile/ProductDescription";const CONTAINER_GAP_RATIO=3;const MeganavTile=({productName,navLabel,navIcon,navDescription,link,animateIcons=false,showAblyText=true})=>{const productData=productName?products[productName]:null;const icon=productData?.icon??navIcon;const hoverIcon=productData?.hoverIcon;const label=productData?.label??navLabel??"";const description=productData?.description??navDescription??"";const unavailable=productData?.unavailable??false;const numericalSize=40;return React.createElement("a",{href:link,className:cn("transition-colors group/product-tile","flex flex-col p-3 rounded-lg gap-2 pointer-events-auto focus-base","bg-neutral-000 dark:bg-neutral-1300","hover:bg-neutral-100 dark:hover:bg-neutral-1200","active:bg-neutral-200 dark:active:bg-neutral-1100"),"aria-hidden":unavailable},React.createElement("span",{className:"items-center flex",style:{gap:numericalSize/CONTAINER_GAP_RATIO}},React.createElement(ProductIcon,{size:numericalSize,name:icon,hoverName:animateIcons?hoverIcon:undefined,unavailable:!!unavailable,selected:false}),React.createElement(ProductLabel,{label:label,unavailable:!!unavailable,numericalSize:numericalSize,showLabel:true,showAblyText:showAblyText,selected:false})),React.createElement(ProductDescription,{description:description,unavailable:!!unavailable,showDescription:true,selected:false}))};export default MeganavTile;
+//# sourceMappingURL=MeganavTile.js.map

package/core/Meganav/MeganavTile.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/core/Meganav/MeganavTile.tsx"],"sourcesContent":["import React from \"react\";\nimport cn from \"../utils/cn\";\nimport { products, ProductName } from \"../ProductTile/data\";\nimport ProductIcon from \"../ProductTile/ProductIcon\";\nimport ProductLabel from \"../ProductTile/ProductLabel\";\nimport ProductDescription from \"../ProductTile/ProductDescription\";\nimport { IconName } from \"../Icon/types\";\n\nconst CONTAINER_GAP_RATIO = 3;\n\nexport type MeganavTileProps = {\n  link: string;\n  productName?: ProductName;\n  navLabel?: string;\n  navIcon?: IconName;\n  navDescription?: string;\n  animateIcons?: boolean;\n  showAblyText?: boolean;\n};\n\nconst MeganavTile = ({\n  productName,\n  navLabel,\n  navIcon,\n  navDescription,\n  link,\n  animateIcons = false,\n  showAblyText = true,\n}: MeganavTileProps) => {\n  const productData = productName ? products[productName] : null;\n\n  const icon = productData?.icon ?? navIcon;\n  const hoverIcon = productData?.hoverIcon;\n  const label = productData?.label ?? navLabel ?? \"\";\n  const description = productData?.description ?? navDescription ?? \"\";\n  const unavailable = productData?.unavailable ?? false;\n\n  const numericalSize = 40;\n\n  return (\n    <a\n      href={link}\n      className={cn(\n        \"transition-colors group/product-tile\",\n        \"flex flex-col p-3 rounded-lg gap-2 pointer-events-auto focus-base\",\n        \"bg-neutral-000 dark:bg-neutral-1300\",\n        \"hover:bg-neutral-100 dark:hover:bg-neutral-1200\",\n        \"active:bg-neutral-200 dark:active:bg-neutral-1100\",\n      )}\n      aria-hidden={unavailable}\n    >\n      <span\n        className=\"items-center flex\"\n        style={{\n          gap: numericalSize / CONTAINER_GAP_RATIO,\n        }}\n      >\n        <ProductIcon\n          size={numericalSize}\n          name={icon}\n          hoverName={animateIcons ? hoverIcon : undefined}\n          unavailable={!!unavailable}\n          selected={false}\n        />\n        <ProductLabel\n          label={label}\n          unavailable={!!unavailable}\n          numericalSize={numericalSize}\n          showLabel={true}\n          showAblyText={showAblyText}\n          selected={false}\n        />\n      </span>\n      <ProductDescription\n        description={description}\n        unavailable={!!unavailable}\n        showDescription={true}\n        selected={false}\n      />\n    </a>\n  );\n};\n\nexport default MeganavTile;\n"],"names":["React","cn","products","ProductIcon","ProductLabel","ProductDescription","CONTAINER_GAP_RATIO","MeganavTile","productName","navLabel","navIcon","navDescription","link","animateIcons","showAblyText","productData","icon","hoverIcon","label","description","unavailable","numericalSize","a","href","className","aria-hidden","span","style","gap","size","name","hoverName","undefined","selected","showLabel","showDescription"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,OAAQ,aAAc,AAC7B,QAASC,QAAQ,KAAqB,qBAAsB,AAC5D,QAAOC,gBAAiB,4BAA6B,AACrD,QAAOC,iBAAkB,6BAA8B,AACvD,QAAOC,uBAAwB,mCAAoC,CAGnE,MAAMC,oBAAsB,EAY5B,MAAMC,YAAc,CAAC,CACnBC,WAAW,CACXC,QAAQ,CACRC,OAAO,CACPC,cAAc,CACdC,IAAI,CACJC,aAAe,KAAK,CACpBC,aAAe,IAAI,CACF,IACjB,MAAMC,YAAcP,YAAcN,QAAQ,CAACM,YAAY,CAAG,KAE1D,MAAMQ,KAAOD,aAAaC,MAAQN,QAClC,MAAMO,UAAYF,aAAaE,UAC/B,MAAMC,MAAQH,aAAaG,OAAST,UAAY,GAChD,MAAMU,YAAcJ,aAAaI,aAAeR,gBAAkB,GAClE,MAAMS,YAAcL,aAAaK,aAAe,MAEhD,MAAMC,cAAgB,GAEtB,OACE,oBAACC,KACCC,KAAMX,KACNY,UAAWvB,GACT,uCACA,oEACA,sCACA,kDACA,qDAEFwB,cAAaL,aAEb,oBAACM,QACCF,UAAU,oBACVG,MAAO,CACLC,IAAKP,cAAgBf,mBACvB,GAEA,oBAACH,aACC0B,KAAMR,cACNS,KAAMd,KACNe,UAAWlB,aAAeI,UAAYe,UACtCZ,YAAa,CAAC,CAACA,YACfa,SAAU,QAEZ,oBAAC7B,cACCc,MAAOA,MACPE,YAAa,CAAC,CAACA,YACfC,cAAeA,cACfa,UAAW,KACXpB,aAAcA,aACdmB,SAAU,SAGd,oBAAC5B,oBACCc,YAAaA,YACbC,YAAa,CAAC,CAACA,YACfe,gBAAiB,KACjBF,SAAU,QAIlB,CAEA,gBAAe1B,WAAY"}

package/core/Meganav/PanelTitle.js

@@ -0,0 +1,2 @@
+import React from"react";import FeaturedLink from"../FeaturedLink";import cn from"../utils/cn";export const PanelTitle=({title,link,displayTitleInMobile=true})=>{return React.createElement("div",{className:cn("mb-3 px-3",displayTitleInMobile?"block":"hidden md:block")},link?React.createElement(FeaturedLink,{url:link,textSize:"text-overline2",additionalCSS:"ui-text-overline2 mb-0 py-0 font-medium font-mono text-neutral-700 dark:text-neutral-600 hover:text-neutral-1300 dark:hover:text-neutral-000 active:text-neutral-1100 dark:active:text-neutral-200 focus-base"},title):React.createElement("p",{className:"ui-text-overline2 text-neutral-700 dark:text-neutral-600 font-medium font-mono"},title))};
+//# sourceMappingURL=PanelTitle.js.map

package/core/Meganav/PanelTitle.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/core/Meganav/PanelTitle.tsx"],"sourcesContent":["import React from \"react\";\nimport FeaturedLink from \"../FeaturedLink\";\nimport cn from \"../utils/cn\";\n\nexport const PanelTitle = ({\n  title,\n  link,\n  displayTitleInMobile = true,\n}: {\n  title: string;\n  link?: string;\n  displayTitleInMobile?: boolean;\n}) => {\n  return (\n    <div\n      className={cn(\n        \"mb-3 px-3\",\n        displayTitleInMobile ? \"block\" : \"hidden md:block\",\n      )}\n    >\n      {link ? (\n        <FeaturedLink\n          url={link}\n          textSize=\"text-overline2\"\n          additionalCSS=\"ui-text-overline2 mb-0 py-0 font-medium font-mono\n          text-neutral-700 dark:text-neutral-600 hover:text-neutral-1300 dark:hover:text-neutral-000\n          active:text-neutral-1100 dark:active:text-neutral-200 focus-base\"\n        >\n          {title}\n        </FeaturedLink>\n      ) : (\n        <p className=\"ui-text-overline2 text-neutral-700 dark:text-neutral-600 font-medium font-mono\">\n          {title}\n        </p>\n      )}\n    </div>\n  );\n};\n"],"names":["React","FeaturedLink","cn","PanelTitle","title","link","displayTitleInMobile","div","className","url","textSize","additionalCSS","p"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,iBAAkB,iBAAkB,AAC3C,QAAOC,OAAQ,aAAc,AAE7B,QAAO,MAAMC,WAAa,CAAC,CACzBC,KAAK,CACLC,IAAI,CACJC,qBAAuB,IAAI,CAK5B,IACC,OACE,oBAACC,OACCC,UAAWN,GACT,YACAI,qBAAuB,QAAU,oBAGlCD,KACC,oBAACJ,cACCQ,IAAKJ,KACLK,SAAS,iBACTC,cAAc,iNAIbP,OAGH,oBAACQ,KAAEJ,UAAU,kFACVJ,OAKX,CAAE"}

package/core/Meganav/data.js

@@ -1,2 +1,2 @@
-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 G2BestMeetsRequirementsSpring2025 from"../images/badges/g2-best-meets-requirements-spring-2025.svg";import G2BestResultsSpring2025 from"../images/badges/g2-best-results-spring-2025.svg";import G2BestSupportSpring2025 from"../images/badges/g2-best-support-spring-2025.svg";import{products}from"../ProductTile/data";const panelClassName="w-full sm:w-[50.9375rem]";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:"Architecture",icon:"icon-gui-globe-alt-outline",link:"/platform"},{label:"Integrations",icon:"icon-gui-puzzle-piece-outline",link:"/docs/platform/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:"CXTech",icon:"icon-gui-building-office-outline",link:"/cx-tech"},{label:"FinTech",icon:"icon-gui-currency-dollar-outline",link:"/fin-tech"},{label:"HealthTech",icon:"icon-gui-heart-outline",link:"/health-tech"},{label:"EdTech",icon:"icon-gui-academic-cap-outline",link:"/ed-tech"}];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:G2BestSupportSpring2025,desc:"G2 Best Support Spring 2025"},{image:G2BestMeetsRequirementsSpring2025,desc:"G2 Best Meets Requirements Spring 2025"},{image:G2BestResultsSpring2025,desc:"G2 Best Results Spring 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-2 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"},aiTransport:{...products.aiTransport,link:"/ai-transport"},liveObjects:{...products.liveObjects,link:"/liveobjects"}};
+import React from"react";import G2BestMeetsRequirementsSpring2025 from"../images/badges/g2-best-meets-requirements-spring-2025.svg";import G2BestResultsSpring2025 from"../images/badges/g2-best-results-spring-2025.svg";import G2BestSupportSpring2025 from"../images/badges/g2-best-support-spring-2025.svg";import{products}from"../ProductTile/data";import DoxyMeLogo from"../Meganav/images/cust-logo-doxy-light.png";import DoxyMeLogoDark from"../Meganav/images/cust-logo-doxy-dark.png";export const productsMenu=[{label:"Architecture",icon:"icon-gui-squares-2-x-2-outline",link:"/platform"},{label:"Integrations",icon:"icon-gui-puzzle-piece-outline",link:"/docs/platform/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"}];export const compareMenu=[{label:"Ably vs Pusher",link:"/compare/ably-vs-pusher"},{label:"Ably vs PubNub",link:"/compare/ably-vs-pubnub"},{label:"Ably vs Socket.io",link:"/compare/ably-vs-socketio"}];export const solutionsMenu=[{label:"Fan Engagement",icon:"icon-gui-hand-thumb-up-outline",link:"/fan-engagement",description:"Enhance every moment with live, interactive fan experiences."},{label:"FinTech",icon:"icon-gui-currency-dollar-outline",link:"/fin-tech",description:"Speed, reliability, and confidence in every user interaction."},{label:"EdTech",icon:"icon-gui-academic-cap-outline",link:"/ed-tech",description:"Power collaborative, interactive learning environments."},{label:"CXTech",icon:"icon-gui-face-smile-outline",link:"/cx-tech",description:"Deliver fast support, strong relationships, and high retention."},{label:"HealthTech",icon:"icon-gui-heartbeat-outline",link:"/health-tech",description:"Reliable tools with full data privacy and compliance."}];export const customerStoriesHighlight={companyLogo:DoxyMeLogo,companyLogoDark:DoxyMeLogoDark,companyLink:"/case-studies/doxyme",companyName:"Doxy.me",companyDesc:"built their realtime stack in under six months, cutting costs by 65%, eliminating errors, and transforming a once-feared system into a core strength."};export const companyMenu=[{label:"Our story",icon:"icon-gui-ably-badge",link:"/case-studies"},{label:"Careers",icon:"icon-gui-briefcase-outline",link:"/careers",badge:"WE'RE HIRING"}];export const ablyAwards=[{image:G2BestSupportSpring2025,desc:"G2 Best Support Spring 2025"},{image:G2BestMeetsRequirementsSpring2025,desc:"G2 Best Meets Requirements Spring 2025"},{image:G2BestResultsSpring2025,desc:"G2 Best Results Spring 2025"}];export const menuItemLinks=[{name:"Pricing",link:"/pricing",isHiddenMobile:true},{name:"Docs",link:"/docs",isHiddenMobile:true}];export const defaultBlogPosts=[{title:"Ably AI Transport: keep your agents connected and stateful across devices",link:"/blog/ably-ai-transport",categories:["New Release","AI Transport"],pubDate:"Dec 9, 2025"},{title:"Live chat at unlimited scale: What it takes to support stadium-sized audiences",link:"/blog/live-chat-at-unlimited-scale",categories:["Chat"],pubDate:"Nov 18, 2025"}];export const productsForNav={...products,pubsub:{...products.pubsub,link:"/pubsub"},liveSync:{...products.liveSync,link:"/livesync"},chat:{...products.chat,link:"/chat"},spaces:{...products.spaces,link:"/spaces"},aiTransport:{...products.aiTransport,link:"/ai-transport"},liveObjects:{...products.liveObjects,link:"/liveobjects"}};
 //# sourceMappingURL=data.js.map

package/core/Meganav/data.js.map

@@ -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 G2BestMeetsRequirementsSpring2025 from \"../images/badges/g2-best-meets-requirements-spring-2025.svg\";\nimport G2BestResultsSpring2025 from \"../images/badges/g2-best-results-spring-2025.svg\";\nimport G2BestSupportSpring2025 from \"../images/badges/g2-best-support-spring-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-[50.9375rem]\";\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: \"Architecture\",\n    icon: \"icon-gui-globe-alt-outline\",\n    link: \"/platform\",\n  },\n  {\n    label: \"Integrations\",\n    icon: \"icon-gui-puzzle-piece-outline\",\n    link: \"/docs/platform/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: \"CXTech\",\n    icon: \"icon-gui-building-office-outline\",\n    link: \"/cx-tech\",\n  },\n  {\n    label: \"FinTech\",\n    icon: \"icon-gui-currency-dollar-outline\",\n    link: \"/fin-tech\",\n  },\n  {\n    label: \"HealthTech\",\n    icon: \"icon-gui-heart-outline\",\n    link: \"/health-tech\",\n  },\n  {\n    label: \"EdTech\",\n    icon: \"icon-gui-academic-cap-outline\",\n    link: \"/ed-tech\",\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: G2BestSupportSpring2025,\n    desc: \"G2 Best Support Spring 2025\",\n  },\n  {\n    image: G2BestMeetsRequirementsSpring2025,\n    desc: \"G2 Best Meets Requirements Spring 2025\",\n  },\n  {\n    image: G2BestResultsSpring2025,\n    desc: \"G2 Best Results Spring 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-2 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\n// Since the product-tile data is used in other projects, we update it here\n// for the meganav.\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  aiTransport: {\n    ...products.aiTransport,\n    link: \"/ai-transport\",\n  },\n  liveObjects: { ...products.liveObjects, link: \"/liveobjects\" },\n};\n"],"names":["React","MeganavPanel","Status","StatusUrl","FanEngagementNavImage","CompanyNavImage","G2BestMeetsRequirementsSpring2025","G2BestResultsSpring2025","G2BestSupportSpring2025","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","aiTransport","liveObjects"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAE1B,QAASC,YAAY,KAAQ,gBAAiB,AAC9C,QAAOC,QAAUC,SAAS,KAAQ,WAAY,AAC9C,QAAOC,0BAA2B,uCAAwC,AAC1E,QAAOC,oBAAqB,iCAAkC,AAC9D,QAAOC,sCAAuC,6DAA8D,AAC5G,QAAOC,4BAA6B,kDAAmD,AACvF,QAAOC,4BAA6B,kDAAmD,AACvF,QAASC,QAAQ,KAAQ,qBAAsB,CAyB/C,MAAMC,eAAiB,2BAEvB,MAAMC,0BACJ,6MAEF,MAAMC,aAAkC,CACtC,CACEC,MAAO,eACPC,KAAM,6BACNC,KAAM,WACR,EACA,CACEF,MAAO,eACPC,KAAM,gCACNC,KAAM,6BACR,EACA,CACEF,MAAO,OACPC,KAAM,oCACNC,KAAM,YACR,EACA,CACEF,MAAO,wBACPC,KAAM,gCACNC,KAAM,0BACR,EACD,CAED,MAAMC,mBAA2C,CAC/CC,QAAS,iBACTC,QAAS,gEACTC,UAAW,aACXC,IAAK,kBACLC,MAAOjB,qBACT,EAEA,MAAMkB,cAAmC,CACvC,CACET,MAAO,iBACPC,KAAM,iCACNC,KAAM,kBACNQ,SAAU,IACZ,EACA,CACEV,MAAO,SACPC,KAAM,mCACNC,KAAM,UACR,EACA,CACEF,MAAO,UACPC,KAAM,mCACNC,KAAM,WACR,EACA,CACEF,MAAO,aACPC,KAAM,yBACNC,KAAM,cACR,EACA,CACEF,MAAO,SACPC,KAAM,gCACNC,KAAM,UACR,EACD,CAED,MAAMS,iBAAyC,CAC7CP,QAAS,kCACTC,QACE,0GACFC,UAAW,aACXC,IAAK,SACLC,MAAOhB,eACT,EAEA,MAAMoB,YAAiC,CACrC,CACEZ,MAAO,aACPC,KAAM,sBACNC,KAAM,SACNQ,SAAU,IACZ,EACA,CACEV,MAAO,mBACPC,KAAM,wBACNC,KAAM,eACR,EACA,CACEF,MAAO,UACPC,KAAM,6BACNC,KAAM,UACR,EACA,CACEF,MAAO,OACPC,KAAM,8BACNC,KAAM,OACR,EACD,AAED,QAAO,MAAMW,WAAa,CACxB,CACEL,MAAOb,wBACPmB,KAAM,6BACR,EACA,CACEN,MAAOf,kCACPqB,KAAM,wCACR,EACA,CACEN,MAAOd,wBACPoB,KAAM,6BACR,EACD,AAAC,AAEF,QAAO,MAAMC,cAAgB,CAC3B,CAAEC,KAAM,UAAWd,KAAM,WAAYe,eAAgB,IAAK,EAC1D,CAAED,KAAM,OAAQd,KAAM,QAASe,eAAgB,IAAK,EACrD,AAAC,AAEF,QAAO,MAAMC,mBAAiC,CAC5C,CACEF,KAAM,WACNX,QACE,oBAACjB,cACC+B,mBAAoB,KACpBC,mBAAmB,OACnBC,gBAAiBtB,aACjBuB,kBAAkB,WAClBC,iBAAkB,oBAAClC,QAAOmC,UAAWlC,UAAWmC,gBAAAA,SAGpD5B,cACF,EACA,CACEmB,KAAM,YACNX,QACE,oBAACjB,cACCsC,UAAWvB,mBACXiB,mBAAoBtB,0BACpBuB,gBAAiBZ,gBAGrBZ,cACF,EACA,CACEmB,KAAM,UACNX,QACE,oBAACjB,cACCsC,UAAWf,iBACXS,mBAAoBtB,0BACpBuB,gBAAiBT,YACjBW,iBACE,oBAACI,OAAIC,UAAU,iCACZf,WAAWgB,KAAK,CAAC,EAAG,GAAGC,GAAG,CAAC,AAACC,OAC3B,oBAACC,OACCC,IAAKF,MAAMjB,IAAI,CACfoB,IAAKH,MAAMvB,KAAK,CAChB2B,IAAKJ,MAAMjB,IAAI,CACfsB,MAAM,KACNC,OAAO,WAOnBxC,cACF,KACGkB,cACJ,AAAC,AAIF,QAAO,MAAMuB,eAAiB,CAC5B,GAAG1C,QAAQ,CACX2C,OAAQ,CAAE,GAAG3C,SAAS2C,MAAM,CAAErC,KAAM,SAAU,EAC9CsC,SAAU,CAAE,GAAG5C,SAAS4C,QAAQ,CAAEtC,KAAM,WAAY,EACpDuC,KAAM,CAAE,GAAG7C,SAAS6C,IAAI,CAAEvC,KAAM,OAAQ,EACxCwC,OAAQ,CAAE,GAAG9C,SAAS8C,MAAM,CAAExC,KAAM,SAAU,EAC9CyC,YAAa,CACX,GAAG/C,SAAS+C,WAAW,CACvBzC,KAAM,eACR,EACA0C,YAAa,CAAE,GAAGhD,SAASgD,WAAW,CAAE1C,KAAM,cAAe,CAC/D,CAAE"}
+{"version":3,"sources":["../../../src/core/Meganav/data.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconName } from \"../Icon/types\";\nimport { CustomerStoryHighlight } from \"./MeganavCustomerStories\";\nimport { BlogPost } from \"./MeganavBlog\";\nimport G2BestMeetsRequirementsSpring2025 from \"../images/badges/g2-best-meets-requirements-spring-2025.svg\";\nimport G2BestResultsSpring2025 from \"../images/badges/g2-best-results-spring-2025.svg\";\nimport G2BestSupportSpring2025 from \"../images/badges/g2-best-support-spring-2025.svg\";\nimport { products } from \"../ProductTile/data\";\nimport DoxyMeLogo from \"../Meganav/images/cust-logo-doxy-light.png\";\nimport DoxyMeLogoDark from \"../Meganav/images/cust-logo-doxy-dark.png\";\n\nexport type FlyoutPanelList = {\n  label: string;\n  icon?: IconName;\n  link: string;\n  isMobile?: boolean;\n  description?: string;\n  badge?: string;\n};\n\nexport type MenuItem = {\n  name: string;\n  link?: string;\n  isHiddenMobile?: boolean;\n  content?: React.ReactNode;\n  panelClassName?: string;\n};\n\nexport const productsMenu: FlyoutPanelList[] = [\n  {\n    label: \"Architecture\",\n    icon: \"icon-gui-squares-2-x-2-outline\",\n    link: \"/platform\",\n  },\n  {\n    label: \"Integrations\",\n    icon: \"icon-gui-puzzle-piece-outline\",\n    link: \"/docs/platform/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\nexport const compareMenu: FlyoutPanelList[] = [\n  {\n    label: \"Ably vs Pusher\",\n    link: \"/compare/ably-vs-pusher\",\n  },\n  {\n    label: \"Ably vs PubNub\",\n    link: \"/compare/ably-vs-pubnub\",\n  },\n  {\n    label: \"Ably vs Socket.io\",\n    link: \"/compare/ably-vs-socketio\",\n  },\n];\n\nexport const solutionsMenu: FlyoutPanelList[] = [\n  {\n    label: \"Fan Engagement\",\n    icon: \"icon-gui-hand-thumb-up-outline\",\n    link: \"/fan-engagement\",\n    description: \"Enhance every moment with live, interactive fan experiences.\",\n  },\n  {\n    label: \"FinTech\",\n    icon: \"icon-gui-currency-dollar-outline\",\n    link: \"/fin-tech\",\n    description:\n      \"Speed, reliability, and confidence in every user interaction.\",\n  },\n  {\n    label: \"EdTech\",\n    icon: \"icon-gui-academic-cap-outline\",\n    link: \"/ed-tech\",\n    description: \"Power collaborative, interactive learning environments.\",\n  },\n  {\n    label: \"CXTech\",\n    icon: \"icon-gui-face-smile-outline\",\n    link: \"/cx-tech\",\n    description:\n      \"Deliver fast support, strong relationships, and high retention.\",\n  },\n\n  {\n    label: \"HealthTech\",\n    icon: \"icon-gui-heartbeat-outline\",\n    link: \"/health-tech\",\n    description: \"Reliable tools with full data privacy and compliance.\",\n  },\n];\n\nexport const customerStoriesHighlight: CustomerStoryHighlight = {\n  companyLogo: DoxyMeLogo,\n  companyLogoDark: DoxyMeLogoDark,\n  companyLink: \"/case-studies/doxyme\",\n  companyName: \"Doxy.me\",\n  companyDesc:\n    \"built their realtime stack in under six months, cutting costs by 65%, eliminating errors, and transforming a once-feared system into a core strength.\",\n};\n\nexport const companyMenu: FlyoutPanelList[] = [\n  {\n    label: \"Our story\",\n    icon: \"icon-gui-ably-badge\",\n    link: \"/case-studies\",\n  },\n  {\n    label: \"Careers\",\n    icon: \"icon-gui-briefcase-outline\",\n    link: \"/careers\",\n    badge: \"WE'RE HIRING\",\n  },\n];\n\nexport const ablyAwards = [\n  {\n    image: G2BestSupportSpring2025,\n    desc: \"G2 Best Support Spring 2025\",\n  },\n  {\n    image: G2BestMeetsRequirementsSpring2025,\n    desc: \"G2 Best Meets Requirements Spring 2025\",\n  },\n  {\n    image: G2BestResultsSpring2025,\n    desc: \"G2 Best Results Spring 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 defaultBlogPosts: BlogPost[] = [\n  {\n    title:\n      \"Ably AI Transport: keep your agents connected and stateful across devices\",\n    link: \"/blog/ably-ai-transport\",\n    categories: [\"New Release\", \"AI Transport\"],\n    pubDate: \"Dec 9, 2025\",\n  },\n  {\n    title:\n      \"Live chat at unlimited scale: What it takes to support stadium-sized audiences\",\n    link: \"/blog/live-chat-at-unlimited-scale\",\n    categories: [\"Chat\"],\n    pubDate: \"Nov 18, 2025\",\n  },\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  aiTransport: {\n    ...products.aiTransport,\n    link: \"/ai-transport\",\n  },\n  liveObjects: { ...products.liveObjects, link: \"/liveobjects\" },\n};\n"],"names":["React","G2BestMeetsRequirementsSpring2025","G2BestResultsSpring2025","G2BestSupportSpring2025","products","DoxyMeLogo","DoxyMeLogoDark","productsMenu","label","icon","link","compareMenu","solutionsMenu","description","customerStoriesHighlight","companyLogo","companyLogoDark","companyLink","companyName","companyDesc","companyMenu","badge","ablyAwards","image","desc","menuItemLinks","name","isHiddenMobile","defaultBlogPosts","title","categories","pubDate","productsForNav","pubsub","liveSync","chat","spaces","aiTransport","liveObjects"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAI1B,QAAOC,sCAAuC,6DAA8D,AAC5G,QAAOC,4BAA6B,kDAAmD,AACvF,QAAOC,4BAA6B,kDAAmD,AACvF,QAASC,QAAQ,KAAQ,qBAAsB,AAC/C,QAAOC,eAAgB,4CAA6C,AACpE,QAAOC,mBAAoB,2CAA4C,AAmBvE,QAAO,MAAMC,aAAkC,CAC7C,CACEC,MAAO,eACPC,KAAM,iCACNC,KAAM,WACR,EACA,CACEF,MAAO,eACPC,KAAM,gCACNC,KAAM,6BACR,EACA,CACEF,MAAO,OACPC,KAAM,oCACNC,KAAM,YACR,EACA,CACEF,MAAO,wBACPC,KAAM,gCACNC,KAAM,0BACR,EACD,AAAC,AAEF,QAAO,MAAMC,YAAiC,CAC5C,CACEH,MAAO,iBACPE,KAAM,yBACR,EACA,CACEF,MAAO,iBACPE,KAAM,yBACR,EACA,CACEF,MAAO,oBACPE,KAAM,2BACR,EACD,AAAC,AAEF,QAAO,MAAME,cAAmC,CAC9C,CACEJ,MAAO,iBACPC,KAAM,iCACNC,KAAM,kBACNG,YAAa,8DACf,EACA,CACEL,MAAO,UACPC,KAAM,mCACNC,KAAM,YACNG,YACE,+DACJ,EACA,CACEL,MAAO,SACPC,KAAM,gCACNC,KAAM,WACNG,YAAa,yDACf,EACA,CACEL,MAAO,SACPC,KAAM,8BACNC,KAAM,WACNG,YACE,iEACJ,EAEA,CACEL,MAAO,aACPC,KAAM,6BACNC,KAAM,eACNG,YAAa,uDACf,EACD,AAAC,AAEF,QAAO,MAAMC,yBAAmD,CAC9DC,YAAaV,WACbW,gBAAiBV,eACjBW,YAAa,uBACbC,YAAa,UACbC,YACE,uJACJ,CAAE,AAEF,QAAO,MAAMC,YAAiC,CAC5C,CACEZ,MAAO,YACPC,KAAM,sBACNC,KAAM,eACR,EACA,CACEF,MAAO,UACPC,KAAM,6BACNC,KAAM,WACNW,MAAO,cACT,EACD,AAAC,AAEF,QAAO,MAAMC,WAAa,CACxB,CACEC,MAAOpB,wBACPqB,KAAM,6BACR,EACA,CACED,MAAOtB,kCACPuB,KAAM,wCACR,EACA,CACED,MAAOrB,wBACPsB,KAAM,6BACR,EACD,AAAC,AAEF,QAAO,MAAMC,cAAgB,CAC3B,CAAEC,KAAM,UAAWhB,KAAM,WAAYiB,eAAgB,IAAK,EAC1D,CAAED,KAAM,OAAQhB,KAAM,QAASiB,eAAgB,IAAK,EACrD,AAAC,AAEF,QAAO,MAAMC,iBAA+B,CAC1C,CACEC,MACE,4EACFnB,KAAM,0BACNoB,WAAY,CAAC,cAAe,eAAe,CAC3CC,QAAS,aACX,EACA,CACEF,MACE,iFACFnB,KAAM,qCACNoB,WAAY,CAAC,OAAO,CACpBC,QAAS,cACX,EACD,AAAC,AAEF,QAAO,MAAMC,eAAiB,CAC5B,GAAG5B,QAAQ,CACX6B,OAAQ,CAAE,GAAG7B,SAAS6B,MAAM,CAAEvB,KAAM,SAAU,EAC9CwB,SAAU,CAAE,GAAG9B,SAAS8B,QAAQ,CAAExB,KAAM,WAAY,EACpDyB,KAAM,CAAE,GAAG/B,SAAS+B,IAAI,CAAEzB,KAAM,OAAQ,EACxC0B,OAAQ,CAAE,GAAGhC,SAASgC,MAAM,CAAE1B,KAAM,SAAU,EAC9C2B,YAAa,CACX,GAAGjC,SAASiC,WAAW,CACvB3B,KAAM,eACR,EACA4B,YAAa,CAAE,GAAGlC,SAASkC,WAAW,CAAE5B,KAAM,cAAe,CAC/D,CAAE"}

package/core/Meganav/utils/getMenuItemsForHeader.js

@@ -0,0 +1,2 @@
+import React from"react";import Status,{StatusUrl}from"../../Status";import MeganavBlog from"../MeganavBlog";import MeganavCustomerStories from"../MeganavCustomerStories";import{MeganavPanel,MeganavPanelFullwidth}from"../MeganavPanel";import{ablyAwards,companyMenu,compareMenu,customerStoriesHighlight,productsMenu,solutionsMenu,menuItemLinks,defaultBlogPosts}from"../data";export const getMenuItemsForHeader=blogPosts=>{const panelClassName="w-full sm:w-[50.9375rem]";const recentBlogPosts=blogPosts?.length>0?blogPosts.slice(0,2):defaultBlogPosts;return[{name:"Products",content:React.createElement(MeganavPanel,{displayProductTile:true,panelRightItems:[{label:"Platform",listItems:productsMenu},{link:{label:"Compare our tech",link:"/compare"},listItems:compareMenu}],panelRightBottom:React.createElement(Status,{statusUrl:StatusUrl,additionalCSS:"px-3 py-2 hover:bg-neutral-100 dark:hover:bg-neutral-1200 active:bg-neutral-200 dark:active:bg-neutral-1100 rounded-lg",showDescription:true})}),panelClassName},{name:"Solutions",content:React.createElement(MeganavPanelFullwidth,{panelItems:solutionsMenu}),panelClassName},{name:"Company",content:React.createElement(MeganavPanel,{panelLeft:React.createElement(MeganavCustomerStories,{title:"Customer stories",link:"/case-studies",icon:"icon-gui-rocket-launch-outline",customerStoriesHighlight:customerStoriesHighlight}),panelMiddleItems:React.createElement(MeganavBlog,{title:"Blog",link:"/blog",posts:recentBlogPosts,icon:"icon-gui-light-bulb-outline"}),panelRightItems:[{label:"Ably",listItems:companyMenu,displayTitleInMobile:false}],panelRightBottom:React.createElement("div",{className:"flex-1 gap-x-2 hidden md:flex p-3"},ablyAwards.slice(0,3).map(award=>React.createElement("img",{key:award.desc,src:award.image,alt:award.desc,width:"57",height:"64",loading:"lazy"}))),panelRightBottomClassName:"hidden md:flex"}),panelClassName},...menuItemLinks]};
+//# sourceMappingURL=getMenuItemsForHeader.js.map

package/core/Meganav/utils/getMenuItemsForHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/core/Meganav/utils/getMenuItemsForHeader.tsx"],"sourcesContent":["import React from \"react\";\nimport Status, { StatusUrl } from \"../../Status\";\nimport MeganavBlog, { BlogPost } from \"../MeganavBlog\";\nimport MeganavCustomerStories from \"../MeganavCustomerStories\";\nimport { MeganavPanel, MeganavPanelFullwidth } from \"../MeganavPanel\";\nimport {\n  ablyAwards,\n  companyMenu,\n  compareMenu,\n  customerStoriesHighlight,\n  MenuItem,\n  productsMenu,\n  solutionsMenu,\n  menuItemLinks,\n  defaultBlogPosts,\n} from \"../data\";\n\nexport const getMenuItemsForHeader = (blogPosts: BlogPost[]): MenuItem[] => {\n  const panelClassName = \"w-full sm:w-[50.9375rem]\";\n  const recentBlogPosts =\n    blogPosts?.length > 0 ? blogPosts.slice(0, 2) : defaultBlogPosts;\n\n  return [\n    {\n      name: \"Products\",\n      content: (\n        <MeganavPanel\n          displayProductTile={true}\n          panelRightItems={[\n            { label: \"Platform\", listItems: productsMenu },\n            {\n              link: { label: \"Compare our tech\", link: \"/compare\" },\n              listItems: compareMenu,\n            },\n          ]}\n          panelRightBottom={\n            <Status\n              statusUrl={StatusUrl}\n              additionalCSS=\"px-3 py-2 hover:bg-neutral-100 dark:hover:bg-neutral-1200 active:bg-neutral-200 dark:active:bg-neutral-1100 rounded-lg\"\n              showDescription\n            />\n          }\n        />\n      ),\n      panelClassName,\n    },\n    {\n      name: \"Solutions\",\n      content: <MeganavPanelFullwidth panelItems={solutionsMenu} />,\n      panelClassName,\n    },\n    {\n      name: \"Company\",\n      content: (\n        <MeganavPanel\n          panelLeft={\n            <MeganavCustomerStories\n              title=\"Customer stories\"\n              link=\"/case-studies\"\n              icon=\"icon-gui-rocket-launch-outline\"\n              customerStoriesHighlight={customerStoriesHighlight}\n            />\n          }\n          panelMiddleItems={\n            <MeganavBlog\n              title=\"Blog\"\n              link=\"/blog\"\n              posts={recentBlogPosts}\n              icon=\"icon-gui-light-bulb-outline\"\n            />\n          }\n          panelRightItems={[\n            {\n              label: \"Ably\",\n              listItems: companyMenu,\n              displayTitleInMobile: false,\n            },\n          ]}\n          panelRightBottom={\n            <div className=\"flex-1 gap-x-2 hidden md:flex p-3\">\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                  loading=\"lazy\"\n                />\n              ))}\n            </div>\n          }\n          panelRightBottomClassName=\"hidden md:flex\"\n        />\n      ),\n      panelClassName,\n    },\n    ...menuItemLinks,\n  ];\n};\n"],"names":["React","Status","StatusUrl","MeganavBlog","MeganavCustomerStories","MeganavPanel","MeganavPanelFullwidth","ablyAwards","companyMenu","compareMenu","customerStoriesHighlight","productsMenu","solutionsMenu","menuItemLinks","defaultBlogPosts","getMenuItemsForHeader","blogPosts","panelClassName","recentBlogPosts","length","slice","name","content","displayProductTile","panelRightItems","label","listItems","link","panelRightBottom","statusUrl","additionalCSS","showDescription","panelItems","panelLeft","title","icon","panelMiddleItems","posts","displayTitleInMobile","div","className","map","award","img","key","desc","src","image","alt","width","height","loading","panelRightBottomClassName"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,QAAUC,SAAS,KAAQ,cAAe,AACjD,QAAOC,gBAA+B,gBAAiB,AACvD,QAAOC,2BAA4B,2BAA4B,AAC/D,QAASC,YAAY,CAAEC,qBAAqB,KAAQ,iBAAkB,AACtE,QACEC,UAAU,CACVC,WAAW,CACXC,WAAW,CACXC,wBAAwB,CAExBC,YAAY,CACZC,aAAa,CACbC,aAAa,CACbC,gBAAgB,KACX,SAAU,AAEjB,QAAO,MAAMC,sBAAwB,AAACC,YACpC,MAAMC,eAAiB,2BACvB,MAAMC,gBACJF,WAAWG,OAAS,EAAIH,UAAUI,KAAK,CAAC,EAAG,GAAKN,iBAElD,MAAO,CACL,CACEO,KAAM,WACNC,QACE,oBAACjB,cACCkB,mBAAoB,KACpBC,gBAAiB,CACf,CAAEC,MAAO,WAAYC,UAAWf,YAAa,EAC7C,CACEgB,KAAM,CAAEF,MAAO,mBAAoBE,KAAM,UAAW,EACpDD,UAAWjB,WACb,EACD,CACDmB,iBACE,oBAAC3B,QACC4B,UAAW3B,UACX4B,cAAc,yHACdC,gBAAAA,SAKRd,cACF,EACA,CACEI,KAAM,YACNC,QAAS,oBAAChB,uBAAsB0B,WAAYpB,gBAC5CK,cACF,EACA,CACEI,KAAM,UACNC,QACE,oBAACjB,cACC4B,UACE,oBAAC7B,wBACC8B,MAAM,mBACNP,KAAK,gBACLQ,KAAK,iCACLzB,yBAA0BA,2BAG9B0B,iBACE,oBAACjC,aACC+B,MAAM,OACNP,KAAK,QACLU,MAAOnB,gBACPiB,KAAK,gCAGTX,gBAAiB,CACf,CACEC,MAAO,OACPC,UAAWlB,YACX8B,qBAAsB,KACxB,EACD,CACDV,iBACE,oBAACW,OAAIC,UAAU,qCACZjC,WAAWa,KAAK,CAAC,EAAG,GAAGqB,GAAG,CAAC,AAACC,OAC3B,oBAACC,OACCC,IAAKF,MAAMG,IAAI,CACfC,IAAKJ,MAAMK,KAAK,CAChBC,IAAKN,MAAMG,IAAI,CACfI,MAAM,KACNC,OAAO,KACPC,QAAQ,WAKhBC,0BAA0B,mBAG9BnC,cACF,KACGJ,cACJ,AACH,CAAE"}

package/core/Meganav.js

@@ -1,2 +1,2 @@
-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,themedScrollpoints,onNoticeClose})=>{const[noticeHeight,setNoticeHeight]=React.useState(0);const finalNoticeHeight=notice?noticeHeight:0;const mobileNavItems=useMemo(()=>menuItemsForHeader.filter(item=>!item.isHiddenMobile).map(({name,link,content})=>({name,link,content})),[]);const defaultThemedScrollpoints=[{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"}];useEffect(()=>{if(!notice){if(noticeHeight!==0){setNoticeHeight(0)}return}const noticeElement=document.querySelector('[data-id="ui-notice"]');if(!noticeElement)return;const updateNoticeHeight=()=>{setNoticeHeight(noticeElement.getBoundingClientRect().height)};const observer=new ResizeObserver(updateNoticeHeight);observer.observe(noticeElement);const timeoutId=setTimeout(updateNoticeHeight,0);window.addEventListener("resize",updateNoticeHeight);return()=>{clearTimeout(timeoutId);observer.disconnect();window.removeEventListener("resize",updateNoticeHeight)}},[notice]);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+finalNoticeHeight}},notice&&React.createElement(Notice,{...notice.props,config:notice.config,onClose:onNoticeClose}),React.createElement(Header,{className:"max-w-screen-xl mx-auto px-0 sm:px-8 md:px-10 lg:px-16",isNoticeBannerEnabled:!!notice,noticeHeight:finalNoticeHeight,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-1 bg-neutral-000 dark:bg-neutral-1300"}),mobileNav:React.createElement(MeganavMobile,{navItems:mobileNavItems}),headerLinks:[{href:"/contact",label:"Contact us"}],headerLinksClassName:"md:gap-x-6 ",sessionState:sessionState,themedScrollpoints:themedScrollpoints??defaultThemedScrollpoints})))};export default Meganav;
+import React,{useEffect,useMemo}from"react";import Header from"./Header";import Flyout from"./Flyout";import{MeganavMobile}from"./Meganav/MeganavMobile";import Notice from"./Notice";import{HEADER_HEIGHT}from"./utils/heights";import{getMenuItemsForHeader}from"./Meganav/utils/getMenuItemsForHeader";const Meganav=({sessionState,notice,theme,themedScrollpoints,onNoticeClose,blogPosts})=>{const[noticeHeight,setNoticeHeight]=React.useState(0);const finalNoticeHeight=notice?noticeHeight:0;const headerMenuItems=useMemo(()=>getMenuItemsForHeader(blogPosts),[blogPosts]);const mobileNavItems=useMemo(()=>headerMenuItems.filter(item=>!item.isHiddenMobile).map(({name,link,content})=>({name,link,content})),[headerMenuItems]);const defaultThemedScrollpoints=[{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"}];useEffect(()=>{if(!notice){if(noticeHeight!==0){setNoticeHeight(0)}return}const noticeElement=document.querySelector('[data-id="ui-notice"]');if(!noticeElement)return;const updateNoticeHeight=()=>{setNoticeHeight(noticeElement.getBoundingClientRect().height)};const observer=new ResizeObserver(updateNoticeHeight);observer.observe(noticeElement);const timeoutId=setTimeout(updateNoticeHeight,0);window.addEventListener("resize",updateNoticeHeight);return()=>{clearTimeout(timeoutId);observer.disconnect();window.removeEventListener("resize",updateNoticeHeight)}},[notice]);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+finalNoticeHeight}},notice&&React.createElement(Notice,{...notice.props,config:notice.config,onClose:onNoticeClose}),React.createElement(Header,{className:"max-w-screen-xl mx-auto",isNoticeBannerEnabled:!!notice,noticeHeight:finalNoticeHeight,nav:React.createElement(Flyout,{menuItems:headerMenuItems,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-1 bg-neutral-000 dark:bg-neutral-1300"}),mobileNav:React.createElement(MeganavMobile,{navItems:mobileNavItems}),headerLinks:[{href:"/contact",label:"Contact us"}],headerLinksClassName:"md:gap-x-6 ",sessionState:sessionState,themedScrollpoints:themedScrollpoints??defaultThemedScrollpoints})))};export default Meganav;
 //# sourceMappingURL=Meganav.js.map

package/core/Meganav.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/core/Meganav.tsx"],"sourcesContent":["import React, { useEffect, useMemo } from \"react\";\nimport Header, { HeaderSessionState, ThemedScrollpoint } 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  themedScrollpoints?: ThemedScrollpoint[];\n  onNoticeClose?: () => void;\n};\n\nconst Meganav = ({\n  sessionState,\n  notice,\n  theme,\n  themedScrollpoints,\n  onNoticeClose,\n}: MeganavProps) => {\n  const [noticeHeight, setNoticeHeight] = React.useState(0);\n\n  const finalNoticeHeight = notice ? noticeHeight : 0;\n\n  const mobileNavItems = useMemo(\n    () =>\n      menuItemsForHeader\n        .filter((item) => !item.isHiddenMobile)\n        .map(({ name, link, content }) => ({ name, link, content })),\n    [],\n  );\n\n  const defaultThemedScrollpoints = [\n    {\n      id: \"meganav\",\n      className: \"ui-theme-light !bg-transparent !border-none\",\n    },\n    {\n      id: \"meganav-theme-dark\",\n      className: \"ui-theme-dark !bg-transparent !border-none\",\n    },\n    {\n      id: \"main\",\n      className: \"ui-theme-light bg-neutral-000 dark:bg-neutral-1300 border-b\",\n    },\n    {\n      id: \"main-theme-dark\",\n      className: \"ui-theme-dark bg-neutral-000 dark:bg-neutral-1300 border-b\",\n    },\n  ];\n\n  useEffect(() => {\n    if (!notice) {\n      if (noticeHeight !== 0) {\n        setNoticeHeight(0);\n      }\n      return;\n    }\n\n    const noticeElement = document.querySelector('[data-id=\"ui-notice\"]');\n    if (!noticeElement) return;\n\n    const updateNoticeHeight = () => {\n      setNoticeHeight(noticeElement.getBoundingClientRect().height);\n    };\n\n    const observer = new ResizeObserver(updateNoticeHeight);\n    observer.observe(noticeElement);\n\n    const timeoutId = setTimeout(updateNoticeHeight, 0);\n    window.addEventListener(\"resize\", updateNoticeHeight);\n\n    return () => {\n      clearTimeout(timeoutId);\n      observer.disconnect();\n      window.removeEventListener(\"resize\", updateNoticeHeight);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [notice]);\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 + finalNoticeHeight }}\n      >\n        {notice && (\n          <Notice\n            {...notice.props}\n            config={notice.config}\n            onClose={onNoticeClose}\n          />\n        )}\n        <Header\n          className=\"max-w-screen-xl mx-auto px-0 sm:px-8 md:px-10 lg:px-16\"\n          isNoticeBannerEnabled={!!notice}\n          noticeHeight={finalNoticeHeight}\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-1 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-6 \"\n          sessionState={sessionState}\n          themedScrollpoints={themedScrollpoints ?? defaultThemedScrollpoints}\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","themedScrollpoints","onNoticeClose","noticeHeight","setNoticeHeight","useState","finalNoticeHeight","mobileNavItems","filter","item","isHiddenMobile","map","name","link","content","defaultThemedScrollpoints","id","className","noticeElement","document","querySelector","updateNoticeHeight","getBoundingClientRect","height","observer","ResizeObserver","observe","timeoutId","setTimeout","window","addEventListener","clearTimeout","disconnect","removeEventListener","div","data-testid","style","props","config","onClose","isNoticeBannerEnabled","nav","menuItems","flyOutClassName","viewPortClassName","mobileNav","navItems","headerLinks","href","label","headerLinksClassName"],"mappings":"AAAA,OAAOA,OAASC,SAAS,CAAEC,OAAO,KAAQ,OAAQ,AAClD,QAAOC,WAAuD,UAAW,AACzE,QAAOC,WAAY,UAAW,AAC9B,QAASC,kBAAkB,KAAQ,gBAAiB,AACpD,QAASC,aAAa,KAAQ,yBAA0B,AACxD,QAAOC,WAAY,UAAW,AAC9B,QAASC,aAAa,KAAQ,iBAAkB,CA2BhD,MAAMC,QAAU,CAAC,CACfC,YAAY,CACZC,MAAM,CACNC,KAAK,CACLC,kBAAkB,CAClBC,aAAa,CACA,IACb,KAAM,CAACC,aAAcC,gBAAgB,CAAGhB,MAAMiB,QAAQ,CAAC,GAEvD,MAAMC,kBAAoBP,OAASI,aAAe,EAElD,MAAMI,eAAiBjB,QACrB,IACEG,mBACGe,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,EAGJ,MAAMC,0BAA4B,CAChC,CACEC,GAAI,UACJC,UAAW,6CACb,EACA,CACED,GAAI,qBACJC,UAAW,4CACb,EACA,CACED,GAAI,OACJC,UAAW,6DACb,EACA,CACED,GAAI,kBACJC,UAAW,4DACb,EACD,CAED5B,UAAU,KACR,GAAI,CAACU,OAAQ,CACX,GAAII,eAAiB,EAAG,CACtBC,gBAAgB,EAClB,CACA,MACF,CAEA,MAAMc,cAAgBC,SAASC,aAAa,CAAC,yBAC7C,GAAI,CAACF,cAAe,OAEpB,MAAMG,mBAAqB,KACzBjB,gBAAgBc,cAAcI,qBAAqB,GAAGC,MAAM,CAC9D,EAEA,MAAMC,SAAW,IAAIC,eAAeJ,oBACpCG,SAASE,OAAO,CAACR,eAEjB,MAAMS,UAAYC,WAAWP,mBAAoB,GACjDQ,OAAOC,gBAAgB,CAAC,SAAUT,oBAElC,MAAO,KACLU,aAAaJ,WACbH,SAASQ,UAAU,GACnBH,OAAOI,mBAAmB,CAAC,SAAUZ,mBACvC,CAEF,EAAG,CAACtB,OAAO,EAEX,OACE,wCACE,oBAACmC,OACCjB,UAAU,+BACVD,GAAIhB,QAAU,OAAS,qBAAuB,UAC9CmC,cAAY,UACZC,MAAO,CAAEb,OAAQ3B,cAAgBU,iBAAkB,GAElDP,QACC,oBAACJ,QACE,GAAGI,OAAOsC,KAAK,CAChBC,OAAQvC,OAAOuC,MAAM,CACrBC,QAASrC,gBAGb,oBAACX,QACC0B,UAAU,yDACVuB,sBAAuB,CAAC,CAACzC,OACzBI,aAAcG,kBACdmC,IACE,oBAACjD,QACCkD,UAAWjD,mBACXwB,UAAU,oBACV0B,gBAAgB,oBAChBC,kBAAkB,iIAGtBC,UAAW,oBAACnD,eAAcoD,SAAUvC,iBACpCwC,YAAa,CAAC,CAAEC,KAAM,WAAYC,MAAO,YAAa,EAAE,CACxDC,qBAAqB,cACrBpD,aAAcA,aACdG,mBAAoBA,oBAAsBc,6BAKpD,CAEA,gBAAelB,OAAQ"}
+{"version":3,"sources":["../../src/core/Meganav.tsx"],"sourcesContent":["import React, { useEffect, useMemo } from \"react\";\nimport Header, { HeaderSessionState, ThemedScrollpoint } from \"./Header\";\nimport Flyout from \"./Flyout\";\nimport { MeganavMobile } from \"./Meganav/MeganavMobile\";\nimport Notice from \"./Notice\";\nimport { HEADER_HEIGHT } from \"./utils/heights\";\nimport { BlogPost } from \"./Meganav/MeganavBlog\";\nimport { getMenuItemsForHeader } from \"./Meganav/utils/getMenuItemsForHeader\";\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  blogPosts: BlogPost[];\n  notice?: MeganavNoticeBannerProps;\n  theme?: string;\n  themedScrollpoints?: ThemedScrollpoint[];\n  onNoticeClose?: () => void;\n};\n\nconst Meganav = ({\n  sessionState,\n  notice,\n  theme,\n  themedScrollpoints,\n  onNoticeClose,\n  blogPosts,\n}: MeganavProps) => {\n  const [noticeHeight, setNoticeHeight] = React.useState(0);\n\n  const finalNoticeHeight = notice ? noticeHeight : 0;\n\n  const headerMenuItems = useMemo(\n    () => getMenuItemsForHeader(blogPosts),\n    [blogPosts],\n  );\n\n  const mobileNavItems = useMemo(\n    () =>\n      headerMenuItems\n        .filter((item) => !item.isHiddenMobile)\n        .map(({ name, link, content }) => ({ name, link, content })),\n    [headerMenuItems],\n  );\n\n  const defaultThemedScrollpoints = [\n    {\n      id: \"meganav\",\n      className: \"ui-theme-light !bg-transparent !border-none\",\n    },\n    {\n      id: \"meganav-theme-dark\",\n      className: \"ui-theme-dark !bg-transparent !border-none\",\n    },\n    {\n      id: \"main\",\n      className: \"ui-theme-light bg-neutral-000 dark:bg-neutral-1300 border-b\",\n    },\n    {\n      id: \"main-theme-dark\",\n      className: \"ui-theme-dark bg-neutral-000 dark:bg-neutral-1300 border-b\",\n    },\n  ];\n\n  useEffect(() => {\n    if (!notice) {\n      if (noticeHeight !== 0) {\n        setNoticeHeight(0);\n      }\n      return;\n    }\n\n    const noticeElement = document.querySelector('[data-id=\"ui-notice\"]');\n    if (!noticeElement) return;\n\n    const updateNoticeHeight = () => {\n      setNoticeHeight(noticeElement.getBoundingClientRect().height);\n    };\n\n    const observer = new ResizeObserver(updateNoticeHeight);\n    observer.observe(noticeElement);\n\n    const timeoutId = setTimeout(updateNoticeHeight, 0);\n    window.addEventListener(\"resize\", updateNoticeHeight);\n\n    return () => {\n      clearTimeout(timeoutId);\n      observer.disconnect();\n      window.removeEventListener(\"resize\", updateNoticeHeight);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [notice]);\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 + finalNoticeHeight }}\n      >\n        {notice && (\n          <Notice\n            {...notice.props}\n            config={notice.config}\n            onClose={onNoticeClose}\n          />\n        )}\n        <Header\n          className=\"max-w-screen-xl mx-auto\"\n          isNoticeBannerEnabled={!!notice}\n          noticeHeight={finalNoticeHeight}\n          nav={\n            <Flyout\n              menuItems={headerMenuItems}\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-1 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-6 \"\n          sessionState={sessionState}\n          themedScrollpoints={themedScrollpoints ?? defaultThemedScrollpoints}\n        />\n      </div>\n    </>\n  );\n};\n\nexport default Meganav;\n"],"names":["React","useEffect","useMemo","Header","Flyout","MeganavMobile","Notice","HEADER_HEIGHT","getMenuItemsForHeader","Meganav","sessionState","notice","theme","themedScrollpoints","onNoticeClose","blogPosts","noticeHeight","setNoticeHeight","useState","finalNoticeHeight","headerMenuItems","mobileNavItems","filter","item","isHiddenMobile","map","name","link","content","defaultThemedScrollpoints","id","className","noticeElement","document","querySelector","updateNoticeHeight","getBoundingClientRect","height","observer","ResizeObserver","observe","timeoutId","setTimeout","window","addEventListener","clearTimeout","disconnect","removeEventListener","div","data-testid","style","props","config","onClose","isNoticeBannerEnabled","nav","menuItems","flyOutClassName","viewPortClassName","mobileNav","navItems","headerLinks","href","label","headerLinksClassName"],"mappings":"AAAA,OAAOA,OAASC,SAAS,CAAEC,OAAO,KAAQ,OAAQ,AAClD,QAAOC,WAAuD,UAAW,AACzE,QAAOC,WAAY,UAAW,AAC9B,QAASC,aAAa,KAAQ,yBAA0B,AACxD,QAAOC,WAAY,UAAW,AAC9B,QAASC,aAAa,KAAQ,iBAAkB,AAEhD,QAASC,qBAAqB,KAAQ,uCAAwC,CA4B9E,MAAMC,QAAU,CAAC,CACfC,YAAY,CACZC,MAAM,CACNC,KAAK,CACLC,kBAAkB,CAClBC,aAAa,CACbC,SAAS,CACI,IACb,KAAM,CAACC,aAAcC,gBAAgB,CAAGjB,MAAMkB,QAAQ,CAAC,GAEvD,MAAMC,kBAAoBR,OAASK,aAAe,EAElD,MAAMI,gBAAkBlB,QACtB,IAAMM,sBAAsBO,WAC5B,CAACA,UAAU,EAGb,MAAMM,eAAiBnB,QACrB,IACEkB,gBACGE,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,CAACR,gBAAgB,EAGnB,MAAMS,0BAA4B,CAChC,CACEC,GAAI,UACJC,UAAW,6CACb,EACA,CACED,GAAI,qBACJC,UAAW,4CACb,EACA,CACED,GAAI,OACJC,UAAW,6DACb,EACA,CACED,GAAI,kBACJC,UAAW,4DACb,EACD,CAED9B,UAAU,KACR,GAAI,CAACU,OAAQ,CACX,GAAIK,eAAiB,EAAG,CACtBC,gBAAgB,EAClB,CACA,MACF,CAEA,MAAMe,cAAgBC,SAASC,aAAa,CAAC,yBAC7C,GAAI,CAACF,cAAe,OAEpB,MAAMG,mBAAqB,KACzBlB,gBAAgBe,cAAcI,qBAAqB,GAAGC,MAAM,CAC9D,EAEA,MAAMC,SAAW,IAAIC,eAAeJ,oBACpCG,SAASE,OAAO,CAACR,eAEjB,MAAMS,UAAYC,WAAWP,mBAAoB,GACjDQ,OAAOC,gBAAgB,CAAC,SAAUT,oBAElC,MAAO,KACLU,aAAaJ,WACbH,SAASQ,UAAU,GACnBH,OAAOI,mBAAmB,CAAC,SAAUZ,mBACvC,CAEF,EAAG,CAACxB,OAAO,EAEX,OACE,wCACE,oBAACqC,OACCjB,UAAU,+BACVD,GAAIlB,QAAU,OAAS,qBAAuB,UAC9CqC,cAAY,UACZC,MAAO,CAAEb,OAAQ9B,cAAgBY,iBAAkB,GAElDR,QACC,oBAACL,QACE,GAAGK,OAAOwC,KAAK,CAChBC,OAAQzC,OAAOyC,MAAM,CACrBC,QAASvC,gBAGb,oBAACX,QACC4B,UAAU,0BACVuB,sBAAuB,CAAC,CAAC3C,OACzBK,aAAcG,kBACdoC,IACE,oBAACnD,QACCoD,UAAWpC,gBACXW,UAAU,oBACV0B,gBAAgB,oBAChBC,kBAAkB,iIAGtBC,UAAW,oBAACtD,eAAcuD,SAAUvC,iBACpCwC,YAAa,CAAC,CAAEC,KAAM,WAAYC,MAAO,YAAa,EAAE,CACxDC,qBAAqB,cACrBtD,aAAcA,aACdG,mBAAoBA,oBAAsBgB,6BAKpD,CAEA,gBAAepB,OAAQ"}

package/core/ProductTile/ProductIcon.js

@@ -1,2 +1,2 @@
-import React from"react";import Icon from"../Icon";import cn from"../utils/cn";const ProductIcon=({name,hoverName,selected,size,unavailable})=>{if(!name){return null}const innerSize=size-2;const iconSize=size/6*4;return React.createElement("span",{className:cn("block p-px bg-gradient-to-b",{"from-neutral-1000 to-neutral-1300 dark:from-neutral-000 dark:to-neutral-300":selected,"from-neutral-000 to-neutral-300 dark:from-neutral-1000 dark:to-neutral-1300":!selected}),style:{width:size,height:size,borderRadius:size/4}},React.createElement("span",{className:cn("flex items-center justify-center",{"bg-neutral-1200 dark:bg-neutral-100":selected,"bg-neutral-100 dark:bg-neutral-1200":!selected,"group-hover/product-tile:bg-neutral-000 dark:group-hover/product-tile:bg-neutral-1300":selected===false&&!unavailable}),style:{height:innerSize,borderRadius:size/4}},hoverName?React.createElement(Icon,{name:hoverName,size:`${iconSize}px`,additionalCSS:cn({"hidden group-hover/product-tile:flex":!selected,flex:selected})}):null,React.createElement(Icon,{name:name,size:`${iconSize}px`,additionalCSS:cn({"text-neutral-000 dark:text-neutral-1300":selected&&!unavailable,"text-neutral-1300 dark:text-neutral-000":!selected&&!unavailable,"text-neutral-700 dark:text-neutral-600":selected&&unavailable,"text-neutral-600 dark:text-neutral-700":!selected&&unavailable,"flex group-hover/product-tile:hidden":hoverName&&!selected,hidden:hoverName&&selected})})))};export default ProductIcon;
+import React from"react";import Icon from"../Icon";import cn from"../utils/cn";const ProductIcon=({name,hoverName,selected,size,unavailable})=>{if(!name){return null}const iconSize=size/6*4;return React.createElement("span",{className:"flex items-center justify-center border border-neutral-300 dark:border-neutral-1000 rounded-xl bg-neutral-100 dark:bg-neutral-1200 hover:bg-neutral-000 dark:hover:bg-neutral-1300 active:bg-neutral-000 dark:active:bg-neutral-1300",style:{width:size,height:size}},hoverName?React.createElement(Icon,{name:hoverName,size:`${iconSize}px`,additionalCSS:cn({"hidden group-hover/product-tile:flex":!selected,flex:selected})}):null,React.createElement(Icon,{name:name,size:`${iconSize}px`,additionalCSS:cn({"text-neutral-000 dark:text-neutral-1300":selected&&!unavailable,"text-neutral-1300 dark:text-neutral-000":!selected&&!unavailable,"text-neutral-700 dark:text-neutral-600":selected&&unavailable,"text-neutral-600 dark:text-neutral-700":!selected&&unavailable,"flex group-hover/product-tile:hidden":hoverName&&!selected,hidden:hoverName&&selected})}))};export default ProductIcon;
 //# sourceMappingURL=ProductIcon.js.map

package/core/ProductTile/ProductIcon.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/core/ProductTile/ProductIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport Icon from \"../Icon\";\nimport { IconName } from \"../Icon/types\";\nimport cn from \"../utils/cn\";\n\ntype ProductIconProps = {\n  name?: IconName;\n  hoverName?: IconName;\n  selected?: boolean;\n  size: number;\n  unavailable: boolean;\n};\n\nconst ProductIcon = ({\n  name,\n  hoverName,\n  selected,\n  size,\n  unavailable,\n}: ProductIconProps) => {\n  if (!name) {\n    return null;\n  }\n\n  // Inner container is 2px smaller to account for 1px padding on each side\n  const innerSize = size - 2;\n\n  // Padding around the icon is 1/4 the icon's size, so the icon is 4 of 6 parts\n  const iconSize = (size / 6) * 4;\n\n  return (\n    // Outer container, contains the gradient stroke (since we can't natively have CSS gradient strokes)\n    <span\n      className={cn(\"block p-px bg-gradient-to-b\", {\n        \"from-neutral-1000 to-neutral-1300 dark:from-neutral-000 dark:to-neutral-300\":\n          selected,\n        \"from-neutral-000 to-neutral-300 dark:from-neutral-1000 dark:to-neutral-1300\":\n          !selected,\n      })}\n      style={{ width: size, height: size, borderRadius: size / 4 }}\n    >\n      {/* Inner container, contains the foreground container element */}\n      <span\n        className={cn(\"flex items-center justify-center\", {\n          \"bg-neutral-1200 dark:bg-neutral-100\": selected,\n          \"bg-neutral-100 dark:bg-neutral-1200\": !selected,\n          \"group-hover/product-tile:bg-neutral-000 dark:group-hover/product-tile:bg-neutral-1300\":\n            selected === false && !unavailable,\n        })}\n        style={{ height: innerSize, borderRadius: size / 4 }}\n      >\n        {/* The product icons themselves */}\n        {hoverName ? (\n          <Icon\n            name={hoverName}\n            size={`${iconSize}px`}\n            additionalCSS={cn({\n              \"hidden group-hover/product-tile:flex\": !selected,\n              flex: selected,\n            })}\n          />\n        ) : null}\n        <Icon\n          name={name}\n          size={`${iconSize}px`}\n          additionalCSS={cn({\n            \"text-neutral-000 dark:text-neutral-1300\": selected && !unavailable,\n            \"text-neutral-1300 dark:text-neutral-000\":\n              !selected && !unavailable,\n            \"text-neutral-700 dark:text-neutral-600\": selected && unavailable,\n            \"text-neutral-600 dark:text-neutral-700\": !selected && unavailable,\n            \"flex group-hover/product-tile:hidden\": hoverName && !selected,\n            hidden: hoverName && selected,\n          })}\n        />\n      </span>\n    </span>\n  );\n};\n\nexport default ProductIcon;\n"],"names":["React","Icon","cn","ProductIcon","name","hoverName","selected","size","unavailable","innerSize","iconSize","span","className","style","width","height","borderRadius","additionalCSS","flex","hidden"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,SAAU,SAAU,AAE3B,QAAOC,OAAQ,aAAc,CAU7B,MAAMC,YAAc,CAAC,CACnBC,IAAI,CACJC,SAAS,CACTC,QAAQ,CACRC,IAAI,CACJC,WAAW,CACM,IACjB,GAAI,CAACJ,KAAM,CACT,OAAO,IACT,CAGA,MAAMK,UAAYF,KAAO,EAGzB,MAAMG,SAAW,AAACH,KAAO,EAAK,EAE9B,OAEE,oBAACI,QACCC,UAAWV,GAAG,8BAA+B,CAC3C,8EACEI,SACF,8EACE,CAACA,QACL,GACAO,MAAO,CAAEC,MAAOP,KAAMQ,OAAQR,KAAMS,aAAcT,KAAO,CAAE,GAG3D,oBAACI,QACCC,UAAWV,GAAG,mCAAoC,CAChD,sCAAuCI,SACvC,sCAAuC,CAACA,SACxC,wFACEA,WAAa,OAAS,CAACE,WAC3B,GACAK,MAAO,CAAEE,OAAQN,UAAWO,aAAcT,KAAO,CAAE,GAGlDF,UACC,oBAACJ,MACCG,KAAMC,UACNE,KAAM,CAAC,EAAEG,SAAS,EAAE,CAAC,CACrBO,cAAef,GAAG,CAChB,uCAAwC,CAACI,SACzCY,KAAMZ,QACR,KAEA,KACJ,oBAACL,MACCG,KAAMA,KACNG,KAAM,CAAC,EAAEG,SAAS,EAAE,CAAC,CACrBO,cAAef,GAAG,CAChB,0CAA2CI,UAAY,CAACE,YACxD,0CACE,CAACF,UAAY,CAACE,YAChB,yCAA0CF,UAAYE,YACtD,yCAA0C,CAACF,UAAYE,YACvD,uCAAwCH,WAAa,CAACC,SACtDa,OAAQd,WAAaC,QACvB,MAKV,CAEA,gBAAeH,WAAY"}
+{"version":3,"sources":["../../../src/core/ProductTile/ProductIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport Icon from \"../Icon\";\nimport { IconName } from \"../Icon/types\";\nimport cn from \"../utils/cn\";\n\ntype ProductIconProps = {\n  name?: IconName;\n  hoverName?: IconName;\n  selected?: boolean;\n  size: number;\n  unavailable: boolean;\n};\n\nconst ProductIcon = ({\n  name,\n  hoverName,\n  selected,\n  size,\n  unavailable,\n}: ProductIconProps) => {\n  if (!name) {\n    return null;\n  }\n\n  // Padding around the icon is 1/4 the icon's size, so the icon is 4 of 6 parts\n  const iconSize = (size / 6) * 4;\n\n  return (\n    // Outer container, contains the gradient stroke (since we can't natively have CSS gradient strokes)\n\n    <span\n      className=\"flex items-center justify-center border border-neutral-300 dark:border-neutral-1000 rounded-xl\n      bg-neutral-100 dark:bg-neutral-1200 hover:bg-neutral-000 dark:hover:bg-neutral-1300 active:bg-neutral-000 dark:active:bg-neutral-1300\"\n      style={{ width: size, height: size }}\n    >\n      {/* The product icons themselves */}\n      {hoverName ? (\n        <Icon\n          name={hoverName}\n          size={`${iconSize}px`}\n          additionalCSS={cn({\n            \"hidden group-hover/product-tile:flex\": !selected,\n            flex: selected,\n          })}\n        />\n      ) : null}\n      <Icon\n        name={name}\n        size={`${iconSize}px`}\n        additionalCSS={cn({\n          \"text-neutral-000 dark:text-neutral-1300\": selected && !unavailable,\n          \"text-neutral-1300 dark:text-neutral-000\": !selected && !unavailable,\n          \"text-neutral-700 dark:text-neutral-600\": selected && unavailable,\n          \"text-neutral-600 dark:text-neutral-700\": !selected && unavailable,\n          \"flex group-hover/product-tile:hidden\": hoverName && !selected,\n          hidden: hoverName && selected,\n        })}\n      />\n    </span>\n  );\n};\n\nexport default ProductIcon;\n"],"names":["React","Icon","cn","ProductIcon","name","hoverName","selected","size","unavailable","iconSize","span","className","style","width","height","additionalCSS","flex","hidden"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,SAAU,SAAU,AAE3B,QAAOC,OAAQ,aAAc,CAU7B,MAAMC,YAAc,CAAC,CACnBC,IAAI,CACJC,SAAS,CACTC,QAAQ,CACRC,IAAI,CACJC,WAAW,CACM,IACjB,GAAI,CAACJ,KAAM,CACT,OAAO,IACT,CAGA,MAAMK,SAAW,AAACF,KAAO,EAAK,EAE9B,OAGE,oBAACG,QACCC,UAAU,uOAEVC,MAAO,CAAEC,MAAON,KAAMO,OAAQP,IAAK,GAGlCF,UACC,oBAACJ,MACCG,KAAMC,UACNE,KAAM,CAAC,EAAEE,SAAS,EAAE,CAAC,CACrBM,cAAeb,GAAG,CAChB,uCAAwC,CAACI,SACzCU,KAAMV,QACR,KAEA,KACJ,oBAACL,MACCG,KAAMA,KACNG,KAAM,CAAC,EAAEE,SAAS,EAAE,CAAC,CACrBM,cAAeb,GAAG,CAChB,0CAA2CI,UAAY,CAACE,YACxD,0CAA2C,CAACF,UAAY,CAACE,YACzD,yCAA0CF,UAAYE,YACtD,yCAA0C,CAACF,UAAYE,YACvD,uCAAwCH,WAAa,CAACC,SACtDW,OAAQZ,WAAaC,QACvB,KAIR,CAEA,gBAAeH,WAAY"}

package/core/ProductTile/ProductLabel.js

@@ -1,2 +1,2 @@
-import React from"react";import cn from"../utils/cn";const LABEL_FONT_SIZE_RATIO=4;const DESCRIPTION_FONT_SIZE_RATIO=2.6;const ProductLabel=({label,unavailable,selected,numericalSize,showLabel,className})=>{if(!label||!showLabel){return null}const dynamicFontSize=numericalSize/LABEL_FONT_SIZE_RATIO;return React.createElement("span",{className:"flex flex-col justify-center"},unavailable?React.createElement("span",{className:"block"},React.createElement("span",{className:"table-cell font-sans bg-neutral-300 dark:bg-neutral-1000 rounded-full text-gui-unavailable tracking-[0.04em] font-bold leading-snug",style:{fontSize:dynamicFontSize*.6,padding:`${dynamicFontSize*.25}px ${dynamicFontSize*.5}px`}},"COMING SOON")):React.createElement("span",{className:cn("block 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("span",{className:cn("block 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},className),style:{fontSize:numericalSize/DESCRIPTION_FONT_SIZE_RATIO}},label))};export default ProductLabel;
+import React from"react";import cn from"../utils/cn";const LABEL_FONT_SIZE_RATIO=4;const DESCRIPTION_FONT_SIZE_RATIO=2.6;const ProductLabel=({label,unavailable,selected,numericalSize,showLabel,showAblyText=true,className})=>{if(!label||!showLabel){return null}const dynamicFontSize=numericalSize/LABEL_FONT_SIZE_RATIO;return React.createElement("span",{className:"flex flex-col justify-center"},unavailable?React.createElement("span",{className:"block"},React.createElement("span",{className:"table-cell font-sans bg-neutral-300 dark:bg-neutral-1000 rounded-full text-gui-unavailable tracking-[0.04em] font-bold leading-snug",style:{fontSize:dynamicFontSize*.6,padding:`${dynamicFontSize*.25}px ${dynamicFontSize*.5}px`}},"COMING SOON")):showAblyText&&React.createElement("span",{className:cn("block 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("span",{className:cn("block 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},className),style:{fontSize:numericalSize/DESCRIPTION_FONT_SIZE_RATIO}},label))};export default ProductLabel;
 //# sourceMappingURL=ProductLabel.js.map

package/core/ProductTile/ProductLabel.js.map

@@ -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  className?: string;\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  className,\n}: ProductLabelProps) => {\n  if (!label || !showLabel) {\n    return null;\n  }\n\n  const dynamicFontSize = numericalSize / LABEL_FONT_SIZE_RATIO;\n\n  return (\n    <span className=\"flex flex-col justify-center\">\n      {unavailable ? (\n        <span className=\"block\">\n          <span\n            className=\"table-cell font-sans bg-neutral-300 dark:bg-neutral-1000 rounded-full text-gui-unavailable tracking-[0.04em] 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          </span>\n        </span>\n      ) : (\n        <span\n          className={cn(\n            \"block 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        </span>\n      )}\n      <span\n        className={cn(\n          \"block 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          className,\n        )}\n        style={{ fontSize: numericalSize / DESCRIPTION_FONT_SIZE_RATIO }}\n      >\n        {label}\n      </span>\n    </span>\n  );\n};\n\nexport default ProductLabel;\n"],"names":["React","cn","LABEL_FONT_SIZE_RATIO","DESCRIPTION_FONT_SIZE_RATIO","ProductLabel","label","unavailable","selected","numericalSize","showLabel","className","dynamicFontSize","span","style","fontSize","padding","letterSpacing","undefined"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,OAAQ,aAAc,CAW7B,MAAMC,sBAAwB,EAC9B,MAAMC,4BAA8B,IAEpC,MAAMC,aAAe,CAAC,CACpBC,KAAK,CACLC,WAAW,CACXC,QAAQ,CACRC,aAAa,CACbC,SAAS,CACTC,SAAS,CACS,IAClB,GAAI,CAACL,OAAS,CAACI,UAAW,CACxB,OAAO,IACT,CAEA,MAAME,gBAAkBH,cAAgBN,sBAExC,OACE,oBAACU,QAAKF,UAAU,gCACbJ,YACC,oBAACM,QAAKF,UAAU,SACd,oBAACE,QACCF,UAAU,sIACVG,MAAO,CACLC,SAAUH,gBAAkB,GAC5BI,QAAS,CAAC,EAAEJ,gBAAkB,IAAK,GAAG,EAAEA,gBAAkB,GAAI,EAAE,CAAC,AACnE,GACD,gBAKH,oBAACC,QACCF,UAAWT,GACT,oDACA,CAAE,yCAA0CM,QAAS,EACrD,CAAE,yCAA0C,CAACA,QAAS,GAExDM,MAAO,CACLC,SAAUH,gBACVK,cAAe,QACjB,GACD,QAIH,oBAACJ,QACCF,UAAWT,GACT,6BACA,CACE,0CACEM,WAAa,MAAQ,CAACD,WAC1B,EACA,CACE,oIACEC,WAAa,OAAS,CAACD,WAC3B,EACA,CACE,0CACEC,WAAaU,WAAa,CAACX,WAC/B,EACA,CACE,yCAA0CA,WAC5C,EACA,CAAE,YAAa,CAACA,WAAY,EAC5BI,WAEFG,MAAO,CAAEC,SAAUN,cAAgBL,2BAA4B,GAE9DE,OAIT,CAEA,gBAAeD,YAAa"}
+{"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  showAblyText?: boolean;\n  className?: string;\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  showAblyText = true,\n  className,\n}: ProductLabelProps) => {\n  if (!label || !showLabel) {\n    return null;\n  }\n\n  const dynamicFontSize = numericalSize / LABEL_FONT_SIZE_RATIO;\n\n  return (\n    <span className=\"flex flex-col justify-center\">\n      {unavailable ? (\n        <span className=\"block\">\n          <span\n            className=\"table-cell font-sans bg-neutral-300 dark:bg-neutral-1000 rounded-full text-gui-unavailable tracking-[0.04em] 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          </span>\n        </span>\n      ) : (\n        showAblyText && (\n          <span\n            className={cn(\n              \"block 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          </span>\n        )\n      )}\n      <span\n        className={cn(\n          \"block 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          className,\n        )}\n        style={{ fontSize: numericalSize / DESCRIPTION_FONT_SIZE_RATIO }}\n      >\n        {label}\n      </span>\n    </span>\n  );\n};\n\nexport default ProductLabel;\n"],"names":["React","cn","LABEL_FONT_SIZE_RATIO","DESCRIPTION_FONT_SIZE_RATIO","ProductLabel","label","unavailable","selected","numericalSize","showLabel","showAblyText","className","dynamicFontSize","span","style","fontSize","padding","letterSpacing","undefined"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAC1B,QAAOC,OAAQ,aAAc,CAY7B,MAAMC,sBAAwB,EAC9B,MAAMC,4BAA8B,IAEpC,MAAMC,aAAe,CAAC,CACpBC,KAAK,CACLC,WAAW,CACXC,QAAQ,CACRC,aAAa,CACbC,SAAS,CACTC,aAAe,IAAI,CACnBC,SAAS,CACS,IAClB,GAAI,CAACN,OAAS,CAACI,UAAW,CACxB,OAAO,IACT,CAEA,MAAMG,gBAAkBJ,cAAgBN,sBAExC,OACE,oBAACW,QAAKF,UAAU,gCACbL,YACC,oBAACO,QAAKF,UAAU,SACd,oBAACE,QACCF,UAAU,sIACVG,MAAO,CACLC,SAAUH,gBAAkB,GAC5BI,QAAS,CAAC,EAAEJ,gBAAkB,IAAK,GAAG,EAAEA,gBAAkB,GAAI,EAAE,CAAC,AACnE,GACD,gBAKHF,cACE,oBAACG,QACCF,UAAWV,GACT,oDACA,CAAE,yCAA0CM,QAAS,EACrD,CAAE,yCAA0C,CAACA,QAAS,GAExDO,MAAO,CACLC,SAAUH,gBACVK,cAAe,QACjB,GACD,QAKL,oBAACJ,QACCF,UAAWV,GACT,6BACA,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,EAC5BK,WAEFG,MAAO,CAAEC,SAAUP,cAAgBL,2BAA4B,GAE9DE,OAIT,CAEA,gBAAeD,YAAa"}

package/core/ProductTile/data.js

@@ -1,2 +1,2 @@
-export const productNames=["pubsub","chat","aiTransport","liveObjects","spaces","liveSync"];export const products={pubsub:{label:"Pub/Sub",description:"Low-level APIs for building realtime applications.",icon:"icon-product-pubsub-mono",hoverIcon:"icon-product-pubsub",link:"/docs/channels"},chat:{label:"Chat",description:"Build feature-rich live chat experiences.",icon:"icon-product-chat-mono",hoverIcon:"icon-product-chat",link:"/docs/chat"},aiTransport:{label:"AI Transport",description:"Drop-in realtime continuity for Gen-2 AI experiences.",icon:"icon-product-ai-transport-mono",hoverIcon:"icon-product-ai-transport"},liveObjects:{label:"LiveObjects",description:"Sync application state across client devices.",icon:"icon-product-liveobjects-mono",hoverIcon:"icon-product-liveobjects",link:"/docs/liveobjects"},spaces:{label:"Spaces",description:"Enhance your application with collaborative features.",icon:"icon-product-spaces-mono",hoverIcon:"icon-product-spaces",link:"/docs/spaces"},liveSync:{label:"LiveSync",description:"Fan-out database changes to client applications.",icon:"icon-product-livesync-mono",hoverIcon:"icon-product-livesync",link:"/docs/livesync"}};
+export const productNames=["pubsub","chat","aiTransport","liveObjects","spaces","liveSync"];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/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/chat"},aiTransport:{label:"AI Transport",description:"Drop-in realtime continuity for Gen-2 AI experiences.",icon:"icon-product-ai-transport-mono",hoverIcon:"icon-product-ai-transport"},liveObjects:{label:"LiveObjects",description:"Sync application state across multiple devices.",icon:"icon-product-liveobjects-mono",hoverIcon:"icon-product-liveobjects",link:"/docs/liveobjects"},spaces:{label:"Spaces",description:"Create collaborative environments in a few lines of code.",icon:"icon-product-spaces-mono",hoverIcon:"icon-product-spaces",link:"/docs/spaces"},liveSync:{label:"LiveSync",description:"Sync database changes with frontend clients.",icon:"icon-product-livesync-mono",hoverIcon:"icon-product-livesync",link:"/docs/livesync"}};
 //# sourceMappingURL=data.js.map

package/core/ProductTile/data.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/core/ProductTile/data.ts"],"sourcesContent":["import { IconName } from \"../Icon/types\";\n\nexport const productNames = [\n  \"pubsub\",\n  \"chat\",\n  \"aiTransport\",\n  \"liveObjects\",\n  \"spaces\",\n  \"liveSync\",\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 for building realtime applications.\",\n    icon: \"icon-product-pubsub-mono\",\n    hoverIcon: \"icon-product-pubsub\",\n    link: \"/docs/channels\",\n  },\n  chat: {\n    label: \"Chat\",\n    description: \"Build feature-rich live chat experiences.\",\n    icon: \"icon-product-chat-mono\",\n    hoverIcon: \"icon-product-chat\",\n    link: \"/docs/chat\",\n  },\n  aiTransport: {\n    label: \"AI Transport\",\n    description: \"Drop-in realtime continuity for Gen-2 AI experiences.\",\n    icon: \"icon-product-ai-transport-mono\",\n    hoverIcon: \"icon-product-ai-transport\",\n  },\n  liveObjects: {\n    label: \"LiveObjects\",\n    description: \"Sync application state across client devices.\",\n    icon: \"icon-product-liveobjects-mono\",\n    hoverIcon: \"icon-product-liveobjects\",\n    link: \"/docs/liveobjects\",\n  },\n  spaces: {\n    label: \"Spaces\",\n    description: \"Enhance your application with collaborative features.\",\n    icon: \"icon-product-spaces-mono\",\n    hoverIcon: \"icon-product-spaces\",\n    link: \"/docs/spaces\",\n  },\n  liveSync: {\n    label: \"LiveSync\",\n    description: \"Fan-out database changes to client applications.\",\n    icon: \"icon-product-livesync-mono\",\n    hoverIcon: \"icon-product-livesync\",\n    link: \"/docs/livesync\",\n  },\n};\n"],"names":["productNames","products","pubsub","label","description","icon","hoverIcon","link","chat","aiTransport","liveObjects","spaces","liveSync"],"mappings":"AAEA,OAAO,MAAMA,aAAe,CAC1B,SACA,OACA,cACA,cACA,SACA,WACD,AAAU,AAgBX,QAAO,MAAMC,SAAqB,CAChCC,OAAQ,CACNC,MAAO,UACPC,YAAa,qDACbC,KAAM,2BACNC,UAAW,sBACXC,KAAM,gBACR,EACAC,KAAM,CACJL,MAAO,OACPC,YAAa,4CACbC,KAAM,yBACNC,UAAW,oBACXC,KAAM,YACR,EACAE,YAAa,CACXN,MAAO,eACPC,YAAa,wDACbC,KAAM,iCACNC,UAAW,2BACb,EACAI,YAAa,CACXP,MAAO,cACPC,YAAa,gDACbC,KAAM,gCACNC,UAAW,2BACXC,KAAM,mBACR,EACAI,OAAQ,CACNR,MAAO,SACPC,YAAa,wDACbC,KAAM,2BACNC,UAAW,sBACXC,KAAM,cACR,EACAK,SAAU,CACRT,MAAO,WACPC,YAAa,mDACbC,KAAM,6BACNC,UAAW,wBACXC,KAAM,gBACR,CACF,CAAE"}
+{"version":3,"sources":["../../../src/core/ProductTile/data.ts"],"sourcesContent":["import { IconName } from \"../Icon/types\";\n\nexport const productNames = [\n  \"pubsub\",\n  \"chat\",\n  \"aiTransport\",\n  \"liveObjects\",\n  \"spaces\",\n  \"liveSync\",\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/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/chat\",\n  },\n  aiTransport: {\n    label: \"AI Transport\",\n    description: \"Drop-in realtime continuity for Gen-2 AI experiences.\",\n    icon: \"icon-product-ai-transport-mono\",\n    hoverIcon: \"icon-product-ai-transport\",\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/liveobjects\",\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/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/livesync\",\n  },\n};\n"],"names":["productNames","products","pubsub","label","description","icon","hoverIcon","link","chat","aiTransport","liveObjects","spaces","liveSync"],"mappings":"AAEA,OAAO,MAAMA,aAAe,CAC1B,SACA,OACA,cACA,cACA,SACA,WACD,AAAU,AAgBX,QAAO,MAAMC,SAAqB,CAChCC,OAAQ,CACNC,MAAO,UACPC,YAAa,mDACbC,KAAM,2BACNC,UAAW,sBACXC,KAAM,gBACR,EACAC,KAAM,CACJL,MAAO,OACPC,YAAa,qDACbC,KAAM,yBACNC,UAAW,oBACXC,KAAM,YACR,EACAE,YAAa,CACXN,MAAO,eACPC,YAAa,wDACbC,KAAM,iCACNC,UAAW,2BACb,EACAI,YAAa,CACXP,MAAO,cACPC,YAAa,kDACbC,KAAM,gCACNC,UAAW,2BACXC,KAAM,mBACR,EACAI,OAAQ,CACNR,MAAO,SACPC,YAAa,4DACbC,KAAM,2BACNC,UAAW,sBACXC,KAAM,cACR,EACAK,SAAU,CACRT,MAAO,WACPC,YAAa,+CACbC,KAAM,6BACNC,UAAW,wBACXC,KAAM,gBACR,CACF,CAAE"}

package/core/icons/gui/icon-gui-heartbeat-outline.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20.5635 11C20.8403 10.1303 21 9.21182 21 8.25C21 5.76472 18.9013 3.75 16.3125 3.75C14.3769 3.75 12.7153 4.87628 12 6.48342C11.2847 4.87628 9.62312 3.75 7.6875 3.75C5.09867 3.75 3 5.76472 3 8.25C3 9.21182 3.1597 10.1303 3.43654 11M19.3976 13.5C16.8104 17.6954 12 20.25 12 20.25C12 20.25 7.18957 17.6954 4.60242 13.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M2 13.4393H5.78505L7.75545 10.9907L9.72586 15.3738L11.6963 10L13.6667 13.6168L15.6371 10.9907L17.6075 13.4393H22" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/core/icons/gui/icon-gui-heartbeat-solid.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.30176 12.6826C3.55215 13.2053 3.83885 13.7053 4.14941 14.1826H2C1.58591 14.1826 1.2502 13.8467 1.25 13.4326C1.25 13.0184 1.58579 12.6826 2 12.6826H3.30176ZM22.0762 12.6865C22.4546 12.7247 22.75 13.0441 22.75 13.4326C22.7498 13.8209 22.4545 14.1405 22.0762 14.1787L22 14.1826H19.8506C20.1612 13.7053 20.4479 13.2053 20.6982 12.6826H22L22.0762 12.6865Z" fill="currentColor"/>
+<path d="M13.0078 13.9688C13.1299 14.1928 13.3578 14.3399 13.6123 14.3584C13.8667 14.3769 14.1134 14.2645 14.2666 14.0605L15.6572 12.2051L17.0234 13.9023C17.1658 14.0792 17.3804 14.1826 17.6074 14.1826H19.8506C19.0151 15.4667 18.0015 16.5832 17.0117 17.5059C15.8491 18.5896 14.6891 19.4378 13.8213 20.0146C13.3867 20.3036 13.0231 20.5259 12.7666 20.6768C12.6386 20.7521 12.5374 20.8102 12.4668 20.8496C12.4315 20.8693 12.4031 20.884 12.3838 20.8945L12.3613 20.9072L12.3555 20.9111L12.3525 20.9121C12.1326 21.0289 11.8674 21.0289 11.6475 20.9121L11.6445 20.9111L11.6387 20.9072L11.6162 20.8945C11.5969 20.884 11.5685 20.8693 11.5332 20.8496C11.4626 20.8102 11.3614 20.7521 11.2334 20.6768C10.9769 20.5259 10.6133 20.3036 10.1787 20.0146C9.31091 19.4378 8.15088 18.5896 6.98828 17.5059C5.9985 16.5832 4.98487 15.4667 4.14941 14.1826H5.78516C6.01216 14.1826 6.2268 14.0792 6.36914 13.9023L7.57227 12.4062L9.04199 15.6748C9.16711 15.9526 9.44837 16.127 9.75293 16.1162C10.0574 16.1052 10.3247 15.9111 10.4297 15.625L11.8301 11.8057L13.0078 13.9688ZM16.3125 3C19.2864 3 21.75 5.32194 21.75 8.25C21.75 9.85866 21.3399 11.343 20.6982 12.6826H17.9668L16.2217 10.5137C16.0765 10.3333 15.8555 10.2304 15.624 10.2344C15.4216 10.2379 15.2304 10.3226 15.0928 10.4678L15.0371 10.5342L13.7666 12.2266L12.3545 9.63477C12.2136 9.37614 11.9343 9.22343 11.6406 9.24512C11.3837 9.26423 11.1575 9.41354 11.0371 9.63574L10.9922 9.73535L9.6543 13.3799L8.43945 10.6768C8.33249 10.4388 8.10933 10.2734 7.85059 10.2402C7.62411 10.2113 7.39867 10.2867 7.23633 10.4424L7.1709 10.5137L5.42578 12.6826H3.30176C2.66006 11.343 2.25 9.85866 2.25 8.25C2.25 5.32194 4.7136 3 7.6875 3C9.43638 3 11.0023 3.79925 12 5.05176C12.9977 3.79925 14.5636 3 16.3125 3Z" fill="currentColor"/>
+</svg>

package/core/icons/product/icon-product-chat-mono.svg

@@ -1,3 +1,3 @@
 <svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M34 11H94C105.046 11 114 19.9543 114 31V105.41C114 110.623 107.81 113.356 103.957 109.844L81.1452 89.0442C80.4084 88.3724 79.4473 88 78.4502 88H34C22.9543 88 14 79.0457 14 68V31C14 19.9543 22.9543 11 34 11Z" stroke="currentColor" stroke-width="5"/>
+<path d="M38 11H90C103.255 11 114 21.7452 114 35V105.41C114 110.623 107.81 113.356 103.957 109.844L81.1452 89.0442C80.4084 88.3724 79.4473 88 78.4502 88H38C24.7452 88 14 77.2548 14 64V35C14 21.7452 24.7452 11 38 11Z" stroke="currentColor" stroke-width="6"/>
 </svg>

package/core/icons/product/icon-product-liveobjects-mono.svg

@@ -1,4 +1 @@
-<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M76 11H93C106.255 11 117 21.7452 117 35V52M52 11H35C21.7452 11 11 21.7452 11 35V52M11 76V93C11 106.255 21.7452 117 35 117H52M117 76V93C117 106.255 106.255 117 93 117H76" stroke="currentColor" stroke-width="5" stroke-linecap="round"/>
-<path d="M43 66L60 83L86 45" stroke="currentColor" stroke-width="5" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
+<svg fill="none" height="128" viewBox="0 0 128 128" width="128" xmlns="http://www.w3.org/2000/svg"><g stroke="currentColor" stroke-linecap="round" stroke-width="6"><path d="m76 11h17c13.255 0 24 10.7452 24 24v17m-65-41h-17c-13.2548 0-24 10.7452-24 24v17m0 24v17c0 13.255 10.7452 24 24 24h17m65-41v17c0 13.255-10.745 24-24 24h-17"/><path d="m43 66 17 17 26-38" stroke-linejoin="round"/></g></svg>

package/core/icons/product/icon-product-livesync-mono.svg

@@ -1,6 +1,6 @@
 <svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M115.029 117H64V78.0148C64 77.1881 64.9462 76.7184 65.6047 77.2184L115.634 115.204C116.397 115.783 115.987 117 115.029 117Z" stroke="currentColor" stroke-width="5" stroke-linecap="round"/>
-<path d="M11 52V77C11 99.0914 28.9086 117 51 117H64" stroke="currentColor" stroke-width="5" stroke-linecap="round"/>
-<path d="M12.9708 11L64 11L64 49.9852C64 50.8119 63.0538 51.2816 62.3953 50.7816L12.366 12.7965C11.603 12.2171 12.0127 11 12.9708 11Z" stroke="currentColor" stroke-width="5" stroke-linecap="round"/>
-<path d="M117 76L117 51C117 28.9086 99.0914 11 77 11L64 11" stroke="currentColor" stroke-width="5" stroke-linecap="round"/>
+<path d="M115.029 117H64V78.0148C64 77.1881 64.9462 76.7184 65.6047 77.2184L115.634 115.204C116.397 115.783 115.987 117 115.029 117Z" stroke="currentColor" stroke-width="6" stroke-linecap="round"/>
+<path d="M11 52V77C11 99.0914 28.9086 117 51 117H64" stroke="currentColor" stroke-width="6" stroke-linecap="round"/>
+<path d="M12.9708 11L64 11L64 49.9852C64 50.8119 63.0538 51.2816 62.3953 50.7816L12.366 12.7965C11.603 12.2171 12.0127 11 12.9708 11Z" stroke="currentColor" stroke-width="6" stroke-linecap="round"/>
+<path d="M117 76L117 51C117 28.9086 99.0914 11 77 11L64 11" stroke="currentColor" stroke-width="6" stroke-linecap="round"/>
 </svg>

package/core/icons/product/icon-product-pubsub-mono.svg

@@ -1,3 +1,3 @@
 <svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M56.6034 13.8927L16.8017 77.8875C15.1445 80.552 17.0606 84 20.1984 84H62C63.1046 84 64 84.8954 64 86V111.995C64 116.018 69.2718 117.524 71.3967 114.107L111.198 50.1125C112.855 47.4481 110.939 44 107.802 44H66C64.8954 44 64 43.1046 64 42V16.0052C64 11.9818 58.7282 10.4762 56.6034 13.8927Z" stroke="currentColor" stroke-width="5"/>
+<path d="M56.6038 13.8927L16.8021 77.8875C15.1449 80.552 17.061 84 20.1988 84H62.0004C63.105 84 64.0004 84.8954 64.0004 86V111.995C64.0004 116.018 69.2722 117.524 71.397 114.107L111.199 50.1125C112.856 47.4481 110.94 44 107.802 44H66.0004C64.8958 44 64.0004 43.1046 64.0004 42V16.0052C64.0004 11.9818 58.7286 10.4762 56.6038 13.8927Z" stroke="currentColor" stroke-width="6"/>
 </svg>

package/core/icons/product/icon-product-spaces-mono.svg

@@ -1,3 +1,3 @@
 <svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M41.2306 109.769L17.8256 25.2088C16.5818 20.7149 20.7149 16.5818 25.2088 17.8256L109.769 41.2306C115.314 42.7655 115.729 50.4697 110.38 52.5907L72.2134 67.7257C70.1627 68.5389 68.5389 70.1627 67.7257 72.2134L52.5907 110.38C50.4697 115.729 42.7655 115.314 41.2306 109.769Z" stroke="currentColor" stroke-width="5"/>
+<path d="M41.2306 109.769L17.8256 25.2088C16.5818 20.7149 20.7149 16.5818 25.2088 17.8256L109.769 41.2306C115.314 42.7655 115.729 50.4697 110.38 52.5907L72.2134 67.7257C70.1627 68.5389 68.5389 70.1627 67.7257 72.2134L52.5907 110.38C50.4697 115.729 42.7655 115.314 41.2306 109.769Z" stroke="currentColor" stroke-width="6"/>
 </svg>