@ably/ui 16.0.0-dev.937d7376 → 16.0.0-dev.fc84d6ff

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 (119) hide show
  1. package/core/.DS_Store +0 -0
  2. package/core/FeaturedLink.js +1 -1
  3. package/core/FeaturedLink.js.map +1 -1
  4. package/core/Flyout.js +1 -1
  5. package/core/Flyout.js.map +1 -1
  6. package/core/Header/HeaderLinks.js.map +1 -1
  7. package/core/Header.js +1 -1
  8. package/core/Header.js.map +1 -1
  9. package/core/LegacyMeganav/LegacyMeganav.js +2 -0
  10. package/core/LegacyMeganav/LegacyMeganav.js.map +1 -0
  11. package/core/LegacyMeganav/MeganavBlogPostsList.js +2 -0
  12. package/core/LegacyMeganav/MeganavBlogPostsList.js.map +1 -0
  13. package/core/LegacyMeganav/MeganavContentCompany.js +2 -0
  14. package/core/LegacyMeganav/MeganavContentCompany.js.map +1 -0
  15. package/core/LegacyMeganav/MeganavContentDevelopers.js +2 -0
  16. package/core/LegacyMeganav/MeganavContentDevelopers.js.map +1 -0
  17. package/core/LegacyMeganav/MeganavContentProducts.js +2 -0
  18. package/core/LegacyMeganav/MeganavContentProducts.js.map +1 -0
  19. package/core/LegacyMeganav/MeganavContentUseCases.js +2 -0
  20. package/core/LegacyMeganav/MeganavContentUseCases.js.map +1 -0
  21. package/core/LegacyMeganav/MeganavControl.js +2 -0
  22. package/core/LegacyMeganav/MeganavControl.js.map +1 -0
  23. package/core/LegacyMeganav/MeganavControlMobileDropdown.js +2 -0
  24. package/core/LegacyMeganav/MeganavControlMobileDropdown.js.map +1 -0
  25. package/core/LegacyMeganav/MeganavControlMobilePanelClose.js +2 -0
  26. package/core/LegacyMeganav/MeganavControlMobilePanelClose.js.map +1 -0
  27. package/core/LegacyMeganav/MeganavControlMobilePanelOpen.js +2 -0
  28. package/core/LegacyMeganav/MeganavControlMobilePanelOpen.js.map +1 -0
  29. package/core/LegacyMeganav/MeganavItemsDesktop.js +2 -0
  30. package/core/LegacyMeganav/MeganavItemsDesktop.js.map +1 -0
  31. package/core/LegacyMeganav/MeganavItemsMobile.js +2 -0
  32. package/core/LegacyMeganav/MeganavItemsMobile.js.map +1 -0
  33. package/core/LegacyMeganav/MeganavItemsSignedIn.js.map +1 -0
  34. package/core/LegacyMeganav/MeganavSearch.js +2 -0
  35. package/core/LegacyMeganav/MeganavSearch.js.map +1 -0
  36. package/core/LegacyMeganav/MeganavSearchAutocomplete.js.map +1 -0
  37. package/core/LegacyMeganav/MeganavSearchPanel.js +2 -0
  38. package/core/LegacyMeganav/MeganavSearchPanel.js.map +1 -0
  39. package/core/LegacyMeganav/MeganavSearchSuggestions.js +2 -0
  40. package/core/LegacyMeganav/MeganavSearchSuggestions.js.map +1 -0
  41. package/core/LegacyMeganav/SignOutLink.js.map +1 -0
  42. package/core/Meganav/.DS_Store +0 -0
  43. package/core/Meganav/MeganavMobile.js +1 -1
  44. package/core/Meganav/MeganavMobile.js.map +1 -1
  45. package/core/Meganav/MeganavPanel.js +1 -1
  46. package/core/Meganav/MeganavPanel.js.map +1 -1
  47. package/core/Meganav/data.js +1 -1
  48. package/core/Meganav/data.js.map +1 -1
  49. package/core/Meganav/images/fan-engagement-nav-image.png +0 -0
  50. package/core/Meganav/images/founders-nav-image.png +0 -0
  51. package/core/Meganav.js +2 -0
  52. package/core/Meganav.js.map +1 -0
  53. package/core/Notice.js +1 -1
  54. package/core/Notice.js.map +1 -1
  55. package/core/ProductTile/ProductDescription.js +1 -1
  56. package/core/ProductTile/ProductDescription.js.map +1 -1
  57. package/core/ProductTile/ProductLabel.js +1 -1
  58. package/core/ProductTile/ProductLabel.js.map +1 -1
  59. package/core/insights/command-queue.js +2 -0
  60. package/core/insights/command-queue.js.map +1 -0
  61. package/core/insights/datalayer.js +2 -0
  62. package/core/insights/datalayer.js.map +1 -0
  63. package/core/insights/index.js +1 -1
  64. package/core/insights/index.js.map +1 -1
  65. package/core/insights/index.test.js +2 -0
  66. package/core/insights/index.test.js.map +1 -0
  67. package/core/insights/logger.js +2 -0
  68. package/core/insights/logger.js.map +1 -0
  69. package/core/insights/mixpanel.js +1 -1
  70. package/core/insights/mixpanel.js.map +1 -1
  71. package/core/insights/posthog.js +1 -1
  72. package/core/insights/posthog.js.map +1 -1
  73. package/core/insights/service.js +2 -0
  74. package/core/insights/service.js.map +1 -0
  75. package/core/insights/types.js.map +1 -1
  76. package/index.d.ts +239 -234
  77. package/package.json +9 -5
  78. package/core/LegacyMeganav.js +0 -2
  79. package/core/LegacyMeganav.js.map +0 -1
  80. package/core/Meganav/Meganav.js +0 -2
  81. package/core/Meganav/Meganav.js.map +0 -1
  82. package/core/MeganavBlogPostsList.js +0 -2
  83. package/core/MeganavBlogPostsList.js.map +0 -1
  84. package/core/MeganavContentCompany.js +0 -2
  85. package/core/MeganavContentCompany.js.map +0 -1
  86. package/core/MeganavContentDevelopers.js +0 -2
  87. package/core/MeganavContentDevelopers.js.map +0 -1
  88. package/core/MeganavContentProducts.js +0 -2
  89. package/core/MeganavContentProducts.js.map +0 -1
  90. package/core/MeganavContentUseCases.js +0 -2
  91. package/core/MeganavContentUseCases.js.map +0 -1
  92. package/core/MeganavControl.js +0 -2
  93. package/core/MeganavControl.js.map +0 -1
  94. package/core/MeganavControlMobileDropdown.js +0 -2
  95. package/core/MeganavControlMobileDropdown.js.map +0 -1
  96. package/core/MeganavControlMobilePanelClose.js +0 -2
  97. package/core/MeganavControlMobilePanelClose.js.map +0 -1
  98. package/core/MeganavControlMobilePanelOpen.js +0 -2
  99. package/core/MeganavControlMobilePanelOpen.js.map +0 -1
  100. package/core/MeganavItemsDesktop.js +0 -2
  101. package/core/MeganavItemsDesktop.js.map +0 -1
  102. package/core/MeganavItemsMobile.js +0 -2
  103. package/core/MeganavItemsMobile.js.map +0 -1
  104. package/core/MeganavItemsSignedIn.js.map +0 -1
  105. package/core/MeganavSearch.js +0 -2
  106. package/core/MeganavSearch.js.map +0 -1
  107. package/core/MeganavSearchAutocomplete.js.map +0 -1
  108. package/core/MeganavSearchPanel.js +0 -2
  109. package/core/MeganavSearchPanel.js.map +0 -1
  110. package/core/MeganavSearchSuggestions.js +0 -2
  111. package/core/MeganavSearchSuggestions.js.map +0 -1
  112. package/core/SignOutLink.js.map +0 -1
  113. package/core/images/award/g2-best-meets-requirements-2025.png +0 -0
  114. package/core/images/award/g2-best-support-2025.png +0 -0
  115. package/core/images/award/g2-high-performer-2025.png +0 -0
  116. package/core/images/award/g2-users-most-likely-to-recommend-2025.png +0 -0
  117. /package/core/{MeganavItemsSignedIn.js → LegacyMeganav/MeganavItemsSignedIn.js} +0 -0
  118. /package/core/{MeganavSearchAutocomplete.js → LegacyMeganav/MeganavSearchAutocomplete.js} +0 -0
  119. /package/core/{SignOutLink.js → LegacyMeganav/SignOutLink.js} +0 -0
