@moontra/moonui-pro 3.4.18 → 3.4.20

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 (4) hide show
  1. package/dist/cdn/index.global.js +93 -93
  2. package/dist/cdn/index.global.js.map +1 -1
  3. package/dist/index.mjs +79 -21
  4. package/package.json +1 -1
package/dist/index.mjs CHANGED
@@ -79386,18 +79386,72 @@ function NavbarInternal({
79386
79386
  ] }, section.id)) })
79387
79387
  ] }) })
79388
79388
  ] });
79389
- const getHeight = () => {
79389
+ const getHeight = (scrolled2 = false) => {
79390
79390
  switch (size4) {
79391
79391
  case "sm":
79392
- return "h-14";
79392
+ return scrolled2 ? "h-12" : "h-14";
79393
79393
  case "lg":
79394
- return "h-20";
79394
+ return scrolled2 ? "h-16" : "h-20";
79395
79395
  case "xl":
79396
- return "h-24";
79396
+ return scrolled2 ? "h-20" : "h-24";
79397
79397
  case "2xl":
79398
- return "h-28";
79398
+ return scrolled2 ? "h-24" : "h-28";
79399
79399
  default:
79400
- return "h-16";
79400
+ return scrolled2 ? "h-14" : "h-16";
79401
+ }
79402
+ };
79403
+ const getSizeClasses = () => {
79404
+ switch (size4) {
79405
+ case "sm":
79406
+ return {
79407
+ text: "text-sm",
79408
+ logoText: "text-base",
79409
+ spacing: "space-x-2",
79410
+ gap: "gap-2",
79411
+ buttonSize: "sm",
79412
+ iconSize: "h-4 w-4",
79413
+ padding: "px-2 py-1"
79414
+ };
79415
+ case "lg":
79416
+ return {
79417
+ text: "text-base",
79418
+ logoText: "text-xl",
79419
+ spacing: "space-x-4",
79420
+ gap: "gap-3",
79421
+ buttonSize: "md",
79422
+ iconSize: "h-5 w-5",
79423
+ padding: "px-3 py-2"
79424
+ };
79425
+ case "xl":
79426
+ return {
79427
+ text: "text-lg",
79428
+ logoText: "text-2xl",
79429
+ spacing: "space-x-6",
79430
+ gap: "gap-4",
79431
+ buttonSize: "lg",
79432
+ iconSize: "h-6 w-6",
79433
+ padding: "px-4 py-2.5"
79434
+ };
79435
+ case "2xl":
79436
+ return {
79437
+ text: "text-xl",
79438
+ logoText: "text-3xl",
79439
+ spacing: "space-x-8",
79440
+ gap: "gap-5",
79441
+ buttonSize: "lg",
79442
+ iconSize: "h-7 w-7",
79443
+ padding: "px-5 py-3"
79444
+ };
79445
+ default:
79446
+ return {
79447
+ text: "text-sm",
79448
+ logoText: "text-lg",
79449
+ spacing: "space-x-4",
79450
+ gap: "gap-2",
79451
+ buttonSize: "md",
79452
+ iconSize: "h-5 w-5",
79453
+ padding: "px-3 py-1.5"
79454
+ };
79401
79455
  }
79402
79456
  };
79403
79457
  const isFloatingVariant = variant === "floating-auto-hide" || variant === "floating-sticky";
@@ -79506,7 +79560,7 @@ function NavbarInternal({
79506
79560
  {
79507
79561
  className: cn(
79508
79562
  "flex items-center space-x-4 sm:justify-between sm:space-x-0 transition-all duration-300",
79509
- framerScroll.isScrolled ? "h-14" : "h-16"
79563
+ getHeight(framerScroll.isScrolled)
79510
79564
  ),
79511
79565
  children: [
79512
79566
  branding && /* @__PURE__ */ jsxs(
@@ -79544,7 +79598,7 @@ function NavbarInternal({
79544
79598
  /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: branding.title && !isMobile && !framerScroll.isScrolled && /* @__PURE__ */ jsx(
79545
79599
  motion.span,
79546
79600
  {
79547
- className: "font-semibold text-lg overflow-hidden",
79601
+ className: cn("font-semibold overflow-hidden", getSizeClasses().logoText),
79548
79602
  initial: { opacity: 0, width: 0 },
79549
79603
  animate: { opacity: 1, width: "auto" },
79550
79604
  exit: { opacity: 0, width: 0 },
@@ -79613,6 +79667,8 @@ function NavbarInternal({
79613
79667
  className: cn(
79614
79668
  navigationMenuTriggerStyle(),
79615
79669
  "cursor-pointer",
79670
+ getSizeClasses().text,
79671
+ getSizeClasses().padding,
79616
79672
  isActive2 && "bg-accent text-accent-foreground",
79617
79673
  item.disabled && "opacity-50 cursor-not-allowed"
79618
79674
  ),
@@ -79620,8 +79676,8 @@ function NavbarInternal({
79620
79676
  item
79621
79677
  ),
79622
79678
  children: [
79623
- /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
79624
- item.icon && /* @__PURE__ */ jsx("span", { children: item.icon }),
79679
+ /* @__PURE__ */ jsxs("span", { className: cn("flex items-center", getSizeClasses().gap), children: [
79680
+ item.icon && /* @__PURE__ */ jsx("span", { className: getSizeClasses().iconSize, children: item.icon }),
79625
79681
  item.title
79626
79682
  ] }),
79627
79683
  item.badge && /* @__PURE__ */ jsx(
@@ -79683,7 +79739,7 @@ function NavbarInternal({
79683
79739
  MoonUIButtonPro,
79684
79740
  {
79685
79741
  variant: "ghost",
79686
- size: "icon",
79742
+ size: getSizeClasses().buttonSize,
79687
79743
  onClick: () => {
79688
79744
  const newTheme = currentTheme === "dark" ? "light" : "dark";
79689
79745
  setCurrentTheme(newTheme);
@@ -79702,7 +79758,7 @@ function NavbarInternal({
79702
79758
  animate: { y: 0, opacity: 1 },
79703
79759
  exit: { y: 20, opacity: 0 },
79704
79760
  transition: { duration: 0.2 },
79705
- children: /* @__PURE__ */ jsx(Moon, { className: "h-5 w-5" })
79761
+ children: /* @__PURE__ */ jsx(Moon, { className: getSizeClasses().iconSize })
79706
79762
  },
79707
79763
  "moon"
79708
79764
  ) : /* @__PURE__ */ jsx(
@@ -79712,7 +79768,7 @@ function NavbarInternal({
79712
79768
  animate: { y: 0, opacity: 1, rotate: 0 },
79713
79769
  exit: { y: 20, opacity: 0, rotate: 90 },
79714
79770
  transition: { duration: 0.2 },
79715
- children: /* @__PURE__ */ jsx(Sun, { className: "h-5 w-5" })
79771
+ children: /* @__PURE__ */ jsx(Sun, { className: getSizeClasses().iconSize })
79716
79772
  },
79717
79773
  "sun"
79718
79774
  ) })
@@ -79894,7 +79950,7 @@ function NavbarInternal({
79894
79950
  MoonUIButtonPro,
79895
79951
  {
79896
79952
  variant: cta.variant || "primary",
79897
- size: "sm",
79953
+ size: getSizeClasses().buttonSize,
79898
79954
  onClick: () => {
79899
79955
  if (cta.action) {
79900
79956
  cta.action();
@@ -80014,7 +80070,7 @@ function NavbarInternal({
80014
80070
  /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: branding.title && !isMobile && !framerScroll.isScrolled && /* @__PURE__ */ jsx(
80015
80071
  motion.span,
80016
80072
  {
80017
- className: "font-semibold text-lg overflow-hidden",
80073
+ className: cn("font-semibold overflow-hidden", getSizeClasses().logoText),
80018
80074
  initial: { opacity: 0, width: 0 },
80019
80075
  animate: { opacity: 1, width: "auto" },
80020
80076
  exit: { opacity: 0, width: 0 },
@@ -80093,6 +80149,8 @@ function NavbarInternal({
80093
80149
  className: cn(
80094
80150
  navigationMenuTriggerStyle(),
80095
80151
  "cursor-pointer",
80152
+ getSizeClasses().text,
80153
+ getSizeClasses().padding,
80096
80154
  isActive2 && "bg-accent text-accent-foreground",
80097
80155
  item.disabled && "opacity-50 cursor-not-allowed"
80098
80156
  ),
@@ -80100,8 +80158,8 @@ function NavbarInternal({
80100
80158
  item
80101
80159
  ),
80102
80160
  children: [
80103
- /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
80104
- item.icon && /* @__PURE__ */ jsx("span", { children: item.icon }),
80161
+ /* @__PURE__ */ jsxs("span", { className: cn("flex items-center", getSizeClasses().gap), children: [
80162
+ item.icon && /* @__PURE__ */ jsx("span", { className: getSizeClasses().iconSize, children: item.icon }),
80105
80163
  item.title
80106
80164
  ] }),
80107
80165
  item.badge && /* @__PURE__ */ jsx(
@@ -80165,7 +80223,7 @@ function NavbarInternal({
80165
80223
  MoonUIButtonPro,
80166
80224
  {
80167
80225
  variant: "ghost",
80168
- size: "icon",
80226
+ size: getSizeClasses().buttonSize,
80169
80227
  onClick: () => {
80170
80228
  const newTheme = currentTheme === "dark" ? "light" : "dark";
80171
80229
  setCurrentTheme(newTheme);
@@ -80184,7 +80242,7 @@ function NavbarInternal({
80184
80242
  animate: { y: 0, opacity: 1 },
80185
80243
  exit: { y: 20, opacity: 0 },
80186
80244
  transition: { duration: 0.2 },
80187
- children: /* @__PURE__ */ jsx(Moon, { className: "h-5 w-5" })
80245
+ children: /* @__PURE__ */ jsx(Moon, { className: getSizeClasses().iconSize })
80188
80246
  },
80189
80247
  "moon"
80190
80248
  ) : /* @__PURE__ */ jsx(
@@ -80194,7 +80252,7 @@ function NavbarInternal({
80194
80252
  animate: { y: 0, opacity: 1, rotate: 0 },
80195
80253
  exit: { y: 20, opacity: 0, rotate: 90 },
80196
80254
  transition: { duration: 0.2 },
80197
- children: /* @__PURE__ */ jsx(Sun, { className: "h-5 w-5" })
80255
+ children: /* @__PURE__ */ jsx(Sun, { className: getSizeClasses().iconSize })
80198
80256
  },
80199
80257
  "sun"
80200
80258
  ) })
@@ -80376,7 +80434,7 @@ function NavbarInternal({
80376
80434
  MoonUIButtonPro,
80377
80435
  {
80378
80436
  variant: cta.variant || "primary",
80379
- size: "sm",
80437
+ size: getSizeClasses().buttonSize,
80380
80438
  onClick: () => {
80381
80439
  if (cta.action) {
80382
80440
  cta.action();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@moontra/moonui-pro",
3
- "version": "3.4.18",
3
+ "version": "3.4.20",
4
4
  "description": "Premium React components for MoonUI - Advanced UI library with 50+ pro components including performance, interactive, and gesture components",
5
5
  "type": "module",
6
6
  "main": "dist/index.mjs",