@ably/ui 14.0.0-dev.58ef698 → 14.0.0-dev.6d5cd62

package/core/MeganavSearchSuggestions/component.js

@@ -1 +1 @@
-import{queryId}from"../dom-query";var DRAG_BUFFER=5;var getTranslateX=function(node){return new DOMMatrix(window.getComputedStyle(node).transform).e};var updateTranslateX=function(node,value){return node.style.transform="translateX(".concat(value,"px)")};var dragLeftBoundary=function(translateX,threshold){return translateX>=threshold};var dragRightBoundary=function(translateX,itemsWidth,windowWidth,threshold){return Math.abs(translateX-windowWidth+threshold)>itemsWidth};var getDistance=function(e,touchStartX){var _e_changedTouches_;return((_e_changedTouches_=e.changedTouches[0])===null||_e_changedTouches_===void 0?void 0:_e_changedTouches_.clientX)-touchStartX};var withinBuffer=function(distance){return Math.abs(distance)<DRAG_BUFFER};var getItemsTotalWidth=function(nodes){return nodes.map(function(item){return item.getBoundingClientRect().width}).reduce(function(acc,val){return acc+val},0)};var MeganavSearchSuggestions=function(){var suggestionsToggle=queryId("meganav-mobile-search-input");var suggestions=queryId("meganav-mobile-search-suggestions");var list=suggestions.querySelector("ul");var listItems=Array.from(list.querySelectorAll("li"));var dragLeft=function(distance,threshold){var currentTranslateX=getTranslateX(list);var translateX=Math.round(currentTranslateX+distance);if(dragLeftBoundary(translateX,threshold))return;updateTranslateX(list,translateX)};var dragLeftEnd=function(distance,threshold){var currentTranslateX=getTranslateX(list);var translateX=Math.round(currentTranslateX+distance);if(dragLeftBoundary(translateX,threshold)){translateX=0}updateTranslateX(list,translateX)};var dragRight=function(distance,threshold){var listWidth=list.getBoundingClientRect().width;var currentTranslateX=getTranslateX(list);var translateX=Math.round(currentTranslateX+distance);var itemsTotalWidth=getItemsTotalWidth(listItems);if(dragRightBoundary(translateX,itemsTotalWidth,listWidth,threshold)){return}updateTranslateX(list,translateX)};var dragRightEnd=function(distance,threshold){var listWidth=list.getBoundingClientRect().width;var currentTranslateX=getTranslateX(list);var itemsTotalWidth=getItemsTotalWidth(listItems);var translateX=Math.round(currentTranslateX+distance);if(dragRightBoundary(translateX,itemsTotalWidth,listWidth,threshold)){translateX=-(itemsTotalWidth-listWidth+threshold)}updateTranslateX(list,translateX)};var touchStartX;var touchstartHandler=function(e){var _e_touches_;touchStartX=(_e_touches_=e.touches[0])===null||_e_touches_===void 0?void 0:_e_touches_.clientX};var touchmoveHandler=function(e){var distance=getDistance(e,touchStartX);if(withinBuffer(distance))return;distance>0?dragLeft(distance,24):dragRight(distance,96)};var touchendHandler=function(e){var distance=getDistance(e,touchStartX);if(withinBuffer(distance))return;distance>0?dragLeftEnd(distance,24):dragRightEnd(distance,48)};var focusSuggestionsHandler=function(){suggestions.classList.add("max-h-96")};var blurSuggestionsHandler=function(e){if(e.relatedTarget===suggestions.querySelectorAll("a")[0]){return}suggestions.classList.remove("max-h-96")};var wheelHandler=function(e){var distance=e.deltaY*4;if(withinBuffer(distance))return;distance>0?dragLeftEnd(distance,24):dragRightEnd(distance,48)};suggestionsToggle.addEventListener("focus",focusSuggestionsHandler);suggestionsToggle.addEventListener("blur",blurSuggestionsHandler);suggestions.addEventListener("touchstart",touchstartHandler);suggestions.addEventListener("touchmove",touchmoveHandler);suggestions.addEventListener("touchend",touchendHandler);suggestions.addEventListener("wheel",wheelHandler);return{teardown:function(){suggestionsToggle.removeEventListener("focus",focusSuggestionsHandler);suggestionsToggle.removeEventListener("blur",blurSuggestionsHandler);suggestions.removeEventListener("touchstart",touchstartHandler);suggestions.removeEventListener("touchmove",touchmoveHandler);suggestions.removeEventListener("touchend",touchendHandler)},clear:function(){suggestions.classList.remove("max-h-96");list.style.transform="translateX(0px)"}}};export default MeganavSearchSuggestions;
+import{queryId}from"../dom-query";const DRAG_BUFFER=5;const getTranslateX=node=>new DOMMatrix(window.getComputedStyle(node).transform).e;const updateTranslateX=(node,value)=>node.style.transform=`translateX(${value}px)`;const dragLeftBoundary=(translateX,threshold)=>translateX>=threshold;const dragRightBoundary=(translateX,itemsWidth,windowWidth,threshold)=>Math.abs(translateX-windowWidth+threshold)>itemsWidth;const getDistance=(e,touchStartX)=>{var _e_changedTouches_;return((_e_changedTouches_=e.changedTouches[0])===null||_e_changedTouches_===void 0?void 0:_e_changedTouches_.clientX)-touchStartX};const withinBuffer=distance=>Math.abs(distance)<DRAG_BUFFER;const getItemsTotalWidth=nodes=>nodes.map(item=>item.getBoundingClientRect().width).reduce((acc,val)=>acc+val,0);const MeganavSearchSuggestions=()=>{const suggestionsToggle=queryId("meganav-mobile-search-input");const suggestions=queryId("meganav-mobile-search-suggestions");const list=suggestions.querySelector("ul");const listItems=Array.from(list.querySelectorAll("li"));const dragLeft=(distance,threshold)=>{const currentTranslateX=getTranslateX(list);const translateX=Math.round(currentTranslateX+distance);if(dragLeftBoundary(translateX,threshold))return;updateTranslateX(list,translateX)};const dragLeftEnd=(distance,threshold)=>{const currentTranslateX=getTranslateX(list);let translateX=Math.round(currentTranslateX+distance);if(dragLeftBoundary(translateX,threshold)){translateX=0}updateTranslateX(list,translateX)};const dragRight=(distance,threshold)=>{const listWidth=list.getBoundingClientRect().width;const currentTranslateX=getTranslateX(list);const translateX=Math.round(currentTranslateX+distance);const itemsTotalWidth=getItemsTotalWidth(listItems);if(dragRightBoundary(translateX,itemsTotalWidth,listWidth,threshold)){return}updateTranslateX(list,translateX)};const dragRightEnd=(distance,threshold)=>{const listWidth=list.getBoundingClientRect().width;const currentTranslateX=getTranslateX(list);const itemsTotalWidth=getItemsTotalWidth(listItems);let translateX=Math.round(currentTranslateX+distance);if(dragRightBoundary(translateX,itemsTotalWidth,listWidth,threshold)){translateX=-(itemsTotalWidth-listWidth+threshold)}updateTranslateX(list,translateX)};let touchStartX;const touchstartHandler=e=>{var _e_touches_;touchStartX=(_e_touches_=e.touches[0])===null||_e_touches_===void 0?void 0:_e_touches_.clientX};const touchmoveHandler=e=>{const distance=getDistance(e,touchStartX);if(withinBuffer(distance))return;distance>0?dragLeft(distance,24):dragRight(distance,96)};const touchendHandler=e=>{const distance=getDistance(e,touchStartX);if(withinBuffer(distance))return;distance>0?dragLeftEnd(distance,24):dragRightEnd(distance,48)};const focusSuggestionsHandler=()=>{suggestions.classList.add("max-h-96")};const blurSuggestionsHandler=e=>{if(e.relatedTarget===suggestions.querySelectorAll("a")[0]){return}suggestions.classList.remove("max-h-96")};const wheelHandler=e=>{const distance=e.deltaY*4;if(withinBuffer(distance))return;distance>0?dragLeftEnd(distance,24):dragRightEnd(distance,48)};suggestionsToggle.addEventListener("focus",focusSuggestionsHandler);suggestionsToggle.addEventListener("blur",blurSuggestionsHandler);suggestions.addEventListener("touchstart",touchstartHandler);suggestions.addEventListener("touchmove",touchmoveHandler);suggestions.addEventListener("touchend",touchendHandler);suggestions.addEventListener("wheel",wheelHandler);return{teardown:()=>{suggestionsToggle.removeEventListener("focus",focusSuggestionsHandler);suggestionsToggle.removeEventListener("blur",blurSuggestionsHandler);suggestions.removeEventListener("touchstart",touchstartHandler);suggestions.removeEventListener("touchmove",touchmoveHandler);suggestions.removeEventListener("touchend",touchendHandler)},clear:()=>{suggestions.classList.remove("max-h-96");list.style.transform=`translateX(0px)`}}};export default MeganavSearchSuggestions;

package/core/MeganavSearchSuggestions.js

