ably-ui 11.7.1.dev.d409fff → 11.7.1.dev.1344841

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 567f511aac0ed6dad1e59498e0ebc6fd6a28108471d636a9b634041bfa51bf42
4
- data.tar.gz: 78f2e6b22592d2a9c9180d1f6ae88ba68366d36ccfe07de125a85de732019154
3
+ metadata.gz: 8335699bf46eec3184e802b1d0c0f06440aa1ad333b5077c11bb989db51d1b5e
4
+ data.tar.gz: 1a12c6e2a9c851958aef55e95cc6c693dd5990e6da83709c4f744fe776b707b1
5
5
  SHA512:
6
- metadata.gz: 7ad42cc1362ba1e6074134e1226bf3db462a3fa5b97219cf1c24681ddb44a5a398343a5cc9789a40792aa5f55fe337a7ac412e717f48146b60ca6f8fef4c7a00
7
- data.tar.gz: 810bef9cce6465b2e518ce150b5aec35b80ac422a74504845447f249ce3ddebdb3249acf789612cd9d4bc5941a0604060fd75ce0334245a480d44e0bb237b000
6
+ metadata.gz: 65a3bb039e49cf625cae6953378ef058ece663ff1e7ced44652897e8be363491da3aa21f257ac4b3837edeac5f78fbaa7591e0df550a9d367a64eb6eb216af2f
7
+ data.tar.gz: 567f72ba7c2c8806ab73f0b87139155894b0c4d48544b5eb743f452788c6dc90575684d9e6d11a530c51212af4065553125d3b9cac715ceb69ed8e35295ea567
data/Gemfile.lock CHANGED
@@ -1,7 +1,7 @@
1
1
  PATH
2
2
  remote: .
3
3
  specs:
4
- ably-ui (11.7.1.dev.d65c98c)
4
+ ably-ui (11.7.1.dev.13caf30)
5
5
  view_component (>= 2.33, < 2.50)
6
6
 
7
7
  GEM
@@ -3,8 +3,8 @@
3
3
  <div class="ui-contact-footer-box">
4
4
  <%= render(AblyUi::Core::Icon.new(name: "icon-display-live-chat", size: "3rem", additional_css: "block mb-16")) %>
5
5
  <div>
6
- <div class="text-h3 mb-24">Live Chat</div>
7
- <p class="text-p1 font-light">Reach out team of experts over chat powered by Ably.</p>
6
+ <div class="ui-text-h3 mb-24">Live Chat</div>
7
+ <p class="ui-text-p1">Reach out team of experts over chat powered by Ably.</p>
8
8
  </div>
9
9
  <%= tag.button type: "button", class: "ui-btn-secondary self-start mt-16", data: { id: "open-chat-widget", enabled_label: "Start a live chat", disabled_label: "Live chat unavailable" }, disabled: true do %>
10
10
  Live chat unavailable
@@ -13,18 +13,18 @@
13
13
  <div class="ui-contact-footer-box">
14
14
  <%= render(AblyUi::Core::Icon.new(name: "icon-display-call-mobile", size: "3rem", additional_css: "block mb-16")) %>
15
15
  <div class="flex-grow">
16
- <div class="text-h3 mb-24">Call us</div>
17
- <p class="text-p1 font-light">
18
- <span class="block"><strong class="text-p1 font-medium">+1 877 434 5287</strong> (USA, toll free) </span>
19
- <span class="block"><strong class="text-p1 font-medium">+44 20 3318 4689</strong> (UK) </span>
16
+ <div class="ui-text-h3 mb-24">Call us</div>
17
+ <p class="ui-text-p1">
18
+ <span class="block"><strong class="font-bold">+1 877 434 5287</strong> (USA, toll free) </span>
19
+ <span class="block"><strong class="font-bold">+44 20 3318 4689</strong> (UK) </span>
20
20
  </p>
21
21
  </div>
22
22
  </div>
23
23
  <div class="ui-contact-footer-box">
24
24
  <%= render(AblyUi::Core::Icon.new(name: "icon-display-tech-account-comms", size: "3rem", additional_css: "block mb-16")) %>
25
25
  <div>
26
- <div class="text-h3 mb-24">Technical and account support</div>
27
- <p class="text-p1 font-light">We&apos;re standing by to help with any questions or code.</p>
26
+ <div class="ui-text-h3 mb-24">Technical and account support</div>
27
+ <p class="ui-text-p1">We&apos;re standing by to help with any questions or code.</p>
28
28
  </div>
