ably-ui 8.7.0.dev.7021bee → 8.7.0.dev.7706f12
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/Gemfile.lock +1 -1
- data/README.md +8 -1
- data/lib/ably_ui/core/core.rb +8 -4
- data/lib/ably_ui/core/footer/component.css +20 -0
- data/lib/ably_ui/core/footer/footer.html.erb +116 -54
- 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
- data/lib/ably_ui/core/meganav/component.json +1 -1
- data/lib/ably_ui/core/meganav/meganav.rb +2 -2
- data/lib/ably_ui/core/meganav_content_developers/meganav_content_developers.html.erb +12 -12
- data/lib/ably_ui/core/notice/component.js +1 -1
- data/lib/ably_ui/core/sprites.svg +6 -0
- data/lib/ably_ui/version.rb +1 -1
- metadata +5 -4
- data/lib/ably_ui/react/connect_state_wrapper/component.js +0 -1
- data/lib/ably_ui/react/scripts.js +0 -1
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: a61faa607352b16daec8385c76c019ff8dfd7a4c4906f1c5356b7735684d81f8
|
|
4
|
+
data.tar.gz: 3702470d68e7eb18262d06320205ae85dcd150bdac2ae12cea589b935744ef3f
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 34939a748451b9d639e8e638b203157997532050531d804e422cf567ca3024b763c9a792644df040cb10c679c6b22c46b9cc524033c11de967668cf114bc4f74
|
|
7
|
+
data.tar.gz: f6aca8cf58d32139b63b90b4c110a3b46ab02d780ca81f3d2fad7f6c92a85d454c4c8725ba7eaaebcdcc1b60acf62d0bcc9d0ec56d1e4d85184a6b65cc115655
|
data/Gemfile.lock
CHANGED
data/README.md
CHANGED
|
@@ -239,7 +239,14 @@ yarn link @ably/ui
|
|
|
239
239
|
|
|
240
240
|
For `ruby`:
|
|
241
241
|
|
|
242
|
-
In `preview/Gemfile` replace
|
|
242
|
+
In `preview/Gemfile` replace the Ably UI gem version number with `path: '../'` like this:
|
|
243
|
+
|
|
244
|
+
```bash
|
|
245
|
+
# in preview
|
|
246
|
+
gem 'ably-ui', path: '../', require: 'ably_ui'
|
|
247
|
+
```
|
|
248
|
+
|
|
249
|
+
and run:
|
|
243
250
|
|
|
244
251
|
```bash
|
|
245
252
|
# in preview
|
data/lib/ably_ui/core/core.rb
CHANGED
|
@@ -42,12 +42,16 @@ module AblyUi
|
|
|
42
42
|
asset_path 'ably_ui/core/images/icon-tech-aws.svg'
|
|
43
43
|
end
|
|
44
44
|
|
|
45
|
-
def
|
|
46
|
-
asset_path 'ably_ui/core/images/
|
|
45
|
+
def highest_performer
|
|
46
|
+
asset_path 'ably_ui/core/images/high-performer-2022.png'
|
|
47
47
|
end
|
|
48
48
|
|
|
49
|
-
def
|
|
50
|
-
asset_path 'ably_ui/core/images/
|
|
49
|
+
def highest_user_adoption
|
|
50
|
+
asset_path 'ably_ui/core/images/highest-user-adoption-2022.png'
|
|
51
|
+
end
|
|
52
|
+
|
|
53
|
+
def users_love_us
|
|
54
|
+
asset_path 'ably_ui/core/images/users-love-us-2022.png'
|
|
51
55
|
end
|
|
52
56
|
end
|
|
53
57
|
|
|
@@ -10,5 +10,25 @@
|
|
|
10
10
|
.ui-footer-link {
|
|
11
11
|
@apply text-gui-default hover:text-gui-hover hover:underline text-menu3 font-light;
|
|
12
12
|
}
|
|
13
|
+
|
|
14
|
+
.ui-footer-compliance-text {
|
|
15
|
+
font-size: 12px;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.ui-footer-tick-icon {
|
|
19
|
+
min-width: 1.5rem;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
@media (max-width: 1040px) {
|
|
23
|
+
.ui-footer-bottom-links {
|
|
24
|
+
@apply pb-40;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
@media screen {
|
|
29
|
+
.ui-footer-glassdoor {
|
|
30
|
+
display: none;
|
|
31
|
+
}
|
|
32
|
+
}
|
|
13
33
|
}
|
|
14
34
|
|
|
@@ -1,18 +1,16 @@
|
|
|
1
1
|
<footer class="bg-light-grey font-sans antialiased" data-id="footer">
|
|
2
|
-
<div class="max-w-screen-xl mx-auto py-32 sm:py-40
|
|
2
|
+
<div class="max-w-screen-xl mx-auto py-32 sm:py-40 md:py-64 ui-grid-gap ui-grid-px grid grid-cols-6">
|
|
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
6
|
<h2 class="text-overline2 col-span-full font-medium uppercase tracking-widen-0.1">The Ably Platform</h2>
|
|
7
7
|
</div>
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
<p class="text-p3 py-16 font-medium p-menu-row-snug col-span-3">
|
|
8
|
+
<div class="md:col-span-4 md:w-3/4 xs:w-3/5 w-full">
|
|
9
|
+
<p class="text-p3 py-16 font-medium p-menu-row-snug">
|
|
11
10
|
Easily power any realtime experience in your application via a simple API that handles everything realtime.
|
|
12
11
|
</p>
|
|
13
12
|
</div>
|
|
14
|
-
|
|
15
|
-
<ul class="grid gap-x-8 sm:gap-x-16 md:gap-x-24 xl:gap-x-32 sm:grid-cols-2 md:grid-cols-1">
|
|
13
|
+
<ul class="grid grid-cols-1">
|
|
16
14
|
<li class="p-menu-row-snug">
|
|
17
15
|
<%= link_to 'Pub/sub messaging', abs_url("/pub-sub-messaging"), class: "ui-footer-menu-row-link" %>
|
|
18
16
|
</li>
|
|
@@ -30,8 +28,7 @@
|
|
|
30
28
|
</li>
|
|
31
29
|
</ul>
|
|
32
30
|
</div>
|
|
33
|
-
|
|
34
|
-
<div class="col-span-full sm:col-span-3 md:col-span-1">
|
|
31
|
+
<div class="col-span-full xs:col-span-3 md:col-span-1">
|
|
35
32
|
<h2 class="ui-footer-col-title">Ably is for</h2>
|
|
36
33
|
<ul>
|
|
37
34
|
<li class="p-menu-row-snug">
|
|
@@ -69,8 +66,7 @@
|
|
|
69
66
|
</li>
|
|
70
67
|
</ul>
|
|
71
68
|
</div>
|
|
72
|
-
|
|
73
|
-
<div class="col-span-full sm:col-span-3 md:col-span-1">
|
|
69
|
+
<div class="col-span-full xs:col-span-3 md:col-span-1">
|
|
74
70
|
<h2 class="ui-footer-col-title">Developers</h2>
|
|
75
71
|
<ul>
|
|
76
72
|
<li class="p-menu-row-snug">
|
|
@@ -97,8 +93,7 @@
|
|
|
97
93
|
</li>
|
|
98
94
|
</ul>
|
|
99
95
|
</div>
|
|
100
|
-
|
|
101
|
-
<div class="col-span-full sm:col-span-3 md:col-span-1">
|
|
96
|
+
<div class="col-span-full xs:col-span-3 md:col-span-1">
|
|
102
97
|
<h2 class="ui-footer-col-title">WHY ABLY</h2>
|
|
103
98
|
<ul>
|
|
104
99
|
<li class="p-menu-row-snug">
|
|
@@ -121,8 +116,7 @@
|
|
|
121
116
|
</li>
|
|
122
117
|
</ul>
|
|
123
118
|
</div>
|
|
124
|
-
|
|
125
|
-
<div class="col-span-full sm:col-span-3 md:col-span-1">
|
|
119
|
+
<div class="col-span-full xs:col-span-3 md:col-span-1">
|
|
126
120
|
<h2 class="ui-footer-col-title">ABOUT</h2>
|
|
127
121
|
<ul>
|
|
128
122
|
<li class="p-menu-row-snug">
|
|
@@ -141,7 +135,7 @@
|
|
|
141
135
|
<%= link_to 'Open protocol policy', abs_url("/open-policy"), class: "ui-footer-menu-row-link" %>
|
|
142
136
|
</li>
|
|
143
137
|
<li class="p-menu-row-snug">
|
|
144
|
-
|
|
138
|
+
<%= link_to 'Press & Media', abs_url("/press-center"), class: "ui-footer-menu-row-link" %>
|
|
145
139
|
</li>
|
|
146
140
|
<li class="p-menu-row-snug">
|
|
147
141
|
<%= link_to 'Contact us', abs_url("/contact"), class: "ui-footer-menu-row-link" %>
|
|
@@ -149,51 +143,119 @@
|
|
|
149
143
|
</ul>
|
|
150
144
|
</div>
|
|
151
145
|
</div>
|
|
152
|
-
|
|
153
146
|
<div class="max-w-screen-xl ui-grid-px mx-auto">
|
|
154
|
-
<hr class="border-t border-mid-grey"
|
|
147
|
+
<hr class="border-t border-mid-grey my-0"/>
|
|
155
148
|
</div>
|
|
156
|
-
|
|
157
|
-
<div class="max-w-screen-xl mx-auto py-
|
|
158
|
-
<div class="flex
|
|
159
|
-
<div class="
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
149
|
+
<%# Twitter + Glassdoor SM * above + Glassdoor XS + Badges %>
|
|
150
|
+
<div class="max-w-screen-xl mx-auto py-32 grid ui-grid-gap ui-grid-px sm:grid-cols-2">
|
|
151
|
+
<div class="md:flex md:items-center">
|
|
152
|
+
<div class="flex flex-col md:flex-row flex-auto ml-8 sm:col-span-1 md:col-span-2">
|
|
153
|
+
<div class="">
|
|
154
|
+
<div class="flex pb-24">
|
|
155
|
+
<a class="h-24 pr-24 text-cool-black hover:text-icon-twitter" href="https://twitter.com/ablyrealtime" title="Ably on Twitter">
|
|
156
|
+
<%= render(AblyUi::Core::Icon.new(name: "twitter", size: "1.5rem")) %>
|
|
157
|
+
</a>
|
|
158
|
+
<a
|
|
159
|
+
class="h-24 pr-24 text-cool-black hover:text-icon-linkedin"
|
|
160
|
+
href="https://www.linkedin.com/company/ably-realtime"
|
|
161
|
+
title="Ably on LinkedIn"
|
|
162
|
+
>
|
|
163
|
+
<%= render(AblyUi::Core::Icon.new(name: "linkedin", size: "1.5rem")) %>
|
|
164
|
+
</a>
|
|
165
|
+
<a class="h-24 pr-24 text-cool-black hover:text-icon-github" href="https://github.com/ably/" title="Ably on Github">
|
|
166
|
+
<%= render(AblyUi::Core::Icon.new(name: "github", size: "1.5rem")) %>
|
|
167
|
+
</a>
|
|
168
|
+
<a class="h-24 pr-24 text-cool-black hover:text-icon-discord" href="https://discord.gg/jwBPhEZ9g5" title="Ably on Discord">
|
|
169
|
+
<%= render(AblyUi::Core::Icon.new(name: "discord", size: "1.5rem")) %>
|
|
170
|
+
</a>
|
|
171
|
+
</div>
|
|
172
|
+
</div>
|
|
173
|
+
<%# GLASSDOOR on SM and Above %>
|
|
174
|
+
<div class="xs:hidden sm:block ui-footer-glassdoor">
|
|
175
|
+
<div class="flex sm:pt-24 md:pt-0 sm:border-t sm:border-l-0 md:border-t-0 md:border-l sm:border-mid-grey sm:w-3/4 md:w-full md:pl-24">
|
|
176
|
+
<a
|
|
177
|
+
href="https://www.glassdoor.co.uk/Overview/Working-at-Ably-EI_IE2184188.11,15.htm"
|
|
178
|
+
class="h-24 text-cool-black hover:text-icon-glassdoor"
|
|
179
|
+
title="Ably reviews on glassdoor"
|
|
180
|
+
>
|
|
181
|
+
<%= render(AblyUi::Core::Icon.new(name: "glassdoor", size: "1.5rem")) %>
|
|
182
|
+
</a>
|
|
183
|
+
<div class="pl-16 text-menu3 font-light">
|
|
184
|
+
<strong class="block font-medium">We're hiring!</strong>
|
|
185
|
+
<a href="https://www.glassdoor.co.uk/Overview/Working-at-Ably-EI_IE2184188.11,15.htm" class="ui-footer-link">
|
|
186
|
+
Learn more at Glassdoor
|
|
187
|
+
</a>
|
|
188
|
+
</div>
|
|
189
|
+
</div>
|
|
190
|
+
</div>
|
|
164
191
|
</div>
|
|
165
|
-
|
|
166
|
-
<div class="
|
|
167
|
-
<
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
href="https://www.glassdoor.co.uk/Overview/Working-at-Ably-EI_IE2184188.11,15.htm"
|
|
183
|
-
>
|
|
184
|
-
<%= render(AblyUi::Core::Icon.new(name: "glassdoor", size: "1.5rem")) %>
|
|
185
|
-
</a>
|
|
186
|
-
<div class="pl-16 text-menu3 font-light">
|
|
187
|
-
<strong class="block font-medium">We're hiring!</strong>
|
|
188
|
-
<a href="https://www.glassdoor.co.uk/Overview/Working-at-Ably-EI_IE2184188.11,15.htm" class="ui-footer-link">Learn more</a>
|
|
189
|
-
at Glassdoor
|
|
192
|
+
<%# GlassDoor on XS ONLY %>
|
|
193
|
+
<div class="xs:block sm:hidden">
|
|
194
|
+
<div class="border-t border-mid-grey w-full"></div>
|
|
195
|
+
<div class="flex py-24">
|
|
196
|
+
<a
|
|
197
|
+
class="h-24 pr-24 text-cool-black hover:text-icon-glassdoor"
|
|
198
|
+
href="https://www.glassdoor.co.uk/Overview/Working-at-Ably-EI_IE2184188.11,15.htm"
|
|
199
|
+
title="Ably reviews on glassdoor"
|
|
200
|
+
>
|
|
201
|
+
<%= render(AblyUi::Core::Icon.new(name: "glassdoor", size: "1.5rem")) %>
|
|
202
|
+
</a>
|
|
203
|
+
<div class="text-menu3 font-light">
|
|
204
|
+
<strong class="block font-medium">We're hiring!</strong>
|
|
205
|
+
<a href="https://www.glassdoor.co.uk/Overview/Working-at-Ably-EI_IE2184188.11,15.htm" class="ui-footer-link">
|
|
206
|
+
Learn more at Glassdoor
|
|
207
|
+
</a>
|
|
208
|
+
</div>
|
|
190
209
|
</div>
|
|
191
210
|
</div>
|
|
192
211
|
</div>
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
<%= image_tag(
|
|
196
|
-
<%= image_tag(
|
|
212
|
+
<div class="col-span-full sm:col-span-1 inline-flex sm:ml-auto sm:items-center">
|
|
213
|
+
<%= image_tag(highest_user_adoption, alt: "Highest User Adoption 2022", class: "mr-24 w-96 h-96") %>
|
|
214
|
+
<%= image_tag(users_love_us, alt: "Users Love Us", class: "mr-24 w-96 h-96") %>
|
|
215
|
+
<%= image_tag(highest_performer, alt: "High Performer 2022", class: "mr-24 w-96 h-96") %>
|
|
216
|
+
</div>
|
|
217
|
+
</div>
|
|
218
|
+
<div class="max-w-screen-xl ui-grid-px mx-auto">
|
|
219
|
+
<hr class="border-t border-mid-grey my-0"/>
|
|
220
|
+
</div>
|
|
221
|
+
<div class="max-w-screen-xl mx-auto py-24 sm:py-40 md:py-32 md:grid md:grid-cols-2 ui-grid-gap ui-grid-px">
|
|
222
|
+
<div class="flex ml-8 col-span-full sm:col-span-1 md:pb-16 items-center ui-footer-bottom-links">
|
|
223
|
+
<div class="flex">
|
|
224
|
+
<%= link_to 'Cookies', abs_url("/privacy"), class: "pr-24 ui-footer-link" %>
|
|
225
|
+
<%= link_to 'Legals', abs_url("/legals"), class: "pr-24 ui-footer-link" %>
|
|
226
|
+
<%= link_to 'Data Protection', abs_url("/data-protection"), class: "pr-24 ui-footer-link" %>
|
|
227
|
+
<%= link_to 'Privacy', abs_url("/privacy"), class: "ui-footer-link" %>
|
|
228
|
+
</div>
|
|
229
|
+
</div>
|
|
230
|
+
<div class="xs:grid xs:grid-cols-2 sm:grid-cols-4 xs:pl-16 sm:pl-0 ">
|
|
231
|
+
<div class="flex mr-24">
|
|
232
|
+
<%= render(AblyUi::Core::Icon.new(name: "icon-gui-tick", color: "text-active-orange", size: "1.5rem", additional_css:"bg-white rounded-full mr-12 ui-footer-tick-icon")) %>
|
|
233
|
+
<div>
|
|
234
|
+
<p class="ui-footer-compliance-text font-medium whitespace-nowrap">SOC 2 Type 2</p>
|
|
235
|
+
<p class="ui-footer-compliance-text font-light mb-24">Certified</p>
|
|
236
|
+
</div>
|
|
237
|
+
</div>
|
|
238
|
+
<div class="flex mr-24 md:col-start-2">
|
|
239
|
+
<%= render(AblyUi::Core::Icon.new(name: "icon-gui-tick", color: "text-active-orange", size: "1.5rem", additional_css:"bg-white rounded-full mr-12")) %>
|
|
240
|
+
<div>
|
|
241
|
+
<p class="ui-footer-compliance-text font-medium">HIPAA</p>
|
|
242
|
+
<p class="ui-footer-compliance-text font-light mb-24">Compliant</p>
|
|
243
|
+
</div>
|
|
244
|
+
</div>
|
|
245
|
+
<div class="flex mr-24 md:col-start-3">
|
|
246
|
+
<%= render(AblyUi::Core::Icon.new(name: "icon-gui-tick", color: "text-active-orange", size: "1.5rem", additional_css:"bg-white rounded-full mr-12")) %>
|
|
247
|
+
<div>
|
|
248
|
+
<p class="ui-footer-compliance-text font-medium">EU GDPR</p>
|
|
249
|
+
<p class="ui-footer-compliance-text font-light mb-24">Certified</p>
|
|
250
|
+
</div>
|
|
251
|
+
</div>
|
|
252
|
+
<div class="flex mr-24 md:col-start-4">
|
|
253
|
+
<%= render(AblyUi::Core::Icon.new(name: "icon-gui-tick", color: "text-active-orange", size: "1.5rem", additional_css:"bg-white rounded-full mr-12")) %>
|
|
254
|
+
<div>
|
|
255
|
+
<p class="ui-footer-compliance-text font-medium">256-bit AES</p>
|
|
256
|
+
<p class="ui-footer-compliance-text font-light mb-24">Encryption</p>
|
|
257
|
+
</div>
|
|
258
|
+
</div>
|
|
197
259
|
</div>
|
|
198
260
|
</div>
|
|
199
261
|
</footer>
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
},
|
|
31
31
|
"panels": [
|
|
32
32
|
{ "label": "Platform", "shortLabel": "Platform", "id": "platform-panel", "component": "MeganavContentPlatform" },
|
|
33
|
-
{ "label": "
|
|
33
|
+
{ "label": "Solutions", "shortLabel": "Solutions", "id": "use-cases-panel", "component": "MeganavContentUseCases" },
|
|
34
34
|
{ "label": "Company", "shortLabel": "Company", "id": "company-panel", "component": "MeganavContentCompany" },
|
|
35
35
|
{ "label": "Developers", "shortLabel": "Developers", "id": "developers-panel", "component": "MeganavContentDevelopers" }
|
|
36
36
|
]
|
|
@@ -36,8 +36,8 @@ module AblyUi
|
|
|
36
36
|
class: 'AblyUi::Core::MeganavContentPlatform'
|
|
37
37
|
},
|
|
38
38
|
{
|
|
39
|
-
label: '
|
|
40
|
-
short_label: '
|
|
39
|
+
label: 'Solutions',
|
|
40
|
+
short_label: 'Solutions',
|
|
41
41
|
id: 'use-cases-panel',
|
|
42
42
|
class: 'AblyUi::Core::MeganavContentUseCases'
|
|
43
43
|
},
|
|
@@ -16,20 +16,20 @@
|
|
|
16
16
|
<% end %>
|
|
17
17
|
</li>
|
|
18
18
|
<li>
|
|
19
|
-
<%= link_to abs_url("/docs/
|
|
20
|
-
<%= render(AblyUi::Core::Icon.new(name: "icon-display-
|
|
19
|
+
<%= link_to abs_url("/docs/quick-start-guide"), class: "ui-meganav-media-with-image group" do %>
|
|
20
|
+
<%= render(AblyUi::Core::Icon.new(name: "icon-display-quickstart-guides-col", size: "2.5rem")) %>
|
|
21
21
|
<div class="flex flex-col justify-center">
|
|
22
|
-
<p class="ui-meganav-media-heading">
|
|
23
|
-
<p class="ui-meganav-media-copy">
|
|
22
|
+
<p class="ui-meganav-media-heading">Quickstart guides</p>
|
|
23
|
+
<p class="ui-meganav-media-copy">Documentation to help you get started quickly.</p>
|
|
24
24
|
</div>
|
|
25
25
|
<% end %>
|
|
26
26
|
</li>
|
|
27
27
|
<li>
|
|
28
|
-
<%= link_to abs_url("/
|
|
29
|
-
<%= render(AblyUi::Core::Icon.new(name: "icon-display-
|
|
28
|
+
<%= link_to abs_url("/integrations"), class: "ui-meganav-media-with-image group" do %>
|
|
29
|
+
<%= render(AblyUi::Core::Icon.new(name: "icon-display-integrations-col", size: "2.5rem")) %>
|
|
30
30
|
<div class="flex flex-col justify-center">
|
|
31
|
-
<p class="ui-meganav-media-heading">
|
|
32
|
-
<p class="ui-meganav-media-copy">
|
|
31
|
+
<p class="ui-meganav-media-heading">Integrations</p>
|
|
32
|
+
<p class="ui-meganav-media-copy">Find out more about Ably integrations. </p>
|
|
33
33
|
</div>
|
|
34
34
|
<% end %>
|
|
35
35
|
</li>
|
|
@@ -57,11 +57,11 @@
|
|
|
57
57
|
<% end %>
|
|
58
58
|
</li>
|
|
59
59
|
<li>
|
|
60
|
-
<%= link_to abs_url("/
|
|
61
|
-
<%= render(AblyUi::Core::Icon.new(name: "icon-display-
|
|
60
|
+
<%= link_to abs_url("/reference-guide-chat"), class: "ui-meganav-media-with-image group" do %>
|
|
61
|
+
<%= render(AblyUi::Core::Icon.new(name: "icon-display-chat-col", size: "2.5rem")) %>
|
|
62
62
|
<div class="flex flex-col justify-center">
|
|
63
|
-
<p class="ui-meganav-media-heading">
|
|
64
|
-
<p class="ui-meganav-media-copy">
|
|
63
|
+
<p class="ui-meganav-media-heading">Chat apps reference guide</p>
|
|
64
|
+
<p class="ui-meganav-media-copy">Learn how to build chat apps with Ably.</p>
|
|
65
65
|
</div>
|
|
66
66
|
<% end %>
|
|
67
67
|
</li>
|
|
@@ -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:()=>M});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);let
|
|
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:()=>M});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);let p=(e=21)=>{let t="",r=e;for(;r--;)t+="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict"[64*Math.random()|0];return t};u(5044);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="ui-flashes",P={items:[]},A=(w({},"flashes",(function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:P,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}),k={error:"bg-gui-error",success:"bg-zingy-green",notice:"bg-electric-cyan",info:"bg-electric-cyan",alert:"bg-active-orange"},q={error:"text-white",success:"text-cool-black",notice:"text-cool-black",info:"text-cool-black",alert:"text-white"},T=["success","info","notice"],C=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 T.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(k[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(q[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"}))))};C.propTypes=g({},A);var L=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":E},n.filter((function(e){return!e.removed})).map((function(e){return i().createElement(C,v({removeFlash:a,key:e.id},e))})))};L.propTypes={flashes:f().shape({items:f().arrayOf(f().shape(A))})};function z(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 D(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 I=function(e){var t=function(e){return(arguments.length>1&&void 0!==arguments[1]?arguments[1]:document).querySelector("[data-id=".concat(e,"]"))}(E);t&&(t.style.marginTop=e?"4rem":null)},N=function(e){window.matchMedia("(min-width: 65rem)").matches?e.style.display=null:e.style.display="none"},U=function(e){e.style.maxHeight=0,e.style.overflow="hidden",I(!1)},_=function(e){e.style.maxHeight=null,e.style.overflow=null,I(!0)};const M=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(){};N(r),_(r);var a=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?z(Object(r),!0).forEach((function(t){D(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):z(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&&U(e);var t=n()((function(){window.scrollY>5?U(e):e.style.overflow&&_(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),U(e),o()};return i.addEventListener("click",c),function(){return document.removeEventListener("click",c)}}(r,o,i,u),s=function(e){var t=n()((function(){N(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})()}));
|