@@ -0,0 +1 @@
+import React from"react";import FeaturedLink from"./FeaturedLink";const MeganavSearchSuggestions=({absUrl,displaySupportLink})=>React.createElement(React.Fragment,null,React.createElement("p",{className:"ui-text-overline2 text-cool-black py-12"},"Popular pages"),React.createElement("div",{className:"flex justify-between items-center overflow-hidden"},React.createElement("ul",{className:"flex transition-transform"},React.createElement("li",{className:"py-12 pr-8 flex-shrink-0"},React.createElement("a",{href:absUrl("/docs/how-ably-works"),className:"ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"},"How does Ably work?")),React.createElement("li",{className:"py-12 px-8 flex-shrink-0"},React.createElement("a",{href:absUrl("/docs/quick-start-guide"),className:"ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"},"Quickstart guide")),React.createElement("li",{className:"py-12 px-8 flex-shrink-0"},React.createElement("a",{href:absUrl("/docs/core-features/pubsub"),className:"ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"},"Publish/Subscribe Messaging")),React.createElement("li",{className:"py-12 pl-8 flex-shrink-0"},React.createElement("a",{href:absUrl("/platform"),className:"ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"},"Platform"))),displaySupportLink?React.createElement(FeaturedLink,{url:absUrl("/support"),textSize:"text-p2"},"Support"):null));export default MeganavSearchSuggestions;

package/core/Notice/component.js

@@ -1 +1 @@
-function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}import"./component.css";import Cookie from"js-cookie";import throttle from"lodash.throttle";import{queryId}from"../dom-query";import{FLASH_DATA_ID}from"../Flash/component.tsx";var COOKIE_EXPIRY=90;var COLLAPSE_TRIGGER_DISTANCE=5;var SCROLL_LISTENER_THROTTLE=100;var RESIZE_LISTENER_THROTTLE=100;var isMdViewport=function(){return!window.matchMedia("(min-width: 65rem)").matches};var adjustFlashMargin=function(open){var flash=queryId(FLASH_DATA_ID);if(flash){flash.style.marginTop=open?"4rem":null}};var hideOnMobile=function(bannerContainer){if(isMdViewport()){bannerContainer.style.display="none"}else{bannerContainer.style.display=null}};var hideNotice=function(bannerContainer){bannerContainer.style.maxHeight=0;bannerContainer.style.overflow="hidden";adjustFlashMargin(false)};var showNotice=function(bannerContainer){bannerContainer.style.maxHeight=null;bannerContainer.style.overflow=null;adjustFlashMargin(true)};var setupRememberClosed=function(cookieId,noticeId){var cookie=Cookie.get(cookieId)||"";Cookie.set(cookieId,"".concat(cookie.replace("".concat(noticeId,","),"")+noticeId,","),{expires:COOKIE_EXPIRY})};var hasBeenClosedBefore=function(cookieId,noticeId){return(Cookie.get(cookieId)||"").includes(noticeId)};var setupNoticeCollapse=function(bannerContainer){var scrollTop=window.scrollY;if(scrollTop>COLLAPSE_TRIGGER_DISTANCE){hideNotice(bannerContainer)}var listener=throttle(function(){var scrollTop=window.scrollY;if(scrollTop>COLLAPSE_TRIGGER_DISTANCE){hideNotice(bannerContainer)}else if(bannerContainer.style.overflow){showNotice(bannerContainer)}},SCROLL_LISTENER_THROTTLE);document.addEventListener("scroll",listener);return function(){return document.removeEventListener("scroll",listener)}};var setupCloseBtn=function(bannerContainer,cookieId,noticeId,collapseUnmountListeners){var closeBtn=bannerContainer.querySelector("button");if(!closeBtn)return function(){};var listener=function(){if(cookieId&&noticeId)setupRememberClosed(cookieId,noticeId);hideNotice(bannerContainer);collapseUnmountListeners()};closeBtn.addEventListener("click",listener);return function(){return document.removeEventListener("click",listener)}};var resizeHandler=function(bannerContainer){var handler=throttle(function(){hideOnMobile(bannerContainer)},RESIZE_LISTENER_THROTTLE);window.addEventListener("resize",handler);return function(){return window.removeEventListener("resize",handler)}};var Notice=function(param){var bannerContainer=param.bannerContainer,cookieId=param.cookieId,noticeId=param.noticeId,options=param.options;if(typeof window==="undefined")return function(){};if(!bannerContainer){console.warn("A Notice component was initited but no notice container was found.");return function(){}}if(hasBeenClosedBefore(cookieId,noticeId))return function(){};hideOnMobile(bannerContainer);showNotice(bannerContainer);var opts=_object_spread({collapse:true},options);var collapseUnmountListeners=opts.collapse?setupNoticeCollapse(bannerContainer):function(){};var closeBtnUnmountListeners=setupCloseBtn(bannerContainer,cookieId,noticeId,collapseUnmountListeners);var resizeUnmountListener=resizeHandler(bannerContainer);return function(){[closeBtnUnmountListeners,collapseUnmountListeners,resizeUnmountListener].forEach(function(unmount){return unmount()})}};export default Notice;
+import"./component.css";import Cookie from"js-cookie";import throttle from"lodash.throttle";import{queryId}from"../dom-query";import{FLASH_DATA_ID}from"../Flash";const COOKIE_EXPIRY=90;const COLLAPSE_TRIGGER_DISTANCE=5;const SCROLL_LISTENER_THROTTLE=100;const RESIZE_LISTENER_THROTTLE=100;const isMdViewport=()=>!window.matchMedia(`(min-width: 65rem)`).matches;const adjustFlashMargin=open=>{const flash=queryId(FLASH_DATA_ID);if(flash){flash.style.marginTop=open?`4rem`:null}};const hideOnMobile=bannerContainer=>{if(isMdViewport()){bannerContainer.style.display="none"}else{bannerContainer.style.display=null}};const hideNotice=bannerContainer=>{bannerContainer.style.maxHeight=0;bannerContainer.style.overflow="hidden";adjustFlashMargin(false)};const showNotice=bannerContainer=>{bannerContainer.style.maxHeight=null;bannerContainer.style.overflow=null;adjustFlashMargin(true)};const setupRememberClosed=(cookieId,noticeId)=>{const cookie=Cookie.get(cookieId)||"";Cookie.set(cookieId,`${cookie.replace(`${noticeId},`,"")+noticeId},`,{expires:COOKIE_EXPIRY})};const hasBeenClosedBefore=(cookieId,noticeId)=>(Cookie.get(cookieId)||"").includes(noticeId);const setupNoticeCollapse=bannerContainer=>{const scrollTop=window.scrollY;if(scrollTop>COLLAPSE_TRIGGER_DISTANCE){hideNotice(bannerContainer)}const listener=throttle(()=>{const scrollTop=window.scrollY;if(scrollTop>COLLAPSE_TRIGGER_DISTANCE){hideNotice(bannerContainer)}else if(bannerContainer.style.overflow){showNotice(bannerContainer)}},SCROLL_LISTENER_THROTTLE);document.addEventListener("scroll",listener);return()=>document.removeEventListener("scroll",listener)};const setupCloseBtn=(bannerContainer,cookieId,noticeId,collapseUnmountListeners)=>{const closeBtn=bannerContainer.querySelector("button");if(!closeBtn)return()=>{};const listener=()=>{if(cookieId&&noticeId)setupRememberClosed(cookieId,noticeId);hideNotice(bannerContainer);collapseUnmountListeners()};closeBtn.addEventListener("click",listener);return()=>document.removeEventListener("click",listener)};const resizeHandler=bannerContainer=>{const handler=throttle(()=>{hideOnMobile(bannerContainer)},RESIZE_LISTENER_THROTTLE);window.addEventListener("resize",handler);return()=>window.removeEventListener("resize",handler)};const Notice=({bannerContainer,cookieId,noticeId,options})=>{if(typeof window==="undefined")return()=>{};if(!bannerContainer){console.warn("A Notice component was initited but no notice container was found.");return()=>{}}if(hasBeenClosedBefore(cookieId,noticeId))return()=>{};hideOnMobile(bannerContainer);showNotice(bannerContainer);const opts={collapse:true,...options};const collapseUnmountListeners=opts.collapse?setupNoticeCollapse(bannerContainer):()=>{};const closeBtnUnmountListeners=setupCloseBtn(bannerContainer,cookieId,noticeId,collapseUnmountListeners);const resizeUnmountListener=resizeHandler(bannerContainer);return()=>{[closeBtnUnmountListeners,collapseUnmountListeners,resizeUnmountListener].forEach(unmount=>unmount())}};export default Notice;

package/core/Notice.js

@@ -0,0 +1 @@
+import React,{useEffect}from"react";import NoticeScripts from"./Notice/component.js";import"./Notice/component.css";import Icon from"./Icon";const contentWrapperClasses="w-full pr-8 ui-text-p3 self-center";const ContentWrapper=({buttonLink,children})=>buttonLink?React.createElement("a",{href:buttonLink,className:contentWrapperClasses},children):React.createElement("div",{className:contentWrapperClasses},children);const Notice=({buttonLink,buttonLabel,bodyText,title,config,closeBtn,bgColor="bg-gradient-active-orange",textColor="text-white"})=>{useEffect(()=>{NoticeScripts({bannerContainer:document.querySelector('[data-id="ui-notice"]'),cookieId:config===null||config===void 0?void 0:config.cookieId,noticeId:config===null||config===void 0?void 0:config.noticeId,options:{collapse:(config===null||config===void 0?void 0:config.collapse)||false}})},[]);const wrapperClasses=["ui-announcement",bgColor,textColor].join(" ");return React.createElement("div",{className:wrapperClasses,"data-id":"ui-notice",style:{maxHeight:0,overflow:"hidden"}},React.createElement("div",{className:"ui-grid-px py-16 max-w-screen-xl mx-auto flex items-start"},React.createElement(ContentWrapper,{buttonLink:buttonLink!==null&&buttonLink!==void 0?buttonLink:"#"},React.createElement("strong",{className:"font-bold whitespace-nowrap pr-4"},title),React.createElement("span",{className:"pr-4"},bodyText),buttonLabel&&React.createElement("span",{className:"underline cursor-pointer whitespace-nowrap"},buttonLabel)),closeBtn&&React.createElement("button",{type:"button",className:"ml-auto h-20 w-20 border-none bg-none self-baseline"},React.createElement(Icon,{name:"icon-gui-close",size:"1.25rem",color:"text-cool-black"}))))};export default Notice;

