@almadar/ui 4.54.14 → 4.55.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 (10) hide show
  1. package/dist/avl/index.cjs +136 -34
  2. package/dist/avl/index.js +136 -34
  3. package/dist/components/index.cjs +121 -6
  4. package/dist/components/index.js +121 -6
  5. package/dist/components/templates/DashboardLayout.d.ts +6 -0
  6. package/dist/providers/index.cjs +121 -6
  7. package/dist/providers/index.js +121 -6
  8. package/dist/runtime/index.cjs +121 -6
  9. package/dist/runtime/index.js +121 -6
  10. package/package.json +1 -1
package/dist/components/index.cjs CHANGED
@@ -20310,7 +20310,7 @@ var init_CurrentPagePathContext = __esm({
20310
20310
  useCurrentPagePath = () => React78.useContext(CurrentPagePathContext);
20311
20311
  }
20312
20312
  });
20313
- exports.DashboardLayout = void 0; var NavLink;
20313
+ exports.DashboardLayout = void 0; var NavLink, NavLinkTopnav, NavLinkBottom;
20314
20314
  var init_DashboardLayout = __esm({
20315
20315
  "components/templates/DashboardLayout.tsx"() {
20316
20316
  "use client";
@@ -20341,6 +20341,7 @@ var init_DashboardLayout = __esm({
20341
20341
  sidebarFooter,
20342
20342
  onSignOut: onSignOutProp,
20343
20343
  currentPath,
20344
+ layoutMode = "sidebar",
20344
20345
  children
20345
20346
  }) => {
20346
20347
  const eventBus = useEventBus();
@@ -20371,20 +20372,24 @@ var init_DashboardLayout = __esm({
20371
20372
  } : null);
20372
20373
  const { t } = useTranslate();
20373
20374
  const handleSignOut = onSignOutProp || authSignOut;
20375
+ const showSidebar = layoutMode === "sidebar";
20376
+ const showHeader = layoutMode !== "minimal";
20377
+ const showBottomNav = layoutMode === "bottomnav";
20378
+ const isTopNav = layoutMode === "topnav";
20374
20379
  return /* @__PURE__ */ jsxRuntime.jsxs(
20375
20380
  exports.HStack,
20376
20381
  {
20377
20382
  gap: "none",
20378
20383
  className: "@container/dashboard min-h-screen w-full bg-background dark:bg-background items-stretch",
20379
20384
  children: [
20380
- sidebarOpen && /* @__PURE__ */ jsxRuntime.jsx(
20385
+ showSidebar && sidebarOpen && /* @__PURE__ */ jsxRuntime.jsx(
20381
20386
  exports.Box,
20382
20387
  {
20383
20388
  className: "fixed inset-0 bg-foreground/50 dark:bg-foreground/70 z-20 @lg/dashboard:hidden",
20384
20389
  onClick: () => setSidebarOpen(false)
20385
20390
  }
20386
20391
  ),
20387
- /* @__PURE__ */ jsxRuntime.jsxs(
20392
+ showSidebar && /* @__PURE__ */ jsxRuntime.jsxs(
20388
20393
  exports.Box,
20389
20394
  {
20390
20395
  as: "aside",
@@ -20456,7 +20461,7 @@ var init_DashboardLayout = __esm({
20456
20461
  }
20457
20462
  ),
20458
20463
  /* @__PURE__ */ jsxRuntime.jsxs(exports.VStack, { gap: "none", className: "flex-1 min-w-0 min-h-screen", children: [
20459
- /* @__PURE__ */ jsxRuntime.jsx(
20464
+ showHeader && /* @__PURE__ */ jsxRuntime.jsx(
20460
20465
  exports.Box,
20461
20466
  {
20462
20467
  as: "header",
@@ -20468,7 +20473,7 @@ var init_DashboardLayout = __esm({
20468
20473
  justify: "between",
20469
20474
  className: "h-full px-3 @sm/dashboard:px-4 gap-2 @sm/dashboard:gap-4",
20470
20475
  children: [
20471
- /* @__PURE__ */ jsxRuntime.jsx(
20476
+ showSidebar && /* @__PURE__ */ jsxRuntime.jsx(
20472
20477
  exports.Button,
20473
20478
  {
20474
20479
  variant: "ghost",
@@ -20478,6 +20483,45 @@ var init_DashboardLayout = __esm({
20478
20483
  children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Menu, { className: "h-5 w-5" })
20479
20484
  }
20480
20485
  ),
20486
+ isTopNav && /* @__PURE__ */ jsxRuntime.jsxs(
20487
+ exports.HStack,
20488
+ {
20489
+ as: "nav",
20490
+ align: "center",
20491
+ gap: "none",
20492
+ className: "hidden @md/dashboard:flex items-center gap-1 overflow-x-auto",
20493
+ children: [
20494
+ /* @__PURE__ */ jsxRuntime.jsxs(reactRouterDom.Link, { to: "/", className: "flex items-center gap-2 mr-3 shrink-0", children: [
20495
+ logo || /* @__PURE__ */ jsxRuntime.jsx(exports.Box, { className: "w-7 h-7 bg-primary-600 rounded-lg flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
20496
+ exports.Typography,
20497
+ {
20498
+ variant: "small",
20499
+ className: "text-white font-bold text-xs",
20500
+ as: "span",
20501
+ children: appName.charAt(0).toUpperCase()
20502
+ }
20503
+ ) }),
20504
+ /* @__PURE__ */ jsxRuntime.jsx(
20505
+ exports.Typography,
20506
+ {
20507
+ variant: "label",
20508
+ className: "font-semibold text-foreground dark:text-foreground",
20509
+ as: "span",
20510
+ children: appName
20511
+ }
20512
+ )
20513
+ ] }),
20514
+ navItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
20515
+ NavLinkTopnav,
20516
+ {
20517
+ item,
20518
+ currentPath: activePath
20519
+ },
20520
+ item.href
20521
+ ))
20522
+ ]
20523
+ }
20524
+ ),
20481
20525
  searchEnabled && /* @__PURE__ */ jsxRuntime.jsx(exports.Box, { className: "hidden @sm/dashboard:block flex-1 min-w-0 @xl/dashboard:max-w-md", children: /* @__PURE__ */ jsxRuntime.jsxs(exports.Box, { className: "relative", children: [
20482
20526
  /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground dark:text-muted-foreground" }),
20483
20527
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -20625,7 +20669,22 @@ var init_DashboardLayout = __esm({
20625
20669
  )
20626
20670
  }
20627
20671
  ),
20628
- /* @__PURE__ */ jsxRuntime.jsx(exports.Box, { as: "main", className: "flex-1 p-3 @sm/dashboard:p-4 @md/dashboard:p-6", children })
20672
+ /* @__PURE__ */ jsxRuntime.jsx(exports.Box, { as: "main", className: "flex-1 p-3 @sm/dashboard:p-4 @md/dashboard:p-6", children }),
20673
+ showBottomNav && /* @__PURE__ */ jsxRuntime.jsx(
20674
+ exports.Box,
20675
+ {
20676
+ as: "nav",
20677
+ className: "sticky bottom-0 z-20 h-16 bg-card dark:bg-card border-t border-border dark:border-border @md/dashboard:hidden",
20678
+ children: /* @__PURE__ */ jsxRuntime.jsx(exports.HStack, { align: "center", justify: "around", className: "h-full px-2", children: navItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
20679
+ NavLinkBottom,
20680
+ {
20681
+ item,
20682
+ currentPath: activePath
20683
+ },
20684
+ item.href
20685
+ )) })
20686
+ }
20687
+ )
20629
20688
  ] })
20630
20689
  ]
20631
20690
  }
@@ -20667,6 +20726,62 @@ var init_DashboardLayout = __esm({
20667
20726
  );
20668
20727
  };
20669
20728
  NavLink.displayName = "NavLink";
20729
+ NavLinkTopnav = ({
20730
+ item,
20731
+ currentPath
20732
+ }) => {
20733
+ const isActive = currentPath === item.href || currentPath.startsWith(item.href + "/");
20734
+ return /* @__PURE__ */ jsxRuntime.jsxs(
20735
+ reactRouterDom.Link,
20736
+ {
20737
+ to: item.href,
20738
+ className: cn(
20739
+ "flex items-center gap-1.5 px-3 py-1.5 rounded-md text-sm font-medium transition-colors whitespace-nowrap",
20740
+ isActive ? "bg-primary text-primary-foreground shadow-sm" : "text-muted-foreground hover:bg-muted hover:text-foreground"
20741
+ ),
20742
+ children: [
20743
+ item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(exports.Icon, { name: item.icon, className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(item.icon, { className: "h-4 w-4" })),
20744
+ /* @__PURE__ */ jsxRuntime.jsx(exports.Typography, { variant: "small", className: "flex-1", as: "span", children: item.label }),
20745
+ item.badge && /* @__PURE__ */ jsxRuntime.jsx(exports.Badge, { variant: isActive ? "primary" : "default", size: "sm", children: item.badge })
20746
+ ]
20747
+ }
20748
+ );
20749
+ };
20750
+ NavLinkTopnav.displayName = "NavLinkTopnav";
20751
+ NavLinkBottom = ({
20752
+ item,
20753
+ currentPath
20754
+ }) => {
20755
+ const isActive = currentPath === item.href || currentPath.startsWith(item.href + "/");
20756
+ const iconClassName = cn(
20757
+ "h-5 w-5",
20758
+ isActive ? "text-primary" : "text-muted-foreground"
20759
+ );
20760
+ return /* @__PURE__ */ jsxRuntime.jsxs(
20761
+ reactRouterDom.Link,
20762
+ {
20763
+ to: item.href,
20764
+ className: "flex flex-col items-center justify-center gap-0.5 px-2 py-1 rounded-lg transition-colors flex-1 min-w-0",
20765
+ children: [
20766
+ item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(exports.Icon, { name: item.icon, className: iconClassName }) : /* @__PURE__ */ jsxRuntime.jsx(item.icon, { className: iconClassName })),
20767
+ /* @__PURE__ */ jsxRuntime.jsx(
20768
+ exports.Typography,
20769
+ {
20770
+ variant: "caption",
20771
+ className: cn(
20772
+ "text-[10px] leading-tight truncate max-w-full",
20773
+ isActive ? "text-primary font-medium" : "text-muted-foreground"
20774
+ ),
20775
+ as: "span",
20776
+ children: item.label
20777
+ }
20778
+ ),
20779
+ item.badge && /* @__PURE__ */ jsxRuntime.jsx(exports.Badge, { variant: isActive ? "primary" : "default", size: "sm", className: "text-[8px] px-1 py-0 min-w-0", children: item.badge })
20780
+ ]
20781
+ }
20782
+ );
20783
+ };
20784
+ NavLinkBottom.displayName = "NavLinkBottom";
20670
20785
  }
20671
20786
  });
20672
20787
  function useAlmadarDndSensors(withSortableKeyboard = true) {
package/dist/components/index.js CHANGED
@@ -20264,7 +20264,7 @@ var init_CurrentPagePathContext = __esm({
20264
20264
  useCurrentPagePath = () => useContext(CurrentPagePathContext);
20265
20265
  }
20266
20266
  });
20267
- var DashboardLayout, NavLink;
20267
+ var DashboardLayout, NavLink, NavLinkTopnav, NavLinkBottom;
20268
20268
  var init_DashboardLayout = __esm({
20269
20269
  "components/templates/DashboardLayout.tsx"() {
20270
20270
  "use client";
@@ -20295,6 +20295,7 @@ var init_DashboardLayout = __esm({
20295
20295
  sidebarFooter,
20296
20296
  onSignOut: onSignOutProp,
20297
20297
  currentPath,
20298
+ layoutMode = "sidebar",
20298
20299
  children
20299
20300
  }) => {
20300
20301
  const eventBus = useEventBus();
@@ -20325,20 +20326,24 @@ var init_DashboardLayout = __esm({
20325
20326
  } : null);
20326
20327
  const { t } = useTranslate();
20327
20328
  const handleSignOut = onSignOutProp || authSignOut;
20329
+ const showSidebar = layoutMode === "sidebar";
20330
+ const showHeader = layoutMode !== "minimal";
20331
+ const showBottomNav = layoutMode === "bottomnav";
20332
+ const isTopNav = layoutMode === "topnav";
20328
20333
  return /* @__PURE__ */ jsxs(
20329
20334
  HStack,
20330
20335
  {
20331
20336
  gap: "none",
20332
20337
  className: "@container/dashboard min-h-screen w-full bg-background dark:bg-background items-stretch",
20333
20338
  children: [
20334
- sidebarOpen && /* @__PURE__ */ jsx(
20339
+ showSidebar && sidebarOpen && /* @__PURE__ */ jsx(
20335
20340
  Box,
20336
20341
  {
20337
20342
  className: "fixed inset-0 bg-foreground/50 dark:bg-foreground/70 z-20 @lg/dashboard:hidden",
20338
20343
  onClick: () => setSidebarOpen(false)
20339
20344
  }
20340
20345
  ),
20341
- /* @__PURE__ */ jsxs(
20346
+ showSidebar && /* @__PURE__ */ jsxs(
20342
20347
  Box,
20343
20348
  {
20344
20349
  as: "aside",
@@ -20410,7 +20415,7 @@ var init_DashboardLayout = __esm({
20410
20415
  }
20411
20416
  ),
20412
20417
  /* @__PURE__ */ jsxs(VStack, { gap: "none", className: "flex-1 min-w-0 min-h-screen", children: [
20413
- /* @__PURE__ */ jsx(
20418
+ showHeader && /* @__PURE__ */ jsx(
20414
20419
  Box,
20415
20420
  {
20416
20421
  as: "header",
@@ -20422,7 +20427,7 @@ var init_DashboardLayout = __esm({
20422
20427
  justify: "between",
20423
20428
  className: "h-full px-3 @sm/dashboard:px-4 gap-2 @sm/dashboard:gap-4",
20424
20429
  children: [
20425
- /* @__PURE__ */ jsx(
20430
+ showSidebar && /* @__PURE__ */ jsx(
20426
20431
  Button,
20427
20432
  {
20428
20433
  variant: "ghost",
@@ -20432,6 +20437,45 @@ var init_DashboardLayout = __esm({
20432
20437
  children: /* @__PURE__ */ jsx(Menu$1, { className: "h-5 w-5" })
20433
20438
  }
20434
20439
  ),
20440
+ isTopNav && /* @__PURE__ */ jsxs(
20441
+ HStack,
20442
+ {
20443
+ as: "nav",
20444
+ align: "center",
20445
+ gap: "none",
20446
+ className: "hidden @md/dashboard:flex items-center gap-1 overflow-x-auto",
20447
+ children: [
20448
+ /* @__PURE__ */ jsxs(Link, { to: "/", className: "flex items-center gap-2 mr-3 shrink-0", children: [
20449
+ logo || /* @__PURE__ */ jsx(Box, { className: "w-7 h-7 bg-primary-600 rounded-lg flex items-center justify-center", children: /* @__PURE__ */ jsx(
20450
+ Typography,
20451
+ {
20452
+ variant: "small",
20453
+ className: "text-white font-bold text-xs",
20454
+ as: "span",
20455
+ children: appName.charAt(0).toUpperCase()
20456
+ }
20457
+ ) }),
20458
+ /* @__PURE__ */ jsx(
20459
+ Typography,
20460
+ {
20461
+ variant: "label",
20462
+ className: "font-semibold text-foreground dark:text-foreground",
20463
+ as: "span",
20464
+ children: appName
20465
+ }
20466
+ )
20467
+ ] }),
20468
+ navItems.map((item) => /* @__PURE__ */ jsx(
20469
+ NavLinkTopnav,
20470
+ {
20471
+ item,
20472
+ currentPath: activePath
20473
+ },
20474
+ item.href
20475
+ ))
20476
+ ]
20477
+ }
20478
+ ),
20435
20479
  searchEnabled && /* @__PURE__ */ jsx(Box, { className: "hidden @sm/dashboard:block flex-1 min-w-0 @xl/dashboard:max-w-md", children: /* @__PURE__ */ jsxs(Box, { className: "relative", children: [
20436
20480
  /* @__PURE__ */ jsx(Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground dark:text-muted-foreground" }),
20437
20481
  /* @__PURE__ */ jsx(
@@ -20579,7 +20623,22 @@ var init_DashboardLayout = __esm({
20579
20623
  )
20580
20624
  }
20581
20625
  ),
20582
- /* @__PURE__ */ jsx(Box, { as: "main", className: "flex-1 p-3 @sm/dashboard:p-4 @md/dashboard:p-6", children })
20626
+ /* @__PURE__ */ jsx(Box, { as: "main", className: "flex-1 p-3 @sm/dashboard:p-4 @md/dashboard:p-6", children }),
20627
+ showBottomNav && /* @__PURE__ */ jsx(
20628
+ Box,
20629
+ {
20630
+ as: "nav",
20631
+ className: "sticky bottom-0 z-20 h-16 bg-card dark:bg-card border-t border-border dark:border-border @md/dashboard:hidden",
20632
+ children: /* @__PURE__ */ jsx(HStack, { align: "center", justify: "around", className: "h-full px-2", children: navItems.map((item) => /* @__PURE__ */ jsx(
20633
+ NavLinkBottom,
20634
+ {
20635
+ item,
20636
+ currentPath: activePath
20637
+ },
20638
+ item.href
20639
+ )) })
20640
+ }
20641
+ )
20583
20642
  ] })
20584
20643
  ]
20585
20644
  }
@@ -20621,6 +20680,62 @@ var init_DashboardLayout = __esm({
20621
20680
  );
20622
20681
  };
20623
20682
  NavLink.displayName = "NavLink";
20683
+ NavLinkTopnav = ({
20684
+ item,
20685
+ currentPath
20686
+ }) => {
20687
+ const isActive = currentPath === item.href || currentPath.startsWith(item.href + "/");
20688
+ return /* @__PURE__ */ jsxs(
20689
+ Link,
20690
+ {
20691
+ to: item.href,
20692
+ className: cn(
20693
+ "flex items-center gap-1.5 px-3 py-1.5 rounded-md text-sm font-medium transition-colors whitespace-nowrap",
20694
+ isActive ? "bg-primary text-primary-foreground shadow-sm" : "text-muted-foreground hover:bg-muted hover:text-foreground"
20695
+ ),
20696
+ children: [
20697
+ item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsx(Icon, { name: item.icon, className: "h-4 w-4" }) : /* @__PURE__ */ jsx(item.icon, { className: "h-4 w-4" })),
20698
+ /* @__PURE__ */ jsx(Typography, { variant: "small", className: "flex-1", as: "span", children: item.label }),
20699
+ item.badge && /* @__PURE__ */ jsx(Badge, { variant: isActive ? "primary" : "default", size: "sm", children: item.badge })
20700
+ ]
20701
+ }
20702
+ );
20703
+ };
20704
+ NavLinkTopnav.displayName = "NavLinkTopnav";
20705
+ NavLinkBottom = ({
20706
+ item,
20707
+ currentPath
20708
+ }) => {
20709
+ const isActive = currentPath === item.href || currentPath.startsWith(item.href + "/");
20710
+ const iconClassName = cn(
20711
+ "h-5 w-5",
20712
+ isActive ? "text-primary" : "text-muted-foreground"
20713
+ );
20714
+ return /* @__PURE__ */ jsxs(
20715
+ Link,
20716
+ {
20717
+ to: item.href,
20718
+ className: "flex flex-col items-center justify-center gap-0.5 px-2 py-1 rounded-lg transition-colors flex-1 min-w-0",
20719
+ children: [
20720
+ item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsx(Icon, { name: item.icon, className: iconClassName }) : /* @__PURE__ */ jsx(item.icon, { className: iconClassName })),
20721
+ /* @__PURE__ */ jsx(
20722
+ Typography,
20723
+ {
20724
+ variant: "caption",
20725
+ className: cn(
20726
+ "text-[10px] leading-tight truncate max-w-full",
20727
+ isActive ? "text-primary font-medium" : "text-muted-foreground"
20728
+ ),
20729
+ as: "span",
20730
+ children: item.label
20731
+ }
20732
+ ),
20733
+ item.badge && /* @__PURE__ */ jsx(Badge, { variant: isActive ? "primary" : "default", size: "sm", className: "text-[8px] px-1 py-0 min-w-0", children: item.badge })
20734
+ ]
20735
+ }
20736
+ );
20737
+ };
20738
+ NavLinkBottom.displayName = "NavLinkBottom";
20624
20739
  }
20625
20740
  });
20626
20741
  function useAlmadarDndSensors(withSortableKeyboard = true) {
package/dist/components/templates/DashboardLayout.d.ts CHANGED
@@ -97,6 +97,12 @@ export interface DashboardLayoutProps {
97
97
  currentPath?: string;
98
98
  /** Callback when user clicks sign out (optional - uses auth context signOut if not provided) */
99
99
  onSignOut?: () => void;
100
+ /** Layout mode. Default `"sidebar"`.
101
+ * - `sidebar`: Left sidebar nav + top header (classic dashboard)
102
+ * - `topnav`: Horizontal nav in header, no sidebar
103
+ * - `bottomnav`: Bottom tab bar, no sidebar
104
+ * - `minimal`: No nav chrome, content only */
105
+ layoutMode?: "sidebar" | "topnav" | "bottomnav" | "minimal";
100
106
  /** Page content rendered inside the main area */
101
107
  children?: React.ReactNode;
102
108
  }
package/dist/providers/index.cjs CHANGED
@@ -21559,7 +21559,7 @@ var init_CurrentPagePathContext = __esm({
21559
21559
  useCurrentPagePath = () => React84.useContext(CurrentPagePathContext);
21560
21560
  }
21561
21561
  });
21562
- var DashboardLayout, NavLink;
21562
+ var DashboardLayout, NavLink, NavLinkTopnav, NavLinkBottom;
21563
21563
  var init_DashboardLayout = __esm({
21564
21564
  "components/templates/DashboardLayout.tsx"() {
21565
21565
  "use client";
@@ -21590,6 +21590,7 @@ var init_DashboardLayout = __esm({
21590
21590
  sidebarFooter,
21591
21591
  onSignOut: onSignOutProp,
21592
21592
  currentPath,
21593
+ layoutMode = "sidebar",
21593
21594
  children
21594
21595
  }) => {
21595
21596
  const eventBus = useEventBus();
@@ -21616,20 +21617,24 @@ var init_DashboardLayout = __esm({
21616
21617
  const user = userProp || (null);
21617
21618
  const { t } = useTranslate();
21618
21619
  const handleSignOut = onSignOutProp || authSignOut;
21620
+ const showSidebar = layoutMode === "sidebar";
21621
+ const showHeader = layoutMode !== "minimal";
21622
+ const showBottomNav = layoutMode === "bottomnav";
21623
+ const isTopNav = layoutMode === "topnav";
21619
21624
  return /* @__PURE__ */ jsxRuntime.jsxs(
21620
21625
  HStack,
21621
21626
  {
21622
21627
  gap: "none",
21623
21628
  className: "@container/dashboard min-h-screen w-full bg-background dark:bg-background items-stretch",
21624
21629
  children: [
21625
- sidebarOpen && /* @__PURE__ */ jsxRuntime.jsx(
21630
+ showSidebar && sidebarOpen && /* @__PURE__ */ jsxRuntime.jsx(
21626
21631
  Box,
21627
21632
  {
21628
21633
  className: "fixed inset-0 bg-foreground/50 dark:bg-foreground/70 z-20 @lg/dashboard:hidden",
21629
21634
  onClick: () => setSidebarOpen(false)
21630
21635
  }
21631
21636
  ),
21632
- /* @__PURE__ */ jsxRuntime.jsxs(
21637
+ showSidebar && /* @__PURE__ */ jsxRuntime.jsxs(
21633
21638
  Box,
21634
21639
  {
21635
21640
  as: "aside",
@@ -21701,7 +21706,7 @@ var init_DashboardLayout = __esm({
21701
21706
  }
21702
21707
  ),
21703
21708
  /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "none", className: "flex-1 min-w-0 min-h-screen", children: [
21704
- /* @__PURE__ */ jsxRuntime.jsx(
21709
+ showHeader && /* @__PURE__ */ jsxRuntime.jsx(
21705
21710
  Box,
21706
21711
  {
21707
21712
  as: "header",
@@ -21713,7 +21718,7 @@ var init_DashboardLayout = __esm({
21713
21718
  justify: "between",
21714
21719
  className: "h-full px-3 @sm/dashboard:px-4 gap-2 @sm/dashboard:gap-4",
21715
21720
  children: [
21716
- /* @__PURE__ */ jsxRuntime.jsx(
21721
+ showSidebar && /* @__PURE__ */ jsxRuntime.jsx(
21717
21722
  Button,
21718
21723
  {
21719
21724
  variant: "ghost",
@@ -21723,6 +21728,45 @@ var init_DashboardLayout = __esm({
21723
21728
  children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Menu, { className: "h-5 w-5" })
21724
21729
  }
21725
21730
  ),
21731
+ isTopNav && /* @__PURE__ */ jsxRuntime.jsxs(
21732
+ HStack,
21733
+ {
21734
+ as: "nav",
21735
+ align: "center",
21736
+ gap: "none",
21737
+ className: "hidden @md/dashboard:flex items-center gap-1 overflow-x-auto",
21738
+ children: [
21739
+ /* @__PURE__ */ jsxRuntime.jsxs(reactRouterDom.Link, { to: "/", className: "flex items-center gap-2 mr-3 shrink-0", children: [
21740
+ logo || /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-7 h-7 bg-primary-600 rounded-lg flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
21741
+ Typography,
21742
+ {
21743
+ variant: "small",
21744
+ className: "text-white font-bold text-xs",
21745
+ as: "span",
21746
+ children: appName.charAt(0).toUpperCase()
21747
+ }
21748
+ ) }),
21749
+ /* @__PURE__ */ jsxRuntime.jsx(
21750
+ Typography,
21751
+ {
21752
+ variant: "label",
21753
+ className: "font-semibold text-foreground dark:text-foreground",
21754
+ as: "span",
21755
+ children: appName
21756
+ }
21757
+ )
21758
+ ] }),
21759
+ navItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
21760
+ NavLinkTopnav,
21761
+ {
21762
+ item,
21763
+ currentPath: activePath
21764
+ },
21765
+ item.href
21766
+ ))
21767
+ ]
21768
+ }
21769
+ ),
21726
21770
  searchEnabled && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "hidden @sm/dashboard:block flex-1 min-w-0 @xl/dashboard:max-w-md", children: /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "relative", children: [
21727
21771
  /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground dark:text-muted-foreground" }),
21728
21772
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -21870,7 +21914,22 @@ var init_DashboardLayout = __esm({
21870
21914
  )
21871
21915
  }
21872
21916
  ),
21873
- /* @__PURE__ */ jsxRuntime.jsx(Box, { as: "main", className: "flex-1 p-3 @sm/dashboard:p-4 @md/dashboard:p-6", children })
21917
+ /* @__PURE__ */ jsxRuntime.jsx(Box, { as: "main", className: "flex-1 p-3 @sm/dashboard:p-4 @md/dashboard:p-6", children }),
21918
+ showBottomNav && /* @__PURE__ */ jsxRuntime.jsx(
21919
+ Box,
21920
+ {
21921
+ as: "nav",
21922
+ className: "sticky bottom-0 z-20 h-16 bg-card dark:bg-card border-t border-border dark:border-border @md/dashboard:hidden",
21923
+ children: /* @__PURE__ */ jsxRuntime.jsx(HStack, { align: "center", justify: "around", className: "h-full px-2", children: navItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
21924
+ NavLinkBottom,
21925
+ {
21926
+ item,
21927
+ currentPath: activePath
21928
+ },
21929
+ item.href
21930
+ )) })
21931
+ }
21932
+ )
21874
21933
  ] })
21875
21934
  ]
21876
21935
  }
@@ -21912,6 +21971,62 @@ var init_DashboardLayout = __esm({
21912
21971
  );
21913
21972
  };
21914
21973
  NavLink.displayName = "NavLink";
21974
+ NavLinkTopnav = ({
21975
+ item,
21976
+ currentPath
21977
+ }) => {
21978
+ const isActive = currentPath === item.href || currentPath.startsWith(item.href + "/");
21979
+ return /* @__PURE__ */ jsxRuntime.jsxs(
21980
+ reactRouterDom.Link,
21981
+ {
21982
+ to: item.href,
21983
+ className: cn(
21984
+ "flex items-center gap-1.5 px-3 py-1.5 rounded-md text-sm font-medium transition-colors whitespace-nowrap",
21985
+ isActive ? "bg-primary text-primary-foreground shadow-sm" : "text-muted-foreground hover:bg-muted hover:text-foreground"
21986
+ ),
21987
+ children: [
21988
+ item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: item.icon, className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(item.icon, { className: "h-4 w-4" })),
21989
+ /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", className: "flex-1", as: "span", children: item.label }),
21990
+ item.badge && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: isActive ? "primary" : "default", size: "sm", children: item.badge })
21991
+ ]
21992
+ }
21993
+ );
21994
+ };
21995
+ NavLinkTopnav.displayName = "NavLinkTopnav";
21996
+ NavLinkBottom = ({
21997
+ item,
21998
+ currentPath
21999
+ }) => {
22000
+ const isActive = currentPath === item.href || currentPath.startsWith(item.href + "/");
22001
+ const iconClassName = cn(
22002
+ "h-5 w-5",
22003
+ isActive ? "text-primary" : "text-muted-foreground"
22004
+ );
22005
+ return /* @__PURE__ */ jsxRuntime.jsxs(
22006
+ reactRouterDom.Link,
22007
+ {
22008
+ to: item.href,
22009
+ className: "flex flex-col items-center justify-center gap-0.5 px-2 py-1 rounded-lg transition-colors flex-1 min-w-0",
22010
+ children: [
22011
+ item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: item.icon, className: iconClassName }) : /* @__PURE__ */ jsxRuntime.jsx(item.icon, { className: iconClassName })),
22012
+ /* @__PURE__ */ jsxRuntime.jsx(
22013
+ Typography,
22014
+ {
22015
+ variant: "caption",
22016
+ className: cn(
22017
+ "text-[10px] leading-tight truncate max-w-full",
22018
+ isActive ? "text-primary font-medium" : "text-muted-foreground"
22019
+ ),
22020
+ as: "span",
22021
+ children: item.label
22022
+ }
22023
+ ),
22024
+ item.badge && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: isActive ? "primary" : "default", size: "sm", className: "text-[8px] px-1 py-0 min-w-0", children: item.badge })
22025
+ ]
22026
+ }
22027
+ );
22028
+ };
22029
+ NavLinkBottom.displayName = "NavLinkBottom";
21915
22030
  }
21916
22031
  });
21917
22032
  function useAlmadarDndSensors(withSortableKeyboard = true) {