@ably/ui 17.7.0-dev.25750e15 → 17.7.0-dev.cc33cce1

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.
Files changed (25) hide show
  1. package/core/Icon/components/icon-display-something-else-mono.js +2 -0
  2. package/core/Icon/components/icon-display-something-else-mono.js.map +1 -0
  3. package/core/Icon/components/icon-display-something-else.js +2 -0
  4. package/core/Icon/components/icon-display-something-else.js.map +1 -0
  5. package/core/Icon/components/index.js +1 -1
  6. package/core/Icon/components/index.js.map +1 -1
  7. package/core/Icon/computed-icons/display-icons.js +1 -1
  8. package/core/Icon/computed-icons/display-icons.js.map +1 -1
  9. package/core/Pricing/PricingCards.js +1 -1
  10. package/core/Pricing/PricingCards.js.map +1 -1
  11. package/core/Pricing/data.js +1 -1
  12. package/core/Pricing/data.js.map +1 -1
  13. package/core/Pricing/types.js.map +1 -1
  14. package/core/ProductTile/ProductDescription.js +1 -1
  15. package/core/ProductTile/ProductDescription.js.map +1 -1
  16. package/core/icons/display/icon-display-something-else-mono.svg +4 -0
  17. package/core/icons/display/icon-display-something-else.svg +4 -0
  18. package/core/sprites-display.svg +1 -1
  19. package/core/styles/properties.css +0 -13
  20. package/core/styles/text.css +30 -23
  21. package/index.d.ts +28 -31
  22. package/package.json +12 -13
  23. package/tailwind.config.js +0 -4
  24. package/core/ContentTile.js +0 -2
  25. package/core/ContentTile.js.map +0 -1
package/core/styles/properties.css CHANGED
@@ -166,12 +166,6 @@
166
166
  var(--color-jazzy-pink) 100%
167
167
  );
168
168
 
169
- /* Used for theming */
170
- --color-ably-heading: var(--color-neutral-1300);
171
- --color-ably-primary: var(--color-neutral-1000);
172
- --color-ably-secondary: var(--color-neutral-800);
173
- --color-ably-label: var(--color-neutral-700);
174
-
175
169
  --fs-title-xl: 3rem;
176
170
  --fs-title: 2.75rem;
177
171
  --fs-title-xs: 2.5rem;
@@ -273,11 +267,4 @@
273
267
  /* Expose component values for cross-component usage */
274
268
  --ui-meganav-height: 4rem;
275
269
  }
276
-
277
- .ui-theme-dark {
278
- --color-ably-heading: var(--color-neutral-000);
279
- --color-ably-primary: var(--color-neutral-300);
280
- --color-ably-secondary: var(--color-neutral-500);
281
- --color-ably-label: var(--color-neutral-600);
282
- }
283
270
  }
package/core/styles/text.css CHANGED
@@ -1,54 +1,54 @@
1
1
  @layer components {
2
2
  .ui-text-title {
3
- @apply font-sans font-bold text-ably-heading;
3
+ @apply font-sans font-bold text-cool-black;
4
4
  @apply text-title-xs xs:text-title xl:text-title-xl;
5
5
  @apply tracking-[-0.015em] xs:tracking-[-0.02em] xl:tracking-[-0.02em];
6
6
  }
7
7
 
8
8
  .ui-text-h1 {
9
- @apply font-sans font-bold text-ably-heading;
9
+ @apply font-sans font-bold text-cool-black;
10
10
  @apply text-h1-xs xs:text-h1 xl:text-h1-xl;
11
11
  @apply tracking-[-0.0125em] xs:tracking-[-0.015em];
12
12
  }
13
13
 
14
14
  .ui-text-h2 {
15
- @apply font-sans font-bold text-ably-heading;
15
+ @apply font-sans font-bold text-cool-black;
16
16
  @apply text-h2-xs xs:text-h2 xl:text-h2-xl;
17
17
  @apply tracking-[-0.015em] xs:tracking-[-0.01em];
18
18
  }
19
19
 
20
20
  .ui-text-h3 {
21
- @apply font-sans font-bold text-ably-heading;
21
+ @apply font-sans font-bold text-cool-black;
22
22
  @apply text-h3;
23
23
  @apply tracking-[-0.005em];
24
24
  }
25
25
 
26
26
  .ui-text-h4 {
27
- @apply font-sans font-bold text-ably-heading;
27
+ @apply font-sans font-bold text-cool-black;
28
28
  @apply text-h4;
29
29
  @apply tracking-[-0.0015em];
30
30
  }
31
31
 
32
32
  .ui-text-h5 {
33
- @apply font-sans font-bold text-ably-heading;
33
+ @apply font-sans font-bold text-cool-black;
34
34
  @apply text-h5;
35
35
  @apply tracking-[-0.0025em];
36
36
  }
37
37
 
38
38
  .ui-text-p1 {
39
- @apply font-sans font-medium text-ably-primary text-p1;
39
+ @apply font-sans font-medium text-charcoal-grey text-p1;
40
40
  }
41
41
 
42
42
  .ui-text-p2 {
43
- @apply font-sans font-medium text-ably-primary text-p2;
43
+ @apply font-sans font-medium text-charcoal-grey text-p2;
44
44
  }
45
45
 
46
46
  .ui-text-p3 {
47
- @apply font-sans font-medium text-ably-primary text-p3;
47
+ @apply font-sans font-medium text-charcoal-grey text-p3;
48
48
  }
49
49
 
50
50
  .ui-text-p4 {
51
- @apply font-sans font-medium text-ably-primary text-p4;
51
+ @apply font-sans font-medium text-charcoal-grey text-p4;
52
52
  }
53
53
 
54
54
  .ui-text-standfirst {
@@ -58,13 +58,13 @@
58
58
  }
59
59
 
60
60
  .ui-text-quote {
61
- @apply font-sans font-normal text-ably-heading;
61
+ @apply font-sans font-normal text-cool-black;
62
62
  @apply text-quote leading-normal;
63
63
  @apply tracking-[-0.0015em];
64
64
  }
65
65
 
66
66
  .ui-text-sub-header {
67
- @apply font-sans font-semibold text-ably-secondary;
67
+ @apply font-sans font-semibold text-neutral-800;
68
68
  @apply text-sub-header-xs xs:text-sub-header leading-normal;
69
69
  }
70
70
 
@@ -81,19 +81,26 @@
81
81
  }
82
82
 
83
83
  .ui-text-label1 {
84
- @apply font-sans text-ably-label text-label1 font-semibold;
84
+ @apply font-sans text-neutral-900 text-label1 font-semibold;
85
85
  }
86
86
 
87
87
  .ui-text-label2 {
88
- @apply font-sans text-ably-label text-label2 font-semibold;
88
+ @apply font-sans text-neutral-900 text-label2 font-semibold;
89
89
  }
90
90
 