package/core/SignOutLink.js

@@ -0,0 +1 @@
+import React,{useRef}from"react";const SignOutLink=({token,href,text,children,absUrl})=>{const formRef=useRef(null);const onClick=e=>{var _formRef_current;(_formRef_current=formRef.current)===null||_formRef_current===void 0?void 0:_formRef_current.submit();e.preventDefault()};return React.createElement(React.Fragment,null,React.createElement("form",{ref:formRef,method:"post",action:absUrl(href),className:"hidden"},React.createElement("input",{name:"_method",value:"delete",type:"hidden"}),React.createElement("input",{name:"authenticity_token",value:token,type:"hidden"})),children({href,text,onClick}))};export default SignOutLink;

package/core/Slider/component.js

@@ -1 +1 @@
-import"./component.css";import throttle from"lodash.throttle";import{queryId,queryIdAll}from"../dom-query";var mdBreakpoint=function(){return window.matchMedia("(min-width: 48rem)").matches};var DRAG_BUFFER=20;var init=function(slidesContainer){var transformContainer=queryId("slider-strip",slidesContainer);var slides=Array.from(queryIdAll("slider-slide",slidesContainer));var slideLeftChevron=queryId("slider-previous",slidesContainer);var slideRightChevron=queryId("slider-next",slidesContainer);var slideMarkers=Array.from(queryIdAll("slider-marker",slidesContainer));var sliderControls=queryId("slider-controls",slidesContainer);sliderControls.classList.replace("hidden","flex");var slidesLength=slides.length;var slidesWidth=slidesContainer.getBoundingClientRect().width;var _slides__getBoundingClientRect=slides[0].getBoundingClientRect(),slideWidth=_slides__getBoundingClientRect.width,slideLeftDistance=_slides__getBoundingClientRect.left;var _slides__getBoundingClientRect1=slides[1].getBoundingClientRect(),slideLeftDistanceSecond=_slides__getBoundingClientRect1.left;var slideGap=slideLeftDistanceSecond-slideLeftDistance-slideWidth;var adjustment=(slidesWidth-slideWidth)/2;var currentIndex=0;var touchStartX=0;var calculateTransform=function(index){return index*-slideWidth+adjustment+index*-slideGap};var updateSlide=function(index){return transformContainer.style.transform="translateX(".concat(calculateTransform(index),"px)")};var updateMarkers=function(index){slideMarkers.forEach(function(marker){return marker.classList.remove("text-active-orange")});slideMarkers[index].classList.remove("text-cool-black");slideMarkers[index].classList.add("text-active-orange")};var slideLeft=function(){currentIndex=currentIndex-1<=0?0:currentIndex-1;updateSlide(currentIndex);updateMarkers(currentIndex)};var slideRight=function(){currentIndex=currentIndex+1>=slidesLength?currentIndex:currentIndex+1;updateSlide(currentIndex);updateMarkers(currentIndex)};updateSlide(0);updateMarkers(0);slideLeftChevron.addEventListener("click",slideLeft);transformContainer.addEventListener("touchstart",function(e){var _e_touches_;touchStartX=(_e_touches_=e.touches[0])===null||_e_touches_===void 0?void 0:_e_touches_.clientX});transformContainer.addEventListener("touchend",function(e){var _e_changedTouches_;var distance=((_e_changedTouches_=e.changedTouches[0])===null||_e_changedTouches_===void 0?void 0:_e_changedTouches_.clientX)-touchStartX;if(Math.abs(distance)<DRAG_BUFFER)return;var direction=distance>0?slideLeft:slideRight;direction()});slideRightChevron.addEventListener("click",slideRight);return function(){transformContainer.style.transform=null;sliderControls.classList.replace("flex","hidden")}};var Slider=function(param){var container=param.container,mqEnableThreshold=param.mqEnableThreshold;if(!container)return;var breakpointCheck=mqEnableThreshold||function(){return!mdBreakpoint()};var unmount=function(){};if(breakpointCheck())unmount=init(container);window.addEventListener("resize",throttle(function(){if(breakpointCheck()){unmount=init(container)}else{unmount()}},100))};export default Slider;createElement("button",{type:"button",className:"p-0 w-24 h-24 flex items-center focus:outline-gui-focus","data-id":"slider-previous"},React.createElement(Icon,{name:"icon-gui-disclosure-arrow",size:"1.5rem",color:"text-cool-black",additionalCSS:"transform rotate-180","data-id":"meganav-control-mobile-dropdown-menu"})),React.createElement("ul",{className:"flex justify-center items-center mx-32 relative h-24"},slides.map(function(_,i){return React.createElement("li",{key:i},React.createElement("span",{className:"ui-slider-marker text-cool-black","data-id":"slider-marker"},"⬤")," ")})),React.createElement("button",{type:"button",className:"p-0 w-24 h-24 flex items-center focus:outline-gui-focus","data-id":"slider-next"},React.createElement(Icon,{name:"icon-gui-disclosure-arrow",size:"1.5rem",color:"text-cool-black","data-id":"meganav-control-mobile-dropdown-menu"}))))};export default Slider;
+import"./component.css";import throttle from"lodash.throttle";import{queryId,queryIdAll}from"../dom-query";const mdBreakpoint=()=>window.matchMedia("(min-width: 48rem)").matches;const DRAG_BUFFER=20;const init=slidesContainer=>{const transformContainer=queryId("slider-strip",slidesContainer);const slides=Array.from(queryIdAll("slider-slide",slidesContainer));const slideLeftChevron=queryId("slider-previous",slidesContainer);const slideRightChevron=queryId("slider-next",slidesContainer);const slideMarkers=Array.from(queryIdAll("slider-marker",slidesContainer));const sliderControls=queryId("slider-controls",slidesContainer);sliderControls.classList.replace("hidden","flex");const slidesLength=slides.length;const slidesWidth=slidesContainer.getBoundingClientRect().width;const{width:slideWidth,left:slideLeftDistance}=slides[0].getBoundingClientRect();const{left:slideLeftDistanceSecond}=slides[1].getBoundingClientRect();const slideGap=slideLeftDistanceSecond-slideLeftDistance-slideWidth;const adjustment=(slidesWidth-slideWidth)/2;let currentIndex=0;let touchStartX=0;const calculateTransform=index=>index*-slideWidth+adjustment+index*-slideGap;const updateSlide=index=>transformContainer.style.transform=`translateX(${calculateTransform(index)}px)`;const updateMarkers=index=>{slideMarkers.forEach(marker=>marker.classList.remove("text-active-orange"));slideMarkers[index].classList.remove("text-cool-black");slideMarkers[index].classList.add("text-active-orange")};const slideLeft=()=>{currentIndex=currentIndex-1<=0?0:currentIndex-1;updateSlide(currentIndex);updateMarkers(currentIndex)};const slideRight=()=>{currentIndex=currentIndex+1>=slidesLength?currentIndex:currentIndex+1;updateSlide(currentIndex);updateMarkers(currentIndex)};updateSlide(0);updateMarkers(0);slideLeftChevron.addEventListener("click",slideLeft);transformContainer.addEventListener("touchstart",e=>{var _e_touches_;touchStartX=(_e_touches_=e.touches[0])===null||_e_touches_===void 0?void 0:_e_touches_.clientX});transformContainer.addEventListener("touchend",e=>{var _e_changedTouches_;const distance=((_e_changedTouches_=e.changedTouches[0])===null||_e_changedTouches_===void 0?void 0:_e_changedTouches_.clientX)-touchStartX;if(Math.abs(distance)<DRAG_BUFFER)return;const direction=distance>0?slideLeft:slideRight;direction()});slideRightChevron.addEventListener("click",slideRight);return()=>{transformContainer.style.transform=null;sliderControls.classList.replace("flex","hidden")}};const Slider=({container,mqEnableThreshold})=>{if(!container)return;const breakpointCheck=mqEnableThreshold||(()=>!mdBreakpoint());let unmount=()=>{};if(breakpointCheck())unmount=init(container);window.addEventListener("resize",throttle(()=>{if(breakpointCheck()){unmount=init(container)}else{unmount()}},100))};export default Slider;

package/core/Slider.js

@@ -0,0 +1 @@
+import React,{useEffect,useRef}from"react";import Icon from"./Icon";import SliderScripts from"./Slider/component.js";import"./Slider/component.css";const Slider=({slides=[],classes="",slideClasses="",slideMinWidth="16.875rem",slideMaxWidth="1fr",mqEnableThreshold=()=>true,...props})=>{const containerRef=useRef(null);useEffect(()=>{SliderScripts({container:containerRef.current,mqEnableThreshold})},[]);if(slides.length===0)return;return React.createElement("div",{className:"w-full overflow-x-hidden","data-id":"slider",style:{"--dynamic-grid-columns-count":slides.length,"--dynamic-grid-column-min-width":slideMinWidth,"--dynamic-grid-column-max-width":slideMaxWidth},ref:containerRef},React.createElement("ol",{className:`grid ui-grid-gap grid-cols-dynamic transform transition-transform ${classes}`,"data-id":"slider-strip",...props},slides.map((slide,i)=>React.createElement("li",{key:i,className:slideClasses,"data-id":"slider-slide"},slide))),React.createElement("div",{className:"justify-center items-center my-24 hidden","data-id":"slider-controls"},React.createElement("button",{type:"button",className:"p-0 w-24 h-24 flex items-center focus:outline-gui-focus","data-id":"slider-previous"},React.createElement(Icon,{name:"icon-gui-disclosure-arrow",size:"1.5rem",color:"text-cool-black",additionalCSS:"transform rotate-180","data-id":"meganav-control-mobile-dropdown-menu"})),React.createElement("ul",{className:"flex justify-center items-center mx-32 relative h-24"},slides.map((_,i)=>React.createElement("li",{key:i},React.createElement("span",{className:"ui-slider-marker text-cool-black","data-id":"slider-marker"},"⬤")," "))),React.createElement("button",{type:"button",className:"p-0 w-24 h-24 flex items-center focus:outline-gui-focus","data-id":"slider-next"},React.createElement(Icon,{name:"icon-gui-disclosure-arrow",size:"1.5rem",color:"text-cool-black","data-id":"meganav-control-mobile-dropdown-menu"}))))};export default Slider;

