@mesob/ui 0.1.1 → 0.2.1
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/components/alert-dialog.js +22 -22
- package/dist/components/alert-dialog.js.map +1 -1
- package/dist/components/alert.js +1 -1
- package/dist/components/alert.js.map +1 -1
- package/dist/components/animated-tabs.js +1 -1
- package/dist/components/animated-tabs.js.map +1 -1
- package/dist/components/app-breadcrumbs.d.ts +34 -0
- package/dist/components/app-breadcrumbs.js +177 -0
- package/dist/components/app-breadcrumbs.js.map +1 -0
- package/dist/components/app-header-actions.d.ts +39 -0
- package/dist/components/app-header-actions.js +644 -0
- package/dist/components/app-header-actions.js.map +1 -0
- package/dist/components/app-sidebar.d.ts +24 -0
- package/dist/components/app-sidebar.js +669 -0
- package/dist/components/app-sidebar.js.map +1 -0
- package/dist/components/button-group.js +1 -1
- package/dist/components/button-group.js.map +1 -1
- package/dist/components/button.d.ts +6 -3
- package/dist/components/button.js +16 -8
- package/dist/components/button.js.map +1 -1
- package/dist/components/calendar.js +24 -16
- package/dist/components/calendar.js.map +1 -1
- package/dist/components/card.js +1 -1
- package/dist/components/card.js.map +1 -1
- package/dist/components/carousel.js +28 -20
- package/dist/components/carousel.js.map +1 -1
- package/dist/components/command.js +5 -5
- package/dist/components/command.js.map +1 -1
- package/dist/components/context-menu.js +2 -2
- package/dist/components/context-menu.js.map +1 -1
- package/dist/components/data-table/index.d.ts +9 -2
- package/dist/components/data-table/index.js +336 -152
- package/dist/components/data-table/index.js.map +1 -1
- package/dist/components/dialog.js +2 -2
- package/dist/components/dialog.js.map +1 -1
- package/dist/components/drawer.js +2 -2
- package/dist/components/drawer.js.map +1 -1
- package/dist/components/dropdown-menu.js +2 -2
- package/dist/components/dropdown-menu.js.map +1 -1
- package/dist/components/entity/index.d.ts +85 -9
- package/dist/components/entity/index.js +539 -414
- package/dist/components/entity/index.js.map +1 -1
- package/dist/components/hover-card.js +1 -1
- package/dist/components/hover-card.js.map +1 -1
- package/dist/components/input-group.d.ts +1 -1
- package/dist/components/input-group.js +27 -19
- package/dist/components/input-group.js.map +1 -1
- package/dist/components/item.d.ts +1 -1
- package/dist/components/link.d.ts +12 -0
- package/dist/components/link.js +51 -0
- package/dist/components/link.js.map +1 -0
- package/dist/components/menubar.js +3 -3
- package/dist/components/menubar.js.map +1 -1
- package/dist/components/mesob-context.d.ts +34 -0
- package/dist/components/mesob-context.js +53 -0
- package/dist/components/mesob-context.js.map +1 -0
- package/dist/components/navigation-menu.js +1 -1
- package/dist/components/navigation-menu.js.map +1 -1
- package/dist/components/page/index.d.ts +46 -0
- package/dist/components/page/index.js +205 -0
- package/dist/components/page/index.js.map +1 -0
- package/dist/components/pagination.js +20 -20
- package/dist/components/pagination.js.map +1 -1
- package/dist/components/popover.js +1 -1
- package/dist/components/popover.js.map +1 -1
- package/dist/components/powered-by.d.ts +4 -1
- package/dist/components/powered-by.js +28 -12
- package/dist/components/powered-by.js.map +1 -1
- package/dist/components/section/index.js +29 -21
- package/dist/components/section/index.js.map +1 -1
- package/dist/components/select.js +1 -1
- package/dist/components/select.js.map +1 -1
- package/dist/components/sheet.js +2 -2
- package/dist/components/sheet.js.map +1 -1
- package/dist/components/shell.d.ts +13 -0
- package/dist/components/shell.js +553 -0
- package/dist/components/shell.js.map +1 -0
- package/dist/components/sidebar.d.ts +4 -0
- package/dist/components/sidebar.js +119 -82
- package/dist/components/sidebar.js.map +1 -1
- package/dist/components/spotlight-search.js +67 -59
- package/dist/components/spotlight-search.js.map +1 -1
- package/dist/components/table.js +1 -1
- package/dist/components/table.js.map +1 -1
- package/dist/components/theme-toggle.js +21 -13
- package/dist/components/theme-toggle.js.map +1 -1
- package/dist/components/tooltip.d.ts +1 -1
- package/dist/components/tooltip.js +2 -1
- package/dist/components/tooltip.js.map +1 -1
- package/dist/hooks/use-router.d.ts +7 -0
- package/dist/hooks/use-router.js +36 -0
- package/dist/hooks/use-router.js.map +1 -0
- package/dist/hooks/use-translation.d.ts +5 -0
- package/dist/hooks/use-translation.js +42 -0
- package/dist/hooks/use-translation.js.map +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +94 -1
- package/dist/index.js.map +1 -1
- package/dist/lib/theme-schema.d.ts +21 -0
- package/dist/lib/theme-schema.js +95 -0
- package/dist/lib/theme-schema.js.map +1 -0
- package/package.json +8 -5
- package/src/styles/globals.css +0 -126
|
@@ -6,7 +6,7 @@ import * as React from 'react';
|
|
|
6
6
|
|
|
7
7
|
declare function InputGroup({ className, ...props }: React.ComponentProps<'fieldset'>): react_jsx_runtime.JSX.Element;
|
|
8
8
|
declare const inputGroupAddonVariants: (props?: ({
|
|
9
|
-
align?: "inline-
|
|
9
|
+
align?: "inline-end" | "inline-start" | "block-end" | "block-start" | null | undefined;
|
|
10
10
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
11
11
|
declare function InputGroupAddon({ className, align, ...props }: React.ComponentProps<'fieldset'> & VariantProps<typeof inputGroupAddonVariants>): react_jsx_runtime.JSX.Element;
|
|
12
12
|
declare const inputGroupButtonVariants: (props?: ({
|
|
@@ -10,18 +10,18 @@ function cn(...inputs) {
|
|
|
10
10
|
// src/components/button.tsx
|
|
11
11
|
import { Slot } from "@radix-ui/react-slot";
|
|
12
12
|
import { cva } from "class-variance-authority";
|
|
13
|
-
import {
|
|
13
|
+
import { jsxs } from "react/jsx-runtime";
|
|
14
14
|
var buttonVariants = cva(
|
|
15
15
|
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
|
16
16
|
{
|
|
17
17
|
variants: {
|
|
18
18
|
variant: {
|
|
19
|
-
default: "bg-primary text-primary-foreground hover:bg-primary
|
|
20
|
-
destructive: "bg-destructive text-
|
|
21
|
-
outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
|
|
22
|
-
secondary: "bg-secondary text-secondary-foreground hover:bg-secondary
|
|
19
|
+
default: "bg-primary text-primary-foreground hover:bg-primary-600 dark:hover:bg-primary-400",
|
|
20
|
+
destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40",
|
|
21
|
+
outline: "border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
|
|
22
|
+
secondary: "bg-secondary text-secondary-foreground hover:bg-secondary-600 dark:hover:bg-secondary-400",
|
|
23
23
|
ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
|
|
24
|
-
link: "text-primary underline-offset-4 hover:underline"
|
|
24
|
+
link: "text-primary underline-offset-4 hover:text-primary-600 dark:hover:text-primary-400 hover:underline"
|
|
25
25
|
},
|
|
26
26
|
size: {
|
|
27
27
|
default: "h-9 px-4 py-2 has-[>svg]:px-3",
|
|
@@ -43,23 +43,31 @@ function Button({
|
|
|
43
43
|
variant,
|
|
44
44
|
size,
|
|
45
45
|
asChild = false,
|
|
46
|
+
leftIcon,
|
|
47
|
+
rightIcon,
|
|
48
|
+
children,
|
|
46
49
|
...props
|
|
47
50
|
}) {
|
|
48
51
|
const Comp = asChild ? Slot : "button";
|
|
49
|
-
return /* @__PURE__ */
|
|
52
|
+
return /* @__PURE__ */ jsxs(
|
|
50
53
|
Comp,
|
|
51
54
|
{
|
|
52
55
|
"data-slot": "button",
|
|
53
56
|
className: cn(buttonVariants({ variant, size, className })),
|
|
54
|
-
...props
|
|
57
|
+
...props,
|
|
58
|
+
children: [
|
|
59
|
+
leftIcon,
|
|
60
|
+
children,
|
|
61
|
+
rightIcon
|
|
62
|
+
]
|
|
55
63
|
}
|
|
56
64
|
);
|
|
57
65
|
}
|
|
58
66
|
|
|
59
67
|
// src/components/input.tsx
|
|
60
|
-
import { jsx
|
|
68
|
+
import { jsx } from "react/jsx-runtime";
|
|
61
69
|
function Input({ className, type, ...props }) {
|
|
62
|
-
return /* @__PURE__ */
|
|
70
|
+
return /* @__PURE__ */ jsx(
|
|
63
71
|
"input",
|
|
64
72
|
{
|
|
65
73
|
type,
|
|
@@ -76,9 +84,9 @@ function Input({ className, type, ...props }) {
|
|
|
76
84
|
}
|
|
77
85
|
|
|
78
86
|
// src/components/textarea.tsx
|
|
79
|
-
import { jsx as
|
|
87
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
80
88
|
function Textarea({ className, ...props }) {
|
|
81
|
-
return /* @__PURE__ */
|
|
89
|
+
return /* @__PURE__ */ jsx2(
|
|
82
90
|
"textarea",
|
|
83
91
|
{
|
|
84
92
|
"data-slot": "textarea",
|
|
@@ -93,9 +101,9 @@ function Textarea({ className, ...props }) {
|
|
|
93
101
|
|
|
94
102
|
// src/components/input-group.tsx
|
|
95
103
|
import { cva as cva2 } from "class-variance-authority";
|
|
96
|
-
import { jsx as
|
|
104
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
97
105
|
function InputGroup({ className, ...props }) {
|
|
98
|
-
return /* @__PURE__ */
|
|
106
|
+
return /* @__PURE__ */ jsx3(
|
|
99
107
|
"fieldset",
|
|
100
108
|
{
|
|
101
109
|
"data-slot": "input-group",
|
|
@@ -139,7 +147,7 @@ function InputGroupAddon({
|
|
|
139
147
|
align = "inline-start",
|
|
140
148
|
...props
|
|
141
149
|
}) {
|
|
142
|
-
return /* @__PURE__ */
|
|
150
|
+
return /* @__PURE__ */ jsx3(
|
|
143
151
|
"fieldset",
|
|
144
152
|
{
|
|
145
153
|
"data-slot": "input-group-addon",
|
|
@@ -191,7 +199,7 @@ function InputGroupButton({
|
|
|
191
199
|
size = "xs",
|
|
192
200
|
...props
|
|
193
201
|
}) {
|
|
194
|
-
return /* @__PURE__ */
|
|
202
|
+
return /* @__PURE__ */ jsx3(
|
|
195
203
|
Button,
|
|
196
204
|
{
|
|
197
205
|
type,
|
|
@@ -203,7 +211,7 @@ function InputGroupButton({
|
|
|
203
211
|
);
|
|
204
212
|
}
|
|
205
213
|
function InputGroupText({ className, ...props }) {
|
|
206
|
-
return /* @__PURE__ */
|
|
214
|
+
return /* @__PURE__ */ jsx3(
|
|
207
215
|
"span",
|
|
208
216
|
{
|
|
209
217
|
className: cn(
|
|
@@ -218,7 +226,7 @@ function InputGroupInput({
|
|
|
218
226
|
className,
|
|
219
227
|
...props
|
|
220
228
|
}) {
|
|
221
|
-
return /* @__PURE__ */
|
|
229
|
+
return /* @__PURE__ */ jsx3(
|
|
222
230
|
Input,
|
|
223
231
|
{
|
|
224
232
|
"data-slot": "input-group-control",
|
|
@@ -234,7 +242,7 @@ function InputGroupTextarea({
|
|
|
234
242
|
className,
|
|
235
243
|
...props
|
|
236
244
|
}) {
|
|
237
|
-
return /* @__PURE__ */
|
|
245
|
+
return /* @__PURE__ */ jsx3(
|
|
238
246
|
Textarea,
|
|
239
247
|
{
|
|
240
248
|
"data-slot": "input-group-control",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/button.tsx","../../src/components/input.tsx","../../src/components/textarea.tsx","../../src/components/input-group.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","import { cn } from '@mesob/ui/lib/utils';\nimport { Slot } from '@radix-ui/react-slot';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type * as React from 'react';\n\nconst buttonVariants = cva(\n \"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n {\n variants: {\n variant: {\n default: 'bg-primary text-primary-foreground hover:bg-primary/90',\n destructive:\n 'bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',\n outline:\n 'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',\n secondary:\n 'bg-secondary text-secondary-foreground hover:bg-secondary/80',\n ghost:\n 'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',\n link: 'text-primary underline-offset-4 hover:underline',\n },\n size: {\n default: 'h-9 px-4 py-2 has-[>svg]:px-3',\n sm: 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',\n lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',\n icon: 'size-9',\n 'icon-sm': 'size-8',\n 'icon-lg': 'size-10',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'default',\n },\n },\n);\n\nfunction Button({\n className,\n variant,\n size,\n asChild = false,\n ...props\n}: React.ComponentProps<'button'> &\n VariantProps<typeof buttonVariants> & {\n asChild?: boolean;\n }) {\n const Comp = asChild ? Slot : 'button';\n\n return (\n <Comp\n data-slot=\"button\"\n className={cn(buttonVariants({ variant, size, className }))}\n {...props}\n />\n );\n}\n\nexport { Button, buttonVariants };\n","import { cn } from '@mesob/ui/lib/utils';\nimport type * as React from 'react';\n\nfunction Input({ className, type, ...props }: React.ComponentProps<'input'>) {\n return (\n <input\n type={type}\n data-slot=\"input\"\n className={cn(\n 'file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',\n 'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',\n 'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',\n className,\n )}\n {...props}\n />\n );\n}\n\nexport { Input };\n","import { cn } from '@mesob/ui/lib/utils';\nimport type * as React from 'react';\n\nfunction Textarea({ className, ...props }: React.ComponentProps<'textarea'>) {\n return (\n <textarea\n data-slot=\"textarea\"\n className={cn(\n 'border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',\n className,\n )}\n {...props}\n />\n );\n}\n\nexport { Textarea };\n","'use client';\n\nimport { Button } from '@mesob/ui/components/button';\nimport { Input } from '@mesob/ui/components/input';\nimport { Textarea } from '@mesob/ui/components/textarea';\nimport { cn } from '@mesob/ui/lib/utils';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type * as React from 'react';\n\nfunction InputGroup({ className, ...props }: React.ComponentProps<'fieldset'>) {\n return (\n <fieldset\n data-slot=\"input-group\"\n className={cn(\n 'border-0 p-0 m-0',\n 'group/input-group border-input dark:bg-input/30 relative flex w-full items-center rounded-md border shadow-xs transition-[color,box-shadow] outline-none',\n 'h-9 min-w-0 has-[>textarea]:h-auto',\n\n // Variants based on alignment.\n 'has-[>[data-align=inline-start]]:[&>input]:pl-2',\n 'has-[>[data-align=inline-end]]:[&>input]:pr-2',\n 'has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3',\n 'has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3',\n\n // Focus state.\n 'has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot=input-group-control]:focus-visible]:ring-[3px]',\n\n // Error state.\n 'has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[[data-slot][aria-invalid=true]]:border-destructive dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40',\n\n className,\n )}\n {...props}\n />\n );\n}\n\nconst inputGroupAddonVariants = cva(\n \"text-muted-foreground flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium select-none [&>svg:not([class*='size-'])]:size-4 [&>kbd]:rounded-[calc(var(--radius)-5px)] group-data-[disabled=true]/input-group:opacity-50\",\n {\n variants: {\n align: {\n 'inline-start':\n 'order-first pl-3 has-[>button]:ml-[-0.45rem] has-[>kbd]:ml-[-0.35rem]',\n 'inline-end':\n 'order-last pr-3 has-[>button]:mr-[-0.45rem] has-[>kbd]:mr-[-0.35rem]',\n 'block-start':\n 'order-first w-full justify-start px-3 pt-3 [.border-b]:pb-3 group-has-[>input]/input-group:pt-2.5',\n 'block-end':\n 'order-last w-full justify-start px-3 pb-3 [.border-t]:pt-3 group-has-[>input]/input-group:pb-2.5',\n },\n },\n defaultVariants: {\n align: 'inline-start',\n },\n },\n);\n\nfunction InputGroupAddon({\n className,\n align = 'inline-start',\n ...props\n}: React.ComponentProps<'fieldset'> &\n VariantProps<typeof inputGroupAddonVariants>) {\n return (\n <fieldset\n data-slot=\"input-group-addon\"\n data-align={align}\n className={cn(\n inputGroupAddonVariants({ align }),\n 'border-0 p-0 m-0',\n className,\n )}\n onClick={(e) => {\n if ((e.target as HTMLElement).closest('button')) {\n return;\n }\n e.currentTarget.parentElement?.querySelector('input')?.focus();\n }}\n onKeyDown={(e) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n if ((e.target as HTMLElement).closest('button')) {\n return;\n }\n e.currentTarget.parentElement?.querySelector('input')?.focus();\n }\n }}\n {...props}\n />\n );\n}\n\nconst inputGroupButtonVariants = cva(\n 'text-sm shadow-none flex gap-2 items-center',\n {\n variants: {\n size: {\n xs: \"h-6 gap-1 px-2 rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-3.5 has-[>svg]:px-2\",\n sm: 'h-8 px-2.5 gap-1.5 rounded-md has-[>svg]:px-2.5',\n 'icon-xs':\n 'size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0',\n 'icon-sm': 'size-8 p-0 has-[>svg]:p-0',\n },\n },\n defaultVariants: {\n size: 'xs',\n },\n },\n);\n\nfunction InputGroupButton({\n className,\n type = 'button',\n variant = 'ghost',\n size = 'xs',\n ...props\n}: Omit<React.ComponentProps<typeof Button>, 'size'> &\n VariantProps<typeof inputGroupButtonVariants>) {\n return (\n <Button\n type={type}\n data-size={size}\n variant={variant}\n className={cn(inputGroupButtonVariants({ size }), className)}\n {...props}\n />\n );\n}\n\nfunction InputGroupText({ className, ...props }: React.ComponentProps<'span'>) {\n return (\n <span\n className={cn(\n \"text-muted-foreground flex items-center gap-2 text-sm [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction InputGroupInput({\n className,\n ...props\n}: React.ComponentProps<'input'>) {\n return (\n <Input\n data-slot=\"input-group-control\"\n className={cn(\n 'flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 dark:bg-transparent',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction InputGroupTextarea({\n className,\n ...props\n}: React.ComponentProps<'textarea'>) {\n return (\n <Textarea\n data-slot=\"input-group-control\"\n className={cn(\n 'flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent',\n className,\n )}\n {...props}\n />\n );\n}\n\nexport {\n InputGroup,\n InputGroupAddon,\n InputGroupButton,\n InputGroupText,\n InputGroupInput,\n InputGroupTextarea,\n};\n"],"mappings":"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","names":["jsx","jsx","cva","jsx"]}
|
|
1
|
+
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/button.tsx","../../src/components/input.tsx","../../src/components/textarea.tsx","../../src/components/input-group.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","import { cn } from '@mesob/ui/lib/utils';\nimport { Slot } from '@radix-ui/react-slot';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type * as React from 'react';\n\nconst buttonVariants = cva(\n \"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n {\n variants: {\n variant: {\n default:\n 'bg-primary text-primary-foreground hover:bg-primary-600 dark:hover:bg-primary-400',\n destructive:\n 'bg-destructive text-destructive-foreground hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40',\n outline:\n 'border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',\n secondary:\n 'bg-secondary text-secondary-foreground hover:bg-secondary-600 dark:hover:bg-secondary-400',\n ghost:\n 'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',\n link: 'text-primary underline-offset-4 hover:text-primary-600 dark:hover:text-primary-400 hover:underline',\n },\n size: {\n default: 'h-9 px-4 py-2 has-[>svg]:px-3',\n sm: 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',\n lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',\n icon: 'size-9',\n 'icon-sm': 'size-8',\n 'icon-lg': 'size-10',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'default',\n },\n },\n);\n\ntype ButtonProps = React.ComponentProps<'button'> &\n VariantProps<typeof buttonVariants> & {\n asChild?: boolean;\n leftIcon?: React.ReactNode;\n rightIcon?: React.ReactNode;\n };\n\nfunction Button({\n className,\n variant,\n size,\n asChild = false,\n leftIcon,\n rightIcon,\n children,\n ...props\n}: ButtonProps) {\n const Comp = asChild ? Slot : 'button';\n\n return (\n <Comp\n data-slot=\"button\"\n className={cn(buttonVariants({ variant, size, className }))}\n {...props}\n >\n {leftIcon}\n {children}\n {rightIcon}\n </Comp>\n );\n}\n\nexport { Button, buttonVariants };\n","import { cn } from '@mesob/ui/lib/utils';\nimport type * as React from 'react';\n\nfunction Input({ className, type, ...props }: React.ComponentProps<'input'>) {\n return (\n <input\n type={type}\n data-slot=\"input\"\n className={cn(\n 'file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',\n 'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',\n 'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',\n className,\n )}\n {...props}\n />\n );\n}\n\nexport { Input };\n","import { cn } from '@mesob/ui/lib/utils';\nimport type * as React from 'react';\n\nfunction Textarea({ className, ...props }: React.ComponentProps<'textarea'>) {\n return (\n <textarea\n data-slot=\"textarea\"\n className={cn(\n 'border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',\n className,\n )}\n {...props}\n />\n );\n}\n\nexport { Textarea };\n","'use client';\n\nimport { Button } from '@mesob/ui/components/button';\nimport { Input } from '@mesob/ui/components/input';\nimport { Textarea } from '@mesob/ui/components/textarea';\nimport { cn } from '@mesob/ui/lib/utils';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type * as React from 'react';\n\nfunction InputGroup({ className, ...props }: React.ComponentProps<'fieldset'>) {\n return (\n <fieldset\n data-slot=\"input-group\"\n className={cn(\n 'border-0 p-0 m-0',\n 'group/input-group border-input dark:bg-input/30 relative flex w-full items-center rounded-md border shadow-xs transition-[color,box-shadow] outline-none',\n 'h-9 min-w-0 has-[>textarea]:h-auto',\n\n // Variants based on alignment.\n 'has-[>[data-align=inline-start]]:[&>input]:pl-2',\n 'has-[>[data-align=inline-end]]:[&>input]:pr-2',\n 'has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3',\n 'has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3',\n\n // Focus state.\n 'has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot=input-group-control]:focus-visible]:ring-[3px]',\n\n // Error state.\n 'has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[[data-slot][aria-invalid=true]]:border-destructive dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40',\n\n className,\n )}\n {...props}\n />\n );\n}\n\nconst inputGroupAddonVariants = cva(\n \"text-muted-foreground flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium select-none [&>svg:not([class*='size-'])]:size-4 [&>kbd]:rounded-[calc(var(--radius)-5px)] group-data-[disabled=true]/input-group:opacity-50\",\n {\n variants: {\n align: {\n 'inline-start':\n 'order-first pl-3 has-[>button]:ml-[-0.45rem] has-[>kbd]:ml-[-0.35rem]',\n 'inline-end':\n 'order-last pr-3 has-[>button]:mr-[-0.45rem] has-[>kbd]:mr-[-0.35rem]',\n 'block-start':\n 'order-first w-full justify-start px-3 pt-3 [.border-b]:pb-3 group-has-[>input]/input-group:pt-2.5',\n 'block-end':\n 'order-last w-full justify-start px-3 pb-3 [.border-t]:pt-3 group-has-[>input]/input-group:pb-2.5',\n },\n },\n defaultVariants: {\n align: 'inline-start',\n },\n },\n);\n\nfunction InputGroupAddon({\n className,\n align = 'inline-start',\n ...props\n}: React.ComponentProps<'fieldset'> &\n VariantProps<typeof inputGroupAddonVariants>) {\n return (\n <fieldset\n data-slot=\"input-group-addon\"\n data-align={align}\n className={cn(\n inputGroupAddonVariants({ align }),\n 'border-0 p-0 m-0',\n className,\n )}\n onClick={(e) => {\n if ((e.target as HTMLElement).closest('button')) {\n return;\n }\n e.currentTarget.parentElement?.querySelector('input')?.focus();\n }}\n onKeyDown={(e) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n if ((e.target as HTMLElement).closest('button')) {\n return;\n }\n e.currentTarget.parentElement?.querySelector('input')?.focus();\n }\n }}\n {...props}\n />\n );\n}\n\nconst inputGroupButtonVariants = cva(\n 'text-sm shadow-none flex gap-2 items-center',\n {\n variants: {\n size: {\n xs: \"h-6 gap-1 px-2 rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-3.5 has-[>svg]:px-2\",\n sm: 'h-8 px-2.5 gap-1.5 rounded-md has-[>svg]:px-2.5',\n 'icon-xs':\n 'size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0',\n 'icon-sm': 'size-8 p-0 has-[>svg]:p-0',\n },\n },\n defaultVariants: {\n size: 'xs',\n },\n },\n);\n\nfunction InputGroupButton({\n className,\n type = 'button',\n variant = 'ghost',\n size = 'xs',\n ...props\n}: Omit<React.ComponentProps<typeof Button>, 'size'> &\n VariantProps<typeof inputGroupButtonVariants>) {\n return (\n <Button\n type={type}\n data-size={size}\n variant={variant}\n className={cn(inputGroupButtonVariants({ size }), className)}\n {...props}\n />\n );\n}\n\nfunction InputGroupText({ className, ...props }: React.ComponentProps<'span'>) {\n return (\n <span\n className={cn(\n \"text-muted-foreground flex items-center gap-2 text-sm [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction InputGroupInput({\n className,\n ...props\n}: React.ComponentProps<'input'>) {\n return (\n <Input\n data-slot=\"input-group-control\"\n className={cn(\n 'flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 dark:bg-transparent',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction InputGroupTextarea({\n className,\n ...props\n}: React.ComponentProps<'textarea'>) {\n return (\n <Textarea\n data-slot=\"input-group-control\"\n className={cn(\n 'flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent',\n className,\n )}\n {...props}\n />\n );\n}\n\nexport {\n InputGroup,\n InputGroupAddon,\n InputGroupButton,\n InputGroupText,\n InputGroupInput,\n InputGroupTextarea,\n};\n"],"mappings":"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","names":["jsx","cva","jsx"]}
|
|
@@ -15,7 +15,7 @@ declare function Item({ className, variant, size, asChild, ...props }: React.Com
|
|
|
15
15
|
asChild?: boolean;
|
|
16
16
|
}): react_jsx_runtime.JSX.Element;
|
|
17
17
|
declare const itemMediaVariants: (props?: ({
|
|
18
|
-
variant?: "
|
|
18
|
+
variant?: "image" | "default" | "icon" | null | undefined;
|
|
19
19
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
20
20
|
declare function ItemMedia({ className, variant, ...props }: React.ComponentProps<'div'> & VariantProps<typeof itemMediaVariants>): react_jsx_runtime.JSX.Element;
|
|
21
21
|
declare function ItemContent({ className, ...props }: React.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ReactNode, ComponentProps } from 'react';
|
|
3
|
+
|
|
4
|
+
type LinkProps = {
|
|
5
|
+
href: string;
|
|
6
|
+
children: ReactNode;
|
|
7
|
+
className?: string;
|
|
8
|
+
onClick?: () => void;
|
|
9
|
+
};
|
|
10
|
+
declare function Link({ href, children, className, onClick, ...props }: LinkProps & ComponentProps<'a'>): react_jsx_runtime.JSX.Element;
|
|
11
|
+
|
|
12
|
+
export { Link, type LinkProps };
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/lib/utils.ts
|
|
4
|
+
import { clsx } from "clsx";
|
|
5
|
+
import { twMerge } from "tailwind-merge";
|
|
6
|
+
|
|
7
|
+
// src/components/tooltip.tsx
|
|
8
|
+
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
9
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
10
|
+
|
|
11
|
+
// src/components/mesob-context.tsx
|
|
12
|
+
import {
|
|
13
|
+
createContext,
|
|
14
|
+
useContext,
|
|
15
|
+
useMemo
|
|
16
|
+
} from "react";
|
|
17
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
18
|
+
var MesobContext = createContext(null);
|
|
19
|
+
function useMesob() {
|
|
20
|
+
return useContext(MesobContext);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
// src/components/link.tsx
|
|
24
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
25
|
+
function Link({
|
|
26
|
+
href,
|
|
27
|
+
children,
|
|
28
|
+
className,
|
|
29
|
+
onClick,
|
|
30
|
+
...props
|
|
31
|
+
}) {
|
|
32
|
+
const mesob = useMesob();
|
|
33
|
+
const LinkComponent = mesob?.linkComponent ?? "a";
|
|
34
|
+
if (LinkComponent === "a") {
|
|
35
|
+
return /* @__PURE__ */ jsx3("a", { href, className, onClick, ...props, children });
|
|
36
|
+
}
|
|
37
|
+
return /* @__PURE__ */ jsx3(
|
|
38
|
+
LinkComponent,
|
|
39
|
+
{
|
|
40
|
+
href,
|
|
41
|
+
className,
|
|
42
|
+
onClick,
|
|
43
|
+
...props,
|
|
44
|
+
children
|
|
45
|
+
}
|
|
46
|
+
);
|
|
47
|
+
}
|
|
48
|
+
export {
|
|
49
|
+
Link
|
|
50
|
+
};
|
|
51
|
+
//# sourceMappingURL=link.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/tooltip.tsx","../../src/components/mesob-context.tsx","../../src/components/link.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","'use client';\n\nimport { cn } from '@mesob/ui/lib/utils';\nimport * as TooltipPrimitive from '@radix-ui/react-tooltip';\nimport type * as React from 'react';\n\nfunction TooltipProvider({\n delayDuration = 0,\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Provider>) {\n return (\n <TooltipPrimitive.Provider\n data-slot=\"tooltip-provider\"\n delayDuration={delayDuration}\n {...props}\n />\n );\n}\n\nfunction Tooltip({\n children,\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Root>) {\n return (\n <TooltipPrimitive.Root data-slot=\"tooltip\" {...props}>\n {children}\n </TooltipPrimitive.Root>\n );\n}\n\nfunction TooltipTrigger({\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {\n return <TooltipPrimitive.Trigger data-slot=\"tooltip-trigger\" {...props} />;\n}\n\nfunction TooltipContent({\n className,\n sideOffset = 0,\n children,\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Content>) {\n return (\n <TooltipPrimitive.Portal>\n <TooltipPrimitive.Content\n data-slot=\"tooltip-content\"\n sideOffset={sideOffset}\n className={cn(\n 'bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance',\n className,\n )}\n {...props}\n >\n {children}\n <TooltipPrimitive.Arrow className=\"bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]\" />\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n );\n}\n\nexport { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };\n","'use client';\n\nimport { TooltipProvider } from '@mesob/ui/components/tooltip';\nimport {\n type ComponentType,\n createContext,\n type ReactNode,\n useContext,\n useMemo,\n} from 'react';\n\nexport type MesobLinkProps = {\n href: string;\n children: ReactNode;\n className?: string;\n onClick?: () => void;\n};\n\nexport type Router = {\n push: (href: string) => void;\n replace: (href: string) => void;\n back: () => void;\n forward: () => void;\n refresh: () => void;\n prefetch: (href: string) => void;\n};\n\nexport type MesobContextValue = {\n linkComponent?: ComponentType<MesobLinkProps>;\n t?: (key: string, params?: Record<string, string | number>) => string;\n router?: Router;\n};\n\nconst MesobContext = createContext<MesobContextValue | null>(null);\n\nexport type MesobProviderProps = {\n children: ReactNode;\n linkComponent?: ComponentType<MesobLinkProps>;\n /** Hook that returns the app's t function (e.g. from next-intl useTranslations()). */\n useTranslation?: () => (\n key: string,\n params?: Record<string, string | number>,\n ) => string;\n /** Hook that returns the app's router (e.g. from next-intl useRouter()). */\n useRouter?: () => Router;\n};\n\nexport function MesobProvider({\n children,\n linkComponent,\n useTranslation,\n useRouter,\n}: MesobProviderProps) {\n const t = useTranslation?.();\n const router = useRouter?.();\n const value = useMemo<MesobContextValue>(\n () => ({ linkComponent, t: t ?? undefined, router: router ?? undefined }),\n [linkComponent, t, router],\n );\n return (\n <MesobContext.Provider value={value}>\n <TooltipProvider delayDuration={0}>{children}</TooltipProvider>\n </MesobContext.Provider>\n );\n}\n\nexport function useMesob(): MesobContextValue | null {\n return useContext(MesobContext);\n}\n","'use client';\n\nimport type { ComponentProps, ReactNode } from 'react';\nimport { useMesob } from './mesob-context';\n\nexport type LinkProps = {\n href: string;\n children: ReactNode;\n className?: string;\n onClick?: () => void;\n};\n\nexport function Link({\n href,\n children,\n className,\n onClick,\n ...props\n}: LinkProps & ComponentProps<'a'>) {\n const mesob = useMesob();\n const LinkComponent = mesob?.linkComponent ?? 'a';\n\n if (LinkComponent === 'a') {\n return (\n <a href={href} className={className} onClick={onClick} {...props}>\n {children}\n </a>\n );\n }\n\n return (\n <LinkComponent\n href={href}\n className={className}\n onClick={onClick}\n {...props}\n >\n {children}\n </LinkComponent>\n );\n}\n"],"mappings":";;;AAAA,SAA0B,YAAY;AACtC,SAAS,eAAe;;;ACExB,YAAY,sBAAsB;AAQ9B,cAiCE,YAjCF;;;ACRJ;AAAA,EAEE;AAAA,EAEA;AAAA,EACA;AAAA,OACK;AAoDD,gBAAAA,YAAA;AA5BN,IAAM,eAAe,cAAwC,IAAI;AAiC1D,SAAS,WAAqC;AACnD,SAAO,WAAW,YAAY;AAChC;;;AC5CM,gBAAAC,YAAA;AAZC,SAAS,KAAK;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAoC;AAClC,QAAM,QAAQ,SAAS;AACvB,QAAM,gBAAgB,OAAO,iBAAiB;AAE9C,MAAI,kBAAkB,KAAK;AACzB,WACE,gBAAAA,KAAC,OAAE,MAAY,WAAsB,SAAmB,GAAG,OACxD,UACH;AAAA,EAEJ;AAEA,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;","names":["jsx","jsx"]}
|
|
@@ -20,7 +20,7 @@ function Menubar({
|
|
|
20
20
|
{
|
|
21
21
|
"data-slot": "menubar",
|
|
22
22
|
className: cn(
|
|
23
|
-
"bg-background flex h-9 items-center gap-1 rounded-md border p-1 shadow-xs",
|
|
23
|
+
"bg-background border-border flex h-9 items-center gap-1 rounded-md border p-1 shadow-xs",
|
|
24
24
|
className
|
|
25
25
|
),
|
|
26
26
|
...props
|
|
@@ -78,7 +78,7 @@ function MenubarContent({
|
|
|
78
78
|
alignOffset,
|
|
79
79
|
sideOffset,
|
|
80
80
|
className: cn(
|
|
81
|
-
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[12rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-md",
|
|
81
|
+
"bg-popover text-popover-foreground border-border data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[12rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-md",
|
|
82
82
|
className
|
|
83
83
|
),
|
|
84
84
|
...props
|
|
@@ -233,7 +233,7 @@ function MenubarSubContent({
|
|
|
233
233
|
{
|
|
234
234
|
"data-slot": "menubar-sub-content",
|
|
235
235
|
className: cn(
|
|
236
|
-
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg",
|
|
236
|
+
"bg-popover text-popover-foreground border-border data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg",
|
|
237
237
|
className
|
|
238
238
|
),
|
|
239
239
|
...props
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/menubar.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","'use client';\n\nimport { cn } from '@mesob/ui/lib/utils';\nimport * as MenubarPrimitive from '@radix-ui/react-menubar';\nimport { IconCheck, IconChevronRight, IconCircle } from '@tabler/icons-react';\nimport type * as React from 'react';\n\nfunction Menubar({\n className,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Root>) {\n return (\n <MenubarPrimitive.Root\n data-slot=\"menubar\"\n className={cn(\n 'bg-background flex h-9 items-center gap-1 rounded-md border p-1 shadow-xs',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction MenubarMenu({\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Menu>) {\n return <MenubarPrimitive.Menu data-slot=\"menubar-menu\" {...props} />;\n}\n\nfunction MenubarGroup({\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Group>) {\n return <MenubarPrimitive.Group data-slot=\"menubar-group\" {...props} />;\n}\n\nfunction MenubarPortal({\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Portal>) {\n return <MenubarPrimitive.Portal data-slot=\"menubar-portal\" {...props} />;\n}\n\nfunction MenubarRadioGroup({\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.RadioGroup>) {\n return (\n <MenubarPrimitive.RadioGroup data-slot=\"menubar-radio-group\" {...props} />\n );\n}\n\nfunction MenubarTrigger({\n className,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Trigger>) {\n return (\n <MenubarPrimitive.Trigger\n data-slot=\"menubar-trigger\"\n className={cn(\n 'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex items-center rounded-sm px-2 py-1 text-sm font-medium outline-hidden select-none',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction MenubarContent({\n className,\n align = 'start',\n alignOffset = -4,\n sideOffset = 8,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Content>) {\n return (\n <MenubarPortal>\n <MenubarPrimitive.Content\n data-slot=\"menubar-content\"\n align={align}\n alignOffset={alignOffset}\n sideOffset={sideOffset}\n className={cn(\n 'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[12rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-md',\n className,\n )}\n {...props}\n />\n </MenubarPortal>\n );\n}\n\nfunction MenubarItem({\n className,\n inset,\n variant = 'default',\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Item> & {\n inset?: boolean;\n variant?: 'default' | 'destructive';\n}) {\n return (\n <MenubarPrimitive.Item\n data-slot=\"menubar-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction MenubarCheckboxItem({\n className,\n children,\n checked,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.CheckboxItem>) {\n return (\n <MenubarPrimitive.CheckboxItem\n data-slot=\"menubar-checkbox-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n checked={checked}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <MenubarPrimitive.ItemIndicator>\n <IconCheck className=\"size-4\" />\n </MenubarPrimitive.ItemIndicator>\n </span>\n {children}\n </MenubarPrimitive.CheckboxItem>\n );\n}\n\nfunction MenubarRadioItem({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.RadioItem>) {\n return (\n <MenubarPrimitive.RadioItem\n data-slot=\"menubar-radio-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <MenubarPrimitive.ItemIndicator>\n <IconCircle className=\"size-2 fill-current\" />\n </MenubarPrimitive.ItemIndicator>\n </span>\n {children}\n </MenubarPrimitive.RadioItem>\n );\n}\n\nfunction MenubarLabel({\n className,\n inset,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Label> & {\n inset?: boolean;\n}) {\n return (\n <MenubarPrimitive.Label\n data-slot=\"menubar-label\"\n data-inset={inset}\n className={cn(\n 'px-2 py-1.5 text-sm font-medium data-[inset]:pl-8',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction MenubarSeparator({\n className,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Separator>) {\n return (\n <MenubarPrimitive.Separator\n data-slot=\"menubar-separator\"\n className={cn('bg-border -mx-1 my-1 h-px', className)}\n {...props}\n />\n );\n}\n\nfunction MenubarShortcut({\n className,\n ...props\n}: React.ComponentProps<'span'>) {\n return (\n <span\n data-slot=\"menubar-shortcut\"\n className={cn(\n 'text-muted-foreground ml-auto text-xs tracking-widest',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction MenubarSub({\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Sub>) {\n return <MenubarPrimitive.Sub data-slot=\"menubar-sub\" {...props} />;\n}\n\nfunction MenubarSubTrigger({\n className,\n inset,\n children,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.SubTrigger> & {\n inset?: boolean;\n}) {\n return (\n <MenubarPrimitive.SubTrigger\n data-slot=\"menubar-sub-trigger\"\n data-inset={inset}\n className={cn(\n 'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none select-none data-[inset]:pl-8',\n className,\n )}\n {...props}\n >\n {children}\n <IconChevronRight className=\"ml-auto h-4 w-4\" />\n </MenubarPrimitive.SubTrigger>\n );\n}\n\nfunction MenubarSubContent({\n className,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.SubContent>) {\n return (\n <MenubarPrimitive.SubContent\n data-slot=\"menubar-sub-content\"\n className={cn(\n 'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg',\n className,\n )}\n {...props}\n />\n );\n}\n\nexport {\n Menubar,\n MenubarPortal,\n MenubarMenu,\n MenubarTrigger,\n MenubarContent,\n MenubarGroup,\n MenubarSeparator,\n MenubarLabel,\n MenubarItem,\n MenubarShortcut,\n MenubarCheckboxItem,\n MenubarRadioGroup,\n MenubarRadioItem,\n MenubarSub,\n MenubarSubTrigger,\n MenubarSubContent,\n};\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/menubar.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","'use client';\n\nimport { cn } from '@mesob/ui/lib/utils';\nimport * as MenubarPrimitive from '@radix-ui/react-menubar';\nimport { IconCheck, IconChevronRight, IconCircle } from '@tabler/icons-react';\nimport type * as React from 'react';\n\nfunction Menubar({\n className,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Root>) {\n return (\n <MenubarPrimitive.Root\n data-slot=\"menubar\"\n className={cn(\n 'bg-background border-border flex h-9 items-center gap-1 rounded-md border p-1 shadow-xs',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction MenubarMenu({\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Menu>) {\n return <MenubarPrimitive.Menu data-slot=\"menubar-menu\" {...props} />;\n}\n\nfunction MenubarGroup({\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Group>) {\n return <MenubarPrimitive.Group data-slot=\"menubar-group\" {...props} />;\n}\n\nfunction MenubarPortal({\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Portal>) {\n return <MenubarPrimitive.Portal data-slot=\"menubar-portal\" {...props} />;\n}\n\nfunction MenubarRadioGroup({\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.RadioGroup>) {\n return (\n <MenubarPrimitive.RadioGroup data-slot=\"menubar-radio-group\" {...props} />\n );\n}\n\nfunction MenubarTrigger({\n className,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Trigger>) {\n return (\n <MenubarPrimitive.Trigger\n data-slot=\"menubar-trigger\"\n className={cn(\n 'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex items-center rounded-sm px-2 py-1 text-sm font-medium outline-hidden select-none',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction MenubarContent({\n className,\n align = 'start',\n alignOffset = -4,\n sideOffset = 8,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Content>) {\n return (\n <MenubarPortal>\n <MenubarPrimitive.Content\n data-slot=\"menubar-content\"\n align={align}\n alignOffset={alignOffset}\n sideOffset={sideOffset}\n className={cn(\n 'bg-popover text-popover-foreground border-border data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[12rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-md',\n className,\n )}\n {...props}\n />\n </MenubarPortal>\n );\n}\n\nfunction MenubarItem({\n className,\n inset,\n variant = 'default',\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Item> & {\n inset?: boolean;\n variant?: 'default' | 'destructive';\n}) {\n return (\n <MenubarPrimitive.Item\n data-slot=\"menubar-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction MenubarCheckboxItem({\n className,\n children,\n checked,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.CheckboxItem>) {\n return (\n <MenubarPrimitive.CheckboxItem\n data-slot=\"menubar-checkbox-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n checked={checked}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <MenubarPrimitive.ItemIndicator>\n <IconCheck className=\"size-4\" />\n </MenubarPrimitive.ItemIndicator>\n </span>\n {children}\n </MenubarPrimitive.CheckboxItem>\n );\n}\n\nfunction MenubarRadioItem({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.RadioItem>) {\n return (\n <MenubarPrimitive.RadioItem\n data-slot=\"menubar-radio-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <MenubarPrimitive.ItemIndicator>\n <IconCircle className=\"size-2 fill-current\" />\n </MenubarPrimitive.ItemIndicator>\n </span>\n {children}\n </MenubarPrimitive.RadioItem>\n );\n}\n\nfunction MenubarLabel({\n className,\n inset,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Label> & {\n inset?: boolean;\n}) {\n return (\n <MenubarPrimitive.Label\n data-slot=\"menubar-label\"\n data-inset={inset}\n className={cn(\n 'px-2 py-1.5 text-sm font-medium data-[inset]:pl-8',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction MenubarSeparator({\n className,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Separator>) {\n return (\n <MenubarPrimitive.Separator\n data-slot=\"menubar-separator\"\n className={cn('bg-border -mx-1 my-1 h-px', className)}\n {...props}\n />\n );\n}\n\nfunction MenubarShortcut({\n className,\n ...props\n}: React.ComponentProps<'span'>) {\n return (\n <span\n data-slot=\"menubar-shortcut\"\n className={cn(\n 'text-muted-foreground ml-auto text-xs tracking-widest',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction MenubarSub({\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.Sub>) {\n return <MenubarPrimitive.Sub data-slot=\"menubar-sub\" {...props} />;\n}\n\nfunction MenubarSubTrigger({\n className,\n inset,\n children,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.SubTrigger> & {\n inset?: boolean;\n}) {\n return (\n <MenubarPrimitive.SubTrigger\n data-slot=\"menubar-sub-trigger\"\n data-inset={inset}\n className={cn(\n 'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none select-none data-[inset]:pl-8',\n className,\n )}\n {...props}\n >\n {children}\n <IconChevronRight className=\"ml-auto h-4 w-4\" />\n </MenubarPrimitive.SubTrigger>\n );\n}\n\nfunction MenubarSubContent({\n className,\n ...props\n}: React.ComponentProps<typeof MenubarPrimitive.SubContent>) {\n return (\n <MenubarPrimitive.SubContent\n data-slot=\"menubar-sub-content\"\n className={cn(\n 'bg-popover text-popover-foreground border-border data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg',\n className,\n )}\n {...props}\n />\n );\n}\n\nexport {\n Menubar,\n MenubarPortal,\n MenubarMenu,\n MenubarTrigger,\n MenubarContent,\n MenubarGroup,\n MenubarSeparator,\n MenubarLabel,\n MenubarItem,\n MenubarShortcut,\n MenubarCheckboxItem,\n MenubarRadioGroup,\n MenubarRadioItem,\n MenubarSub,\n MenubarSubTrigger,\n MenubarSubContent,\n};\n"],"mappings":"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","names":[]}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ReactNode, ComponentType } from 'react';
|
|
3
|
+
|
|
4
|
+
type MesobLinkProps = {
|
|
5
|
+
href: string;
|
|
6
|
+
children: ReactNode;
|
|
7
|
+
className?: string;
|
|
8
|
+
onClick?: () => void;
|
|
9
|
+
};
|
|
10
|
+
type Router = {
|
|
11
|
+
push: (href: string) => void;
|
|
12
|
+
replace: (href: string) => void;
|
|
13
|
+
back: () => void;
|
|
14
|
+
forward: () => void;
|
|
15
|
+
refresh: () => void;
|
|
16
|
+
prefetch: (href: string) => void;
|
|
17
|
+
};
|
|
18
|
+
type MesobContextValue = {
|
|
19
|
+
linkComponent?: ComponentType<MesobLinkProps>;
|
|
20
|
+
t?: (key: string, params?: Record<string, string | number>) => string;
|
|
21
|
+
router?: Router;
|
|
22
|
+
};
|
|
23
|
+
type MesobProviderProps = {
|
|
24
|
+
children: ReactNode;
|
|
25
|
+
linkComponent?: ComponentType<MesobLinkProps>;
|
|
26
|
+
/** Hook that returns the app's t function (e.g. from next-intl useTranslations()). */
|
|
27
|
+
useTranslation?: () => (key: string, params?: Record<string, string | number>) => string;
|
|
28
|
+
/** Hook that returns the app's router (e.g. from next-intl useRouter()). */
|
|
29
|
+
useRouter?: () => Router;
|
|
30
|
+
};
|
|
31
|
+
declare function MesobProvider({ children, linkComponent, useTranslation, useRouter, }: MesobProviderProps): react_jsx_runtime.JSX.Element;
|
|
32
|
+
declare function useMesob(): MesobContextValue | null;
|
|
33
|
+
|
|
34
|
+
export { type MesobContextValue, type MesobLinkProps, MesobProvider, type MesobProviderProps, type Router, useMesob };
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/lib/utils.ts
|
|
4
|
+
import { clsx } from "clsx";
|
|
5
|
+
import { twMerge } from "tailwind-merge";
|
|
6
|
+
|
|
7
|
+
// src/components/tooltip.tsx
|
|
8
|
+
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
9
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
10
|
+
function TooltipProvider({
|
|
11
|
+
delayDuration = 0,
|
|
12
|
+
...props
|
|
13
|
+
}) {
|
|
14
|
+
return /* @__PURE__ */ jsx(
|
|
15
|
+
TooltipPrimitive.Provider,
|
|
16
|
+
{
|
|
17
|
+
"data-slot": "tooltip-provider",
|
|
18
|
+
delayDuration,
|
|
19
|
+
...props
|
|
20
|
+
}
|
|
21
|
+
);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
// src/components/mesob-context.tsx
|
|
25
|
+
import {
|
|
26
|
+
createContext,
|
|
27
|
+
useContext,
|
|
28
|
+
useMemo
|
|
29
|
+
} from "react";
|
|
30
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
31
|
+
var MesobContext = createContext(null);
|
|
32
|
+
function MesobProvider({
|
|
33
|
+
children,
|
|
34
|
+
linkComponent,
|
|
35
|
+
useTranslation,
|
|
36
|
+
useRouter
|
|
37
|
+
}) {
|
|
38
|
+
const t = useTranslation?.();
|
|
39
|
+
const router = useRouter?.();
|
|
40
|
+
const value = useMemo(
|
|
41
|
+
() => ({ linkComponent, t: t ?? void 0, router: router ?? void 0 }),
|
|
42
|
+
[linkComponent, t, router]
|
|
43
|
+
);
|
|
44
|
+
return /* @__PURE__ */ jsx2(MesobContext.Provider, { value, children: /* @__PURE__ */ jsx2(TooltipProvider, { delayDuration: 0, children }) });
|
|
45
|
+
}
|
|
46
|
+
function useMesob() {
|
|
47
|
+
return useContext(MesobContext);
|
|
48
|
+
}
|
|
49
|
+
export {
|
|
50
|
+
MesobProvider,
|
|
51
|
+
useMesob
|
|
52
|
+
};
|
|
53
|
+
//# sourceMappingURL=mesob-context.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/tooltip.tsx","../../src/components/mesob-context.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","'use client';\n\nimport { cn } from '@mesob/ui/lib/utils';\nimport * as TooltipPrimitive from '@radix-ui/react-tooltip';\nimport type * as React from 'react';\n\nfunction TooltipProvider({\n delayDuration = 0,\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Provider>) {\n return (\n <TooltipPrimitive.Provider\n data-slot=\"tooltip-provider\"\n delayDuration={delayDuration}\n {...props}\n />\n );\n}\n\nfunction Tooltip({\n children,\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Root>) {\n return (\n <TooltipPrimitive.Root data-slot=\"tooltip\" {...props}>\n {children}\n </TooltipPrimitive.Root>\n );\n}\n\nfunction TooltipTrigger({\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {\n return <TooltipPrimitive.Trigger data-slot=\"tooltip-trigger\" {...props} />;\n}\n\nfunction TooltipContent({\n className,\n sideOffset = 0,\n children,\n ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Content>) {\n return (\n <TooltipPrimitive.Portal>\n <TooltipPrimitive.Content\n data-slot=\"tooltip-content\"\n sideOffset={sideOffset}\n className={cn(\n 'bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance',\n className,\n )}\n {...props}\n >\n {children}\n <TooltipPrimitive.Arrow className=\"bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]\" />\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n );\n}\n\nexport { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };\n","'use client';\n\nimport { TooltipProvider } from '@mesob/ui/components/tooltip';\nimport {\n type ComponentType,\n createContext,\n type ReactNode,\n useContext,\n useMemo,\n} from 'react';\n\nexport type MesobLinkProps = {\n href: string;\n children: ReactNode;\n className?: string;\n onClick?: () => void;\n};\n\nexport type Router = {\n push: (href: string) => void;\n replace: (href: string) => void;\n back: () => void;\n forward: () => void;\n refresh: () => void;\n prefetch: (href: string) => void;\n};\n\nexport type MesobContextValue = {\n linkComponent?: ComponentType<MesobLinkProps>;\n t?: (key: string, params?: Record<string, string | number>) => string;\n router?: Router;\n};\n\nconst MesobContext = createContext<MesobContextValue | null>(null);\n\nexport type MesobProviderProps = {\n children: ReactNode;\n linkComponent?: ComponentType<MesobLinkProps>;\n /** Hook that returns the app's t function (e.g. from next-intl useTranslations()). */\n useTranslation?: () => (\n key: string,\n params?: Record<string, string | number>,\n ) => string;\n /** Hook that returns the app's router (e.g. from next-intl useRouter()). */\n useRouter?: () => Router;\n};\n\nexport function MesobProvider({\n children,\n linkComponent,\n useTranslation,\n useRouter,\n}: MesobProviderProps) {\n const t = useTranslation?.();\n const router = useRouter?.();\n const value = useMemo<MesobContextValue>(\n () => ({ linkComponent, t: t ?? undefined, router: router ?? undefined }),\n [linkComponent, t, router],\n );\n return (\n <MesobContext.Provider value={value}>\n <TooltipProvider delayDuration={0}>{children}</TooltipProvider>\n </MesobContext.Provider>\n );\n}\n\nexport function useMesob(): MesobContextValue | null {\n return useContext(MesobContext);\n}\n"],"mappings":";;;AAAA,SAA0B,YAAY;AACtC,SAAS,eAAe;;;ACExB,YAAY,sBAAsB;AAQ9B,cAiCE,YAjCF;AALJ,SAAS,gBAAgB;AAAA,EACvB,gBAAgB;AAAA,EAChB,GAAG;AACL,GAA2D;AACzD,SACE;AAAA,IAAkB;AAAA,IAAjB;AAAA,MACC,aAAU;AAAA,MACV;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;;;ACdA;AAAA,EAEE;AAAA,EAEA;AAAA,EACA;AAAA,OACK;AAoDD,gBAAAA,YAAA;AA5BN,IAAM,eAAe,cAAwC,IAAI;AAc1D,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAuB;AACrB,QAAM,IAAI,iBAAiB;AAC3B,QAAM,SAAS,YAAY;AAC3B,QAAM,QAAQ;AAAA,IACZ,OAAO,EAAE,eAAe,GAAG,KAAK,QAAW,QAAQ,UAAU,OAAU;AAAA,IACvE,CAAC,eAAe,GAAG,MAAM;AAAA,EAC3B;AACA,SACE,gBAAAA,KAAC,aAAa,UAAb,EAAsB,OACrB,0BAAAA,KAAC,mBAAgB,eAAe,GAAI,UAAS,GAC/C;AAEJ;AAEO,SAAS,WAAqC;AACnD,SAAO,WAAW,YAAY;AAChC;","names":["jsx"]}
|
|
@@ -122,7 +122,7 @@ function NavigationMenuViewport({
|
|
|
122
122
|
{
|
|
123
123
|
"data-slot": "navigation-menu-viewport",
|
|
124
124
|
className: cn(
|
|
125
|
-
"origin-top-center bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border shadow md:w-[var(--radix-navigation-menu-viewport-width)]",
|
|
125
|
+
"origin-top-center bg-popover text-popover-foreground border-border data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border shadow md:w-[var(--radix-navigation-menu-viewport-width)]",
|
|
126
126
|
className
|
|
127
127
|
),
|
|
128
128
|
...props
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/navigation-menu.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","import { cn } from '@mesob/ui/lib/utils';\nimport * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';\nimport { IconChevronDown } from '@tabler/icons-react';\nimport { cva } from 'class-variance-authority';\nimport type * as React from 'react';\n\nfunction NavigationMenu({\n className,\n children,\n viewport = true,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Root> & {\n viewport?: boolean;\n}) {\n return (\n <NavigationMenuPrimitive.Root\n data-slot=\"navigation-menu\"\n data-viewport={viewport}\n className={cn(\n 'group/navigation-menu relative flex max-w-max flex-1 items-center justify-center',\n className,\n )}\n {...props}\n >\n {children}\n {viewport && <NavigationMenuViewport />}\n </NavigationMenuPrimitive.Root>\n );\n}\n\nfunction NavigationMenuList({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.List>) {\n return (\n <NavigationMenuPrimitive.List\n data-slot=\"navigation-menu-list\"\n className={cn(\n 'group flex flex-1 list-none items-center justify-center gap-1',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction NavigationMenuItem({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Item>) {\n return (\n <NavigationMenuPrimitive.Item\n data-slot=\"navigation-menu-item\"\n className={cn('relative', className)}\n {...props}\n />\n );\n}\n\nconst navigationMenuTriggerStyle = cva(\n 'group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=open]:hover:bg-accent data-[state=open]:text-accent-foreground data-[state=open]:focus:bg-accent data-[state=open]:bg-accent/50 focus-visible:ring-ring/50 outline-none transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1',\n);\n\nfunction NavigationMenuTrigger({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>) {\n return (\n <NavigationMenuPrimitive.Trigger\n data-slot=\"navigation-menu-trigger\"\n className={cn(navigationMenuTriggerStyle(), 'group', className)}\n {...props}\n >\n {children}{' '}\n <IconChevronDown\n className=\"relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180\"\n aria-hidden=\"true\"\n />\n </NavigationMenuPrimitive.Trigger>\n );\n}\n\nfunction NavigationMenuContent({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Content>) {\n return (\n <NavigationMenuPrimitive.Content\n data-slot=\"navigation-menu-content\"\n className={cn(\n 'data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 top-0 left-0 w-full p-2 pr-2.5 md:absolute md:w-auto',\n 'group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction NavigationMenuViewport({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Viewport>) {\n return (\n <div\n className={cn(\n 'absolute top-full left-0 isolate z-50 flex justify-center',\n )}\n >\n <NavigationMenuPrimitive.Viewport\n data-slot=\"navigation-menu-viewport\"\n className={cn(\n 'origin-top-center bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border shadow md:w-[var(--radix-navigation-menu-viewport-width)]',\n className,\n )}\n {...props}\n />\n </div>\n );\n}\n\nfunction NavigationMenuLink({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Link>) {\n return (\n <NavigationMenuPrimitive.Link\n data-slot=\"navigation-menu-link\"\n className={cn(\n \"data-[active=true]:focus:bg-accent data-[active=true]:hover:bg-accent data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-ring/50 [&_svg:not([class*='text-'])]:text-muted-foreground flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none focus-visible:ring-[3px] focus-visible:outline-1 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction NavigationMenuIndicator({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Indicator>) {\n return (\n <NavigationMenuPrimitive.Indicator\n data-slot=\"navigation-menu-indicator\"\n className={cn(\n 'data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden',\n className,\n )}\n {...props}\n >\n <div className=\"bg-border relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm shadow-md\" />\n </NavigationMenuPrimitive.Indicator>\n );\n}\n\nexport {\n NavigationMenu,\n NavigationMenuList,\n NavigationMenuItem,\n NavigationMenuContent,\n NavigationMenuTrigger,\n NavigationMenuLink,\n NavigationMenuIndicator,\n NavigationMenuViewport,\n navigationMenuTriggerStyle,\n};\n"],"mappings":";AAAA,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACJA,YAAY,6BAA6B;AACzC,SAAS,uBAAuB;AAChC,SAAS,WAAW;AAYhB,SAUe,KAVf;AATJ,SAAS,eAAe;AAAA,EACtB;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,GAAG;AACL,GAEG;AACD,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,iBAAe;AAAA,MACf,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,QACA,YAAY,oBAAC,0BAAuB;AAAA;AAAA;AAAA,EACvC;AAEJ;AAEA,SAAS,mBAAmB;AAAA,EAC1B;AAAA,EACA,GAAG;AACL,GAA8D;AAC5D,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,mBAAmB;AAAA,EAC1B;AAAA,EACA,GAAG;AACL,GAA8D;AAC5D,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,YAAY,SAAS;AAAA,MAClC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,IAAM,6BAA6B;AAAA,EACjC;AACF;AAEA,SAAS,sBAAsB;AAAA,EAC7B;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiE;AAC/D,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,2BAA2B,GAAG,SAAS,SAAS;AAAA,MAC7D,GAAG;AAAA,MAEH;AAAA;AAAA,QAAU;AAAA,QACX;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAY;AAAA;AAAA,QACd;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,SAAS,sBAAsB;AAAA,EAC7B;AAAA,EACA,GAAG;AACL,GAAiE;AAC/D,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,uBAAuB;AAAA,EAC9B;AAAA,EACA,GAAG;AACL,GAAkE;AAChE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,MACF;AAAA,MAEA;AAAA,QAAyB;AAAA,QAAxB;AAAA,UACC,aAAU;AAAA,UACV,WAAW;AAAA,YACT;AAAA,YACA;AAAA,UACF;AAAA,UACC,GAAG;AAAA;AAAA,MACN;AAAA;AAAA,EACF;AAEJ;AAEA,SAAS,mBAAmB;AAAA,EAC1B;AAAA,EACA,GAAG;AACL,GAA8D;AAC5D,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,wBAAwB;AAAA,EAC/B;AAAA,EACA,GAAG;AACL,GAAmE;AACjE,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ,8BAAC,SAAI,WAAU,0EAAyE;AAAA;AAAA,EAC1F;AAEJ;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/navigation-menu.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","import { cn } from '@mesob/ui/lib/utils';\nimport * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';\nimport { IconChevronDown } from '@tabler/icons-react';\nimport { cva } from 'class-variance-authority';\nimport type * as React from 'react';\n\nfunction NavigationMenu({\n className,\n children,\n viewport = true,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Root> & {\n viewport?: boolean;\n}) {\n return (\n <NavigationMenuPrimitive.Root\n data-slot=\"navigation-menu\"\n data-viewport={viewport}\n className={cn(\n 'group/navigation-menu relative flex max-w-max flex-1 items-center justify-center',\n className,\n )}\n {...props}\n >\n {children}\n {viewport && <NavigationMenuViewport />}\n </NavigationMenuPrimitive.Root>\n );\n}\n\nfunction NavigationMenuList({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.List>) {\n return (\n <NavigationMenuPrimitive.List\n data-slot=\"navigation-menu-list\"\n className={cn(\n 'group flex flex-1 list-none items-center justify-center gap-1',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction NavigationMenuItem({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Item>) {\n return (\n <NavigationMenuPrimitive.Item\n data-slot=\"navigation-menu-item\"\n className={cn('relative', className)}\n {...props}\n />\n );\n}\n\nconst navigationMenuTriggerStyle = cva(\n 'group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=open]:hover:bg-accent data-[state=open]:text-accent-foreground data-[state=open]:focus:bg-accent data-[state=open]:bg-accent/50 focus-visible:ring-ring/50 outline-none transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1',\n);\n\nfunction NavigationMenuTrigger({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>) {\n return (\n <NavigationMenuPrimitive.Trigger\n data-slot=\"navigation-menu-trigger\"\n className={cn(navigationMenuTriggerStyle(), 'group', className)}\n {...props}\n >\n {children}{' '}\n <IconChevronDown\n className=\"relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180\"\n aria-hidden=\"true\"\n />\n </NavigationMenuPrimitive.Trigger>\n );\n}\n\nfunction NavigationMenuContent({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Content>) {\n return (\n <NavigationMenuPrimitive.Content\n data-slot=\"navigation-menu-content\"\n className={cn(\n 'data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 top-0 left-0 w-full p-2 pr-2.5 md:absolute md:w-auto',\n 'group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction NavigationMenuViewport({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Viewport>) {\n return (\n <div\n className={cn(\n 'absolute top-full left-0 isolate z-50 flex justify-center',\n )}\n >\n <NavigationMenuPrimitive.Viewport\n data-slot=\"navigation-menu-viewport\"\n className={cn(\n 'origin-top-center bg-popover text-popover-foreground border-border data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border shadow md:w-[var(--radix-navigation-menu-viewport-width)]',\n className,\n )}\n {...props}\n />\n </div>\n );\n}\n\nfunction NavigationMenuLink({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Link>) {\n return (\n <NavigationMenuPrimitive.Link\n data-slot=\"navigation-menu-link\"\n className={cn(\n \"data-[active=true]:focus:bg-accent data-[active=true]:hover:bg-accent data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-ring/50 [&_svg:not([class*='text-'])]:text-muted-foreground flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none focus-visible:ring-[3px] focus-visible:outline-1 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction NavigationMenuIndicator({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Indicator>) {\n return (\n <NavigationMenuPrimitive.Indicator\n data-slot=\"navigation-menu-indicator\"\n className={cn(\n 'data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden',\n className,\n )}\n {...props}\n >\n <div className=\"bg-border relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm shadow-md\" />\n </NavigationMenuPrimitive.Indicator>\n );\n}\n\nexport {\n NavigationMenu,\n NavigationMenuList,\n NavigationMenuItem,\n NavigationMenuContent,\n NavigationMenuTrigger,\n NavigationMenuLink,\n NavigationMenuIndicator,\n NavigationMenuViewport,\n navigationMenuTriggerStyle,\n};\n"],"mappings":";AAAA,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACJA,YAAY,6BAA6B;AACzC,SAAS,uBAAuB;AAChC,SAAS,WAAW;AAYhB,SAUe,KAVf;AATJ,SAAS,eAAe;AAAA,EACtB;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,GAAG;AACL,GAEG;AACD,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,iBAAe;AAAA,MACf,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,QACA,YAAY,oBAAC,0BAAuB;AAAA;AAAA;AAAA,EACvC;AAEJ;AAEA,SAAS,mBAAmB;AAAA,EAC1B;AAAA,EACA,GAAG;AACL,GAA8D;AAC5D,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,mBAAmB;AAAA,EAC1B;AAAA,EACA,GAAG;AACL,GAA8D;AAC5D,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,YAAY,SAAS;AAAA,MAClC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,IAAM,6BAA6B;AAAA,EACjC;AACF;AAEA,SAAS,sBAAsB;AAAA,EAC7B;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiE;AAC/D,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,2BAA2B,GAAG,SAAS,SAAS;AAAA,MAC7D,GAAG;AAAA,MAEH;AAAA;AAAA,QAAU;AAAA,QACX;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAY;AAAA;AAAA,QACd;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,SAAS,sBAAsB;AAAA,EAC7B;AAAA,EACA,GAAG;AACL,GAAiE;AAC/D,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,uBAAuB;AAAA,EAC9B;AAAA,EACA,GAAG;AACL,GAAkE;AAChE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,MACF;AAAA,MAEA;AAAA,QAAyB;AAAA,QAAxB;AAAA,UACC,aAAU;AAAA,UACV,WAAW;AAAA,YACT;AAAA,YACA;AAAA,UACF;AAAA,UACC,GAAG;AAAA;AAAA,MACN;AAAA;AAAA,EACF;AAEJ;AAEA,SAAS,mBAAmB;AAAA,EAC1B;AAAA,EACA,GAAG;AACL,GAA8D;AAC5D,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,wBAAwB;AAAA,EAC/B;AAAA,EACA,GAAG;AACL,GAAmE;AACjE,SACE;AAAA,IAAyB;AAAA,IAAxB;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ,8BAAC,SAAI,WAAU,0EAAyE;AAAA;AAAA,EAC1F;AAEJ;","names":[]}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
3
|
+
|
|
4
|
+
type PageBodyProps = {
|
|
5
|
+
className?: string;
|
|
6
|
+
children: ReactNode;
|
|
7
|
+
};
|
|
8
|
+
declare function PageBody({ className, children }: PageBodyProps): react_jsx_runtime.JSX.Element;
|
|
9
|
+
|
|
10
|
+
type PageContainerProps = {
|
|
11
|
+
className?: string;
|
|
12
|
+
children: ReactNode;
|
|
13
|
+
};
|
|
14
|
+
declare function PageContainer({ className, children }: PageContainerProps): react_jsx_runtime.JSX.Element;
|
|
15
|
+
|
|
16
|
+
type PageGoBackProps = {
|
|
17
|
+
onBack: () => void;
|
|
18
|
+
label?: string;
|
|
19
|
+
className?: string;
|
|
20
|
+
children?: ReactNode;
|
|
21
|
+
};
|
|
22
|
+
declare function PageGoBack({ onBack, label, className, children, }: PageGoBackProps): react_jsx_runtime.JSX.Element;
|
|
23
|
+
|
|
24
|
+
type PageSectionProps = {
|
|
25
|
+
title?: ReactNode;
|
|
26
|
+
className?: string;
|
|
27
|
+
children: ReactNode;
|
|
28
|
+
};
|
|
29
|
+
declare function PageSection({ title, className, children }: PageSectionProps): react_jsx_runtime.JSX.Element;
|
|
30
|
+
|
|
31
|
+
type PageSubTitleProps = {
|
|
32
|
+
className?: string;
|
|
33
|
+
children: ReactNode;
|
|
34
|
+
};
|
|
35
|
+
declare function PageSubTitle({ className, children }: PageSubTitleProps): react_jsx_runtime.JSX.Element;
|
|
36
|
+
|
|
37
|
+
type PageTitleProps = {
|
|
38
|
+
icon?: ReactNode;
|
|
39
|
+
back?: ReactNode;
|
|
40
|
+
action?: ReactNode;
|
|
41
|
+
children: ReactNode;
|
|
42
|
+
className?: string;
|
|
43
|
+
};
|
|
44
|
+
declare function PageTitle({ icon, back, action, children, className, }: PageTitleProps): react_jsx_runtime.JSX.Element;
|
|
45
|
+
|
|
46
|
+
export { PageBody, PageContainer, PageGoBack, PageSection, PageSubTitle, PageTitle };
|