package/index.d.ts CHANGED
@@ -423,8 +423,12 @@ type FeaturedLinkProps = {
423
423
  newWindow?: boolean;
424
424
  onClick?: () => void;
425
425
  disabled?: boolean;
426
+ /**
427
+ * Optional class name for group hover state.
428
+ */
429
+ groupHoverClassName?: string;
426
430
  };
427
- const FeaturedLink: ({ url, textSize, iconColor, flush, reverse, additionalCSS, newWindow, onClick, children, disabled, }: FeaturedLinkProps) => import("react/jsx-runtime").JSX.Element;
431
+ const FeaturedLink: ({ url, textSize, iconColor, flush, reverse, additionalCSS, newWindow, onClick, children, disabled, groupHoverClassName, }: FeaturedLinkProps) => import("react/jsx-runtime").JSX.Element;
428
432
  export default FeaturedLink;
429
433
  //# sourceMappingURL=FeaturedLink.d.ts.map
430
434
  }
@@ -475,7 +479,7 @@ type FlyoutProps = {
475
479
  */
476
480
  menuItems: {
477
481
  /**
478
- * name for the menu item.
482
+ * Name for the menu item.
479
483
  */
480
484
  name: string;
481
485
  /**
@@ -537,9 +541,7 @@ export default Footer;
537
541
  declare module '@ably/ui/core/Header/HeaderLinks' {
538
542
  import React from "react";
539
543
  import { HeaderProps } from ".@ably/ui/core/Header";
540
- export const HeaderLinks: React.FC<Pick<HeaderProps, "sessionState" | "headerLinks" | "searchButtonVisibility" | "searchButton"> & {
541
- className?: string;
542
- }>;
544
+ export const HeaderLinks: React.FC<Pick<HeaderProps, "sessionState" | "headerLinks" | "searchButtonVisibility" | "searchButton" | "className">>;
543
545
  //# sourceMappingURL=HeaderLinks.d.ts.map
544
546
  }
545
547
 
@@ -579,7 +581,10 @@ export type HeaderSessionState = {
579
581
  * Props for the Header component.
580
582
  */
581
583
  export type HeaderProps = {
582
- headerClassName?: string;
584
+ /**
585
+ * Optional classnames to add to the header
586
+ */
587
+ className?: string;
583
588
  /**
584
589
  * Optional search bar element.
585
590
  */
@@ -684,73 +689,9 @@ export default Icon;
684
689
  //# sourceMappingURL=Icon.d.ts.map
685
690
  }
686
691
 
687
- declare module '@ably/ui/core/LegacyMeganav/MeganavControl/component' {
688
- export default MeganavControl;
689
- function MeganavControl(): {
690
- teardown: () => void;
691
- clear: () => void;
692
- }[];
693
- //# sourceMappingURL=component.d.ts.map
694
- }
695
-
696
- declare module '@ably/ui/core/LegacyMeganav/MeganavControlMobileDropdown/component' {
697
- export default MeganavControlMobileDropdown;
698
- function MeganavControlMobileDropdown({ clearPanels }: {
699
- clearPanels: any;
700
- }): {
701
- teardown: () => void;
702
- clear: () => void;
703
- };
704
- //# sourceMappingURL=component.d.ts.map
705
- }
706
-
707
- declare module '@ably/ui/core/LegacyMeganav/MeganavControlMobilePanelClose/component' {
708
- function _default(): {
709
- teardown: () => void;
710
- clear: () => void;
711
- }[];
712
- export default _default;
713
- //# sourceMappingURL=component.d.ts.map
714
- }
715
-
716
- declare module '@ably/ui/core/LegacyMeganav/MeganavControlMobilePanelOpen/component' {
717
- function _default(): {
718
- teardown: () => void;
719
- clear: () => void;
720
- }[];
721
- export default _default;
722
- //# sourceMappingURL=component.d.ts.map
723
- }
724
-
725
- declare module '@ably/ui/core/LegacyMeganav/MeganavSearchAutocomplete/component' {
726
- function _default(apiKey: any): {
727
- teardown: () => void;
728
- clear: () => void;
729
- }[];
730
- export default _default;
731
- //# sourceMappingURL=component.d.ts.map
732
- }
733
-
734
- declare module '@ably/ui/core/LegacyMeganav/MeganavSearchSuggestions/component' {
735
- export default MeganavSearchSuggestions;
736
- function MeganavSearchSuggestions(): {
737
- teardown: () => void;
738
- clear: () => void;
739
- };
740
- //# sourceMappingURL=component.d.ts.map
741
- }
742
-
743
- declare module '@ably/ui/core/LegacyMeganav/component' {
744
- export default function Meganav({ themeName, addSearchApiKey }: {
745
- themeName: any;
746
- addSearchApiKey: any;
747
- }): () => void;
748
- //# sourceMappingURL=component.d.ts.map
749
- }
750
-
751
- declare module '@ably/ui/core/LegacyMeganav' {
692
+ declare module '@ably/ui/core/LegacyMeganav/LegacyMeganav' {
752
693
  import { ReactNode } from "react";
753
- import { ColorClass } from "@ably/ui/core/styles/colors/types";
694
+ import { ColorClass } from ".@ably/ui/core/styles/colors/types";
754
695
  export type MeganavTheme = {
755
696
  backgroundColor?: ColorClass;
756
697
  textColor?: ColorClass;
@@ -828,137 +769,12 @@ type MeganavProps = {
828
769
  statusUrl: string;
829
770
  searchDataId?: string;
830
771
  };
831
- const Meganav: ({ paths, themeName, notice, loginLink, urlBase, addSearchApiKey, statusUrl, searchDataId, }: MeganavProps) => import("react/jsx-runtime").JSX.Element;
832
- export default Meganav;
772
+ const LegacyMeganav: ({ paths, themeName, notice, loginLink, urlBase, addSearchApiKey, statusUrl, searchDataId, }: MeganavProps) => import("react/jsx-runtime").JSX.Element;
773
+ export default LegacyMeganav;
833
774
  //# sourceMappingURL=LegacyMeganav.d.ts.map
834
775
  }
835
776
 
836
- declare module '@ably/ui/core/LinkButton' {
837
- import React from "react";
838
- import { ButtonPropsBase } from "@ably/ui/core/Button";
839
- import { ColorClass, ColorThemeSet } from "@ably/ui/core/styles/colors/types";
840
- export type LinkButtonProps = ButtonPropsBase & {
841
- disabled?: boolean;
842
- onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
843
- iconColor?: ColorClass | ColorThemeSet;
844
- } & React.AnchorHTMLAttributes<HTMLAnchorElement>;
845
- const LinkButton: React.FC<LinkButtonProps>;
846
- export default LinkButton;
847
- //# sourceMappingURL=LinkButton.d.ts.map
848
- }
849
-
850
- declare module '@ably/ui/core/Loader' {
851
- type LoaderProps = {
852
- size?: string;
853
- ringColor?: string;
854
- additionalCSS?: string;
855
- };
856
- const Loader: ({ ringColor, size, additionalCSS, }: LoaderProps) => import("react/jsx-runtime").JSX.Element;
857
- export default Loader;
858
- //# sourceMappingURL=Loader.d.ts.map
859
- }
860
-
861
- declare module '@ably/ui/core/Logo' {
862
- import React from "react";
863
- type LogoProps = {
864
- dataId?: string;
865
- logoUrl?: string;
866
- logoAlt?: string;
867
- href?: string;
868
- additionalImgAttrs?: object;
869
- additionalLinkAttrs?: object;
870
- theme?: "light" | "dark";
871
- variant?: "default" | "mono";
872
- orientation?: "default" | "stacked";
873
- };
874
- const _default: React.MemoExoticComponent<({ dataId, href, additionalImgAttrs, additionalLinkAttrs, theme, variant, orientation, logoUrl, logoAlt, }: LogoProps) => import("react/jsx-runtime").JSX.Element>;
875
- export default _default;
876
- //# sourceMappingURL=Logo.d.ts.map
877
- }
878
-
879
- declare module '@ably/ui/core/Meganav/Meganav' {
880
- import { HeaderSessionState } from ".@ably/ui/core/Header";
881
- export type MeganavNoticeBannerProps = {
882
- props: {
883
- title: string;
884
- bodyText: string;
885
- buttonLink: string;
886
- buttonLabel: string;
887
- closeBtn: boolean;
888
- };
889
- config: {
890
- cookieId: string;
891
- noticeId: string | number;
892
- options: {
893
- collapse: boolean;
894
- };
895
- };
896
- };
897
- export type MeganavProps = {
898
- sessionState: HeaderSessionState;
899
- searchDataId: string;
900
- notice?: MeganavNoticeBannerProps;
901
- };
902
- const Meganav: ({ sessionState, searchDataId, notice }: MeganavProps) => import("react/jsx-runtime").JSX.Element;
903
- export default Meganav;
904
- //# sourceMappingURL=Meganav.d.ts.map
905
- }
906
-
907
- declare module '@ably/ui/core/Meganav/MeganavMobile' {
908
- import { AccordionData } from ".@ably/ui/core/Accordion/types";
909
- export const MeganavMobile: ({ mobileNavItems, }: {
910
- mobileNavItems: AccordionData[];
911
- }) => import("react/jsx-runtime").JSX.Element;
912
- //# sourceMappingURL=MeganavMobile.d.ts.map
913
- }
914
-
915
- declare module '@ably/ui/core/Meganav/MeganavPanel' {
916
- import React from "react";
917
- import { FlyoutPanelHighlight, FlyoutPanelList } from "@ably/ui/core/data";
918
- export const MeganavPanel: ({ displayProductTile, panelLeft, panelLeftClassName, panelRightHeading, panelRightItems, panelRightBottom, }: {
919
- displayProductTile?: boolean;
920
- panelLeft?: FlyoutPanelHighlight;
921
- panelLeftClassName?: string;
922
- panelRightHeading?: string;
923
- panelRightItems: FlyoutPanelList[];
924
- panelRightBottom?: React.ReactNode;
925
- }) => import("react/jsx-runtime").JSX.Element;
926
- //# sourceMappingURL=MeganavPanel.d.ts.map
927
- }
928
-
929
- declare module '@ably/ui/core/Meganav/data' {
930
- import React from "react";
931
- import { IconName } from ".@ably/ui/core/Icon/types";
932
- export type FlyoutPanelList = {
933
- label: string;
934
- icon: IconName;
935
- link: string;
936
- isMobile?: boolean;
937
- };
938
- export type FlyoutPanelHighlight = {
939
- heading: string;
940
- content: string;
941
- labelLink: string;
942
- url: string;
943
- image: string;
944
- };
945
- export type MenuItem = {
946
- name: string;
947
- link?: string;
948
- isHiddenMobile?: boolean;
949
- content?: React.ReactNode;
950
- panelClassName?: string;
951
- };
952
- export const menuItemLinks: {
953
- name: string;
954
- link: string;
955
- isHiddenMobile: boolean;
956
- }[];
957
- export const menuItemsForHeader: MenuItem[];
958
- //# sourceMappingURL=data.d.ts.map
959
- }
960
-
961
- declare module '@ably/ui/core/MeganavBlogPostsList' {
777
+ declare module '@ably/ui/core/LegacyMeganav/MeganavBlogPostsList' {
962
778
  import { AbsUrl } from "@ably/ui/core/LegacyMeganav";
963
779
  type MeganavBlogPostsListProps = {
964
780
  recentBlogPosts: {
@@ -973,7 +789,7 @@ export default MeganavBlogPostsList;
973
789
  //# sourceMappingURL=MeganavBlogPostsList.d.ts.map
974
790
  }
975
791
 
976
- declare module '@ably/ui/core/MeganavContentCompany' {
792
+ declare module '@ably/ui/core/LegacyMeganav/MeganavContentCompany' {
977
793
  import { AbsUrl, MeganavPaths } from "@ably/ui/core/LegacyMeganav";
978
794
  type MeganavContentCompanyProps = {
979
795
  absUrl: AbsUrl;
@@ -984,7 +800,7 @@ export default MeganavContentCompany;
984
800
  //# sourceMappingURL=MeganavContentCompany.d.ts.map
985
801
  }
986
802
 
987
- declare module '@ably/ui/core/MeganavContentDevelopers' {
803
+ declare module '@ably/ui/core/LegacyMeganav/MeganavContentDevelopers' {
988
804
  import { AbsUrl } from "@ably/ui/core/LegacyMeganav";
989
805
  const MeganavContentDevelopers: ({ absUrl, statusUrl, }: {
990
806
  absUrl: AbsUrl;
@@ -994,7 +810,7 @@ export default MeganavContentDevelopers;
994
810
  //# sourceMappingURL=MeganavContentDevelopers.d.ts.map
995
811
  }
996
812
 
997
- declare module '@ably/ui/core/MeganavContentProducts' {
813
+ declare module '@ably/ui/core/LegacyMeganav/MeganavContentProducts' {
998
814
  import { AbsUrl, MeganavPaths } from "@ably/ui/core/LegacyMeganav";
999
815
  type MeganavContentProductsProps = {
1000
816
  paths?: MeganavPaths;
@@ -1005,7 +821,7 @@ export default MeganavContentProducts;
1005
821
  //# sourceMappingURL=MeganavContentProducts.d.ts.map
1006
822
  }
1007
823
 
1008
- declare module '@ably/ui/core/MeganavContentUseCases' {
824
+ declare module '@ably/ui/core/LegacyMeganav/MeganavContentUseCases' {
1009
825
  import { AbsUrl } from "@ably/ui/core/LegacyMeganav";
1010
826
  const MeganavContentUseCases: ({ absUrl }: {
1011
827
  absUrl: AbsUrl;
@@ -1014,7 +830,16 @@ export default MeganavContentUseCases;
1014
830
  //# sourceMappingURL=MeganavContentUseCases.d.ts.map
1015
831
  }
1016
832
 
1017
- declare module '@ably/ui/core/MeganavControl' {
833
+ declare module '@ably/ui/core/LegacyMeganav/MeganavControl/component' {
834
+ export default MeganavControl;
835
+ function MeganavControl(): {
836
+ teardown: () => void;
837
+ clear: () => void;
838
+ }[];
839
+ //# sourceMappingURL=component.d.ts.map
840
+ }
841
+
842
+ declare module '@ably/ui/core/LegacyMeganav/MeganavControl' {
1018
843
  import { ReactNode } from "react";
1019
844
  import { MeganavTheme } from "@ably/ui/core/LegacyMeganav";
1020
845
  type MeganavControlProps = {
@@ -1029,7 +854,18 @@ export default MeganavControl;
1029
854
  //# sourceMappingURL=MeganavControl.d.ts.map
1030
855
  }
1031
856
 
1032
- declare module '@ably/ui/core/MeganavControlMobileDropdown' {
857
+ declare module '@ably/ui/core/LegacyMeganav/MeganavControlMobileDropdown/component' {
858
+ export default MeganavControlMobileDropdown;
859
+ function MeganavControlMobileDropdown({ clearPanels }: {
860
+ clearPanels: any;
861
+ }): {
862
+ teardown: () => void;
863
+ clear: () => void;
864
+ };
865
+ //# sourceMappingURL=component.d.ts.map
866
+ }
867
+
868
+ declare module '@ably/ui/core/LegacyMeganav/MeganavControlMobileDropdown' {
1033
869
  import { MeganavTheme } from "@ably/ui/core/LegacyMeganav";
1034
870
  const MeganavControlMobileDropdown: ({ theme }: {
1035
871
  theme: MeganavTheme;
@@ -1038,7 +874,16 @@ export default MeganavControlMobileDropdown;
1038
874
  //# sourceMappingURL=MeganavControlMobileDropdown.d.ts.map
1039
875
  }
1040
876
 
1041
- declare module '@ably/ui/core/MeganavControlMobilePanelClose' {
877
+ declare module '@ably/ui/core/LegacyMeganav/MeganavControlMobilePanelClose/component' {
878
+ function _default(): {
879
+ teardown: () => void;
880
+ clear: () => void;
881
+ }[];
882
+ export default _default;
883
+ //# sourceMappingURL=component.d.ts.map
884
+ }
885
+
886
+ declare module '@ably/ui/core/LegacyMeganav/MeganavControlMobilePanelClose' {
1042
887
  type MeganavControlMobilePanelCloseProps = {
1043
888
  ariaControls: string;
1044
889
  displayHr?: boolean;
@@ -1048,7 +893,16 @@ export default MeganavControlMobilePanelClose;
1048
893
  //# sourceMappingURL=MeganavControlMobilePanelClose.d.ts.map
1049
894
  }
1050
895
 
1051
- declare module '@ably/ui/core/MeganavControlMobilePanelOpen' {
896
+ declare module '@ably/ui/core/LegacyMeganav/MeganavControlMobilePanelOpen/component' {
897
+ function _default(): {
898
+ teardown: () => void;
899
+ clear: () => void;
900
+ }[];
901
+ export default _default;
902
+ //# sourceMappingURL=component.d.ts.map
903
+ }
904
+
905
+ declare module '@ably/ui/core/LegacyMeganav/MeganavControlMobilePanelOpen' {
1052
906
  import { ReactNode } from "react";
1053
907
  type MeganavControlMobilePanelOpenProps = {
1054
908
  ariaControls: string;
@@ -1059,7 +913,7 @@ export default MeganavControlMobilePanelOpen;
1059
913
  //# sourceMappingURL=MeganavControlMobilePanelOpen.d.ts.map
1060
914
  }
1061
915
 
1062
- declare module '@ably/ui/core/MeganavItemsDesktop' {
916
+ declare module '@ably/ui/core/LegacyMeganav/MeganavItemsDesktop' {
1063
917
  import React from "react";
1064
918
  import { AbsUrl, MeganavPanels, MeganavPaths, MeganavTheme } from "@ably/ui/core/LegacyMeganav";
1065
919
  type MeganavDesktopItems = {
@@ -1075,7 +929,7 @@ export default _default;
1075
929
  //# sourceMappingURL=MeganavItemsDesktop.d.ts.map
1076
930
  }
1077
931
 
1078
- declare module '@ably/ui/core/MeganavItemsMobile' {
932
+ declare module '@ably/ui/core/LegacyMeganav/MeganavItemsMobile' {
1079
933
  import React from "react";
1080
934
  import { AbsUrl, MeganavPanels, MeganavPaths, MeganavSessionState, MeganavTheme } from "@ably/ui/core/LegacyMeganav";
1081
935
  type MeganavItemsMobileProps = {
@@ -1093,7 +947,7 @@ export default _default;
1093
947
  //# sourceMappingURL=MeganavItemsMobile.d.ts.map
1094
948
  }
1095
949
 
1096
- declare module '@ably/ui/core/MeganavItemsSignedIn' {
950
+ declare module '@ably/ui/core/LegacyMeganav/MeganavItemsSignedIn' {
1097
951
  import { AbsUrl, MeganavSessionState, MeganavTheme } from "@ably/ui/core/LegacyMeganav";
1098
952
  type MeganavItemsSignedIn = {
1099
953
  sessionState: MeganavSessionState;
@@ -1106,7 +960,7 @@ export default MeganavItemsSignedIn;
1106
960
  //# sourceMappingURL=MeganavItemsSignedIn.d.ts.map
1107
961
  }
1108
962
 
1109
- declare module '@ably/ui/core/MeganavSearch' {
963
+ declare module '@ably/ui/core/LegacyMeganav/MeganavSearch' {
1110
964
  import { AbsUrl } from "@ably/ui/core/LegacyMeganav";
1111
965
  const MeganavSearch: ({ absUrl, dataId, }: {
1112
966
  absUrl: AbsUrl;
@@ -1116,13 +970,22 @@ export default MeganavSearch;
1116
970
  //# sourceMappingURL=MeganavSearch.d.ts.map
1117
971
  }
1118
972
 
1119
- declare module '@ably/ui/core/MeganavSearchAutocomplete' {
973
+ declare module '@ably/ui/core/LegacyMeganav/MeganavSearchAutocomplete/component' {
974
+ function _default(apiKey: any): {
975
+ teardown: () => void;
976
+ clear: () => void;
977
+ }[];
978
+ export default _default;
979
+ //# sourceMappingURL=component.d.ts.map
980
+ }
981
+
982
+ declare module '@ably/ui/core/LegacyMeganav/MeganavSearchAutocomplete' {
1120
983
  const MeganavSearchAutocomplete: () => import("react/jsx-runtime").JSX.Element;
1121
984
  export default MeganavSearchAutocomplete;
1122
985
  //# sourceMappingURL=MeganavSearchAutocomplete.d.ts.map
1123
986
  }
1124
987
 
1125
- declare module '@ably/ui/core/MeganavSearchPanel' {
988
+ declare module '@ably/ui/core/LegacyMeganav/MeganavSearchPanel' {
1126
989
  import { AbsUrl } from "@ably/ui/core/LegacyMeganav";
1127
990
  const MeganavSearchPanel: ({ absUrl }: {
1128
991
  absUrl: AbsUrl;
@@ -1131,7 +994,16 @@ export default MeganavSearchPanel;
1131
994
  //# sourceMappingURL=MeganavSearchPanel.d.ts.map
1132
995
  }
1133
996
 
1134
- declare module '@ably/ui/core/MeganavSearchSuggestions' {
997
+ declare module '@ably/ui/core/LegacyMeganav/MeganavSearchSuggestions/component' {
998
+ export default MeganavSearchSuggestions;
999
+ function MeganavSearchSuggestions(): {
1000
+ teardown: () => void;
1001
+ clear: () => void;
1002
+ };
1003
+ //# sourceMappingURL=component.d.ts.map
1004
+ }
1005
+
1006
+ declare module '@ably/ui/core/LegacyMeganav/MeganavSearchSuggestions' {
1135
1007
  import { AbsUrl } from "@ably/ui/core/LegacyMeganav";
1136
1008
  type MeganavSearchSuggestionsProps = {
1137
1009
  absUrl: AbsUrl;
@@ -1142,6 +1014,158 @@ export default MeganavSearchSuggestions;
1142
1014
  //# sourceMappingURL=MeganavSearchSuggestions.d.ts.map
1143
1015
  }
1144
1016
 
1017
+ declare module '@ably/ui/core/LegacyMeganav/SignOutLink' {
1018
+ import { MouseEventHandler, ReactNode } from "react";
1019
+ import { AbsUrl } from "@ably/ui/core/LegacyMeganav";
1020
+ type SignOutLinkProps = {
1021
+ token: string;
1022
+ href: string;
1023
+ text: string;
1024
+ children: ({ href, text, onClick, }: {
1025
+ href: string;
1026
+ text: string;
1027
+ onClick: MouseEventHandler<HTMLAnchorElement>;
1028
+ }) => ReactNode;
1029
+ absUrl: AbsUrl;
1030
+ };
1031
+ const SignOutLink: ({ token, href, text, children, absUrl, }: SignOutLinkProps) => import("react/jsx-runtime").JSX.Element;
1032
+ export default SignOutLink;
1033
+ //# sourceMappingURL=SignOutLink.d.ts.map
1034
+ }
1035
+
1036
+ declare module '@ably/ui/core/LegacyMeganav/component' {
1037
+ export default function Meganav({ themeName, addSearchApiKey }: {
1038
+ themeName: any;
1039
+ addSearchApiKey: any;
1040
+ }): () => void;
1041
+ //# sourceMappingURL=component.d.ts.map
1042
+ }
1043
+
1044
+ declare module '@ably/ui/core/LinkButton' {
1045
+ import React from "react";
1046
+ import { ButtonPropsBase } from "@ably/ui/core/Button";
1047
+ import { ColorClass, ColorThemeSet } from "@ably/ui/core/styles/colors/types";
1048
+ export type LinkButtonProps = ButtonPropsBase & {
1049
+ disabled?: boolean;
1050
+ onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
1051
+ iconColor?: ColorClass | ColorThemeSet;
1052
+ } & React.AnchorHTMLAttributes<HTMLAnchorElement>;
1053
+ const LinkButton: React.FC<LinkButtonProps>;
1054
+ export default LinkButton;
1055
+ //# sourceMappingURL=LinkButton.d.ts.map
1056
+ }
1057
+
1058
+ declare module '@ably/ui/core/Loader' {
1059
+ type LoaderProps = {
1060
+ size?: string;
1061
+ ringColor?: string;
1062
+ additionalCSS?: string;
1063
+ };
1064
+ const Loader: ({ ringColor, size, additionalCSS, }: LoaderProps) => import("react/jsx-runtime").JSX.Element;
1065
+ export default Loader;
1066
+ //# sourceMappingURL=Loader.d.ts.map
1067
+ }
1068
+
1069
+ declare module '@ably/ui/core/Logo' {
1070
+ import React from "react";
1071
+ type LogoProps = {
1072
+ dataId?: string;
1073
+ logoUrl?: string;
1074
+ logoAlt?: string;
1075
+ href?: string;
1076
+ additionalImgAttrs?: object;
1077
+ additionalLinkAttrs?: object;
1078
+ theme?: "light" | "dark";
1079
+ variant?: "default" | "mono";
1080
+ orientation?: "default" | "stacked";
1081
+ };
1082
+ const _default: React.MemoExoticComponent<({ dataId, href, additionalImgAttrs, additionalLinkAttrs, theme, variant, orientation, logoUrl, logoAlt, }: LogoProps) => import("react/jsx-runtime").JSX.Element>;
1083
+ export default _default;
1084
+ //# sourceMappingURL=Logo.d.ts.map
1085
+ }
1086
+
1087
+ declare module '@ably/ui/core/Meganav/MeganavMobile' {
1088
+ import { AccordionData } from ".@ably/ui/core/Accordion/types";
1089
+ export const MeganavMobile: ({ mobileNavItems, }: {
1090
+ mobileNavItems: AccordionData[];
1091
+ }) => import("react/jsx-runtime").JSX.Element;
1092
+ //# sourceMappingURL=MeganavMobile.d.ts.map
1093
+ }
1094
+
1095
+ declare module '@ably/ui/core/Meganav/MeganavPanel' {
1096
+ import React from "react";
1097
+ import { FlyoutPanelHighlight, FlyoutPanelList } from "@ably/ui/core/data";
1098
+ export const MeganavPanel: ({ displayProductTile, panelLeft, panelLeftClassName, panelRightHeading, panelRightItems, panelRightBottom, }: {
1099
+ displayProductTile?: boolean;
1100
+ panelLeft?: FlyoutPanelHighlight;
1101
+ panelLeftClassName?: string;
1102
+ panelRightHeading?: string;
1103
+ panelRightItems: FlyoutPanelList[];
1104
+ panelRightBottom?: React.ReactNode;
1105
+ }) => import("react/jsx-runtime").JSX.Element;
1106
+ //# sourceMappingURL=MeganavPanel.d.ts.map
1107
+ }
1108
+
1109
+ declare module '@ably/ui/core/Meganav/data' {
1110
+ import React from "react";
1111
+ import { IconName } from ".@ably/ui/core/Icon/types";
1112
+ export type FlyoutPanelList = {
1113
+ label: string;
1114
+ icon: IconName;
1115
+ link: string;
1116
+ isMobile?: boolean;
1117
+ };
1118
+ export type FlyoutPanelHighlight = {
1119
+ heading: string;
1120
+ content: string;
1121
+ labelLink: string;
1122
+ url: string;
1123
+ image: string;
1124
+ };
1125
+ export type MenuItem = {
1126
+ name: string;
1127
+ link?: string;
1128
+ isHiddenMobile?: boolean;
1129
+ content?: React.ReactNode;
1130
+ panelClassName?: string;
1131
+ };
1132
+ export const menuItemLinks: {
1133
+ name: string;
1134
+ link: string;
1135
+ isHiddenMobile: boolean;
1136
+ }[];
1137
+ export const menuItemsForHeader: MenuItem[];
1138
+ //# sourceMappingURL=data.d.ts.map
1139
+ }
1140
+
1141
+ declare module '@ably/ui/core/Meganav' {
1142
+ import { HeaderSessionState } from "@ably/ui/core/Header";
1143
+ export type MeganavNoticeBannerProps = {
1144
+ props: {
1145
+ title: string;
1146
+ bodyText: string;
1147
+ buttonLink: string;
1148
+ buttonLabel: string;
1149
+ closeBtn: boolean;
1150
+ };
1151
+ config: {
1152
+ cookieId: string;
1153
+ noticeId: string | number;
1154
+ options: {
1155
+ collapse: boolean;
1156
+ };
1157
+ };
1158
+ };
1159
+ export type MeganavProps = {
1160
+ sessionState: HeaderSessionState;
1161
+ searchDataId: string;
1162
+ notice?: MeganavNoticeBannerProps;
1163
+ };
1164
+ const Meganav: ({ sessionState, searchDataId, notice }: MeganavProps) => import("react/jsx-runtime").JSX.Element;
1165
+ export default Meganav;
1166
+ //# sourceMappingURL=Meganav.d.ts.map
1167
+ }
1168
+
1145
1169
  declare module '@ably/ui/core/Notice/component' {
1146
1170
  export const COLLAPSE_TRIGGER_DISTANCE: 5;
1147
1171
  export default Notice;
@@ -1358,25 +1382,6 @@ export default ProductTile;
1358
1382
  //# sourceMappingURL=ProductTile.d.ts.map
1359
1383
  }
1360
1384
 
1361
- declare module '@ably/ui/core/SignOutLink' {
1362
- import { MouseEventHandler, ReactNode } from "react";
1363
- import { AbsUrl } from "@ably/ui/core/LegacyMeganav";
1364
- type SignOutLinkProps = {
1365
- token: string;
1366
- href: string;
1367
- text: string;
1368
- children: ({ href, text, onClick, }: {
1369
- href: string;
1370
- text: string;
1371
- onClick: MouseEventHandler<HTMLAnchorElement>;
1372
- }) => ReactNode;
1373
- absUrl: AbsUrl;
1374
- };
1375
- const SignOutLink: ({ token, href, text, children, absUrl, }: SignOutLinkProps) => import("react/jsx-runtime").JSX.Element;
1376
- export default SignOutLink;
1377
- //# sourceMappingURL=SignOutLink.d.ts.map
1378
- }
1379
-
1380
1385
  declare module '@ably/ui/core/Slider' {
1381
1386
  import { ReactNode } from "react";
1382
1387
  interface SliderProps {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ably/ui",
3
- "version": "16.0.0-dev.937d7376",
3
+ "version": "16.0.0-dev.fc84d6ff",
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",
@@ -34,7 +34,7 @@
34
34
  "@types/svg-sprite": "^0.0.39",
35
35
  "@typescript-eslint/eslint-plugin": "^8.25.0",
36
36
  "@typescript-eslint/parser": "^8.25.0",
37
- "@vitejs/plugin-react": "^4.2.1",
37
+ "@vitejs/plugin-react-swc": "^3.8.0",
38
38
  "@whitespace/storybook-addon-html": "^6.1.1",
39
39
  "autoprefixer": "^10.0.2",
40
40
  "eslint": "^8.57.0",
@@ -43,6 +43,7 @@
43
43
  "eslint-plugin-storybook": "^0.11.4",
44
44
  "heroicons": "^2.2.0",
45
45
  "http-server": "14.1.1",
46
+ "jsdom": "^26.0.0",
46
47
  "mixpanel-browser": "^2.60.0",
47
48
  "msw": "2.7.1",
48
49
  "msw-storybook-addon": "^2.0.2",
@@ -56,7 +57,8 @@
56
57
  "tailwindcss": "^3.3.6",
57
58
  "ts-node": "^10.9.2",
58
59
  "typescript": "5.7.3",
59
- "vite": "^6.2.0"
60
+ "vite": "^6.2.0",
61
+ "vitest": "^3.0.8"
60
62
  },
61
63
  "scripts": {
62
64
  "build:prebuild": "rm -rf core reset && mkdir -p dist/core",
@@ -75,8 +77,10 @@
75
77
  "start": "vite --port 5000",
76
78
  "storybook": "yarn build && storybook dev -p 6006",
77
79
  "build-storybook": "yarn build && storybook build --quiet -o preview",
78
- "test": "npx concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"yarn build-storybook && yarn http-server preview --port 6007 --silent\" \"wait-on tcp:6007 && yarn test-storybook --url http://127.0.0.1:6007\"",
79
- "test:update-snapshots": "npx concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"yarn build-storybook && yarn http-server preview --port 6007 --silent\" \"wait-on tcp:6007 && yarn test-storybook -u --url http://127.0.0.1:6007\""
80
+ "test": "yarn test:storybook && yarn test:vitest",
81
+ "test:storybook": "npx concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"yarn build-storybook && yarn http-server preview --port 6007 --silent\" \"wait-on tcp:6007 && yarn test-storybook --url http://127.0.0.1:6007\"",
82
+ "test:update-snapshots": "npx concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"yarn build-storybook && yarn http-server preview --port 6007 --silent\" \"wait-on tcp:6007 && yarn test-storybook -u --url http://127.0.0.1:6007\"",
83
+ "test:vitest": "vitest --environment=jsdom --dir=src"
80
84
  },
81
85
  "dependencies": {
82
86
  "@radix-ui/react-accordion": "^1.2.1",
@@ -1,2 +0,0 @@
1
- import React,{useEffect,useState}from"react";import{connectState}from"./remote-data-store.js";import{selectSessionData}from"./remote-session-data.js";import Logo from"./Logo";import MeganavData from"./LegacyMeganav/component.json";import MeganavScripts from"./LegacyMeganav/component.js";import MeganavItemsDesktop from"./MeganavItemsDesktop";import MeganavItemsSignedIn from"./MeganavItemsSignedIn";import MeganavItemsMobile from"./MeganavItemsMobile";import Notice from"./Notice";import _absUrl from"./url-base.js";import MeganavContentProducts from"./MeganavContentProducts";import MeganavContentUseCases from"./MeganavContentUseCases";import MeganavContentCompany from"./MeganavContentCompany";import MeganavContentDevelopers from"./MeganavContentDevelopers";import MeganavSearch from"./MeganavSearch";const SignIn=({sessionState,theme,loginLink,absUrl,searchDataId})=>{return sessionState.signedIn?React.createElement(MeganavItemsSignedIn,{absUrl:absUrl,sessionState:sessionState,theme:theme,searchDataId:searchDataId}):React.createElement("ul",{className:"hidden md:flex items-center"},React.createElement("li",{className:"ui-meganav-item"},React.createElement("a",{href:absUrl("/contact"),className:`ui-meganav-link ${theme.textColor}`,"data-id":"meganav-link"},"Contact us")),React.createElement("li",{className:"ui-meganav-item"},React.createElement("a",{href:absUrl(loginLink),className:`ui-meganav-link mr-0 ${theme.textColor}`,"data-id":"meganav-link"},"Login")),React.createElement("li",{className:"ui-meganav-item"},React.createElement(MeganavSearch,{absUrl:absUrl,dataId:searchDataId})),React.createElement("li",{className:"ui-meganav-item"},React.createElement("a",{href:absUrl("/sign-up"),"data-id":"meganav-sign-up-btn",className:`ui-btn p-btn-small ${theme.buttonBackgroundColor} ${theme.buttonTextColor}`},"Sign up free")))};const SignInPlaceholder=()=>React.createElement("div",null);const panels={MeganavContentProducts,MeganavContentUseCases,MeganavContentCompany,MeganavContentDevelopers};const Meganav=({paths,themeName="white",notice,loginLink="/login",urlBase,addSearchApiKey,statusUrl,searchDataId})=>{const[sessionState,setSessionState]=useState();useEffect(()=>{connectState(selectSessionData,setSessionState)},[]);useEffect(()=>{const teardown=MeganavScripts({themeName,addSearchApiKey});return()=>teardown()},[sessionState]);const theme=MeganavData.themes[themeName];const absUrl=path=>_absUrl(path,urlBase);return React.createElement("nav",{className:`ui-meganav-wrapper ${theme.backgroundColor} ${theme.barShadow}`,"data-id":"meganav","aria-label":"Main"},notice&&React.createElement(Notice,{...notice.props,config:notice.config}),React.createElement("div",{className:"ui-meganav ui-grid-px"},React.createElement("div",{className:"mr-24"},React.createElement(Logo,{dataId:"meganav-logo",href:urlBase,logoUrl:paths?.logo})),React.createElement(MeganavItemsDesktop,{panels:panels,paths:paths,theme:theme,absUrl:absUrl,statusUrl:statusUrl}),sessionState?React.createElement(SignIn,{sessionState:sessionState,theme:theme,loginLink:loginLink,absUrl:absUrl,searchDataId:searchDataId}):React.createElement(SignInPlaceholder,null),React.createElement(MeganavItemsMobile,{panels:panels,sessionState:sessionState,paths:paths,theme:theme,loginLink:loginLink,absUrl:absUrl,statusUrl:statusUrl,searchDataId:searchDataId})))};export default Meganav;
2
- //# sourceMappingURL=LegacyMeganav.js.map