package/core/Table/Table.js

@@ -1 +1 @@
-import React,{cloneElement}from"react";export var Table=function(param){var id=param.id,children=param.children;return React.createElement("table",{id:id,className:"ui-standard-container mb-4 sm:table-fixed"},children)};export var TableBody=function(param){var children=param.children;return React.createElement("tbody",null,children)};export var TableHeader=function(param){var children=param.children;return React.createElement("thead",{className:"sticky bg-white z-10 top-0",key:"sticky-block"},cloneElement(children,{isHeader:true}))};export var TableRowHeader=function(param){var children=param.children;return React.createElement("tr",{className:"-ml-24 mt-8 sm:ml-0 sm:mt-0 ui-text-overline1 !text-cool-black  bg-light-grey sm:sticky z-10",style:{top:"4rem"}},cloneElement(children,{isRowHeader:true}))};
+import React,{cloneElement}from"react";export const Table=({id,children})=>React.createElement("table",{id:id,className:"ui-standard-container mb-4 sm:table-fixed"},children);export const TableBody=({children})=>React.createElement("tbody",null,children);export const TableHeader=({children})=>React.createElement("thead",{className:"sticky bg-white z-10 top-0",key:"sticky-block"},cloneElement(children,{isHeader:true}));export const TableRowHeader=({children})=>React.createElement("tr",{className:"-ml-24 mt-8 sm:ml-0 sm:mt-0 ui-text-overline1 !text-cool-black  bg-light-grey sm:sticky z-10",style:{top:"4rem"}},cloneElement(children,{isRowHeader:true}));

package/core/Table/TableCell.js

@@ -1 +1,7 @@
-function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}import React from"react";import Icon from"../Icon/component.tsx";var Supported=function(){return React.createElement(Icon,{name:"icon-gui-check-circled-fill",size:"1.5rem",color:"text-gui-success",additionalCSS:"flex-grow-0 flex-shrink-0","data-testid":"supported-icon"})};var Unsupported=function(){return React.createElement(Icon,{name:"icon-gui-cross-circled-fill",size:"1.5rem",color:"text-gui-error",additionalCSS:"flex-grow-0 flex-shrink-0","data-testid":"unsupported-icon"})};var LabelCell=function(_param){var children=_param.children,rest=_object_without_properties(_param,["children"]);var _rest_className;var classes="\n    ui-text-p1 !font-bold pt-24 pb-8 border-light-grey sm:p-24 sm:relative sm:top-2 flex sm:table-cell ".concat((_rest_className=rest.className)!==null&&_rest_className!==void 0?_rest_className:"","\n  ");return React.createElement("td",_object_spread_props(_object_spread({},rest),{className:classes}),children)};var TableCell=function(_param){var children=_param.children,isRowHeader=_param.isRowHeader,rest=_object_without_properties(_param,["children","isRowHeader"]);var _rest_className;return React.createElement("td",_object_spread_props(_object_spread({},rest),{className:"\n        border-light-grey sm:p-24 leading-none flex sm:table-cell\n        ".concat(isRowHeader?"rounded-l-none rounded-r sm:rounded-lg py-20 px-24":"py-6","\n        ").concat((_rest_className=rest.className)!==null&&_rest_className!==void 0?_rest_className:"","\n      ")}),children)};var HeaderCell=function(_param){var children=_param.children,rest=_object_without_properties(_param,["children"]);return React.createElement("td",_object_spread_props(_object_spread({},rest),{className:"ui-text-h3 px-24 py-24 hidden sm:table-cell"}),children)};var CtaCell=function(_param){var children=_param.children,rest=_object_without_properties(_param,["children"]);return React.createElement("td",_object_spread_props(_object_spread({},rest),{className:"pt-24 hidden sm:table-cell"}),children)};export{TableCell,LabelCell,HeaderCell,CtaCell,Supported,Unsupported};
+import React from"react";import Icon from"../Icon";const Supported=()=>React.createElement(Icon,{name:"icon-gui-check-circled-fill",size:"1.5rem",color:"text-gui-success",additionalCSS:"flex-grow-0 flex-shrink-0","data-testid":"supported-icon"});const Unsupported=()=>React.createElement(Icon,{name:"icon-gui-cross-circled-fill",size:"1.5rem",color:"text-gui-error",additionalCSS:"flex-grow-0 flex-shrink-0","data-testid":"unsupported-icon"});const LabelCell=({children,...rest})=>{var _rest_className;const classes=`
+    ui-text-p1 !font-bold pt-24 pb-8 border-light-grey sm:p-24 sm:relative sm:top-2 flex sm:table-cell ${(_rest_className=rest.className)!==null&&_rest_className!==void 0?_rest_className:""}
+  `;return React.createElement("td",{...rest,className:classes},children)};const TableCell=({children,isRowHeader,...rest})=>{var _rest_className;return React.createElement("td",{...rest,className:`
+        border-light-grey sm:p-24 leading-none flex sm:table-cell
+        ${isRowHeader?"rounded-l-none rounded-r sm:rounded-lg py-20 px-24":"py-6"}
+        ${(_rest_className=rest.className)!==null&&_rest_className!==void 0?_rest_className:""}
+      `},children)};const HeaderCell=({children,...rest})=>React.createElement("td",{...rest,className:"ui-text-h3 px-24 py-24 hidden sm:table-cell"},children);const CtaCell=({children,...rest})=>React.createElement("td",{...rest,className:"pt-24 hidden sm:table-cell"},children);export{TableCell,LabelCell,HeaderCell,CtaCell,Supported,Unsupported};

package/core/Table/TableRow.js

@@ -1 +1 @@
-function _object_without_properties(source,excluded){if(source==null)return{};var target=_object_without_properties_loose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _object_without_properties_loose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}import React from"react";var CtaRow=function(param){var children=param.children;return React.createElement("tr",null,React.createElement("td",{className:"hidden sm:block"}),children)};var TableRow=function(_param){var children=_param.children,isHeader=_param.isHeader,rest=_object_without_properties(_param,["children","isHeader"]);return React.createElement("tr",rest,isHeader&&React.createElement("td",{className:"bg-white"}),children)};export{TableRow,CtaRow};
+import React from"react";const CtaRow=({children})=>React.createElement("tr",null,React.createElement("td",{className:"hidden sm:block"}),children);const TableRow=({children,isHeader,...rest})=>React.createElement("tr",rest,isHeader&&React.createElement("td",{className:"bg-white"}),children);export{TableRow,CtaRow};

package/core/Table/data.js

@@ -0,0 +1 @@
+import React,{Fragment}from"react";import Tooltip from"../Tooltip";import{Supported,Unsupported}from"./TableCell";import Table from"../Table";const testRow=index=>({label:`Label ${index+1}`,cells:[{label:"text",content:"Cell content",column:"Free"},{label:"yes",content:React.createElement("div",{className:"flex items-center sm:flex-col sm:items-start"},React.createElement("span",{className:"sm:order-1 px-6 sm:py-6 sm:px-0"},"Supported"),React.createElement("span",{className:"sm:order-0"},React.createElement(Supported,null))),column:"PAYG"},{label:"no",content:React.createElement("div",{className:"flex items-center  sm:flex-col sm:items-start"},React.createElement("span",{className:"sm:order-1 px-6 sm:py-6 sm:px-0"},"Unsupported"),React.createElement("span",{className:"sm:order-0"},React.createElement(Unsupported,null))),column:"Custom"}]});const sections=["Features","Support","Technical Support"].map(label=>({label,rows:[...Array(5)].map((_,i)=>testRow(i))}));export const PricingPageTable=()=>{return React.createElement("div",{className:"ui-standard-container"},React.createElement("h2",{className:"ui-text-h2 text-center m-32"},"Pricing Page Table"),React.createElement("p",{className:"text-center m-32"},"Example content"),React.createElement(Table.Root,null,React.createElement(Table.Header,null,React.createElement(Table.Row,null,React.createElement(Table.Cell,null,React.createElement("span",{className:"ui-text-h3 hidden sm:block"},"Free")),React.createElement(Table.Cell,null,React.createElement("span",{className:"ui-text-h3 hidden sm:block"},"PAYG")),React.createElement(Table.Cell,null,React.createElement("span",{className:"ui-text-h3 hidden sm:block"},"Custom")))),React.createElement(Table.Body,null,sections.map(section=>React.createElement(Fragment,{key:section.label},React.createElement(Table.RowHeader,null,React.createElement(Table.Cell,{colSpan:4},section.label)),section.rows.map(row=>React.createElement(Table.Row,{key:row.label},React.createElement(Table.LabelCell,{key:row.label,className:"border-t border-light-grey"},React.createElement("a",{className:"ui-link",href:"#"},row.label),React.createElement(Tooltip,null,"Example tooltip")),row.cells.map(cell=>React.createElement(Table.Cell,{key:cell.label,className:"last:mb-16 sm:mb-0"},React.createElement("div",{className:"flex-1 sm:hidden !text-dark-grey ui-text-overline2"},cell.column),cell.content)))))),React.createElement(Table.Row,null,React.createElement(Table.Cell,null),React.createElement(Table.CtaCell,null,React.createElement("a",{href:"#",className:"ui-btn-secondary"},"Get started")),React.createElement(Table.CtaCell,null,React.createElement("a",{href:"#",className:"ui-btn-secondary"},"Get started")),React.createElement(Table.CtaCell,null,React.createElement("a",{href:"#",className:"ui-btn"},"Contact sales"))))))};

