ably-ui 8.7.0.dev.67ade86 → 8.7.0.dev.68ea318
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/Gemfile.lock +1 -1
- data/README.md +4 -15
- data/lib/ably_ui/core/core.rb +4 -12
- data/lib/ably_ui/core/footer/component.css +1 -21
- data/lib/ably_ui/core/footer/footer.html.erb +56 -118
- data/lib/ably_ui/core/logo/logo.html.erb +27 -2
- data/lib/ably_ui/core/logo/logo.rb +6 -15
- data/lib/ably_ui/core/meganav/component.json +1 -1
- data/lib/ably_ui/core/meganav/meganav.html.erb +1 -1
- data/lib/ably_ui/core/meganav/meganav.rb +2 -3
- data/lib/ably_ui/core/meganav_content_developers/meganav_content_developers.html.erb +12 -12
- data/lib/ably_ui/core/meganav_content_platform/meganav_content_platform.html.erb +6 -6
- data/lib/ably_ui/core/meganav_content_use_cases/meganav_content_use_cases.html.erb +38 -32
- data/lib/ably_ui/core/notice/component.js +1 -1
- data/lib/ably_ui/core/sprites.svg +0 -22
- data/lib/ably_ui/version.rb +1 -1
- metadata +2 -6
- data/lib/ably_ui/core/images/ably-logo.png +0 -0
- data/lib/ably_ui/core/images/high-performer-2022.png +0 -0
- data/lib/ably_ui/core/images/highest-user-adoption-2022.png +0 -0
- data/lib/ably_ui/core/images/users-love-us-2022.png +0 -0
|
@@ -3,58 +3,49 @@
|
|
|
3
3
|
<section class="grid grid-cols-12 ui-grid-gap-x w-full">
|
|
4
4
|
<div class="col-span-full md:col-span-4 py-24 lg:py-32 px-24 sm:px-32 md:pl-0 md:pr-24 bg-extra-light-grey">
|
|
5
5
|
<h3 class="ui-meganav-overline" id="meganav-use-cases-panel-use-cases">
|
|
6
|
-
|
|
6
|
+
Use cases
|
|
7
7
|
</h3>
|
|
8
8
|
<ul aria-labelledby="meganav-use-cases-panel-industry-use-cases">
|
|
9
9
|
<li>
|
|
10
|
-
<%= link_to abs_url("/solutions/
|
|
11
|
-
<%= render(AblyUi::Core::Icon.new(name: "icon-
|
|
12
|
-
<div class="flex flex-col justify-center">
|
|
13
|
-
<p class="ui-meganav-media-heading">Chat</p>
|
|
14
|
-
<p class="ui-meganav-media-copy">Deliver highly reliable chat experiences at scale. </p>
|
|
15
|
-
</div>
|
|
16
|
-
<% end %>
|
|
17
|
-
</li>
|
|
18
|
-
<li>
|
|
19
|
-
<%= link_to abs_url("/solutions/multiplayer-collaboration"), class: "ui-meganav-media-with-image group" do %>
|
|
20
|
-
<%= render(AblyUi::Core::Icon.new(name: "icon-multi-user-spaces-col", size: "2.5rem")) %>
|
|
10
|
+
<%= link_to abs_url("/solutions/live-updates-results-metrics"), class: "ui-meganav-media-with-image group" do %>
|
|
11
|
+
<%= render(AblyUi::Core::Icon.new(name: "icon-live-updates-results-metrics-col", size: "2.5rem")) %>
|
|
21
12
|
<div class="flex flex-col justify-center">
|
|
22
|
-
<p class="ui-meganav-media-heading">
|
|
23
|
-
<p class="ui-meganav-media-copy">
|
|
13
|
+
<p class="ui-meganav-media-heading">Live updates, results & metrics</p>
|
|
14
|
+
<p class="ui-meganav-media-copy">Deliver live updates to keep users informed.</p>
|
|
24
15
|
</div>
|
|
25
16
|
<% end %>
|
|
26
17
|
</li>
|
|
27
18
|
<li>
|
|
28
|
-
<%= link_to abs_url("/solutions/
|
|
29
|
-
<%= render(AblyUi::Core::Icon.new(name: "icon-
|
|
19
|
+
<%= link_to abs_url("/solutions/chat"), class: "ui-meganav-media-with-image group" do %>
|
|
20
|
+
<%= render(AblyUi::Core::Icon.new(name: "icon-display-chat-stack-col", size: "2.5rem")) %>
|
|
30
21
|
<div class="flex flex-col justify-center">
|
|
31
|
-
<p class="ui-meganav-media-heading">
|
|
32
|
-
<p class="ui-meganav-media-copy">
|
|
22
|
+
<p class="ui-meganav-media-heading">Chat</p>
|
|
23
|
+
<p class="ui-meganav-media-copy">Deliver highly reliable chat experiences at scale. </p>
|
|
33
24
|
</div>
|
|
34
25
|
<% end %>
|
|
35
26
|
</li>
|
|
36
27
|
<li>
|
|
37
|
-
<%= link_to abs_url("/solutions/
|
|
38
|
-
<%= render(AblyUi::Core::Icon.new(name: "icon-display-virtual-events", size: "2.5rem")) %>
|
|
28
|
+
<%= link_to abs_url("/solutions/virtual-events"), class: "ui-meganav-media-with-image group" do %>
|
|
29
|
+
<%= render(AblyUi::Core::Icon.new(name: "icon-display-virtual-events-col", size: "2.5rem")) %>
|
|
39
30
|
<div class="flex flex-col justify-center">
|
|
40
|
-
<p class="ui-meganav-media-heading">
|
|
41
|
-
<p class="ui-meganav-media-copy">
|
|
31
|
+
<p class="ui-meganav-media-heading">Virtual Events</p>
|
|
32
|
+
<p class="ui-meganav-media-copy">Power engaging virtual events with realtime features.</p>
|
|
42
33
|
</div>
|
|
43
34
|
<% end %>
|
|
44
35
|
</li>
|
|
45
36
|
<li>
|
|
46
|
-
<%= link_to abs_url("/solutions/
|
|
47
|
-
<%= render(AblyUi::Core::Icon.new(name: "icon-
|
|
37
|
+
<%= link_to abs_url("/solutions/multi-user-virtual-spaces"), class: "ui-meganav-media-with-image group" do %>
|
|
38
|
+
<%= render(AblyUi::Core::Icon.new(name: "icon-multi-user-spaces-col", size: "2.5rem")) %>
|
|
48
39
|
<div class="flex flex-col justify-center">
|
|
49
|
-
<p class="ui-meganav-media-heading">
|
|
50
|
-
<p class="ui-meganav-media-copy">
|
|
40
|
+
<p class="ui-meganav-media-heading">Multi-user virtual spaces</p>
|
|
41
|
+
<p class="ui-meganav-media-copy">Build live and interactive multi-user applications.</p>
|
|
51
42
|
</div>
|
|
52
43
|
<% end %>
|
|
53
44
|
</li>
|
|
54
45
|
</ul>
|
|
55
46
|
</div>
|
|
56
47
|
|
|
57
|
-
<div class="col-span-full md:col-span-4 pt-24 pb-
|
|
48
|
+
<div class="col-span-full md:col-span-4 pt-24 pb-8 md:py-24 lg:py-32 px-24 sm:px-32 md:px-0 bg-white">
|
|
58
49
|
<h3 class="ui-meganav-overline" id="meganav-use-cases-panel-industry">
|
|
59
50
|
Industry
|
|
60
51
|
</h3>
|
|
@@ -89,11 +80,6 @@
|
|
|
89
80
|
<p class="ui-meganav-media-copy">Provide trustworthy, HIPAA-compliant realtime apps.</p>
|
|
90
81
|
<% end %>
|
|
91
82
|
</li>
|
|
92
|
-
</ul>
|
|
93
|
-
</div>
|
|
94
|
-
|
|
95
|
-
<div class="col-span-full md:col-span-4 pt-0 pb-24 md:py-24 lg:py-32 px-24 sm:px-32 md:px-0 bg-white">
|
|
96
|
-
<ul aria-labelledby="meganav-use-cases-panel-solutions" class="mt-0 md:mt-40">
|
|
97
83
|
<li>
|
|
98
84
|
<%= link_to abs_url("/solutions/ecommerce-and-retail"), class: "ui-meganav-media group" do %>
|
|
99
85
|
<p class="ui-meganav-media-heading">eCommerce & Retail</p>
|
|
@@ -120,6 +106,26 @@
|
|
|
120
106
|
</li>
|
|
121
107
|
</ul>
|
|
122
108
|
</div>
|
|
109
|
+
|
|
110
|
+
<div class="col-span-full md:col-span-4 pt-8 pb-24 md:py-24 lg:py-32 px-24 sm:px-32 md:px-0 bg-white">
|
|
111
|
+
<h3 class="ui-meganav-overline" id="meganav-use-cases-panel-solutions">
|
|
112
|
+
Solutions
|
|
113
|
+
</h3>
|
|
114
|
+
<ul aria-labelledby="meganav-use-cases-panel-solutions">
|
|
115
|
+
<li>
|
|
116
|
+
<%= link_to abs_url("/solutions/extend-kafka-to-the-edge"), class: "ui-meganav-media group" do %>
|
|
117
|
+
<p class="ui-meganav-media-heading">Extend Kafka to the edge</p>
|
|
118
|
+
<p class="ui-meganav-media-copy">Reliably expand Kafka’s event streaming beyond your private network.</p>
|
|
119
|
+
<% end %>
|
|
120
|
+
</li>
|
|
121
|
+
<li>
|
|
122
|
+
<%= link_to abs_url("/solutions/asset-tracking"), class: "ui-meganav-media group" do %>
|
|
123
|
+
<p class="ui-meganav-media-heading">Asset Tracking</p>
|
|
124
|
+
<p class="ui-meganav-media-copy">Track assets in realtime with a solution optimised for last mile logistics.</p>
|
|
125
|
+
<% end %>
|
|
126
|
+
</li>
|
|
127
|
+
</ul>
|
|
128
|
+
</div>
|
|
123
129
|
</section>
|
|
124
130
|
<div class="ui-meganav-content-spacer"></div>
|
|
125
131
|
</div>
|
|
@@ -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,(function(e,t,r,n,o,i){return(()=>{"use strict";var c={6357:t=>{t.exports=e},9349:e=>{e.exports=t},2040:e=>{e.exports=r},3474:e=>{e.exports=n},9281:e=>{e.exports=o},5044: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:()=>
|
|
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,(function(e,t,r,n,o,i){return(()=>{"use strict";var c={6357:t=>{t.exports=e},9349:e=>{e.exports=t},2040:e=>{e.exports=r},3474:e=>{e.exports=n},9281:e=>{e.exports=o},5044: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:()=>U});var e=u(9349),t=u.n(e),r=u(2040),n=u.n(r),o=u(9281),i=u.n(o),c=u(6357),a=u.n(c),s=u(3474),f=u.n(s);u(5044);var p=["name","size","color","additionalCSS"];function d(){return d=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},d.apply(this,arguments)}var y=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,p);return i().createElement("svg",d({className:"".concat(c," ").concat(u),style:{width:n,height:n}},l),i().createElement("use",{xlinkHref:"#sprite-".concat(t)}))};y.propTypes={name:f().string.isRequired,size:f().string,color:f().string,additionalCSS:f().string};const b=y;function m(){return m=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},m.apply(this,arguments)}function v(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,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)||w(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 h(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function O(e){return function(e){if(Array.isArray(e))return j(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||w(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 w(e,t){if(e){if("string"==typeof e)return j(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)?j(e,t):void 0}}function j(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 x="ui-flashes",S={items:[]},E=(h({},"flashes",(function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:S,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(O(e.items),O(r))}}return e})),{type:f().oneOf(["error","success","notice","info","alert"]),content:f().string}),P={error:"bg-gui-error",success:"bg-zingy-green",notice:"bg-electric-cyan",info:"bg-electric-cyan",alert:"bg-active-orange"},A={error:"text-white",success:"text-cool-black",notice:"text-cool-black",info:"text-cool-black",alert:"text-white"},k=["success","info","notice"],q=function(e){var t=e.type,r=e.content,n=(0,o.useRef)(null),c=g((0,o.useState)(!1),2),u=c[0],l=c[1],s=g((0,o.useState)(0),2),f=s[0],p=s[1],d=g((0,o.useState)(!1),2),y=d[0],m=d[1];(0,o.useEffect)((function(){return m(!0)}),[]),(0,o.useEffect)((function(){k.includes(t)&&setTimeout((function(){h()}),8e3)}),[u]);var v,h=function(){n.current&&p(n.current.getBoundingClientRect().height),setTimeout((function(){return l(!0)}),0)},O=y&&!u;v=f&&!u?{height:"".concat(f,"px")}:u?{height:0,marginTop:0,zIndex:-1}:{};var w=a().sanitize(r,{ALLOWED_TAGS:["a"],ALLOWED_ATTR:["href","data-method","rel"]}),j={notice:"icon-gui-ably-badge",success:"icon-gui-tick",error:"icon-gui-warning",alert:"icon-gui-warning"},x={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(O?"ui-flash-message-enter":""),style:v,ref:n,"data-id":"ui-flash"},i().createElement("div",{className:"".concat(P[t]," p-32 flex align-center rounded shadow-container-subtle")},j[t]&&i().createElement(b,{name:j[t],color:x[t],size:"1.5rem",additionalCSS:"mr-16 self-baseline"}),i().createElement("p",{className:"ui-flash-text ".concat(A[t]),dangerouslySetInnerHTML:{__html:w}}),i().createElement("button",{type:"button",className:"p-0 ml-auto self-start focus:outline-none",onClick:h},i().createElement(b,{name:"icon-gui-close",color:x[t],size:"1.5rem",additionalCSS:"transition-colors"}))))};q.propTypes=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?v(Object(r),!0).forEach((function(t){h(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):v(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}({},E);var T=function(e){var t=e.flashes,r=(null==t?void 0:t.items)||[];return i().createElement("div",{className:"ui-flash","data-id":x},r.map((function(e){return i().createElement(q,m({key:e.type},e))})))};T.propTypes={flashes:f().shape({items:f().arrayOf(f().shape(E))})};function C(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 L(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 z=function(e){var t=function(e){return(arguments.length>1&&void 0!==arguments[1]?arguments[1]:document).querySelector("[data-id=".concat(e,"]"))}(x);t&&(t.style.marginTop=e?"4rem":null)},D=function(e){window.matchMedia("(min-width: 65rem)").matches?e.style.display=null:e.style.display="none"},I=function(e){e.style.maxHeight=0,e.style.overflow="hidden",z(!1)},N=function(e){e.style.maxHeight=null,e.style.overflow=null,z(!0)};const U=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(){};D(r),N(r);var a=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?C(Object(r),!0).forEach((function(t){L(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):C(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&&I(e);var t=n()((function(){window.scrollY>5?I(e):e.style.overflow&&N(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),I(e),o()};return i.addEventListener("click",c),function(){return document.removeEventListener("click",c)}}(r,o,i,u),s=function(e){var t=n()((function(){D(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})()}));
|