@opensite/ui 1.1.0 → 1.1.1

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 +11 -10
  2. package/dist/navbar-animated-preview.js +11 -10
  3. package/dist/navbar-centered-menu.cjs +5 -4
  4. package/dist/navbar-centered-menu.js +5 -4
  5. package/dist/navbar-dark-icons.cjs +5 -4
  6. package/dist/navbar-dark-icons.js +5 -4
  7. package/dist/navbar-dropdown-menu.cjs +5 -4
  8. package/dist/navbar-dropdown-menu.js +5 -4
  9. package/dist/navbar-education-platform.cjs +5 -4
  10. package/dist/navbar-education-platform.js +5 -4
  11. package/dist/navbar-enterprise-mega.cjs +5 -4
  12. package/dist/navbar-enterprise-mega.js +5 -4
  13. package/dist/navbar-feature-grid.cjs +5 -4
  14. package/dist/navbar-feature-grid.js +5 -4
  15. package/dist/navbar-icon-links.cjs +5 -4
  16. package/dist/navbar-icon-links.js +5 -4
  17. package/dist/navbar-image-preview.cjs +5 -4
  18. package/dist/navbar-image-preview.js +5 -4
  19. package/dist/navbar-mega-menu.cjs +5 -4
  20. package/dist/navbar-mega-menu.js +5 -4
  21. package/dist/navbar-multi-column-groups.cjs +5 -4
  22. package/dist/navbar-multi-column-groups.js +5 -4
  23. package/dist/navbar-platform-resources.cjs +5 -4
  24. package/dist/navbar-platform-resources.js +5 -4
  25. package/dist/navbar-search-focused.cjs +176 -97
  26. package/dist/navbar-search-focused.js +176 -97
  27. package/dist/navbar-sidebar-mobile.cjs +5 -4
  28. package/dist/navbar-sidebar-mobile.js +5 -4
  29. package/dist/navbar-simple-links.cjs +5 -4
  30. package/dist/navbar-simple-links.js +5 -4
  31. package/dist/navbar-split-cta.cjs +5 -4
  32. package/dist/navbar-split-cta.js +5 -4
  33. package/dist/navbar-sticky-compact.cjs +7 -16
  34. package/dist/navbar-sticky-compact.js +7 -16
  35. package/dist/navbar-tabbed-sections.cjs +5 -4
  36. package/dist/navbar-tabbed-sections.js +5 -4
  37. package/dist/navbar-transparent-overlay.cjs +6 -4
  38. package/dist/navbar-transparent-overlay.js +6 -4
  39. package/dist/registry.cjs +171 -117
  40. package/dist/registry.js +171 -117
  41. package/package.json +1 -1
