@opensite/ui 1.0.3 → 1.0.5

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 (47) hide show
  1. package/dist/navbar-animated-preview.cjs +67 -82
  2. package/dist/navbar-animated-preview.js +67 -81
  3. package/dist/navbar-centered-menu.cjs +101 -125
  4. package/dist/navbar-centered-menu.js +101 -124
  5. package/dist/navbar-dark-icons.cjs +67 -81
  6. package/dist/navbar-dark-icons.js +67 -80
  7. package/dist/navbar-dropdown-menu.cjs +87 -122
  8. package/dist/navbar-dropdown-menu.js +87 -121
  9. package/dist/navbar-education-platform.cjs +1 -1
  10. package/dist/navbar-education-platform.js +1 -1
  11. package/dist/navbar-enterprise-mega.cjs +7 -7
  12. package/dist/navbar-enterprise-mega.js +7 -7
  13. package/dist/navbar-feature-grid.cjs +131 -150
  14. package/dist/navbar-feature-grid.d.cts +9 -1
  15. package/dist/navbar-feature-grid.d.ts +9 -1
  16. package/dist/navbar-feature-grid.js +131 -149
  17. package/dist/navbar-floating-pill.cjs +2 -2
  18. package/dist/navbar-floating-pill.js +2 -2
  19. package/dist/navbar-fullscreen-menu.cjs +1 -1
  20. package/dist/navbar-fullscreen-menu.js +1 -1
  21. package/dist/navbar-icon-links.cjs +102 -138
  22. package/dist/navbar-icon-links.js +102 -137
  23. package/dist/navbar-image-preview.cjs +64 -95
  24. package/dist/navbar-image-preview.js +64 -94
  25. package/dist/navbar-mega-menu.cjs +1 -1
  26. package/dist/navbar-mega-menu.js +1 -1
  27. package/dist/navbar-multi-column-groups.cjs +67 -81
  28. package/dist/navbar-multi-column-groups.js +67 -80
  29. package/dist/navbar-platform-resources.cjs +80 -42
  30. package/dist/navbar-platform-resources.js +80 -42
  31. package/dist/navbar-search-focused.cjs +76 -93
  32. package/dist/navbar-search-focused.js +76 -92
  33. package/dist/navbar-sidebar-mobile.cjs +76 -93
  34. package/dist/navbar-sidebar-mobile.js +76 -92
  35. package/dist/navbar-simple-links.cjs +1 -1
  36. package/dist/navbar-simple-links.js +1 -1
  37. package/dist/navbar-split-cta.cjs +78 -95
  38. package/dist/navbar-split-cta.js +78 -94
  39. package/dist/navbar-sticky-compact.cjs +82 -100
  40. package/dist/navbar-sticky-compact.js +82 -99
  41. package/dist/navbar-tabbed-sections.cjs +91 -115
  42. package/dist/navbar-tabbed-sections.js +91 -114
  43. package/dist/navbar-transparent-overlay.cjs +1 -1
  44. package/dist/navbar-transparent-overlay.js +1 -1
  45. package/dist/registry.cjs +594 -618
  46. package/dist/registry.js +593 -617
  47. package/package.json +1 -1
@@ -8,7 +8,6 @@ var classVarianceAuthority = require('class-variance-authority');
8
8
  var jsxRuntime = require('react/jsx-runtime');
9
9
  var AccordionPrimitive = require('@radix-ui/react-accordion');
10
10
  var NavigationMenuPrimitive = require('@radix-ui/react-navigation-menu');
11
- var SheetPrimitive = require('@radix-ui/react-dialog');
12
11
  var img = require('@page-speed/img');
13
12
 
