@opensite/ui 3.4.8 → 3.4.9

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.
@@ -738,10 +738,10 @@ var SubMenuLink = ({ item }) => {
738
738
  return /* @__PURE__ */ jsxRuntime.jsxs(
739
739
  pressable.Pressable,
740
740
  {
741
- className: "flex flex-row gap-4 rounded-md p-3 leading-none no-underline transition-colors outline-none select-none hover:bg-muted hover:text-foreground",
741
+ className: "flex flex-row items-center gap-4 rounded-md p-3 leading-none no-underline transition-colors outline-none select-none hover:bg-muted hover:text-foreground",
742
742
  href: item.url,
743
743
  children: [
744
- item.icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: item.icon, size: 20, className: "shrink-0" }) }),
744
+ item.icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex size-5 shrink-0 items-center justify-center text-muted-foreground", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: item.icon, size: 20, className: "shrink-0" }) }),
745
745
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
746
746
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-semibold", children: item.title }),
747
747
  item.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm leading-snug text-muted-foreground", children: item.description })
@@ -715,10 +715,10 @@ var SubMenuLink = ({ item }) => {
715
715
  return /* @__PURE__ */ jsxs(
716
716
  Pressable,
717
717
  {
718
- className: "flex flex-row gap-4 rounded-md p-3 leading-none no-underline transition-colors outline-none select-none hover:bg-muted hover:text-foreground",
718
+ className: "flex flex-row items-center gap-4 rounded-md p-3 leading-none no-underline transition-colors outline-none select-none hover:bg-muted hover:text-foreground",
719
719
  href: item.url,
720
720
  children: [
721
- item.icon && /* @__PURE__ */ jsx("div", { className: "text-muted-foreground", children: /* @__PURE__ */ jsx(DynamicIcon, { name: item.icon, size: 20, className: "shrink-0" }) }),
721
+ item.icon && /* @__PURE__ */ jsx("div", { className: "flex size-5 shrink-0 items-center justify-center text-muted-foreground", children: /* @__PURE__ */ jsx(DynamicIcon, { name: item.icon, size: 20, className: "shrink-0" }) }),
722
722
  /* @__PURE__ */ jsxs("div", { children: [
723
723
  /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold", children: item.title }),
724
724
  item.description && /* @__PURE__ */ jsx("p", { className: "text-sm leading-snug text-muted-foreground", children: item.description })
@@ -968,13 +968,14 @@ var MenuSubLink = ({ link }) => {
968
968
  href: link.url,
969
969
  className: "flex items-center gap-4 rounded-lg p-2 hover:bg-muted",
970
970
  children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full items-center justify-between", children: [
971
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2.5", children: [
971
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2.5", children: [
972
972
  /* @__PURE__ */ jsxRuntime.jsx(
973
973
  DynamicIcon,
974
974
  {
975
975
  name: link.icon || link.iconName,
976
976
  size: 20,
977
- color: link.iconColor
977
+ color: link.iconColor,
978
+ className: "shrink-0"
978
979
  }
979
980
  ),
980
981
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
@@ -945,13 +945,14 @@ var MenuSubLink = ({ link }) => {
945
945
  href: link.url,
946
946
  className: "flex items-center gap-4 rounded-lg p-2 hover:bg-muted",
947
947
  children: /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center justify-between", children: [
948
- /* @__PURE__ */ jsxs("div", { className: "flex gap-2.5", children: [
948
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5", children: [
949
949
  /* @__PURE__ */ jsx(
950
950
  DynamicIcon,
951
951
  {
952
952
  name: link.icon || link.iconName,
953
953
  size: 20,
954
- color: link.iconColor
954
+ color: link.iconColor,
955
+ className: "shrink-0"
955
956
  }
956
957
  ),
957
958
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
@@ -770,10 +770,10 @@ var SubMenuLink = ({
770
770
  return /* @__PURE__ */ jsxRuntime.jsxs(
771
771
  pressable.Pressable,
772
772
  {
773
- className: "flex min-w-80 flex-row gap-4 rounded-md p-3 leading-none no-underline transition-colors outline-none select-none hover:bg-muted",
773
+ className: "flex min-w-80 flex-row items-center gap-4 rounded-md p-3 leading-none no-underline transition-colors outline-none select-none hover:bg-muted",
774
774
  href: item.url,
775
775
  children: [
776
- item.icon && /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: item.icon, size: 20, className: "shrink-0" }) }),
776
+ item.icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex size-5 shrink-0 items-center justify-center text-muted-foreground", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: item.icon, size: 20, className: "shrink-0" }) }),
777
777
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
778
778
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-semibold", children: item.title }),
779
779
  item.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm leading-snug text-muted-foreground", children: item.description })
@@ -747,10 +747,10 @@ var SubMenuLink = ({
747
747
  return /* @__PURE__ */ jsxs(
748
748
  Pressable,
749
749
  {
750
- className: "flex min-w-80 flex-row gap-4 rounded-md p-3 leading-none no-underline transition-colors outline-none select-none hover:bg-muted",
750
+ className: "flex min-w-80 flex-row items-center gap-4 rounded-md p-3 leading-none no-underline transition-colors outline-none select-none hover:bg-muted",
751
751
  href: item.url,
752
752
  children: [
753
- item.icon && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(DynamicIcon, { name: item.icon, size: 20, className: "shrink-0" }) }),
753
+ item.icon && /* @__PURE__ */ jsx("div", { className: "flex size-5 shrink-0 items-center justify-center text-muted-foreground", children: /* @__PURE__ */ jsx(DynamicIcon, { name: item.icon, size: 20, className: "shrink-0" }) }),
754
754
  /* @__PURE__ */ jsxs("div", { children: [
755
755
  /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold", children: item.title }),
756
756
  item.description && /* @__PURE__ */ jsx("p", { className: "text-sm leading-snug text-muted-foreground", children: item.description })
@@ -768,17 +768,17 @@ var SolutionsMenu = ({
768
768
  platformItems,
769
769
  featuredHeroCard,
770
770
  optixFlowConfig
771
- }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid w-[1200px] grid-cols-2 gap-4", children: [
772
- featuredHeroCard && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-1", children: /* @__PURE__ */ jsxRuntime.jsxs(
771
+ }) => {
772
+ const featuredCard = featuredHeroCard ? /* @__PURE__ */ jsxRuntime.jsxs(
773
773
  pressable.Pressable,
774
774
  {
775
775
  href: featuredHeroCard.href,
776
776
  className: cn(
777
- "group flex h-full flex-col overflow-hidden rounded-lg text-primary-foreground",
777
+ "group flex h-full min-h-[420px] flex-col overflow-hidden rounded-lg text-primary-foreground",
778
778
  featuredHeroCard.variant === "accent" ? "bg-accent text-accent-foreground" : "bg-primary"
779
779
  ),
780
780
  children: [
781
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col justify-between p-5", children: [
781
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex shrink-0 flex-col justify-between p-5", children: [
782
782
  featuredHeroCard.subtitle && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mb-2 text-xs font-medium tracking-wider uppercase", children: featuredHeroCard.subtitle }),
783
783
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
784
784
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 text-base font-semibold", children: [
@@ -795,7 +795,7 @@ var SolutionsMenu = ({
795
795
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 text-sm leading-relaxed text-primary-foreground/85", children: featuredHeroCard.description })
796
796
  ] })
797
797
  ] }),
798
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative aspect-video w-full overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
798
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative min-h-0 flex-1 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
799
799
  img.Img,
800
800
  {
801
801
  src: featuredHeroCard.image,
@@ -806,35 +806,42 @@ var SolutionsMenu = ({
806
806
  ) })
807
807
  ]
808
808
  }
809
- ) }),
810
- platformItems.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-1", children: [
809
+ ) : null;
810
+ const platformSection = platformItems.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
811
811
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-3 text-left", children: /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "text-xs font-medium tracking-wider text-muted-foreground uppercase", children: "Developer Platform" }) }),
812
812
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 gap-2", children: platformItems.map((technology) => /* @__PURE__ */ jsxRuntime.jsxs(
813
813
  NavigationMenuLink,
814
814
  {
815
815
  href: technology.href,
816
- className: "group !flex !w-full items-center gap-2 rounded-lg p-2 hover:bg-muted",
816
+ className: "group !flex !w-full min-w-0 items-center gap-2 rounded-lg p-2 hover:bg-muted",
817
817
  children: [
818
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: technology.icon, size: 16, className: "shrink-0" }),
818
+ /* @__PURE__ */ jsxRuntime.jsx(
819
+ DynamicIcon,
820
+ {
821
+ name: technology.icon,
822
+ size: 16,
823
+ className: "shrink-0"
824
+ }
825
+ ),
819
826
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-1 text-sm font-medium", children: technology.title })
820
827
  ]
821
828
  },
822
829
  technology.id
823
830
  )) })
824
- ] }),
825
- solutionCards.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-2 mt-2 grid grid-cols-4 gap-3", children: solutionCards.map((solution) => /* @__PURE__ */ jsxRuntime.jsxs(
831
+ ] }) : null;
832
+ const solutionSection = solutionCards.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 gap-3", children: solutionCards.map((solution) => /* @__PURE__ */ jsxRuntime.jsxs(
826
833
  "div",