91
91
  .ui-text-label3 {
92
- @apply font-sans text-ably-label text-label3 font-semibold;
92
+ @apply font-sans text-neutral-900 text-label3 font-semibold;
93
93
  }
94
94
 
95
95
  .ui-text-label4 {
96
- @apply font-sans text-ably-label text-label4 font-semibold;
96
+ @apply font-sans text-neutral-900 text-label4 font-semibold;
97
+ }
98
+
99
+ .ui-theme-dark .ui-text-label1,
100
+ .ui-theme-dark .ui-text-label2,
101
+ .ui-theme-dark .ui-text-label3,
102
+ .ui-theme-dark .ui-text-label4 {
103
+ @apply text-neutral-300;
97
104
  }
98
105
 
99
106
  .ui-text-code {
@@ -105,21 +112,21 @@
105
112
  }
106
113
 
107
114
  .ui-text-code-inline {
108
- @apply inline-flex font-mono px-[0.1875rem] py-1 text-code text-ably-primary font-medium bg-neutral-200 border border-neutral-400 rounded-md;
115
+ @apply inline-flex font-mono px-[0.1875rem] py-1 text-code text-neutral-1000 font-medium bg-neutral-200 border border-neutral-400 rounded-md;
109
116
  }
110
117
 
111
- .ui-theme-dark .ui-text-code-inline {
112
- @apply text-ably-primary bg-neutral-1000 border-neutral-900;
118
+ .dark .ui-text-code-inline {
119
+ @apply text-neutral-300 bg-neutral-1000 border-neutral-900;
113
120
  }
114
121
 
115
122
  .ui-unordered-list {
116
- @apply text-p1 font-medium text-ably-secondary;
123
+ @apply text-p1 font-medium text-charcoal-grey;
117
124
  @apply ml-8 my-4;
118
125
  @apply list-disc;
119
126
  }
120
127
 
121
128
  .ui-ordered-list {
122
- @apply text-p1 font-medium text-ably-secondary;
129
+ @apply text-p1 font-medium text-charcoal-grey;
123
130
  @apply ml-8 my-4;
124
131
  @apply list-decimal;
125
132
  }
@@ -158,12 +165,12 @@
158
165
  }
159
166
 
160
167
  .ui-link-neutral {
161
- @apply hover:text-ably-secondary active:text-ably-heading disabled:text-gui-unavailable;
168
+ @apply hover:text-dark-grey active:text-cool-black disabled:text-gui-unavailable;
162
169
  @apply focus:text-charcoal-grey focus-base;
163
170
  @apply underline;
164
171
  }
165
172
 
166
173
  .ui-figcaption {
167
- @apply font-mono text-p3 text-ably-secondary;
174
+ @apply font-mono text-p3 text-neutral-800;
168
175
  }
169
176
  }
package/index.d.ts CHANGED
@@ -479,34 +479,6 @@ export default ConnectStateWrapper;
479
479
  //# sourceMappingURL=ConnectStateWrapper.d.ts.map
480
480
  }
481
481
 