14
13
  function _interopNamespace(e) {
@@ -32,7 +31,6 @@ function _interopNamespace(e) {
32
31
  var React__namespace = /*#__PURE__*/_interopNamespace(React);
33
32
  var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrimitive);
34
33
  var NavigationMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(NavigationMenuPrimitive);
35
- var SheetPrimitive__namespace = /*#__PURE__*/_interopNamespace(SheetPrimitive);
36
34
 
37
35
  // components/blocks/navbars/navbar-dropdown-menu.tsx
38
36
  function cn(...inputs) {
@@ -828,14 +826,14 @@ function PatternBackground({
828
826
  );
829
827
  }
830
828
  if (pattern in patternOverlays) {
831
- const Overlay2 = patternOverlays[pattern];
829
+ const Overlay = patternOverlays[pattern];
832
830
  return /* @__PURE__ */ jsxRuntime.jsx(
833
831
  "div",
834
832
  {
835
833
  className: cn("pointer-events-none absolute inset-0 z-0", className),
836
834
  style: { opacity, ...style },
837
835
  "aria-hidden": "true",
838
- children: Overlay2()
836
+ children: Overlay()
839
837
  }
840
838
  );
841
839
  }
@@ -1134,90 +1132,62 @@ function NavigationMenuLink({
1134
1132
  }
1135
1133
  );
1136
1134
  }
1137
- function Sheet({ ...props }) {
1138
- return /* @__PURE__ */ jsxRuntime.jsx(SheetPrimitive__namespace.Root, { "data-slot": "sheet", ...props });
1139
- }
1140
- function SheetTrigger({
1141
- ...props
1142
- }) {
1143
- return /* @__PURE__ */ jsxRuntime.jsx(SheetPrimitive__namespace.Trigger, { "data-slot": "sheet-trigger", ...props });
1144
- }
1145
- function SheetPortal({
1146
- ...props
1147
- }) {
1148
- return /* @__PURE__ */ jsxRuntime.jsx(SheetPrimitive__namespace.Portal, { "data-slot": "sheet-portal", ...props });
1149
- }
1150
- function SheetOverlay({
1135
+ var NavbarMobileMenu = ({
1136
+ open,
1137
+ onClose,
1138
+ children,
1151
1139
  className,
1152
- ...props
1153
- }) {
1154
- return /* @__PURE__ */ jsxRuntime.jsx(
1155
- SheetPrimitive__namespace.Overlay,
1140
+ contentClassName,
1141
+ title = "Mobile Navigation"
1142
+ }) => {
1143
+ React__namespace.useEffect(() => {
1144
+ if (open) {
1145
+ const originalOverflow = document.body.style.overflow;
1146
+ document.body.style.overflow = "hidden";
1147
+ return () => {
1148
+ document.body.style.overflow = originalOverflow;
1149
+ };
1150
+ }
1151
+ }, [open]);
1152
+ if (!open) return null;
1153
+ return /* @__PURE__ */ jsxRuntime.jsxs(
1154
+ "div",
1156
1155
  {
1157
- "data-slot": "sheet-overlay",
1158
1156
  className: cn(
1159
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
1157
+ "fixed inset-0 z-[998] flex flex-col bg-background",
1158
+ "animate-in slide-in-from-top duration-300",
1159
+ "data-[state=closed]:animate-out data-[state=closed]:slide-out-to-top data-[state=closed]:duration-300",
1160
1160
  className
1161
1161
  ),
1162
- ...props
1163
- }
1164
- );
1165
- }
1166
- function SheetContent({
1167
- className,
1168
- children,
1169
- side = "right",
1170
- ...props
1171
- }) {
1172
- return /* @__PURE__ */ jsxRuntime.jsxs(SheetPortal, { children: [
1173
- /* @__PURE__ */ jsxRuntime.jsx(SheetOverlay, {}),
1174
- /* @__PURE__ */ jsxRuntime.jsxs(
1175
- SheetPrimitive__namespace.Content,
1176
- {
1177
- "data-slot": "sheet-content",
1178
- className: cn(
1179
- "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
1180
- side === "right" && "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm",
1181
- side === "left" && "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm",
1182
- side === "top" && "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b",
1183
- side === "bottom" && "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t",
1184
- className
1185
- ),
1186
- ...props,
1187
- children: [
1188
- children,
1189
- /* @__PURE__ */ jsxRuntime.jsxs(SheetPrimitive__namespace.Close, { className: "ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none", children: [
1190
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1191
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1192
- ] })
1193
- ]
1194
- }
1195
- )
1196
- ] });
1197
- }
1198
- function SheetHeader({ className, ...props }) {
1199
- return /* @__PURE__ */ jsxRuntime.jsx(
1200
- "div",
1201
- {
1202
- "data-slot": "sheet-header",
1203
- className: cn("flex flex-col gap-1.5 p-4", className),
1204
- ...props
1205
- }
1206
- );
1207
- }
1208
- function SheetTitle({
1209
- className,
1210
- ...props
1211
- }) {
1212
- return /* @__PURE__ */ jsxRuntime.jsx(
1213
- SheetPrimitive__namespace.Title,
1214
- {
1215
- "data-slot": "sheet-title",
1216
- className: cn("text-foreground font-semibold", className),
1217
- ...props
1162
+ "data-state": open ? "open" : "closed",
1163
+ children: [
1164
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsxRuntime.jsx("h2", { children: title }) }),
1165
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-4 right-4 z-10", children: /* @__PURE__ */ jsxRuntime.jsxs(
1166
+ "button",
1167
+ {
1168
+ onClick: onClose,
1169
+ className: "flex size-10 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
1170
+ "aria-label": "Close mobile menu",
1171
+ children: [
1172
+ /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1173
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1174
+ ]
1175
+ }
1176
+ ) }),
1177
+ /* @__PURE__ */ jsxRuntime.jsx(
1178
+ "div",
1179
+ {
1180
+ className: cn(
1181
+ "h-full overflow-y-auto pt-20 pb-8 px-4 sm:px-6",
1182
+ contentClassName
1183
+ ),
1184
+ children
1185
+ }
1186
+ )
1187
+ ]
1218
1188
  }
