@ably/ui 16.2.4 → 16.2.6-dev.9847ac8c

package/core/Flyout.js

@@ -1,2 +1,2 @@
-import React,{useState}from"react";import{NavigationMenu,NavigationMenuItem,NavigationMenuList,NavigationMenuTrigger,NavigationMenuContent,NavigationMenuViewport,NavigationMenuLink}from"@radix-ui/react-navigation-menu";import cn from"./utils/cn";import{componentMaxHeight,HEADER_HEIGHT}from"./utils/heights";const DEFAULT_MENU_LINK_STYLING="ui-text-label3 font-bold text-neutral-1000 dark:text-neutral-300 hover:text-neutral-1300 dark:hover:text-neutral-000 px-12 py-8 flex items-center justify-between";const DEFAULT_VIEWPORT_STYLING="relative overflow-hidden w-full h-[var(--radix-navigation-menu-viewport-height)] origin-[top_center] transition-[width,_height] duration-300 data-[state=closed]:animate-scale-out data-[state=open]:animate-scale-in sm:w-[var(--radix-navigation-menu-viewport-width)]";const PANEL_ANIMATION="data-[motion=from-end]:animate-enter-from-right data-[motion=from-start]:animate-enter-from-left data-[motion=to-end]:animate-exit-to-right data-[motion=to-start]:animate-exit-to-left";const FlyOverlay=({className,fadingOut})=>React.createElement("div",{className:cn("absolute left-0 right-0 h-screen w-full opacity-0",{"animate-[fade-in-ten-percent_150ms_ease-in-out_forwards]":!fadingOut,"animate-[fade-out-ten-percent_150ms_ease-in-out_forwards]":fadingOut},className),style:{height:componentMaxHeight(HEADER_HEIGHT),top:HEADER_HEIGHT}});const Flyout=({menuItems,className,flyOutClassName,menuLinkClassName,viewPortClassName})=>{const[isOpen,setIsOpen]=useState(false);const[fadingOut,setFadingOut]=useState(false);const closeMenu=()=>{setFadingOut(true);setTimeout(()=>{setIsOpen(false);setFadingOut(false)},150)};return React.createElement(React.Fragment,null,React.createElement(NavigationMenu,{className:cn(className,"flex w-full"),onValueChange:val=>val?setIsOpen(true):closeMenu(),delayDuration:0},React.createElement(NavigationMenuList,{className:"flex list-none center"},menuItems.map(({name,content,link,panelClassName})=>content?React.createElement(NavigationMenuItem,{key:name},React.createElement(NavigationMenuTrigger,{className:cn("group outline-none focus:outline-none select-none cursor-pointer relative","rounded-md hover:bg-neutral-100 dark:hover:bg-neutral-1200","[&[data-state=open]]:bg-neutral-100 dark:[&[data-state=open]]:bg-neutral-1200","[&[data-state=open]]:text-neutral-1300 dark:[&[data-state=open]]:text-neutral-000",DEFAULT_MENU_LINK_STYLING,menuLinkClassName)},name),React.createElement(NavigationMenuContent,{className:cn("absolute right-0 top-0 p-24 z-10",PANEL_ANIMATION,panelClassName)},content)):React.createElement(NavigationMenuLink,{key:name,href:link,className:cn(DEFAULT_MENU_LINK_STYLING,menuLinkClassName)},name))),React.createElement("div",{className:cn("absolute top-full",flyOutClassName)},React.createElement(NavigationMenuViewport,{className:cn(DEFAULT_VIEWPORT_STYLING,viewPortClassName)}))),isOpen?React.createElement(FlyOverlay,{className:"bg-neutral-1300 opacity-10 z-20 h-screen mix-blend-multiply",fadingOut:fadingOut}):null)};export default Flyout;
+import React,{useState}from"react";import{NavigationMenu,NavigationMenuItem,NavigationMenuList,NavigationMenuTrigger,NavigationMenuContent,NavigationMenuViewport,NavigationMenuLink}from"@radix-ui/react-navigation-menu";import cn from"./utils/cn";import{componentMaxHeight,HEADER_HEIGHT}from"./utils/heights";const DEFAULT_MENU_LINK_STYLING="ui-text-label3 font-bold text-neutral-1000 dark:text-neutral-300 hover:text-neutral-1300 dark:hover:text-neutral-000 px-12 py-8 flex items-center justify-between";const DEFAULT_VIEWPORT_STYLING="relative overflow-hidden w-full h-[var(--radix-navigation-menu-viewport-height)] origin-[top_center] transition-[width,_height] duration-300 data-[state=closed]:animate-scale-out data-[state=open]:animate-scale-in sm:w-[var(--radix-navigation-menu-viewport-width)]";const PANEL_ANIMATION="data-[motion=from-end]:animate-enter-from-right data-[motion=from-start]:animate-enter-from-left data-[motion=to-end]:animate-exit-to-right data-[motion=to-start]:animate-exit-to-left";const FlyOverlay=({className,fadingOut})=>React.createElement("div",{className:cn("absolute left-0 right-0 h-screen w-full opacity-0",{"animate-[fade-in-ten-percent_150ms_ease-in-out_forwards]":!fadingOut,"animate-[fade-out-ten-percent_150ms_ease-in-out_forwards]":fadingOut},className),style:{height:componentMaxHeight(HEADER_HEIGHT),top:HEADER_HEIGHT}});const Flyout=({menuItems,className,flyOutClassName,menuLinkClassName,viewPortClassName})=>{const[isOpen,setIsOpen]=useState(false);const[fadingOut,setFadingOut]=useState(false);const closeMenu=()=>{setFadingOut(true);setTimeout(()=>{setIsOpen(false);setFadingOut(false)},150)};return React.createElement(React.Fragment,null,React.createElement(NavigationMenu,{className:cn(className,"flex w-full"),onValueChange:val=>val?setIsOpen(true):closeMenu(),delayDuration:0},React.createElement(NavigationMenuList,{className:"flex list-none center"},menuItems.map(({name,content,link,panelClassName})=>content?React.createElement(NavigationMenuItem,{key:name},React.createElement(NavigationMenuTrigger,{onClick:event=>event.preventDefault(),className:cn("group outline-none focus:outline-none select-none cursor-pointer relative","rounded-md hover:bg-neutral-100 dark:hover:bg-neutral-1200","[&[data-state=open]]:bg-neutral-100 dark:[&[data-state=open]]:bg-neutral-1200","[&[data-state=open]]:text-neutral-1300 dark:[&[data-state=open]]:text-neutral-000",DEFAULT_MENU_LINK_STYLING,menuLinkClassName)},name),React.createElement(NavigationMenuContent,{className:cn("absolute right-0 top-0 p-24 z-10",PANEL_ANIMATION,panelClassName)},content)):React.createElement(NavigationMenuLink,{key:name,href:link,className:cn(DEFAULT_MENU_LINK_STYLING,menuLinkClassName)},name))),React.createElement("div",{className:cn("absolute top-full",flyOutClassName)},React.createElement(NavigationMenuViewport,{className:cn(DEFAULT_VIEWPORT_STYLING,viewPortClassName)}))),isOpen?React.createElement(FlyOverlay,{className:"bg-neutral-1300 opacity-10 z-20 h-screen mix-blend-multiply",fadingOut:fadingOut}):null)};export default Flyout;
 //# sourceMappingURL=Flyout.js.map

