@opensite/ui 1.0.9 → 1.1.0

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 (41) hide show
  1. package/dist/navbar-animated-preview.cjs +27 -17
  2. package/dist/navbar-animated-preview.js +27 -17
  3. package/dist/navbar-centered-menu.cjs +20 -10
  4. package/dist/navbar-centered-menu.js +20 -10
  5. package/dist/navbar-dark-icons.cjs +20 -10
  6. package/dist/navbar-dark-icons.js +20 -10
  7. package/dist/navbar-dropdown-menu.cjs +20 -10
  8. package/dist/navbar-dropdown-menu.js +20 -10
  9. package/dist/navbar-education-platform.cjs +81 -56
  10. package/dist/navbar-education-platform.js +81 -56
  11. package/dist/navbar-enterprise-mega.cjs +21 -11
  12. package/dist/navbar-enterprise-mega.js +21 -11
  13. package/dist/navbar-feature-grid.cjs +20 -10
  14. package/dist/navbar-feature-grid.js +20 -10
  15. package/dist/navbar-icon-links.cjs +20 -10
  16. package/dist/navbar-icon-links.js +20 -10
  17. package/dist/navbar-image-preview.cjs +20 -10
  18. package/dist/navbar-image-preview.js +20 -10
  19. package/dist/navbar-mega-menu.cjs +20 -10
  20. package/dist/navbar-mega-menu.js +20 -10
  21. package/dist/navbar-multi-column-groups.cjs +52 -35
  22. package/dist/navbar-multi-column-groups.js +52 -35
  23. package/dist/navbar-platform-resources.cjs +20 -10
  24. package/dist/navbar-platform-resources.js +20 -10
  25. package/dist/navbar-search-focused.cjs +20 -10
  26. package/dist/navbar-search-focused.js +20 -10
  27. package/dist/navbar-sidebar-mobile.cjs +21 -10
  28. package/dist/navbar-sidebar-mobile.js +21 -10
  29. package/dist/navbar-simple-links.cjs +22 -12
  30. package/dist/navbar-simple-links.js +22 -12
  31. package/dist/navbar-split-cta.cjs +20 -10
  32. package/dist/navbar-split-cta.js +20 -10
  33. package/dist/navbar-sticky-compact.cjs +240 -123
  34. package/dist/navbar-sticky-compact.js +239 -123
  35. package/dist/navbar-tabbed-sections.cjs +20 -10
  36. package/dist/navbar-tabbed-sections.js +20 -10
  37. package/dist/navbar-transparent-overlay.cjs +21 -10
  38. package/dist/navbar-transparent-overlay.js +21 -10
  39. package/dist/registry.cjs +285 -206
  40. package/dist/registry.js +285 -206
  41. package/package.json +1 -1