1219
1189
  );
1220
- }
1190
+ };
1221
1191
  var NavbarLogo = ({
1222
1192
  logo,
1223
1193
  logoSlot,
@@ -1294,7 +1264,7 @@ function getNavbarLayoutClasses(layoutVariant = "fullScreenContainerizedLinks",
1294
1264
  // Outer container wrapper (only for floating bar - this containerizes the entire navbar)
1295
1265
  containerWrapperClasses: cn(
1296
1266
  "w-full",
1297
- isFloatingBar && "mx-auto w-full px-2 sm:px-4 lg:px-8 max-w-7xl relative z-10"
1267
+ isFloatingBar && "mx-auto container relative z-10 px-0 sm:px-0 lg:px-0"
1298
1268
  ),
1299
1269
  // Inner container classes (only for fullScreenContainerizedLinks - this containerizes the content inside the navbar)
1300
1270
  innerContainerClasses: cn(
@@ -1387,6 +1357,7 @@ var NavbarDropdownMenu = ({
1387
1357
  patternOpacity,
1388
1358
  optixFlowConfig
1389
1359
  }) => {
1360
+ const [open, setOpen] = React__namespace.useState(false);
1390
1361
  const renderAuthActions = React.useMemo(() => {
1391
1362
  if (authActionsSlot) return authActionsSlot;
1392
1363
  if (!authActions || authActions.length === 0) return null;
@@ -1479,49 +1450,43 @@ var NavbarDropdownMenu = ({
1479
1450
  optixFlowConfig
1480
1451
  }
1481
1452
  ),
1482
- /* @__PURE__ */ jsxRuntime.jsxs(Sheet, { children: [
1483
- /* @__PURE__ */ jsxRuntime.jsx(SheetTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
1484
- Pressable,
1485
- {
1486
- variant: "outline",
1487
- size: "icon",
1488
- asButton: true,
1489
- onClick: () => {
1490
- },
1491
- children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/menu", size: 16 })
1492
- }
1493
- ) }),
1494
- /* @__PURE__ */ jsxRuntime.jsxs(SheetContent, { className: "overflow-y-auto", children: [
1495
- /* @__PURE__ */ jsxRuntime.jsx(SheetHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(SheetTitle, { children: /* @__PURE__ */ jsxRuntime.jsx(
1496
- NavbarLogo,
1453
+ /* @__PURE__ */ jsxRuntime.jsx(
1454
+ Pressable,
1455
+ {
1456
+ variant: "outline",
1457
+ size: "icon",
1458
+ asButton: true,
1459
+ onClick: () => setOpen(!open),
1460
+ children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/menu", size: 16 })
1461
+ }
1462
+ )
1463
+ ] }) }),
1464
+ /* @__PURE__ */ jsxRuntime.jsx(
1465
+ NavbarMobileMenu,
1466
+ {
1467
+ open,
1468
+ onClose: () => setOpen(false),
1469
+ title: "Mobile Navigation",
1470
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-screen-sm mx-auto", children: [
1471
+ /* @__PURE__ */ jsxRuntime.jsx(
1472
+ Accordion,
1497
1473
  {
1498
- logo,
1499
- logoSlot,
1500
- logoClassName,
1501
- optixFlowConfig
1474
+ type: "single",
1475
+ collapsible: true,
1476
+ className: "flex w-full flex-col gap-4",
1477
+ children: renderMobileMenu
1502
1478
  }
1503
- ) }) }),
1504
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6 p-4", children: [
1505
- /* @__PURE__ */ jsxRuntime.jsx(
1506
- Accordion,
1507
- {
1508
- type: "single",
1509
- collapsible: true,
1510
- className: "flex w-full flex-col gap-4",
1511
- children: renderMobileMenu
1512
- }
1513
- ),
1514
- /* @__PURE__ */ jsxRuntime.jsx(
1515
- "div",
1516
- {
1517
- className: cn("flex flex-col gap-3", actionsClassName),
1518
- children: renderAuthActions
1519
- }
1520
- )
1521
- ] })
1479
+ ),
1480
+ /* @__PURE__ */ jsxRuntime.jsx(
1481
+ "div",
1482
+ {
1483
+ className: cn("mt-6 flex flex-col gap-3", actionsClassName),
1484
+ children: renderAuthActions
1485
+ }
1486
+ )
1522
1487
  ] })
1523
- ] })
1524
- ] }) })
1488
+ }
1489
+ )
1525
1490
  ] }) }) })