package/core/Flyout.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/core/Flyout.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport {\n  NavigationMenu,\n  NavigationMenuItem,\n  NavigationMenuList,\n  NavigationMenuTrigger,\n  NavigationMenuContent,\n  NavigationMenuViewport,\n  NavigationMenuLink,\n} from \"@radix-ui/react-navigation-menu\";\nimport cn from \"./utils/cn\";\nimport { componentMaxHeight, HEADER_HEIGHT } from \"./utils/heights\";\n\n/**\n * Props for the Flyout component.\n */\ntype FlyoutProps = {\n  /**\n   * Array of menu items to be displayed in the flyout.\n   */\n  menuItems: {\n    /**\n     * Name for the menu item.\n     */\n    name: string;\n    /**\n     * Optional content to be displayed in the flyout panel.\n     */\n    content?: React.ReactNode;\n    /**\n     * Optional link for the menu item.\n     */\n    link?: string;\n    /**\n     * Optional styling for the flyout panel.\n     */\n    panelClassName?: string;\n  }[];\n  /**\n   * Optional class name for the flyout container.\n   */\n  className?: string;\n  /**\n   * Optional class name for the flyout element.\n   */\n  flyOutClassName?: string;\n  /**\n   * Optional class name for the menu link.\n   */\n  menuLinkClassName?: string;\n  /**\n   * Optional class name for the viewport.\n   */\n  viewPortClassName?: string;\n};\n\nconst DEFAULT_MENU_LINK_STYLING =\n  \"ui-text-label3 font-bold text-neutral-1000 dark:text-neutral-300 hover:text-neutral-1300 dark:hover:text-neutral-000 px-12 py-8 flex items-center justify-between\";\nconst DEFAULT_VIEWPORT_STYLING =\n  \"relative overflow-hidden w-full h-[var(--radix-navigation-menu-viewport-height)] origin-[top_center] transition-[width,_height] duration-300 data-[state=closed]:animate-scale-out data-[state=open]:animate-scale-in sm:w-[var(--radix-navigation-menu-viewport-width)]\";\nconst PANEL_ANIMATION =\n  \"data-[motion=from-end]:animate-enter-from-right data-[motion=from-start]:animate-enter-from-left data-[motion=to-end]:animate-exit-to-right data-[motion=to-start]:animate-exit-to-left\";\n\nconst FlyOverlay = ({\n  className,\n  fadingOut,\n}: {\n  className: string;\n  fadingOut: boolean;\n}) => (\n  <div\n    className={cn(\n      \"absolute left-0 right-0 h-screen w-full opacity-0\",\n      {\n        \"animate-[fade-in-ten-percent_150ms_ease-in-out_forwards]\": !fadingOut,\n        \"animate-[fade-out-ten-percent_150ms_ease-in-out_forwards]\": fadingOut,\n      },\n      className,\n    )}\n    style={{ height: componentMaxHeight(HEADER_HEIGHT), top: HEADER_HEIGHT }}\n  ></div>\n);\n\nconst Flyout = ({\n  menuItems,\n  className,\n  flyOutClassName,\n  menuLinkClassName,\n  viewPortClassName,\n}: FlyoutProps) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const [fadingOut, setFadingOut] = useState(false);\n\n  const closeMenu = () => {\n    setFadingOut(true);\n\n    setTimeout(() => {\n      setIsOpen(false);\n      setFadingOut(false);\n    }, 150);\n  };\n\n  return (\n    <>\n      <NavigationMenu\n        className={cn(className, \"flex w-full\")}\n        onValueChange={(val) => (val ? setIsOpen(true) : closeMenu())}\n        delayDuration={0}\n      >\n        <NavigationMenuList className=\"flex list-none center\">\n          {menuItems.map(({ name, content, link, panelClassName }) =>\n            content ? (\n              <NavigationMenuItem key={name}>\n                <NavigationMenuTrigger\n                  className={cn(\n                    \"group outline-none focus:outline-none select-none cursor-pointer relative\",\n                    \"rounded-md hover:bg-neutral-100 dark:hover:bg-neutral-1200\",\n                    \"[&[data-state=open]]:bg-neutral-100 dark:[&[data-state=open]]:bg-neutral-1200\",\n                    \"[&[data-state=open]]:text-neutral-1300 dark:[&[data-state=open]]:text-neutral-000\",\n                    DEFAULT_MENU_LINK_STYLING,\n                    menuLinkClassName,\n                  )}\n                >\n                  {name}\n                </NavigationMenuTrigger>\n                <NavigationMenuContent\n                  className={cn(\n                    \"absolute right-0 top-0 p-24 z-10\",\n                    PANEL_ANIMATION,\n                    panelClassName,\n                  )}\n                >\n                  {content}\n                </NavigationMenuContent>\n              </NavigationMenuItem>\n            ) : (\n              <NavigationMenuLink\n                key={name}\n                href={link}\n                className={cn(DEFAULT_MENU_LINK_STYLING, menuLinkClassName)}\n              >\n                {name}\n              </NavigationMenuLink>\n            ),\n          )}\n        </NavigationMenuList>\n\n        <div className={cn(\"absolute top-full\", flyOutClassName)}>\n          <NavigationMenuViewport\n            className={cn(DEFAULT_VIEWPORT_STYLING, viewPortClassName)}\n          />\n        </div>\n      </NavigationMenu>\n      {isOpen ? (\n        <FlyOverlay\n          className=\"bg-neutral-1300 opacity-10 z-20 h-screen mix-blend-multiply\"\n          fadingOut={fadingOut}\n        />\n      ) : null}\n    </>\n  );\n};\n\nexport default Flyout;\n"],"names":["React","useState","NavigationMenu","NavigationMenuItem","NavigationMenuList","NavigationMenuTrigger","NavigationMenuContent","NavigationMenuViewport","NavigationMenuLink","cn","componentMaxHeight","HEADER_HEIGHT","DEFAULT_MENU_LINK_STYLING","DEFAULT_VIEWPORT_STYLING","PANEL_ANIMATION","FlyOverlay","className","fadingOut","div","style","height","top","Flyout","menuItems","flyOutClassName","menuLinkClassName","viewPortClassName","isOpen","setIsOpen","setFadingOut","closeMenu","setTimeout","onValueChange","val","delayDuration","map","name","content","link","panelClassName","key","href"],"mappings":"AAAA,OAAOA,OAASC,QAAQ,KAAQ,OAAQ,AACxC,QACEC,cAAc,CACdC,kBAAkB,CAClBC,kBAAkB,CAClBC,qBAAqB,CACrBC,qBAAqB,CACrBC,sBAAsB,CACtBC,kBAAkB,KACb,iCAAkC,AACzC,QAAOC,OAAQ,YAAa,AAC5B,QAASC,kBAAkB,CAAEC,aAAa,KAAQ,iBAAkB,CA6CpE,MAAMC,0BACJ,oKACF,MAAMC,yBACJ,2QACF,MAAMC,gBACJ,0LAEF,MAAMC,WAAa,CAAC,CAClBC,SAAS,CACTC,SAAS,CAIV,GACC,oBAACC,OACCF,UAAWP,GACT,oDACA,CACE,2DAA4D,CAACQ,UAC7D,4DAA6DA,SAC/D,EACAD,WAEFG,MAAO,CAAEC,OAAQV,mBAAmBC,eAAgBU,IAAKV,aAAc,IAI3E,MAAMW,OAAS,CAAC,CACdC,SAAS,CACTP,SAAS,CACTQ,eAAe,CACfC,iBAAiB,CACjBC,iBAAiB,CACL,IACZ,KAAM,CAACC,OAAQC,UAAU,CAAG3B,SAAS,OACrC,KAAM,CAACgB,UAAWY,aAAa,CAAG5B,SAAS,OAE3C,MAAM6B,UAAY,KAChBD,aAAa,MAEbE,WAAW,KACTH,UAAU,OACVC,aAAa,MACf,EAAG,IACL,EAEA,OACE,wCACE,oBAAC3B,gBACCc,UAAWP,GAAGO,UAAW,eACzBgB,cAAe,AAACC,KAASA,IAAML,UAAU,MAAQE,YACjDI,cAAe,GAEf,oBAAC9B,oBAAmBY,UAAU,yBAC3BO,UAAUY,GAAG,CAAC,CAAC,CAAEC,IAAI,CAAEC,OAAO,CAAEC,IAAI,CAAEC,cAAc,CAAE,GACrDF,QACE,oBAAClC,oBAAmBqC,IAAKJ,MACvB,oBAAC/B,uBACCW,UAAWP,GACT,4EACA,6DACA,gFACA,oFACAG,0BACAa,oBAGDW,MAEH,oBAAC9B,uBACCU,UAAWP,GACT,mCACAK,gBACAyB,iBAGDF,UAIL,oBAAC7B,oBACCgC,IAAKJ,KACLK,KAAMH,KACNtB,UAAWP,GAAGG,0BAA2Ba,oBAExCW,QAMT,oBAAClB,OAAIF,UAAWP,GAAG,oBAAqBe,kBACtC,oBAACjB,wBACCS,UAAWP,GAAGI,yBAA0Ba,uBAI7CC,OACC,oBAACZ,YACCC,UAAU,8DACVC,UAAWA,YAEX,KAGV,CAEA,gBAAeK,MAAO"}
+{"version":3,"sources":["../../src/core/Flyout.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport {\n  NavigationMenu,\n  NavigationMenuItem,\n  NavigationMenuList,\n  NavigationMenuTrigger,\n  NavigationMenuContent,\n  NavigationMenuViewport,\n  NavigationMenuLink,\n} from \"@radix-ui/react-navigation-menu\";\nimport cn from \"./utils/cn\";\nimport { componentMaxHeight, HEADER_HEIGHT } from \"./utils/heights\";\n\n/**\n * Props for the Flyout component.\n */\ntype FlyoutProps = {\n  /**\n   * Array of menu items to be displayed in the flyout.\n   */\n  menuItems: {\n    /**\n     * Name for the menu item.\n     */\n    name: string;\n    /**\n     * Optional content to be displayed in the flyout panel.\n     */\n    content?: React.ReactNode;\n    /**\n     * Optional link for the menu item.\n     */\n    link?: string;\n    /**\n     * Optional styling for the flyout panel.\n     */\n    panelClassName?: string;\n  }[];\n  /**\n   * Optional class name for the flyout container.\n   */\n  className?: string;\n  /**\n   * Optional class name for the flyout element.\n   */\n  flyOutClassName?: string;\n  /**\n   * Optional class name for the menu link.\n   */\n  menuLinkClassName?: string;\n  /**\n   * Optional class name for the viewport.\n   */\n  viewPortClassName?: string;\n};\n\nconst DEFAULT_MENU_LINK_STYLING =\n  \"ui-text-label3 font-bold text-neutral-1000 dark:text-neutral-300 hover:text-neutral-1300 dark:hover:text-neutral-000 px-12 py-8 flex items-center justify-between\";\nconst DEFAULT_VIEWPORT_STYLING =\n  \"relative overflow-hidden w-full h-[var(--radix-navigation-menu-viewport-height)] origin-[top_center] transition-[width,_height] duration-300 data-[state=closed]:animate-scale-out data-[state=open]:animate-scale-in sm:w-[var(--radix-navigation-menu-viewport-width)]\";\nconst PANEL_ANIMATION =\n  \"data-[motion=from-end]:animate-enter-from-right data-[motion=from-start]:animate-enter-from-left data-[motion=to-end]:animate-exit-to-right data-[motion=to-start]:animate-exit-to-left\";\n\nconst FlyOverlay = ({\n  className,\n  fadingOut,\n}: {\n  className: string;\n  fadingOut: boolean;\n}) => (\n  <div\n    className={cn(\n      \"absolute left-0 right-0 h-screen w-full opacity-0\",\n      {\n        \"animate-[fade-in-ten-percent_150ms_ease-in-out_forwards]\": !fadingOut,\n        \"animate-[fade-out-ten-percent_150ms_ease-in-out_forwards]\": fadingOut,\n      },\n      className,\n    )}\n    style={{ height: componentMaxHeight(HEADER_HEIGHT), top: HEADER_HEIGHT }}\n  ></div>\n);\n\nconst Flyout = ({\n  menuItems,\n  className,\n  flyOutClassName,\n  menuLinkClassName,\n  viewPortClassName,\n}: FlyoutProps) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const [fadingOut, setFadingOut] = useState(false);\n\n  const closeMenu = () => {\n    setFadingOut(true);\n\n    setTimeout(() => {\n      setIsOpen(false);\n      setFadingOut(false);\n    }, 150);\n  };\n\n  return (\n    <>\n      <NavigationMenu\n        className={cn(className, \"flex w-full\")}\n        onValueChange={(val) => (val ? setIsOpen(true) : closeMenu())}\n        delayDuration={0}\n      >\n        <NavigationMenuList className=\"flex list-none center\">\n          {menuItems.map(({ name, content, link, panelClassName }) =>\n            content ? (\n              <NavigationMenuItem key={name}>\n                <NavigationMenuTrigger\n                  onClick={(event) => event.preventDefault()}\n                  className={cn(\n                    \"group outline-none focus:outline-none select-none cursor-pointer relative\",\n                    \"rounded-md hover:bg-neutral-100 dark:hover:bg-neutral-1200\",\n                    \"[&[data-state=open]]:bg-neutral-100 dark:[&[data-state=open]]:bg-neutral-1200\",\n                    \"[&[data-state=open]]:text-neutral-1300 dark:[&[data-state=open]]:text-neutral-000\",\n                    DEFAULT_MENU_LINK_STYLING,\n                    menuLinkClassName,\n                  )}\n                >\n                  {name}\n                </NavigationMenuTrigger>\n                <NavigationMenuContent\n                  className={cn(\n                    \"absolute right-0 top-0 p-24 z-10\",\n                    PANEL_ANIMATION,\n                    panelClassName,\n                  )}\n                >\n                  {content}\n                </NavigationMenuContent>\n              </NavigationMenuItem>\n            ) : (\n              <NavigationMenuLink\n                key={name}\n                href={link}\n                className={cn(DEFAULT_MENU_LINK_STYLING, menuLinkClassName)}\n              >\n                {name}\n              </NavigationMenuLink>\n            ),\n          )}\n        </NavigationMenuList>\n\n        <div className={cn(\"absolute top-full\", flyOutClassName)}>\n          <NavigationMenuViewport\n            className={cn(DEFAULT_VIEWPORT_STYLING, viewPortClassName)}\n          />\n        </div>\n      </NavigationMenu>\n      {isOpen ? (\n        <FlyOverlay\n          className=\"bg-neutral-1300 opacity-10 z-20 h-screen mix-blend-multiply\"\n          fadingOut={fadingOut}\n        />\n      ) : null}\n    </>\n  );\n};\n\nexport default Flyout;\n"],"names":["React","useState","NavigationMenu","NavigationMenuItem","NavigationMenuList","NavigationMenuTrigger","NavigationMenuContent","NavigationMenuViewport","NavigationMenuLink","cn","componentMaxHeight","HEADER_HEIGHT","DEFAULT_MENU_LINK_STYLING","DEFAULT_VIEWPORT_STYLING","PANEL_ANIMATION","FlyOverlay","className","fadingOut","div","style","height","top","Flyout","menuItems","flyOutClassName","menuLinkClassName","viewPortClassName","isOpen","setIsOpen","setFadingOut","closeMenu","setTimeout","onValueChange","val","delayDuration","map","name","content","link","panelClassName","key","onClick","event","preventDefault","href"],"mappings":"AAAA,OAAOA,OAASC,QAAQ,KAAQ,OAAQ,AACxC,QACEC,cAAc,CACdC,kBAAkB,CAClBC,kBAAkB,CAClBC,qBAAqB,CACrBC,qBAAqB,CACrBC,sBAAsB,CACtBC,kBAAkB,KACb,iCAAkC,AACzC,QAAOC,OAAQ,YAAa,AAC5B,QAASC,kBAAkB,CAAEC,aAAa,KAAQ,iBAAkB,CA6CpE,MAAMC,0BACJ,oKACF,MAAMC,yBACJ,2QACF,MAAMC,gBACJ,0LAEF,MAAMC,WAAa,CAAC,CAClBC,SAAS,CACTC,SAAS,CAIV,GACC,oBAACC,OACCF,UAAWP,GACT,oDACA,CACE,2DAA4D,CAACQ,UAC7D,4DAA6DA,SAC/D,EACAD,WAEFG,MAAO,CAAEC,OAAQV,mBAAmBC,eAAgBU,IAAKV,aAAc,IAI3E,MAAMW,OAAS,CAAC,CACdC,SAAS,CACTP,SAAS,CACTQ,eAAe,CACfC,iBAAiB,CACjBC,iBAAiB,CACL,IACZ,KAAM,CAACC,OAAQC,UAAU,CAAG3B,SAAS,OACrC,KAAM,CAACgB,UAAWY,aAAa,CAAG5B,SAAS,OAE3C,MAAM6B,UAAY,KAChBD,aAAa,MAEbE,WAAW,KACTH,UAAU,OACVC,aAAa,MACf,EAAG,IACL,EAEA,OACE,wCACE,oBAAC3B,gBACCc,UAAWP,GAAGO,UAAW,eACzBgB,cAAe,AAACC,KAASA,IAAML,UAAU,MAAQE,YACjDI,cAAe,GAEf,oBAAC9B,oBAAmBY,UAAU,yBAC3BO,UAAUY,GAAG,CAAC,CAAC,CAAEC,IAAI,CAAEC,OAAO,CAAEC,IAAI,CAAEC,cAAc,CAAE,GACrDF,QACE,oBAAClC,oBAAmBqC,IAAKJ,MACvB,oBAAC/B,uBACCoC,QAAS,AAACC,OAAUA,MAAMC,cAAc,GACxC3B,UAAWP,GACT,4EACA,6DACA,gFACA,oFACAG,0BACAa,oBAGDW,MAEH,oBAAC9B,uBACCU,UAAWP,GACT,mCACAK,gBACAyB,iBAGDF,UAIL,oBAAC7B,oBACCgC,IAAKJ,KACLQ,KAAMN,KACNtB,UAAWP,GAAGG,0BAA2Ba,oBAExCW,QAMT,oBAAClB,OAAIF,UAAWP,GAAG,oBAAqBe,kBACtC,oBAACjB,wBACCS,UAAWP,GAAGI,yBAA0Ba,uBAI7CC,OACC,oBAACZ,YACCC,UAAU,8DACVC,UAAWA,YAEX,KAGV,CAEA,gBAAeK,MAAO"}