package/core/Table.js

@@ -0,0 +1 @@
+import{Table,TableRowHeader,TableHeader,TableBody}from"./Table/Table";import{TableRow}from"./Table/TableRow";import{TableCell,LabelCell,HeaderCell,CtaCell,Supported,Unsupported}from"./Table/TableCell";export default{Root:Table,Row:TableRow,Cell:TableCell,LabelCell,HeaderCell,CtaCell,RowHeader:TableRowHeader,Body:TableBody,Header:TableHeader,Supported,Unsupported};

package/core/Tooltip.js

@@ -0,0 +1 @@
+import React,{useEffect,useRef,useState}from"react";import Icon from"./Icon";const Tooltip=({children})=>{const[open,setOpen]=useState(false);const[position,setPosition]=useState({x:0,y:0});const offset=8;const reference=useRef(null);const floating=useRef(null);useEffect(()=>{if(open){var _floating_current,_reference_current;const floatingRect=(_floating_current=floating.current)===null||_floating_current===void 0?void 0:_floating_current.getBoundingClientRect();const referenceRect=(_reference_current=reference.current)===null||_reference_current===void 0?void 0:_reference_current.getBoundingClientRect();if(floatingRect&&referenceRect){setPosition({x:Math.min(floatingRect.width/2,floatingRect.left)-referenceRect.width/2,y:Math.min(floatingRect.height,floatingRect.top)+offset})}}else{setPosition({x:0,y:0})}},[open]);return React.createElement("div",{className:"relative inline-block align-top h-16"},React.createElement("button",{onMouseEnter:()=>setOpen(true),onMouseLeave:()=>setOpen(false),className:"ml-8 p-0 relative top-1 focus:outline-none",type:"button",ref:reference,"aria-describedby":"tooltip"},React.createElement(Icon,{name:"icon-gui-info",size:"1rem"})),open?React.createElement("div",{className:"bg-light-grey p-12 rounded pointer-events-none absolute z-20",role:"tooltip",ref:floating,style:{top:-position.y,left:-position.x,boxShadow:"4px 4px 15px rgba(0, 0, 0, 0.2)"}},React.createElement("div",{className:"w-256"},children)):null)};export default Tooltip;

package/core/css.js

@@ -1 +1 @@
-export var remsToPixelValue=function(remString){return parseFloat(remString)*parseFloat(getComputedStyle(document.documentElement).fontSize)};
+export const remsToPixelValue=remString=>parseFloat(remString)*parseFloat(getComputedStyle(document.documentElement).fontSize);

package/core/dom-query.js

@@ -1 +1 @@
-export var queryId=function(val){var root=arguments.length>1&&arguments[1]!==void 0?arguments[1]:document;return root.querySelector("[data-id=".concat(val,"]"))};export var queryIdAll=function(val){var root=arguments.length>1&&arguments[1]!==void 0?arguments[1]:document;return root.querySelectorAll("[data-id=".concat(val,"]"))};
+export const queryId=(val,root=document)=>root.querySelector(`[data-id=${val}]`);export const queryIdAll=(val,root=document)=>root.querySelectorAll(`[data-id=${val}]`);

package/core/hubspot-chat-toggle.js

@@ -1 +1 @@
-import{queryId}from"./dom-query";function enableBtn(el,text){el.disabled=false;el.innerText=text}function disableBtn(el,text){el.disabled=true;el.innerText=text}var WAIT_BETWEEN_RETRIES_MS=100;var MAX_RETRY_COUNT=30;export default function toggleChatWidget(){var params=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};var dataId=params.dataId;var container=queryId(dataId);var chatButton=queryId("open-chat-widget",container);var textEnabled=chatButton.dataset.enabledLabel;var textDisabled=chatButton.dataset.disabledLabel;if(!dataId||!container)return;var trigger=queryId("open-chat-widget",container);var clickHandler;var waitForScript=function(delay){var _window_HubSpotConversations,_window;var widget=(_window=window)===null||_window===void 0?void 0:(_window_HubSpotConversations=_window.HubSpotConversations)===null||_window_HubSpotConversations===void 0?void 0:_window_HubSpotConversations.widget;var iframe=document.querySelector("#hubspot-messages-iframe-container");clickHandler=function(e){e.preventDefault();widget.open()};if(widget&&iframe){trigger.addEventListener("click",clickHandler);enableBtn(trigger,textEnabled)}else if(--MAX_RETRY_COUNT){setTimeout(function(){return waitForScript(WAIT_BETWEEN_RETRIES_MS)},delay)}};disableBtn(trigger,textDisabled);waitForScript(0);return function(){disableBtn(trigger,textDisabled);trigger.removeEventListener("click",clickHandler)}}
+import{queryId}from"./dom-query";function enableBtn(el,text){el.disabled=false;el.innerText=text}function disableBtn(el,text){el.disabled=true;el.innerText=text}const WAIT_BETWEEN_RETRIES_MS=100;let MAX_RETRY_COUNT=30;export default function toggleChatWidget(params={}){const{dataId}=params;const container=queryId(dataId);const chatButton=queryId("open-chat-widget",container);const textEnabled=chatButton.dataset.enabledLabel;const textDisabled=chatButton.dataset.disabledLabel;if(!dataId||!container)return;const trigger=queryId("open-chat-widget",container);let clickHandler;const waitForScript=delay=>{var _window_HubSpotConversations,_window;const widget=(_window=window)===null||_window===void 0?void 0:(_window_HubSpotConversations=_window.HubSpotConversations)===null||_window_HubSpotConversations===void 0?void 0:_window_HubSpotConversations.widget;const iframe=document.querySelector("#hubspot-messages-iframe-container");clickHandler=e=>{e.preventDefault();widget.open()};if(widget&&iframe){trigger.addEventListener("click",clickHandler);enableBtn(trigger,textEnabled)}else if(--MAX_RETRY_COUNT){setTimeout(()=>waitForScript(WAIT_BETWEEN_RETRIES_MS),delay)}};disableBtn(trigger,textDisabled);waitForScript(0);return()=>{disableBtn(trigger,textDisabled);trigger.removeEventListener("click",clickHandler)}}

package/core/icons.js

@@ -1 +1 @@
-import{loadSprites}from"./scripts";import sprites from"../../core/sprites.svg";var loadIcons=function(){return loadSprites(sprites)};export default loadIcons;
+import{loadSprites}from"./scripts";import sprites from"../../core/sprites.svg";const loadIcons=()=>loadSprites(sprites);export default loadIcons;

package/core/load-sprites.js

@@ -1 +1 @@
-export default function(spritesUrl){fetch(spritesUrl).then(function(response){return response.text()}).then(function(image){var container=document.createElement("div");container.style.display="none";container.innerHTML=image;document.body.appendChild(container)}).catch(function(err){return console.error(err)})};
+export default(spritesUrl=>{fetch(spritesUrl).then(response=>response.text()).then(image=>{const container=document.createElement("div");container.style.display="none";container.innerHTML=image;document.body.appendChild(container)}).catch(err=>console.error(err))});

package/core/react-renderer.js

@@ -1 +1 @@
-import React from"react";import{createRoot}from"react-dom/client";var renderComponent=function(Component,props,node){var root=createRoot(node);root.render(React.createElement(Component,props))};export{renderComponent};export default function reactRenderer(components){var reactComponents=document.querySelectorAll("[data-react]");Array.from(reactComponents).forEach(function(node){var _node_getAttribute;var className=(_node_getAttribute=node.getAttribute("data-react"))!==null&&_node_getAttribute!==void 0?_node_getAttribute:"";var Constructor=components[className];if(!Constructor)return;var propsJson=node.getAttribute("data-react-props");var props=propsJson&&JSON.parse(propsJson||"");var root=createRoot(node);root.render(React.createElement(Constructor,props));node.removeAttribute("data-react");node.removeAttribute("data-react-props")})}
+import React from"react";import{createRoot}from"react-dom/client";const renderComponent=(Component,props,node)=>{const root=createRoot(node);root.render(React.createElement(Component,props))};export{renderComponent};export default function reactRenderer(components){const reactComponents=document.querySelectorAll("[data-react]");Array.from(reactComponents).forEach(node=>{var _node_getAttribute;const className=(_node_getAttribute=node.getAttribute("data-react"))!==null&&_node_getAttribute!==void 0?_node_getAttribute:"";const Constructor=components[className];if(!Constructor)return;const propsJson=node.getAttribute("data-react-props");const props=propsJson&&JSON.parse(propsJson||"");const root=createRoot(node);root.render(React.createElement(Constructor,props));node.removeAttribute("data-react");node.removeAttribute("data-react-props")})}

package/core/remote-blogs-posts.js