1526
1491
  }
1527
1492
  );
@@ -7,7 +7,6 @@ import { cva } from 'class-variance-authority';
7
7
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
8
8
  import * as AccordionPrimitive from '@radix-ui/react-accordion';
9
9
  import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
10
- import * as SheetPrimitive from '@radix-ui/react-dialog';
11
10
  import { Img } from '@page-speed/img';
12
11
 
13
12
  // components/blocks/navbars/navbar-dropdown-menu.tsx
@@ -804,14 +803,14 @@ function PatternBackground({
804
803
  );
805
804
  }
806
805
  if (pattern in patternOverlays) {
807
- const Overlay2 = patternOverlays[pattern];
806
+ const Overlay = patternOverlays[pattern];
808
807
  return /* @__PURE__ */ jsx(
809
808
  "div",
810
809
  {
811
810
  className: cn("pointer-events-none absolute inset-0 z-0", className),
812
811
  style: { opacity, ...style },
813
812
  "aria-hidden": "true",
814
- children: Overlay2()
813
+ children: Overlay()
815
814
  }
816
815
  );
817
816
  }
@@ -1110,90 +1109,62 @@ function NavigationMenuLink({
1110
1109
  }
1111
1110
  );
1112
1111
  }
1113
- function Sheet({ ...props }) {
1114
- return /* @__PURE__ */ jsx(SheetPrimitive.Root, { "data-slot": "sheet", ...props });
1115
- }
1116
- function SheetTrigger({
1117
- ...props
1118
- }) {
1119
- return /* @__PURE__ */ jsx(SheetPrimitive.Trigger, { "data-slot": "sheet-trigger", ...props });
1120
- }
1121
- function SheetPortal({
1122
- ...props
1123
- }) {
1124
- return /* @__PURE__ */ jsx(SheetPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
1125
- }
1126
- function SheetOverlay({
1112
+ var NavbarMobileMenu = ({
1113
+ open,
1114
+ onClose,
1115
+ children,
1127
1116
  className,
1128
- ...props
1129
- }) {
1130
- return /* @__PURE__ */ jsx(
1131
- SheetPrimitive.Overlay,
1117
+ contentClassName,
1118
+ title = "Mobile Navigation"
1119
+ }) => {
1120
+ React.useEffect(() => {
1121
+ if (open) {
1122
+ const originalOverflow = document.body.style.overflow;
1123
+ document.body.style.overflow = "hidden";
1124
+ return () => {
1125
+ document.body.style.overflow = originalOverflow;
1126
+ };
1127
+ }
1128
+ }, [open]);
1129
+ if (!open) return null;
1130
+ return /* @__PURE__ */ jsxs(
1131
+ "div",
1132
1132
  {
1133
- "data-slot": "sheet-overlay",
1134
1133
  className: cn(
1135
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
1134
+ "fixed inset-0 z-[998] flex flex-col bg-background",
1135
+ "animate-in slide-in-from-top duration-300",
1136
+ "data-[state=closed]:animate-out data-[state=closed]:slide-out-to-top data-[state=closed]:duration-300",
1136
1137
  className
1137
1138
  ),
1138
- ...props
1139
- }
1140
- );
1141
- }
1142
- function SheetContent({
1143
- className,
1144
- children,
1145
- side = "right",
1146
- ...props
1147
- }) {
1148
- return /* @__PURE__ */ jsxs(SheetPortal, { children: [
1149
- /* @__PURE__ */ jsx(SheetOverlay, {}),
1150
- /* @__PURE__ */ jsxs(
1151
- SheetPrimitive.Content,
1152
- {
1153
- "data-slot": "sheet-content",
1154
- className: cn(
1155
- "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
1156
- side === "right" && "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm",
1157
- side === "left" && "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm",
1158
- side === "top" && "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b",
1159
- side === "bottom" && "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t",
1160
- className
1161
- ),
1162
- ...props,
1163
- children: [
1164
- children,
1165
- /* @__PURE__ */ jsxs(SheetPrimitive.Close, { className: "ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none", children: [
1166
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1167
- /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1168
- ] })
1169
- ]
1170
- }
1171
- )
1172
- ] });
1173
- }
1174
- function SheetHeader({ className, ...props }) {
1175
- return /* @__PURE__ */ jsx(
1176
- "div",
1177
- {
1178
- "data-slot": "sheet-header",
1179
- className: cn("flex flex-col gap-1.5 p-4", className),
1180
- ...props
1181
- }
1182
- );
1183
- }
1184
- function SheetTitle({
1185
- className,
1186
- ...props
1187
- }) {
1188
- return /* @__PURE__ */ jsx(
1189
- SheetPrimitive.Title,
1190
- {
1191
- "data-slot": "sheet-title",
1192
- className: cn("text-foreground font-semibold", className),
1193
- ...props
1139
+ "data-state": open ? "open" : "closed",
1140
+ children: [
1141
+ /* @__PURE__ */ jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsx("h2", { children: title }) }),
1142
+ /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-4 z-10", children: /* @__PURE__ */ jsxs(
1143
+ "button",
1144
+ {
1145
+ onClick: onClose,
1146
+ className: "flex size-10 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
1147
+ "aria-label": "Close mobile menu",
1148
+ children: [
1149
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1150
+ /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1151
+ ]
1152
+ }
1153
+ ) }),
1154
+ /* @__PURE__ */ jsx(
1155
+ "div",
1156
+ {
1157
+ className: cn(
1158
+ "h-full overflow-y-auto pt-20 pb-8 px-4 sm:px-6",
1159
+ contentClassName
1160
+ ),
1161
+ children
1162
+ }
1163
+ )
1164
+ ]
1194
1165
  }
