@opensite/ui 3.4.9 → 3.5.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 (133) hide show
  1. package/dist/components.cjs +13 -7
  2. package/dist/components.js +13 -7
  3. package/dist/footer-accordion-social.cjs +1 -1
  4. package/dist/footer-accordion-social.js +1 -1
  5. package/dist/footer-animated-social.cjs +1 -1
  6. package/dist/footer-animated-social.js +1 -1
  7. package/dist/footer-background-card.cjs +1 -1
  8. package/dist/footer-background-card.js +1 -1
  9. package/dist/footer-brand-description.cjs +1 -0
  10. package/dist/footer-brand-description.js +1 -0
  11. package/dist/footer-brand-links-contact.cjs +1 -1
  12. package/dist/footer-brand-links-contact.js +1 -1
  13. package/dist/footer-comprehensive-links.cjs +1 -1
  14. package/dist/footer-comprehensive-links.js +1 -1
  15. package/dist/footer-contact-card.cjs +1 -1
  16. package/dist/footer-contact-card.js +1 -1
  17. package/dist/footer-cta-banner.cjs +1 -1
  18. package/dist/footer-cta-banner.js +1 -1
  19. package/dist/footer-cta-social.cjs +1 -1
  20. package/dist/footer-cta-social.js +1 -1
  21. package/dist/footer-info-cards-accordion.cjs +1 -1
  22. package/dist/footer-info-cards-accordion.js +1 -1
  23. package/dist/footer-links-grid.cjs +1 -0
  24. package/dist/footer-links-grid.js +1 -0
  25. package/dist/footer-nav-social.cjs +1 -0
  26. package/dist/footer-nav-social.js +1 -0
  27. package/dist/footer-newsletter-contact.cjs +1 -1
  28. package/dist/footer-newsletter-contact.js +1 -1
  29. package/dist/footer-newsletter-grid.cjs +1 -0
  30. package/dist/footer-newsletter-grid.js +1 -0
  31. package/dist/footer-newsletter-minimal.cjs +1 -1
  32. package/dist/footer-newsletter-minimal.js +1 -1
  33. package/dist/footer-simple-centered.cjs +1 -1
  34. package/dist/footer-simple-centered.js +1 -1
  35. package/dist/footer-social-apps.cjs +1 -0
  36. package/dist/footer-social-apps.js +1 -0
  37. package/dist/footer-social-newsletter.cjs +1 -0
  38. package/dist/footer-social-newsletter.js +1 -0
  39. package/dist/footer-split-image-accordion.cjs +1 -1
  40. package/dist/footer-split-image-accordion.js +1 -1
  41. package/dist/hero-stats-social-proof.cjs +35 -5
  42. package/dist/hero-stats-social-proof.d.cts +1 -1
  43. package/dist/hero-stats-social-proof.d.ts +1 -1
  44. package/dist/hero-stats-social-proof.js +19 -4
  45. package/dist/index.cjs +13 -7
  46. package/dist/index.js +13 -7
  47. package/dist/navbar-animated-preview.cjs +1 -0
  48. package/dist/navbar-animated-preview.d.cts +15 -1
  49. package/dist/navbar-animated-preview.d.ts +15 -1
  50. package/dist/navbar-animated-preview.js +1 -0
  51. package/dist/navbar-centered-menu.cjs +1 -1
  52. package/dist/navbar-centered-menu.d.cts +15 -1
  53. package/dist/navbar-centered-menu.d.ts +15 -1
  54. package/dist/navbar-centered-menu.js +1 -1
  55. package/dist/navbar-dark-icons.cjs +1 -1
  56. package/dist/navbar-dark-icons.d.cts +15 -1
  57. package/dist/navbar-dark-icons.d.ts +15 -1
  58. package/dist/navbar-dark-icons.js +1 -1
  59. package/dist/navbar-dropdown-menu.cjs +1 -1
  60. package/dist/navbar-dropdown-menu.d.cts +15 -1
  61. package/dist/navbar-dropdown-menu.d.ts +15 -1
  62. package/dist/navbar-dropdown-menu.js +1 -1
  63. package/dist/navbar-education-platform.cjs +1 -0
  64. package/dist/navbar-education-platform.d.cts +15 -1
  65. package/dist/navbar-education-platform.d.ts +15 -1
  66. package/dist/navbar-education-platform.js +1 -0
  67. package/dist/navbar-enterprise-mega.cjs +2 -1
  68. package/dist/navbar-enterprise-mega.d.cts +15 -1
  69. package/dist/navbar-enterprise-mega.d.ts +15 -1
  70. package/dist/navbar-enterprise-mega.js +2 -1
  71. package/dist/navbar-feature-grid.cjs +1 -1
  72. package/dist/navbar-feature-grid.d.cts +19 -1
  73. package/dist/navbar-feature-grid.d.ts +19 -1
  74. package/dist/navbar-feature-grid.js +1 -1
  75. package/dist/navbar-floating-pill.cjs +1 -1
  76. package/dist/navbar-floating-pill.d.cts +15 -1
  77. package/dist/navbar-floating-pill.d.ts +15 -1
  78. package/dist/navbar-floating-pill.js +1 -1
  79. package/dist/navbar-fullscreen-menu.cjs +1 -0
  80. package/dist/navbar-fullscreen-menu.d.cts +15 -1
  81. package/dist/navbar-fullscreen-menu.d.ts +15 -1
  82. package/dist/navbar-fullscreen-menu.js +1 -0
  83. package/dist/navbar-icon-links.cjs +1 -1
  84. package/dist/navbar-icon-links.d.cts +15 -1
  85. package/dist/navbar-icon-links.d.ts +15 -1
  86. package/dist/navbar-icon-links.js +1 -1
  87. package/dist/navbar-image-preview.cjs +1 -1
  88. package/dist/navbar-image-preview.d.cts +15 -1
  89. package/dist/navbar-image-preview.d.ts +15 -1
  90. package/dist/navbar-image-preview.js +1 -1
  91. package/dist/navbar-mega-menu.cjs +1 -1
  92. package/dist/navbar-mega-menu.d.cts +15 -1
  93. package/dist/navbar-mega-menu.d.ts +15 -1
  94. package/dist/navbar-mega-menu.js +1 -1
  95. package/dist/navbar-multi-column-groups.cjs +1 -0
  96. package/dist/navbar-multi-column-groups.d.cts +15 -1
  97. package/dist/navbar-multi-column-groups.d.ts +15 -1
  98. package/dist/navbar-multi-column-groups.js +1 -0
  99. package/dist/navbar-platform-resources.cjs +40 -7
  100. package/dist/navbar-platform-resources.d.cts +16 -2
  101. package/dist/navbar-platform-resources.d.ts +16 -2
  102. package/dist/navbar-platform-resources.js +40 -7
  103. package/dist/navbar-search-focused.cjs +1 -0
  104. package/dist/navbar-search-focused.d.cts +19 -1
  105. package/dist/navbar-search-focused.d.ts +19 -1
  106. package/dist/navbar-search-focused.js +1 -0
  107. package/dist/navbar-sidebar-mobile.cjs +1 -0
  108. package/dist/navbar-sidebar-mobile.d.cts +15 -1
  109. package/dist/navbar-sidebar-mobile.d.ts +15 -1
  110. package/dist/navbar-sidebar-mobile.js +1 -0
  111. package/dist/navbar-simple-links.cjs +1 -0
  112. package/dist/navbar-simple-links.d.cts +19 -1
  113. package/dist/navbar-simple-links.d.ts +19 -1
  114. package/dist/navbar-simple-links.js +1 -0
  115. package/dist/navbar-split-cta.cjs +1 -1
  116. package/dist/navbar-split-cta.d.cts +15 -1
  117. package/dist/navbar-split-cta.d.ts +15 -1
  118. package/dist/navbar-split-cta.js +1 -1
  119. package/dist/navbar-sticky-compact.cjs +1 -0
  120. package/dist/navbar-sticky-compact.d.cts +15 -1
  121. package/dist/navbar-sticky-compact.d.ts +15 -1
  122. package/dist/navbar-sticky-compact.js +1 -0
  123. package/dist/navbar-tabbed-sections.cjs +1 -1
  124. package/dist/navbar-tabbed-sections.d.cts +15 -1
  125. package/dist/navbar-tabbed-sections.d.ts +15 -1
  126. package/dist/navbar-tabbed-sections.js +1 -1
  127. package/dist/navbar-transparent-overlay.cjs +1 -0
  128. package/dist/navbar-transparent-overlay.d.cts +15 -1
  129. package/dist/navbar-transparent-overlay.d.ts +15 -1
  130. package/dist/navbar-transparent-overlay.js +1 -0
  131. package/dist/registry.cjs +81 -32
  132. package/dist/registry.js +81 -32
  133. package/package.json +1 -1