29
29
  <%= link_to 'Get support now', abs_url("/support"), class: "ui-btn-secondary self-start p-btn mt-16" %>
30
30
  </div>
@@ -6,14 +6,14 @@
6
6
  <div class="p-24 sm:p-32 flex-1 h-full">
7
7
  <div class="flex flex-col h-full space-between">
8
8
  <span class="flex-1">
9
- <div class="text-h3 mb-24 flex-1"><%= @title %> </div>
10
- <p class="text-p1 font-light"><%= @subtitle %></p>
9
+ <div class="ui-text-h3 text-white mb-24 flex-1"><%= @title %> </div>
10
+ <p class="ui-text-p1 text-white"><%= @subtitle %></p>
11
11
  <%= tag.button type: "button", class: "ui-btn-secondary-invert self-start mt-24", data: { id: "open-chat-widget", enabled_label: live_chat_label, disabled_label: live_chat_disabled_label }, disabled: true do %>
12
12
  <%= live_chat_disabled_label %>
13
13
  <% end %>
14
14
  </span>
15
15
  <span class="flex-0 mt-24 md:mt-0">
16
- <p class="text-p1 font-light">
16
+ <p class="ui-text-p1 text-white">
17
17
  Don’t want to chat?
18
18
  <%= link_to 'Get in touch via our contact page', abs_url("/contact"), class: "text-white underline font-medium hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus" %>
19
19
  </p>
@@ -24,9 +24,9 @@
24
24
  <div class="bg-white rounded-lg p-24 sm:p-32 w-auto">
25
25
  <div class="flex flex-col h-full space-between">
26
26
  <span class="flex-1">
27
- <div class="text-h3 mb-24">Try our APIs for free</div>
28
- <p class="text-p1 font-medium mb-16">Our free plan includes</p>
29
- <ul class="relative ml-24 text-p1 font-light leading-8">
27
+ <div class="ui-text-h3 mb-24">Try our APIs for free</div>
28
+ <p class="ui-text-p1 mb-16">Our free plan includes</p>
29
+ <ul class="relative ml-24 ui-text-p1">
30
30
  <li>
31
31
  <%= render(AblyUi::Core::Icon.new(name: "icon-gui-tick", size: "1.5rem", additional_css: "align-text-bottom")) %>
32
32
  6m messages per month
@@ -1,4 +1,4 @@
1
- <%= link_to(@url, class: "font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group #{@text_size} #{@flush ? '' : 'py-8'} #{@additional_css}", style: "--featured-link-icon-size: var(#{@text_size.gsub("text", "--fs")})") do %>
1
+ <%= link_to(@url, class: "font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-#{@text_size} #{@flush ? '' : 'py-8'} #{@additional_css}", style: "--featured-link-icon-size: var(#{@text_size.gsub("text", "--fs")})") do %>
2
2
  <% if @reverse %>