1195
1166
  );
1196
- }
1167
+ };
1197
1168
  var NavbarLogo = ({
1198
1169
  logo,
1199
1170
  logoSlot,
@@ -1270,7 +1241,7 @@ function getNavbarLayoutClasses(layoutVariant = "fullScreenContainerizedLinks",
1270
1241
  // Outer container wrapper (only for floating bar - this containerizes the entire navbar)
1271
1242
  containerWrapperClasses: cn(
1272
1243
  "w-full",
1273
- isFloatingBar && "mx-auto w-full px-2 sm:px-4 lg:px-8 max-w-7xl relative z-10"
1244
+ isFloatingBar && "mx-auto container relative z-10 px-0 sm:px-0 lg:px-0"
1274
1245
  ),
1275
1246
  // Inner container classes (only for fullScreenContainerizedLinks - this containerizes the content inside the navbar)
1276
1247
  innerContainerClasses: cn(
@@ -1363,6 +1334,7 @@ var NavbarDropdownMenu = ({
1363
1334
  patternOpacity,
1364
1335
  optixFlowConfig
1365
1336
  }) => {
1337
+ const [open, setOpen] = React.useState(false);
1366
1338
  const renderAuthActions = useMemo(() => {
1367
1339
  if (authActionsSlot) return authActionsSlot;
1368
1340
  if (!authActions || authActions.length === 0) return null;
@@ -1455,49 +1427,43 @@ var NavbarDropdownMenu = ({
1455
1427
  optixFlowConfig
1456
1428
  }
1457
1429
  ),
1458
- /* @__PURE__ */ jsxs(Sheet, { children: [
1459
- /* @__PURE__ */ jsx(SheetTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
1460
- Pressable,
1461
- {
1462
- variant: "outline",
1463
- size: "icon",
1464
- asButton: true,
1465
- onClick: () => {
1466
- },
1467
- children: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/menu", size: 16 })
1468
- }
1469
- ) }),
1470
- /* @__PURE__ */ jsxs(SheetContent, { className: "overflow-y-auto", children: [
1471
- /* @__PURE__ */ jsx(SheetHeader, { children: /* @__PURE__ */ jsx(SheetTitle, { children: /* @__PURE__ */ jsx(
1472
- NavbarLogo,
1430
+ /* @__PURE__ */ jsx(
1431
+ Pressable,
1432
+ {
1433
+ variant: "outline",
1434
+ size: "icon",
1435
+ asButton: true,
1436
+ onClick: () => setOpen(!open),
1437
+ children: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/menu", size: 16 })
1438
+ }
1439
+ )
1440
+ ] }) }),
1441
+ /* @__PURE__ */ jsx(
1442
+ NavbarMobileMenu,
1443
+ {
1444
+ open,
1445
+ onClose: () => setOpen(false),
1446
+ title: "Mobile Navigation",
1447
+ children: /* @__PURE__ */ jsxs("div", { className: "max-w-screen-sm mx-auto", children: [
1448
+ /* @__PURE__ */ jsx(
1449
+ Accordion,
1473
1450
  {
1474
- logo,
1475
- logoSlot,
1476
- logoClassName,
1477
- optixFlowConfig
1451
+ type: "single",
1452
+ collapsible: true,
1453
+ className: "flex w-full flex-col gap-4",
1454
+ children: renderMobileMenu
1478
1455
  }
1479
- ) }) }),
1480
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6 p-4", children: [
1481
- /* @__PURE__ */ jsx(
1482
- Accordion,
1483
- {
1484
- type: "single",
1485
- collapsible: true,
1486
- className: "flex w-full flex-col gap-4",
1487
- children: renderMobileMenu
1488
- }
1489
- ),
1490
- /* @__PURE__ */ jsx(
1491
- "div",
1492
- {
1493
- className: cn("flex flex-col gap-3", actionsClassName),
1494
- children: renderAuthActions
1495
- }
1496
- )
1497
- ] })
1456
+ ),
1457
+ /* @__PURE__ */ jsx(
1458
+ "div",
1459
+ {
1460
+ className: cn("mt-6 flex flex-col gap-3", actionsClassName),
1461
+ children: renderAuthActions
1462
+ }
1463
+ )
1498
1464
  ] })
1499
- ] })
1500
- ] }) })
1465
+ }
1466
+ )
1501
1467
  ] }) }) })