@@ -1 +1 @@
-function asyncGeneratorStep(gen,resolve,reject,_next,_throw,key,arg){try{var info=gen[key](arg);var value=info.value}catch(error){reject(error);return}if(info.done){resolve(value)}else{Promise.resolve(value).then(_next,_throw)}}function _async_to_generator(fn){return function(){var self=this,args=arguments;return new Promise(function(resolve,reject){var gen=fn.apply(self,args);function _next(value){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"next",value)}function _throw(err){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"throw",err)}_next(undefined)})}}function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _ts_generator(thisArg,body){var f,y,t,g,_={label:0,sent:function(){if(t[0]&1)throw t[1];return t[1]},trys:[],ops:[]};return g={next:verb(0),"throw":verb(1),"return":verb(2)},typeof Symbol==="function"&&(g[Symbol.iterator]=function(){return this}),g;function verb(n){return function(v){return step([n,v])}}function step(op){if(f)throw new TypeError("Generator is already executing.");while(_)try{if(f=1,y&&(t=op[0]&2?y["return"]:op[0]?y["throw"]||((t=y["return"])&&t.call(y),0):y.next)&&!(t=t.call(y,op[1])).done)return t;if(y=0,t)op=[op[0]&2,t.value];switch(op[0]){case 0:case 1:t=op;break;case 4:_.label++;return{value:op[1],done:false};case 5:_.label++;y=op[1];op=[0];continue;case 7:op=_.ops.pop();_.trys.pop();continue;default:if(!(t=_.trys,t=t.length>0&&t[t.length-1])&&(op[0]===6||op[0]===2)){_=0;continue}if(op[0]===3&&(!t||op[1]>t[0]&&op[1]<t[3])){_.label=op[1];break}if(op[0]===6&&_.label<t[1]){_.label=t[1];t=op;break}if(t&&_.label<t[2]){_.label=t[2];_.ops.push(op);break}if(t[2])_.ops.pop();_.trys.pop();continue}op=body.call(thisArg,_)}catch(e){op=[6,e];y=0}finally{f=t=0}if(op[0]&5)throw op[1];return{value:op[0]?op[1]:void 0,done:true}}}import{isJsonResponse}from"./remote-data-util";var fetchBlogPosts=function(){var _ref=_async_to_generator(function(store,blogUrl){var res,payload,e;return _ts_generator(this,function(_state){switch(_state.label){case 0:_state.trys.push([0,5,,6]);if(!blogUrl){console.log('Skipping fetching blog posts, invalid blogUrl: "'.concat(blogUrl,'"'));return[2]}return[4,fetch(blogUrl)];case 1:res=_state.sent();if(!isJsonResponse(res.headers.get("content-type")))return[3,3];return[4,res.json()];case 2:payload=_state.sent();store.dispatch({type:"blog/loaded",payload:payload});return[3,4];case 3:throw new Error("Blog posts url is not serving json");case 4:return[3,6];case 5:e=_state.sent();console.warn("Could not fetch blog posts due to error:",e);return[3,6];case 6:return[2]}})});return function fetchBlogPosts(store,blogUrl){return _ref.apply(this,arguments)}}();var initialState={recent:null};var REDUCER_KEY="blogPosts";var reducerBlogPosts=_define_property({},REDUCER_KEY,function(){var state=arguments.length>0&&arguments[0]!==void 0?arguments[0]:initialState,action=arguments.length>1?arguments[1]:void 0;switch(action.type){case"blog/loaded":return _object_spread_props(_object_spread({},state),{recent:action.payload});default:return state}});var selectRecentBlogPosts=function(store){var _store_getState_REDUCER_KEY;return(_store_getState_REDUCER_KEY=store.getState()[REDUCER_KEY])===null||_store_getState_REDUCER_KEY===void 0?void 0:_store_getState_REDUCER_KEY.recent};export{fetchBlogPosts,reducerBlogPosts,selectRecentBlogPosts};
+import{isJsonResponse}from"./remote-data-util";const fetchBlogPosts=async(store,blogUrl)=>{try{if(!blogUrl){console.log(`Skipping fetching blog posts, invalid blogUrl: "${blogUrl}"`);return}const res=await fetch(blogUrl);if(isJsonResponse(res.headers.get("content-type"))){const payload=await res.json();store.dispatch({type:"blog/loaded",payload})}else{throw new Error("Blog posts url is not serving json")}}catch(e){console.warn("Could not fetch blog posts due to error:",e)}};const initialState={recent:null};const REDUCER_KEY="blogPosts";const reducerBlogPosts={[REDUCER_KEY]:(state=initialState,action)=>{switch(action.type){case"blog/loaded":return{...state,recent:action.payload};default:return state}}};const selectRecentBlogPosts=store=>{var _store_getState_REDUCER_KEY;return(_store_getState_REDUCER_KEY=store.getState()[REDUCER_KEY])===null||_store_getState_REDUCER_KEY===void 0?void 0:_store_getState_REDUCER_KEY.recent};export{fetchBlogPosts,reducerBlogPosts,selectRecentBlogPosts};

package/core/remote-data-store.js

@@ -1 +1 @@
-import{createStore,combineReducers}from"redux";export var attachStoreToWindow=function(store){window.AblyUi=window.AblyUi||{};window.AblyUi.RemoteDataStore=store};export var getRemoteDataStore=function(){if(!window.AblyUi.RemoteDataStore){throw new Error("Remote store was called before one was created")}return window.AblyUi.RemoteDataStore};export var connectState=function(selector,setState){var store=getRemoteDataStore();var cachedOldState=selector(store);store.subscribe(function(){var newState=selector(store);if(newState===cachedOldState){return}cachedOldState=newState;setState(newState)})};export var createRemoteDataStore=function(reducers){return createStore(combineReducers(reducers))};
+import{createStore,combineReducers}from"redux";export const attachStoreToWindow=store=>{window.AblyUi=window.AblyUi||{};window.AblyUi.RemoteDataStore=store};export const getRemoteDataStore=()=>{if(!window.AblyUi.RemoteDataStore){throw new Error("Remote store was called before one was created")}return window.AblyUi.RemoteDataStore};export const connectState=(selector,setState)=>{const store=getRemoteDataStore();let cachedOldState=selector(store);store.subscribe(()=>{const newState=selector(store);if(newState===cachedOldState){return}cachedOldState=newState;setState(newState)})};export const createRemoteDataStore=reducers=>createStore(combineReducers(reducers));

package/core/remote-data-util.js

@@ -1 +1 @@
-export var isJsonResponse=function(contentType){return contentType&&contentType.includes("application/json")};
+export const isJsonResponse=contentType=>contentType&&contentType.includes("application/json");

package/core/remote-session-data.js