package/core/Pricing/data.js

@@ -1,2 +1,2 @@
-import React from"react";export const planData=[{title:{content:"Free",className:"font-mono text-p3 uppercase font-extrabold tracking-[0.16em]",color:"text-neutral-600 dark:text-neutral-700"},description:{content:"Build a proof of concept.",className:"ui-text-p1",color:"text-neutral-800 dark:text-neutral-500"},price:{amount:"$0"},cta:{text:"Start for free",url:"/sign-up",iconColor:"text-neutral-600 dark:text-neutral-700"},sections:[{title:"Limits",items:["200 concurrent channels","200 concurrent connections","500 messages / second","6M messages / month"]},{title:"Includes",items:["Community & email support (best effort)","No commitment"],listItemColors:{foreground:"text-neutral-700 dark:text-neutral-600",background:"text-neutral-300 dark:text-neutral-1000"},cta:{text:"See all features",url:"#pricing-table"}}]},{title:{content:"Standard",className:"font-mono text-p3 uppercase font-extrabold tracking-[0.16em]",color:"text-neutral-1300 dark:text-neutral-000"},description:{content:"Roll-out into production.",className:"ui-text-p1",color:"text-neutral-800 dark:text-neutral-500"},price:{amount:"$29",content:React.createElement(React.Fragment,null,React.createElement("p",{className:"ui-text-p3 font-medium",style:{color:"currentColor"}},"/ month"),React.createElement("p",{className:"ui-text-p2 font-bold text-gui-blue-default-dark -mt-6"},"+ consumption"))},cta:{text:"Get started",url:"/users/paid_sign_up?package=standard",iconColor:"text-gui-blue-default-dark dark:text-gui-blue-default-light"},sections:[{title:"Limits",items:["10k concurrent channels","10k concurrent connections","2.5k messages / second"]},{title:"Includes",items:["1 day email support SLA","Uptime SLO"],listItemColors:{foreground:"text-blue-600 dark:text-blue-400",background:"text-blue-200 dark:text-blue-800"},cta:{text:"See all features",url:"#pricing-table"}}]},{title:{content:"Pro",className:"font-mono text-p3 uppercase font-extrabold tracking-[0.16em]",color:"text-neutral-1300 dark:text-neutral-000"},description:{content:"Scale with confidence.",className:"ui-text-p1",color:"text-neutral-800 dark:text-neutral-500"},price:{amount:"$399",content:React.createElement(React.Fragment,null,React.createElement("p",{className:"ui-text-p3 font-medium",style:{color:"currentColor"}},"/ month"),React.createElement("p",{className:"ui-text-p2 font-bold text-gui-blue-default-dark -mt-6"},"+ consumption"))},cta:{text:"Get started",url:"/users/paid_sign_up?package=pro",iconColor:"text-gui-blue-default-dark dark:text-gui-blue-default-light"},sections:[{title:"Limits",items:["50k concurrent channels","50k concurrent connections","10k messages / second"]},{title:"Includes",items:["2 hour support SLA","Datadog (lite)","Uptime SLO"],listItemColors:{foreground:"text-blue-600 dark:text-blue-400",background:"text-blue-200 dark:text-blue-800"},cta:{text:"See all features",url:"#pricing-table"}}]},{title:{content:"Enterprise",className:"font-mono text-p3 uppercase font-extrabold tracking-[0.16em]",color:"text-orange-600"},description:{content:"Deliver without limits.",className:"ui-text-p1",color:"text-neutral-800 dark:text-neutral-500"},price:{amount:"Custom"},cta:{text:"Contact us",url:"/contact"},sections:[{title:"Unlimited",items:["Concurrent channels","Concurrent connections","Messages / second"]},{title:"Includes",items:["24/7 mission critical support","99.999% uptime SLAs","Committed use discounts","Datadog","CNAME, SSO, & more"],listItemColors:{foreground:"text-orange-600 dark:text-orange-600",background:"text-orange-200 dark:text-orange-1000"},cta:{text:"See all features",url:"#pricing-table"}}]}];export const consumptionData=[{title:{content:"Messages",className:"ui-text-h3",color:"text-neutral-1300 dark:text-neutral-000"},description:{content:"Messages contain the data that a client is communicating, such as the contents of a chat message.",className:"ui-text-p3",color:"text-neutral-700 dark:text-neutral-600"},price:{amount:"$2.50",content:"/ million"},sections:[{title:"Volume discounts",items:[["Consumption","$ / million msgs"],["First 50 million msgs","$2.50"],["Next 450 million msgs","$2.25"],["Next 4.5 billion msgs","$1.95"],["Next 15 billion msgs","$1.65"],["Next 30 billion msgs","$1.40"],["Over 50 billion msgs","$1.25"]]}]},{title:{content:"Channels",className:"ui-text-h3",color:"text-neutral-1300 dark:text-neutral-000",tooltip:React.createElement("p",null,"We charge you for the amount of time a channel is active in our network by the minute. For example, if ten channels are in use for 45 minutes, you will be charged a total of 450 channel minutes.")},description:{content:"Channels are used to route messages from publishers to subscribers. Channels are billed by the minute when actively being used by a connected client.",className:"ui-text-p3",color:"text-neutral-700 dark:text-neutral-600"},price:{amount:"$1.00",content:"/ million mins"},sections:[{title:"Volume discounts",items:[["Consumption","$ / million mins"],["First 10 million mins","$1.00"],["Next 90 million mins","$0.95"],["Next 900 million mins","$0.85"],["Next 4 billion mins","$0.75"],["Next 10 billion mins","$0.65"],["Over 15 billion mins","$0.60"]]}]},{title:{content:"Connections",className:"ui-text-h3",color:"text-neutral-1300 dark:text-neutral-000",tooltip:React.createElement("p",null,"We charge you for the amount of time devices are connected to our network by the minute. For example, if ten devices are each connected for 45 minutes, you will be charged a total of 450 connection minutes.")},description:{content:"Clients establish and maintain a connection to the Ably service, typically over WebSockets.",className:"ui-text-p3",color:"text-neutral-700 dark:text-neutral-600"},price:{amount:"$1.00",content:"/ million mins"},sections:[{title:"Volume discounts",items:[["Consumption","$ / million mins"],["First 10 million mins","$1.00"],["Next 90 million mins","$0.95"],["Next 900 million mins","$0.85"],["Next 4 billion mins","$0.75"],["Next 10 billion mins","$0.65"],["Over 15 billion mins","$0.60"]]}]}];
+import React from"react";export const planData=[{title:{content:"Free",className:"font-mono text-p3 uppercase font-bold tracking-[0.16em]",color:"text-neutral-600 dark:text-neutral-700"},description:{content:"Build a proof of concept.",className:"ui-text-p1",color:"text-neutral-800 dark:text-neutral-500"},price:{amount:"$0"},cta:{text:"Start for free",url:"/sign-up",iconColor:"text-neutral-600 dark:text-neutral-700"},sections:[{title:"Limits",items:["200 concurrent channels","200 concurrent connections","500 messages / second","6M messages / month"]},{title:"Includes",items:["Community & email support (best effort)","No commitment"],listItemColors:{foreground:"text-neutral-700 dark:text-neutral-600",background:"text-neutral-300 dark:text-neutral-1000"},cta:{text:"See all features",url:"#pricing-table"}}]},{title:{content:"Standard",className:"font-mono text-p3 uppercase font-bold tracking-[0.16em]",color:"text-neutral-1300 dark:text-neutral-000"},description:{content:"Roll-out into production.",className:"ui-text-p1",color:"text-neutral-800 dark:text-neutral-500"},price:{amount:"$29",content:React.createElement(React.Fragment,null,React.createElement("p",{className:"ui-text-p3 font-medium",style:{color:"currentColor"}},"/ month"),React.createElement("p",{className:"ui-text-p2 font-bold text-gui-blue-default-dark -mt-6"},"+ consumption"))},cta:{text:"Get started",url:"/users/paid_sign_up?package=standard",iconColor:"text-gui-blue-default-dark dark:text-gui-blue-default-light"},sections:[{title:"Limits",items:["10k concurrent channels","10k concurrent connections","2.5k messages / second"]},{title:"Includes",items:["1 day email support SLA","Uptime SLO"],listItemColors:{foreground:"text-blue-600 dark:text-blue-400",background:"text-blue-200 dark:text-blue-800"},cta:{text:"See all features",url:"#pricing-table"}}]},{title:{content:"Pro",className:"font-mono text-p3 uppercase font-bold tracking-[0.16em]",color:"text-neutral-1300 dark:text-neutral-000"},description:{content:"Scale with confidence.",className:"ui-text-p1",color:"text-neutral-800 dark:text-neutral-500"},price:{amount:"$399",content:React.createElement(React.Fragment,null,React.createElement("p",{className:"ui-text-p3 font-medium",style:{color:"currentColor"}},"/ month"),React.createElement("p",{className:"ui-text-p2 font-bold text-gui-blue-default-dark -mt-6"},"+ consumption"))},cta:{text:"Get started",url:"/users/paid_sign_up?package=pro",iconColor:"text-gui-blue-default-dark dark:text-gui-blue-default-light"},sections:[{title:"Limits",items:["50k concurrent channels","50k concurrent connections","10k messages / second"]},{title:"Includes",items:["2 hour support SLA","Datadog (lite)","Uptime SLO"],listItemColors:{foreground:"text-blue-600 dark:text-blue-400",background:"text-blue-200 dark:text-blue-800"},cta:{text:"See all features",url:"#pricing-table"}}]},{title:{content:"Enterprise",className:"font-mono text-p3 uppercase font-bold tracking-[0.16em]",color:"text-orange-600"},description:{content:"Deliver without limits.",className:"ui-text-p1",color:"text-neutral-800 dark:text-neutral-500"},price:{amount:"Custom"},cta:{text:"Contact us",url:"/contact"},sections:[{title:"Unlimited",items:["Concurrent channels","Concurrent connections","Messages / second"]},{title:"Includes",items:["24/7 mission critical support","99.999% uptime SLAs","Committed use discounts","Datadog","CNAME, SSO, & more"],listItemColors:{foreground:"text-orange-600 dark:text-orange-600",background:"text-orange-200 dark:text-orange-1000"},cta:{text:"See all features",url:"#pricing-table"}}]}];export const consumptionData=[{title:{content:"Messages",className:"ui-text-h3",color:"text-neutral-1300 dark:text-neutral-000"},description:{content:"Messages contain the data that a client is communicating, such as the contents of a chat message.",className:"ui-text-p3",color:"text-neutral-700 dark:text-neutral-600"},price:{amount:"$2.50",content:"/ million"},sections:[{title:"Volume discounts",items:[["Consumption","$ / million msgs"],["First 50 million msgs","$2.50"],["Next 450 million msgs","$2.25"],["Next 4.5 billion msgs","$1.95"],["Next 15 billion msgs","$1.65"],["Next 30 billion msgs","$1.40"],["Over 50 billion msgs","$1.25"]]}]},{title:{content:"Channels",className:"ui-text-h3",color:"text-neutral-1300 dark:text-neutral-000",tooltip:React.createElement("p",null,"We charge you for the amount of time a channel is active in our network by the minute. For example, if ten channels are in use for 45 minutes, you will be charged a total of 450 channel minutes.")},description:{content:"Channels are used to route messages from publishers to subscribers. Channels are billed by the minute when actively being used by a connected client.",className:"ui-text-p3",color:"text-neutral-700 dark:text-neutral-600"},price:{amount:"$1.00",content:"/ million mins"},sections:[{title:"Volume discounts",items:[["Consumption","$ / million mins"],["First 10 million mins","$1.00"],["Next 90 million mins","$0.95"],["Next 900 million mins","$0.85"],["Next 4 billion mins","$0.75"],["Next 10 billion mins","$0.65"],["Over 15 billion mins","$0.60"]]}]},{title:{content:"Connections",className:"ui-text-h3",color:"text-neutral-1300 dark:text-neutral-000",tooltip:React.createElement("p",null,"We charge you for the amount of time devices are connected to our network by the minute. For example, if ten devices are each connected for 45 minutes, you will be charged a total of 450 connection minutes.")},description:{content:"Clients establish and maintain a connection to the Ably service, typically over WebSockets.",className:"ui-text-p3",color:"text-neutral-700 dark:text-neutral-600"},price:{amount:"$1.00",content:"/ million mins"},sections:[{title:"Volume discounts",items:[["Consumption","$ / million mins"],["First 10 million mins","$1.00"],["Next 90 million mins","$0.95"],["Next 900 million mins","$0.85"],["Next 4 billion mins","$0.75"],["Next 10 billion mins","$0.65"],["Over 15 billion mins","$0.60"]]}]}];
 //# sourceMappingURL=data.js.map