1502
1468
  }
1503
1469
  );
@@ -1230,7 +1230,7 @@ function getNavbarLayoutClasses(layoutVariant = "fullScreenContainerizedLinks",
1230
1230
  // Outer container wrapper (only for floating bar - this containerizes the entire navbar)
1231
1231
  containerWrapperClasses: cn(
1232
1232
  "w-full",
1233
- isFloatingBar && "mx-auto w-full px-2 sm:px-4 lg:px-8 max-w-7xl relative z-10"
1233
+ isFloatingBar && "mx-auto container relative z-10 px-0 sm:px-0 lg:px-0"
1234
1234
  ),
1235
1235
  // Inner container classes (only for fullScreenContainerizedLinks - this containerizes the content inside the navbar)
1236
1236
  innerContainerClasses: cn(
@@ -1206,7 +1206,7 @@ function getNavbarLayoutClasses(layoutVariant = "fullScreenContainerizedLinks",
1206
1206
  // Outer container wrapper (only for floating bar - this containerizes the entire navbar)
1207
1207
  containerWrapperClasses: cn(
1208
1208
  "w-full",
1209
- isFloatingBar && "mx-auto w-full px-2 sm:px-4 lg:px-8 max-w-7xl relative z-10"
1209
+ isFloatingBar && "mx-auto container relative z-10 px-0 sm:px-0 lg:px-0"
1210
1210
  ),
1211
1211
  // Inner container classes (only for fullScreenContainerizedLinks - this containerizes the content inside the navbar)
1212
1212
  innerContainerClasses: cn(
@@ -1178,7 +1178,7 @@ var NavbarMobileMenu = ({
1178
1178
  "div",
1179
1179
  {
1180
1180
  className: cn(
1181
- "h-full overflow-y-auto pt-16 pb-8 px-4 sm:px-6",
1181
+ "h-full overflow-y-auto pt-20 pb-8 px-4 sm:px-6",
1182
1182
  contentClassName
1183
1183
  ),
1184
1184
  children
@@ -1264,7 +1264,7 @@ function getNavbarLayoutClasses(layoutVariant = "fullScreenContainerizedLinks",
1264
1264
  // Outer container wrapper (only for floating bar - this containerizes the entire navbar)
1265
1265
  containerWrapperClasses: cn(
1266
1266
  "w-full",
1267
- isFloatingBar && "mx-auto w-full px-2 sm:px-4 lg:px-8 max-w-7xl relative z-10"
1267
+ isFloatingBar && "mx-auto container relative z-10 px-0 sm:px-0 lg:px-0"
1268
1268
  ),
1269
1269
  // Inner container classes (only for fullScreenContainerizedLinks - this containerizes the content inside the navbar)
1270
1270
  innerContainerClasses: cn(
@@ -1929,7 +1929,7 @@ var renderMobileDropdownContent = (item) => {
1929
1929
  switch (item.layout) {
1930
1930
  case "solutions-with-platform":
1931
1931
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4", children: item.solutionCards?.map((solution) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
1932
- /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: solution.href, className: "text-sm font-medium", children: solution.title }),
1932
+ /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: solution.href, className: "mb-2 text-sm font-medium", children: solution.title }),
1933
1933
  solution.subpages.map((subpage) => /* @__PURE__ */ jsxRuntime.jsxs(
1934
1934
  Pressable,
1935
1935
  {
@@ -2022,10 +2022,9 @@ var MobileNavigationMenu = ({
2022
2022
  open,
2023
2023
  onClose: () => setOpen(false),
2024
2024
  title: "Mobile Navigation",
2025
- contentClassName: "pt-4 pb-20",
2025
+ contentClassName: "pt-10 pb-20",
2026
2026
  children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-screen-sm mx-auto", children: [
2027
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-col gap-4", actionsClassName), children: renderActions }),
2028
- /* @__PURE__ */ jsxRuntime.jsx(Accordion, { type: "multiple", className: "mt-6 w-full", children: menuLinks.map((item, index) => {
2027
+ /* @__PURE__ */ jsxRuntime.jsx(Accordion, { type: "multiple", className: "w-full", children: menuLinks.map((item, index) => {
2029
2028
  const hasDropdown = Boolean(item.layout);
2030
2029
  if (hasDropdown) {
2031
2030
  return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -2050,7 +2049,8 @@ var MobileNavigationMenu = ({
2050
2049
  },
2051
2050
  typeof item.label === "string" ? item.label : `nav-${index}`
2052
2051
  );
2053
- }) })
2052
+ }) }),
2053
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-6 flex flex-col gap-4", actionsClassName), children: renderActions })
2054
2054
  ] })
2055
2055
  }
2056
2056
  );