@@ -53,7 +53,7 @@ interface HeroStatsSocialProofProps {
53
53
  statusCard?: {
54
54
  title?: React.ReactNode;
55
55
  subtitle?: React.ReactNode;
56
- icon?: React.ReactNode;
56
+ icon?: React.ReactNode | string;
57
57
  };
58
58
  /**
59
59
  * Custom slot for status card (overrides statusCard)
@@ -53,7 +53,7 @@ interface HeroStatsSocialProofProps {
53
53
  statusCard?: {
54
54
  title?: React.ReactNode;
55
55
  subtitle?: React.ReactNode;
56
- icon?: React.ReactNode;
56
+ icon?: React.ReactNode | string;
57
57
  };
58
58
  /**
59
59
  * Custom slot for status card (overrides statusCard)
@@ -1,5 +1,6 @@
1
1
  "use client";
2
- import React, { useMemo } from 'react';
2
+ import * as React from 'react';
3
+ import React__default, { useMemo } from 'react';
3
4
  import { clsx } from 'clsx';
4
5
  import { twMerge } from 'tailwind-merge';
5
6
  import { Img } from '@page-speed/img';
@@ -7,6 +8,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
7
8
  import { Pressable, buttonVariants } from '@page-speed/pressable';
8
9
  import { Slot } from '@radix-ui/react-slot';
9
10
  import { cva } from 'class-variance-authority';
11
+ import { Icon } from '@page-speed/icon';
10
12
 
11
13
  // components/blocks/hero/hero-stats-social-proof.tsx
12
14
  function cn(...inputs) {
@@ -21,7 +23,7 @@ var maxWidthStyles = {
21
23
  "4xl": "max-w-[1536px]",
22
24
  full: "max-w-full"
23
25
  };
24
- var Container = React.forwardRef(
26
+ var Container = React__default.forwardRef(
25
27
  ({ children, maxWidth = "xl", className, as = "div", ...props }, ref) => {
26
28
  const Component = as;
27
29
  return /* @__PURE__ */ jsx(
@@ -327,7 +329,7 @@ var spacingStyles = {
327
329
  };
328
330
  var predefinedSpacings = ["none", "sm", "md", "lg", "xl", "hero"];
329
331
  var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);
330
- var Section = React.forwardRef(
332
+ var Section = React__default.forwardRef(
331
333
  ({
332
334
  id,
333
335
  title,
@@ -420,6 +422,19 @@ function Badge({
420
422
  }
421
423
  );
422
424
  }
425
+ var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
426
+ var DynamicIcon = React.memo(function DynamicIcon2({
427
+ apiKey,
428
+ name,
429
+ ...props
430
+ }) {
431
+ if (name == null) return null;
432
+ if (typeof name !== "string") {
433
+ return /* @__PURE__ */ jsx(Fragment, { children: name });
434
+ }
435
+ return /* @__PURE__ */ jsx(Icon, { ...props, name, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
436
+ });
437
+ DynamicIcon.displayName = "DynamicIcon";
423
438
  var MOBILE_CLASSES = {
424
439
  "fit-left": "items-start md:items-center",
425
440
  "fit-center": "items-center",
@@ -547,7 +562,7 @@ function HeroStatsSocialProof({
547
562
  "pr-4 md:pr-6 shadow-2xl bg-card text-card-foreground"
548
563
  ),
549
564
  children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
550
- statusCard.icon && /* @__PURE__ */ jsx("div", { className: "flex shrink-0 h-12 w-12 items-center justify-center rounded-full bg-primary text-primary-foreground shadow-lg", children: statusCard.icon }),
565
+ statusCard.icon ? /* @__PURE__ */ jsx("div", { className: "flex shrink-0 h-12 w-12 items-center justify-center rounded-full bg-primary text-primary-foreground shadow-lg", children: /* @__PURE__ */ jsx(DynamicIcon, { name: statusCard.icon }) }) : null,
551
566
  /* @__PURE__ */ jsxs("div", { className: "text-balance", children: [
552
567
  statusCard.title && /* @__PURE__ */ jsx("div", { className: "font-semibold text-sm md:text-md leading-snug", children: statusCard.title }),
553
568
  statusCard.subtitle && /* @__PURE__ */ jsx("div", { className: "text-sm leading-snug tracking-tight", children: statusCard.subtitle })
package/dist/index.cjs CHANGED
@@ -4495,6 +4495,7 @@ function FooterLinksGrid({
4495
4495
  return /* @__PURE__ */ jsxRuntime.jsx(
4496
4496
  Section,
4497
4497
  {
4498
+ id: "footer-links-grid",
4498
4499
  background,
4499
4500
  spacing,
4500
4501
  pattern,
@@ -4613,6 +4614,7 @@ function FooterSocialNewsletter({
4613
4614
  return /* @__PURE__ */ jsxRuntime.jsx(
4614
4615
  Section,
4615
4616
  {
4617
+ id: "footer-social-newsletter",
4616
4618
  background,
4617
4619
  spacing,
4618
4620
  pattern,
@@ -4770,6 +4772,7 @@ function FooterSocialApps({
4770
4772
  return /* @__PURE__ */ jsxRuntime.jsx(
4771
4773
  Section,
4772
4774
  {
4775
+ id: "footer-social-apps",
4773
4776
  background,
4774
4777
  spacing,
4775
4778
  pattern,
@@ -4885,7 +4888,7 @@ function FooterSimpleCentered({
4885
4888
  return /* @__PURE__ */ jsxRuntime.jsx(
4886
4889
  Section,
4887
4890
  {
4888
- id: sectionId,
4891
+ id: "footer-simple-centered",
4889
4892
  background,
4890
4893
  spacing,
4891
4894
  pattern,
@@ -5015,6 +5018,7 @@ function FooterBrandDescription({
5015
5018
  return /* @__PURE__ */ jsxRuntime.jsx(
5016
5019
  Section,
5017
5020
  {
5021
+ id: "footer-brand-description",
5018
5022
  background,
5019
5023
  spacing,
5020
5024
  pattern,
@@ -5226,6 +5230,7 @@ function FooterNewsletterGrid({
5226
5230
  return /* @__PURE__ */ jsxRuntime.jsx(
5227
5231
  Section,
5228
5232
  {
5233
+ id: "footer-newsletter-grid",
5229
5234
  background,
5230
5235
  spacing,
5231
5236
  pattern,
@@ -5342,7 +5347,7 @@ function FooterCtaBanner({
5342
5347
  return /* @__PURE__ */ jsxRuntime.jsx(
5343
5348
  Section,
5344
5349
  {
5345
- id: sectionId,
5350
+ id: "footer-cta-banner",
5346
5351
  background,
5347
5352
  spacing,
5348
5353
  pattern,
@@ -5563,7 +5568,7 @@ function FooterContactCard({
5563
5568
  return /* @__PURE__ */ jsxRuntime.jsx(
5564
5569
  Section,
5565
5570
  {
5566
- id: sectionId,
5571
+ id: "footer-contact-card",
5567
5572
  background,
5568
5573
  spacing,
5569
5574
  pattern,
@@ -5748,7 +5753,7 @@ function FooterBackgroundCard({
5748
5753
  return /* @__PURE__ */ jsxRuntime.jsx(
5749
5754
  Section,
5750
5755
  {
5751
- id: sectionId,
5756
+ id: "footer-background-card",
5752
5757
  background,
5753
5758
  spacing,
5754
5759
  pattern,
@@ -6048,7 +6053,7 @@ function FooterAnimatedSocial({
6048
6053
  return /* @__PURE__ */ jsxRuntime.jsx(
6049
6054
  Section,
6050
6055
  {
6051
- id: sectionId,
6056
+ id: "footer-animated-social",
6052
6057
  background,
6053
6058
  spacing,
6054
6059
  pattern,
@@ -6316,7 +6321,7 @@ function FooterNewsletterMinimal({
6316
6321
  return /* @__PURE__ */ jsxRuntime.jsx(
6317
6322
  Section,
6318
6323
  {
6319
- id: sectionId,
6324
+ id: "footer-newsletter-minimal",
6320
6325
  background,
6321
6326
  spacing,
6322
6327
  pattern,
@@ -6533,7 +6538,7 @@ function FooterCtaSocial({
6533
6538
  return /* @__PURE__ */ jsxRuntime.jsx(
6534
6539
  Section,
6535
6540
  {
6536
- id: sectionId,
6541
+ id: "footer-cta-social",
6537
6542
  background,
6538
6543
  spacing,
6539
6544
  pattern,
@@ -6668,6 +6673,7 @@ function FooterNavSocial({
6668
6673
  return /* @__PURE__ */ jsxRuntime.jsx(
6669
6674
  Section,
6670
6675
  {
6676
+ id: "footer-nav-social",
6671
6677
  background,
6672
6678
  spacing,
6673
6679
  pattern,
package/dist/index.js CHANGED
@@ -4473,6 +4473,7 @@ function FooterLinksGrid({
4473
4473
  return /* @__PURE__ */ jsx(
4474
4474
  Section,
4475
4475
  {
4476
+ id: "footer-links-grid",
4476
4477
  background,
4477
4478
  spacing,
4478
4479
  pattern,
@@ -4591,6 +4592,7 @@ function FooterSocialNewsletter({
4591
4592
  return /* @__PURE__ */ jsx(
4592
4593
  Section,
4593
4594
  {
4595
+ id: "footer-social-newsletter",
4594
4596
  background,
4595
4597
  spacing,
4596
4598
  pattern,
@@ -4748,6 +4750,7 @@ function FooterSocialApps({
4748
4750
  return /* @__PURE__ */ jsx(
4749
4751
  Section,
4750
4752
  {
4753
+ id: "footer-social-apps",
4751
4754
  background,
4752
4755
  spacing,
4753
4756
  pattern,
@@ -4863,7 +4866,7 @@ function FooterSimpleCentered({
4863
4866
  return /* @__PURE__ */ jsx(
4864
4867
  Section,
4865
4868
  {
4866
- id: sectionId,
4869
+ id: "footer-simple-centered",
4867
4870
  background,
4868
4871
  spacing,
4869
4872
  pattern,
@@ -4993,6 +4996,7 @@ function FooterBrandDescription({
4993
4996
  return /* @__PURE__ */ jsx(
4994
4997
  Section,
4995
4998
  {
4999
+ id: "footer-brand-description",
4996
5000
  background,
4997
5001
  spacing,
4998
5002
  pattern,
@@ -5204,6 +5208,7 @@ function FooterNewsletterGrid({
5204
5208
  return /* @__PURE__ */ jsx(
5205
5209
  Section,
5206
5210
  {
5211
+ id: "footer-newsletter-grid",
5207
5212
  background,
5208
5213
  spacing,
5209
5214
  pattern,
@@ -5320,7 +5325,7 @@ function FooterCtaBanner({
5320
5325
  return /* @__PURE__ */ jsx(
5321
5326
  Section,
5322
5327
  {
5323
- id: sectionId,
5328
+ id: "footer-cta-banner",
5324
5329
  background,
5325
5330
  spacing,
5326
5331
  pattern,
@@ -5541,7 +5546,7 @@ function FooterContactCard({
5541
5546
  return /* @__PURE__ */ jsx(
5542
5547
  Section,
5543
5548
  {
5544
- id: sectionId,
5549
+ id: "footer-contact-card",
5545
5550
  background,
5546
5551
  spacing,
5547
5552
  pattern,
@@ -5726,7 +5731,7 @@ function FooterBackgroundCard({
5726
5731
  return /* @__PURE__ */ jsx(
5727
5732
  Section,
5728
5733
  {
5729
- id: sectionId,
5734
+ id: "footer-background-card",
5730
5735
  background,
5731
5736
  spacing,
5732
5737
  pattern,
@@ -6026,7 +6031,7 @@ function FooterAnimatedSocial({
6026
6031
  return /* @__PURE__ */ jsx(
6027
6032
  Section,
6028
6033
  {
6029
- id: sectionId,
6034
+ id: "footer-animated-social",
6030
6035
  background,
6031
6036
  spacing,
6032
6037
  pattern,
@@ -6294,7 +6299,7 @@ function FooterNewsletterMinimal({
6294
6299
  return /* @__PURE__ */ jsx(
6295
6300
  Section,
6296
6301
  {
6297
- id: sectionId,
6302
+ id: "footer-newsletter-minimal",
6298
6303
  background,
6299
6304
  spacing,
6300
6305
  pattern,
@@ -6511,7 +6516,7 @@ function FooterCtaSocial({
6511
6516
  return /* @__PURE__ */ jsx(
6512
6517
  Section,
6513
6518
  {
6514
- id: sectionId,
6519
+ id: "footer-cta-social",
6515
6520
  background,
6516
6521
  spacing,
6517
6522
  pattern,
@@ -6646,6 +6651,7 @@ function FooterNavSocial({
6646
6651
  return /* @__PURE__ */ jsx(
6647
6652
  Section,
6648
6653
  {
6654
+ id: "footer-nav-social",
6649
6655
  background,
6650
6656
  spacing,
6651
6657
  pattern,
@@ -938,6 +938,7 @@ var NavbarAnimatedPreview = ({
938
938
  /* @__PURE__ */ jsxRuntime.jsx(
939
939
  Section,
940
940
  {
941
+ id: "navbar-animated-preview",
941
942
  background,
942
943
  spacing: spacingOverride ?? spacing,
943
944
  className: cn(
@@ -38,6 +38,20 @@ interface IMenuLink {
38
38
  * Props for the NavbarAnimatedPreview component
39
39
  */
40
40
  interface NavbarAnimatedPreviewProps {
41
+ /**
42
+ * Logo configuration
43
+ */
44
+ logo?: LogoConfig;
45
+ /**
46
+ * Navigation menu links with optional dropdown groups
47
+ */
48
+ menuLinks?: IMenuLink[];
49
+ /**
50
+ * Action configurations (e.g., Sign In, Get Started buttons)
51
+ */
52
+ actions?: ActionConfig[];
53
+ }
54
+ interface NavbarAnimatedPreviewRuntimeProps {
41
55
  /**
42
56
  * Additional CSS classes for the section
43
57
  */
@@ -120,6 +134,6 @@ interface NavbarAnimatedPreviewProps {
120
134
  * menu spans full width with smooth fade-in animations. Mobile view uses a full-screen sheet with
121
135
  * accordion navigation. Ideal for complex SaaS products and developer platforms.
122
136
  */
123
- declare const NavbarAnimatedPreview: ({ className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, logo, logoSlot, logoClassName, menuLinks, navigationSlot, actions, actionsSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarAnimatedPreviewProps) => react_jsx_runtime.JSX.Element;
137
+ declare const NavbarAnimatedPreview: ({ className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, logo, logoSlot, logoClassName, menuLinks, navigationSlot, actions, actionsSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarAnimatedPreviewRuntimeProps) => react_jsx_runtime.JSX.Element;
124
138
 
125
139
  export { type AnimatedPreviewLayout, type IFeaturedImageLink, ILinkItem, type IMenuLink, IMenuLinkGroup, LogoConfig, NavbarAnimatedPreview, type NavbarAnimatedPreviewProps };
@@ -38,6 +38,20 @@ interface IMenuLink {
38
38
  * Props for the NavbarAnimatedPreview component
39
39
  */
40
40
  interface NavbarAnimatedPreviewProps {
41
+ /**
42
+ * Logo configuration
43
+ */
44
+ logo?: LogoConfig;
45
+ /**
46
+ * Navigation menu links with optional dropdown groups
47
+ */
48
+ menuLinks?: IMenuLink[];
49
+ /**
50
+ * Action configurations (e.g., Sign In, Get Started buttons)
51
+ */
52
+ actions?: ActionConfig[];
53
+ }
54
+ interface NavbarAnimatedPreviewRuntimeProps {
41
55
  /**
42
56
  * Additional CSS classes for the section
43
57
  */
@@ -120,6 +134,6 @@ interface NavbarAnimatedPreviewProps {
120
134
  * menu spans full width with smooth fade-in animations. Mobile view uses a full-screen sheet with
121
135
  * accordion navigation. Ideal for complex SaaS products and developer platforms.
122
136
  */
123
- declare const NavbarAnimatedPreview: ({ className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, logo, logoSlot, logoClassName, menuLinks, navigationSlot, actions, actionsSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarAnimatedPreviewProps) => react_jsx_runtime.JSX.Element;
137
+ declare const NavbarAnimatedPreview: ({ className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, logo, logoSlot, logoClassName, menuLinks, navigationSlot, actions, actionsSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarAnimatedPreviewRuntimeProps) => react_jsx_runtime.JSX.Element;
124
138
 
125
139
  export { type AnimatedPreviewLayout, type IFeaturedImageLink, ILinkItem, type IMenuLink, IMenuLinkGroup, LogoConfig, NavbarAnimatedPreview, type NavbarAnimatedPreviewProps };
@@ -913,6 +913,7 @@ var NavbarAnimatedPreview = ({
913
913
  /* @__PURE__ */ jsx(
914
914
  Section,
915
915
  {
916
+ id: "navbar-animated-preview",
916
917
  background,
917
918
  spacing: spacingOverride ?? spacing,
918
919
  className: cn(
@@ -860,7 +860,7 @@ var NavbarCenteredMenu = ({
860
860
  return /* @__PURE__ */ jsxRuntime.jsx(
861
861
  Section,
862
862
  {
863
- id: sectionId,
863
+ id: "navbar-centered-menu",
864
864
  background,
865
865
  spacing: spacingOverride ?? spacing,
866
866
  className: sectionClasses,
@@ -24,6 +24,20 @@ interface MenuItem {
24
24
  * Props for the NavbarCenteredMenu component
25
25
  */
26
26
  interface NavbarCenteredMenuProps {
27
+ /**
28
+ * Logo configuration
29
+ */
30
+ logo?: LogoConfig;
31
+ /**
32
+ * Navigation menu items
33
+ */
34
+ menu?: MenuItem[];
35
+ /**
36
+ * Authentication action configurations
37
+ */
38
+ authActions?: ActionConfig[];
39
+ }
40
+ interface NavbarCenteredMenuRuntimeProps {
27
41
  /**
28
42
  * Additional CSS classes for the section
29
43
  */
@@ -111,6 +125,6 @@ interface NavbarCenteredMenuProps {
111
125
  * slide-out sheet with accordion navigation. The dropdowns are centered under their
112
126
  * trigger elements for a balanced visual appearance.
113
127
  */
114
- declare const NavbarCenteredMenu: ({ sectionId, logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, desktopNavClassName, mobileNavClassName, navigationMenuClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarCenteredMenuProps) => react_jsx_runtime.JSX.Element;
128
+ declare const NavbarCenteredMenu: ({ sectionId, logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, desktopNavClassName, mobileNavClassName, navigationMenuClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarCenteredMenuRuntimeProps) => react_jsx_runtime.JSX.Element;
115
129
 
116
130
  export { NavbarCenteredMenu, type NavbarCenteredMenuProps };
@@ -24,6 +24,20 @@ interface MenuItem {
24
24
  * Props for the NavbarCenteredMenu component
25
25
  */
26
26
  interface NavbarCenteredMenuProps {
27
+ /**
28
+ * Logo configuration
29
+ */
30
+ logo?: LogoConfig;
31
+ /**
32
+ * Navigation menu items
33
+ */
34
+ menu?: MenuItem[];
35
+ /**
36
+ * Authentication action configurations
37
+ */
38
+ authActions?: ActionConfig[];
39
+ }
40
+ interface NavbarCenteredMenuRuntimeProps {
27
41
  /**
28
42
  * Additional CSS classes for the section
29
43
  */
@@ -111,6 +125,6 @@ interface NavbarCenteredMenuProps {
111
125
  * slide-out sheet with accordion navigation. The dropdowns are centered under their
112
126
  * trigger elements for a balanced visual appearance.
113
127
  */
114
- declare const NavbarCenteredMenu: ({ sectionId, logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, desktopNavClassName, mobileNavClassName, navigationMenuClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarCenteredMenuProps) => react_jsx_runtime.JSX.Element;
128
+ declare const NavbarCenteredMenu: ({ sectionId, logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, desktopNavClassName, mobileNavClassName, navigationMenuClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarCenteredMenuRuntimeProps) => react_jsx_runtime.JSX.Element;
115
129
 
116
130
  export { NavbarCenteredMenu, type NavbarCenteredMenuProps };
@@ -837,7 +837,7 @@ var NavbarCenteredMenu = ({
837
837
  return /* @__PURE__ */ jsx(
838
838
  Section,
839
839
  {
840
- id: sectionId,
840
+ id: "navbar-centered-menu",
841
841
  background,
842
842
  spacing: spacingOverride ?? spacing,
843
843
  className: sectionClasses,
@@ -866,7 +866,7 @@ var NavbarDarkIcons = ({
866
866
  return /* @__PURE__ */ jsxRuntime.jsxs(
867
867
  Section,
868
868
  {
869
- id: sectionId,
869
+ id: "navbar-dark-icons",
870
870
  background,
871
871
  spacing: spacingOverride ?? spacing,
872
872
  className: cn("dark pointer-events-auto relative z-999", sectionClasses),
@@ -26,6 +26,20 @@ interface MenuItem {
26
26
  * Props for the NavbarDarkIcons component
27
27
  */
28
28
  interface NavbarDarkIconsProps {
29
+ /**
30
+ * Logo configuration
31
+ */
32
+ logo?: LogoConfig;
33
+ /**
34
+ * Navigation menu items
35
+ */
36
+ navigation?: MenuItem[];
37
+ /**
38
+ * Authentication action configurations
39
+ */
40
+ authActions?: ActionConfig[];
41
+ }
42
+ interface NavbarDarkIconsRuntimeProps {
29
43
  /**
30
44
  * Additional CSS classes for the section
31
45
  */
@@ -117,6 +131,6 @@ interface NavbarDarkIconsProps {
117
131
  * view uses a full-screen dark sheet with accordion navigation. Ideal for developer
118
132
  * tools, open-source projects, and tech-focused applications.
119
133
  */
120
- declare const NavbarDarkIcons: ({ sectionId, className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, logo, logoSlot, logoClassName, navigation, navigationSlot, authActions, authActionsSlot, githubUrl, githubSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarDarkIconsProps) => react_jsx_runtime.JSX.Element;
134
+ declare const NavbarDarkIcons: ({ sectionId, className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, logo, logoSlot, logoClassName, navigation, navigationSlot, authActions, authActionsSlot, githubUrl, githubSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarDarkIconsRuntimeProps) => react_jsx_runtime.JSX.Element;
121
135
 
122
136
  export { NavbarDarkIcons, type NavbarDarkIconsProps };
@@ -26,6 +26,20 @@ interface MenuItem {
26
26
  * Props for the NavbarDarkIcons component
27
27
  */
28
28
  interface NavbarDarkIconsProps {
29
+ /**
30
+ * Logo configuration
31
+ */
32
+ logo?: LogoConfig;
33
+ /**
34
+ * Navigation menu items
35
+ */
36
+ navigation?: MenuItem[];
37
+ /**
38
+ * Authentication action configurations
39
+ */
40
+ authActions?: ActionConfig[];
41
+ }
42
+ interface NavbarDarkIconsRuntimeProps {
29
43
  /**
30
44
  * Additional CSS classes for the section
31
45
  */
@@ -117,6 +131,6 @@ interface NavbarDarkIconsProps {
117
131
  * view uses a full-screen dark sheet with accordion navigation. Ideal for developer
118
132
  * tools, open-source projects, and tech-focused applications.
119
133
  */
120
- declare const NavbarDarkIcons: ({ sectionId, className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, logo, logoSlot, logoClassName, navigation, navigationSlot, authActions, authActionsSlot, githubUrl, githubSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarDarkIconsProps) => react_jsx_runtime.JSX.Element;
134
+ declare const NavbarDarkIcons: ({ sectionId, className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, logo, logoSlot, logoClassName, navigation, navigationSlot, authActions, authActionsSlot, githubUrl, githubSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarDarkIconsRuntimeProps) => react_jsx_runtime.JSX.Element;
121
135
 
122
136
  export { NavbarDarkIcons, type NavbarDarkIconsProps };
@@ -843,7 +843,7 @@ var NavbarDarkIcons = ({
843
843
  return /* @__PURE__ */ jsxs(
844
844
  Section,
845
845
  {
846
- id: sectionId,
846
+ id: "navbar-dark-icons",
847
847
  background,
848
848
  spacing: spacingOverride ?? spacing,
849
849
  className: cn("dark pointer-events-auto relative z-999", sectionClasses),
@@ -888,7 +888,7 @@ var NavbarDropdownMenu = ({
888
888
  return /* @__PURE__ */ jsxRuntime.jsx(
889
889
  Section,
890
890
  {
891
- id: sectionId,
891
+ id: "navbar-dropdown-menu",
892
892
  background,
893
893
  spacing: spacingOverride ?? spacing,
894
894
  className: sectionClasses,
@@ -24,6 +24,20 @@ interface MenuItem {
24
24
  * Props for the NavbarDropdownMenu component
25
25
  */
26
26
  interface NavbarDropdownMenuProps {
27
+ /**
28
+ * Logo configuration
29
+ */
30
+ logo?: LogoConfig;
31
+ /**
32
+ * Navigation menu items
33
+ */
34
+ menu?: MenuItem[];
35
+ /**
36
+ * Authentication action configurations
37
+ */
38
+ authActions?: ActionConfig[];
39
+ }
40
+ interface NavbarDropdownMenuRuntimeProps {
27
41
  /**
28
42
  * Additional CSS classes for the section
29
43
  */
@@ -110,6 +124,6 @@ interface NavbarDropdownMenuProps {
110
124
  * menu with accordion navigation on mobile. Includes login and signup call-to-action buttons.
111
125
  * The dropdown menus display icons and descriptions for each submenu item.
112
126
  */
113
- declare const NavbarDropdownMenu: ({ sectionId, logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, desktopNavClassName, mobileNavClassName, navigationMenuClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarDropdownMenuProps) => react_jsx_runtime.JSX.Element;
127
+ declare const NavbarDropdownMenu: ({ sectionId, logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, desktopNavClassName, mobileNavClassName, navigationMenuClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarDropdownMenuRuntimeProps) => react_jsx_runtime.JSX.Element;
114
128
 
115
129
  export { NavbarDropdownMenu, type NavbarDropdownMenuProps };
@@ -24,6 +24,20 @@ interface MenuItem {
24
24
  * Props for the NavbarDropdownMenu component
25
25
  */
26
26
  interface NavbarDropdownMenuProps {
27
+ /**
28
+ * Logo configuration
29
+ */
30
+ logo?: LogoConfig;
31
+ /**
32
+ * Navigation menu items
33
+ */
34
+ menu?: MenuItem[];
35
+ /**
36
+ * Authentication action configurations
37
+ */
38
+ authActions?: ActionConfig[];
39
+ }
40
+ interface NavbarDropdownMenuRuntimeProps {
27
41
  /**
28
42
  * Additional CSS classes for the section
29
43
  */
@@ -110,6 +124,6 @@ interface NavbarDropdownMenuProps {
110
124
  * menu with accordion navigation on mobile. Includes login and signup call-to-action buttons.
111
125
  * The dropdown menus display icons and descriptions for each submenu item.
112
126
  */
113
- declare const NavbarDropdownMenu: ({ sectionId, logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, desktopNavClassName, mobileNavClassName, navigationMenuClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarDropdownMenuProps) => react_jsx_runtime.JSX.Element;
127
+ declare const NavbarDropdownMenu: ({ sectionId, logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, desktopNavClassName, mobileNavClassName, navigationMenuClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarDropdownMenuRuntimeProps) => react_jsx_runtime.JSX.Element;
114
128
 
115
129
  export { NavbarDropdownMenu, type NavbarDropdownMenuProps };
@@ -865,7 +865,7 @@ var NavbarDropdownMenu = ({
865
865
  return /* @__PURE__ */ jsx(
866
866
  Section,
867
867
  {
868
- id: sectionId,
868
+ id: "navbar-dropdown-menu",
869
869
  background,
870
870
  spacing: spacingOverride ?? spacing,
871
871
  className: sectionClasses,
@@ -869,6 +869,7 @@ var NavbarEducationPlatform = ({
869
869
  /* @__PURE__ */ jsxRuntime.jsx(
870
870
  Section,
871
871
  {
872
+ id: "navbar-education-platform",
872
873
  background,
873
874
  spacing: spacingOverride ?? spacing,
874
875
  className: sectionClasses,
@@ -59,6 +59,20 @@ interface MenuItem {
59
59
  * Props for the NavbarEducationPlatform component
60
60
  */
61
61
  interface NavbarEducationPlatformProps {
62
+ /**
63
+ * Logo configuration
64
+ */
65
+ logo?: LogoConfig;
66
+ /**
67
+ * Navigation menu items - can be simple links or dropdowns with grouped links
68
+ */
69
+ menu?: MenuItem[];
70
+ /**
71
+ * Authentication action configurations
72
+ */
73
+ authActions?: ActionConfig[];
74
+ }
75
+ interface NavbarEducationPlatformRuntimeProps {
62
76
  /**
63
77
  * Additional CSS classes for the section
64
78
  */
@@ -153,6 +167,6 @@ interface NavbarEducationPlatformProps {
153
167
  * Mobile view uses accordion navigation with the shared NavbarMobileMenu component.
154
168
  * Ideal for e-learning platforms, course management systems, and educational technology products.
155
169
  */
156
- declare const NavbarEducationPlatform: ({ className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, logoClassName, mobileMenuClassName, logo, logoSlot, menu, menuSlot, authActions, authActionsSlot, mobileAuthActions, mobileAuthActionsSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarEducationPlatformProps) => react_jsx_runtime.JSX.Element;
170
+ declare const NavbarEducationPlatform: ({ className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, logoClassName, mobileMenuClassName, logo, logoSlot, menu, menuSlot, authActions, authActionsSlot, mobileAuthActions, mobileAuthActionsSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarEducationPlatformRuntimeProps) => react_jsx_runtime.JSX.Element;
157
171
 
158
172
  export { NavbarEducationPlatform, type NavbarEducationPlatformProps };