827
834
  {
828
- className: "col-span-1 flex w-full flex-col rounded-lg border border-border p-4",
835
+ className: "flex min-w-0 flex-col rounded-lg border border-border p-4",
829
836
  children: [
830
837
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-b border-border pb-3", children: /* @__PURE__ */ jsxRuntime.jsxs(
831
838
  pressable.Pressable,
832
839
  {
833
840
  href: solution.href,
834
- className: "group flex flex-col text-left",
841
+ className: "group flex min-w-0 flex-col text-left",
835
842
  children: [
836
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
837
- /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "text-sm font-medium", children: solution.title }),
843
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 items-center gap-1", children: [
844
+ /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "min-w-0 break-words text-sm font-medium", children: solution.title }),
838
845
  /* @__PURE__ */ jsxRuntime.jsx(
839
846
  DynamicIcon,
840
847
  {
@@ -844,7 +851,7 @@ var SolutionsMenu = ({
844
851
  }
845
852
  )
846
853
  ] }),
847
- /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: solution.description })
854
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 break-words text-xs text-muted-foreground", children: solution.description })
848
855
  ]
849
856
  }
850
857
  ) }),
@@ -852,10 +859,17 @@ var SolutionsMenu = ({
852
859
  NavigationMenuLink,
853
860
  {
854
861
  href: subpage.href,
855
- className: "group !flex !w-full items-center gap-2 rounded-lg p-2 text-left hover:bg-muted",
862
+ className: "group !flex !w-full min-w-0 items-center gap-2 rounded-lg p-2 text-left hover:bg-muted",
856
863
  children: [
857
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: subpage.icon, size: 14, className: "shrink-0" }),
858
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-1 text-sm font-medium", children: subpage.title })
864
+ /* @__PURE__ */ jsxRuntime.jsx(
865
+ DynamicIcon,
866
+ {
867
+ name: subpage.icon,
868
+ size: 14,
869
+ className: "shrink-0"
870
+ }
871
+ ),
872
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-1 break-words text-sm font-medium", children: subpage.title })
859
873
  ]
860
874
  },
