@opensite/ui 2.8.7 → 2.8.9

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 (163) hide show
  1. package/dist/about-culture-tabs.cjs +174 -174
  2. package/dist/about-culture-tabs.js +174 -174
  3. package/dist/about-developer-profile.cjs +200 -200
  4. package/dist/about-developer-profile.js +198 -198
  5. package/dist/about-developer-story.cjs +142 -142
  6. package/dist/about-developer-story.js +142 -142
  7. package/dist/about-mission-dual-image.cjs +142 -142
  8. package/dist/about-mission-dual-image.js +142 -142
  9. package/dist/about-mission-features.cjs +142 -142
  10. package/dist/about-mission-features.js +142 -142
  11. package/dist/about-network-spotlight.cjs +142 -142
  12. package/dist/about-network-spotlight.js +142 -142
  13. package/dist/about-story-expertise.cjs +142 -142
  14. package/dist/about-story-expertise.js +142 -142
  15. package/dist/about-streamline-team.cjs +142 -142
  16. package/dist/about-streamline-team.js +142 -142
  17. package/dist/carousel-icon-sidebar.cjs +5 -4
  18. package/dist/carousel-icon-sidebar.js +5 -4
  19. package/dist/community-initiatives.cjs +142 -142
  20. package/dist/community-initiatives.js +142 -142
  21. package/dist/components.cjs +723 -1364
  22. package/dist/components.d.cts +0 -2
  23. package/dist/components.d.ts +0 -2
  24. package/dist/components.js +633 -1273
  25. package/dist/contact-map.cjs +14 -1069
  26. package/dist/contact-map.d.cts +13 -3
  27. package/dist/contact-map.d.ts +13 -3
  28. package/dist/contact-map.js +14 -1069
  29. package/dist/cta-feature-checklist.cjs +142 -142
  30. package/dist/cta-feature-checklist.js +142 -142
  31. package/dist/faq-numbered-grid.cjs +142 -142
  32. package/dist/faq-numbered-grid.js +142 -142
  33. package/dist/feature-animated-carousel.cjs +142 -142
  34. package/dist/feature-animated-carousel.js +142 -142
  35. package/dist/feature-bento-utilities.cjs +142 -142
  36. package/dist/feature-bento-utilities.js +142 -142
  37. package/dist/feature-capabilities-grid.cjs +142 -142
  38. package/dist/feature-capabilities-grid.js +142 -142
  39. package/dist/feature-category-image-cards.cjs +142 -142
  40. package/dist/feature-category-image-cards.js +142 -142
  41. package/dist/feature-icon-grid-bordered.cjs +142 -142
  42. package/dist/feature-icon-grid-bordered.js +142 -142
  43. package/dist/feature-icon-grid-muted.cjs +142 -142
  44. package/dist/feature-icon-grid-muted.js +142 -142
  45. package/dist/feature-numbered-cards.cjs +142 -142
  46. package/dist/feature-numbered-cards.js +142 -142
  47. package/dist/feature-three-column-values.cjs +142 -142
  48. package/dist/feature-three-column-values.js +142 -142
  49. package/dist/hero-ad-campaign-expert.cjs +142 -142
  50. package/dist/hero-ad-campaign-expert.js +142 -142
  51. package/dist/hero-adaptable-product-grid.cjs +142 -142
  52. package/dist/hero-adaptable-product-grid.js +142 -142
  53. package/dist/hero-agency-animated-images.cjs +142 -142
  54. package/dist/hero-agency-animated-images.js +142 -142
  55. package/dist/hero-announcement-badge.cjs +142 -142
  56. package/dist/hero-announcement-badge.js +142 -142
  57. package/dist/hero-badge-image-split.cjs +142 -142
  58. package/dist/hero-badge-image-split.js +142 -142
  59. package/dist/hero-business-carousel-dots.cjs +142 -142
  60. package/dist/hero-business-carousel-dots.js +142 -142
  61. package/dist/hero-business-operations-mosaic.cjs +142 -142
  62. package/dist/hero-business-operations-mosaic.js +142 -142
  63. package/dist/hero-conversation-intelligence.cjs +142 -142
  64. package/dist/hero-conversation-intelligence.js +142 -142
  65. package/dist/hero-creative-studio-stacked.cjs +142 -142
  66. package/dist/hero-creative-studio-stacked.js +142 -142
  67. package/dist/hero-crm-streamlined.cjs +142 -142
  68. package/dist/hero-crm-streamlined.js +142 -142
  69. package/dist/hero-customer-support-layered.cjs +142 -142
  70. package/dist/hero-customer-support-layered.js +142 -142
  71. package/dist/hero-design-showcase-logos.cjs +142 -142
  72. package/dist/hero-design-showcase-logos.js +142 -142
  73. package/dist/hero-design-system-3d.cjs +142 -142
  74. package/dist/hero-design-system-3d.js +142 -142
  75. package/dist/hero-developer-tools-code.cjs +142 -142
  76. package/dist/hero-developer-tools-code.js +142 -142
  77. package/dist/hero-digital-agency-fullscreen.cjs +142 -142
  78. package/dist/hero-digital-agency-fullscreen.js +142 -142
  79. package/dist/hero-ecommerce-product-showcase.cjs +174 -174
  80. package/dist/hero-ecommerce-product-showcase.js +174 -174
  81. package/dist/hero-event-registration.cjs +142 -142
  82. package/dist/hero-event-registration.js +142 -142
  83. package/dist/hero-fullscreen-background-image.cjs +142 -142
  84. package/dist/hero-fullscreen-background-image.js +142 -142
  85. package/dist/hero-gradient-avatars-rating.cjs +142 -142
  86. package/dist/hero-gradient-avatars-rating.js +142 -142
  87. package/dist/hero-gradient-client-focused.cjs +142 -142
  88. package/dist/hero-gradient-client-focused.js +142 -142
  89. package/dist/hero-hiring-animated-text.cjs +142 -142
  90. package/dist/hero-hiring-animated-text.js +142 -142
  91. package/dist/hero-image-left-content.cjs +142 -142
  92. package/dist/hero-image-left-content.js +142 -142
  93. package/dist/hero-innovation-image-grid.cjs +142 -142
  94. package/dist/hero-innovation-image-grid.js +142 -142
  95. package/dist/hero-mental-health-team.cjs +142 -142
  96. package/dist/hero-mental-health-team.js +142 -142
  97. package/dist/hero-minimal-centered-dark.cjs +174 -174
  98. package/dist/hero-minimal-centered-dark.js +174 -174
  99. package/dist/hero-presentation-platform-video.cjs +142 -142
  100. package/dist/hero-presentation-platform-video.js +142 -142
  101. package/dist/hero-product-showcase-floating.cjs +174 -174
  102. package/dist/hero-product-showcase-floating.js +174 -174
  103. package/dist/hero-shared-inbox-layered.cjs +142 -142
  104. package/dist/hero-shared-inbox-layered.js +142 -142
  105. package/dist/hero-software-growth-video-dialog.cjs +142 -142
  106. package/dist/hero-software-growth-video-dialog.js +142 -142
  107. package/dist/hero-spiral-pattern-cards.cjs +174 -174
  108. package/dist/hero-spiral-pattern-cards.js +174 -174
  109. package/dist/hero-split-geometric-shapes.cjs +142 -142
  110. package/dist/hero-split-geometric-shapes.js +142 -142
  111. package/dist/hero-startup-launch-cta.cjs +174 -174
  112. package/dist/hero-startup-launch-cta.js +174 -174
  113. package/dist/hero-stats-social-proof.cjs +174 -174
  114. package/dist/hero-stats-social-proof.js +174 -174
  115. package/dist/hero-task-timer-animated.cjs +142 -142
  116. package/dist/hero-task-timer-animated.js +142 -142
  117. package/dist/hero-testimonial-image-grid.cjs +142 -142
  118. package/dist/hero-testimonial-image-grid.js +142 -142
  119. package/dist/hero-therapy-testimonial-grid.cjs +142 -142
  120. package/dist/hero-therapy-testimonial-grid.js +142 -142
  121. package/dist/hero-ui-library-showcase.cjs +142 -142
  122. package/dist/hero-ui-library-showcase.js +142 -142
  123. package/dist/hero-video-background-dark.cjs +174 -174
  124. package/dist/hero-video-background-dark.js +174 -174
  125. package/dist/hero-video-dialog-gradient.cjs +142 -142
  126. package/dist/hero-video-dialog-gradient.js +142 -142
  127. package/dist/hero-video-overlay-stars.cjs +142 -142
  128. package/dist/hero-video-overlay-stars.js +142 -142
  129. package/dist/hero-welcome-asymmetric-images.cjs +142 -142
  130. package/dist/hero-welcome-asymmetric-images.js +142 -142
  131. package/dist/index.cjs +725 -1366
  132. package/dist/index.d.cts +0 -2
  133. package/dist/index.d.ts +0 -2
  134. package/dist/index.js +634 -1274
  135. package/dist/registry.cjs +2371 -2915
  136. package/dist/registry.js +1120 -1664
  137. package/dist/testimonials-large-quote.cjs +74 -43
  138. package/dist/testimonials-large-quote.d.cts +5 -1
  139. package/dist/testimonials-large-quote.d.ts +5 -1
  140. package/dist/testimonials-large-quote.js +74 -43
  141. package/dist/testimonials-logo-cards.cjs +8 -2
  142. package/dist/testimonials-logo-cards.js +8 -2
  143. package/dist/testimonials-masonry-grid.cjs +486 -69
  144. package/dist/testimonials-masonry-grid.d.cts +5 -1
  145. package/dist/testimonials-masonry-grid.d.ts +5 -1
  146. package/dist/testimonials-masonry-grid.js +483 -63
  147. package/dist/testimonials-mini-dividers.cjs +2 -3
  148. package/dist/testimonials-mini-dividers.js +2 -3
  149. package/dist/testimonials-minimal-numbered.cjs +5 -4
  150. package/dist/testimonials-minimal-numbered.js +5 -4
  151. package/dist/testimonials-parallax-number.cjs +5 -4
  152. package/dist/testimonials-parallax-number.js +5 -4
  153. package/dist/testimonials-scrolling-columns.cjs +7 -12
  154. package/dist/testimonials-scrolling-columns.js +7 -12
  155. package/dist/testimonials-stats-header.cjs +528 -87
  156. package/dist/testimonials-stats-header.d.cts +39 -3
  157. package/dist/testimonials-stats-header.d.ts +39 -3
  158. package/dist/testimonials-stats-header.js +523 -82
  159. package/package.json +4 -7
  160. package/dist/geo-map.cjs +0 -1103
  161. package/dist/geo-map.d.cts +0 -92
  162. package/dist/geo-map.d.ts +0 -92
  163. package/dist/geo-map.js +0 -1081