package/dist/navbar-search-focused.js CHANGED
@@ -1071,6 +1071,7 @@ var NavbarMobileMenu = ({
1071
1071
  children,
1072
1072
  className,
1073
1073
  contentClassName,
1074
+ closeContainerClassName = "",
1074
1075
  title = "Mobile Navigation"
1075
1076
  }) => {
1076
1077
  React.useEffect(() => {
@@ -1095,18 +1096,27 @@ var NavbarMobileMenu = ({
1095
1096
  "data-state": open ? "open" : "closed",
1096
1097
  children: [
1097
1098
  /* @__PURE__ */ jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsx("h2", { children: title }) }),
1098
- /* @__PURE__ */ jsx("div", { className: "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen", children: /* @__PURE__ */ jsxs(
1099
- "button",
1099
+ /* @__PURE__ */ jsx(
1100
+ "div",
1100
1101
  {
1101
- onClick: onClose,
1102
- 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",
1103
- "aria-label": "Close mobile menu",
1104
- children: [
1105
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1106
- /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1107
- ]
1102
+ className: cn(
1103
+ closeContainerClassName,
1104
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1105
+ ),
1106
+ children: /* @__PURE__ */ jsxs(
1107
+ "button",
1108
+ {
1109
+ onClick: onClose,
1110
+ 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",
1111
+ "aria-label": "Close mobile menu",
1112
+ children: [
1113
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1114
+ /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1115
+ ]
1116
+ }
1117
+ )
1108
1118
  }
1109
- ) }),
1119
+ ),
1110
1120
  /* @__PURE__ */ jsx(
1111
1121
  "div",
1112
1122
  {
package/dist/navbar-sidebar-mobile.cjs CHANGED
@@ -1198,6 +1198,7 @@ var NavbarMobileMenu = ({
1198
1198
  children,
1199
1199
  className,
1200
1200
  contentClassName,
1201
+ closeContainerClassName = "",
1201
1202
  title = "Mobile Navigation"
1202
1203
  }) => {
1203
1204
  React__namespace.useEffect(() => {
@@ -1222,18 +1223,27 @@ var NavbarMobileMenu = ({
1222
1223
  "data-state": open ? "open" : "closed",
1223
1224
  children: [
1224
1225
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsxRuntime.jsx("h2", { children: title }) }),
1225
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen", children: /* @__PURE__ */ jsxRuntime.jsxs(
1226
- "button",
1226
+ /* @__PURE__ */ jsxRuntime.jsx(
1227
+ "div",
1227
1228
  {
1228
- onClick: onClose,
1229
- 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",
1230
- "aria-label": "Close mobile menu",
1231
- children: [
1232
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1233
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1234
- ]
1229
+ className: cn(
1230
+ closeContainerClassName,
1231
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1232
+ ),
1233
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
1234
+ "button",
1235
+ {
1236
+ onClick: onClose,
1237
+ 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",
1238
+ "aria-label": "Close mobile menu",
1239
+ children: [
1240
+ /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1241
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1242
+ ]
1243
+ }
1244
+ )
1235
1245
  }
1236
- ) }),
1246
+ ),
1237
1247
  /* @__PURE__ */ jsxRuntime.jsx(
1238
1248
  "div",
1239
1249
  {
@@ -1404,6 +1414,7 @@ var NavbarSidebarMobile = ({
1404
1414
  NavigationMenu,
1405
1415
  {
1406
1416
  className: cn("hidden lg:flex", navigationMenuClassName),
1417
+ viewport: false,
1407
1418
  children: /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuList, { children: menuSlot ? menuSlot : renderMenu()?.map(
1408
1419
  (item, index) => item.items ? /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenuItem, { children: [
1409
1420
  /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuTrigger, { children: item.title }),
package/dist/navbar-sidebar-mobile.js CHANGED
@@ -1175,6 +1175,7 @@ var NavbarMobileMenu = ({
1175
1175
  children,
1176
1176
  className,
1177
1177
  contentClassName,
1178
+ closeContainerClassName = "",
1178
1179
  title = "Mobile Navigation"
1179
1180
  }) => {
1180
1181
  React.useEffect(() => {
@@ -1199,18 +1200,27 @@ var NavbarMobileMenu = ({
1199
1200
  "data-state": open ? "open" : "closed",
1200
1201
  children: [
1201
1202
  /* @__PURE__ */ jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsx("h2", { children: title }) }),
1202
- /* @__PURE__ */ jsx("div", { className: "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen", children: /* @__PURE__ */ jsxs(
1203
- "button",
1203
+ /* @__PURE__ */ jsx(
1204
+ "div",
1204
1205
  {
1205
- onClick: onClose,
1206
- 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",
1207
- "aria-label": "Close mobile menu",
1208
- children: [
1209
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1210
- /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1211
- ]
1206
+ className: cn(
1207
+ closeContainerClassName,
1208
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1209
+ ),
1210
+ children: /* @__PURE__ */ jsxs(
1211
+ "button",
1212
+ {
1213
+ onClick: onClose,
1214
+ 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",
1215
+ "aria-label": "Close mobile menu",
1216
+ children: [
1217
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1218
+ /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1219
+ ]
1220
+ }
1221
+ )
1212
1222
  }
1213
- ) }),
1223
+ ),
1214
1224
  /* @__PURE__ */ jsx(
1215
1225
  "div",
1216
1226
  {
@@ -1381,6 +1391,7 @@ var NavbarSidebarMobile = ({
1381
1391
  NavigationMenu,
1382
1392
  {
1383
1393
  className: cn("hidden lg:flex", navigationMenuClassName),
1394
+ viewport: false,
1384
1395
  children: /* @__PURE__ */ jsx(NavigationMenuList, { children: menuSlot ? menuSlot : renderMenu()?.map(
1385
1396
  (item, index) => item.items ? /* @__PURE__ */ jsxs(NavigationMenuItem, { children: [
1386
1397
  /* @__PURE__ */ jsx(NavigationMenuTrigger, { children: item.title }),
package/dist/navbar-simple-links.cjs CHANGED
@@ -1093,6 +1093,7 @@ var NavbarMobileMenu = ({
1093
1093
  children,
1094
1094
  className,
1095
1095
  contentClassName,
1096
+ closeContainerClassName = "",
1096
1097
  title = "Mobile Navigation"
1097
1098
  }) => {
1098
1099
  React__namespace.useEffect(() => {
@@ -1117,18 +1118,27 @@ var NavbarMobileMenu = ({
1117
1118
  "data-state": open ? "open" : "closed",
1118
1119
  children: [
1119
1120
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsxRuntime.jsx("h2", { children: title }) }),
1120
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen", children: /* @__PURE__ */ jsxRuntime.jsxs(
1121
- "button",
1121
+ /* @__PURE__ */ jsxRuntime.jsx(
1122
+ "div",
1122
1123
  {
1123
- onClick: onClose,
1124
- 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",
1125
- "aria-label": "Close mobile menu",
1126
- children: [
1127
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1128
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1129
- ]
1124
+ className: cn(
1125
+ closeContainerClassName,
1126
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1127
+ ),
1128
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
1129
+ "button",
1130
+ {
1131
+ onClick: onClose,
1132
+ 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",
1133
+ "aria-label": "Close mobile menu",
1134
+ children: [
1135
+ /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1136
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1137
+ ]
1138
+ }
1139
+ )
1130
1140
  }
1131
- ) }),
1141
+ ),
1132
1142
  /* @__PURE__ */ jsxRuntime.jsx(
1133
1143
  "div",
1134
1144
  {
@@ -1385,8 +1395,8 @@ var NavbarSimpleLinks = ({
1385
1395
  open: isOpen,
1386
1396
  onClose: handleMobileMenuClose,
1387
1397
  navItems: navItems ?? [],
1388
- mobileActions,
1389
- mobileActionsSlot,
1398
+ mobileActions: mobileActions ?? actions,
1399
+ mobileActionsSlot: mobileActionsSlot ?? actionsSlot,
1390
1400
  mobileMenuClassName
1391
1401
  }
1392
1402
  )
package/dist/navbar-simple-links.js CHANGED
@@ -1071,6 +1071,7 @@ var NavbarMobileMenu = ({
1071
1071
  children,
1072
1072
  className,
1073
1073
  contentClassName,
1074
+ closeContainerClassName = "",
1074
1075
  title = "Mobile Navigation"
1075
1076
  }) => {
1076
1077
  React.useEffect(() => {
@@ -1095,18 +1096,27 @@ var NavbarMobileMenu = ({
1095
1096
  "data-state": open ? "open" : "closed",
1096
1097
  children: [
1097
1098
  /* @__PURE__ */ jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsx("h2", { children: title }) }),
1098
- /* @__PURE__ */ jsx("div", { className: "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen", children: /* @__PURE__ */ jsxs(
1099
- "button",
1099
+ /* @__PURE__ */ jsx(
1100
+ "div",
1100
1101
  {
1101
- onClick: onClose,
1102
- 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",
1103
- "aria-label": "Close mobile menu",
1104
- children: [
1105
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1106
- /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1107
- ]
1102
+ className: cn(
1103
+ closeContainerClassName,
1104
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1105
+ ),
1106
+ children: /* @__PURE__ */ jsxs(
1107
+ "button",
1108
+ {
1109
+ onClick: onClose,
1110
+ 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",
1111
+ "aria-label": "Close mobile menu",
1112
+ children: [
1113
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1114
+ /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1115
+ ]
1116
+ }
1117
+ )
1108
1118
  }
1109
- ) }),
1119
+ ),
1110
1120
  /* @__PURE__ */ jsx(
1111
1121
  "div",
1112
1122
  {
@@ -1363,8 +1373,8 @@ var NavbarSimpleLinks = ({
1363
1373
  open: isOpen,
1364
1374
  onClose: handleMobileMenuClose,
1365
1375
  navItems: navItems ?? [],
1366
- mobileActions,
1367
- mobileActionsSlot,
1376
+ mobileActions: mobileActions ?? actions,
1377
+ mobileActionsSlot: mobileActionsSlot ?? actionsSlot,
1368
1378
  mobileMenuClassName
1369
1379
  }
1370
1380
  )
package/dist/navbar-split-cta.cjs CHANGED
@@ -1136,6 +1136,7 @@ var NavbarMobileMenu = ({
1136
1136
  children,
1137
1137
  className,
1138
1138
  contentClassName,
1139
+ closeContainerClassName = "",
1139
1140
  title = "Mobile Navigation"
1140
1141
  }) => {
1141
1142
  React__namespace.useEffect(() => {
@@ -1160,18 +1161,27 @@ var NavbarMobileMenu = ({
1160
1161
  "data-state": open ? "open" : "closed",
1161
1162
  children: [
1162
1163
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsxRuntime.jsx("h2", { children: title }) }),
1163
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen", children: /* @__PURE__ */ jsxRuntime.jsxs(
1164
- "button",
1164
+ /* @__PURE__ */ jsxRuntime.jsx(
1165
+ "div",
1165
1166
  {
1166
- onClick: onClose,
1167
- 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",
1168
- "aria-label": "Close mobile menu",
1169
- children: [
1170
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1171
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1172
- ]
1167
+ className: cn(
1168
+ closeContainerClassName,
1169
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1170
+ ),
1171
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
1172
+ "button",
1173
+ {
1174
+ onClick: onClose,
1175
+ 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",
1176
+ "aria-label": "Close mobile menu",
1177
+ children: [
1178
+ /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1179
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1180
+ ]
1181
+ }
1182
+ )
1173
1183
  }
1174
- ) }),
1184
+ ),
1175
1185
  /* @__PURE__ */ jsxRuntime.jsx(
1176
1186
  "div",
1177
1187
  {
package/dist/navbar-split-cta.js CHANGED
@@ -1114,6 +1114,7 @@ var NavbarMobileMenu = ({
1114
1114
  children,
1115
1115
  className,
1116
1116
  contentClassName,
1117
+ closeContainerClassName = "",
1117
1118
  title = "Mobile Navigation"
1118
1119
  }) => {
1119
1120
  React.useEffect(() => {
@@ -1138,18 +1139,27 @@ var NavbarMobileMenu = ({
1138
1139
  "data-state": open ? "open" : "closed",
1139
1140
  children: [
1140
1141
  /* @__PURE__ */ jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsx("h2", { children: title }) }),
1141
- /* @__PURE__ */ jsx("div", { className: "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen", children: /* @__PURE__ */ jsxs(
1142
- "button",
1142
+ /* @__PURE__ */ jsx(
1143
+ "div",
1143
1144
  {
1144
- onClick: onClose,
1145
- 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",
1146
- "aria-label": "Close mobile menu",
1147
- children: [
1148
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1149
- /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1150
- ]
1145
+ className: cn(
1146
+ closeContainerClassName,
1147
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1148
+ ),
1149
+ children: /* @__PURE__ */ jsxs(
1150
+ "button",
1151
+ {
1152
+ onClick: onClose,
1153
+ 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",
1154
+ "aria-label": "Close mobile menu",
1155
+ children: [
1156
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1157
+ /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1158
+ ]
1159
+ }
1160
+ )
1151
1161
  }
1152
- ) }),
1162
+ ),
1153
1163
  /* @__PURE__ */ jsx(
1154
1164
  "div",
1155
1165
  {