@opensite/ui 1.1.0 → 1.1.2

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 +15 -11
  2. package/dist/navbar-animated-preview.js +15 -11
  3. package/dist/navbar-centered-menu.cjs +8 -4
  4. package/dist/navbar-centered-menu.js +8 -4
  5. package/dist/navbar-dark-icons.cjs +8 -4
  6. package/dist/navbar-dark-icons.js +8 -4
  7. package/dist/navbar-dropdown-menu.cjs +8 -4
  8. package/dist/navbar-dropdown-menu.js +8 -4
  9. package/dist/navbar-education-platform.cjs +8 -4
  10. package/dist/navbar-education-platform.js +8 -4
  11. package/dist/navbar-enterprise-mega.cjs +8 -4
  12. package/dist/navbar-enterprise-mega.js +8 -4
  13. package/dist/navbar-feature-grid.cjs +8 -4
  14. package/dist/navbar-feature-grid.js +8 -4
  15. package/dist/navbar-icon-links.cjs +8 -4
  16. package/dist/navbar-icon-links.js +8 -4
  17. package/dist/navbar-image-preview.cjs +8 -4
  18. package/dist/navbar-image-preview.js +8 -4
  19. package/dist/navbar-mega-menu.cjs +8 -4
  20. package/dist/navbar-mega-menu.js +8 -4
  21. package/dist/navbar-multi-column-groups.cjs +8 -4
  22. package/dist/navbar-multi-column-groups.js +8 -4
  23. package/dist/navbar-platform-resources.cjs +8 -4
  24. package/dist/navbar-platform-resources.js +8 -4
  25. package/dist/navbar-search-focused.cjs +179 -97
  26. package/dist/navbar-search-focused.js +179 -97
  27. package/dist/navbar-sidebar-mobile.cjs +8 -4
  28. package/dist/navbar-sidebar-mobile.js +8 -4
  29. package/dist/navbar-simple-links.cjs +8 -4
  30. package/dist/navbar-simple-links.js +8 -4
  31. package/dist/navbar-split-cta.cjs +8 -4
  32. package/dist/navbar-split-cta.js +8 -4
  33. package/dist/navbar-sticky-compact.cjs +10 -16
  34. package/dist/navbar-sticky-compact.js +10 -16
  35. package/dist/navbar-tabbed-sections.cjs +8 -4
  36. package/dist/navbar-tabbed-sections.js +8 -4
  37. package/dist/navbar-transparent-overlay.cjs +9 -4
  38. package/dist/navbar-transparent-overlay.js +9 -4
  39. package/dist/registry.cjs +175 -118
  40. package/dist/registry.js +175 -118
  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,14 +1173,17 @@ 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",
