@ably/ui 14.0.0-dev.fbce38f → 14.0.0

package/src/core/styles/text.css

@@ -1,166 +1,168 @@
-.ui-text-title {
-  @apply font-sans font-extrabold 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 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 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 text-h3;
-  @apply tracking-tighten-0.005;
-}
-
-.ui-text-h4 {
-  @apply font-sans font-extrabold text-cool-black;
-  @apply text-h4;
-  @apply tracking-tighten-0.0015;
-}
-
-.ui-text-h5 {
-  @apply font-sans font-extrabold text-cool-black;
-  @apply text-h5;
-  @apply tracking-tighten-0.0025;
-}
-
-.ui-text-p1 {
-  @apply font-sans font-medium text-charcoal-grey;
-  @apply text-p1;
-}
-
-.ui-text-p2 {
-  @apply font-sans font-medium text-charcoal-grey;
-  @apply text-p2;
-}
-
-.ui-text-p3 {
-  @apply font-sans font-medium text-charcoal-grey;
-  @apply text-p3;
-}
-
-.ui-text-standfirst {
-  @apply font-sans font-light text-active-orange;
-  @apply text-standfirst xl:text-standfirst-xl;
-  @apply tracking-tighten-0.025 xl:tracking-tighten-0.015;
-}
-
-.ui-text-quote {
-  @apply font-sans font-normal text-cool-black;
-  @apply text-quote leading-normal;
-  @apply tracking-tighten-0.0015;
-}
-
-.ui-text-sub-header {
-  @apply font-sans font-semibold text-neutral-800;
-  @apply text-sub-header-xs xs:text-sub-header leading-normal;
-}
-
-.ui-text-overline1 {
-  @apply font-mono font-medium text-active-orange uppercase;
-  @apply text-overline1 leading-normal;
-  @apply tracking-widen-0.16;
-}
-
-.ui-text-overline2 {
-  @apply font-mono font-medium text-active-orange uppercase;
-  @apply text-overline2 leading-normal;
-  @apply tracking-widen-0.16;
-}
-
-.ui-text-menu1 {
-  @apply font-sans font-medium text-cool-black;
-  @apply text-menu1 leading-snug;
-}
-
-.ui-text-menu2 {
-  @apply font-sans font-medium text-cool-black;
-  @apply text-menu2 leading-snug;
-}
-
-.ui-text-menu3 {
-  @apply font-sans font-medium text-cool-black;
-  @apply text-menu3 leading-snug;
-}
-
-.ui-text-code {
-  @apply font-mono font-normal text-code;
-}
-
-.ui-text-code2 {
-  @apply font-mono font-normal text-code2;
-}
-
-.ui-text-code-inline {
-  @apply font-mono font-normal text-code text-charcoal-grey bg-light-grey p-inline-code rounded-sm mx-1;
-}
-
-.ui-unordered-list {
-  @apply text-p1 font-medium text-charcoal-grey;
-  @apply ml-32 my-16;
-  @apply list-disc;
-}
-
-.ui-ordered-list {
-  @apply text-p1 font-medium text-charcoal-grey;
-  @apply ml-32 my-16;
-  @apply list-decimal;
-}
-
-.ui-ordered-list li,
-.ui-unordered-list li {
-  @apply mb-8;
-}
-
-.ui-unordered-list li > *:last-of-type:not(ul):not(ol),
-.ui-ordered-list li > *:last-of-type:not(ul):not(ol) {
-  margin-bottom: 0;
-}
-
-.ui-unordered-list ul {
-  @apply ml-24 my-8 list-circle;
-}
-
-.ui-ordered-list ol {
-  @apply ml-24 my-16 list-decimal;
-}
-
-.ui-unordered-list ul ul {
-  @apply list-square my-8;
-}
-
-.ui-unordered-list ul ul {
-  @apply my-8;
-}
-
-.ui-link {
-  @apply text-gui-default;
-  @apply hover:text-gui-hover active:text-gui-active disabled:text-gui-unavailable;
-  @apply focus:text-gui-default focus:outline-gui-focus;
-  @apply no-underline;
-}
-
-.ui-link-neutral {
-  @apply hover:text-dark-grey active:text-cool-black disabled:text-gui-unavailable;
-  @apply focus:text-charcoal-grey;
-  @apply underline;
-}
-
-/* focus:outline-gui-focus-neutral does not get created under Tailwind 3.3.5, not sure why */
-.ui-link-neutral:focus {
-  outline: 2px solid var(--color-neutral-000);
-}
-
-.ui-figcaption {
-  @apply font-mono text-p3 text-neutral-800;
+@layer components {
+  .ui-text-title {
+    @apply font-sans font-extrabold 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 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 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 text-h3;
+    @apply tracking-tighten-0.005;
+  }
+
+  .ui-text-h4 {
+    @apply font-sans font-extrabold text-cool-black;
+    @apply text-h4;
+    @apply tracking-tighten-0.0015;
+  }
+
+  .ui-text-h5 {
+    @apply font-sans font-extrabold text-cool-black;
+    @apply text-h5;
+    @apply tracking-tighten-0.0025;
+  }
+
+  .ui-text-p1 {
+    @apply font-sans font-medium text-charcoal-grey;
+    @apply text-p1;
+  }
+
+  .ui-text-p2 {
+    @apply font-sans font-medium text-charcoal-grey;
+    @apply text-p2;
+  }
+
+  .ui-text-p3 {
+    @apply font-sans font-medium text-charcoal-grey;
+    @apply text-p3;
+  }
+
+  .ui-text-standfirst {
+    @apply font-sans font-light text-active-orange;
+    @apply text-standfirst xl:text-standfirst-xl;
+    @apply tracking-tighten-0.025 xl:tracking-tighten-0.015;
+  }
+
+  .ui-text-quote {
+    @apply font-sans font-normal text-cool-black;
+    @apply text-quote leading-normal;
+    @apply tracking-tighten-0.0015;
+  }
+
+  .ui-text-sub-header {
+    @apply font-sans font-semibold text-neutral-800;
+    @apply text-sub-header-xs xs:text-sub-header leading-normal;
+  }
+
+  .ui-text-overline1 {
+    @apply font-mono font-medium text-active-orange uppercase;
+    @apply text-overline1 leading-normal;
+    @apply tracking-widen-0.16;
+  }
+
+  .ui-text-overline2 {
+    @apply font-mono font-medium text-active-orange uppercase;
+    @apply text-overline2 leading-normal;
+    @apply tracking-widen-0.16;
+  }
+
+  .ui-text-menu1 {
+    @apply font-sans font-medium text-cool-black;
+    @apply text-menu1 leading-snug;
+  }
+
+  .ui-text-menu2 {
+    @apply font-sans font-medium text-cool-black;
+    @apply text-menu2 leading-snug;
+  }
+
+  .ui-text-menu3 {
+    @apply font-sans font-medium text-cool-black;
+    @apply text-menu3 leading-snug;
+  }
+
+  .ui-text-code {
+    @apply font-mono font-normal text-code;
+  }
+
+  .ui-text-code2 {
+    @apply font-mono font-normal text-code2;
+  }
+
+  .ui-text-code-inline {
+    @apply font-mono font-normal text-code text-charcoal-grey bg-light-grey p-inline-code rounded-sm mx-1;
+  }
+
+  .ui-unordered-list {
+    @apply text-p1 font-medium text-charcoal-grey;
+    @apply ml-32 my-16;
+    @apply list-disc;
+  }
+
+  .ui-ordered-list {
+    @apply text-p1 font-medium text-charcoal-grey;
+    @apply ml-32 my-16;
+    @apply list-decimal;
+  }
+
+  .ui-ordered-list li,
+  .ui-unordered-list li {
+    @apply mb-8;
+  }
+
+  .ui-unordered-list li > *:last-of-type:not(ul):not(ol),
+  .ui-ordered-list li > *:last-of-type:not(ul):not(ol) {
+    margin-bottom: 0;
+  }
+
+  .ui-unordered-list ul {
+    @apply ml-24 my-8 list-circle;
+  }
+
+  .ui-ordered-list ol {
+    @apply ml-24 my-16 list-decimal;
+  }
+
+  .ui-unordered-list ul ul {
+    @apply list-square my-8;
+  }
+
+  .ui-unordered-list ul ul {
+    @apply my-8;
+  }
+
+  .ui-link {
+    @apply text-gui-default;
+    @apply hover:text-gui-hover active:text-gui-active disabled:text-gui-unavailable;
+    @apply focus:text-gui-default focus:outline-gui-focus;
+    @apply no-underline;
+  }
+
+  .ui-link-neutral {
+    @apply hover:text-dark-grey active:text-cool-black disabled:text-gui-unavailable;
+    @apply focus:text-charcoal-grey;
+    @apply underline;
+  }
+
+  /* focus:outline-gui-focus-neutral does not get created under Tailwind 3.3.5, not sure why */
+  .ui-link-neutral:focus {
+    outline: 2px solid var(--color-neutral-000);
+  }
+
+  .ui-figcaption {
+    @apply font-mono text-p3 text-neutral-800;
+  }
 }

package/src/core/styles.components.css

@@ -3,31 +3,33 @@
 @import "./styles/text.css";
 @import "./styles/forms.css";
 
-.ui-input {
-  @apply text-p2 font-medium bg-light-grey rounded p-input w-full leading-none appearance-none border border-mid-grey transition-input;
-  @apply hover:bg-white hover:shadow-input hover:border-transparent;
-  @apply focus:bg-white focus:shadow-input focus:border-transparent focus:outline-gui-focus;
-  @apply max-w-screen-sm;
-}
+@layer components {
+  .ui-input {
+    @apply text-p2 font-medium bg-light-grey rounded p-input w-full leading-none appearance-none border border-mid-grey transition-input;
+    @apply hover:bg-white hover:shadow-input hover:border-transparent;
+    @apply focus:bg-white focus:shadow-input focus:border-transparent focus:outline-gui-focus;
+    @apply max-w-screen-sm;
+  }
 
-/* Basis for icon component */
-.ui-icon-cool-black {
-  stroke: var(--color-cool-black);
-}
+  /* Basis for icon component */
+  .ui-icon-cool-black {
+    stroke: var(--color-cool-black);
+  }
 
-.ui-icon-white {
-  stroke: var(--color-white);
-}
+  .ui-icon-white {
+    stroke: var(--color-white);
+  }
 
-.ui-icon-dark-grey {
-  stroke: var(--color-dark-grey);
-}
+  .ui-icon-dark-grey {
+    stroke: var(--color-dark-grey);
+  }
 
-.ui-version-tag {
-  @apply inline-block absolute align-top uppercase font-bold whitespace-nowrap;
+  .ui-version-tag {
+    @apply inline-block absolute align-top uppercase font-bold whitespace-nowrap;
 
-  position: relative;
-  vertical-align: super;
-  margin-left: 3px;
-  font-size: 8px;
+    position: relative;
+    vertical-align: super;
+    margin-left: 3px;
+    font-size: 8px;
+  }
 }

package/src/core/utils/syntax-highlighter.css

@@ -1,67 +1,71 @@
-@import url("https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,600;0,700;1,600;1,700&display=swap");
-@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@100;200;300;400;500;600;700;800&display=swap");
-@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap");
-
-.hljs {
-  background: var(--syntax-black);
-  color: var(--syntax-light-grey);
+@layer base {
+  @import url("https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,600;0,700;1,600;1,700&display=swap");
+  @import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@100;200;300;400;500;600;700;800&display=swap");
+  @import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap");
 }
 
-.hljs-emphasis {
-  @apply italic;
-}
+@layer components {
+  .hljs {
+    background: var(--syntax-black);
+    color: var(--syntax-light-grey);
+  }
 
-.hljs-strong {
-  @apply font-bold;
-}
+  .hljs-emphasis {
+    @apply italic;
+  }
 
-.hljs-comment,
-.hljs-quote {
-  color: var(--syntax-dark-grey);
-}
+  .hljs-strong {
+    @apply font-bold;
+  }
 
-.hljs-variable,
-.hljs-template-variable,
-.hljs-tag,
-.hljs-name,
-.hljs-selector-id,
-.hljs-selector-class,
-.hljs-regexp,
-.hljs-deletion {
-  color: var(--syntax-red);
-}
+  .hljs-comment,
+  .hljs-quote {
+    color: var(--syntax-dark-grey);
+  }
 
-.hljs-number,
-.hljs-built_in,
-.hljs-literal,
-.hljs-type,
-.hljs-params,
-.hljs-meta,
-.hljs-link {
-  color: var(--syntax-orange);
-}
+  .hljs-variable,
+  .hljs-template-variable,
+  .hljs-tag,
+  .hljs-name,
+  .hljs-selector-id,
+  .hljs-selector-class,
+  .hljs-regexp,
+  .hljs-deletion {
+    color: var(--syntax-red);
+  }
 
-.hljs-attribute {
-  color: var(--syntax-yellow);
-}
+  .hljs-number,
+  .hljs-built_in,
+  .hljs-literal,
+  .hljs-type,
+  .hljs-params,
+  .hljs-meta,
+  .hljs-link {
+    color: var(--syntax-orange);
+  }
 
-.hljs-string,
-.hljs-symbol,
-.hljs-bullet,
-.hljs-addition {
-  color: var(--syntax-green);
-}
+  .hljs-attribute {
+    color: var(--syntax-yellow);
+  }
 
-.hljs-title,
-.hljs-section {
-  color: var(--syntax-blue);
-}
+  .hljs-string,
+  .hljs-symbol,
+  .hljs-bullet,
+  .hljs-addition {
+    color: var(--syntax-green);
+  }
 
-.hljs-keyword,
-.hljs-selector-tag {
-  color: var(--syntax-lilac);
-}
+  .hljs-title,
+  .hljs-section {
+    color: var(--syntax-blue);
+  }
+
+  .hljs-keyword,
+  .hljs-selector-tag {
+    color: var(--syntax-lilac);
+  }
 
-.hljs-subst {
-  color: var(--syntax-mid-grey);
+  .hljs-subst {
+    color: var(--syntax-mid-grey);
+  }
 }

package/src/pages/Buttons.mdx

@@ -1,5 +1,5 @@
 import { Meta, Unstyled } from "@storybook/blocks";
-import Icon from "../core/Icon/component.tsx";
+import Icon from "../core/Icon";
 
 <Meta title="Brand/Buttons" />
 

package/src/pages/Chips.mdx

@@ -1,5 +1,5 @@
 import { Meta, Unstyled } from "@storybook/blocks";
-import Icon from "../core/Icon/component.tsx";
+import Icon from "../core/Icon";
 
 <Meta title="Brand/Chips" />
 

package/src/pages/Forms.mdx

@@ -1,7 +1,7 @@
 import { Meta, Unstyled } from "@storybook/blocks";
 import { formsHtml } from "./utils";
-import Code from "../core/Code/component.tsx";
-import Icon from "../core/Icon/component.tsx";
+import Code from "../core/Code";
+import Icon from "../core/Icon";
 
 <Meta title="Brand/Forms" />
 

package/core/Accordion/component.js

@@ -1 +0,0 @@
-function _array_like_to_array(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}function _array_with_holes(arr){if(Array.isArray(arr))return arr}function _array_without_holes(arr){if(Array.isArray(arr))return _array_like_to_array(arr)}function _iterable_to_array(iter){if(typeof Symbol!=="undefined"&&iter[Symbol.iterator]!=null||iter["@@iterator"]!=null)return Array.from(iter)}function _iterable_to_array_limit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break}}catch(err){_d=true;_e=err}finally{try{if(!_n&&_i["return"]!=null)_i["return"]()}finally{if(_d)throw _e}}return _arr}function _non_iterable_rest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _non_iterable_spread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _sliced_to_array(arr,i){return _array_with_holes(arr)||_iterable_to_array_limit(arr,i)||_unsupported_iterable_to_array(arr,i)||_non_iterable_rest()}function _to_consumable_array(arr){return _array_without_holes(arr)||_iterable_to_array(arr)||_unsupported_iterable_to_array(arr)||_non_iterable_spread()}function _unsupported_iterable_to_array(o,minLen){if(!o)return;if(typeof o==="string")return _array_like_to_array(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(n);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _array_like_to_array(o,minLen)}import React,{useState}from"react";import Icon from"../Icon/component.tsx";var AccordionRow=function(param){var name=param.name,children=param.children,index=param.index,setActiveIndex=param.setActiveIndex,active=param.active,topBorder=param.topBorder,bottomBorder=param.bottomBorder,last=param.last,arrowIcon=param.arrowIcon;var iconActive,iconInactive;var handleSetIndex=function(){setActiveIndex(index)};if(arrowIcon){iconActive=React.createElement(Icon,{name:"icon-gui-disclosure-arrow",color:"text-dark-grey",size:"1.5rem",additionalCSS:"-rotate-90"});iconInactive=React.createElement(Icon,{name:"icon-gui-disclosure-arrow",color:"text-dark-grey",size:"1.5rem",additionalCSS:"rotate-90"})}else{iconActive=React.createElement(Icon,{name:"icon-gui-minus",color:"text-dark-grey",size:"1.5rem"});iconInactive=React.createElement(Icon,{name:"icon-gui-plus",color:"text-dark-grey",size:"1.5rem"})}return React.createElement("div",{className:"border-mid-grey ".concat(last&&!bottomBorder?"":"border-b"," ").concat(topBorder?"border-t":"")},React.createElement("button",{type:"button",onClick:handleSetIndex,className:"flex w-full px-0 focus:outline-none py-20"},React.createElement("span",{className:"ui-text-p1 font-bold text-left mr-8"},name),React.createElement("span",{className:"ml-auto"},active?iconActive:iconInactive)),React.createElement("section",{className:"ui-text-p2 transition-all overflow-hidden",style:{maxHeight:active?"500px":"0",paddingBottom:active?"1.5rem":"0"}},children))};var Accordion=function(param){var data=param.data,_param_id=param.id,id=_param_id===void 0?"id-accordion":_param_id,topBorder=param.topBorder,bottomBorder=param.bottomBorder,arrowIcon=param.arrowIcon,autoClose=param.autoClose;var _useState=_sliced_to_array(useState([]),2),activeIndexes=_useState[0],setActiveIndexes=_useState[1];var handleSetIndex=function(index){var currentIndexIsActive=activeIndexes.includes(index);if(autoClose){setActiveIndexes(currentIndexIsActive?[]:[index])}else{setActiveIndexes(currentIndexIsActive?activeIndexes.filter(function(i){return i!==index}):_to_consumable_array(activeIndexes).concat([index]))}};return React.createElement("div",{className:"ui-grid-mx max-w-screen-sm sm:mx-auto",id:id},data.map(function(item,currentIndex){return React.createElement(AccordionRow,{key:item.name,name:item.name,arrowIcon:arrowIcon,index:currentIndex,last:data.length===currentIndex+1,topBorder:topBorder&&currentIndex===0,bottomBorder:bottomBorder&&data.length===currentIndex+1,active:activeIndexes.includes(currentIndex),setActiveIndex:handleSetIndex},item.content)}))};export default Accordion;

package/core/ConnectStateWrapper/component.js

@@ -1 +0,0 @@
-function _array_like_to_array(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}function _array_with_holes(arr){if(Array.isArray(arr))return arr}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 _iterable_to_array_limit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break}}catch(err){_d=true;_e=err}finally{try{if(!_n&&_i["return"]!=null)_i["return"]()}finally{if(_d)throw _e}}return _arr}function _non_iterable_rest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}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 _sliced_to_array(arr,i){return _array_with_holes(arr)||_iterable_to_array_limit(arr,i)||_unsupported_iterable_to_array(arr,i)||_non_iterable_rest()}function _unsupported_iterable_to_array(o,minLen){if(!o)return;if(typeof o==="string")return _array_like_to_array(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(n);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _array_like_to_array(o,minLen)}import React,{useEffect,useState}from"react";import{connectState,getRemoteDataStore}from"../remote-data-store";var ConnectStateWrapper=function(Component,selectors){var _useState=_sliced_to_array(useState({}),2),state=_useState[0],setState=_useState[1];var setStateForKey=function(key){return function(storeState){return setState(function(){return _define_property({},key,storeState)})}};useEffect(function(){var store=getRemoteDataStore();var resolvedState=Object.keys(selectors).reduce(function(acc,key){return _object_spread_props(_object_spread({},acc),_define_property({},key,selectors[key](store)))},{});setState(resolvedState);Object.keys(selectors).forEach(function(key){connectState(selectors[key],setStateForKey(key))})},[]);var WrappedComponent=function(props){return React.createElement(Component,_object_spread({},props,state))};return WrappedComponent};export default ConnectStateWrapper;

package/core/CookieMessage/component.js

@@ -1 +0,0 @@
-import"./component.css";array(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}function _array_with_holes(arr){if(Array.isArray(arr))return arr}function _iterable_to_array_limit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break}}catch(err){_d=true;_e=err}finally{try{if(!_n&&_i["return"]!=null)_i["return"]()}finally{if(_d)throw _e}}return _arr}function _non_iterable_rest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _sliced_to_array(arr,i){return _array_with_holes(arr)||_iterable_to_array_limit(arr,i)||_unsupported_iterable_to_array(arr,i)||_non_iterable_rest()}function _unsupported_iterable_to_array(o,minLen){if(!o)return;if(typeof o==="string")return _array_like_to_array(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(n);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _array_like_to_array(o,minLen)}import React,{useRef,useEffect,useState}from"react";import Cookie from"js-cookie";import"./component.css";import _absUrl from"../url-base";var COOKIE_EXPIRY=365;var CookieMessage=function(param){var cookieId=param.cookieId,urlBase=param.urlBase;var ref=useRef(null);var _useState=_sliced_to_array(useState(true),2),hideCookieMessage=_useState[0],setHideCookieMessage=_useState[1];useEffect(function(){var isCookieSet=Cookie.get(cookieId)?true:false;setHideCookieMessage(isCookieSet)},[]);var handleClose=function(){var _ref_current;Cookie.set(cookieId,"1",{expires:COOKIE_EXPIRY});(_ref_current=ref.current)===null||_ref_current===void 0?void 0:_ref_current.classList.add("bottom-1","opacity-0");setTimeout(function(){return setHideCookieMessage(true)},500)};var absUrl=function(path){return _absUrl(path,urlBase)};if(hideCookieMessage)return null;return React.createElement("div",{className:"ui-cookie-message",ref:ref},React.createElement("p",{className:"ui-text-p2 pr-32"},React.createElement("a",{href:absUrl("/privacy"),className:"underline"},"How we use cookies")," ","to improve your experience."),React.createElement("button",{className:"ui-btn-secondary mt-12 sm:mt-0 whitespace-nowrap",onClick:handleClose},"Accept and close"))};export default CookieMessage;

package/core/CustomerLogos/component.js

@@ -1 +0,0 @@
-import React from"react";var CustomerLogos=function(param){var companies=param.companies,_param_additionalCss=param.additionalCss,additionalCss=_param_additionalCss===void 0?"":_param_additionalCss;return React.createElement("section",{className:"w-full bg-white"},React.createElement("ul",{className:"py-64 flex flex-row flex-wrap md:flex-nowrap content-between m-auto items-center ".concat(additionalCss)},companies.map(function(company){return React.createElement("li",{key:company.label,className:"flex-auto text-center sm:w-1/3 w-1/2"},React.createElement("img",{alt:company.label,src:company.logo,className:"mx-auto"}))})))};export default CustomerLogos;

package/core/DropdownMenu/component.js

@@ -1 +0,0 @@
-function _array_like_to_array(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}function _array_with_holes(arr){if(Array.isArray(arr))return arr}function _iterable_to_array_limit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break}}catch(err){_d=true;_e=err}finally{try{if(!_n&&_i["return"]!=null)_i["return"]()}finally{if(_d)throw _e}}return _arr}function _non_iterable_rest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _sliced_to_array(arr,i){return _array_with_holes(arr)||_iterable_to_array_limit(arr,i)||_unsupported_iterable_to_array(arr,i)||_non_iterable_rest()}function _unsupported_iterable_to_array(o,minLen){if(!o)return;if(typeof o==="string")return _array_like_to_array(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(n);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _array_like_to_array(o,minLen)}import React,{createContext,useContext,useState,useEffect,useRef}from"react";import Icon from"../Icon/component.tsx";var DropdownMenuContext=createContext({isOpen:false,setOpen:function(){}});var DropdownMenu=function(param){var children=param.children;var _useState=_sliced_to_array(useState(false),2),isOpen=_useState[0],setOpen=_useState[1];var ref=useRef(null);useEffect(function(){var clickHandler=function(e){var _ref_current;if((_ref_current=ref.current)===null||_ref_current===void 0?void 0:_ref_current.contains(e.target))return;setOpen(false)};document.addEventListener("click",clickHandler);return function(){document.removeEventListener("click",clickHandler)}},[]);return React.createElement(DropdownMenuContext.Provider,{value:{isOpen:isOpen,setOpen:setOpen}},React.createElement("div",{id:"dropdown-menu",className:"relative",ref:ref},children))};var Trigger=function(param){var children=param.children,_param_additionalTriggerCSS=param.additionalTriggerCSS,additionalTriggerCSS=_param_additionalTriggerCSS===void 0?"":_param_additionalTriggerCSS;var _useContext=useContext(DropdownMenuContext),isOpen=_useContext.isOpen,setOpen=_useContext.setOpen;return React.createElement("button",{id:"menu-trigger",onClick:function(){return setOpen(!isOpen)},className:"".concat(additionalTriggerCSS," flex items-center p-8 ml-8 group hover:text-gui-hover hover:bg-light-grey active:text-gui-active focus:text-gui-focus focus:outline-none rounded-lg")},React.createElement("span",{className:"leading-normal"},children),React.createElement(Icon,{name:"icon-gui-disclosure-arrow",color:"text-cool-black",size:"1.25rem",additionalCSS:"transform rotate-90 group-hover:text-gui-hover group-active:text-gui-active group-focus:text-gui-focus"}))};var Content=function(param){var children=param.children,_param_anchorPosition=param.anchorPosition,anchorPosition=_param_anchorPosition===void 0?"right":_param_anchorPosition,additionalContentCSS=param.additionalContentCSS;var isOpen=useContext(DropdownMenuContext).isOpen;if(!isOpen){return null}var anchorPositionClasses=anchorPosition==="right"?"right-0":"left-0";return React.createElement("div",{id:"menu-content",className:"".concat(additionalContentCSS," absolute p-8 z-10 border border-mid-grey bg-white rounded shadow-container ").concat(anchorPositionClasses),style:{minWidth:275,top:44}},children)};var Link=function(param){var url=param.url,title=param.title,subtitle=param.subtitle,iconName=param.iconName,children=param.children;return React.createElement("a",{href:url,className:"menu-link group block p-8 hover:bg-light-grey hover:text-cool-black rounded"},React.createElement("p",{className:"mb-4"},title,iconName?React.createElement(Icon,{name:iconName,size:"1rem",color:"text-cool-black",additionalCSS:"align-middle ml-8 relative -top-1 -left-4"}):null),subtitle?React.createElement("p",{className:"ui-text-p3 mb-16"},subtitle):null,children)};DropdownMenu.Trigger=Trigger;DropdownMenu.Content=Content;DropdownMenu.Link=Link;export default DropdownMenu;

package/core/FeaturedLink/component.js

@@ -1 +0,0 @@
-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}import React from"react";import Icon from"../Icon/component.tsx";var buildTargetAndRel=function(url,newWindow){var props={};if(newWindow){props.target="_blank";if(url.startsWith("/")&&!url.startsWith("//")){props.rel="noopener"}else{props.rel="noopenner noreferrer"}}return props};var FeaturedLink=function(param){var url=param.url,_param_textSize=param.textSize,textSize=_param_textSize===void 0?"text-p2":_param_textSize,_param_iconColor=param.iconColor,iconColor=_param_iconColor===void 0?"text-cool-black":_param_iconColor,_param_flush=param.flush,flush=_param_flush===void 0?false:_param_flush,_param_reverse=param.reverse,reverse=_param_reverse===void 0?false:_param_reverse,_param_additionalCSS=param.additionalCSS,additionalCSS=_param_additionalCSS===void 0?"":_param_additionalCSS,_param_newWindow=param.newWindow,newWindow=_param_newWindow===void 0?false:_param_newWindow,_param_onClick=param.onClick,onClick=_param_onClick===void 0?undefined:_param_onClick,children=param.children;var targetAndRel=buildTargetAndRel(url,newWindow);return React.createElement("a",_object_spread_props(_object_spread({href:url,className:"font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-".concat(textSize," ").concat(flush?"":"py-8"," ").concat(additionalCSS),style:{"--featured-link-icon-size":"var(".concat(textSize.replace("text","--fs"),")")}},targetAndRel),{onClick:onClick}),reverse?React.createElement(React.Fragment,null,React.createElement(Icon,{name:"icon-gui-link-arrow",size:"calc(var(--featured-link-icon-size) * 1.25)",color:iconColor,additionalCSS:"align-middle mr-8 relative -top-1 -right-4 transition-all group-hover:right-0 transform rotate-180"}),children):React.createElement(React.Fragment,null,children,React.createElement(Icon,{name:"icon-gui-link-arrow",size:"calc(var(--featured-link-icon-size) * 1.25)",color:iconColor,additionalCSS:"align-middle ml-8 relative -top-1 -left-4 transition-all group-hover:left-0"})))};export default FeaturedLink;