package/core/Pricing/data.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/core/Pricing/data.tsx"],"sourcesContent":["import React from \"react\";\nimport { PricingDataFeature } from \"./types\";\n\nexport const planData: PricingDataFeature[] = [\n  {\n    title: {\n      content: \"Free\",\n      className: \"font-mono text-p3 uppercase font-extrabold tracking-[0.16em]\",\n      color: \"text-neutral-600 dark:text-neutral-700\",\n    },\n    description: {\n      content: \"Build a proof of concept.\",\n      className: \"ui-text-p1\",\n      color: \"text-neutral-800 dark:text-neutral-500\",\n    },\n    price: { amount: \"$0\" },\n    cta: {\n      text: \"Start for free\",\n      url: \"/sign-up\",\n      iconColor: \"text-neutral-600 dark:text-neutral-700\",\n    },\n    sections: [\n      {\n        title: \"Limits\",\n        items: [\n          \"200 concurrent channels\",\n          \"200 concurrent connections\",\n          \"500 messages / second\",\n          \"6M messages / month\",\n        ],\n      },\n      {\n        title: \"Includes\",\n        items: [\"Community & email support (best effort)\", \"No commitment\"],\n        listItemColors: {\n          foreground: \"text-neutral-700 dark:text-neutral-600\",\n          background: \"text-neutral-300 dark:text-neutral-1000\",\n        },\n        cta: {\n          text: \"See all features\",\n          url: \"#pricing-table\",\n        },\n      },\n    ],\n  },\n  {\n    title: {\n      content: \"Standard\",\n      className: \"font-mono text-p3 uppercase font-extrabold tracking-[0.16em]\",\n      color: \"text-neutral-1300 dark:text-neutral-000\",\n    },\n    description: {\n      content: \"Roll-out into production.\",\n      className: \"ui-text-p1\",\n      color: \"text-neutral-800 dark:text-neutral-500\",\n    },\n    price: {\n      amount: \"$29\",\n      content: (\n        <>\n          <p\n            className=\"ui-text-p3 font-medium\"\n            style={{ color: \"currentColor\" }}\n          >\n            / month\n          </p>\n          <p className=\"ui-text-p2 font-bold text-gui-blue-default-dark -mt-6\">\n            + consumption\n          </p>\n        </>\n      ),\n    },\n    cta: {\n      text: \"Get started\",\n      url: \"/users/paid_sign_up?package=standard\",\n      iconColor: \"text-gui-blue-default-dark dark:text-gui-blue-default-light\",\n    },\n    sections: [\n      {\n        title: \"Limits\",\n        items: [\n          \"10k concurrent channels\",\n          \"10k concurrent connections\",\n          \"2.5k messages / second\",\n        ],\n      },\n      {\n        title: \"Includes\",\n        items: [\"1 day email support SLA\", \"Uptime SLO\"],\n        listItemColors: {\n          foreground: \"text-blue-600 dark:text-blue-400\",\n          background: \"text-blue-200 dark:text-blue-800\",\n        },\n        cta: {\n          text: \"See all features\",\n          url: \"#pricing-table\",\n        },\n      },\n    ],\n  },\n  {\n    title: {\n      content: \"Pro\",\n      className: \"font-mono text-p3 uppercase font-extrabold tracking-[0.16em]\",\n      color: \"text-neutral-1300 dark:text-neutral-000\",\n    },\n    description: {\n      content: \"Scale with confidence.\",\n      className: \"ui-text-p1\",\n      color: \"text-neutral-800 dark:text-neutral-500\",\n    },\n    price: {\n      amount: \"$399\",\n      content: (\n        <>\n          <p\n            className=\"ui-text-p3 font-medium\"\n            style={{ color: \"currentColor\" }}\n          >\n            / month\n          </p>\n          <p className=\"ui-text-p2 font-bold text-gui-blue-default-dark -mt-6\">\n            + consumption\n          </p>\n        </>\n      ),\n    },\n    cta: {\n      text: \"Get started\",\n      url: \"/users/paid_sign_up?package=pro\",\n      iconColor: \"text-gui-blue-default-dark dark:text-gui-blue-default-light\",\n    },\n    sections: [\n      {\n        title: \"Limits\",\n        items: [\n          \"50k concurrent channels\",\n          \"50k concurrent connections\",\n          \"10k messages / second\",\n        ],\n      },\n      {\n        title: \"Includes\",\n        items: [\"2 hour support SLA\", \"Datadog (lite)\", \"Uptime SLO\"],\n        listItemColors: {\n          foreground: \"text-blue-600 dark:text-blue-400\",\n          background: \"text-blue-200 dark:text-blue-800\",\n        },\n        cta: {\n          text: \"See all features\",\n          url: \"#pricing-table\",\n        },\n      },\n    ],\n  },\n\n  {\n    title: {\n      content: \"Enterprise\",\n      className: \"font-mono text-p3 uppercase font-extrabold tracking-[0.16em]\",\n      color: \"text-orange-600\",\n    },\n    description: {\n      content: \"Deliver without limits.\",\n      className: \"ui-text-p1\",\n      color: \"text-neutral-800 dark:text-neutral-500\",\n    },\n    price: { amount: \"Custom\" },\n    cta: {\n      text: \"Contact us\",\n      url: \"/contact\",\n    },\n    sections: [\n      {\n        title: \"Unlimited\",\n        items: [\n          \"Concurrent channels\",\n          \"Concurrent connections\",\n          \"Messages / second\",\n        ],\n      },\n      {\n        title: \"Includes\",\n        items: [\n          \"24/7 mission critical support\",\n          \"99.999% uptime SLAs\",\n          \"Committed use discounts\",\n          \"Datadog\",\n          \"CNAME, SSO, & more\",\n        ],\n        listItemColors: {\n          foreground: \"text-orange-600 dark:text-orange-600\",\n          background: \"text-orange-200 dark:text-orange-1000\",\n        },\n        cta: {\n          text: \"See all features\",\n          url: \"#pricing-table\",\n        },\n      },\n    ],\n  },\n];\n\nexport const consumptionData: PricingDataFeature[] = [\n  {\n    title: {\n      content: \"Messages\",\n      className: \"ui-text-h3\",\n      color: \"text-neutral-1300 dark:text-neutral-000\",\n    },\n    description: {\n      content:\n        \"Messages contain the data that a client is communicating, such as the contents of a chat message.\",\n      className: \"ui-text-p3\",\n      color: \"text-neutral-700 dark:text-neutral-600\",\n    },\n    price: { amount: \"$2.50\", content: \"/ million\" },\n    sections: [\n      {\n        title: \"Volume discounts\",\n        items: [\n          [\"Consumption\", \"$ / million msgs\"],\n          [\"First 50 million msgs\", \"$2.50\"],\n          [\"Next 450 million msgs\", \"$2.25\"],\n          [\"Next 4.5 billion msgs\", \"$1.95\"],\n          [\"Next 15 billion msgs\", \"$1.65\"],\n          [\"Next 30 billion msgs\", \"$1.40\"],\n          [\"Over 50 billion msgs\", \"$1.25\"],\n        ],\n      },\n    ],\n  },\n  {\n    title: {\n      content: \"Channels\",\n      className: \"ui-text-h3\",\n      color: \"text-neutral-1300 dark:text-neutral-000\",\n      tooltip: (\n        <p>\n          We charge you for the amount of time a channel is active in our\n          network by the minute. For example, if ten channels are in use for 45\n          minutes, you will be charged a total of 450 channel minutes.\n        </p>\n      ),\n    },\n    description: {\n      content:\n        \"Channels are used to route messages from publishers to subscribers. Channels are billed by the minute when actively being used by a connected client.\",\n      className: \"ui-text-p3\",\n      color: \"text-neutral-700 dark:text-neutral-600\",\n    },\n    price: { amount: \"$1.00\", content: \"/ million mins\" },\n    sections: [\n      {\n        title: \"Volume discounts\",\n        items: [\n          [\"Consumption\", \"$ / million mins\"],\n          [\"First 10 million mins\", \"$1.00\"],\n          [\"Next 90 million mins\", \"$0.95\"],\n          [\"Next 900 million mins\", \"$0.85\"],\n          [\"Next 4 billion mins\", \"$0.75\"],\n          [\"Next 10 billion mins\", \"$0.65\"],\n          [\"Over 15 billion mins\", \"$0.60\"],\n        ],\n      },\n    ],\n  },\n  {\n    title: {\n      content: \"Connections\",\n      className: \"ui-text-h3\",\n      color: \"text-neutral-1300 dark:text-neutral-000\",\n      tooltip: (\n        <p>\n          We charge you for the amount of time devices are connected to our\n          network by the minute. For example, if ten devices are each connected\n          for 45 minutes, you will be charged a total of 450 connection minutes.\n        </p>\n      ),\n    },\n    description: {\n      content:\n        \"Clients establish and maintain a connection to the Ably service, typically over WebSockets.\",\n      className: \"ui-text-p3\",\n      color: \"text-neutral-700 dark:text-neutral-600\",\n    },\n    price: { amount: \"$1.00\", content: \"/ million mins\" },\n    sections: [\n      {\n        title: \"Volume discounts\",\n        items: [\n          [\"Consumption\", \"$ / million mins\"],\n          [\"First 10 million mins\", \"$1.00\"],\n          [\"Next 90 million mins\", \"$0.95\"],\n          [\"Next 900 million mins\", \"$0.85\"],\n          [\"Next 4 billion mins\", \"$0.75\"],\n          [\"Next 10 billion mins\", \"$0.65\"],\n          [\"Over 15 billion mins\", \"$0.60\"],\n        ],\n      },\n    ],\n  },\n];\n"],"names":["React","planData","title","content","className","color","description","price","amount","cta","text","url","iconColor","sections","items","listItemColors","foreground","background","p","style","consumptionData","tooltip"],"mappings":"AAAA,OAAOA,UAAW,OAAQ,AAG1B,QAAO,MAAMC,SAAiC,CAC5C,CACEC,MAAO,CACLC,QAAS,OACTC,UAAW,+DACXC,MAAO,wCACT,EACAC,YAAa,CACXH,QAAS,4BACTC,UAAW,aACXC,MAAO,wCACT,EACAE,MAAO,CAAEC,OAAQ,IAAK,EACtBC,IAAK,CACHC,KAAM,iBACNC,IAAK,WACLC,UAAW,wCACb,EACAC,SAAU,CACR,CACEX,MAAO,SACPY,MAAO,CACL,0BACA,6BACA,wBACA,sBACD,AACH,EACA,CACEZ,MAAO,WACPY,MAAO,CAAC,0CAA2C,gBAAgB,CACnEC,eAAgB,CACdC,WAAY,yCACZC,WAAY,yCACd,EACAR,IAAK,CACHC,KAAM,mBACNC,IAAK,gBACP,CACF,EACD,AACH,EACA,CACET,MAAO,CACLC,QAAS,WACTC,UAAW,+DACXC,MAAO,yCACT,EACAC,YAAa,CACXH,QAAS,4BACTC,UAAW,aACXC,MAAO,wCACT,EACAE,MAAO,CACLC,OAAQ,MACRL,QACE,wCACE,oBAACe,KACCd,UAAU,yBACVe,MAAO,CAAEd,MAAO,cAAe,GAChC,WAGD,oBAACa,KAAEd,UAAU,yDAAwD,iBAK3E,EACAK,IAAK,CACHC,KAAM,cACNC,IAAK,uCACLC,UAAW,6DACb,EACAC,SAAU,CACR,CACEX,MAAO,SACPY,MAAO,CACL,0BACA,6BACA,yBACD,AACH,EACA,CACEZ,MAAO,WACPY,MAAO,CAAC,0BAA2B,aAAa,CAChDC,eAAgB,CACdC,WAAY,mCACZC,WAAY,kCACd,EACAR,IAAK,CACHC,KAAM,mBACNC,IAAK,gBACP,CACF,EACD,AACH,EACA,CACET,MAAO,CACLC,QAAS,MACTC,UAAW,+DACXC,MAAO,yCACT,EACAC,YAAa,CACXH,QAAS,yBACTC,UAAW,aACXC,MAAO,wCACT,EACAE,MAAO,CACLC,OAAQ,OACRL,QACE,wCACE,oBAACe,KACCd,UAAU,yBACVe,MAAO,CAAEd,MAAO,cAAe,GAChC,WAGD,oBAACa,KAAEd,UAAU,yDAAwD,iBAK3E,EACAK,IAAK,CACHC,KAAM,cACNC,IAAK,kCACLC,UAAW,6DACb,EACAC,SAAU,CACR,CACEX,MAAO,SACPY,MAAO,CACL,0BACA,6BACA,wBACD,AACH,EACA,CACEZ,MAAO,WACPY,MAAO,CAAC,qBAAsB,iBAAkB,aAAa,CAC7DC,eAAgB,CACdC,WAAY,mCACZC,WAAY,kCACd,EACAR,IAAK,CACHC,KAAM,mBACNC,IAAK,gBACP,CACF,EACD,AACH,EAEA,CACET,MAAO,CACLC,QAAS,aACTC,UAAW,+DACXC,MAAO,iBACT,EACAC,YAAa,CACXH,QAAS,0BACTC,UAAW,aACXC,MAAO,wCACT,EACAE,MAAO,CAAEC,OAAQ,QAAS,EAC1BC,IAAK,CACHC,KAAM,aACNC,IAAK,UACP,EACAE,SAAU,CACR,CACEX,MAAO,YACPY,MAAO,CACL,sBACA,yBACA,oBACD,AACH,EACA,CACEZ,MAAO,WACPY,MAAO,CACL,gCACA,sBACA,0BACA,UACA,qBACD,CACDC,eAAgB,CACdC,WAAY,uCACZC,WAAY,uCACd,EACAR,IAAK,CACHC,KAAM,mBACNC,IAAK,gBACP,CACF,EACD,AACH,EACD,AAAC,AAEF,QAAO,MAAMS,gBAAwC,CACnD,CACElB,MAAO,CACLC,QAAS,WACTC,UAAW,aACXC,MAAO,yCACT,EACAC,YAAa,CACXH,QACE,oGACFC,UAAW,aACXC,MAAO,wCACT,EACAE,MAAO,CAAEC,OAAQ,QAASL,QAAS,WAAY,EAC/CU,SAAU,CACR,CACEX,MAAO,mBACPY,MAAO,CACL,CAAC,cAAe,mBAAmB,CACnC,CAAC,wBAAyB,QAAQ,CAClC,CAAC,wBAAyB,QAAQ,CAClC,CAAC,wBAAyB,QAAQ,CAClC,CAAC,uBAAwB,QAAQ,CACjC,CAAC,uBAAwB,QAAQ,CACjC,CAAC,uBAAwB,QAAQ,CAClC,AACH,EACD,AACH,EACA,CACEZ,MAAO,CACLC,QAAS,WACTC,UAAW,aACXC,MAAO,0CACPgB,QACE,oBAACH,SAAE,qMAMP,EACAZ,YAAa,CACXH,QACE,wJACFC,UAAW,aACXC,MAAO,wCACT,EACAE,MAAO,CAAEC,OAAQ,QAASL,QAAS,gBAAiB,EACpDU,SAAU,CACR,CACEX,MAAO,mBACPY,MAAO,CACL,CAAC,cAAe,mBAAmB,CACnC,CAAC,wBAAyB,QAAQ,CAClC,CAAC,uBAAwB,QAAQ,CACjC,CAAC,wBAAyB,QAAQ,CAClC,CAAC,sBAAuB,QAAQ,CAChC,CAAC,uBAAwB,QAAQ,CACjC,CAAC,uBAAwB,QAAQ,CAClC,AACH,EACD,AACH,EACA,CACEZ,MAAO,CACLC,QAAS,cACTC,UAAW,aACXC,MAAO,0CACPgB,QACE,oBAACH,SAAE,iNAMP,EACAZ,YAAa,CACXH,QACE,8FACFC,UAAW,aACXC,MAAO,wCACT,EACAE,MAAO,CAAEC,OAAQ,QAASL,QAAS,gBAAiB,EACpDU,SAAU,CACR,CACEX,MAAO,mBACPY,MAAO,CACL,CAAC,cAAe,mBAAmB,CACnC,CAAC,wBAAyB,QAAQ,CAClC,CAAC,uBAAwB,QAAQ,CACjC,CAAC,wBAAyB,QAAQ,CAClC,CAAC,sBAAuB,QAAQ,CAChC,CAAC,uBAAwB,QAAQ,CACjC,CAAC,uBAAwB,QAAQ,CAClC,AACH,EACD,AACH,EACD,AAAC"}
+{"version":3,"sources":["../../../src/core/Pricing/data.tsx"],"sourcesContent":["import React from \"react\";\nimport { PricingDataFeature } from \"./types\";\n\nexport const planData: PricingDataFeature[] = [\n  {\n    title: {\n      content: \"Free\",\n      className: \"font-mono text-p3 uppercase font-bold tracking-[0.16em]\",\n      color: \"text-neutral-600 dark:text-neutral-700\",\n    },\n    description: {\n      content: \"Build a proof of concept.\",\n      className: \"ui-text-p1\",\n      color: \"text-neutral-800 dark:text-neutral-500\",\n    },\n    price: { amount: \"$0\" },\n    cta: {\n      text: \"Start for free\",\n      url: \"/sign-up\",\n      iconColor: \"text-neutral-600 dark:text-neutral-700\",\n    },\n    sections: [\n      {\n        title: \"Limits\",\n        items: [\n          \"200 concurrent channels\",\n          \"200 concurrent connections\",\n          \"500 messages / second\",\n          \"6M messages / month\",\n        ],\n      },\n      {\n        title: \"Includes\",\n        items: [\"Community & email support (best effort)\", \"No commitment\"],\n        listItemColors: {\n          foreground: \"text-neutral-700 dark:text-neutral-600\",\n          background: \"text-neutral-300 dark:text-neutral-1000\",\n        },\n        cta: {\n          text: \"See all features\",\n          url: \"#pricing-table\",\n        },\n      },\n    ],\n  },\n  {\n    title: {\n      content: \"Standard\",\n      className: \"font-mono text-p3 uppercase font-bold tracking-[0.16em]\",\n      color: \"text-neutral-1300 dark:text-neutral-000\",\n    },\n    description: {\n      content: \"Roll-out into production.\",\n      className: \"ui-text-p1\",\n      color: \"text-neutral-800 dark:text-neutral-500\",\n    },\n    price: {\n      amount: \"$29\",\n      content: (\n        <>\n          <p\n            className=\"ui-text-p3 font-medium\"\n            style={{ color: \"currentColor\" }}\n          >\n            / month\n          </p>\n          <p className=\"ui-text-p2 font-bold text-gui-blue-default-dark -mt-6\">\n            + consumption\n          </p>\n        </>\n      ),\n    },\n    cta: {\n      text: \"Get started\",\n      url: \"/users/paid_sign_up?package=standard\",\n      iconColor: \"text-gui-blue-default-dark dark:text-gui-blue-default-light\",\n    },\n    sections: [\n      {\n        title: \"Limits\",\n        items: [\n          \"10k concurrent channels\",\n          \"10k concurrent connections\",\n          \"2.5k messages / second\",\n        ],\n      },\n      {\n        title: \"Includes\",\n        items: [\"1 day email support SLA\", \"Uptime SLO\"],\n        listItemColors: {\n          foreground: \"text-blue-600 dark:text-blue-400\",\n          background: \"text-blue-200 dark:text-blue-800\",\n        },\n        cta: {\n          text: \"See all features\",\n          url: \"#pricing-table\",\n        },\n      },\n    ],\n  },\n  {\n    title: {\n      content: \"Pro\",\n      className: \"font-mono text-p3 uppercase font-bold tracking-[0.16em]\",\n      color: \"text-neutral-1300 dark:text-neutral-000\",\n    },\n    description: {\n      content: \"Scale with confidence.\",\n      className: \"ui-text-p1\",\n      color: \"text-neutral-800 dark:text-neutral-500\",\n    },\n    price: {\n      amount: \"$399\",\n      content: (\n        <>\n          <p\n            className=\"ui-text-p3 font-medium\"\n            style={{ color: \"currentColor\" }}\n          >\n            / month\n          </p>\n          <p className=\"ui-text-p2 font-bold text-gui-blue-default-dark -mt-6\">\n            + consumption\n          </p>\n        </>\n      ),\n    },\n    cta: {\n      text: \"Get started\",\n      url: \"/users/paid_sign_up?package=pro\",\n      iconColor: \"text-gui-blue-default-dark dark:text-gui-blue-default-light\",\n    },\n    sections: [\n      {\n        title: \"Limits\",\n        items: [\n          \"50k concurrent channels\",\n          \"50k concurrent connections\",\n          \"10k messages / second\",\n        ],\n      },\n      {\n        title: \"Includes\",\n        items: [\"2 hour support SLA\", \"Datadog (lite)\", \"Uptime SLO\"],\n        listItemColors: {\n          foreground: \"text-blue-600 dark:text-blue-400\",\n          background: \"text-blue-200 dark:text-blue-800\",\n        },\n        cta: {\n          text: \"See all features\",\n          url: \"#pricing-table\",\n        },\n      },\n    ],\n  },\n\n  {\n    title: {\n      content: \"Enterprise\",\n      className: \"font-mono text-p3 uppercase font-bold tracking-[0.16em]\",\n      color: \"text-orange-600\",\n    },\n    description: {\n      content: \"Deliver without limits.\",\n      className: \"ui-text-p1\",\n      color: \"text-neutral-800 dark:text-neutral-500\",\n    },\n    price: { amount: \"Custom\" },\n    cta: {\n      text: \"Contact us\",\n      url: \"/contact\",\n    },\n    sections: [\n      {\n        title: \"Unlimited\",\n        items: [\n          \"Concurrent channels\",\n          \"Concurrent connections\",\n          \"Messages / second\",\n        ],\n      },\n      {\n        title: \"Includes\",\n        items: [\n          \"24/7 mission critical support\",\n          \"99.999% uptime SLAs\",\n          \"Committed use discounts\",\n          \"Datadog\",\n          \"CNAME, SSO, & more\",\n        ],\n        listItemColors: {\n          foreground: \"text-orange-600 dark:text-orange-600\",\n          background: \"text-orange-200 dark:text-orange-1000\",\n        },\n        cta: {\n          text: \"See all features\",\n          url: \"#pricing-table\",\n        },\n      },\n    ],\n  },\n];\n\nexport const consumptionData: PricingDataFeature[] = [\n  {\n    title: {\n      content: \"Messages\",\n      className: \"ui-text-h3\",\n      color: \"text-neutral-1300 dark:text-neutral-000\",\n    },\n    description: {\n      content:\n        \"Messages contain the data that a client is communicating, such as the contents of a chat message.\",\n      className: \"ui-text-p3\",\n      color: \"text-neutral-700 dark:text-neutral-600\",\n    },\n    price: { amount: \"$2.50\", content: \"/ million\" },\n    sections: [\n      {\n        title: \"Volume discounts\",\n        items: [\n          [\"Consumption\", \"$ / million msgs\"],\n          [\"First 50 million msgs\", \"$2.50\"],\n          [\"Next 450 million msgs\", \"$2.25\"],\n          [\"Next 4.5 billion msgs\", \"$1.95\"],\n          [\"Next 15 billion msgs\", \"$1.65\"],\n          [\"Next 30 billion msgs\", \"$1.40\"],\n          [\"Over 50 billion msgs\", \"$1.25\"],\n        ],\n      },\n    ],\n  },\n  {\n    title: {\n      content: \"Channels\",\n      className: \"ui-text-h3\",\n      color: \"text-neutral-1300 dark:text-neutral-000\",\n      tooltip: (\n        <p>\n          We charge you for the amount of time a channel is active in our\n          network by the minute. For example, if ten channels are in use for 45\n          minutes, you will be charged a total of 450 channel minutes.\n        </p>\n      ),\n    },\n    description: {\n      content:\n        \"Channels are used to route messages from publishers to subscribers. Channels are billed by the minute when actively being used by a connected client.\",\n      className: \"ui-text-p3\",\n      color: \"text-neutral-700 dark:text-neutral-600\",\n    },\n    price: { amount: \"$1.00\", content: \"/ million mins\" },\n    sections: [\n      {\n        title: \"Volume discounts\",\n        items: [\n          [\"Consumption\", \"$ / million mins\"],\n          [\"First 10 million mins\", \"$1.00\"],\n          [\"Next 90 million mins\", \"$0.95\"],\n          [\"Next 900 million mins\", \"$0.85\"],\n          [\"Next 4 billion mins\", \"$0.75\"],\n          [\"Next 10 billion mins\", \"$0.65\"],\n          [\"Over 15 billion mins\", \"$0.60\"],\n        ],\n      },\n    ],\n  },\n  {\n    title: {\n      content: \"Connections\",\n      className: \"ui-text-h3\",\n      color: \"text-neutral-1300 dark:text-neutral-000\",\n      tooltip: (\n        <p>\n          We charge you for the amount of time devices are connected to our\n          network by the minute. For example, if ten devices are each connected\n          for 45 minutes, you will be charged a total of 450 connection minutes.\n        </p>\n      ),\n    },\n    description: {\n      content:\n        \"Clients establish and maintain a connection to the Ably service, typically over WebSockets.\",\n      className: \"ui-text-p3\",\n      color: \"text-neutral-700 dark:text-neutral-600\",\n    },\n    price: { amount: \"$1.00\", content: \"/ million mins\" },\n    sections: [\n      {\n        title: \"Volume discounts\",\n        items: [\n          [\"Consumption\", \"$ / million mins\"],\n          [\"First 10 million mins\", \"$1.00\"],\n          [\"Next 90 million mins\", \"$0.95\"],\n          [\"Next 900 million mins\", \"$0.85\"],\n          [\"Next 4 billion mins\", \"$0.75\"],\n          [\"Next 10 billion mins\", \"$0.65\"],\n          [\"Over 15 billion mins\", \"$0.60\"],\n        ],\n      },\n    ],\n  },\n];\n"],"names":["React","planData","title","content","className","color","description","price","amount","cta","text","url","iconColor","sections","items","listItemColors","foreground","background","p","style","consumptionData","tooltip"],"mappings":"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"}