1180
1181
  {
1181
1182
  onClick: onClose,
1182
- 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
+ className: cn(
1184
+ "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",
1185
+ closeIconClassName
1186
+ ),
1183
1187
  "aria-label": "Close mobile menu",
1184
1188
  children: [
1185
1189
  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -1476,7 +1480,7 @@ var NavbarAnimatedPreview = ({
1476
1480
  "div",
1477
1481
  {
1478
1482
  className: cn(
1479
- "relative z-999 grid w-full grid-cols-2 items-center justify-between gap-8 xl:grid-cols-3"
1483
+ "relative z-999 flex w-full items-center justify-between gap-4"
1480
1484
  ),
1481
1485
  children: [
1482
1486
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -1751,7 +1755,7 @@ var FeaturedLink = ({ link, optixFlowConfig }) => {
1751
1755
  Pressable,
1752
1756
  {
1753
1757
  href: getLinkUrl(link),
1754
- className: "group relative flex w-full overflow-hidden rounded-xl bg-muted px-4 pt-12 pb-4",
1758
+ className: "group relative flex w-full overflow-hidden rounded-xl bg-muted px-4 pt-24 pb-4",
1755
1759
  children: [
1756
1760
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 flex w-full items-center gap-6", children: [
1757
1761
  /* @__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(
@@ -1762,7 +1766,7 @@ var FeaturedLink = ({ link, optixFlowConfig }) => {
1762
1766
  className: "m-auto stroke-white"
1763
1767
  }
1764
1768
  ) : null }),
1765
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 text-white text-shadow-lg", children: [
1769
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col text-white text-shadow-lg", children: [
1766
1770
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-lg font-semibold", children: link.label }),
1767
1771
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium", children: link.description })
1768
1772
  ] })
@@ -1866,10 +1870,10 @@ var renderMobileMenuItem = (item, index) => {
1866
1870
  className: "border-b-0",
1867
1871
  children: [
1868
1872
  /* @__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: [
1873
+ /* @__PURE__ */ jsxRuntime.jsxs(AccordionContent, { className: "flex flex-col py-6 px-0", children: [
1874
+ item.featuredLinks && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4", children: item.featuredLinks.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(NavLink, { link }, `default-nav-link-${idx}`)) }),
1875
+ item.links && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4", children: item.links.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(NavLink, { link }, `default-nav-link-${idx}`)) }),
1876
+ item.groupLinks && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4", children: item.groupLinks.map((group, groupIdx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
1873
1877
  group.label && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 text-xs text-muted-foreground", children: group.label }),
1874
1878
  /* @__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
1879
  ] }, `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,14 +1148,17 @@ 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",
1155
1156
  {
1156
1157
  onClick: onClose,
1157
- 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
+ className: cn(
1159
+ "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",
1160
+ closeIconClassName
1161
+ ),
1158
1162
  "aria-label": "Close mobile menu",
1159
1163
  children: [
1160
1164
  /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -1451,7 +1455,7 @@ var NavbarAnimatedPreview = ({
1451
1455
  "div",
1452
1456
  {
1453
1457
  className: cn(
1454
- "relative z-999 grid w-full grid-cols-2 items-center justify-between gap-8 xl:grid-cols-3"
1458
+ "relative z-999 flex w-full items-center justify-between gap-4"
1455
1459
  ),
1456
1460
  children: [
1457
1461
  /* @__PURE__ */ jsx(
@@ -1726,7 +1730,7 @@ var FeaturedLink = ({ link, optixFlowConfig }) => {
1726
1730
  Pressable,
1727
1731
  {
1728
1732
  href: getLinkUrl(link),
1729
- className: "group relative flex w-full overflow-hidden rounded-xl bg-muted px-4 pt-12 pb-4",
1733
+ className: "group relative flex w-full overflow-hidden rounded-xl bg-muted px-4 pt-24 pb-4",
1730
1734
  children: [
1731
1735
  /* @__PURE__ */ jsxs("div", { className: "relative z-10 flex w-full items-center gap-6", children: [
1732
1736
  /* @__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(
@@ -1737,7 +1741,7 @@ var FeaturedLink = ({ link, optixFlowConfig }) => {
1737
1741
  className: "m-auto stroke-white"
1738
1742
  }
1739
1743
  ) : null }),
1740
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 text-white text-shadow-lg", children: [
1744
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col text-white text-shadow-lg", children: [
1741
1745
  /* @__PURE__ */ jsx("div", { className: "text-lg font-semibold", children: link.label }),
1742
1746
  /* @__PURE__ */ jsx("div", { className: "font-medium", children: link.description })
1743
1747
  ] })
@@ -1841,10 +1845,10 @@ var renderMobileMenuItem = (item, index) => {
1841
1845
  className: "border-b-0",
1842
1846
  children: [
1843
1847
  /* @__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: [
1848
+ /* @__PURE__ */ jsxs(AccordionContent, { className: "flex flex-col py-6 px-0", children: [
1849
+ item.featuredLinks && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4", children: item.featuredLinks.map((link, idx) => /* @__PURE__ */ jsx(NavLink, { link }, `default-nav-link-${idx}`)) }),
1850
+ item.links && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4", children: item.links.map((link, idx) => /* @__PURE__ */ jsx(NavLink, { link }, `default-nav-link-${idx}`)) }),
1851
+ item.groupLinks && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4", children: item.groupLinks.map((group, groupIdx) => /* @__PURE__ */ jsxs("div", { className: "relative", children: [
1848
1852
  group.label && /* @__PURE__ */ jsx("div", { className: "mb-4 text-xs text-muted-foreground", children: group.label }),
1849
1853
  /* @__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
1854
  ] }, `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,14 +1121,17 @@ 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",
1128
1129
  {
1129
1130
  onClick: onClose,
1130
- 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
+ className: cn(
1132
+ "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
+ closeIconClassName
1134
+ ),
1131
1135
  "aria-label": "Close mobile menu",
1132
1136
  children: [
1133
1137
  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1098,17 @@ 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",
1105
1106
  {
1106
1107
  onClick: onClose,
1107
- 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
+ className: cn(
1109
+ "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",
1110
+ closeIconClassName
1111
+ ),
1108
1112
  "aria-label": "Close mobile menu",
1109
1113
  children: [
1110
1114
  /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1168,17 @@ 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",
1175
1176
  {
1176
1177
  onClick: onClose,
1177
- 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
+ className: cn(
1179
+ "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",
1180
+ closeIconClassName
1181
+ ),
1178
1182
  "aria-label": "Close mobile menu",
1179
1183
  children: [
1180
1184
  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1145,17 @@ 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",
1152
1153
  {
1153
1154
  onClick: onClose,
1154
- 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
+ className: cn(
1156
+ "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",
1157
+ closeIconClassName
1158
+ ),
1155
1159
  "aria-label": "Close mobile menu",
1156
1160
  children: [
1157
1161
  /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1168,17 @@ 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",
1175
1176
  {
1176
1177
  onClick: onClose,
1177
- 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
+ className: cn(
1179
+ "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",
1180
+ closeIconClassName
1181
+ ),
1178
1182
  "aria-label": "Close mobile menu",
1179
1183
  children: [
1180
1184
  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1145,17 @@ 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",
1152
1153
  {
1153
1154
  onClick: onClose,
1154
- 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
+ className: cn(
1156
+ "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",
1157
+ closeIconClassName
1158
+ ),
1155
1159
  "aria-label": "Close mobile menu",
1156
1160
  children: [
1157
1161
  /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1250,17 @@ 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",
1257
1258
  {
1258
1259
  onClick: onClose,
1259
- 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
+ className: cn(
1261
+ "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",
1262
+ closeIconClassName
1263
+ ),
1260
1264
  "aria-label": "Close mobile menu",
1261
1265
  children: [
1262
1266
  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1226,17 @@ 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",
1233
1234
  {
1234
1235
  onClick: onClose,
1235
- 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
+ className: cn(
1237
+ "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
+ closeIconClassName
1239
+ ),
1236
1240
  "aria-label": "Close mobile menu",
1237
1241
  children: [
1238
1242
  /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1168,17 @@ 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",
1175
1176
  {
1176
1177
  onClick: onClose,
1177
- 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
+ className: cn(
1179
+ "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",
1180
+ closeIconClassName
1181
+ ),
1178
1182
  "aria-label": "Close mobile menu",
1179
1183
  children: [
1180
1184
  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1145,17 @@ 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",
1152
1153
  {
1153
1154
  onClick: onClose,
1154
- 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
+ className: cn(
1156
+ "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",
1157
+ closeIconClassName
1158
+ ),
1155
1159
  "aria-label": "Close mobile menu",
1156
1160
  children: [
1157
1161
  /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1168,17 @@ 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",
1175
1176
  {
1176
1177
  onClick: onClose,
1177
- 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
+ className: cn(
1179
+ "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",
1180
+ closeIconClassName
1181
+ ),
1178
1182
  "aria-label": "Close mobile menu",
1179
1183
  children: [
1180
1184
  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1145,17 @@ 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",
1152
1153
  {
1153
1154
  onClick: onClose,
1154
- 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
+ className: cn(
1156
+ "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",
1157
+ closeIconClassName
1158
+ ),
1155
1159
  "aria-label": "Close mobile menu",
1156
1160
  children: [
1157
1161
  /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1065,17 @@ 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",
1072
1073
  {
1073
1074
  onClick: onClose,
1074
- 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
+ className: cn(
1076
+ "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",
1077
+ closeIconClassName
1078
+ ),
1075
1079
  "aria-label": "Close mobile menu",
1076
1080
  children: [
1077
1081
  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1042,17 @@ 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",
1049
1050
  {
1050
1051
  onClick: onClose,
1051
- 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
+ className: cn(
1053
+ "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",
1054
+ closeIconClassName
1055
+ ),
1052
1056
  "aria-label": "Close mobile menu",
1053
1057
  children: [
1054
1058
  /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
@@ -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,14 +1228,17 @@ 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",
1235
1236
  {
1236
1237
  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
+ className: cn(
1239
+ "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",
1240
+ closeIconClassName
1241
+ ),
1238
1242
  "aria-label": "Close mobile menu",
1239
1243
  children: [
1240
1244
  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),