@exegia/corpora-ui 0.21.0 → 0.22.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-lib/components/blocks/layout.d.ts +4 -1
- package/dist-lib/components/blocks/profile/profile-card-block.d.ts +1 -1
- package/dist-lib/components/blocks/shell/index.d.ts +0 -12
- package/dist-lib/components/composed/logo.d.ts +34 -0
- package/dist-lib/components/user-avatar/type.d.ts +10 -2
- package/dist-lib/components/user-avatar/use-user-avatar.d.ts +5 -0
- package/dist-lib/components/user-avatar/user-avatar-atom.d.ts +9 -0
- package/dist-lib/components/user-avatar/utils.d.ts +22 -0
- package/dist-lib/index.d.ts +1 -1
- package/dist-lib/index.js +3083 -3229
- package/dist-lib/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/blocks/layout.ts +30 -2
- package/src/components/blocks/profile/profile-card-block.tsx +1 -1
- package/src/components/blocks/shell/index.ts +0 -13
- package/src/components/composed/__tests__/logo.test.tsx +60 -0
- package/src/components/composed/logo.tsx +159 -0
- package/src/components/user-avatar/__tests__/user-avatar.test.tsx +41 -0
- package/src/components/user-avatar/component.tsx +38 -8
- package/src/components/user-avatar/fallback.tsx +3 -1
- package/src/components/user-avatar/type.ts +10 -2
- package/src/components/user-avatar/use-user-avatar.ts +38 -2
- package/src/components/user-avatar/user-avatar-atom.ts +20 -0
- package/src/components/user-avatar/utils.ts +94 -0
- package/src/index.ts +1 -1
- package/dist-lib/components/blocks/nav/sidebar-block.d.ts +0 -14
- package/dist-lib/components/blocks/nav/sidebar-nav-row.d.ts +0 -3
- package/dist-lib/components/blocks/nav/types.d.ts +0 -60
- package/dist-lib/components/blocks/nav/utils.d.ts +0 -1
- package/dist-lib/components/blocks/shell/animated-sidebar-content.d.ts +0 -2
- package/dist-lib/components/blocks/shell/animated-sidebar-footer.d.ts +0 -2
- package/dist-lib/components/blocks/shell/animated-sidebar-group-content.d.ts +0 -2
- package/dist-lib/components/blocks/shell/animated-sidebar-group-label.d.ts +0 -2
- package/dist-lib/components/blocks/shell/animated-sidebar-group.d.ts +0 -2
- package/dist-lib/components/blocks/shell/animated-sidebar-header.d.ts +0 -2
- package/dist-lib/components/blocks/shell/animated-sidebar-menu-button.d.ts +0 -3
- package/dist-lib/components/blocks/shell/animated-sidebar-menu-item.d.ts +0 -2
- package/dist-lib/components/blocks/shell/animated-sidebar-menu-sub-button.d.ts +0 -3
- package/dist-lib/components/blocks/shell/animated-sidebar-menu-sub-item.d.ts +0 -2
- package/dist-lib/components/blocks/shell/animated-sidebar-menu-sub.d.ts +0 -2
- package/dist-lib/components/blocks/shell/animated-sidebar-menu.d.ts +0 -2
- package/src/components/blocks/nav/__tests__/sidebar-block.test.tsx +0 -125
- package/src/components/blocks/nav/sidebar-block.tsx +0 -142
- package/src/components/blocks/nav/sidebar-nav-row.tsx +0 -78
- package/src/components/blocks/nav/types.ts +0 -65
- package/src/components/blocks/nav/utils.ts +0 -4
- package/src/components/blocks/shell/animated-sidebar-content.tsx +0 -19
- package/src/components/blocks/shell/animated-sidebar-footer.tsx +0 -19
- package/src/components/blocks/shell/animated-sidebar-group-content.tsx +0 -16
- package/src/components/blocks/shell/animated-sidebar-group-label.tsx +0 -29
- package/src/components/blocks/shell/animated-sidebar-group.tsx +0 -16
- package/src/components/blocks/shell/animated-sidebar-header.tsx +0 -16
- package/src/components/blocks/shell/animated-sidebar-menu-button.tsx +0 -151
- package/src/components/blocks/shell/animated-sidebar-menu-item.tsx +0 -20
- package/src/components/blocks/shell/animated-sidebar-menu-sub-button.tsx +0 -85
- package/src/components/blocks/shell/animated-sidebar-menu-sub-item.tsx +0 -19
- package/src/components/blocks/shell/animated-sidebar-menu-sub.tsx +0 -44
- package/src/components/blocks/shell/animated-sidebar-menu.tsx +0 -26
- /package/dist-lib/components/{blocks/nav/__tests__/sidebar-block.test.d.ts → composed/__tests__/logo.test.d.ts} +0 -0
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import { forwardRef, type HTMLAttributes } from "react"
|
|
2
|
-
import { cn } from "@/lib/utils"
|
|
3
|
-
|
|
4
|
-
export const AnimatedSidebarContent = forwardRef<
|
|
5
|
-
HTMLDivElement,
|
|
6
|
-
HTMLAttributes<HTMLDivElement>
|
|
7
|
-
>(function AnimatedSidebarContent({ className, ...props }, forwardedRef) {
|
|
8
|
-
return (
|
|
9
|
-
<div
|
|
10
|
-
{...props}
|
|
11
|
-
ref={forwardedRef}
|
|
12
|
-
data-slot="sidebar-content"
|
|
13
|
-
className={cn(
|
|
14
|
-
"flex min-h-0 flex-1 flex-col gap-2 overflow-x-hidden overflow-y-auto overscroll-contain px-2 py-2",
|
|
15
|
-
className
|
|
16
|
-
)}
|
|
17
|
-
/>
|
|
18
|
-
)
|
|
19
|
-
})
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import { forwardRef, type HTMLAttributes } from "react"
|
|
2
|
-
import { cn } from "@/lib/utils"
|
|
3
|
-
|
|
4
|
-
export const AnimatedSidebarFooter = forwardRef<
|
|
5
|
-
HTMLDivElement,
|
|
6
|
-
HTMLAttributes<HTMLDivElement>
|
|
7
|
-
>(function AnimatedSidebarFooter({ className, ...props }, forwardedRef) {
|
|
8
|
-
return (
|
|
9
|
-
<div
|
|
10
|
-
{...props}
|
|
11
|
-
ref={forwardedRef}
|
|
12
|
-
data-slot="sidebar-footer"
|
|
13
|
-
className={cn(
|
|
14
|
-
"flex shrink-0 flex-col gap-2 border-t border-border p-3 pb-[max(0.75rem,env(safe-area-inset-bottom))]",
|
|
15
|
-
className
|
|
16
|
-
)}
|
|
17
|
-
/>
|
|
18
|
-
)
|
|
19
|
-
})
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { forwardRef, type HTMLAttributes } from "react"
|
|
2
|
-
import { cn } from "@/lib/utils"
|
|
3
|
-
|
|
4
|
-
export const AnimatedSidebarGroupContent = forwardRef<
|
|
5
|
-
HTMLDivElement,
|
|
6
|
-
HTMLAttributes<HTMLDivElement>
|
|
7
|
-
>(function AnimatedSidebarGroupContent({ className, ...props }, forwardedRef) {
|
|
8
|
-
return (
|
|
9
|
-
<div
|
|
10
|
-
{...props}
|
|
11
|
-
ref={forwardedRef}
|
|
12
|
-
data-slot="sidebar-group-content"
|
|
13
|
-
className={cn("w-full min-w-0", className)}
|
|
14
|
-
/>
|
|
15
|
-
)
|
|
16
|
-
})
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
import { forwardRef, type HTMLAttributes } from "react"
|
|
2
|
-
import { cn } from "@/lib/utils"
|
|
3
|
-
import { useAnimatedSidebarPanel } from "./utils"
|
|
4
|
-
|
|
5
|
-
export const AnimatedSidebarGroupLabel = forwardRef<
|
|
6
|
-
HTMLDivElement,
|
|
7
|
-
HTMLAttributes<HTMLDivElement>
|
|
8
|
-
>(function AnimatedSidebarGroupLabel(
|
|
9
|
-
{ children, className, ...props },
|
|
10
|
-
forwardedRef
|
|
11
|
-
) {
|
|
12
|
-
const { collapsed } = useAnimatedSidebarPanel()
|
|
13
|
-
|
|
14
|
-
return (
|
|
15
|
-
<div
|
|
16
|
-
{...props}
|
|
17
|
-
ref={forwardedRef}
|
|
18
|
-
aria-hidden={collapsed}
|
|
19
|
-
data-slot="sidebar-group-label"
|
|
20
|
-
className={cn(
|
|
21
|
-
"mb-1 h-7 overflow-hidden px-2 text-[10px] font-medium tracking-[0.14em] text-muted-foreground uppercase transition-opacity",
|
|
22
|
-
collapsed ? "opacity-0" : "opacity-100",
|
|
23
|
-
className
|
|
24
|
-
)}
|
|
25
|
-
>
|
|
26
|
-
{children}
|
|
27
|
-
</div>
|
|
28
|
-
)
|
|
29
|
-
})
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { forwardRef, type HTMLAttributes } from "react"
|
|
2
|
-
import { cn } from "@/lib/utils"
|
|
3
|
-
|
|
4
|
-
export const AnimatedSidebarGroup = forwardRef<
|
|
5
|
-
HTMLDivElement,
|
|
6
|
-
HTMLAttributes<HTMLDivElement>
|
|
7
|
-
>(function AnimatedSidebarGroup({ className, ...props }, forwardedRef) {
|
|
8
|
-
return (
|
|
9
|
-
<div
|
|
10
|
-
{...props}
|
|
11
|
-
ref={forwardedRef}
|
|
12
|
-
data-slot="sidebar-group"
|
|
13
|
-
className={cn("flex w-full min-w-0 flex-col px-1 py-1.5", className)}
|
|
14
|
-
/>
|
|
15
|
-
)
|
|
16
|
-
})
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { forwardRef, type HTMLAttributes } from "react"
|
|
2
|
-
import { cn } from "@/lib/utils"
|
|
3
|
-
|
|
4
|
-
export const AnimatedSidebarHeader = forwardRef<
|
|
5
|
-
HTMLDivElement,
|
|
6
|
-
HTMLAttributes<HTMLDivElement>
|
|
7
|
-
>(function AnimatedSidebarHeader({ className, ...props }, forwardedRef) {
|
|
8
|
-
return (
|
|
9
|
-
<div
|
|
10
|
-
{...props}
|
|
11
|
-
ref={forwardedRef}
|
|
12
|
-
data-slot="sidebar-header"
|
|
13
|
-
className={cn("flex shrink-0 flex-col gap-2 p-3", className)}
|
|
14
|
-
/>
|
|
15
|
-
)
|
|
16
|
-
})
|
|
@@ -1,151 +0,0 @@
|
|
|
1
|
-
import type * as React from "react"
|
|
2
|
-
import { ChevronRight } from "lucide-react"
|
|
3
|
-
import { motion } from "motion/react"
|
|
4
|
-
import { SPRING_LAYOUT, SPRING_PRESS } from "@/lib/ease"
|
|
5
|
-
import { cn } from "@/lib/utils"
|
|
6
|
-
import type { AnimatedSidebarMenuButtonProps } from "./type"
|
|
7
|
-
import {
|
|
8
|
-
LABEL_ENTER_TRANSITION,
|
|
9
|
-
LABEL_EXIT_TRANSITION,
|
|
10
|
-
REDUCED_TRANSITION,
|
|
11
|
-
useAnimatedSidebar,
|
|
12
|
-
useAnimatedSidebarPanel,
|
|
13
|
-
} from "./utils"
|
|
14
|
-
|
|
15
|
-
export function AnimatedSidebarMenuButton({
|
|
16
|
-
children,
|
|
17
|
-
icon,
|
|
18
|
-
badge,
|
|
19
|
-
href,
|
|
20
|
-
isActive = false,
|
|
21
|
-
ariaExpanded,
|
|
22
|
-
disabled = false,
|
|
23
|
-
closeOnSelect,
|
|
24
|
-
target,
|
|
25
|
-
rel,
|
|
26
|
-
onSelect,
|
|
27
|
-
className,
|
|
28
|
-
}: AnimatedSidebarMenuButtonProps) {
|
|
29
|
-
const context = useAnimatedSidebar()
|
|
30
|
-
const panel = useAnimatedSidebarPanel()
|
|
31
|
-
const textLabel = typeof children === "string" ? children : undefined
|
|
32
|
-
|
|
33
|
-
const select = (
|
|
34
|
-
event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>
|
|
35
|
-
) => {
|
|
36
|
-
if (disabled) {
|
|
37
|
-
event.preventDefault()
|
|
38
|
-
return
|
|
39
|
-
}
|
|
40
|
-
onSelect?.()
|
|
41
|
-
const shouldCloseOnSelect = closeOnSelect ?? ariaExpanded === undefined
|
|
42
|
-
if (context.isMobile && shouldCloseOnSelect) {
|
|
43
|
-
context.setOpenMobile(false, panel.side)
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
const content = (
|
|
48
|
-
<>
|
|
49
|
-
{isActive ? (
|
|
50
|
-
<motion.span
|
|
51
|
-
layoutId={context.layoutId}
|
|
52
|
-
transition={context.reduce ? { duration: 0 } : SPRING_LAYOUT}
|
|
53
|
-
className="absolute inset-0 rounded-xl bg-muted"
|
|
54
|
-
/>
|
|
55
|
-
) : null}
|
|
56
|
-
{icon ? (
|
|
57
|
-
<span
|
|
58
|
-
aria-hidden="true"
|
|
59
|
-
className="relative z-10 grid size-5 shrink-0 place-items-center"
|
|
60
|
-
>
|
|
61
|
-
{icon}
|
|
62
|
-
</span>
|
|
63
|
-
) : null}
|
|
64
|
-
<motion.span
|
|
65
|
-
initial={false}
|
|
66
|
-
animate={{
|
|
67
|
-
opacity: panel.collapsed ? 0 : 1,
|
|
68
|
-
x: panel.collapsed ? -4 : 0,
|
|
69
|
-
}}
|
|
70
|
-
transition={
|
|
71
|
-
context.reduce
|
|
72
|
-
? REDUCED_TRANSITION
|
|
73
|
-
: panel.collapsed
|
|
74
|
-
? LABEL_EXIT_TRANSITION
|
|
75
|
-
: LABEL_ENTER_TRANSITION
|
|
76
|
-
}
|
|
77
|
-
aria-hidden={panel.collapsed}
|
|
78
|
-
className={cn(
|
|
79
|
-
"relative z-10 min-w-0 flex-1 truncate",
|
|
80
|
-
panel.collapsed && "pointer-events-none"
|
|
81
|
-
)}
|
|
82
|
-
>
|
|
83
|
-
{children}
|
|
84
|
-
</motion.span>
|
|
85
|
-
{badge && !panel.collapsed ? (
|
|
86
|
-
<span className="relative z-10 shrink-0 text-xs text-muted-foreground">
|
|
87
|
-
{badge}
|
|
88
|
-
</span>
|
|
89
|
-
) : null}
|
|
90
|
-
{ariaExpanded !== undefined ? (
|
|
91
|
-
<motion.span
|
|
92
|
-
aria-hidden="true"
|
|
93
|
-
initial={false}
|
|
94
|
-
animate={{
|
|
95
|
-
opacity: panel.collapsed ? 0 : 1,
|
|
96
|
-
rotate: ariaExpanded ? 90 : 0,
|
|
97
|
-
x: panel.collapsed ? 4 : 0,
|
|
98
|
-
}}
|
|
99
|
-
transition={context.reduce ? { duration: 0 } : SPRING_LAYOUT}
|
|
100
|
-
className="relative z-10 grid size-4 shrink-0 place-items-center text-muted-foreground"
|
|
101
|
-
>
|
|
102
|
-
<ChevronRight className="size-3.5" />
|
|
103
|
-
</motion.span>
|
|
104
|
-
) : null}
|
|
105
|
-
</>
|
|
106
|
-
)
|
|
107
|
-
|
|
108
|
-
const interactiveClassName = cn(
|
|
109
|
-
"relative flex min-h-9 w-full min-w-0 items-center gap-2.5 overflow-hidden rounded-xl px-3 text-left text-sm font-medium outline-none",
|
|
110
|
-
"text-muted-foreground transition-colors hover:text-foreground",
|
|
111
|
-
"focus-visible:bg-muted/70 focus-visible:ring-2 focus-visible:ring-ring",
|
|
112
|
-
isActive && "text-foreground",
|
|
113
|
-
disabled && "cursor-not-allowed opacity-40",
|
|
114
|
-
className
|
|
115
|
-
)
|
|
116
|
-
|
|
117
|
-
return href ? (
|
|
118
|
-
<motion.a
|
|
119
|
-
href={href}
|
|
120
|
-
target={target}
|
|
121
|
-
rel={rel ?? (target === "_blank" ? "noreferrer noopener" : undefined)}
|
|
122
|
-
aria-current={isActive ? "page" : undefined}
|
|
123
|
-
aria-expanded={ariaExpanded}
|
|
124
|
-
aria-disabled={disabled || undefined}
|
|
125
|
-
aria-label={panel.collapsed ? textLabel : undefined}
|
|
126
|
-
title={panel.collapsed ? textLabel : undefined}
|
|
127
|
-
tabIndex={disabled ? -1 : undefined}
|
|
128
|
-
onClick={select}
|
|
129
|
-
whileTap={context.reduce || disabled ? undefined : { scale: 0.98 }}
|
|
130
|
-
transition={SPRING_PRESS}
|
|
131
|
-
className={interactiveClassName}
|
|
132
|
-
>
|
|
133
|
-
{content}
|
|
134
|
-
</motion.a>
|
|
135
|
-
) : (
|
|
136
|
-
<motion.button
|
|
137
|
-
type="button"
|
|
138
|
-
disabled={disabled}
|
|
139
|
-
aria-current={isActive ? "page" : undefined}
|
|
140
|
-
aria-expanded={ariaExpanded}
|
|
141
|
-
aria-label={panel.collapsed ? textLabel : undefined}
|
|
142
|
-
title={panel.collapsed ? textLabel : undefined}
|
|
143
|
-
onClick={select}
|
|
144
|
-
whileTap={context.reduce || disabled ? undefined : { scale: 0.98 }}
|
|
145
|
-
transition={SPRING_PRESS}
|
|
146
|
-
className={interactiveClassName}
|
|
147
|
-
>
|
|
148
|
-
{content}
|
|
149
|
-
</motion.button>
|
|
150
|
-
)
|
|
151
|
-
}
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { forwardRef } from "react"
|
|
2
|
-
import { motion, type HTMLMotionProps } from "motion/react"
|
|
3
|
-
import { SPRING_LAYOUT } from "@/lib/ease"
|
|
4
|
-
import { cn } from "@/lib/utils"
|
|
5
|
-
|
|
6
|
-
export const AnimatedSidebarMenuItem = forwardRef<
|
|
7
|
-
HTMLLIElement,
|
|
8
|
-
HTMLMotionProps<"li">
|
|
9
|
-
>(function AnimatedSidebarMenuItem({ className, ...props }, forwardedRef) {
|
|
10
|
-
return (
|
|
11
|
-
<motion.li
|
|
12
|
-
{...props}
|
|
13
|
-
ref={forwardedRef}
|
|
14
|
-
layout="position"
|
|
15
|
-
transition={SPRING_LAYOUT}
|
|
16
|
-
data-slot="sidebar-menu-item"
|
|
17
|
-
className={cn("relative", className)}
|
|
18
|
-
/>
|
|
19
|
-
)
|
|
20
|
-
})
|
|
@@ -1,85 +0,0 @@
|
|
|
1
|
-
import type * as React from "react"
|
|
2
|
-
import { motion } from "motion/react"
|
|
3
|
-
import { SPRING_PRESS } from "@/lib/ease"
|
|
4
|
-
import { cn } from "@/lib/utils"
|
|
5
|
-
import type { AnimatedSidebarMenuSubButtonProps } from "./type"
|
|
6
|
-
import { useAnimatedSidebar, useAnimatedSidebarPanel } from "./utils"
|
|
7
|
-
|
|
8
|
-
export function AnimatedSidebarMenuSubButton({
|
|
9
|
-
children,
|
|
10
|
-
icon,
|
|
11
|
-
href,
|
|
12
|
-
isActive = false,
|
|
13
|
-
disabled = false,
|
|
14
|
-
closeOnSelect = true,
|
|
15
|
-
target,
|
|
16
|
-
rel,
|
|
17
|
-
onSelect,
|
|
18
|
-
className,
|
|
19
|
-
}: AnimatedSidebarMenuSubButtonProps) {
|
|
20
|
-
const context = useAnimatedSidebar()
|
|
21
|
-
const panel = useAnimatedSidebarPanel()
|
|
22
|
-
|
|
23
|
-
const select = (
|
|
24
|
-
event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>
|
|
25
|
-
) => {
|
|
26
|
-
if (disabled) {
|
|
27
|
-
event.preventDefault()
|
|
28
|
-
return
|
|
29
|
-
}
|
|
30
|
-
onSelect?.()
|
|
31
|
-
if (context.isMobile && closeOnSelect) {
|
|
32
|
-
context.setOpenMobile(false, panel.side)
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
const content = (
|
|
37
|
-
<>
|
|
38
|
-
<span
|
|
39
|
-
aria-hidden="true"
|
|
40
|
-
className="grid size-4 shrink-0 place-items-center"
|
|
41
|
-
>
|
|
42
|
-
{icon ?? <span className="size-1 rounded-full bg-current" />}
|
|
43
|
-
</span>
|
|
44
|
-
<span className="min-w-0 flex-1 truncate">{children}</span>
|
|
45
|
-
</>
|
|
46
|
-
)
|
|
47
|
-
|
|
48
|
-
const interactiveClassName = cn(
|
|
49
|
-
"flex min-h-8 w-full min-w-0 items-center gap-2 rounded-lg px-2 text-left text-xs outline-none",
|
|
50
|
-
"text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground",
|
|
51
|
-
"focus-visible:bg-muted/70 focus-visible:ring-2 focus-visible:ring-ring",
|
|
52
|
-
isActive && "bg-muted/70 text-foreground",
|
|
53
|
-
disabled && "cursor-not-allowed opacity-40",
|
|
54
|
-
className
|
|
55
|
-
)
|
|
56
|
-
|
|
57
|
-
return href ? (
|
|
58
|
-
<motion.a
|
|
59
|
-
href={href}
|
|
60
|
-
target={target}
|
|
61
|
-
rel={rel ?? (target === "_blank" ? "noreferrer noopener" : undefined)}
|
|
62
|
-
aria-current={isActive ? "page" : undefined}
|
|
63
|
-
aria-disabled={disabled || undefined}
|
|
64
|
-
tabIndex={disabled ? -1 : undefined}
|
|
65
|
-
onClick={select}
|
|
66
|
-
whileTap={context.reduce || disabled ? undefined : { scale: 0.98 }}
|
|
67
|
-
transition={SPRING_PRESS}
|
|
68
|
-
className={interactiveClassName}
|
|
69
|
-
>
|
|
70
|
-
{content}
|
|
71
|
-
</motion.a>
|
|
72
|
-
) : (
|
|
73
|
-
<motion.button
|
|
74
|
-
type="button"
|
|
75
|
-
disabled={disabled}
|
|
76
|
-
aria-current={isActive ? "page" : undefined}
|
|
77
|
-
onClick={select}
|
|
78
|
-
whileTap={context.reduce || disabled ? undefined : { scale: 0.98 }}
|
|
79
|
-
transition={SPRING_PRESS}
|
|
80
|
-
className={interactiveClassName}
|
|
81
|
-
>
|
|
82
|
-
{content}
|
|
83
|
-
</motion.button>
|
|
84
|
-
)
|
|
85
|
-
}
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import { forwardRef } from "react"
|
|
2
|
-
import { motion, type HTMLMotionProps } from "motion/react"
|
|
3
|
-
import { cn } from "@/lib/utils"
|
|
4
|
-
import { SUBMENU_ITEM_VARIANTS } from "./utils"
|
|
5
|
-
|
|
6
|
-
export const AnimatedSidebarMenuSubItem = forwardRef<
|
|
7
|
-
HTMLLIElement,
|
|
8
|
-
HTMLMotionProps<"li">
|
|
9
|
-
>(function AnimatedSidebarMenuSubItem({ className, ...props }, forwardedRef) {
|
|
10
|
-
return (
|
|
11
|
-
<motion.li
|
|
12
|
-
{...props}
|
|
13
|
-
ref={forwardedRef}
|
|
14
|
-
variants={SUBMENU_ITEM_VARIANTS}
|
|
15
|
-
data-slot="sidebar-menu-sub-item"
|
|
16
|
-
className={cn("relative min-w-0", className)}
|
|
17
|
-
/>
|
|
18
|
-
)
|
|
19
|
-
})
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
import { forwardRef } from "react"
|
|
2
|
-
import { AnimatePresence, motion } from "motion/react"
|
|
3
|
-
import { cn } from "@/lib/utils"
|
|
4
|
-
import type { AnimatedSidebarMenuSubProps } from "./type"
|
|
5
|
-
import {
|
|
6
|
-
SUBMENU_VARIANTS,
|
|
7
|
-
useAnimatedSidebar,
|
|
8
|
-
useAnimatedSidebarPanel,
|
|
9
|
-
} from "./utils"
|
|
10
|
-
|
|
11
|
-
export const AnimatedSidebarMenuSub = forwardRef<
|
|
12
|
-
HTMLUListElement,
|
|
13
|
-
AnimatedSidebarMenuSubProps
|
|
14
|
-
>(function AnimatedSidebarMenuSub(
|
|
15
|
-
{ open, children, className, ...props },
|
|
16
|
-
forwardedRef
|
|
17
|
-
) {
|
|
18
|
-
const context = useAnimatedSidebar()
|
|
19
|
-
const panel = useAnimatedSidebarPanel()
|
|
20
|
-
|
|
21
|
-
return (
|
|
22
|
-
<AnimatePresence initial={false} mode="popLayout">
|
|
23
|
-
{open && !panel.collapsed ? (
|
|
24
|
-
<motion.ul
|
|
25
|
-
{...props}
|
|
26
|
-
ref={forwardedRef}
|
|
27
|
-
key="sidebar-submenu"
|
|
28
|
-
variants={context.reduce ? undefined : SUBMENU_VARIANTS}
|
|
29
|
-
initial={context.reduce ? false : "closed"}
|
|
30
|
-
animate={context.reduce ? { opacity: 1 } : "open"}
|
|
31
|
-
exit={context.reduce ? { opacity: 0 } : "closed"}
|
|
32
|
-
transition={context.reduce ? { duration: 0.12 } : undefined}
|
|
33
|
-
data-slot="sidebar-menu-sub"
|
|
34
|
-
className={cn(
|
|
35
|
-
"relative mt-1 ml-5 flex min-w-0 flex-col gap-0.5 border-l border-border pl-3",
|
|
36
|
-
className
|
|
37
|
-
)}
|
|
38
|
-
>
|
|
39
|
-
{children}
|
|
40
|
-
</motion.ul>
|
|
41
|
-
) : null}
|
|
42
|
-
</AnimatePresence>
|
|
43
|
-
)
|
|
44
|
-
})
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import { forwardRef, type HTMLAttributes, type Ref } from "react"
|
|
2
|
-
import { SharedLayoutBg } from "@/components/motion/shared-layout-bg"
|
|
3
|
-
import { cn } from "@/lib/utils"
|
|
4
|
-
|
|
5
|
-
export const AnimatedSidebarMenu = forwardRef<
|
|
6
|
-
HTMLUListElement,
|
|
7
|
-
HTMLAttributes<HTMLUListElement>
|
|
8
|
-
>(function AnimatedSidebarMenu(
|
|
9
|
-
{ children, className, ...props },
|
|
10
|
-
forwardedRef
|
|
11
|
-
) {
|
|
12
|
-
return (
|
|
13
|
-
<SharedLayoutBg
|
|
14
|
-
{...props}
|
|
15
|
-
ref={forwardedRef as Ref<HTMLElement>}
|
|
16
|
-
as="ul"
|
|
17
|
-
inset={0}
|
|
18
|
-
pillClassName="rounded-xl bg-muted/70"
|
|
19
|
-
pillContainerClassName="inset-y-auto top-0 h-9"
|
|
20
|
-
data-slot="sidebar-menu"
|
|
21
|
-
className={cn("flex w-full min-w-0 list-none flex-col gap-0.5", className)}
|
|
22
|
-
>
|
|
23
|
-
{children}
|
|
24
|
-
</SharedLayoutBg>
|
|
25
|
-
)
|
|
26
|
-
})
|
|
File without changes
|