861
875
  subpage.id
@@ -863,8 +877,69 @@ var SolutionsMenu = ({
863
877
  ]
864
878
  },
865
879
  solution.id
866
- )) })
867
- ] });
880
+ )) }) : null;
881
+ if (featuredCard) {
882
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid w-[1200px] max-w-[calc(100vw-4rem)] grid-cols-[minmax(380px,1fr)_minmax(360px,0.95fr)] gap-4", children: [
883
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0", children: featuredCard }),
884
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col gap-4", children: [
885
+ platformSection,
886
+ solutionSection
887
+ ] })
888
+ ] });
889
+ }
890
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid w-[1200px] max-w-[calc(100vw-4rem)] grid-cols-2 gap-4", children: [
891
+ platformSection,
892
+ solutionCards.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-2 grid grid-cols-4 gap-3", children: solutionCards.map((solution) => /* @__PURE__ */ jsxRuntime.jsxs(
893
+ "div",
894
+ {
895
+ className: "flex min-w-0 flex-col rounded-lg border border-border p-4",
896
+ children: [
897
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-b border-border pb-3", children: /* @__PURE__ */ jsxRuntime.jsxs(
898
+ pressable.Pressable,
899
+ {
900
+ href: solution.href,
901
+ className: "group flex min-w-0 flex-col text-left",
902
+ children: [
903
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 items-center gap-1", children: [
904
+ /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "min-w-0 break-words text-sm font-medium", children: solution.title }),
905
+ /* @__PURE__ */ jsxRuntime.jsx(
906
+ DynamicIcon,
907
+ {
908
+ name: "lucide/arrow-right",
909
+ size: 14,
910
+ className: "shrink-0 transition-transform group-hover:translate-x-1"
911
+ }
912
+ )
913
+ ] }),
914
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 break-words text-xs text-muted-foreground", children: solution.description })
915
+ ]
916
+ }
917
+ ) }),
918
+ /* @__PURE__ */ jsxRuntime.jsx("menu", { className: "mt-3 grid gap-2", children: solution.subpages.map((subpage) => /* @__PURE__ */ jsxRuntime.jsxs(
919
+ NavigationMenuLink,
920
+ {
921
+ href: subpage.href,
922
+ className: "group !flex !w-full min-w-0 items-center gap-2 rounded-lg p-2 text-left hover:bg-muted",
923
+ children: [
924
+ /* @__PURE__ */ jsxRuntime.jsx(
925
+ DynamicIcon,
926
+ {
927
+ name: subpage.icon,
928
+ size: 14,
929
+ className: "shrink-0"
930
+ }
931
+ ),
932
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-1 break-words text-sm font-medium", children: subpage.title })
933
+ ]
934
+ },
935
+ subpage.id
936
+ )) })
937
+ ]
938
+ },
939
+ solution.id
940
+ )) })
941
+ ] });
942
+ };
868
943
  var ProductsMenu = ({
869
944
  productCategories,
870
945
  featuredHeroCard,
@@ -1343,7 +1418,7 @@ var DesktopMenuItem = ({
1343
1418
  if (hasDropdown) {
1344
1419
  return /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenuItem, { value: `${index}`, children: [
1345
1420
  /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuTrigger, { className: "h-auto bg-transparent px-3 py-2 font-normal hover:bg-muted focus:bg-muted data-[state=open]:bg-muted/50", children: item.label }),
1346
- /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuContent, { className: "rounded-xl! border-0! p-4!", children: renderDropdownContent(
1421
+ /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuContent, { className: "max-h-[calc(100vh-6rem)] overflow-y-auto rounded-xl! border-0! p-4!", children: renderDropdownContent(
1347
1422
  { ...item, layout: effectiveLayout },
1348
1423
  optixFlowConfig
1349
1424
  ) })
@@ -745,17 +745,17 @@ var SolutionsMenu = ({
745
745
  platformItems,
746
746
  featuredHeroCard,
747
747
  optixFlowConfig
748
- }) => /* @__PURE__ */ jsxs("div", { className: "grid w-[1200px] grid-cols-2 gap-4", children: [
749
- featuredHeroCard && /* @__PURE__ */ jsx("div", { className: "col-span-1", children: /* @__PURE__ */ jsxs(
748
+ }) => {
749
+ const featuredCard = featuredHeroCard ? /* @__PURE__ */ jsxs(
750
750
  Pressable,
751
751
  {
752
752
  href: featuredHeroCard.href,
753
753
  className: cn(
754
- "group flex h-full flex-col overflow-hidden rounded-lg text-primary-foreground",
754
+ "group flex h-full min-h-[420px] flex-col overflow-hidden rounded-lg text-primary-foreground",
755
755
  featuredHeroCard.variant === "accent" ? "bg-accent text-accent-foreground" : "bg-primary"
756
756
  ),
757
757
  children: [
758
- /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col justify-between p-5", children: [
758
+ /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 flex-col justify-between p-5", children: [
759
759
  featuredHeroCard.subtitle && /* @__PURE__ */ jsx("span", { className: "mb-2 text-xs font-medium tracking-wider uppercase", children: featuredHeroCard.subtitle }),
760
760
  /* @__PURE__ */ jsxs("div", { children: [
761
761
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-base font-semibold", children: [
@@ -772,7 +772,7 @@ var SolutionsMenu = ({
772
772
  /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm leading-relaxed text-primary-foreground/85", children: featuredHeroCard.description })
773
773
  ] })
774
774
  ] }),
775
- /* @__PURE__ */ jsx("div", { className: "relative aspect-video w-full overflow-hidden", children: /* @__PURE__ */ jsx(
775
+ /* @__PURE__ */ jsx("div", { className: "relative min-h-0 flex-1 overflow-hidden", children: /* @__PURE__ */ jsx(
776
776
  Img,
777
777
  {
778
778
  src: featuredHeroCard.image,
@@ -783,35 +783,42 @@ var SolutionsMenu = ({
783
783
  ) })
784
784
  ]
785
785
  }
786
- ) }),
787
- platformItems.length > 0 && /* @__PURE__ */ jsxs("div", { className: "col-span-1", children: [
786
+ ) : null;
787
+ const platformSection = platformItems.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
788
788
  /* @__PURE__ */ jsx("div", { className: "mb-3 text-left", children: /* @__PURE__ */ jsx("strong", { className: "text-xs font-medium tracking-wider text-muted-foreground uppercase", children: "Developer Platform" }) }),
789
789
  /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-2", children: platformItems.map((technology) => /* @__PURE__ */ jsxs(
790
790
  NavigationMenuLink,
791
791
  {
792
792
  href: technology.href,
793
- className: "group !flex !w-full items-center gap-2 rounded-lg p-2 hover:bg-muted",
793
+ className: "group !flex !w-full min-w-0 items-center gap-2 rounded-lg p-2 hover:bg-muted",
794
794
  children: [
795
- /* @__PURE__ */ jsx(DynamicIcon, { name: technology.icon, size: 16, className: "shrink-0" }),
795
+ /* @__PURE__ */ jsx(
796
+ DynamicIcon,
797
+ {
798
+ name: technology.icon,
799
+ size: 16,
800
+ className: "shrink-0"
801
+ }
802
+ ),
796
803
  /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1 text-sm font-medium", children: technology.title })
797
804
  ]
798
805
  },
799
806
  technology.id
800
807
  )) })
801
- ] }),
802
- solutionCards.length > 0 && /* @__PURE__ */ jsx("div", { className: "col-span-2 mt-2 grid grid-cols-4 gap-3", children: solutionCards.map((solution) => /* @__PURE__ */ jsxs(
808
+ ] }) : null;
809
+ const solutionSection = solutionCards.length > 0 ? /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-3", children: solutionCards.map((solution) => /* @__PURE__ */ jsxs(
803
810
  "div",
804
811
  {
805
- className: "col-span-1 flex w-full flex-col rounded-lg border border-border p-4",
812
+ className: "flex min-w-0 flex-col rounded-lg border border-border p-4",
806
813
  children: [
807
814
  /* @__PURE__ */ jsx("div", { className: "border-b border-border pb-3", children: /* @__PURE__ */ jsxs(
808
815
  Pressable,
809
816
  {
810
817
  href: solution.href,
811
- className: "group flex flex-col text-left",
818
+ className: "group flex min-w-0 flex-col text-left",
812
819
  children: [
813
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
814
- /* @__PURE__ */ jsx("strong", { className: "text-sm font-medium", children: solution.title }),
820
+ /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-1", children: [
821
+ /* @__PURE__ */ jsx("strong", { className: "min-w-0 break-words text-sm font-medium", children: solution.title }),
815
822
  /* @__PURE__ */ jsx(
816
823
  DynamicIcon,
817
824
  {
@@ -821,7 +828,7 @@ var SolutionsMenu = ({
821
828
  }
822
829
  )
823
830
  ] }),
824
- /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: solution.description })
831
+ /* @__PURE__ */ jsx("p", { className: "mt-1 break-words text-xs text-muted-foreground", children: solution.description })
825
832
  ]
826
833
  }
827
834
  ) }),
@@ -829,10 +836,17 @@ var SolutionsMenu = ({
829
836
  NavigationMenuLink,
830
837
  {
831
838
  href: subpage.href,
832
- className: "group !flex !w-full items-center gap-2 rounded-lg p-2 text-left hover:bg-muted",
839
+ className: "group !flex !w-full min-w-0 items-center gap-2 rounded-lg p-2 text-left hover:bg-muted",
833
840
  children: [
834
- /* @__PURE__ */ jsx(DynamicIcon, { name: subpage.icon, size: 14, className: "shrink-0" }),
835
- /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1 text-sm font-medium", children: subpage.title })
841
+ /* @__PURE__ */ jsx(
842
+ DynamicIcon,
843
+ {
844
+ name: subpage.icon,
845
+ size: 14,
846
+ className: "shrink-0"
847
+ }
848
+ ),
849
+ /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1 break-words text-sm font-medium", children: subpage.title })
836
850
  ]
837
851
  },
838
852
  subpage.id
@@ -840,8 +854,69 @@ var SolutionsMenu = ({
840
854
  ]
841
855
  },
842
856
  solution.id
843
- )) })
844
- ] });
857
+ )) }) : null;
858
+ if (featuredCard) {
859
+ return /* @__PURE__ */ jsxs("div", { className: "grid w-[1200px] max-w-[calc(100vw-4rem)] grid-cols-[minmax(380px,1fr)_minmax(360px,0.95fr)] gap-4", children: [
860
+ /* @__PURE__ */ jsx("div", { className: "min-w-0", children: featuredCard }),
861
+ /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-4", children: [
862
+ platformSection,
863
+ solutionSection
864
+ ] })
865
+ ] });
866
+ }
867
+ return /* @__PURE__ */ jsxs("div", { className: "grid w-[1200px] max-w-[calc(100vw-4rem)] grid-cols-2 gap-4", children: [
868
+ platformSection,
869
+ solutionCards.length > 0 && /* @__PURE__ */ jsx("div", { className: "col-span-2 grid grid-cols-4 gap-3", children: solutionCards.map((solution) => /* @__PURE__ */ jsxs(
870
+ "div",
871
+ {
872
+ className: "flex min-w-0 flex-col rounded-lg border border-border p-4",
873
+ children: [
874
+ /* @__PURE__ */ jsx("div", { className: "border-b border-border pb-3", children: /* @__PURE__ */ jsxs(
875
+ Pressable,
876
+ {
877
+ href: solution.href,
878
+ className: "group flex min-w-0 flex-col text-left",
879
+ children: [
880
+ /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-1", children: [
881
+ /* @__PURE__ */ jsx("strong", { className: "min-w-0 break-words text-sm font-medium", children: solution.title }),
882
+ /* @__PURE__ */ jsx(
883
+ DynamicIcon,
884
+ {
885
+ name: "lucide/arrow-right",
886
+ size: 14,
887
+ className: "shrink-0 transition-transform group-hover:translate-x-1"
888
+ }
889
+ )
890
+ ] }),
891
+ /* @__PURE__ */ jsx("p", { className: "mt-1 break-words text-xs text-muted-foreground", children: solution.description })
892
+ ]
893
+ }
894
+ ) }),
895
+ /* @__PURE__ */ jsx("menu", { className: "mt-3 grid gap-2", children: solution.subpages.map((subpage) => /* @__PURE__ */ jsxs(
896
+ NavigationMenuLink,
897
+ {
898
+ href: subpage.href,
899
+ className: "group !flex !w-full min-w-0 items-center gap-2 rounded-lg p-2 text-left hover:bg-muted",
900
+ children: [
901
+ /* @__PURE__ */ jsx(
902
+ DynamicIcon,
903
+ {
904
+ name: subpage.icon,
905
+ size: 14,
906
+ className: "shrink-0"
907
+ }
908
+ ),
909
+ /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1 break-words text-sm font-medium", children: subpage.title })
910
+ ]
911
+ },
912
+ subpage.id
913
+ )) })
914
+ ]
915
+ },
916
+ solution.id
917
+ )) })
918
+ ] });
919
+ };
845
920
  var ProductsMenu = ({
846
921
  productCategories,
847
922
  featuredHeroCard,
@@ -1320,7 +1395,7 @@ var DesktopMenuItem = ({
1320
1395
  if (hasDropdown) {
1321
1396
  return /* @__PURE__ */ jsxs(NavigationMenuItem, { value: `${index}`, children: [
1322
1397
  /* @__PURE__ */ jsx(NavigationMenuTrigger, { className: "h-auto bg-transparent px-3 py-2 font-normal hover:bg-muted focus:bg-muted data-[state=open]:bg-muted/50", children: item.label }),
1323
- /* @__PURE__ */ jsx(NavigationMenuContent, { className: "rounded-xl! border-0! p-4!", children: renderDropdownContent(
1398
+ /* @__PURE__ */ jsx(NavigationMenuContent, { className: "max-h-[calc(100vh-6rem)] overflow-y-auto rounded-xl! border-0! p-4!", children: renderDropdownContent(
1324
1399
  { ...item, layout: effectiveLayout },
1325
1400
  optixFlowConfig
1326
1401
  ) })