package/core/styles/text.css

@@ -1,36 +1,36 @@
 @layer components {
   .ui-text-title {
-    @apply font-sans font-extrabold text-cool-black;
+    @apply font-sans font-bold text-cool-black;
     @apply text-title-xs xs:text-title xl:text-title-xl;
     @apply tracking-tighten-0.015 xs:tracking-tighten-0.02 xl:tracking-tighten-0.02;
   }
 
   .ui-text-h1 {
-    @apply font-sans font-extrabold text-cool-black;
+    @apply font-sans font-bold text-cool-black;
     @apply text-h1-xs xs:text-h1 xl:text-h1-xl;
     @apply tracking-tighten-0.0125 xs:tracking-tighten-0.015;
   }
 
   .ui-text-h2 {
-    @apply font-sans font-extrabold text-cool-black;
+    @apply font-sans font-bold text-cool-black;
     @apply text-h2-xs xs:text-h2 xl:text-h2-xl;
     @apply tracking-tighten-0.015 xs:tracking-tighten-0.01;
   }
 
   .ui-text-h3 {
-    @apply font-sans font-extrabold text-cool-black;
+    @apply font-sans font-bold text-cool-black;
     @apply text-h3;
     @apply tracking-tighten-0.005;
   }
 
   .ui-text-h4 {
-    @apply font-sans font-extrabold text-cool-black;
+    @apply font-sans font-bold text-cool-black;
     @apply text-h4;
     @apply tracking-tighten-0.0015;
   }
 
   .ui-text-h5 {
-    @apply font-sans font-extrabold text-cool-black;
+    @apply font-sans font-bold text-cool-black;
     @apply text-h5;
     @apply tracking-tighten-0.0025;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ably/ui",
-  "version": "16.2.4",
+  "version": "16.2.6-dev.9847ac8c",
   "description": "Home of the Ably design system library ([design.ably.com](https://design.ably.com)). It provides a showcase, development/test environment and a publishing pipeline for different distributables.",
   "repository": {
     "type": "git",
@@ -19,10 +19,10 @@
     "workerDirectory": "./public"
   },
   "devDependencies": {
-    "@storybook/addon-essentials": "^8.6.4",
-    "@storybook/addon-interactions": "^8.6.4",
-    "@storybook/react-vite": "^8.6.4",
-    "@storybook/test": "^8.6.4",
+    "@storybook/addon-essentials": "^8.6.14",
+    "@storybook/addon-interactions": "^8.6.14",
+    "@storybook/react-vite": "^8.6.14",
+    "@storybook/test": "^8.6.14",
     "@storybook/test-runner": "^0.22.0",
     "@swc/cli": "^0.7.3",
     "@swc/core": "^1.4.11",
@@ -36,7 +36,7 @@
     "@typescript-eslint/eslint-plugin": "^8.25.0",
     "@typescript-eslint/parser": "^8.25.0",
     "@vitejs/plugin-react-swc": "^3.8.0",
-    "@whitespace/storybook-addon-html": "^6.1.1",
+    "@whitespace/storybook-addon-html": "^7.0.0",
     "autoprefixer": "^10.0.2",
     "eslint": "^8.57.0",
     "eslint-config-prettier": "^10.0.1",
@@ -51,8 +51,7 @@
     "playwright": "^1.49.1",
     "posthog-js": "^1.217.4",
     "prettier": "^3.2.5",
-    "react-syntax-highlighter": "^15.6.1",
-    "storybook": "^8.6.4",
+    "storybook": "^8.6.14",
     "storybook-dark-mode": "^4.0.2",
     "svg-sprite": "^2.0.4",
     "tailwindcss": "^3.3.6",
@@ -89,7 +88,6 @@
     "@radix-ui/react-select": "^2.2.2",
     "@radix-ui/react-switch": "^1.1.1",
     "@radix-ui/react-tabs": "^1.1.1",
-    "addsearch-js-client": "^1.0.2",
     "array-flat-polyfill": "^1.0.1",
     "clsx": "^2.1.1",
     "dompurify": "^3.2.4",