482
- declare module '@ably/ui/core/ContentTile' {
483
- import React from "react";
484
- import type { IconName } from "@ably/ui/core/Icon/types";
485
- type ContentTileBadge = string | {
486
- label: string;
487
- className?: string;
488
- };
489
- type CTA = {
490
- text: string;
491
- url: string;
492
- };
493
- type ContentTileProps = {
494
- title?: string;
495
- className?: string;
496
- description?: string;
497
- cta?: CTA;
498
- image?: React.ReactNode;
499
- imageIcons?: IconName[];
500
- badges?: ContentTileBadge[];
501
- options?: {
502
- centerImage?: boolean;
503
- };
504
- };
505
- const ContentTile: React.FC<ContentTileProps>;
506
- export default ContentTile;
507
- //# sourceMappingURL=ContentTile.d.ts.map
508
- }
509
-
510
482
  declare module '@ably/ui/core/CookieMessage' {
511
483
  type CookieMessageProps = {
512
484
  cookieId: string;
@@ -1800,6 +1772,28 @@ export default ForwardRef;
1800
1772
  //# sourceMappingURL=icon-display-soc2-type2.d.ts.map
1801
1773
  }
1802
1774
 
1775
+ declare module '@ably/ui/core/Icon/components/icon-display-something-else-mono' {
1776
+ import * as React from "react";
1777
+ interface SVGRProps {
1778
+ title?: string;
1779
+ titleId?: string;
1780
+ }
1781
+ const ForwardRef: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement> & SVGRProps, "ref"> & React.RefAttributes<SVGSVGElement>>;
1782
+ export default ForwardRef;
1783
+ //# sourceMappingURL=icon-display-something-else-mono.d.ts.map
1784
+ }
1785
+
1786
+ declare module '@ably/ui/core/Icon/components/icon-display-something-else' {
1787
+ import * as React from "react";
1788
+ interface SVGRProps {
1789
+ title?: string;
1790
+ titleId?: string;
1791
+ }
1792
+ const ForwardRef: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement> & SVGRProps, "ref"> & React.RefAttributes<SVGSVGElement>>;
1793
+ export default ForwardRef;
1794
+ //# sourceMappingURL=icon-display-something-else.d.ts.map
1795
+ }
1796
+
1803
1797
  declare module '@ably/ui/core/Icon/components/icon-display-subscription-filters' {
1804
1798
  import * as React from "react";
1805
1799
  interface SVGRProps {
@@ -4856,6 +4850,8 @@ import IconDisplayShoppingCart from "@ably/ui/core/icon-display-shopping-cart";
4856
4850
  import IconDisplaySla from "@ably/ui/core/icon-display-sla";
4857
4851
  import IconDisplaySoc2Type2Mono from "@ably/ui/core/icon-display-soc2-type2-mono";
4858
4852
  import IconDisplaySoc2Type2 from "@ably/ui/core/icon-display-soc2-type2";
4853
+ import IconDisplaySomethingElseMono from "@ably/ui/core/icon-display-something-else-mono";
4854
+ import IconDisplaySomethingElse from "@ably/ui/core/icon-display-something-else";
4859
4855
  import IconDisplaySubscriptionFilters from "@ably/ui/core/icon-display-subscription-filters";
4860
4856
  import IconDisplaySupportChatMono from "@ably/ui/core/icon-display-support-chat-mono";
4861
4857
  import IconDisplaySystemMetadata from "@ably/ui/core/icon-display-system-metadata";
@@ -4863,7 +4859,7 @@ import IconDisplayTechAccountComms from "@ably/ui/core/icon-display-tech-account
4863
4859
  import IconDisplayTutorialsDemosCol from "@ably/ui/core/icon-display-tutorials-demos-col";
4864
4860
  import IconDisplayVirtualEventsCol from "@ably/ui/core/icon-display-virtual-events-col";
4865
4861
  import IconDisplayVirtualEvents from "@ably/ui/core/icon-display-virtual-events";
4866
- export { IconDisplay48hrs, IconDisplayAblyChannels, IconDisplayAboutAblyCol, IconDisplayApiKeys, IconDisplayApi, IconDisplayArchitecturalGuidance, IconDisplayAssetTrackingCol, IconDisplayAuthentication, IconDisplayAvatarStack, IconDisplayBrowser, IconDisplayCalendar, IconDisplayCallMobile, IconDisplayCareersCol, IconDisplayCaseStudiesCol, IconDisplayChatCol, IconDisplayChatMono, IconDisplayChatStackCol, IconDisplayChatStack, IconDisplayCloudServers, IconDisplayCompareTechCol, IconDisplayConnectionStateRecovery, IconDisplayConsumerGroups, IconDisplayCustomCname, IconDisplayCustom, IconDisplayCustomersCol, IconDisplayDataBroadcastCol, IconDisplayDataBroadcastMono, IconDisplayDataSynchronizationCol, IconDisplayDedicatedCluster, IconDisplayDeltas, IconDisplayDocsCol, IconDisplayDocumentation, IconDisplayDynamicChannelGroups, IconDisplayEdgeNetwork, IconDisplayElasticity, IconDisplayEqualisersMono, IconDisplayEventsCol, IconDisplayExactlyOnceDelivery, IconDisplayExamplesCol, IconDisplayFanOut, IconDisplayFirehose, IconDisplayGdpr, IconDisplayGeneralComms, IconDisplayGranularPermissions, IconDisplayHipaaMono, IconDisplayHipaa, IconDisplayHistory, IconDisplayIntegrationsCol, IconDisplayIntegrations, IconDisplayItSupportAccess, IconDisplayItSupportHelpdesk, IconDisplayKafkaAtTheEdgeCol, IconDisplayLaptop, IconDisplayLastSeen, IconDisplayLightbulbCol, IconDisplayLiveChat, IconDisplayLiveUpdatesResultsMetricsCol, IconDisplayMapPin, IconDisplayMessageBatching, IconDisplayMessagePersistence, IconDisplayMessageQueues, IconDisplayMessage, IconDisplayMultiUserSpacesCol, IconDisplayObserveAnalytics, IconDisplayPadlockClosed, IconDisplayPlatform, IconDisplayPlay, IconDisplayPremiumSupport, IconDisplayPrivacyShieldFramework, IconDisplayPrivateLink, IconDisplayPushNotificationsCol, IconDisplayPushNotificationsMono, IconDisplayPushNotifications, IconDisplayQuickstartGuidesCol, IconDisplayReactions, IconDisplayReadReceipts, IconDisplayResourcesCol, IconDisplayRewind, IconDisplaySdksCol, IconDisplaySendReceivedMessages, IconDisplayServers, IconDisplayShoppingCart, IconDisplaySla, IconDisplaySoc2Type2Mono, IconDisplaySoc2Type2, IconDisplaySubscriptionFilters, IconDisplaySupportChatMono, IconDisplaySystemMetadata, IconDisplayTechAccountComms, IconDisplayTutorialsDemosCol, IconDisplayVirtualEventsCol, IconDisplayVirtualEvents, };
4862
+ export { IconDisplay48hrs, IconDisplayAblyChannels, IconDisplayAboutAblyCol, IconDisplayApiKeys, IconDisplayApi, IconDisplayArchitecturalGuidance, IconDisplayAssetTrackingCol, IconDisplayAuthentication, IconDisplayAvatarStack, IconDisplayBrowser, IconDisplayCalendar, IconDisplayCallMobile, IconDisplayCareersCol, IconDisplayCaseStudiesCol, IconDisplayChatCol, IconDisplayChatMono, IconDisplayChatStackCol, IconDisplayChatStack, IconDisplayCloudServers, IconDisplayCompareTechCol, IconDisplayConnectionStateRecovery, IconDisplayConsumerGroups, IconDisplayCustomCname, IconDisplayCustom, IconDisplayCustomersCol, IconDisplayDataBroadcastCol, IconDisplayDataBroadcastMono, IconDisplayDataSynchronizationCol, IconDisplayDedicatedCluster, IconDisplayDeltas, IconDisplayDocsCol, IconDisplayDocumentation, IconDisplayDynamicChannelGroups, IconDisplayEdgeNetwork, IconDisplayElasticity, IconDisplayEqualisersMono, IconDisplayEventsCol, IconDisplayExactlyOnceDelivery, IconDisplayExamplesCol, IconDisplayFanOut, IconDisplayFirehose, IconDisplayGdpr, IconDisplayGeneralComms, IconDisplayGranularPermissions, IconDisplayHipaaMono, IconDisplayHipaa, IconDisplayHistory, IconDisplayIntegrationsCol, IconDisplayIntegrations, IconDisplayItSupportAccess, IconDisplayItSupportHelpdesk, IconDisplayKafkaAtTheEdgeCol, IconDisplayLaptop, IconDisplayLastSeen, IconDisplayLightbulbCol, IconDisplayLiveChat, IconDisplayLiveUpdatesResultsMetricsCol, IconDisplayMapPin, IconDisplayMessageBatching, IconDisplayMessagePersistence, IconDisplayMessageQueues, IconDisplayMessage, IconDisplayMultiUserSpacesCol, IconDisplayObserveAnalytics, IconDisplayPadlockClosed, IconDisplayPlatform, IconDisplayPlay, IconDisplayPremiumSupport, IconDisplayPrivacyShieldFramework, IconDisplayPrivateLink, IconDisplayPushNotificationsCol, IconDisplayPushNotificationsMono, IconDisplayPushNotifications, IconDisplayQuickstartGuidesCol, IconDisplayReactions, IconDisplayReadReceipts, IconDisplayResourcesCol, IconDisplayRewind, IconDisplaySdksCol, IconDisplaySendReceivedMessages, IconDisplayServers, IconDisplayShoppingCart, IconDisplaySla, IconDisplaySoc2Type2Mono, IconDisplaySoc2Type2, IconDisplaySomethingElseMono, IconDisplaySomethingElse, IconDisplaySubscriptionFilters, IconDisplaySupportChatMono, IconDisplaySystemMetadata, IconDisplayTechAccountComms, IconDisplayTutorialsDemosCol, IconDisplayVirtualEventsCol, IconDisplayVirtualEvents, };
4867
4863
  import IconGuiAblyBadge from "@ably/ui/core/icon-gui-ably-badge";
4868
4864
  import IconGuiCheckCircledFill from "@ably/ui/core/icon-gui-check-circled-fill";
4869
4865
  import IconGuiCheckLotusCircled from "@ably/ui/core/icon-gui-check-lotus-circled";
@@ -5135,7 +5131,7 @@ export { IconTechAblyApiStreamer, IconTechAblyFirehose, IconTechAblyNative, Icon
5135
5131
  }
5136
5132
 
5137
5133
  declare module '@ably/ui/core/Icon/computed-icons/display-icons' {
5138
- export const displayIcons: readonly ["icon-display-48hrs", "icon-display-ably-channels", "icon-display-about-ably-col", "icon-display-api", "icon-display-api-keys", "icon-display-architectural-guidance", "icon-display-asset-tracking-col", "icon-display-authentication", "icon-display-avatar-stack", "icon-display-browser", "icon-display-calendar", "icon-display-call-mobile", "icon-display-careers-col", "icon-display-case-studies-col", "icon-display-chat-col", "icon-display-chat-mono", "icon-display-chat-stack", "icon-display-chat-stack-col", "icon-display-cloud-servers", "icon-display-compare-tech-col", "icon-display-connection-state-recovery", "icon-display-consumer-groups", "icon-display-custom", "icon-display-custom-cname", "icon-display-customers-col", "icon-display-data-broadcast-col", "icon-display-data-broadcast-mono", "icon-display-data-synchronization-col", "icon-display-dedicated-cluster", "icon-display-deltas", "icon-display-docs-col", "icon-display-documentation", "icon-display-dynamic-channel-groups", "icon-display-edge-network", "icon-display-elasticity", "icon-display-equalisers-mono", "icon-display-events-col", "icon-display-exactly-once-delivery", "icon-display-examples-col", "icon-display-fan-out", "icon-display-firehose", "icon-display-gdpr", "icon-display-general-comms", "icon-display-granular-permissions", "icon-display-hipaa", "icon-display-hipaa-mono", "icon-display-history", "icon-display-integrations", "icon-display-integrations-col", "icon-display-it-support-access", "icon-display-it-support-helpdesk", "icon-display-kafka-at-the-edge-col", "icon-display-laptop", "icon-display-last-seen", "icon-display-lightbulb-col", "icon-display-live-chat", "icon-display-live-updates-results-metrics-col", "icon-display-map-pin", "icon-display-message", "icon-display-message-batching", "icon-display-message-persistence", "icon-display-message-queues", "icon-display-multi-user-spaces-col", "icon-display-observe-analytics", "icon-display-padlock-closed", "icon-display-platform", "icon-display-play", "icon-display-premium-support", "icon-display-privacy-shield-framework", "icon-display-private-link", "icon-display-push-notifications", "icon-display-push-notifications-col", "icon-display-push-notifications-mono", "icon-display-quickstart-guides-col", "icon-display-reactions", "icon-display-read-receipts", "icon-display-resources-col", "icon-display-rewind", "icon-display-sdks-col", "icon-display-send-received-messages", "icon-display-servers", "icon-display-shopping-cart", "icon-display-sla", "icon-display-soc2-type2", "icon-display-soc2-type2-mono", "icon-display-subscription-filters", "icon-display-support-chat-mono", "icon-display-system-metadata", "icon-display-tech-account-comms", "icon-display-tutorials-demos-col", "icon-display-virtual-events", "icon-display-virtual-events-col"];
5134
+ export const displayIcons: readonly ["icon-display-48hrs", "icon-display-ably-channels", "icon-display-about-ably-col", "icon-display-api", "icon-display-api-keys", "icon-display-architectural-guidance", "icon-display-asset-tracking-col", "icon-display-authentication", "icon-display-avatar-stack", "icon-display-browser", "icon-display-calendar", "icon-display-call-mobile", "icon-display-careers-col", "icon-display-case-studies-col", "icon-display-chat-col", "icon-display-chat-mono", "icon-display-chat-stack", "icon-display-chat-stack-col", "icon-display-cloud-servers", "icon-display-compare-tech-col", "icon-display-connection-state-recovery", "icon-display-consumer-groups", "icon-display-custom", "icon-display-custom-cname", "icon-display-customers-col", "icon-display-data-broadcast-col", "icon-display-data-broadcast-mono", "icon-display-data-synchronization-col", "icon-display-dedicated-cluster", "icon-display-deltas", "icon-display-docs-col", "icon-display-documentation", "icon-display-dynamic-channel-groups", "icon-display-edge-network", "icon-display-elasticity", "icon-display-equalisers-mono", "icon-display-events-col", "icon-display-exactly-once-delivery", "icon-display-examples-col", "icon-display-fan-out", "icon-display-firehose", "icon-display-gdpr", "icon-display-general-comms", "icon-display-granular-permissions", "icon-display-hipaa", "icon-display-hipaa-mono", "icon-display-history", "icon-display-integrations", "icon-display-integrations-col", "icon-display-it-support-access", "icon-display-it-support-helpdesk", "icon-display-kafka-at-the-edge-col", "icon-display-laptop", "icon-display-last-seen", "icon-display-lightbulb-col", "icon-display-live-chat", "icon-display-live-updates-results-metrics-col", "icon-display-map-pin", "icon-display-message", "icon-display-message-batching", "icon-display-message-persistence", "icon-display-message-queues", "icon-display-multi-user-spaces-col", "icon-display-observe-analytics", "icon-display-padlock-closed", "icon-display-platform", "icon-display-play", "icon-display-premium-support", "icon-display-privacy-shield-framework", "icon-display-private-link", "icon-display-push-notifications", "icon-display-push-notifications-col", "icon-display-push-notifications-mono", "icon-display-quickstart-guides-col", "icon-display-reactions", "icon-display-read-receipts", "icon-display-resources-col", "icon-display-rewind", "icon-display-sdks-col", "icon-display-send-received-messages", "icon-display-servers", "icon-display-shopping-cart", "icon-display-sla", "icon-display-soc2-type2", "icon-display-soc2-type2-mono", "icon-display-something-else", "icon-display-something-else-mono", "icon-display-subscription-filters", "icon-display-support-chat-mono", "icon-display-system-metadata", "icon-display-tech-account-comms", "icon-display-tutorials-demos-col", "icon-display-virtual-events", "icon-display-virtual-events-col"];
5139
5135
  //# sourceMappingURL=display-icons.d.ts.map
5140
5136
  }
5141
5137
 
@@ -5162,7 +5158,7 @@ export const techIcons: readonly ["icon-tech-ably", "icon-tech-ably-api-streamer
5162
5158
  declare module '@ably/ui/core/Icon/types' {
5163
5159
  export const iconNames: {
5164
5160
  gui: readonly ["icon-gui-ably-badge", "icon-gui-check-circled-fill", "icon-gui-check-lotus-circled", "icon-gui-checklist-checked", "icon-gui-code-doc", "icon-gui-cursor", "icon-gui-expand", "icon-gui-filter-flow-step-0", "icon-gui-filter-flow-step-1", "icon-gui-filter-flow-step-2", "icon-gui-filter-flow-step-3", "icon-gui-flower-growth", "icon-gui-further-reading", "icon-gui-glasses", "icon-gui-history", "icon-gui-live-chat", "icon-gui-mouse", "icon-gui-partial", "icon-gui-pitfall", "icon-gui-prod-asset-tracking-outline", "icon-gui-prod-asset-tracking-solid", "icon-gui-prod-chat-outline", "icon-gui-prod-chat-solid", "icon-gui-prod-liveobjects-outline", "icon-gui-prod-liveobjects-solid", "icon-gui-prod-livesync-outline", "icon-gui-prod-livesync-solid", "icon-gui-prod-pubsub-outline", "icon-gui-prod-pubsub-solid", "icon-gui-prod-spaces-outline", "icon-gui-prod-spaces-solid", "icon-gui-quote-marks-fill", "icon-gui-refresh", "icon-gui-resources", "icon-gui-spinner-dark", "icon-gui-spinner-light"];
5165
- display: readonly ["icon-display-48hrs", "icon-display-ably-channels", "icon-display-about-ably-col", "icon-display-api", "icon-display-api-keys", "icon-display-architectural-guidance", "icon-display-asset-tracking-col", "icon-display-authentication", "icon-display-avatar-stack", "icon-display-browser", "icon-display-calendar", "icon-display-call-mobile", "icon-display-careers-col", "icon-display-case-studies-col", "icon-display-chat-col", "icon-display-chat-mono", "icon-display-chat-stack", "icon-display-chat-stack-col", "icon-display-cloud-servers", "icon-display-compare-tech-col", "icon-display-connection-state-recovery", "icon-display-consumer-groups", "icon-display-custom", "icon-display-custom-cname", "icon-display-customers-col", "icon-display-data-broadcast-col", "icon-display-data-broadcast-mono", "icon-display-data-synchronization-col", "icon-display-dedicated-cluster", "icon-display-deltas", "icon-display-docs-col", "icon-display-documentation", "icon-display-dynamic-channel-groups", "icon-display-edge-network", "icon-display-elasticity", "icon-display-equalisers-mono", "icon-display-events-col", "icon-display-exactly-once-delivery", "icon-display-examples-col", "icon-display-fan-out", "icon-display-firehose", "icon-display-gdpr", "icon-display-general-comms", "icon-display-granular-permissions", "icon-display-hipaa", "icon-display-hipaa-mono", "icon-display-history", "icon-display-integrations", "icon-display-integrations-col", "icon-display-it-support-access", "icon-display-it-support-helpdesk", "icon-display-kafka-at-the-edge-col", "icon-display-laptop", "icon-display-last-seen", "icon-display-lightbulb-col", "icon-display-live-chat", "icon-display-live-updates-results-metrics-col", "icon-display-map-pin", "icon-display-message", "icon-display-message-batching", "icon-display-message-persistence", "icon-display-message-queues", "icon-display-multi-user-spaces-col", "icon-display-observe-analytics", "icon-display-padlock-closed", "icon-display-platform", "icon-display-play", "icon-display-premium-support", "icon-display-privacy-shield-framework", "icon-display-private-link", "icon-display-push-notifications", "icon-display-push-notifications-col", "icon-display-push-notifications-mono", "icon-display-quickstart-guides-col", "icon-display-reactions", "icon-display-read-receipts", "icon-display-resources-col", "icon-display-rewind", "icon-display-sdks-col", "icon-display-send-received-messages", "icon-display-servers", "icon-display-shopping-cart", "icon-display-sla", "icon-display-soc2-type2", "icon-display-soc2-type2-mono", "icon-display-subscription-filters", "icon-display-support-chat-mono", "icon-display-system-metadata", "icon-display-tech-account-comms", "icon-display-tutorials-demos-col", "icon-display-virtual-events", "icon-display-virtual-events-col"];
5161
+ display: readonly ["icon-display-48hrs", "icon-display-ably-channels", "icon-display-about-ably-col", "icon-display-api", "icon-display-api-keys", "icon-display-architectural-guidance", "icon-display-asset-tracking-col", "icon-display-authentication", "icon-display-avatar-stack", "icon-display-browser", "icon-display-calendar", "icon-display-call-mobile", "icon-display-careers-col", "icon-display-case-studies-col", "icon-display-chat-col", "icon-display-chat-mono", "icon-display-chat-stack", "icon-display-chat-stack-col", "icon-display-cloud-servers", "icon-display-compare-tech-col", "icon-display-connection-state-recovery", "icon-display-consumer-groups", "icon-display-custom", "icon-display-custom-cname", "icon-display-customers-col", "icon-display-data-broadcast-col", "icon-display-data-broadcast-mono", "icon-display-data-synchronization-col", "icon-display-dedicated-cluster", "icon-display-deltas", "icon-display-docs-col", "icon-display-documentation", "icon-display-dynamic-channel-groups", "icon-display-edge-network", "icon-display-elasticity", "icon-display-equalisers-mono", "icon-display-events-col", "icon-display-exactly-once-delivery", "icon-display-examples-col", "icon-display-fan-out", "icon-display-firehose", "icon-display-gdpr", "icon-display-general-comms", "icon-display-granular-permissions", "icon-display-hipaa", "icon-display-hipaa-mono", "icon-display-history", "icon-display-integrations", "icon-display-integrations-col", "icon-display-it-support-access", "icon-display-it-support-helpdesk", "icon-display-kafka-at-the-edge-col", "icon-display-laptop", "icon-display-last-seen", "icon-display-lightbulb-col", "icon-display-live-chat", "icon-display-live-updates-results-metrics-col", "icon-display-map-pin", "icon-display-message", "icon-display-message-batching", "icon-display-message-persistence", "icon-display-message-queues", "icon-display-multi-user-spaces-col", "icon-display-observe-analytics", "icon-display-padlock-closed", "icon-display-platform", "icon-display-play", "icon-display-premium-support", "icon-display-privacy-shield-framework", "icon-display-private-link", "icon-display-push-notifications", "icon-display-push-notifications-col", "icon-display-push-notifications-mono", "icon-display-quickstart-guides-col", "icon-display-reactions", "icon-display-read-receipts", "icon-display-resources-col", "icon-display-rewind", "icon-display-sdks-col", "icon-display-send-received-messages", "icon-display-servers", "icon-display-shopping-cart", "icon-display-sla", "icon-display-soc2-type2", "icon-display-soc2-type2-mono", "icon-display-something-else", "icon-display-something-else-mono", "icon-display-subscription-filters", "icon-display-support-chat-mono", "icon-display-system-metadata", "icon-display-tech-account-comms", "icon-display-tutorials-demos-col", "icon-display-virtual-events", "icon-display-virtual-events-col"];
5166
5162
  social: readonly ["icon-social-discord", "icon-social-discord-mono", "icon-social-facebook", "icon-social-facebook-mono", "icon-social-github", "icon-social-github-mono", "icon-social-glassdoor", "icon-social-glassdoor-mono", "icon-social-google", "icon-social-google-mono", "icon-social-linkedin", "icon-social-linkedin-mono", "icon-social-slack", "icon-social-slack-mono", "icon-social-stackoverflow", "icon-social-stackoverflow-mono", "icon-social-twitter", "icon-social-twitter-mono", "icon-social-x", "icon-social-x-mono", "icon-social-youtube", "icon-social-youtube-mono"];
5167
5163
  tech: readonly ["icon-tech-ably", "icon-tech-ably-api-streamer", "icon-tech-ably-firehose", "icon-tech-ably-native", "icon-tech-activemq", "icon-tech-activitypub", "icon-tech-aerospike", "icon-tech-akka", "icon-tech-amazon-ec2", "icon-tech-amazon-event-bridge", "icon-tech-amqp091", "icon-tech-amqp10", "icon-tech-android-full", "icon-tech-android-head", "icon-tech-angular", "icon-tech-anycable", "icon-tech-apache-cassandra", "icon-tech-apache-cordova", "icon-tech-apache-kafka", "icon-tech-apache-spark", "icon-tech-apachepulsar", "icon-tech-apachestorm", "icon-tech-apns", "icon-tech-assemblyai", "icon-tech-atmosphere", "icon-tech-aws", "icon-tech-aws-app-sync", "icon-tech-aws-aurora", "icon-tech-aws-gateway-websockets", "icon-tech-aws-sns", "icon-tech-aws-sqs", "icon-tech-awsiot", "icon-tech-awskinesis", "icon-tech-awslambda", "icon-tech-awssqs", "icon-tech-azure-api", "icon-tech-azure-archive-api", "icon-tech-azure-bus", "icon-tech-azure-cosmos", "icon-tech-azure-event-hub", "icon-tech-azure-functions", "icon-tech-azure-search", "icon-tech-azure-static-web-app", "icon-tech-azure-static-web-apps", "icon-tech-azure-storage", "icon-tech-azure-web-pubsub", "icon-tech-azurefunctions", "icon-tech-azureservicebus", "icon-tech-azuresignalR", "icon-tech-bayeux", "icon-tech-c++", "icon-tech-centrifugo", "icon-tech-claude", "icon-tech-claude-mono", "icon-tech-client-side-frameworks", "icon-tech-clojure", "icon-tech-cloudflare-durable-objects", "icon-tech-cloudflareworkers", "icon-tech-cocoa", "icon-tech-confluent", "icon-tech-cord", "icon-tech-csharp", "icon-tech-curl", "icon-tech-customwebhooks", "icon-tech-datadog", "icon-tech-design-patterns", "icon-tech-devplatforms", "icon-tech-diffusion-data", "icon-tech-django", "icon-tech-engineio", "icon-tech-event-driven-servers", "icon-tech-fanout-io", "icon-tech-fast-api", "icon-tech-fauna", "icon-tech-featherjs", "icon-tech-firebase", "icon-tech-firebase-cloud-messaging", "icon-tech-flutter", "icon-tech-gcloudbigquery", "icon-tech-gclouddataflow", "icon-tech-gcloudfunctions", "icon-tech-gcloudpubsub", "icon-tech-go", "icon-tech-grpc", "icon-tech-hivemq", "icon-tech-http2", "icon-tech-http3", "icon-tech-httprest", "icon-tech-idempotency", "icon-tech-ifttt", "icon-tech-integrations", "icon-tech-ios", "icon-tech-ios-generic", "icon-tech-ipados", "icon-tech-ipfs", "icon-tech-ironmq", "icon-tech-java", "icon-tech-javascript", "icon-tech-jms", "icon-tech-json", "icon-tech-json-web-tokens", "icon-tech-kaazing", "icon-tech-kotlin", "icon-tech-ksql-db", "icon-tech-kubernetes", "icon-tech-laravel-broadcast", "icon-tech-laravel-echo", "icon-tech-lightstreamer", "icon-tech-liveblocks", "icon-tech-longpolling", "icon-tech-macos", "icon-tech-matrix", "icon-tech-meteor", "icon-tech-mongo-db", "icon-tech-mono", "icon-tech-mqtt", "icon-tech-mysql", "icon-tech-native-script", "icon-tech-net", "icon-tech-netlify", "icon-tech-nextjs", "icon-tech-nkn", "icon-tech-nodejs", "icon-tech-objectivec", "icon-tech-openai", "icon-tech-parse-server", "icon-tech-php", "icon-tech-planetscale", "icon-tech-postgres", "icon-tech-prisma", "icon-tech-programminglanguages", "icon-tech-protcol-adaptors", "icon-tech-protocols", "icon-tech-pub-sub", "icon-tech-pubnub", "icon-tech-push-technology", "icon-tech-pusher", "icon-tech-python", "icon-tech-quic", "icon-tech-rabbitMQ", "icon-tech-railsactioncable", "icon-tech-react", "icon-tech-react-app", "icon-tech-reactnative", "icon-tech-redis", "icon-tech-redpanda", "icon-tech-replicache", "icon-tech-rethinkdb", "icon-tech-rocketmq", "icon-tech-ruby", "icon-tech-scala", "icon-tech-scaledrone", "icon-tech-serversentevents", "icon-tech-serversideframeworks", "icon-tech-signalR", "icon-tech-snowflake", "icon-tech-socketio", "icon-tech-sockjs", "icon-tech-solace", "icon-tech-spring", "icon-tech-stomp", "icon-tech-streamdata-io", "icon-tech-streamr", "icon-tech-swift", "icon-tech-symfony", "icon-tech-symfony-mercure", "icon-tech-tcp-ip", "icon-tech-tenefit", "icon-tech-terraform", "icon-tech-tvos", "icon-tech-twilio", "icon-tech-typescript", "icon-tech-udp-protocol", "icon-tech-unity", "icon-tech-vercel", "icon-tech-vscode", "icon-tech-vuejs", "icon-tech-wamp", "icon-tech-watchos", "icon-tech-web", "icon-tech-web-push", "icon-tech-webhooks", "icon-tech-webrtc", "icon-tech-websockets", "icon-tech-websub", "icon-tech-xamarin", "icon-tech-xhr-streaming", "icon-tech-xmpp", "icon-tech-zapier", "icon-tech-zeromq"];
5168
5164
  product: readonly ["icon-product-asset-tracking", "icon-product-asset-tracking-mono", "icon-product-chat", "icon-product-chat-mono", "icon-product-liveobjects", "icon-product-liveobjects-dark", "icon-product-liveobjects-mono", "icon-product-livesync", "icon-product-livesync-mono", "icon-product-platform", "icon-product-platform-mono", "icon-product-pubsub", "icon-product-pubsub-mono", "icon-product-spaces", "icon-product-spaces-mono"];
@@ -5468,6 +5464,7 @@ type PricingDataFeatureCta = {
5468
5464
  disabled?: boolean;
5469
5465
  onClick?: () => void;
5470
5466
  iconColor?: ColorClass | ColorThemeSet;
5467
+ isPriority?: boolean;
5471
5468
  };
5472
5469
  export type PricingDataFeatureSection = {
5473
5470
  title: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ably/ui",
3
- "version": "17.7.0-dev.25750e15",
3
+ "version": "17.7.0-dev.cc33cce1",
4
4
  "description": "Home of the Ably design system library ([design.ably.com](https://design.ably.com)). It provides a showcase, development/test environment and a publishing pipeline for different distributables.",
5
5
  "repository": {
6
6
  "type": "git",
@@ -19,45 +19,44 @@
19
19
  "workerDirectory": "./public"
20
20
  },
21
21
  "devDependencies": {
22
- "@storybook/addon-docs": "^9.1.3",
23
- "@storybook/react-vite": "^9.1.3",
22
+ "@storybook/addon-docs": "^9.1.4",
23
+ "@storybook/react-vite": "^9.1.4",
24
24
  "@storybook/test-runner": "^0.23.0",
25
25
  "@svgr/core": "^8.1.0",
26
26
  "@svgr/plugin-jsx": "^8.1.0",
27
27
  "@svgr/plugin-svgo": "^8.1.0",
28
- "@swc/cli": "^0.7.3",
29
- "@swc/core": "^1.4.11",
28
+ "@swc/cli": "^0.7.8",
29
+ "@swc/core": "^1.13.5",
30
30
  "@tailwindcss/container-queries": "^0.1.1",
31
31
  "@types/js-cookie": "^3.0.6",
32
- "@types/mixpanel-browser": "^2.60.0",
33
32
  "@types/node": "^20",
34
33
  "@types/react": "^18.3.1",
35
34
  "@types/react-dom": "^18.3.0",
36
35
  "@types/svg-sprite": "^0.0.39",
37
36
  "@typescript-eslint/eslint-plugin": "^8.25.0",
38
37
  "@typescript-eslint/parser": "^8.25.0",
39
- "@vitejs/plugin-react-swc": "^3.8.0",
40
- "@vueless/storybook-dark-mode": "^9.0.7",
38
+ "@vitejs/plugin-react-swc": "^4.0.1",
39
+ "@vueless/storybook-dark-mode": "^9.0.8",
41
40
  "autoprefixer": "^10.0.2",
42
41
  "eslint": "^8.57.0",
43
42
  "eslint-config-prettier": "^10.0.1",
44
43
  "eslint-plugin-react": "^7.34.3",
45
- "eslint-plugin-storybook": "^9.1.3",
44
+ "eslint-plugin-storybook": "^9.1.4",
46
45
  "heroicons": "^2.2.0",
47
46
  "http-server": "14.1.1",
48
47
  "jsdom": "^26.0.0",
49
48
  "mixpanel-browser": "^2.60.0",
50
- "msw": "2.10.2",
49
+ "msw": "2.11.1",
51
50
  "msw-storybook-addon": "^2.0.5",
52
51
  "playwright": "^1.49.1",
53
52
  "posthog-js": "^1.217.4",
54
53
  "prettier": "^3.2.5",
55
- "storybook": "^9.1.3",
54
+ "storybook": "^9.1.4",
56
55
  "svg-sprite": "^2.0.4",
57
56
  "tailwindcss": "^3.3.6",
58
57
  "ts-node": "^10.9.2",
59
- "typescript": "5.8.3",
60
- "vite": "^7.1.1",
58
+ "typescript": "5.9.2",
59
+ "vite": "^7.1.4",
61
60
  "vitest": "^3.0.8",
62
61
  "wait-on": "^8.0.3"
63
62
  },
package/tailwind.config.js CHANGED
@@ -52,10 +52,6 @@ module.exports = {
52
52
  },
53
53
  extend: {
54
54
  colors: {
55
- "ably-heading": "var(--color-ably-heading)",
56
- "ably-primary": "var(--color-ably-primary)",
57
- "ably-secondary": "var(--color-ably-secondary)",
58
- "ably-label": "var(--color-ably-label)",
59
55
  "neutral-000": "var(--color-neutral-000)",
60
56
  "neutral-100": "var(--color-neutral-100)",
61
57
  "neutral-200": "var(--color-neutral-200)",
package/core/ContentTile.js DELETED
@@ -1,2 +0,0 @@
1
- import React,{cloneElement,isValidElement}from"react";import Icon from"./Icon";import cn from"./utils/cn";import Badge from"./Badge";import FeaturedLink from"./FeaturedLink";const isImageElement=image=>{return isValidElement(image)&&typeof image.props==="object"&&image.props!==null};const ContentTile=({title,className,description,cta,image,imageIcons,badges,options})=>{return React.createElement("div",{className:cn("group/content-tile",className)},image&&React.createElement("div",{className:cn("content-tile__image h-[200px] relative p-3 pb-0 flex items-end justify-center rounded-lg bg-neutral-100 dark:bg-neutral-1200 border border-neutral-300 dark:border-neutral-1000 group-hover/content-tile:border-neutral-500 dark:group-hover/content-tile:border-neutral-800 transition-colors",options?.centerImage&&"items-center pb-3")},isImageElement(image)?cloneElement(image,{className:cn(image.props.className,"h-full")}):image,imageIcons&&imageIcons.length>0&&React.createElement("div",{className:"absolute bottom-3 right-3 flex gap-1.5 bg-neutral-000 dark:bg-neutral-1300 rounded border border-neutral-200 dark:border-neutral-1100 px-2 py-1.5"},imageIcons.map((icon,idx)=>React.createElement(Icon,{key:icon+idx,name:icon,size:"18px"})))),React.createElement("div",{className:"content-tile__content pr-4"},title&&React.createElement("h2",{className:"content-tile__title mt-4 mb-2 ui-text-h4 text-neutral-1300 dark:text-neutral-000"},title),description&&React.createElement("div",{className:"content-tile__description mb-2 ui-text-p2 text-neutral-800 dark:text-neutral-500"},description),badges&&badges.length>0&&React.createElement("div",{className:"content-tile__badges mb-2 flex flex-wrap gap-2"},badges.map((badge,idx)=>typeof badge==="string"?React.createElement(Badge,{key:badge+idx,className:"uppercase text-[10px]"},badge):React.createElement(Badge,{key:badge.label+idx,className:cn("uppercase text-[10px]",badge.className)},badge.label))),cta&&React.createElement(FeaturedLink,{url:cta.url,additionalCSS:"hidden group-hover/content-tile:block items-center text-neutral-1300 dark:text-neutral-000 hover:text-neutral-1300 dark:hover:text-neutral-000",iconColor:"text-orange-600"},cta.text)))};export default ContentTile;
2
- //# sourceMappingURL=ContentTile.js.map
package/core/ContentTile.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/core/ContentTile.tsx"],"sourcesContent":["import React, { cloneElement, isValidElement, ReactElement } from \"react\";\nimport type { IconName } from \"./Icon/types\";\nimport Icon from \"./Icon\";\nimport cn from \"./utils/cn\";\nimport Badge from \"./Badge\";\nimport FeaturedLink from \"./FeaturedLink\";\n\ntype ContentTileBadge =\n | string\n | {\n label: string;\n className?: string;\n };\n\ntype CTA = {\n text: string;\n url: string;\n};\n\ntype ContentTileProps = {\n title?: string;\n className?: string;\n description?: string;\n cta?: CTA;\n image?: React.ReactNode;\n imageIcons?: IconName[];\n badges?: ContentTileBadge[];\n options?: {\n centerImage?: boolean;\n };\n};\n\n// Type guard to check if image is a ReactElement with className prop\nconst isImageElement = (\n image: React.ReactNode,\n): image is ReactElement<{ className?: string }> => {\n return (\n isValidElement(image) &&\n typeof image.props === \"object\" &&\n image.props !== null\n );\n};\n\nconst ContentTile: React.FC<ContentTileProps> = ({\n title,\n className,\n description,\n cta,\n image,\n imageIcons,\n badges,\n options,\n}) => {\n return (\n <div className={cn(\"group/content-tile\", className)}>\n {image && (\n <div\n className={cn(\n \"content-tile__image h-[200px] relative p-3 pb-0 flex items-end justify-center rounded-lg bg-neutral-100 dark:bg-neutral-1200 border border-neutral-300 dark:border-neutral-1000 group-hover/content-tile:border-neutral-500 dark:group-hover/content-tile:border-neutral-800 transition-colors\",\n options?.centerImage && \"items-center pb-3\",\n )}\n >\n {isImageElement(image)\n ? cloneElement(image, {\n className: cn(image.props.className, \"h-full\"),\n })\n : image}\n {imageIcons && imageIcons.length > 0 && (\n <div className=\"absolute bottom-3 right-3 flex gap-1.5 bg-neutral-000 dark:bg-neutral-1300 rounded border border-neutral-200 dark:border-neutral-1100 px-2 py-1.5\">\n {imageIcons.map((icon, idx) => (\n <Icon key={icon + idx} name={icon} size=\"18px\" />\n ))}\n </div>\n )}\n </div>\n )}\n <div className=\"content-tile__content pr-4\">\n {title && (\n <h2 className=\"content-tile__title mt-4 mb-2 ui-text-h4 text-neutral-1300 dark:text-neutral-000\">\n {title}\n </h2>\n )}\n {description && (\n <div className=\"content-tile__description mb-2 ui-text-p2 text-neutral-800 dark:text-neutral-500\">\n {description}\n </div>\n )}\n {badges && badges.length > 0 && (\n <div className=\"content-tile__badges mb-2 flex flex-wrap gap-2\">\n {badges.map((badge, idx) =>\n typeof badge === \"string\" ? (\n <Badge key={badge + idx} className=\"uppercase text-[10px]\">\n {badge}\n </Badge>\n ) : (\n <Badge\n key={badge.label + idx}\n className={cn(\"uppercase text-[10px]\", badge.className)}\n >\n {badge.label}\n </Badge>\n ),\n )}\n </div>\n )}\n {cta && (\n <FeaturedLink\n url={cta.url}\n additionalCSS=\"hidden group-hover/content-tile:block items-center text-neutral-1300 dark:text-neutral-000 hover:text-neutral-1300 dark:hover:text-neutral-000\"\n iconColor=\"text-orange-600\"\n >\n {cta.text}\n </FeaturedLink>\n )}\n </div>\n </div>\n );\n};\n\nexport default ContentTile;\n"],"names":["React","cloneElement","isValidElement","Icon","cn","Badge","FeaturedLink","isImageElement","image","props","ContentTile","title","className","description","cta","imageIcons","badges","options","div","centerImage","length","map","icon","idx","key","name","size","h2","badge","label","url","additionalCSS","iconColor","text"],"mappings":"AAAA,OAAOA,OAASC,YAAY,CAAEC,cAAc,KAAsB,OAAQ,AAE1E,QAAOC,SAAU,QAAS,AAC1B,QAAOC,OAAQ,YAAa,AAC5B,QAAOC,UAAW,SAAU,AAC5B,QAAOC,iBAAkB,gBAAiB,CA4B1C,MAAMC,eAAiB,AACrBC,QAEA,OACEN,eAAeM,QACf,OAAOA,MAAMC,KAAK,GAAK,UACvBD,MAAMC,KAAK,GAAK,IAEpB,EAEA,MAAMC,YAA0C,CAAC,CAC/CC,KAAK,CACLC,SAAS,CACTC,WAAW,CACXC,GAAG,CACHN,KAAK,CACLO,UAAU,CACVC,MAAM,CACNC,OAAO,CACR,IACC,OACE,oBAACC,OAAIN,UAAWR,GAAG,qBAAsBQ,YACtCJ,OACC,oBAACU,OACCN,UAAWR,GACT,iSACAa,SAASE,aAAe,sBAGzBZ,eAAeC,OACZP,aAAaO,MAAO,CAClBI,UAAWR,GAAGI,MAAMC,KAAK,CAACG,SAAS,CAAE,SACvC,GACAJ,MACHO,YAAcA,WAAWK,MAAM,CAAG,GACjC,oBAACF,OAAIN,UAAU,qJACZG,WAAWM,GAAG,CAAC,CAACC,KAAMC,MACrB,oBAACpB,MAAKqB,IAAKF,KAAOC,IAAKE,KAAMH,KAAMI,KAAK,YAMlD,oBAACR,OAAIN,UAAU,8BACZD,OACC,oBAACgB,MAAGf,UAAU,oFACXD,OAGJE,aACC,oBAACK,OAAIN,UAAU,oFACZC,aAGJG,QAAUA,OAAOI,MAAM,CAAG,GACzB,oBAACF,OAAIN,UAAU,kDACZI,OAAOK,GAAG,CAAC,CAACO,MAAOL,MAClB,OAAOK,QAAU,SACf,oBAACvB,OAAMmB,IAAKI,MAAQL,IAAKX,UAAU,yBAChCgB,OAGH,oBAACvB,OACCmB,IAAKI,MAAMC,KAAK,CAAGN,IACnBX,UAAWR,GAAG,wBAAyBwB,MAAMhB,SAAS,GAErDgB,MAAMC,KAAK,IAMrBf,KACC,oBAACR,cACCwB,IAAKhB,IAAIgB,GAAG,CACZC,cAAc,iJACdC,UAAU,mBAETlB,IAAImB,IAAI,GAMrB,CAEA,gBAAevB,WAAY"}