@@ -416,6 +416,148 @@ var Section = React3__namespace.default.forwardRef(
416
416
  }
417
417
  );
418
418
  Section.displayName = "Section";
419
+ var baseStyles = [
420
+ // Layout
421
+ "inline-flex items-center justify-center gap-2 whitespace-nowrap shrink-0",
422
+ // Typography - using CSS variables with sensible defaults
423
+ "font-[var(--button-font-family,inherit)]",
424
+ "font-[var(--button-font-weight,500)]",
425
+ "tracking-[var(--button-letter-spacing,0)]",
426
+ "leading-[var(--button-line-height,1.25)]",
427
+ "[text-transform:var(--button-text-transform,none)]",
428
+ "text-sm",
429
+ // Border radius
430
+ "rounded-[var(--button-radius,var(--radius,0.375rem))]",
431
+ // Smooth transition - using [transition:...] to set full shorthand property (not just transition-property)
432
+ "[transition:var(--button-transition,all_250ms_cubic-bezier(0.4,0,0.2,1))]",
433
+ // Box shadow (master level) - using [box-shadow:...] for complex multi-value shadows
434
+ "[box-shadow:var(--button-shadow,none)]",
435
+ "hover:[box-shadow:var(--button-shadow-hover,var(--button-shadow,none))]",
436
+ // Disabled state
437
+ "disabled:pointer-events-none disabled:opacity-50",
438
+ // SVG handling
439
+ "[&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0",
440
+ // Focus styles
441
+ "outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
442
+ // Invalid state
443
+ "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
444
+ ].join(" ");
445
+ var buttonVariants = classVarianceAuthority.cva(baseStyles, {
446
+ variants: {
447
+ variant: {
448
+ // Default (Primary) variant - full customization
449
+ default: [
450
+ "bg-[var(--button-default-bg,hsl(var(--primary)))]",
451
+ "text-[var(--button-default-fg,hsl(var(--primary-foreground)))]",
452
+ "border-[length:var(--button-default-border-width,0px)]",
453
+ "border-[color:var(--button-default-border,transparent)]",
454
+ "[box-shadow:var(--button-default-shadow,var(--button-shadow,none))]",
455
+ "hover:bg-[var(--button-default-hover-bg,hsl(var(--primary)/0.9))]",
456
+ "hover:text-[var(--button-default-hover-fg,var(--button-default-fg,hsl(var(--primary-foreground))))]",
457
+ "hover:border-[color:var(--button-default-hover-border,var(--button-default-border,transparent))]",
458
+ "hover:[box-shadow:var(--button-default-shadow-hover,var(--button-shadow-hover,var(--button-default-shadow,var(--button-shadow,none))))]"
459
+ ].join(" "),
460
+ // Destructive variant - full customization
461
+ destructive: [
462
+ "bg-[var(--button-destructive-bg,hsl(var(--destructive)))]",
463
+ "text-[var(--button-destructive-fg,white)]",
464
+ "border-[length:var(--button-destructive-border-width,0px)]",
465
+ "border-[color:var(--button-destructive-border,transparent)]",
466
+ "[box-shadow:var(--button-destructive-shadow,var(--button-shadow,none))]",
467
+ "hover:bg-[var(--button-destructive-hover-bg,hsl(var(--destructive)/0.9))]",
468
+ "hover:text-[var(--button-destructive-hover-fg,var(--button-destructive-fg,white))]",
469
+ "hover:border-[color:var(--button-destructive-hover-border,var(--button-destructive-border,transparent))]",
470
+ "hover:[box-shadow:var(--button-destructive-shadow-hover,var(--button-shadow-hover,var(--button-destructive-shadow,var(--button-shadow,none))))]",
471
+ "focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40",
472
+ "dark:bg-destructive/60"
473
+ ].join(" "),
474
+ // Outline variant - full customization with proper border handling
475
+ outline: [
476
+ "bg-[var(--button-outline-bg,hsl(var(--background)))]",
477
+ "text-[var(--button-outline-fg,inherit)]",
478
+ "border-[length:var(--button-outline-border-width,1px)]",
479
+ "border-[color:var(--button-outline-border,hsl(var(--border)))]",
480
+ "[box-shadow:var(--button-outline-shadow,var(--button-shadow,0_1px_2px_0_rgb(0_0_0/0.05)))]",
481
+ "hover:bg-[var(--button-outline-hover-bg,hsl(var(--accent)))]",
482
+ "hover:text-[var(--button-outline-hover-fg,hsl(var(--accent-foreground)))]",
483
+ "hover:border-[color:var(--button-outline-hover-border,var(--button-outline-border,hsl(var(--border))))]",
484
+ "hover:[box-shadow:var(--button-outline-shadow-hover,var(--button-shadow-hover,var(--button-outline-shadow,var(--button-shadow,none))))]",
485
+ "dark:bg-input/30 dark:border-input dark:hover:bg-input/50"
486
+ ].join(" "),
487
+ // Secondary variant - full customization
488
+ secondary: [
489
+ "bg-[var(--button-secondary-bg,hsl(var(--secondary)))]",
490
+ "text-[var(--button-secondary-fg,hsl(var(--secondary-foreground)))]",
491
+ "border-[length:var(--button-secondary-border-width,0px)]",
492
+ "border-[color:var(--button-secondary-border,transparent)]",
493
+ "[box-shadow:var(--button-secondary-shadow,var(--button-shadow,none))]",
494
+ "hover:bg-[var(--button-secondary-hover-bg,hsl(var(--secondary)/0.8))]",
495
+ "hover:text-[var(--button-secondary-hover-fg,var(--button-secondary-fg,hsl(var(--secondary-foreground))))]",
496
+ "hover:border-[color:var(--button-secondary-hover-border,var(--button-secondary-border,transparent))]",
497
+ "hover:[box-shadow:var(--button-secondary-shadow-hover,var(--button-shadow-hover,var(--button-secondary-shadow,var(--button-shadow,none))))]"
498
+ ].join(" "),
499
+ // Ghost variant - full customization
500
+ ghost: [
501
+ "bg-[var(--button-ghost-bg,transparent)]",
502
+ "text-[var(--button-ghost-fg,inherit)]",
503
+ "border-[length:var(--button-ghost-border-width,0px)]",
504
+ "border-[color:var(--button-ghost-border,transparent)]",
505
+ "[box-shadow:var(--button-ghost-shadow,var(--button-shadow,none))]",
506
+ "hover:bg-[var(--button-ghost-hover-bg,hsl(var(--accent)))]",
507
+ "hover:text-[var(--button-ghost-hover-fg,hsl(var(--accent-foreground)))]",
508
+ "hover:border-[color:var(--button-ghost-hover-border,var(--button-ghost-border,transparent))]",
509
+ "hover:[box-shadow:var(--button-ghost-shadow-hover,var(--button-shadow-hover,var(--button-ghost-shadow,var(--button-shadow,none))))]",
510
+ "dark:hover:bg-accent/50"
511
+ ].join(" "),
512
+ // Link variant - full customization
513
+ link: [
514
+ "bg-[var(--button-link-bg,transparent)]",
515
+ "text-[var(--button-link-fg,hsl(var(--primary)))]",
516
+ "border-[length:var(--button-link-border-width,0px)]",
517
+ "border-[color:var(--button-link-border,transparent)]",
518
+ "[box-shadow:var(--button-link-shadow,none)]",
519
+ "hover:bg-[var(--button-link-hover-bg,transparent)]",
520
+ "hover:text-[var(--button-link-hover-fg,var(--button-link-fg,hsl(var(--primary))))]",
521
+ "hover:[box-shadow:var(--button-link-shadow-hover,none)]",
522
+ "underline-offset-4 hover:underline"
523
+ ].join(" ")
524
+ },
525
+ size: {
526
+ default: [
527
+ "h-[var(--button-height-md,2.25rem)]",
528
+ "px-[var(--button-padding-x-md,1rem)]",
529
+ "py-[var(--button-padding-y-md,0.5rem)]",
530
+ "has-[>svg]:px-[calc(var(--button-padding-x-md,1rem)*0.75)]"
531
+ ].join(" "),
532
+ sm: [
533
+ "h-[var(--button-height-sm,2rem)]",
534
+ "px-[var(--button-padding-x-sm,0.75rem)]",
535
+ "py-[var(--button-padding-y-sm,0.25rem)]",
536
+ "gap-1.5",
537
+ "has-[>svg]:px-[calc(var(--button-padding-x-sm,0.75rem)*0.83)]"
538
+ ].join(" "),
539
+ md: [
540
+ "h-[var(--button-height-md,2.25rem)]",
541
+ "px-[var(--button-padding-x-md,1rem)]",
542
+ "py-[var(--button-padding-y-md,0.5rem)]",
543
+ "has-[>svg]:px-[calc(var(--button-padding-x-md,1rem)*0.75)]"
544
+ ].join(" "),
545
+ lg: [
546
+ "h-[var(--button-height-lg,2.5rem)]",
547
+ "px-[var(--button-padding-x-lg,1.5rem)]",
548
+ "py-[var(--button-padding-y-lg,0.5rem)]",
549
+ "has-[>svg]:px-[calc(var(--button-padding-x-lg,1.5rem)*0.67)]"
550
+ ].join(" "),
551
+ icon: "size-[var(--button-height-md,2.25rem)]",
552
+ "icon-sm": "size-[var(--button-height-sm,2rem)]",
553
+ "icon-lg": "size-[var(--button-height-lg,2.5rem)]"
554
+ }
555
+ },
556
+ defaultVariants: {
557
+ variant: "default",
558
+ size: "default"
559
+ }
560
+ });
419
561
  function normalizePhoneNumber(input) {
420
562
  const trimmed = input.trim();
421
563
  if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -594,148 +736,6 @@ function useNavigation({
594
736
  handleClick
595
737
  };
596
738
  }
597
- var baseStyles = [
598
- // Layout
599
- "inline-flex items-center justify-center gap-2 whitespace-nowrap shrink-0",
600
- // Typography - using CSS variables with sensible defaults
601
- "font-[var(--button-font-family,inherit)]",
602
- "font-[var(--button-font-weight,500)]",
603
- "tracking-[var(--button-letter-spacing,0)]",
604
- "leading-[var(--button-line-height,1.25)]",
605
- "[text-transform:var(--button-text-transform,none)]",
606
- "text-sm",
607
- // Border radius
608
- "rounded-[var(--button-radius,var(--radius,0.375rem))]",
609
- // Smooth transition - using [transition:...] to set full shorthand property (not just transition-property)
610
- "[transition:var(--button-transition,all_250ms_cubic-bezier(0.4,0,0.2,1))]",
611
- // Box shadow (master level) - using [box-shadow:...] for complex multi-value shadows
612
- "[box-shadow:var(--button-shadow,none)]",
613
- "hover:[box-shadow:var(--button-shadow-hover,var(--button-shadow,none))]",
614
- // Disabled state
615
- "disabled:pointer-events-none disabled:opacity-50",
616
- // SVG handling
617
- "[&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0",
618
- // Focus styles
619
- "outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
620
- // Invalid state
621
- "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
622
- ].join(" ");
623
- var buttonVariants = classVarianceAuthority.cva(baseStyles, {
624
- variants: {
625
- variant: {
626
- // Default (Primary) variant - full customization
627
- default: [
628
- "bg-[var(--button-default-bg,hsl(var(--primary)))]",
629
- "text-[var(--button-default-fg,hsl(var(--primary-foreground)))]",
630
- "border-[length:var(--button-default-border-width,0px)]",
631
- "border-[color:var(--button-default-border,transparent)]",
632
- "[box-shadow:var(--button-default-shadow,var(--button-shadow,none))]",
633
- "hover:bg-[var(--button-default-hover-bg,hsl(var(--primary)/0.9))]",
634
- "hover:text-[var(--button-default-hover-fg,var(--button-default-fg,hsl(var(--primary-foreground))))]",
635
- "hover:border-[color:var(--button-default-hover-border,var(--button-default-border,transparent))]",
636
- "hover:[box-shadow:var(--button-default-shadow-hover,var(--button-shadow-hover,var(--button-default-shadow,var(--button-shadow,none))))]"
637
- ].join(" "),
638
- // Destructive variant - full customization
639
- destructive: [
640
- "bg-[var(--button-destructive-bg,hsl(var(--destructive)))]",
641
- "text-[var(--button-destructive-fg,white)]",
642
- "border-[length:var(--button-destructive-border-width,0px)]",
643
- "border-[color:var(--button-destructive-border,transparent)]",
644
- "[box-shadow:var(--button-destructive-shadow,var(--button-shadow,none))]",
645
- "hover:bg-[var(--button-destructive-hover-bg,hsl(var(--destructive)/0.9))]",
646
- "hover:text-[var(--button-destructive-hover-fg,var(--button-destructive-fg,white))]",
647
- "hover:border-[color:var(--button-destructive-hover-border,var(--button-destructive-border,transparent))]",
648
- "hover:[box-shadow:var(--button-destructive-shadow-hover,var(--button-shadow-hover,var(--button-destructive-shadow,var(--button-shadow,none))))]",
649
- "focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40",
650
- "dark:bg-destructive/60"
651
- ].join(" "),
652
- // Outline variant - full customization with proper border handling
653
- outline: [
654
- "bg-[var(--button-outline-bg,hsl(var(--background)))]",
655
- "text-[var(--button-outline-fg,inherit)]",
656
- "border-[length:var(--button-outline-border-width,1px)]",
657
- "border-[color:var(--button-outline-border,hsl(var(--border)))]",
658
- "[box-shadow:var(--button-outline-shadow,var(--button-shadow,0_1px_2px_0_rgb(0_0_0/0.05)))]",
659
- "hover:bg-[var(--button-outline-hover-bg,hsl(var(--accent)))]",
660
- "hover:text-[var(--button-outline-hover-fg,hsl(var(--accent-foreground)))]",
661
- "hover:border-[color:var(--button-outline-hover-border,var(--button-outline-border,hsl(var(--border))))]",
662
- "hover:[box-shadow:var(--button-outline-shadow-hover,var(--button-shadow-hover,var(--button-outline-shadow,var(--button-shadow,none))))]",
663
- "dark:bg-input/30 dark:border-input dark:hover:bg-input/50"
664
- ].join(" "),
665
- // Secondary variant - full customization
666
- secondary: [
667
- "bg-[var(--button-secondary-bg,hsl(var(--secondary)))]",
668
- "text-[var(--button-secondary-fg,hsl(var(--secondary-foreground)))]",
669
- "border-[length:var(--button-secondary-border-width,0px)]",
670
- "border-[color:var(--button-secondary-border,transparent)]",
671
- "[box-shadow:var(--button-secondary-shadow,var(--button-shadow,none))]",
672
- "hover:bg-[var(--button-secondary-hover-bg,hsl(var(--secondary)/0.8))]",
673
- "hover:text-[var(--button-secondary-hover-fg,var(--button-secondary-fg,hsl(var(--secondary-foreground))))]",
674
- "hover:border-[color:var(--button-secondary-hover-border,var(--button-secondary-border,transparent))]",
675
- "hover:[box-shadow:var(--button-secondary-shadow-hover,var(--button-shadow-hover,var(--button-secondary-shadow,var(--button-shadow,none))))]"
676
- ].join(" "),
677
- // Ghost variant - full customization
678
- ghost: [
679
- "bg-[var(--button-ghost-bg,transparent)]",
680
- "text-[var(--button-ghost-fg,inherit)]",
681
- "border-[length:var(--button-ghost-border-width,0px)]",
682
- "border-[color:var(--button-ghost-border,transparent)]",
683
- "[box-shadow:var(--button-ghost-shadow,var(--button-shadow,none))]",
684
- "hover:bg-[var(--button-ghost-hover-bg,hsl(var(--accent)))]",
685
- "hover:text-[var(--button-ghost-hover-fg,hsl(var(--accent-foreground)))]",
686
- "hover:border-[color:var(--button-ghost-hover-border,var(--button-ghost-border,transparent))]",
687
- "hover:[box-shadow:var(--button-ghost-shadow-hover,var(--button-shadow-hover,var(--button-ghost-shadow,var(--button-shadow,none))))]",
688
- "dark:hover:bg-accent/50"
689
- ].join(" "),
690
- // Link variant - full customization
691
- link: [
692
- "bg-[var(--button-link-bg,transparent)]",
693
- "text-[var(--button-link-fg,hsl(var(--primary)))]",
694
- "border-[length:var(--button-link-border-width,0px)]",
695
- "border-[color:var(--button-link-border,transparent)]",
696
- "[box-shadow:var(--button-link-shadow,none)]",
697
- "hover:bg-[var(--button-link-hover-bg,transparent)]",
698
- "hover:text-[var(--button-link-hover-fg,var(--button-link-fg,hsl(var(--primary))))]",
699
- "hover:[box-shadow:var(--button-link-shadow-hover,none)]",
700
- "underline-offset-4 hover:underline"
701
- ].join(" ")
702
- },
703
- size: {
704
- default: [
705
- "h-[var(--button-height-md,2.25rem)]",
706
- "px-[var(--button-padding-x-md,1rem)]",
707
- "py-[var(--button-padding-y-md,0.5rem)]",
708
- "has-[>svg]:px-[calc(var(--button-padding-x-md,1rem)*0.75)]"
709
- ].join(" "),
710
- sm: [
711
- "h-[var(--button-height-sm,2rem)]",
712
- "px-[var(--button-padding-x-sm,0.75rem)]",
713
- "py-[var(--button-padding-y-sm,0.25rem)]",
714
- "gap-1.5",
715
- "has-[>svg]:px-[calc(var(--button-padding-x-sm,0.75rem)*0.83)]"
716
- ].join(" "),
717
- md: [
718
- "h-[var(--button-height-md,2.25rem)]",
719
- "px-[var(--button-padding-x-md,1rem)]",
720
- "py-[var(--button-padding-y-md,0.5rem)]",
721
- "has-[>svg]:px-[calc(var(--button-padding-x-md,1rem)*0.75)]"
722
- ].join(" "),
723
- lg: [
724
- "h-[var(--button-height-lg,2.5rem)]",
725
- "px-[var(--button-padding-x-lg,1.5rem)]",
726
- "py-[var(--button-padding-y-lg,0.5rem)]",
727
- "has-[>svg]:px-[calc(var(--button-padding-x-lg,1.5rem)*0.67)]"
728
- ].join(" "),
729
- icon: "size-[var(--button-height-md,2.25rem)]",
730
- "icon-sm": "size-[var(--button-height-sm,2rem)]",
731
- "icon-lg": "size-[var(--button-height-lg,2.5rem)]"
732
- }
733
- },
734
- defaultVariants: {
735
- variant: "default",
736
- size: "default"
737
- }
738
- });
739
739
  var Pressable = React3__namespace.forwardRef(
740
740
  ({
741
741
  children,
@@ -394,6 +394,148 @@ var Section = React3__default.forwardRef(
394
394
  }
395
395
  );
396
396
  Section.displayName = "Section";
397
+ var baseStyles = [
398
+ // Layout
399
+ "inline-flex items-center justify-center gap-2 whitespace-nowrap shrink-0",
400
+ // Typography - using CSS variables with sensible defaults
401
+ "font-[var(--button-font-family,inherit)]",
402
+ "font-[var(--button-font-weight,500)]",
403
+ "tracking-[var(--button-letter-spacing,0)]",
404
+ "leading-[var(--button-line-height,1.25)]",
405
+ "[text-transform:var(--button-text-transform,none)]",
406
+ "text-sm",
407
+ // Border radius
408
+ "rounded-[var(--button-radius,var(--radius,0.375rem))]",
409
+ // Smooth transition - using [transition:...] to set full shorthand property (not just transition-property)
410
+ "[transition:var(--button-transition,all_250ms_cubic-bezier(0.4,0,0.2,1))]",
411
+ // Box shadow (master level) - using [box-shadow:...] for complex multi-value shadows
412
+ "[box-shadow:var(--button-shadow,none)]",
413
+ "hover:[box-shadow:var(--button-shadow-hover,var(--button-shadow,none))]",
414
+ // Disabled state
415
+ "disabled:pointer-events-none disabled:opacity-50",
416
+ // SVG handling
417
+ "[&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0",
418
+ // Focus styles
419
+ "outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
420
+ // Invalid state
421
+ "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
422
+ ].join(" ");
423
+ var buttonVariants = cva(baseStyles, {
424
+ variants: {
425
+ variant: {
426
+ // Default (Primary) variant - full customization
427
+ default: [
428
+ "bg-[var(--button-default-bg,hsl(var(--primary)))]",
429
+ "text-[var(--button-default-fg,hsl(var(--primary-foreground)))]",
430
+ "border-[length:var(--button-default-border-width,0px)]",
431
+ "border-[color:var(--button-default-border,transparent)]",
432
+ "[box-shadow:var(--button-default-shadow,var(--button-shadow,none))]",
433
+ "hover:bg-[var(--button-default-hover-bg,hsl(var(--primary)/0.9))]",
434
+ "hover:text-[var(--button-default-hover-fg,var(--button-default-fg,hsl(var(--primary-foreground))))]",
435
+ "hover:border-[color:var(--button-default-hover-border,var(--button-default-border,transparent))]",
436
+ "hover:[box-shadow:var(--button-default-shadow-hover,var(--button-shadow-hover,var(--button-default-shadow,var(--button-shadow,none))))]"
437
+ ].join(" "),
438
+ // Destructive variant - full customization
439
+ destructive: [
440
+ "bg-[var(--button-destructive-bg,hsl(var(--destructive)))]",
441
+ "text-[var(--button-destructive-fg,white)]",
442
+ "border-[length:var(--button-destructive-border-width,0px)]",
443
+ "border-[color:var(--button-destructive-border,transparent)]",
444
+ "[box-shadow:var(--button-destructive-shadow,var(--button-shadow,none))]",
445
+ "hover:bg-[var(--button-destructive-hover-bg,hsl(var(--destructive)/0.9))]",
446
+ "hover:text-[var(--button-destructive-hover-fg,var(--button-destructive-fg,white))]",
447
+ "hover:border-[color:var(--button-destructive-hover-border,var(--button-destructive-border,transparent))]",
448
+ "hover:[box-shadow:var(--button-destructive-shadow-hover,var(--button-shadow-hover,var(--button-destructive-shadow,var(--button-shadow,none))))]",
449
+ "focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40",
450
+ "dark:bg-destructive/60"
451
+ ].join(" "),
452
+ // Outline variant - full customization with proper border handling
453
+ outline: [
454
+ "bg-[var(--button-outline-bg,hsl(var(--background)))]",
455
+ "text-[var(--button-outline-fg,inherit)]",
456
+ "border-[length:var(--button-outline-border-width,1px)]",
457
+ "border-[color:var(--button-outline-border,hsl(var(--border)))]",
458
+ "[box-shadow:var(--button-outline-shadow,var(--button-shadow,0_1px_2px_0_rgb(0_0_0/0.05)))]",
459
+ "hover:bg-[var(--button-outline-hover-bg,hsl(var(--accent)))]",
460
+ "hover:text-[var(--button-outline-hover-fg,hsl(var(--accent-foreground)))]",
461
+ "hover:border-[color:var(--button-outline-hover-border,var(--button-outline-border,hsl(var(--border))))]",
462
+ "hover:[box-shadow:var(--button-outline-shadow-hover,var(--button-shadow-hover,var(--button-outline-shadow,var(--button-shadow,none))))]",
463
+ "dark:bg-input/30 dark:border-input dark:hover:bg-input/50"
464
+ ].join(" "),
465
+ // Secondary variant - full customization
466
+ secondary: [
467
+ "bg-[var(--button-secondary-bg,hsl(var(--secondary)))]",
468
+ "text-[var(--button-secondary-fg,hsl(var(--secondary-foreground)))]",
469
+ "border-[length:var(--button-secondary-border-width,0px)]",
470
+ "border-[color:var(--button-secondary-border,transparent)]",
471
+ "[box-shadow:var(--button-secondary-shadow,var(--button-shadow,none))]",
472
+ "hover:bg-[var(--button-secondary-hover-bg,hsl(var(--secondary)/0.8))]",
473
+ "hover:text-[var(--button-secondary-hover-fg,var(--button-secondary-fg,hsl(var(--secondary-foreground))))]",
474
+ "hover:border-[color:var(--button-secondary-hover-border,var(--button-secondary-border,transparent))]",
475
+ "hover:[box-shadow:var(--button-secondary-shadow-hover,var(--button-shadow-hover,var(--button-secondary-shadow,var(--button-shadow,none))))]"
476
+ ].join(" "),
477
+ // Ghost variant - full customization
478
+ ghost: [
479
+ "bg-[var(--button-ghost-bg,transparent)]",
480
+ "text-[var(--button-ghost-fg,inherit)]",
481
+ "border-[length:var(--button-ghost-border-width,0px)]",
482
+ "border-[color:var(--button-ghost-border,transparent)]",
483
+ "[box-shadow:var(--button-ghost-shadow,var(--button-shadow,none))]",
484
+ "hover:bg-[var(--button-ghost-hover-bg,hsl(var(--accent)))]",
485
+ "hover:text-[var(--button-ghost-hover-fg,hsl(var(--accent-foreground)))]",
486
+ "hover:border-[color:var(--button-ghost-hover-border,var(--button-ghost-border,transparent))]",
487
+ "hover:[box-shadow:var(--button-ghost-shadow-hover,var(--button-shadow-hover,var(--button-ghost-shadow,var(--button-shadow,none))))]",
488
+ "dark:hover:bg-accent/50"
489
+ ].join(" "),
490
+ // Link variant - full customization
491
+ link: [
492
+ "bg-[var(--button-link-bg,transparent)]",
493
+ "text-[var(--button-link-fg,hsl(var(--primary)))]",
494
+ "border-[length:var(--button-link-border-width,0px)]",
495
+ "border-[color:var(--button-link-border,transparent)]",
496
+ "[box-shadow:var(--button-link-shadow,none)]",
497
+ "hover:bg-[var(--button-link-hover-bg,transparent)]",
498
+ "hover:text-[var(--button-link-hover-fg,var(--button-link-fg,hsl(var(--primary))))]",
499
+ "hover:[box-shadow:var(--button-link-shadow-hover,none)]",
500
+ "underline-offset-4 hover:underline"
501
+ ].join(" ")
502
+ },
503
+ size: {
504
+ default: [
505
+ "h-[var(--button-height-md,2.25rem)]",
506
+ "px-[var(--button-padding-x-md,1rem)]",
507
+ "py-[var(--button-padding-y-md,0.5rem)]",
508
+ "has-[>svg]:px-[calc(var(--button-padding-x-md,1rem)*0.75)]"
509
+ ].join(" "),
510
+ sm: [
511
+ "h-[var(--button-height-sm,2rem)]",
512
+ "px-[var(--button-padding-x-sm,0.75rem)]",
513
+ "py-[var(--button-padding-y-sm,0.25rem)]",
514
+ "gap-1.5",
515
+ "has-[>svg]:px-[calc(var(--button-padding-x-sm,0.75rem)*0.83)]"
516
+ ].join(" "),
517
+ md: [
518
+ "h-[var(--button-height-md,2.25rem)]",
519
+ "px-[var(--button-padding-x-md,1rem)]",
520
+ "py-[var(--button-padding-y-md,0.5rem)]",
521
+ "has-[>svg]:px-[calc(var(--button-padding-x-md,1rem)*0.75)]"
522
+ ].join(" "),
523
+ lg: [
524
+ "h-[var(--button-height-lg,2.5rem)]",
525
+ "px-[var(--button-padding-x-lg,1.5rem)]",
526
+ "py-[var(--button-padding-y-lg,0.5rem)]",
527
+ "has-[>svg]:px-[calc(var(--button-padding-x-lg,1.5rem)*0.67)]"
528
+ ].join(" "),
529
+ icon: "size-[var(--button-height-md,2.25rem)]",
530
+ "icon-sm": "size-[var(--button-height-sm,2rem)]",
531
+ "icon-lg": "size-[var(--button-height-lg,2.5rem)]"
532
+ }
533
+ },
534
+ defaultVariants: {
535
+ variant: "default",
536
+ size: "default"
537
+ }
538
+ });
397
539
  function normalizePhoneNumber(input) {
398
540
  const trimmed = input.trim();
399
541
  if (trimmed.toLowerCase().startsWith("tel:")) {
@@ -572,148 +714,6 @@ function useNavigation({
572
714
  handleClick
573
715
  };
574
716
  }
575
- var baseStyles = [
576
- // Layout
577
- "inline-flex items-center justify-center gap-2 whitespace-nowrap shrink-0",
578
- // Typography - using CSS variables with sensible defaults
579
- "font-[var(--button-font-family,inherit)]",
580
- "font-[var(--button-font-weight,500)]",
581
- "tracking-[var(--button-letter-spacing,0)]",
582
- "leading-[var(--button-line-height,1.25)]",
583
- "[text-transform:var(--button-text-transform,none)]",
584
- "text-sm",
585
- // Border radius
586
- "rounded-[var(--button-radius,var(--radius,0.375rem))]",
587
- // Smooth transition - using [transition:...] to set full shorthand property (not just transition-property)
588
- "[transition:var(--button-transition,all_250ms_cubic-bezier(0.4,0,0.2,1))]",
589
- // Box shadow (master level) - using [box-shadow:...] for complex multi-value shadows
590
- "[box-shadow:var(--button-shadow,none)]",
591
- "hover:[box-shadow:var(--button-shadow-hover,var(--button-shadow,none))]",
592
- // Disabled state
593
- "disabled:pointer-events-none disabled:opacity-50",
594
- // SVG handling
595
- "[&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0",
596
- // Focus styles
597
- "outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
598
- // Invalid state
599
- "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
600
- ].join(" ");
601
- var buttonVariants = cva(baseStyles, {
602
- variants: {
603
- variant: {
604
- // Default (Primary) variant - full customization
605
- default: [
606
- "bg-[var(--button-default-bg,hsl(var(--primary)))]",
607
- "text-[var(--button-default-fg,hsl(var(--primary-foreground)))]",
608
- "border-[length:var(--button-default-border-width,0px)]",
609
- "border-[color:var(--button-default-border,transparent)]",
610
- "[box-shadow:var(--button-default-shadow,var(--button-shadow,none))]",
611
- "hover:bg-[var(--button-default-hover-bg,hsl(var(--primary)/0.9))]",
612
- "hover:text-[var(--button-default-hover-fg,var(--button-default-fg,hsl(var(--primary-foreground))))]",
613
- "hover:border-[color:var(--button-default-hover-border,var(--button-default-border,transparent))]",
614
- "hover:[box-shadow:var(--button-default-shadow-hover,var(--button-shadow-hover,var(--button-default-shadow,var(--button-shadow,none))))]"
615
- ].join(" "),
616
- // Destructive variant - full customization
617
- destructive: [
618
- "bg-[var(--button-destructive-bg,hsl(var(--destructive)))]",
619
- "text-[var(--button-destructive-fg,white)]",
620
- "border-[length:var(--button-destructive-border-width,0px)]",
621
- "border-[color:var(--button-destructive-border,transparent)]",
622
- "[box-shadow:var(--button-destructive-shadow,var(--button-shadow,none))]",
623
- "hover:bg-[var(--button-destructive-hover-bg,hsl(var(--destructive)/0.9))]",
624
- "hover:text-[var(--button-destructive-hover-fg,var(--button-destructive-fg,white))]",
625
- "hover:border-[color:var(--button-destructive-hover-border,var(--button-destructive-border,transparent))]",
626
- "hover:[box-shadow:var(--button-destructive-shadow-hover,var(--button-shadow-hover,var(--button-destructive-shadow,var(--button-shadow,none))))]",
627
- "focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40",
628
- "dark:bg-destructive/60"
629
- ].join(" "),
630
- // Outline variant - full customization with proper border handling
631
- outline: [
632
- "bg-[var(--button-outline-bg,hsl(var(--background)))]",
633
- "text-[var(--button-outline-fg,inherit)]",
634
- "border-[length:var(--button-outline-border-width,1px)]",
635
- "border-[color:var(--button-outline-border,hsl(var(--border)))]",
636
- "[box-shadow:var(--button-outline-shadow,var(--button-shadow,0_1px_2px_0_rgb(0_0_0/0.05)))]",
637
- "hover:bg-[var(--button-outline-hover-bg,hsl(var(--accent)))]",
638
- "hover:text-[var(--button-outline-hover-fg,hsl(var(--accent-foreground)))]",
639
- "hover:border-[color:var(--button-outline-hover-border,var(--button-outline-border,hsl(var(--border))))]",
640
- "hover:[box-shadow:var(--button-outline-shadow-hover,var(--button-shadow-hover,var(--button-outline-shadow,var(--button-shadow,none))))]",
641
- "dark:bg-input/30 dark:border-input dark:hover:bg-input/50"
642
- ].join(" "),
643
- // Secondary variant - full customization
644
- secondary: [
645
- "bg-[var(--button-secondary-bg,hsl(var(--secondary)))]",
646
- "text-[var(--button-secondary-fg,hsl(var(--secondary-foreground)))]",
647
- "border-[length:var(--button-secondary-border-width,0px)]",
648
- "border-[color:var(--button-secondary-border,transparent)]",
649
- "[box-shadow:var(--button-secondary-shadow,var(--button-shadow,none))]",
650
- "hover:bg-[var(--button-secondary-hover-bg,hsl(var(--secondary)/0.8))]",
651
- "hover:text-[var(--button-secondary-hover-fg,var(--button-secondary-fg,hsl(var(--secondary-foreground))))]",
652
- "hover:border-[color:var(--button-secondary-hover-border,var(--button-secondary-border,transparent))]",
653
- "hover:[box-shadow:var(--button-secondary-shadow-hover,var(--button-shadow-hover,var(--button-secondary-shadow,var(--button-shadow,none))))]"
654
- ].join(" "),
655
- // Ghost variant - full customization
656
- ghost: [
657
- "bg-[var(--button-ghost-bg,transparent)]",
658
- "text-[var(--button-ghost-fg,inherit)]",
659
- "border-[length:var(--button-ghost-border-width,0px)]",
660
- "border-[color:var(--button-ghost-border,transparent)]",
661
- "[box-shadow:var(--button-ghost-shadow,var(--button-shadow,none))]",
662
- "hover:bg-[var(--button-ghost-hover-bg,hsl(var(--accent)))]",
663
- "hover:text-[var(--button-ghost-hover-fg,hsl(var(--accent-foreground)))]",
664
- "hover:border-[color:var(--button-ghost-hover-border,var(--button-ghost-border,transparent))]",
665
- "hover:[box-shadow:var(--button-ghost-shadow-hover,var(--button-shadow-hover,var(--button-ghost-shadow,var(--button-shadow,none))))]",
666
- "dark:hover:bg-accent/50"
667
- ].join(" "),
668
- // Link variant - full customization
669
- link: [
670
- "bg-[var(--button-link-bg,transparent)]",
671
- "text-[var(--button-link-fg,hsl(var(--primary)))]",
672
- "border-[length:var(--button-link-border-width,0px)]",
673
- "border-[color:var(--button-link-border,transparent)]",
674
- "[box-shadow:var(--button-link-shadow,none)]",
675
- "hover:bg-[var(--button-link-hover-bg,transparent)]",
676
- "hover:text-[var(--button-link-hover-fg,var(--button-link-fg,hsl(var(--primary))))]",
677
- "hover:[box-shadow:var(--button-link-shadow-hover,none)]",
678
- "underline-offset-4 hover:underline"
679
- ].join(" ")
680
- },
681
- size: {
682
- default: [
683
- "h-[var(--button-height-md,2.25rem)]",
684
- "px-[var(--button-padding-x-md,1rem)]",
685
- "py-[var(--button-padding-y-md,0.5rem)]",
686
- "has-[>svg]:px-[calc(var(--button-padding-x-md,1rem)*0.75)]"
687
- ].join(" "),
688
- sm: [
689
- "h-[var(--button-height-sm,2rem)]",
690
- "px-[var(--button-padding-x-sm,0.75rem)]",
691
- "py-[var(--button-padding-y-sm,0.25rem)]",
692
- "gap-1.5",
693
- "has-[>svg]:px-[calc(var(--button-padding-x-sm,0.75rem)*0.83)]"
694
- ].join(" "),
695
- md: [
696
- "h-[var(--button-height-md,2.25rem)]",
697
- "px-[var(--button-padding-x-md,1rem)]",
698
- "py-[var(--button-padding-y-md,0.5rem)]",
699
- "has-[>svg]:px-[calc(var(--button-padding-x-md,1rem)*0.75)]"
700
- ].join(" "),
701
- lg: [
702
- "h-[var(--button-height-lg,2.5rem)]",
703
- "px-[var(--button-padding-x-lg,1.5rem)]",
704
- "py-[var(--button-padding-y-lg,0.5rem)]",
705
- "has-[>svg]:px-[calc(var(--button-padding-x-lg,1.5rem)*0.67)]"
706
- ].join(" "),
707
- icon: "size-[var(--button-height-md,2.25rem)]",
708
- "icon-sm": "size-[var(--button-height-sm,2rem)]",
709
- "icon-lg": "size-[var(--button-height-lg,2.5rem)]"
710
- }
711
- },
712
- defaultVariants: {
713
- variant: "default",
714
- size: "default"
715
- }
716
- });
717
717
  var Pressable = React3.forwardRef(
718
718
  ({
719
719
  children,