3
3
  <%= render(AblyUi::Core::Icon.new(name: "icon-gui-link-arrow",
4
4
  size: "calc(var(--featured-link-icon-size) * 1.25)",
@@ -13,10 +13,6 @@
13
13
  transform: translateY(-200%) rotateX(-90deg);
14
14
  }
15
15
 
16
- .ui-flash-text {
17
- @apply mr-16 text-p1;
18
- }
19
-
20
16
  /* dynamic content inside flash, can't add classes */
21
17
  .ui-flash-text a {
22
18
  @apply underline;
@@ -3,10 +3,10 @@
3
3
  <div class="col-span-full md:col-span-2">
4
4
  <div class="flex flex-row p-menu-row-snug">
5
5
  <%= image_tag(ably_stack_path, alt: "Ably homepage", class: "mr-24 -mt-16") %>
6
- <h2 class="text-overline2 col-span-full font-mono font-bold uppercase tracking-widen-0.16">The Ably Platform</h2>
6
+ <h2 class="ui-text-overline2 col-span-full font-mono uppercase tracking-widen-0.16">The Ably Platform</h2>
7
7
  </div>
8
8
  <div class="md:col-span-4 md:w-3/4 xs:w-3/5 w-full">
9
- <p class="font-sans text-p3 py-16 font-bold p-menu-row-snug">
9
+ <p class="ui-text-p3 font-bold py-16 p-menu-row-snug">
10
10
  Easily power any realtime experience in your application via a simple API that handles everything realtime.
11
11
  </p>
12
12
  </div>
@@ -105,7 +105,7 @@
105
105
  }
106
106
 
107
107
  .ui-meganav-overline {
108
- @apply text-overline2 text-cool-black uppercase font-bold font-mono tracking-widen-0.16 p-overline;
108
+ @apply text-overline2 text-cool-black uppercase font-medium font-mono tracking-widen-0.16 p-overline;
109
109
  }
110
110
 
111
111
  .ui-meganav-hr {
@@ -7,7 +7,7 @@
7
7
  <h3 class="ui-meganav-overline ml-24">The Ably Platform</h3>
8
8
  </div>
9
9
 
10
- <p class="text-p2 font-bold text-cool-black mb-24 leading-normal" style="max-width: 330px">
10
+ <p class="ui-text-p2 font-bold mb-24" style="max-width: 330px">
11
11
  Easily power any realtime experience in your application. No complex infrastructure to manage or provision. Just a simple API that handles everything
12
12
  realtime, and lets you focus on your code.
13
13
  </p>
@@ -1 +1 @@
1
- !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("dompurify"),require("js-cookie"),require("lodash.throttle"),require("prop-types"),require("react"),require("redux")):"function"==typeof define&&define.amd?define([,,,,,],t):"object"==typeof exports?exports.AblyUi=t(require("dompurify"),require("js-cookie"),require("lodash.throttle"),require("prop-types"),require("react"),require("redux")):(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.Notice=t(e[void 0],e[void 0],e[void 0],e[void 0],e[void 0],e[void 0]))}(this,((e,t,r,n,o,i)=>(()=>{"use strict";var c={710:t=>{t.exports=e},4360:e=>{e.exports=t},7326:e=>{e.exports=r},6073:e=>{e.exports=n},5225:e=>{e.exports=o},5293:e=>{e.exports=i}},a={};function u(e){var t=a[e];if(void 0!==t)return t.exports;var r=a[e]={exports:{}};return c[e](r,r.exports,u),r.exports}u.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return u.d(t,{a:t}),t},u.d=(e,t)=>{for(var r in t)u.o(t,r)&&!u.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},u.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var l={};return(()=>{u.d(l,{default:()=>R});var e=u(4360),t=u.n(e),r=u(7326),n=u.n(r),o=u(5225),i=u.n(o),c=u(710),a=u.n(c),s=u(6073),f=u.n(s);let p=(e=21)=>{let t="",r=e;for(;r--;)t+="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict"[64*Math.random()|0];return t};u(5293);var d=["name","size","color","additionalCSS"];function y(){return y=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},y.apply(this,arguments)}var m=function(e){var t=e.name,r=e.size,n=void 0===r?"0.75rem":r,o=e.color,c=void 0===o?"":o,a=e.additionalCSS,u=void 0===a?"":a,l=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(e,d);return i().createElement("svg",y({className:"".concat(c," ").concat(u),style:{width:n,height:n}},l),i().createElement("use",{xlinkHref:"#sprite-".concat(t)}))};m.propTypes={name:f().string.isRequired,size:f().string,color:f().string,additionalCSS:f().string};const b=m;function v(){return v=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},v.apply(this,arguments)}function h(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function g(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?h(Object(r),!0).forEach((function(t){w(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):h(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function O(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=e&&("undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"]);if(null!=r){var n,o,i=[],c=!0,a=!1;try{for(r=r.call(e);!(c=(n=r.next()).done)&&(i.push(n.value),!t||i.length!==t);c=!0);}catch(e){a=!0,o=e}finally{try{c||null==r.return||r.return()}finally{if(a)throw o}}return i}}(e,t)||x(e,t)||function(){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 w(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function j(e){return function(e){if(Array.isArray(e))return S(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||x(e)||function(){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 x(e,t){if(e){if("string"==typeof e)return S(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?S(e,t):void 0}}function S(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}var E="flashes",P="ui-flashes",A={items:[]},k=(w({},E,(function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:A,t=arguments.length>1?arguments[1]:void 0;if("flash/push"===t.type){var r=Array.isArray(t.payload)?t.payload:[t.payload];return{items:[].concat(j(e.items),j(r))}}return e})),{type:f().oneOf(["error","success","notice","info","alert"]),content:f().string}),q={error:"bg-gui-error",success:"bg-zingy-green",notice:"bg-electric-cyan",info:"bg-electric-cyan",alert:"bg-active-orange"},T={error:"text-white",success:"text-cool-black",notice:"text-cool-black",info:"text-cool-black",alert:"text-white"},C=["success","info","notice"],L=function(e){var t=e.id,r=e.type,n=e.content,c=e.removeFlash,u=(0,o.useRef)(null),l=O((0,o.useState)(!1),2),s=l[0],f=l[1],p=O((0,o.useState)(0),2),d=p[0],y=p[1],m=O((0,o.useState)(!1),2),v=m[0],h=m[1],g=function(){u.current&&y(u.current.getBoundingClientRect().height),f(!0),setTimeout((function(){c(t)}),100)};(0,o.useEffect)((function(){return h(!0)}),[]),function(e,t){var r=(0,o.useRef)(null);(0,o.useEffect)((function(){return C.includes(e)&&(r.current=setTimeout((function(){t()}),8e3)),function(){r.current&&clearTimeout(r.current)}}),[])}(r,g);var w,j=v&&!s;w=d&&!s?{height:"".concat(d,"px")}:s?{height:0,marginTop:0,zIndex:-1}:{};var x=a().sanitize(n,{ALLOWED_TAGS:["a"],ALLOWED_ATTR:["href","data-method","rel"]}),S={notice:"icon-gui-ably-badge",success:"icon-gui-tick",error:"icon-gui-warning",alert:"icon-gui-warning"},E={notice:"text-cool-black",success:"text-cool-black",error:"text-white",alert:"text-white"};return i().createElement("div",{className:"ui-flash-message ui-grid-px ".concat(j?"ui-flash-message-enter":""),style:w,ref:u,"data-id":"ui-flash"},i().createElement("div",{className:"".concat(q[r]," p-32 flex align-center rounded shadow-container-subtle")},S[r]&&i().createElement(b,{name:S[r],color:E[r],size:"1.5rem",additionalCSS:"mr-16 self-baseline"}),i().createElement("p",{className:"ui-flash-text ".concat(T[r]),dangerouslySetInnerHTML:{__html:x}}),i().createElement("button",{type:"button",className:"p-0 ml-auto self-start focus:outline-none",onClick:g},i().createElement(b,{name:"icon-gui-close",color:E[r],size:"1.5rem",additionalCSS:"transition-colors"}))))};L.propTypes=g({},k);var z=function(e){var t=e.flashes,r=O((0,o.useState)([]),2),n=r[0],c=r[1],a=function(e){return c((function(t){return t.filter((function(t){return t.id!==e}))}))};return(0,o.useEffect)((function(){c((function(e){return[].concat(j(e),j(((null==t?void 0:t.items)||[]).map((function(e){return g(g({},e),{},{id:p(),removed:!1})}))))}))}),[t]),i().createElement("div",{className:"ui-flash","data-id":P},n.filter((function(e){return!e.removed})).map((function(e){return i().createElement(L,v({removeFlash:a,key:e.id},e))})))};z.propTypes={flashes:f().shape({items:f().arrayOf(f().shape(k))})};function D(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function I(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}f().arrayOf(f().arrayOf(f().string));var N=function(e){var t=function(e){return(arguments.length>1&&void 0!==arguments[1]?arguments[1]:document).querySelector("[data-id=".concat(e,"]"))}(P);t&&(t.style.marginTop=e?"4rem":null)},U=function(e){window.matchMedia("(min-width: 65rem)").matches?e.style.display=null:e.style.display="none"},_=function(e){e.style.maxHeight=0,e.style.overflow="hidden",N(!1)},M=function(e){e.style.maxHeight=null,e.style.overflow=null,N(!0)};const R=function(e){var r=e.bannerContainer,o=e.cookieId,i=e.noticeId,c=e.options;if("undefined"==typeof window)return function(){};if(!r)return console.warn("A Notice component was initited but no notice container was found."),function(){};if(function(e,r){return(t().get(e)||"").includes(r)}(o,i))return function(){};U(r),M(r);var a=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?D(Object(r),!0).forEach((function(t){I(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):D(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}({collapse:!0},c),u=a.collapse?function(e){window.scrollY>5&&_(e);var t=n()((function(){window.scrollY>5?_(e):e.style.overflow&&M(e)}),100);return document.addEventListener("scroll",t),function(){return document.removeEventListener("scroll",t)}}(r):function(){},l=function(e,r,n,o){var i=e.querySelector("button");if(!i)return function(){};var c=function(){r&&n&&function(e,r){var n=t().get(e)||"";t().set(e,"".concat(n.replace("".concat(r,","),"")+r,","),{expires:90})}(r,n),_(e),o()};return i.addEventListener("click",c),function(){return document.removeEventListener("click",c)}}(r,o,i,u),s=function(e){var t=n()((function(){U(e)}),100);return window.addEventListener("resize",t),function(){return window.removeEventListener("resize",t)}}(r);return function(){[l,u,s].forEach((function(e){return e()}))}}})(),l.default})()));
1
+ !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("dompurify"),require("js-cookie"),require("lodash.throttle"),require("prop-types"),require("react"),require("redux")):"function"==typeof define&&define.amd?define([,,,,,],t):"object"==typeof exports?exports.AblyUi=t(require("dompurify"),require("js-cookie"),require("lodash.throttle"),require("prop-types"),require("react"),require("redux")):(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.Notice=t(e[void 0],e[void 0],e[void 0],e[void 0],e[void 0],e[void 0]))}(this,((e,t,r,n,o,i)=>(()=>{"use strict";var c={710:t=>{t.exports=e},4360:e=>{e.exports=t},7326:e=>{e.exports=r},6073:e=>{e.exports=n},5225:e=>{e.exports=o},5293:e=>{e.exports=i}},a={};function u(e){var t=a[e];if(void 0!==t)return t.exports;var r=a[e]={exports:{}};return c[e](r,r.exports,u),r.exports}u.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return u.d(t,{a:t}),t},u.d=(e,t)=>{for(var r in t)u.o(t,r)&&!u.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},u.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var l={};return(()=>{u.d(l,{default:()=>R});var e=u(4360),t=u.n(e),r=u(7326),n=u.n(r),o=u(5225),i=u.n(o),c=u(710),a=u.n(c),s=u(6073),f=u.n(s);let p=(e=21)=>{let t="",r=e;for(;r--;)t+="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict"[64*Math.random()|0];return t};u(5293);var d=["name","size","color","additionalCSS"];function y(){return y=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},y.apply(this,arguments)}var m=function(e){var t=e.name,r=e.size,n=void 0===r?"0.75rem":r,o=e.color,c=void 0===o?"":o,a=e.additionalCSS,u=void 0===a?"":a,l=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(e,d);return i().createElement("svg",y({className:"".concat(c," ").concat(u),style:{width:n,height:n}},l),i().createElement("use",{xlinkHref:"#sprite-".concat(t)}))};m.propTypes={name:f().string.isRequired,size:f().string,color:f().string,additionalCSS:f().string};const b=m;function v(){return v=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},v.apply(this,arguments)}function h(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function g(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?h(Object(r),!0).forEach((function(t){w(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):h(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function O(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=e&&("undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"]);if(null!=r){var n,o,i=[],c=!0,a=!1;try{for(r=r.call(e);!(c=(n=r.next()).done)&&(i.push(n.value),!t||i.length!==t);c=!0);}catch(e){a=!0,o=e}finally{try{c||null==r.return||r.return()}finally{if(a)throw o}}return i}}(e,t)||x(e,t)||function(){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 w(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function j(e){return function(e){if(Array.isArray(e))return S(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||x(e)||function(){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 x(e,t){if(e){if("string"==typeof e)return S(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?S(e,t):void 0}}function S(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}var E="flashes",P="ui-flashes",A={items:[]},k=(w({},E,(function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:A,t=arguments.length>1?arguments[1]:void 0;if("flash/push"===t.type){var r=Array.isArray(t.payload)?t.payload:[t.payload];return{items:[].concat(j(e.items),j(r))}}return e})),{type:f().oneOf(["error","success","notice","info","alert"]),content:f().string}),q={error:"bg-gui-error",success:"bg-zingy-green",notice:"bg-electric-cyan",info:"bg-electric-cyan",alert:"bg-active-orange"},T={error:"text-white",success:"text-cool-black",notice:"text-cool-black",info:"text-cool-black",alert:"text-white"},C=["success","info","notice"],L=function(e){var t=e.id,r=e.type,n=e.content,c=e.removeFlash,u=(0,o.useRef)(null),l=O((0,o.useState)(!1),2),s=l[0],f=l[1],p=O((0,o.useState)(0),2),d=p[0],y=p[1],m=O((0,o.useState)(!1),2),v=m[0],h=m[1],g=function(){u.current&&y(u.current.getBoundingClientRect().height),f(!0),setTimeout((function(){c(t)}),100)};(0,o.useEffect)((function(){return h(!0)}),[]),function(e,t){var r=(0,o.useRef)(null);(0,o.useEffect)((function(){return C.includes(e)&&(r.current=setTimeout((function(){t()}),8e3)),function(){r.current&&clearTimeout(r.current)}}),[])}(r,g);var w,j=v&&!s;w=d&&!s?{height:"".concat(d,"px")}:s?{height:0,marginTop:0,zIndex:-1}:{};var x=a().sanitize(n,{ALLOWED_TAGS:["a"],ALLOWED_ATTR:["href","data-method","rel"]}),S={notice:"icon-gui-ably-badge",success:"icon-gui-tick",error:"icon-gui-warning",alert:"icon-gui-warning"},E={notice:"text-cool-black",success:"text-cool-black",error:"text-white",alert:"text-white"};return i().createElement("div",{className:"ui-flash-message ui-grid-px ".concat(j?"ui-flash-message-enter":""),style:w,ref:u,"data-id":"ui-flash"},i().createElement("div",{className:"".concat(q[r]," p-32 flex align-center rounded shadow-container-subtle")},S[r]&&i().createElement(b,{name:S[r],color:E[r],size:"1.5rem",additionalCSS:"mr-16 self-baseline"}),i().createElement("p",{className:"ui-text-p1 mr-16 ".concat(T[r]),dangerouslySetInnerHTML:{__html:x}}),i().createElement("button",{type:"button",className:"p-0 ml-auto self-start focus:outline-none",onClick:g},i().createElement(b,{name:"icon-gui-close",color:E[r],size:"1.5rem",additionalCSS:"transition-colors"}))))};L.propTypes=g({},k);var z=function(e){var t=e.flashes,r=O((0,o.useState)([]),2),n=r[0],c=r[1],a=function(e){return c((function(t){return t.filter((function(t){return t.id!==e}))}))};return(0,o.useEffect)((function(){c((function(e){return[].concat(j(e),j(((null==t?void 0:t.items)||[]).map((function(e){return g(g({},e),{},{id:p(),removed:!1})}))))}))}),[t]),i().createElement("div",{className:"ui-flash","data-id":P},n.filter((function(e){return!e.removed})).map((function(e){return i().createElement(L,v({removeFlash:a,key:e.id},e))})))};z.propTypes={flashes:f().shape({items:f().arrayOf(f().shape(k))})};function D(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function I(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}f().arrayOf(f().arrayOf(f().string));var N=function(e){var t=function(e){return(arguments.length>1&&void 0!==arguments[1]?arguments[1]:document).querySelector("[data-id=".concat(e,"]"))}(P);t&&(t.style.marginTop=e?"4rem":null)},U=function(e){window.matchMedia("(min-width: 65rem)").matches?e.style.display=null:e.style.display="none"},_=function(e){e.style.maxHeight=0,e.style.overflow="hidden",N(!1)},M=function(e){e.style.maxHeight=null,e.style.overflow=null,N(!0)};const R=function(e){var r=e.bannerContainer,o=e.cookieId,i=e.noticeId,c=e.options;if("undefined"==typeof window)return function(){};if(!r)return console.warn("A Notice component was initited but no notice container was found."),function(){};if(function(e,r){return(t().get(e)||"").includes(r)}(o,i))return function(){};U(r),M(r);var a=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?D(Object(r),!0).forEach((function(t){I(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):D(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}({collapse:!0},c),u=a.collapse?function(e){window.scrollY>5&&_(e);var t=n()((function(){window.scrollY>5?_(e):e.style.overflow&&M(e)}),100);return document.addEventListener("scroll",t),function(){return document.removeEventListener("scroll",t)}}(r):function(){},l=function(e,r,n,o){var i=e.querySelector("button");if(!i)return function(){};var c=function(){r&&n&&function(e,r){var n=t().get(e)||"";t().set(e,"".concat(n.replace("".concat(r,","),"")+r,","),{expires:90})}(r,n),_(e),o()};return i.addEventListener("click",c),function(){return document.removeEventListener("click",c)}}(r,o,i,u),s=function(e){var t=n()((function(){U(e)}),100);return window.addEventListener("resize",t),function(){return window.removeEventListener("resize",t)}}(r);return function(){[l,u,s].forEach((function(e){return e()}))}}})(),l.default})()));
@@ -1,7 +1,7 @@
1
1
  <%# Note the style attribute is used for entry animation %>
2
2
  <%= tag.div class: "ui-announcement #{bg_color} #{text_color}", data: { id: "ui-notice" }, style: "max-height: 0; overflow: hidden" do %>
3
3
  <div class="ui-grid-px py-16 max-w-screen-xl mx-auto flex items-start">
4
- <%= content_wrapper class: "font-medium w-full pr-8 text-p3 self-center" do %>
4
+ <%= content_wrapper class: "w-full pr-8 ui-text-p3 self-center" do %>
5
5
  <strong class="font-bold whitespace-nowrap pr-4"><%= @contents[:title] %></strong>
6
6
  <span class="pr-4"><%= @contents[:body_text] %></span>
7
7
  <span class="underline cursor-pointer whitespace-nowrap"><%= @contents[:button_label] %></span>
@@ -9,7 +9,7 @@
9
9
 
10
10
  <% if close_btn? %>
11
11
  <%= button_tag type: 'button', class: 'h-20 w-20 mt-4 ml-auto border-none bg-none self-baseline' do %>
12
- <%= render(AblyUi::Core::Icon.new(name: "icon-gui-close", size: "1.25rem", color: "text-white")) %>
12
+ <%= render(AblyUi::Core::Icon.new(name: "icon-gui-close", size: "1.25rem", color: "text-cool-black")) %>
13
13
  <% end %>
14
14
  <% end %>
15
15
  </div>
@@ -36,15 +36,15 @@
36
36
  <% if company[:layout] == "quotes" %>
37
37
  <%= render(AblyUi::Core::Icon.new(name: "quote", size: "1.25rem", color: "text-cool-black")) %>
38
38
 
39
- <p class="text-quote font-light mb-24"><%= company[:quote] %></p>
39
+ <p class="ui-text-quote mb-24"><%= company[:quote] %></p>
40
40
 
41
41
  <div class="flex items-center">
42
42
  <div class="flex-shrink-0 flex-grow-0 mr-16 overflow-hidden rounded-full flex align-center justify-center w-48 h-48">
43
43
  <%= image_tag company[:author][:thumbnail], alt: "Picture of #{company[:author][:name]}, #{company[:author][:title]}", class: "w-48 h-48 filter-grayscale" %>
44
44
  </div>
45
45
  <div>
46
- <p class="text-p2 font-medium"><%= company[:author][:name] %></p>
47
- <p class="text-p3 font-light"><%= company[:author][:title] %></p>
46
+ <p class="ui-text-p2"><%= company[:author][:name] %></p>
47
+ <p class="ui-text-p3"><%= company[:author][:title] %></p>
48
48
  </div>
49
49
  </div>
50
50
  <% end %>
@@ -54,16 +54,16 @@
54
54
  <% company[:columns].each_with_index do |col, n| %>
55
55
  <% if company[:columns].last == col %>
56
56
  <div class="flex-1 mt-40 sm:mt-0 <%= col[:classname] %>" data-id="casestudy-column">
57
- <p class="text-h4 pb-24"><%= col[:heading] %></p>
58
- <p class="text-p1 font-light"><%= col[:text] %></p>
57
+ <p class="ui-text-h4 pb-24"><%= col[:heading] %></p>
58
+ <p class="ui-text-p1"><%= col[:text] %></p>
59
59
  <%- if col[:button] %>
60
60
  <a class="ui-btn self-start p-btn mt-24" href="<%= col[:button][:href] %>"><%= col[:button][:label] %></a>
61
61
  <% end %>
62
62
  </div>
63
63
  <% else %>
64
64
  <div class="flex-1 mt-40 sm:mt-0 mr-24 sm:mr-32 xl:mr-64 <%= col[:classname] %>" data-id="casestudy-column">
65
- <p class="text-title-xl font-extra-large"><%= col[:heading] %></p>
66
- <p class="text-p1 font-light mb-0 sm:mb-32"><%= col[:text] %></p>
65
+ <p class="ui-text-title-xl"><%= col[:heading] %></p>
66
+ <p class="ui-text-p1 mb-0 sm:mb-32"><%= col[:text] %></p>
67
67
  </div>
68
68
  <% end %>
69
69
  <% end %>
@@ -498,13 +498,13 @@
498
498
  }
499
499
 
500
500
  .ui-text-overline1 {
501
- @apply font-mono font-medium text-active-orange uppercase;
501
+ @apply font-mono font-normal text-active-orange uppercase;
502
502
  @apply text-overline1 leading-normal;
503
503
  @apply tracking-widen-0.16;
504
504
  }
505
505
 
506
506
  .ui-text-overline2 {
507
- @apply font-mono font-medium text-active-orange uppercase;
507
+ @apply font-mono font-normal text-active-orange uppercase;
508
508
  @apply text-overline2 leading-normal;
509
509
  @apply tracking-widen-0.16;
510
510
  }
@@ -525,25 +525,32 @@
525
525
  }
526
526
 
527
527
  .ui-text-code {
528
- @apply font-mono font-medium text-code;
528
+ @apply font-mono font-normal text-code;
529
529
  }
530
530
 
531
531
  .ui-text-code2 {
532
- @apply font-mono font-medium text-code2;
532
+ @apply font-mono font-normal text-code2;
533
533
  }
534
534
 
535
535
  .ui-text-code-inline {
536
- @apply font-mono font-medium text-code text-charcoal-grey bg-light-grey p-inline-code rounded-sm mx-1;
536
+ @apply font-mono font-normal text-code text-charcoal-grey bg-light-grey p-inline-code rounded-sm mx-1;
537
537
  }
538
538
 
539
539
  .ui-unordered-list {
540
- @apply text-p1 font-medium text-cool-black;
541
- @apply list-disc ml-32 my-16;
540
+ @apply text-p1 font-medium text-charcoal-grey;
541
+ @apply ml-32 my-16;
542
+ @apply list-disc;
542
543
  }
543
544
 
544
545
  .ui-ordered-list {
545
546
  @apply text-p1 font-medium text-charcoal-grey;
546
- @apply ml-32 my-16 list-decimal;
547
+ @apply ml-32 my-16;
548
+ @apply list-decimal;
549
+ }
550
+
551
+ .ui-ordered-list li,
552
+ .ui-unordered-list li {
553
+ @apply mb-8;
547
554
  }
548
555
 
549
556
  .ui-unordered-list li > *:last-of-type:not(ul):not(ol),
@@ -552,11 +559,11 @@
552
559
  }
553
560
 
554
561
  .ui-unordered-list ul {
555
- @apply ml-24 mt-16 list-circle;
562
+ @apply ml-24 my-8 list-circle;
556
563
  }
557
564
 
558
565
  .ui-ordered-list ol {
559
- @apply ml-24 mt-16 list-decimal;
566
+ @apply ml-24 my-16 list-decimal;
560
567
  }
561
568
 
562
569
  .ui-unordered-list ul ul {
@@ -567,34 +574,6 @@
567
574
  @apply my-8;
568
575
  }
569
576
 
570
- .ui-ordered-list li,
571
- .ui-unordered-list li {
572
- @apply font-medium font-sans tracking-widen-0;
573
- line-height: var(--lh-extra-relaxed);
574
- }
575
-
576
- .ui-unordered-list-with-emphasis {
577
- @apply text-p1 font-medium text-cool-black;
578
- @apply list-disc ml-32 mt-32 -mb-12;
579
- }
580
-
581
- .ui-unordered-list-with-emphasis li div {
582
- @apply relative -top-12;
583
- }
584
-
585
- .ui-unordered-list-with-emphasis li div > strong {
586
- @apply block;
587
- }
588
-
589
- .ui-unordered-list-with-emphasis ul {
590
- margin-top: calc(var(--spacing-16) + var(--spacing-8));
591
- @apply ml-24 list-circle;
592
- }
593
-
594
- .ui-unordered-list-with-emphasis ul ul {
595
- @apply list-square;
596
- }
597
-
598
577
  .ui-link {
599
578
  @apply text-gui-default;
600
579
  @apply hover:text-gui-hover active:text-gui-active disabled:text-gui-unavailable;
@@ -86,7 +86,7 @@
86
86
  .ui-uptime-key {
87
87
  @apply block mt-16 mr-20 bg-transparent;
88
88
  @apply sm:inline-block sm:mt-0;
89
- @apply font-light text-p2 text-white block sm:inline-flex items-center;
89
+ @apply font-medium text-p2 text-white block sm:inline-flex items-center;
90
90
  }
91
91
 
92
92
  .ui-uptime-key:first-child {
@@ -1,3 +1,3 @@
1
1
  module AblyUi
2
- VERSION = '11.7.1.dev.d409fff'
2
+ VERSION = '11.7.1.dev.1344841'
3
3
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: ably-ui
3
3
  version: !ruby/object:Gem::Version
4
- version: 11.7.1.dev.d409fff
4
+ version: 11.7.1.dev.1344841
5
5
  platform: ruby
6
6
  authors:
7
7
  - Dominik Piatek
@@ -10,7 +10,7 @@ authors:
10
10
  autorequire:
11
11
  bindir: bin
12
12
  cert_chain: []
13
- date: 2023-11-24 00:00:00.000000000 Z
13
+ date: 2023-11-30 00:00:00.000000000 Z
14
14
  dependencies:
15
15
  - !ruby/object:Gem::Dependency
16
16
  name: view_component