@@ -1143,7 +1143,8 @@ var NavbarMobileMenu = ({
1143
1143
  children,
1144
1144
  className,
1145
1145
  contentClassName,
1146
- closeContainerClassName = "",
1146
+ closeContainerClassName,
1147
+ closeIconClassName,
1147
1148
  title = "Mobile Navigation"
1148
1149
  }) => {
1149
1150
  React__namespace.useEffect(() => {
@@ -1172,8 +1173,8 @@ var NavbarMobileMenu = ({
1172
1173
  "div",
1173
1174
  {
1174
1175
  className: cn(
1175
- closeContainerClassName,
1176
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1176
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1177
+ closeContainerClassName
1177
1178
  ),
1178
1179
  children: /* @__PURE__ */ jsxRuntime.jsxs(
1179
1180
  "button",
@@ -1182,7 +1183,7 @@ var NavbarMobileMenu = ({
1182
1183
  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",
1183
1184
  "aria-label": "Close mobile menu",
1184
1185
  children: [
1185
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1186
+ /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1186
1187
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1187
1188
  ]
1188
1189
  }
@@ -1476,7 +1477,7 @@ var NavbarAnimatedPreview = ({
1476
1477
  "div",
1477
1478
  {
1478
1479
  className: cn(
1479
- "relative z-999 grid w-full grid-cols-2 items-center justify-between gap-8 xl:grid-cols-3"
1480
+ "relative z-999 flex w-full items-center justify-between gap-4"
1480
1481
  ),
1481
1482
  children: [
1482
1483
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -1751,7 +1752,7 @@ var FeaturedLink = ({ link, optixFlowConfig }) => {
1751
1752
  Pressable,
1752
1753
  {
1753
1754
  href: getLinkUrl(link),
1754
- className: "group relative flex w-full overflow-hidden rounded-xl bg-muted px-4 pt-12 pb-4",
1755
+ className: "group relative flex w-full overflow-hidden rounded-xl bg-muted px-4 pt-24 pb-4",
1755
1756
  children: [
1756
1757
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 flex w-full items-center gap-6", children: [
1757
1758
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex size-12 shrink-0 rounded-lg border bg-background shadow-lg", children: link.icon ? link.icon : link.iconName ? /* @__PURE__ */ jsxRuntime.jsx(
@@ -1866,10 +1867,10 @@ var renderMobileMenuItem = (item, index) => {
1866
1867
  className: "border-b-0",
1867
1868
  children: [
1868
1869
  /* @__PURE__ */ jsxRuntime.jsx(AccordionTrigger, { className: "h-10 items-center text-base font-normal text-foreground hover:no-underline", children: item.label }),
1869
- /* @__PURE__ */ jsxRuntime.jsxs(AccordionContent, { className: "flex flex-col gap-6 p-2", children: [
1870
- item.featuredLinks && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 p-2", children: item.featuredLinks.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(NavLink, { link }, `default-nav-link-${idx}`)) }),
1871
- item.links && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 p-2", children: item.links.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(NavLink, { link }, `default-nav-link-${idx}`)) }),
1872
- item.groupLinks && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 p-2", children: item.groupLinks.map((group, groupIdx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
1870
+ /* @__PURE__ */ jsxRuntime.jsxs(AccordionContent, { className: "flex flex-col py-6 px-4", children: [
1871
+ item.featuredLinks && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: item.featuredLinks.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(NavLink, { link }, `default-nav-link-${idx}`)) }),
1872
+ item.links && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: item.links.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(NavLink, { link }, `default-nav-link-${idx}`)) }),
1873
+ item.groupLinks && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: item.groupLinks.map((group, groupIdx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
1873
1874
  group.label && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 text-xs text-muted-foreground", children: group.label }),
1874
1875
  /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-col gap-2", children: group.links.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(NavLink, { link }) }, `group-link-${groupIdx}-${linkIdx}`)) })
1875
1876
  ] }, `group-link-${groupIdx}`)) })
@@ -1118,7 +1118,8 @@ var NavbarMobileMenu = ({
1118
1118
  children,
1119
1119
  className,
1120
1120
  contentClassName,
1121
- closeContainerClassName = "",
1121
+ closeContainerClassName,
1122
+ closeIconClassName,
1122
1123
  title = "Mobile Navigation"
1123
1124
  }) => {
1124
1125
  React.useEffect(() => {
@@ -1147,8 +1148,8 @@ var NavbarMobileMenu = ({
1147
1148
  "div",
1148
1149
  {
1149
1150
  className: cn(
1150
- closeContainerClassName,
1151
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1151
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1152
+ closeContainerClassName
1152
1153
  ),
1153
1154
  children: /* @__PURE__ */ jsxs(
1154
1155
  "button",
@@ -1157,7 +1158,7 @@ var NavbarMobileMenu = ({
1157
1158
  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",
1158
1159
  "aria-label": "Close mobile menu",
1159
1160
  children: [
1160
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1161
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1161
1162
  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1162
1163
  ]
1163
1164
  }
@@ -1451,7 +1452,7 @@ var NavbarAnimatedPreview = ({
1451
1452
  "div",
1452
1453
  {
1453
1454
  className: cn(
1454
- "relative z-999 grid w-full grid-cols-2 items-center justify-between gap-8 xl:grid-cols-3"
1455
+ "relative z-999 flex w-full items-center justify-between gap-4"
1455
1456
  ),
1456
1457
  children: [
1457
1458
  /* @__PURE__ */ jsx(
@@ -1726,7 +1727,7 @@ var FeaturedLink = ({ link, optixFlowConfig }) => {
1726
1727
  Pressable,
1727
1728
  {
1728
1729
  href: getLinkUrl(link),
1729
- className: "group relative flex w-full overflow-hidden rounded-xl bg-muted px-4 pt-12 pb-4",
1730
+ className: "group relative flex w-full overflow-hidden rounded-xl bg-muted px-4 pt-24 pb-4",
1730
1731
  children: [
1731
1732
  /* @__PURE__ */ jsxs("div", { className: "relative z-10 flex w-full items-center gap-6", children: [
1732
1733
  /* @__PURE__ */ jsx("div", { className: "flex size-12 shrink-0 rounded-lg border bg-background shadow-lg", children: link.icon ? link.icon : link.iconName ? /* @__PURE__ */ jsx(
@@ -1841,10 +1842,10 @@ var renderMobileMenuItem = (item, index) => {
1841
1842
  className: "border-b-0",
1842
1843
  children: [
1843
1844
  /* @__PURE__ */ jsx(AccordionTrigger, { className: "h-10 items-center text-base font-normal text-foreground hover:no-underline", children: item.label }),
1844
- /* @__PURE__ */ jsxs(AccordionContent, { className: "flex flex-col gap-6 p-2", children: [
1845
- item.featuredLinks && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4 p-2", children: item.featuredLinks.map((link, idx) => /* @__PURE__ */ jsx(NavLink, { link }, `default-nav-link-${idx}`)) }),
1846
- item.links && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4 p-2", children: item.links.map((link, idx) => /* @__PURE__ */ jsx(NavLink, { link }, `default-nav-link-${idx}`)) }),
1847
- item.groupLinks && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4 p-2", children: item.groupLinks.map((group, groupIdx) => /* @__PURE__ */ jsxs("div", { className: "relative", children: [
1845
+ /* @__PURE__ */ jsxs(AccordionContent, { className: "flex flex-col py-6 px-4", children: [
1846
+ item.featuredLinks && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: item.featuredLinks.map((link, idx) => /* @__PURE__ */ jsx(NavLink, { link }, `default-nav-link-${idx}`)) }),
1847
+ item.links && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: item.links.map((link, idx) => /* @__PURE__ */ jsx(NavLink, { link }, `default-nav-link-${idx}`)) }),
1848
+ item.groupLinks && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: item.groupLinks.map((group, groupIdx) => /* @__PURE__ */ jsxs("div", { className: "relative", children: [
1848
1849
  group.label && /* @__PURE__ */ jsx("div", { className: "mb-4 text-xs text-muted-foreground", children: group.label }),
1849
1850
  /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-2", children: group.links.map((link, linkIdx) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(NavLink, { link }) }, `group-link-${groupIdx}-${linkIdx}`)) })
1850
1851
  ] }, `group-link-${groupIdx}`)) })
@@ -1091,7 +1091,8 @@ var NavbarMobileMenu = ({
1091
1091
  children,
1092
1092
  className,
1093
1093
  contentClassName,
1094
- closeContainerClassName = "",
1094
+ closeContainerClassName,
1095
+ closeIconClassName,
1095
1096
  title = "Mobile Navigation"
1096
1097
  }) => {
1097
1098
  React__namespace.useEffect(() => {
@@ -1120,8 +1121,8 @@ var NavbarMobileMenu = ({
1120
1121
  "div",
1121
1122
  {
1122
1123
  className: cn(
1123
- closeContainerClassName,
1124
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1124
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1125
+ closeContainerClassName
1125
1126
  ),
1126
1127
  children: /* @__PURE__ */ jsxRuntime.jsxs(
1127
1128
  "button",
@@ -1130,7 +1131,7 @@ var NavbarMobileMenu = ({
1130
1131
  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",
1131
1132
  "aria-label": "Close mobile menu",
1132
1133
  children: [
1133
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1134
+ /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1134
1135
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1135
1136
  ]
1136
1137
  }
@@ -1068,7 +1068,8 @@ var NavbarMobileMenu = ({
1068
1068
  children,
1069
1069
  className,
1070
1070
  contentClassName,
1071
- closeContainerClassName = "",
1071
+ closeContainerClassName,
1072
+ closeIconClassName,
1072
1073
  title = "Mobile Navigation"
1073
1074
  }) => {
1074
1075
  React.useEffect(() => {
@@ -1097,8 +1098,8 @@ var NavbarMobileMenu = ({
1097
1098
  "div",
1098
1099
  {
1099
1100
  className: cn(
1100
- closeContainerClassName,
1101
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1101
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1102
+ closeContainerClassName
1102
1103
  ),
1103
1104
  children: /* @__PURE__ */ jsxs(
1104
1105
  "button",
@@ -1107,7 +1108,7 @@ var NavbarMobileMenu = ({
1107
1108
  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",
1108
1109
  "aria-label": "Close mobile menu",
1109
1110
  children: [
1110
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1111
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1111
1112
  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1112
1113
  ]
1113
1114
  }
@@ -1138,7 +1138,8 @@ var NavbarMobileMenu = ({
1138
1138
  children,
1139
1139
  className,
1140
1140
  contentClassName,
1141
- closeContainerClassName = "",
1141
+ closeContainerClassName,
1142
+ closeIconClassName,
1142
1143
  title = "Mobile Navigation"
1143
1144
  }) => {
1144
1145
  React__namespace.useEffect(() => {
@@ -1167,8 +1168,8 @@ var NavbarMobileMenu = ({
1167
1168
  "div",
1168
1169
  {
1169
1170
  className: cn(
1170
- closeContainerClassName,
1171
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1171
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1172
+ closeContainerClassName
1172
1173
  ),
1173
1174
  children: /* @__PURE__ */ jsxRuntime.jsxs(
1174
1175
  "button",
@@ -1177,7 +1178,7 @@ var NavbarMobileMenu = ({
1177
1178
  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",
1178
1179
  "aria-label": "Close mobile menu",
1179
1180
  children: [
1180
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1181
+ /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1181
1182
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1182
1183
  ]
1183
1184
  }
@@ -1115,7 +1115,8 @@ var NavbarMobileMenu = ({
1115
1115
  children,
1116
1116
  className,
1117
1117
  contentClassName,
1118
- closeContainerClassName = "",
1118
+ closeContainerClassName,
1119
+ closeIconClassName,
1119
1120
  title = "Mobile Navigation"
1120
1121
  }) => {
1121
1122
  React.useEffect(() => {
@@ -1144,8 +1145,8 @@ var NavbarMobileMenu = ({
1144
1145
  "div",
1145
1146
  {
1146
1147
  className: cn(
1147
- closeContainerClassName,
1148
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1148
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1149
+ closeContainerClassName
1149
1150
  ),
1150
1151
  children: /* @__PURE__ */ jsxs(
1151
1152
  "button",
@@ -1154,7 +1155,7 @@ var NavbarMobileMenu = ({
1154
1155
  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",
1155
1156
  "aria-label": "Close mobile menu",
1156
1157
  children: [
1157
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1158
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1158
1159
  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1159
1160
  ]
1160
1161
  }
@@ -1138,7 +1138,8 @@ var NavbarMobileMenu = ({
1138
1138
  children,
1139
1139
  className,
1140
1140
  contentClassName,
1141
- closeContainerClassName = "",
1141
+ closeContainerClassName,
1142
+ closeIconClassName,
1142
1143
  title = "Mobile Navigation"
1143
1144
  }) => {
1144
1145
  React__namespace.useEffect(() => {
@@ -1167,8 +1168,8 @@ var NavbarMobileMenu = ({
1167
1168
  "div",
1168
1169
  {
1169
1170
  className: cn(
1170
- closeContainerClassName,
1171
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1171
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1172
+ closeContainerClassName
1172
1173
  ),
1173
1174
  children: /* @__PURE__ */ jsxRuntime.jsxs(
1174
1175
  "button",
@@ -1177,7 +1178,7 @@ var NavbarMobileMenu = ({
1177
1178
  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",
1178
1179
  "aria-label": "Close mobile menu",
1179
1180
  children: [
1180
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1181
+ /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1181
1182
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1182
1183
  ]
1183
1184
  }
@@ -1115,7 +1115,8 @@ var NavbarMobileMenu = ({
1115
1115
  children,
1116
1116
  className,
1117
1117
  contentClassName,
1118
- closeContainerClassName = "",
1118
+ closeContainerClassName,
1119
+ closeIconClassName,
1119
1120
  title = "Mobile Navigation"
1120
1121
  }) => {
1121
1122
  React.useEffect(() => {
@@ -1144,8 +1145,8 @@ var NavbarMobileMenu = ({
1144
1145
  "div",
1145
1146
  {
1146
1147
  className: cn(
1147
- closeContainerClassName,
1148
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1148
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1149
+ closeContainerClassName
1149
1150
  ),
1150
1151
  children: /* @__PURE__ */ jsxs(
1151
1152
  "button",
@@ -1154,7 +1155,7 @@ var NavbarMobileMenu = ({
1154
1155
  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",
1155
1156
  "aria-label": "Close mobile menu",
1156
1157
  children: [
1157
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1158
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1158
1159
  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1159
1160
  ]
1160
1161
  }
@@ -1220,7 +1220,8 @@ var NavbarMobileMenu = ({
1220
1220
  children,
1221
1221
  className,
1222
1222
  contentClassName,
1223
- closeContainerClassName = "",
1223
+ closeContainerClassName,
1224
+ closeIconClassName,
1224
1225
  title = "Mobile Navigation"
1225
1226
  }) => {
1226
1227
  React__namespace.useEffect(() => {
@@ -1249,8 +1250,8 @@ var NavbarMobileMenu = ({
1249
1250
  "div",
1250
1251
  {
1251
1252
  className: cn(
1252
- closeContainerClassName,
1253
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1253
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1254
+ closeContainerClassName
1254
1255
  ),
1255
1256
  children: /* @__PURE__ */ jsxRuntime.jsxs(
1256
1257
  "button",
@@ -1259,7 +1260,7 @@ var NavbarMobileMenu = ({
1259
1260
  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",
1260
1261
  "aria-label": "Close mobile menu",
1261
1262
  children: [
1262
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1263
+ /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1263
1264
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1264
1265
  ]
1265
1266
  }
@@ -1196,7 +1196,8 @@ var NavbarMobileMenu = ({
1196
1196
  children,
1197
1197
  className,
1198
1198
  contentClassName,
1199
- closeContainerClassName = "",
1199
+ closeContainerClassName,
1200
+ closeIconClassName,
1200
1201
  title = "Mobile Navigation"
1201
1202
  }) => {
1202
1203
  React.useEffect(() => {
@@ -1225,8 +1226,8 @@ var NavbarMobileMenu = ({
1225
1226
  "div",
1226
1227
  {
1227
1228
  className: cn(
1228
- closeContainerClassName,
1229
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1229
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1230
+ closeContainerClassName
1230
1231
  ),
1231
1232
  children: /* @__PURE__ */ jsxs(
1232
1233
  "button",
@@ -1235,7 +1236,7 @@ var NavbarMobileMenu = ({
1235
1236
  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",
1236
1237
  "aria-label": "Close mobile menu",
1237
1238
  children: [
1238
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1239
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1239
1240
  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1240
1241
  ]
1241
1242
  }
@@ -1138,7 +1138,8 @@ var NavbarMobileMenu = ({
1138
1138
  children,
1139
1139
  className,
1140
1140
  contentClassName,
1141
- closeContainerClassName = "",
1141
+ closeContainerClassName,
1142
+ closeIconClassName,
1142
1143
  title = "Mobile Navigation"
1143
1144
  }) => {
1144
1145
  React__namespace.useEffect(() => {
@@ -1167,8 +1168,8 @@ var NavbarMobileMenu = ({
1167
1168
  "div",
1168
1169
  {
1169
1170
  className: cn(
1170
- closeContainerClassName,
1171
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1171
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1172
+ closeContainerClassName
1172
1173
  ),
1173
1174
  children: /* @__PURE__ */ jsxRuntime.jsxs(
1174
1175
  "button",
@@ -1177,7 +1178,7 @@ var NavbarMobileMenu = ({
1177
1178
  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",
1178
1179
  "aria-label": "Close mobile menu",
1179
1180
  children: [
1180
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1181
+ /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1181
1182
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1182
1183
  ]
1183
1184
  }
@@ -1115,7 +1115,8 @@ var NavbarMobileMenu = ({
1115
1115
  children,
1116
1116
  className,
1117
1117
  contentClassName,
1118
- closeContainerClassName = "",
1118
+ closeContainerClassName,
1119
+ closeIconClassName,
1119
1120
  title = "Mobile Navigation"
1120
1121
  }) => {
1121
1122
  React.useEffect(() => {
@@ -1144,8 +1145,8 @@ var NavbarMobileMenu = ({
1144
1145
  "div",
1145
1146
  {
1146
1147
  className: cn(
1147
- closeContainerClassName,
1148
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1148
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1149
+ closeContainerClassName
1149
1150
  ),
1150
1151
  children: /* @__PURE__ */ jsxs(
1151
1152
  "button",
@@ -1154,7 +1155,7 @@ var NavbarMobileMenu = ({
1154
1155
  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",
1155
1156
  "aria-label": "Close mobile menu",
1156
1157
  children: [
1157
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1158
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1158
1159
  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1159
1160
  ]
1160
1161
  }
@@ -1138,7 +1138,8 @@ var NavbarMobileMenu = ({
1138
1138
  children,
1139
1139
  className,
1140
1140
  contentClassName,
1141
- closeContainerClassName = "",
1141
+ closeContainerClassName,
1142
+ closeIconClassName,
1142
1143
  title = "Mobile Navigation"
1143
1144
  }) => {
1144
1145
  React__namespace.useEffect(() => {
@@ -1167,8 +1168,8 @@ var NavbarMobileMenu = ({
1167
1168
  "div",
1168
1169
  {
1169
1170
  className: cn(
1170
- closeContainerClassName,
1171
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1171
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1172
+ closeContainerClassName
1172
1173
  ),
1173
1174
  children: /* @__PURE__ */ jsxRuntime.jsxs(
1174
1175
  "button",
@@ -1177,7 +1178,7 @@ var NavbarMobileMenu = ({
1177
1178
  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",
1178
1179
  "aria-label": "Close mobile menu",
1179
1180
  children: [
1180
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1181
+ /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1181
1182
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1182
1183
  ]
1183
1184
  }
@@ -1115,7 +1115,8 @@ var NavbarMobileMenu = ({
1115
1115
  children,
1116
1116
  className,
1117
1117
  contentClassName,
1118
- closeContainerClassName = "",
1118
+ closeContainerClassName,
1119
+ closeIconClassName,
1119
1120
  title = "Mobile Navigation"
1120
1121
  }) => {
1121
1122
  React.useEffect(() => {
@@ -1144,8 +1145,8 @@ var NavbarMobileMenu = ({
1144
1145
  "div",
1145
1146
  {
1146
1147
  className: cn(
1147
- closeContainerClassName,
1148
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1148
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1149
+ closeContainerClassName
1149
1150
  ),
1150
1151
  children: /* @__PURE__ */ jsxs(
1151
1152
  "button",
@@ -1154,7 +1155,7 @@ var NavbarMobileMenu = ({
1154
1155
  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",
1155
1156
  "aria-label": "Close mobile menu",
1156
1157
  children: [
1157
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1158
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1158
1159
  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1159
1160
  ]
1160
1161
  }
@@ -1035,7 +1035,8 @@ var NavbarMobileMenu = ({
1035
1035
  children,
1036
1036
  className,
1037
1037
  contentClassName,
1038
- closeContainerClassName = "",
1038
+ closeContainerClassName,
1039
+ closeIconClassName,
1039
1040
  title = "Mobile Navigation"
1040
1041
  }) => {
1041
1042
  React__namespace.useEffect(() => {
@@ -1064,8 +1065,8 @@ var NavbarMobileMenu = ({
1064
1065
  "div",
1065
1066
  {
1066
1067
  className: cn(
1067
- closeContainerClassName,
1068
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1068
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1069
+ closeContainerClassName
1069
1070
  ),
1070
1071
  children: /* @__PURE__ */ jsxRuntime.jsxs(
1071
1072
  "button",
@@ -1074,7 +1075,7 @@ var NavbarMobileMenu = ({
1074
1075
  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",
1075
1076
  "aria-label": "Close mobile menu",
1076
1077
  children: [
1077
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1078
+ /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1078
1079
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1079
1080
  ]
1080
1081
  }
@@ -1012,7 +1012,8 @@ var NavbarMobileMenu = ({
1012
1012
  children,
1013
1013
  className,
1014
1014
  contentClassName,
1015
- closeContainerClassName = "",
1015
+ closeContainerClassName,
1016
+ closeIconClassName,
1016
1017
  title = "Mobile Navigation"
1017
1018
  }) => {
1018
1019
  React.useEffect(() => {
@@ -1041,8 +1042,8 @@ var NavbarMobileMenu = ({
1041
1042
  "div",
1042
1043
  {
1043
1044
  className: cn(
1044
- closeContainerClassName,
1045
- "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
1045
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1046
+ closeContainerClassName
1046
1047
  ),
1047
1048
  children: /* @__PURE__ */ jsxs(
1048
1049
  "button",
@@ -1051,7 +1052,7 @@ var NavbarMobileMenu = ({
1051
1052
  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",
1052
1053
  "aria-label": "Close mobile menu",
1053
1054
  children: [
1054
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1055
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1055
1056
  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1056
1057
  ]
1057
1058
  }
@@ -1198,7 +1198,8 @@ var NavbarMobileMenu = ({
1198
1198
  children,
1199
1199
  className,
1200
1200
  contentClassName,
1201
- closeContainerClassName = "",
1201
+ closeContainerClassName,
1202
+ closeIconClassName,
1202
1203
  title = "Mobile Navigation"
1203
1204
  }) => {
1204
1205
  React__namespace.useEffect(() => {
@@ -1227,8 +1228,8 @@ var NavbarMobileMenu = ({
1227
1228
  "div",
1228
1229
  {
1229
1230
  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"
1231
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1232
+ closeContainerClassName
1232
1233
  ),
1233
1234
  children: /* @__PURE__ */ jsxRuntime.jsxs(
1234
1235
  "button",
@@ -1237,7 +1238,7 @@ var NavbarMobileMenu = ({
1237
1238
  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
1239
  "aria-label": "Close mobile menu",
1239
1240
  children: [
1240
- /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1241
+ /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1241
1242
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1242
1243
  ]
1243
1244
  }
@@ -1175,7 +1175,8 @@ var NavbarMobileMenu = ({
1175
1175
  children,
1176
1176
  className,
1177
1177
  contentClassName,
1178
- closeContainerClassName = "",
1178
+ closeContainerClassName,
1179
+ closeIconClassName,
1179
1180
  title = "Mobile Navigation"
1180
1181
  }) => {
1181
1182
  React.useEffect(() => {
@@ -1204,8 +1205,8 @@ var NavbarMobileMenu = ({
1204
1205
  "div",
1205
1206
  {
1206
1207
  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"
1208
+ "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen",
1209
+ closeContainerClassName
1209
1210
  ),
1210
1211
  children: /* @__PURE__ */ jsxs(
1211
1212
  "button",
@@ -1214,7 +1215,7 @@ var NavbarMobileMenu = ({
1214
1215
  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
1216
  "aria-label": "Close mobile menu",
1216
1217
  children: [
1217
- /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
1218
+ /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: cn("size-4", closeIconClassName) }),
1218
1219
  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
1219
1220
  ]
1220
1221
  }