@@ -1 +1 @@
-function asyncGeneratorStep(gen,resolve,reject,_next,_throw,key,arg){try{var info=gen[key](arg);var value=info.value}catch(error){reject(error);return}if(info.done){resolve(value)}else{Promise.resolve(value).then(_next,_throw)}}function _async_to_generator(fn){return function(){var self=this,args=arguments;return new Promise(function(resolve,reject){var gen=fn.apply(self,args);function _next(value){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"next",value)}function _throw(err){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"throw",err)}_next(undefined)})}}function _define_property(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _object_spread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_define_property(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _object_spread_props(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _ts_generator(thisArg,body){var f,y,t,g,_={label:0,sent:function(){if(t[0]&1)throw t[1];return t[1]},trys:[],ops:[]};return g={next:verb(0),"throw":verb(1),"return":verb(2)},typeof Symbol==="function"&&(g[Symbol.iterator]=function(){return this}),g;function verb(n){return function(v){return step([n,v])}}function step(op){if(f)throw new TypeError("Generator is already executing.");while(_)try{if(f=1,y&&(t=op[0]&2?y["return"]:op[0]?y["throw"]||((t=y["return"])&&t.call(y),0):y.next)&&!(t=t.call(y,op[1])).done)return t;if(y=0,t)op=[op[0]&2,t.value];switch(op[0]){case 0:case 1:t=op;break;case 4:_.label++;return{value:op[1],done:false};case 5:_.label++;y=op[1];op=[0];continue;case 7:op=_.ops.pop();_.trys.pop();continue;default:if(!(t=_.trys,t=t.length>0&&t[t.length-1])&&(op[0]===6||op[0]===2)){_=0;continue}if(op[0]===3&&(!t||op[1]>t[0]&&op[1]<t[3])){_.label=op[1];break}if(op[0]===6&&_.label<t[1]){_.label=t[1];t=op;break}if(t&&_.label<t[2]){_.label=t[2];_.ops.push(op);break}if(t[2])_.ops.pop();_.trys.pop();continue}op=body.call(thisArg,_)}catch(e){op=[6,e];y=0}finally{f=t=0}if(op[0]&5)throw op[1];return{value:op[0]?op[1]:void 0,done:true}}}import{isJsonResponse}from"./remote-data-util";var NOT_FOUND_ERROR_CODE="not-found";var fetchSessionData=function(){var _ref=_async_to_generator(function(store,sessionUrl){var sessionLoaded,res,jsonResponse,payload,e;return _ts_generator(this,function(_state){switch(_state.label){case 0:sessionLoaded=function(){var payload=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};return store.dispatch({type:"session/loaded",payload:payload})};_state.label=1;case 1:_state.trys.push([1,4,,5]);if(!sessionUrl){console.log('Skipping fetching session, invalid sessionUrl: "'.concat(sessionUrl,'"'));sessionLoaded();return[2]}return[4,fetch(sessionUrl,{cache:"no-cache"})];case 2:res=_state.sent();jsonResponse=isJsonResponse(res.headers.get("content-type"));if(!jsonResponse){throw new Error("Session endpoint is not serving json")}return[4,res.json()];case 3:payload=_state.sent();if(payload.error===NOT_FOUND_ERROR_CODE){sessionLoaded()}else{sessionLoaded(payload)}return[3,5];case 4:e=_state.sent();sessionLoaded();console.warn("Could not fetch session data due to error:",e);return[3,5];case 5:return[2]}})});return function fetchSessionData(store,sessionUrl){return _ref.apply(this,arguments)}}();var initialState={data:null};var REDUCER_KEY="session";var reducerSessionData=_define_property({},REDUCER_KEY,function(){var state=arguments.length>0&&arguments[0]!==void 0?arguments[0]:initialState,action=arguments.length>1?arguments[1]:void 0;switch(action.type){case"session/loaded":return _object_spread_props(_object_spread({},state),{data:action.payload});default:return state}});var selectSessionData=function(store){var _store_getState_REDUCER_KEY;return(_store_getState_REDUCER_KEY=store.getState()[REDUCER_KEY])===null||_store_getState_REDUCER_KEY===void 0?void 0:_store_getState_REDUCER_KEY.data};export{fetchSessionData,reducerSessionData,selectSessionData};
+import{isJsonResponse}from"./remote-data-util";const NOT_FOUND_ERROR_CODE="not-found";const fetchSessionData=async(store,sessionUrl)=>{const sessionLoaded=(payload={})=>store.dispatch({type:"session/loaded",payload});try{if(!sessionUrl){console.log(`Skipping fetching session, invalid sessionUrl: "${sessionUrl}"`);sessionLoaded();return}const res=await fetch(sessionUrl,{cache:"no-cache"});const jsonResponse=isJsonResponse(res.headers.get("content-type"));if(!jsonResponse){throw new Error("Session endpoint is not serving json")}const payload=await res.json();if(payload.error===NOT_FOUND_ERROR_CODE){sessionLoaded()}else{sessionLoaded(payload)}}catch(e){sessionLoaded();console.warn("Could not fetch session data due to error:",e)}};const initialState={data:null};const REDUCER_KEY="session";const reducerSessionData={[REDUCER_KEY]:(state=initialState,action)=>{switch(action.type){case"session/loaded":return{...state,data:action.payload};default:return state}}};const selectSessionData=store=>{var _store_getState_REDUCER_KEY;return(_store_getState_REDUCER_KEY=store.getState()[REDUCER_KEY])===null||_store_getState_REDUCER_KEY===void 0?void 0:_store_getState_REDUCER_KEY.data};export{fetchSessionData,reducerSessionData,selectSessionData};

package/core/url-base.js

@@ -1 +1 @@
-var DEFAULT_URL_BASE="";var absUrl=function(path){var urlBase=arguments.length>1&&arguments[1]!==void 0?arguments[1]:DEFAULT_URL_BASE;return"".concat(urlBase).concat(path)};export default absUrl;
+const DEFAULT_URL_BASE="";const absUrl=(path,urlBase=DEFAULT_URL_BASE)=>{return`${urlBase}${path}`};export default absUrl;

package/core/utils/syntax-highlighter-registry.js

@@ -1 +1 @@
-import bash from"highlight.js/lib/languages/bash";import cpp from"highlight.js/lib/languages/cpp";import csharp from"highlight.js/lib/languages/csharp";import css from"highlight.js/lib/languages/css";import dart from"highlight.js/lib/languages/dart";import dos from"highlight.js/lib/languages/dos";import diff from"highlight.js/lib/languages/diff";import erlang from"highlight.js/lib/languages/erlang";import elixir from"highlight.js/lib/languages/elixir";import plaintext from"highlight.js/lib/languages/plaintext";import go from"highlight.js/lib/languages/go";import http from"highlight.js/lib/languages/http";import java from"highlight.js/lib/languages/java";import javascript from"highlight.js/lib/languages/javascript";import typescript from"highlight.js/lib/languages/typescript";import json from"highlight.js/lib/languages/json";import objectivec from"highlight.js/lib/languages/objectivec";import php from"highlight.js/lib/languages/php";import python from"highlight.js/lib/languages/python";import ruby from"highlight.js/lib/languages/ruby";import swift from"highlight.js/lib/languages/swift";import kotlin from"highlight.js/lib/languages/kotlin";import sql from"highlight.js/lib/languages/sql";import xml from"highlight.js/lib/languages/xml";import yaml from"highlight.js/lib/languages/yaml";import curl from"highlightjs-curl/src/languages/curl";var registry=[{label:"Text",key:"text",module:plaintext},{label:"JS",key:"javascript",module:javascript},{label:"TS",key:"typescript",module:typescript},{label:"Java",key:"java",module:java},{label:"Ruby",key:"ruby",module:ruby},{label:"Python",key:"python",module:python},{label:"PHP",key:"php",module:php},{label:"Shell",key:"bash",module:bash},{label:"C#",key:"cs",module:csharp},{label:"CSS",key:"css",module:css},{label:"Go",key:"go",module:go},{label:"HTML",key:"xml",module:xml},{label:"HTTP",key:"http",module:http},{label:"C++",key:"cpp",module:cpp},{label:"Dart",key:"dart",module:dart},{label:"Swift",key:"swift",module:swift},{label:"Kotlin",key:"kotlin",module:kotlin},{label:"Objective C",key:"objectivec",module:objectivec},{label:"Node.js",key:"javascript",module:javascript},{label:"JSON",key:"json",module:json},{label:"DOS",key:"dos",module:dos},{label:"YAML",key:"yaml",module:yaml},{label:"Erlang",key:"erlang",module:erlang},{label:"Elixir",key:"elixir",module:elixir},{label:"Diff",key:"diff",module:diff},{label:"SQL",key:"sql",module:sql},{label:"cURL",key:"curl",module:curl},{label:"HTML",key:"html",module:xml},{label:"XML",key:"xml",module:xml}];export default registry;
+import bash from"highlight.js/lib/languages/bash";import cpp from"highlight.js/lib/languages/cpp";import csharp from"highlight.js/lib/languages/csharp";import css from"highlight.js/lib/languages/css";import dart from"highlight.js/lib/languages/dart";import dos from"highlight.js/lib/languages/dos";import diff from"highlight.js/lib/languages/diff";import erlang from"highlight.js/lib/languages/erlang";import elixir from"highlight.js/lib/languages/elixir";import plaintext from"highlight.js/lib/languages/plaintext";import go from"highlight.js/lib/languages/go";import http from"highlight.js/lib/languages/http";import java from"highlight.js/lib/languages/java";import javascript from"highlight.js/lib/languages/javascript";import typescript from"highlight.js/lib/languages/typescript";import json from"highlight.js/lib/languages/json";import objectivec from"highlight.js/lib/languages/objectivec";import php from"highlight.js/lib/languages/php";import python from"highlight.js/lib/languages/python";import ruby from"highlight.js/lib/languages/ruby";import swift from"highlight.js/lib/languages/swift";import kotlin from"highlight.js/lib/languages/kotlin";import sql from"highlight.js/lib/languages/sql";import xml from"highlight.js/lib/languages/xml";import yaml from"highlight.js/lib/languages/yaml";import curl from"highlightjs-curl/src/languages/curl";const registry=[{label:"Text",key:"text",module:plaintext},{label:"JS",key:"javascript",module:javascript},{label:"TS",key:"typescript",module:typescript},{label:"Java",key:"java",module:java},{label:"Ruby",key:"ruby",module:ruby},{label:"Python",key:"python",module:python},{label:"PHP",key:"php",module:php},{label:"Shell",key:"bash",module:bash},{label:"C#",key:"cs",module:csharp},{label:"CSS",key:"css",module:css},{label:"Go",key:"go",module:go},{label:"HTML",key:"xml",module:xml},{label:"HTTP",key:"http",module:http},{label:"C++",key:"cpp",module:cpp},{label:"Dart",key:"dart",module:dart},{label:"Swift",key:"swift",module:swift},{label:"Kotlin",key:"kotlin",module:kotlin},{label:"Objective C",key:"objectivec",module:objectivec},{label:"Node.js",key:"javascript",module:javascript},{label:"JSON",key:"json",module:json},{label:"DOS",key:"dos",module:dos},{label:"YAML",key:"yaml",module:yaml},{label:"Erlang",key:"erlang",module:erlang},{label:"Elixir",key:"elixir",module:elixir},{label:"Diff",key:"diff",module:diff},{label:"SQL",key:"sql",module:sql},{label:"cURL",key:"curl",module:curl},{label:"HTML",key:"html",module:xml},{label:"XML",key:"xml",module:xml}];export default registry;

package/core/utils/syntax-highlighter.js

@@ -1 +1 @@
-import hljs from"highlight.js/lib/core";var languageToHighlightKey=function(lang){var id;if(!lang){lang="text"}switch(lang.toLowerCase()){case"android":id="java";break;case".net":case"net":case"dotnet":case"csharp":case"c#":id="cs";break;case"objc":case"objective c":id="objectivec";break;case"laravel":id="php";break;case"flutter":id="dart";break;case"node.js":case"js":id="javascript";break;case"ts":id="typescript";break;case"kotlin":case"kt":id="kotlin";break;case"shell":case"fh":case"sh":id="bash";break;case"https":case"http":case"txt":case"plaintext":id="text";break;case"cmd":case"bat":id="dos";break;case"yml":id="yaml";break;case"erl":id="erlang";break;case"patch":id="diff";break;case"svg":id="xml";break;default:break}return id||lang};var registerDefaultLanguages=function(register){register.forEach(function(param){var key=param.key,module=param.module;return hljs.registerLanguage(key,module)})};var highlightSnippet=function(languageKeyword,snippet){var language=languageToHighlightKey(languageKeyword);if(typeof snippet!=="string"||!snippet||!language)return;return hljs.highlight(snippet,{language:language}).value};export{highlightSnippet,languageToHighlightKey,registerDefaultLanguages};
+import hljs from"highlight.js/lib/core";const languageToHighlightKey=lang=>{let id;if(!lang){lang="text"}switch(lang.toLowerCase()){case"android":id="java";break;case".net":case"net":case"dotnet":case"csharp":case"c#":id="cs";break;case"objc":case"objective c":id="objectivec";break;case"laravel":id="php";break;case"flutter":id="dart";break;case"node.js":case"js":id="javascript";break;case"ts":id="typescript";break;case"kotlin":case"kt":id="kotlin";break;case"shell":case"fh":case"sh":id="bash";break;case"https":case"http":case"txt":case"plaintext":id="text";break;case"cmd":case"bat":id="dos";break;case"yml":id="yaml";break;case"erl":id="erlang";break;case"patch":id="diff";break;case"svg":id="xml";break;default:break}return id||lang};const registerDefaultLanguages=register=>{register.forEach(({key,module})=>hljs.registerLanguage(key,module))};const highlightSnippet=(languageKeyword,snippet)=>{const language=languageToHighlightKey(languageKeyword);if(typeof snippet!=="string"||!snippet||!language)return;return hljs.highlight(snippet,{language}).value};export{highlightSnippet,languageToHighlightKey,registerDefaultLanguages};

package/package.json

@@ -1,8 +1,7 @@
 {
   "name": "@ably/ui",
-  "version": "14.0.0-dev.58ef698",
+  "version": "14.0.0-dev.6d5cd62",
   "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.",
-  "type": "module",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@github.com/ably/ably-ui.git"
@@ -47,7 +46,7 @@
     "vite": "^4.5.2"
   },
   "scripts": {
-    "build:prebuild": "rm -r core reset",
+    "build:prebuild": "rm -rf core reset",
     "build:swc": "swc src/core src/reset -d dist --copy-files --include-dotfiles --strip-leading-paths",
     "build:sprites": "svg-sprite -C .svgrc src/core/icons/*.svg",
     "build:cleanup": "mv dist/* . && rm -r dist",

package/src/core/Accordion/Accordion.stories.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import Accordion, { AccordionProps } from "./component.tsx";
+import Accordion, { AccordionProps } from "../Accordion";
 
 export default {
   title: "Components/Accordion",

package/src/core/{Accordion/component.tsx → Accordion.tsx}

@@ -1,5 +1,5 @@
 import React, { useState, ReactNode, JSX } from "react";
-import Icon from "../Icon/component.tsx";
+import Icon from "./Icon";
 
 type AccordionData = {
   name: string;

package/src/core/Code/Code.stories.tsx

@@ -1,4 +1,4 @@
-import Code from "./component.tsx";
+import Code from "../Code";
 
 export default {
   title: "Components/Code",

package/src/core/{Code/component.tsx → Code.tsx}

@@ -1,11 +1,11 @@
 import React from "react";
 
-import "../utils/syntax-highlighter.css";
+import "./utils/syntax-highlighter.css";
 import {
   highlightSnippet,
   registerDefaultLanguages,
-} from "../utils/syntax-highlighter";
-import languagesRegistry from "../utils/syntax-highlighter-registry";
+} from "./utils/syntax-highlighter";
+import languagesRegistry from "./utils/syntax-highlighter-registry";
 
 registerDefaultLanguages(languagesRegistry);
 

package/src/core/{ConnectStateWrapper/component.tsx → ConnectStateWrapper.tsx}

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from "react";
 
-import { connectState, getRemoteDataStore } from "../remote-data-store";
+import { connectState, getRemoteDataStore } from "./remote-data-store";
 
 /*
   Connect a react component to a global store.

package/src/core/ContactFooter/ContactFooter.stories.tsx

@@ -1,4 +1,4 @@
-import ContactFooter from "./component.tsx";
+import ContactFooter from "../ContactFooter";
 
 export default {
   title: "Components/Contact Footer",

package/src/core/{ContactFooter/component.tsx → ContactFooter.tsx}

@@ -1,9 +1,9 @@
 import React, { useEffect } from "react";
 
-import Icon from "../Icon/component.tsx";
-import _absUrl from "../url-base.js";
-import toggleChatWidget from "../hubspot-chat-toggle";
-import "./component.css";
+import Icon from "./Icon";
+import _absUrl from "./url-base.js";
+import toggleChatWidget from "./hubspot-chat-toggle";
+import "./ContactFooter/component.css";
 
 type ContactFooterProps = {
   urlBase: string;

package/src/core/CookieMessage/CookieMessage.stories.tsx

@@ -1,4 +1,4 @@
-import CookieMessage from "./component.tsx";
+import CookieMessage from "../CookieMessage";
 
 export default {
   title: "Components/Cookie Message",

package/src/core/{CookieMessage/component.tsx → CookieMessage.tsx}

@@ -1,8 +1,8 @@
 import React, { useRef, useEffect, useState } from "react";
 import Cookie from "js-cookie";
-import "./component.css";
 
-import _absUrl from "../url-base";
+import "./CookieMessage/component.css";
+import _absUrl from "./url-base";
 
 const COOKIE_EXPIRY = 365;
 

package/src/core/CustomerLogos/CustomerLogos.stories.tsx

@@ -1,4 +1,4 @@
-import CustomerLogos from "./component.tsx";
+import CustomerLogos from "../CustomerLogos";
 
 import hubspot from "../images/cust-logo-hubspot-mono-pos.svg";
 import webflow from "../images/cust-logo-webflow-col-pos.svg";

package/src/core/DropdownMenu/DropdownMenu.stories.tsx

@@ -1,6 +1,6 @@
 import React from "react";
-import Icon from "../Icon/component.tsx";
-import DropdownMenu from "./component.tsx";
+import Icon from "../Icon";
+import DropdownMenu from "../DropdownMenu";
 
 export default {
   title: "Components/Dropdown Menu",

package/src/core/{DropdownMenu/component.tsx → DropdownMenu.tsx}

@@ -7,7 +7,7 @@ import React, {
   ReactNode,
   Dispatch,
 } from "react";
-import Icon from "../Icon/component.tsx";
+import Icon from "./Icon";
 
 const DropdownMenuContext = createContext<{
   isOpen: boolean;

package/src/core/FeaturedLink/FeaturedLink.stories.tsx

@@ -1,4 +1,4 @@
-import FeaturedLink from "./component.tsx";
+import FeaturedLink from "../FeaturedLink";
 
 export default {
   title: "Components/Featured Link",

package/src/core/{FeaturedLink/component.tsx → FeaturedLink.tsx}

@@ -1,6 +1,6 @@
 import React, { CSSProperties, ReactNode } from "react";
 
-import Icon from "../Icon/component.tsx";
+import Icon from "./Icon";
 
 type FeaturedLinkProps = {
   url: string;

package/src/core/Flash/Flash.stories.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import Flash, { reducerFlashes } from "./component.tsx";
+import Flash, { reducerFlashes } from "../Flash";
 
 import {
   attachStoreToWindow,

package/src/core/{Flash/component.tsx → Flash.tsx}

@@ -2,10 +2,10 @@ import React, { useEffect, useState, useRef } from "react";
 import DOMPurify from "dompurify";
 import { nanoid } from "nanoid/non-secure";
 
-import { getRemoteDataStore } from "../remote-data-store.js";
-import ConnectStateWrapper from "../ConnectStateWrapper/component.tsx";
-import Icon from "../Icon/component.tsx";
-import "./component.css";
+import { getRemoteDataStore } from "./remote-data-store.js";
+import ConnectStateWrapper from "./ConnectStateWrapper";
+import Icon from "./Icon";
+import "./Flash/component.css";
 
 type FlashProps = {
   id: string;

package/src/core/Footer/Footer.stories.tsx

@@ -1,4 +1,4 @@
-import Footer from "./component.tsx";
+import Footer from "../Footer";
 
 import ablyStack from "../images/ably-stack.svg";
 import highestPerformer from "../images/high-performer-2023.svg";

package/src/core/{Footer/component.tsx → Footer.tsx}

@@ -1,8 +1,8 @@
 import React from "react";
 
-import Icon from "../Icon/component.tsx";
-import _absUrl from "../url-base.js";
-import "./component.css";
+import Icon from "./Icon";
+import _absUrl from "./url-base.js";
+import "./Footer/component.css";
 
 type FooterProps = {
   paths: {

package/src/core/Icon/Icon.stories.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import Icon from "./component.tsx";
+import Icon from "../Icon";
 
 export default {
   title: "Components/Icon",

package/src/core/Loader/Loader.stories.tsx

@@ -1,4 +1,4 @@
-import Loader from "./component.tsx";
+import Loader from "../Loader";
 
 export default {
   title: "Components/Loader",

package/src/core/Logo/Logo.stories.tsx

@@ -1,4 +1,4 @@
-import Logo from "./component.tsx";
+import Logo from "../Logo";
 import logoUrl from "../images/ably-logo.png";
 
 export default {

package/src/core/Meganav/Meganav.stories.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect } from "react";
 import { rest } from "msw";
 
-import Meganav from "./component.tsx";
+import Meganav from "../Meganav";
 import loadIcons from "../icons.js";
 import logo from "../images/ably-logo.png";
 import ablyStack from "../images/ably-stack.svg";