package/core/Flash/component.js

@@ -1 +0,0 @@
-function _array_like_to_array(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}function _array_with_holes(arr){if(Array.isArray(arr))return arr}function _array_without_holes(arr){if(Array.isArray(arr))return _array_like_to_array(arr)}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 _iterable_to_array(iter){if(typeof Symbol!=="undefined"&&iter[Symbol.iterator]!=null||iter["@@iterator"]!=null)return Array.from(iter)}function _iterable_to_array_limit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break}}catch(err){_d=true;_e=err}finally{try{if(!_n&&_i["return"]!=null)_i["return"]()}finally{if(_d)throw _e}}return _arr}function _non_iterable_rest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _non_iterable_spread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}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 _sliced_to_array(arr,i){return _array_with_holes(arr)||_iterable_to_array_limit(arr,i)||_unsupported_iterable_to_array(arr,i)||_non_iterable_rest()}function _to_consumable_array(arr){return _array_without_holes(arr)||_iterable_to_array(arr)||_unsupported_iterable_to_array(arr)||_non_iterable_spread()}function _unsupported_iterable_to_array(o,minLen){if(!o)return;if(typeof o==="string")return _array_like_to_array(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(n);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _array_like_to_array(o,minLen)}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";var REDUCER_KEY="flashes";var FLASH_DATA_ID="ui-flashes";var initialState={items:[]};var reducerFlashes=_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"flash/push":{var flashes=Array.isArray(action.payload)?action.payload:[action.payload];return{items:_to_consumable_array(state.items).concat(_to_consumable_array(flashes))}}default:return state}});var selectFlashes=function(store){return store.getState()[REDUCER_KEY]};var FLASH_BG_COLOR={error:"bg-gui-error",success:"bg-zingy-green",notice:"bg-electric-cyan",info:"bg-electric-cyan",alert:"bg-active-orange"};var FLASH_TEXT_COLOR={error:"text-white",success:"text-cool-black",notice:"text-cool-black",info:"text-cool-black",alert:"text-white"};var AUTO_HIDE=["success","info","notice"];var AUTO_HIDE_TIME=8e3;var useAutoHide=function(type,closeFlash){var timeoutId=useRef(null);useEffect(function(){if(AUTO_HIDE.includes(type)){timeoutId.current=setTimeout(function(){closeFlash()},AUTO_HIDE_TIME)}return function(){if(timeoutId.current){clearTimeout(timeoutId.current)}}},[])};var Flash=function(param){var id=param.id,type=param.type,content=param.content,removeFlash=param.removeFlash;var ref=useRef(null);var _useState=_sliced_to_array(useState(false),2),closed=_useState[0],setClosed=_useState[1];var _useState1=_sliced_to_array(useState(0),2),flashHeight=_useState1[0],setFlashHeight=_useState1[1];var _useState2=_sliced_to_array(useState(false),2),triggerEntryAnimation=_useState2[0],setTriggerEntryAnimation=_useState2[1];var closeFlash=function(){if(ref.current){setFlashHeight(ref.current.getBoundingClientRect().height)}setClosed(true);setTimeout(function(){id&&removeFlash(id)},100)};useEffect(function(){return setTriggerEntryAnimation(true)},[]);useAutoHide(type,closeFlash);var animateEntry=triggerEntryAnimation&&!closed;var style;if(flashHeight&&!closed){style={height:"".concat(flashHeight,"px")}}else if(closed){style={height:0,marginTop:0,zIndex:-1}}else{style={}}var safeContent=DOMPurify.sanitize(content,{ALLOWED_TAGS:["a"],ALLOWED_ATTR:["href","data-method","rel"]});var withIcons={notice:"icon-gui-ably-badge",success:"icon-gui-tick",error:"icon-gui-warning",alert:"icon-gui-warning"};var iconColor={notice:"text-cool-black",success:"text-cool-black",error:"text-white",alert:"text-white"};return React.createElement("div",{className:"ui-flash-message ui-grid-px ".concat(animateEntry?"ui-flash-message-enter":""),style:style,ref:ref,"data-id":"ui-flash"},React.createElement("div",{className:"".concat(FLASH_BG_COLOR[type]," p-32 flex align-center rounded shadow-container-subtle")},withIcons[type]&&React.createElement(Icon,{name:withIcons[type],color:iconColor[type],size:"1.5rem",additionalCSS:"mr-16 self-baseline"}),React.createElement("p",{className:"ui-text-p1 mr-16 ".concat(FLASH_TEXT_COLOR[type]),dangerouslySetInnerHTML:{__html:safeContent}}),React.createElement("button",{type:"button",className:"p-0 ml-auto self-start focus:outline-none",onClick:closeFlash},React.createElement(Icon,{name:"icon-gui-close",color:iconColor[type],size:"1.5rem",additionalCSS:"transition-colors"}))))};var Flashes=function(param){var flashes=param.flashes;var _useState=_sliced_to_array(useState([]),2),flashesWithIds=_useState[0],setFlashesWithIds=_useState[1];var removeFlash=function(flashId){return setFlashesWithIds(function(items){return items.filter(function(item){return item.id!==flashId})})};useEffect(function(){setFlashesWithIds(function(state){return _to_consumable_array(state).concat(_to_consumable_array((flashes===null||flashes===void 0?void 0:flashes.items).map(function(flash){return _object_spread_props(_object_spread({},flash),{id:nanoid(),removed:false})})))})},[flashes]);return React.createElement("div",{className:"ui-flash","data-id":FLASH_DATA_ID},flashesWithIds.filter(function(item){return!item.removed}).map(function(flash){return React.createElement(Flash,_object_spread_props(_object_spread({key:flash.id},flash),{removeFlash:removeFlash}))}))};var BackendFlashes=function(param){var flashes=param.flashes;useEffect(function(){var transformedFlashes=flashes.map(function(flash){var _flash=_sliced_to_array(flash,2),type=_flash[0],content=_flash[1];return{type:type,content:content}})||[];if(transformedFlashes.length>0){var store=getRemoteDataStore();store.dispatch({type:"flash/push",payload:transformedFlashes})}},[]);var WrappedFlashes=ConnectStateWrapper(Flashes,{flashes:selectFlashes});return React.createElement(WrappedFlashes,null)};export{reducerFlashes,FLASH_DATA_ID,Flashes};export default BackendFlashes;