@almadar/ui 4.54.15 → 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.
- package/dist/avl/index.cjs +121 -6
- package/dist/avl/index.js +121 -6
- package/dist/components/index.cjs +121 -6
- package/dist/components/index.js +121 -6
- package/dist/components/templates/DashboardLayout.d.ts +6 -0
- package/dist/providers/index.cjs +121 -6
- package/dist/providers/index.js +121 -6
- package/dist/runtime/index.cjs +121 -6
- package/dist/runtime/index.js +121 -6
- package/package.json +1 -1
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) {
|
|
@@ -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) {
|
package/dist/providers/index.js
CHANGED
|
@@ -21513,7 +21513,7 @@ var init_CurrentPagePathContext = __esm({
|
|
|
21513
21513
|
useCurrentPagePath = () => useContext(CurrentPagePathContext);
|
|
21514
21514
|
}
|
|
21515
21515
|
});
|
|
21516
|
-
var DashboardLayout, NavLink;
|
|
21516
|
+
var DashboardLayout, NavLink, NavLinkTopnav, NavLinkBottom;
|
|
21517
21517
|
var init_DashboardLayout = __esm({
|
|
21518
21518
|
"components/templates/DashboardLayout.tsx"() {
|
|
21519
21519
|
"use client";
|
|
@@ -21544,6 +21544,7 @@ var init_DashboardLayout = __esm({
|
|
|
21544
21544
|
sidebarFooter,
|
|
21545
21545
|
onSignOut: onSignOutProp,
|
|
21546
21546
|
currentPath,
|
|
21547
|
+
layoutMode = "sidebar",
|
|
21547
21548
|
children
|
|
21548
21549
|
}) => {
|
|
21549
21550
|
const eventBus = useEventBus();
|
|
@@ -21570,20 +21571,24 @@ var init_DashboardLayout = __esm({
|
|
|
21570
21571
|
const user = userProp || (null);
|
|
21571
21572
|
const { t } = useTranslate();
|
|
21572
21573
|
const handleSignOut = onSignOutProp || authSignOut;
|
|
21574
|
+
const showSidebar = layoutMode === "sidebar";
|
|
21575
|
+
const showHeader = layoutMode !== "minimal";
|
|
21576
|
+
const showBottomNav = layoutMode === "bottomnav";
|
|
21577
|
+
const isTopNav = layoutMode === "topnav";
|
|
21573
21578
|
return /* @__PURE__ */ jsxs(
|
|
21574
21579
|
HStack,
|
|
21575
21580
|
{
|
|
21576
21581
|
gap: "none",
|
|
21577
21582
|
className: "@container/dashboard min-h-screen w-full bg-background dark:bg-background items-stretch",
|
|
21578
21583
|
children: [
|
|
21579
|
-
sidebarOpen && /* @__PURE__ */ jsx(
|
|
21584
|
+
showSidebar && sidebarOpen && /* @__PURE__ */ jsx(
|
|
21580
21585
|
Box,
|
|
21581
21586
|
{
|
|
21582
21587
|
className: "fixed inset-0 bg-foreground/50 dark:bg-foreground/70 z-20 @lg/dashboard:hidden",
|
|
21583
21588
|
onClick: () => setSidebarOpen(false)
|
|
21584
21589
|
}
|
|
21585
21590
|
),
|
|
21586
|
-
/* @__PURE__ */ jsxs(
|
|
21591
|
+
showSidebar && /* @__PURE__ */ jsxs(
|
|
21587
21592
|
Box,
|
|
21588
21593
|
{
|
|
21589
21594
|
as: "aside",
|
|
@@ -21655,7 +21660,7 @@ var init_DashboardLayout = __esm({
|
|
|
21655
21660
|
}
|
|
21656
21661
|
),
|
|
21657
21662
|
/* @__PURE__ */ jsxs(VStack, { gap: "none", className: "flex-1 min-w-0 min-h-screen", children: [
|
|
21658
|
-
/* @__PURE__ */ jsx(
|
|
21663
|
+
showHeader && /* @__PURE__ */ jsx(
|
|
21659
21664
|
Box,
|
|
21660
21665
|
{
|
|
21661
21666
|
as: "header",
|
|
@@ -21667,7 +21672,7 @@ var init_DashboardLayout = __esm({
|
|
|
21667
21672
|
justify: "between",
|
|
21668
21673
|
className: "h-full px-3 @sm/dashboard:px-4 gap-2 @sm/dashboard:gap-4",
|
|
21669
21674
|
children: [
|
|
21670
|
-
/* @__PURE__ */ jsx(
|
|
21675
|
+
showSidebar && /* @__PURE__ */ jsx(
|
|
21671
21676
|
Button,
|
|
21672
21677
|
{
|
|
21673
21678
|
variant: "ghost",
|
|
@@ -21677,6 +21682,45 @@ var init_DashboardLayout = __esm({
|
|
|
21677
21682
|
children: /* @__PURE__ */ jsx(Menu$1, { className: "h-5 w-5" })
|
|
21678
21683
|
}
|
|
21679
21684
|
),
|
|
21685
|
+
isTopNav && /* @__PURE__ */ jsxs(
|
|
21686
|
+
HStack,
|
|
21687
|
+
{
|
|
21688
|
+
as: "nav",
|
|
21689
|
+
align: "center",
|
|
21690
|
+
gap: "none",
|
|
21691
|
+
className: "hidden @md/dashboard:flex items-center gap-1 overflow-x-auto",
|
|
21692
|
+
children: [
|
|
21693
|
+
/* @__PURE__ */ jsxs(Link, { to: "/", className: "flex items-center gap-2 mr-3 shrink-0", children: [
|
|
21694
|
+
logo || /* @__PURE__ */ jsx(Box, { className: "w-7 h-7 bg-primary-600 rounded-lg flex items-center justify-center", children: /* @__PURE__ */ jsx(
|
|
21695
|
+
Typography,
|
|
21696
|
+
{
|
|
21697
|
+
variant: "small",
|
|
21698
|
+
className: "text-white font-bold text-xs",
|
|
21699
|
+
as: "span",
|
|
21700
|
+
children: appName.charAt(0).toUpperCase()
|
|
21701
|
+
}
|
|
21702
|
+
) }),
|
|
21703
|
+
/* @__PURE__ */ jsx(
|
|
21704
|
+
Typography,
|
|
21705
|
+
{
|
|
21706
|
+
variant: "label",
|
|
21707
|
+
className: "font-semibold text-foreground dark:text-foreground",
|
|
21708
|
+
as: "span",
|
|
21709
|
+
children: appName
|
|
21710
|
+
}
|
|
21711
|
+
)
|
|
21712
|
+
] }),
|
|
21713
|
+
navItems.map((item) => /* @__PURE__ */ jsx(
|
|
21714
|
+
NavLinkTopnav,
|
|
21715
|
+
{
|
|
21716
|
+
item,
|
|
21717
|
+
currentPath: activePath
|
|
21718
|
+
},
|
|
21719
|
+
item.href
|
|
21720
|
+
))
|
|
21721
|
+
]
|
|
21722
|
+
}
|
|
21723
|
+
),
|
|
21680
21724
|
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: [
|
|
21681
21725
|
/* @__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" }),
|
|
21682
21726
|
/* @__PURE__ */ jsx(
|
|
@@ -21824,7 +21868,22 @@ var init_DashboardLayout = __esm({
|
|
|
21824
21868
|
)
|
|
21825
21869
|
}
|
|
21826
21870
|
),
|
|
21827
|
-
/* @__PURE__ */ jsx(Box, { as: "main", className: "flex-1 p-3 @sm/dashboard:p-4 @md/dashboard:p-6", children })
|
|
21871
|
+
/* @__PURE__ */ jsx(Box, { as: "main", className: "flex-1 p-3 @sm/dashboard:p-4 @md/dashboard:p-6", children }),
|
|
21872
|
+
showBottomNav && /* @__PURE__ */ jsx(
|
|
21873
|
+
Box,
|
|
21874
|
+
{
|
|
21875
|
+
as: "nav",
|
|
21876
|
+
className: "sticky bottom-0 z-20 h-16 bg-card dark:bg-card border-t border-border dark:border-border @md/dashboard:hidden",
|
|
21877
|
+
children: /* @__PURE__ */ jsx(HStack, { align: "center", justify: "around", className: "h-full px-2", children: navItems.map((item) => /* @__PURE__ */ jsx(
|
|
21878
|
+
NavLinkBottom,
|
|
21879
|
+
{
|
|
21880
|
+
item,
|
|
21881
|
+
currentPath: activePath
|
|
21882
|
+
},
|
|
21883
|
+
item.href
|
|
21884
|
+
)) })
|
|
21885
|
+
}
|
|
21886
|
+
)
|
|
21828
21887
|
] })
|
|
21829
21888
|
]
|
|
21830
21889
|
}
|
|
@@ -21866,6 +21925,62 @@ var init_DashboardLayout = __esm({
|
|
|
21866
21925
|
);
|
|
21867
21926
|
};
|
|
21868
21927
|
NavLink.displayName = "NavLink";
|
|
21928
|
+
NavLinkTopnav = ({
|
|
21929
|
+
item,
|
|
21930
|
+
currentPath
|
|
21931
|
+
}) => {
|
|
21932
|
+
const isActive = currentPath === item.href || currentPath.startsWith(item.href + "/");
|
|
21933
|
+
return /* @__PURE__ */ jsxs(
|
|
21934
|
+
Link,
|
|
21935
|
+
{
|
|
21936
|
+
to: item.href,
|
|
21937
|
+
className: cn(
|
|
21938
|
+
"flex items-center gap-1.5 px-3 py-1.5 rounded-md text-sm font-medium transition-colors whitespace-nowrap",
|
|
21939
|
+
isActive ? "bg-primary text-primary-foreground shadow-sm" : "text-muted-foreground hover:bg-muted hover:text-foreground"
|
|
21940
|
+
),
|
|
21941
|
+
children: [
|
|
21942
|
+
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" })),
|
|
21943
|
+
/* @__PURE__ */ jsx(Typography, { variant: "small", className: "flex-1", as: "span", children: item.label }),
|
|
21944
|
+
item.badge && /* @__PURE__ */ jsx(Badge, { variant: isActive ? "primary" : "default", size: "sm", children: item.badge })
|
|
21945
|
+
]
|
|
21946
|
+
}
|
|
21947
|
+
);
|
|
21948
|
+
};
|
|
21949
|
+
NavLinkTopnav.displayName = "NavLinkTopnav";
|
|
21950
|
+
NavLinkBottom = ({
|
|
21951
|
+
item,
|
|
21952
|
+
currentPath
|
|
21953
|
+
}) => {
|
|
21954
|
+
const isActive = currentPath === item.href || currentPath.startsWith(item.href + "/");
|
|
21955
|
+
const iconClassName = cn(
|
|
21956
|
+
"h-5 w-5",
|
|
21957
|
+
isActive ? "text-primary" : "text-muted-foreground"
|
|
21958
|
+
);
|
|
21959
|
+
return /* @__PURE__ */ jsxs(
|
|
21960
|
+
Link,
|
|
21961
|
+
{
|
|
21962
|
+
to: item.href,
|
|
21963
|
+
className: "flex flex-col items-center justify-center gap-0.5 px-2 py-1 rounded-lg transition-colors flex-1 min-w-0",
|
|
21964
|
+
children: [
|
|
21965
|
+
item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsx(Icon, { name: item.icon, className: iconClassName }) : /* @__PURE__ */ jsx(item.icon, { className: iconClassName })),
|
|
21966
|
+
/* @__PURE__ */ jsx(
|
|
21967
|
+
Typography,
|
|
21968
|
+
{
|
|
21969
|
+
variant: "caption",
|
|
21970
|
+
className: cn(
|
|
21971
|
+
"text-[10px] leading-tight truncate max-w-full",
|
|
21972
|
+
isActive ? "text-primary font-medium" : "text-muted-foreground"
|
|
21973
|
+
),
|
|
21974
|
+
as: "span",
|
|
21975
|
+
children: item.label
|
|
21976
|
+
}
|
|
21977
|
+
),
|
|
21978
|
+
item.badge && /* @__PURE__ */ jsx(Badge, { variant: isActive ? "primary" : "default", size: "sm", className: "text-[8px] px-1 py-0 min-w-0", children: item.badge })
|
|
21979
|
+
]
|
|
21980
|
+
}
|
|
21981
|
+
);
|
|
21982
|
+
};
|
|
21983
|
+
NavLinkBottom.displayName = "NavLinkBottom";
|
|
21869
21984
|
}
|
|
21870
21985
|
});
|
|
21871
21986
|
function useAlmadarDndSensors(withSortableKeyboard = true) {
|