@waveso/ui 0.0.2 → 0.0.4
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/LICENSE +21 -0
- package/README.md +72 -52
- package/dist/accordion.d.ts +14 -0
- package/dist/accordion.js +81 -0
- package/dist/accordion.js.map +1 -0
- package/dist/alert.d.ts +8 -4
- package/dist/alert.js.map +1 -1
- package/dist/aspect-ratio.d.ts +10 -0
- package/dist/aspect-ratio.js +18 -0
- package/dist/aspect-ratio.js.map +1 -0
- package/dist/autocomplete.d.ts +48 -0
- package/dist/autocomplete.js +222 -0
- package/dist/autocomplete.js.map +1 -0
- package/dist/avatar.d.ts +13 -7
- package/dist/avatar.js.map +1 -1
- package/dist/badge.d.ts +3 -2
- package/dist/badge.js +1 -1
- package/dist/badge.js.map +1 -1
- package/dist/breadcrumb.d.ts +20 -0
- package/dist/breadcrumb.js +123 -0
- package/dist/breadcrumb.js.map +1 -0
- package/dist/button-group.d.ts +19 -0
- package/dist/button-group.js +81 -0
- package/dist/button-group.js.map +1 -0
- package/dist/card.d.ts +15 -8
- package/dist/card.js.map +1 -1
- package/dist/checkbox.js +1 -1
- package/dist/chunk-45VQAWIM.js +228 -0
- package/dist/chunk-45VQAWIM.js.map +1 -0
- package/dist/chunk-6Y7LPQMO.js +11 -0
- package/dist/chunk-6Y7LPQMO.js.map +1 -0
- package/dist/chunk-7F4MPMLJ.js +17 -0
- package/dist/chunk-7F4MPMLJ.js.map +1 -0
- package/dist/chunk-7OIQ6YBK.js +66 -0
- package/dist/chunk-7OIQ6YBK.js.map +1 -0
- package/dist/chunk-D5XPEJ6T.js +36 -0
- package/dist/chunk-D5XPEJ6T.js.map +1 -0
- package/dist/chunk-DIGOLJIR.js +105 -0
- package/dist/chunk-DIGOLJIR.js.map +1 -0
- package/dist/chunk-IQ7YQ5XA.js +141 -0
- package/dist/chunk-IQ7YQ5XA.js.map +1 -0
- package/dist/chunk-NCHHHWTB.js +85 -0
- package/dist/chunk-NCHHHWTB.js.map +1 -0
- package/dist/chunk-PVX4VQFJ.js +143 -0
- package/dist/chunk-PVX4VQFJ.js.map +1 -0
- package/dist/chunk-QFSEK4M6.js +22 -0
- package/dist/chunk-QFSEK4M6.js.map +1 -0
- package/dist/chunk-QRW37LRP.js +25 -0
- package/dist/chunk-QRW37LRP.js.map +1 -0
- package/dist/chunk-RPQHL6C5.js +26 -0
- package/dist/chunk-RPQHL6C5.js.map +1 -0
- package/dist/chunk-YTSQQTSF.js +44 -0
- package/dist/chunk-YTSQQTSF.js.map +1 -0
- package/dist/chunk-ZZZH3JGW.js +23 -0
- package/dist/chunk-ZZZH3JGW.js.map +1 -0
- package/dist/collapsible.d.ts +12 -0
- package/dist/collapsible.js +16 -0
- package/dist/collapsible.js.map +1 -0
- package/dist/combobox.d.ts +48 -0
- package/dist/combobox.js +281 -0
- package/dist/combobox.js.map +1 -0
- package/dist/context-menu.d.ts +47 -0
- package/dist/context-menu.js +193 -0
- package/dist/context-menu.js.map +1 -0
- package/dist/dialog.js +1 -1
- package/dist/direction.d.ts +1 -0
- package/dist/direction.js +3 -0
- package/dist/direction.js.map +1 -0
- package/dist/drawer.d.ts +29 -0
- package/dist/drawer.js +6 -0
- package/dist/drawer.js.map +1 -0
- package/dist/encrypted-text.d.ts +16 -0
- package/dist/encrypted-text.js +141 -0
- package/dist/encrypted-text.js.map +1 -0
- package/dist/field.d.ts +22 -0
- package/dist/field.js +4 -0
- package/dist/field.js.map +1 -0
- package/dist/form.d.ts +80 -0
- package/dist/form.js +108 -0
- package/dist/form.js.map +1 -0
- package/dist/hooks/use-mobile.d.ts +6 -1
- package/dist/hooks/use-mobile.js +1 -18
- package/dist/hooks/use-mobile.js.map +1 -1
- package/dist/infinite-scroll.d.ts +19 -0
- package/dist/infinite-scroll.js +102 -0
- package/dist/infinite-scroll.js.map +1 -0
- package/dist/input-group.d.ts +29 -0
- package/dist/input-group.js +7 -0
- package/dist/input-group.js.map +1 -0
- package/dist/input-otp.d.ts +18 -0
- package/dist/input-otp.js +79 -0
- package/dist/input-otp.js.map +1 -0
- package/dist/input.d.ts +2 -1
- package/dist/input.js +2 -20
- package/dist/input.js.map +1 -1
- package/dist/item.d.ts +37 -0
- package/dist/item.js +181 -0
- package/dist/item.js.map +1 -0
- package/dist/kbd.d.ts +8 -0
- package/dist/kbd.js +30 -0
- package/dist/kbd.js.map +1 -0
- package/dist/label.d.ts +2 -1
- package/dist/label.js.map +1 -1
- package/dist/masonry.d.ts +17 -0
- package/dist/masonry.js +235 -0
- package/dist/masonry.js.map +1 -0
- package/dist/menu.d.ts +47 -0
- package/dist/menu.js +5 -0
- package/dist/menu.js.map +1 -0
- package/dist/menubar.d.ts +40 -0
- package/dist/menubar.js +84 -0
- package/dist/menubar.js.map +1 -0
- package/dist/pagination.d.ts +29 -0
- package/dist/pagination.js +120 -0
- package/dist/pagination.js.map +1 -0
- package/dist/popover.d.ts +24 -0
- package/dist/popover.js +105 -0
- package/dist/popover.js.map +1 -0
- package/dist/preview-card.d.ts +17 -0
- package/dist/preview-card.js +70 -0
- package/dist/preview-card.js.map +1 -0
- package/dist/radio-group.d.ts +12 -0
- package/dist/radio-group.js +28 -0
- package/dist/radio-group.js.map +1 -0
- package/dist/radio.d.ts +10 -0
- package/dist/radio.js +4 -0
- package/dist/radio.js.map +1 -0
- package/dist/scroll-area.d.ts +10 -0
- package/dist/scroll-area.js +59 -0
- package/dist/scroll-area.js.map +1 -0
- package/dist/select.d.ts +36 -0
- package/dist/select.js +208 -0
- package/dist/select.js.map +1 -0
- package/dist/separator.js +2 -24
- package/dist/separator.js.map +1 -1
- package/dist/sidebar.d.ts +112 -0
- package/dist/sidebar.js +619 -0
- package/dist/sidebar.js.map +1 -0
- package/dist/skeleton.d.ts +2 -1
- package/dist/skeleton.js +2 -15
- package/dist/skeleton.js.map +1 -1
- package/dist/slider.d.ts +10 -0
- package/dist/slider.js +70 -0
- package/dist/slider.js.map +1 -0
- package/dist/spinner.d.ts +2 -1
- package/dist/spinner.js +3 -9
- package/dist/spinner.js.map +1 -1
- package/dist/styles.css +196 -0
- package/dist/table.d.ts +21 -0
- package/dist/table.js +106 -0
- package/dist/table.js.map +1 -0
- package/dist/tabs.d.ts +20 -0
- package/dist/tabs.js +82 -0
- package/dist/tabs.js.map +1 -0
- package/dist/textarea.js +2 -23
- package/dist/textarea.js.map +1 -1
- package/dist/toast.d.ts +57 -0
- package/dist/toast.js +239 -0
- package/dist/toast.js.map +1 -0
- package/dist/toggle-group.d.ts +17 -0
- package/dist/toggle-group.js +78 -0
- package/dist/toggle-group.js.map +1 -0
- package/dist/toggle.d.ts +14 -0
- package/dist/toggle.js +4 -0
- package/dist/toggle.js.map +1 -0
- package/dist/tooltip.d.ts +21 -0
- package/dist/tooltip.js +4 -0
- package/dist/tooltip.js.map +1 -0
- package/package.json +10 -3
- package/dist/chunk-L3UIJEIQ.js +0 -41
- package/dist/chunk-L3UIJEIQ.js.map +0 -1
|
@@ -0,0 +1,141 @@
|
|
|
1
|
+
import { Textarea } from './chunk-QRW37LRP.js';
|
|
2
|
+
import { Input } from './chunk-QFSEK4M6.js';
|
|
3
|
+
import { Button } from './chunk-OUFYQLVN.js';
|
|
4
|
+
import { cn } from './chunk-76UQO56T.js';
|
|
5
|
+
import { cva } from 'class-variance-authority';
|
|
6
|
+
import { jsx } from 'react/jsx-runtime';
|
|
7
|
+
|
|
8
|
+
function InputGroup({ className, ...props }) {
|
|
9
|
+
return /* @__PURE__ */ jsx(
|
|
10
|
+
"div",
|
|
11
|
+
{
|
|
12
|
+
"data-slot": "input-group",
|
|
13
|
+
role: "group",
|
|
14
|
+
className: cn(
|
|
15
|
+
"border-input dark:bg-input/30 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 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 has-disabled:bg-input/50 dark:has-disabled:bg-input/80 group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 not-has-disabled:has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-3 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5",
|
|
16
|
+
className
|
|
17
|
+
),
|
|
18
|
+
...props
|
|
19
|
+
}
|
|
20
|
+
);
|
|
21
|
+
}
|
|
22
|
+
var inputGroupAddonVariants = cva(
|
|
23
|
+
"text-muted-foreground h-auto gap-2 py-1.5 text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4 flex cursor-text items-center justify-center select-none",
|
|
24
|
+
{
|
|
25
|
+
variants: {
|
|
26
|
+
align: {
|
|
27
|
+
"inline-start": "pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem] order-first",
|
|
28
|
+
"inline-end": "pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem] order-last",
|
|
29
|
+
"block-start": "px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2 order-first w-full justify-start",
|
|
30
|
+
"block-end": "px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2 order-last w-full justify-start"
|
|
31
|
+
}
|
|
32
|
+
},
|
|
33
|
+
defaultVariants: {
|
|
34
|
+
align: "inline-start"
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
);
|
|
38
|
+
function InputGroupAddon({
|
|
39
|
+
className,
|
|
40
|
+
align = "inline-start",
|
|
41
|
+
...props
|
|
42
|
+
}) {
|
|
43
|
+
return /* @__PURE__ */ jsx(
|
|
44
|
+
"div",
|
|
45
|
+
{
|
|
46
|
+
role: "group",
|
|
47
|
+
"data-slot": "input-group-addon",
|
|
48
|
+
"data-align": align,
|
|
49
|
+
className: cn(inputGroupAddonVariants({ align }), className),
|
|
50
|
+
onClick: (e) => {
|
|
51
|
+
if (e.target.closest("button")) {
|
|
52
|
+
return;
|
|
53
|
+
}
|
|
54
|
+
e.currentTarget.parentElement?.querySelector("input")?.focus();
|
|
55
|
+
},
|
|
56
|
+
...props
|
|
57
|
+
}
|
|
58
|
+
);
|
|
59
|
+
}
|
|
60
|
+
var inputGroupButtonVariants = cva(
|
|
61
|
+
"gap-2 text-sm shadow-none flex items-center",
|
|
62
|
+
{
|
|
63
|
+
variants: {
|
|
64
|
+
size: {
|
|
65
|
+
xs: "h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
|
|
66
|
+
sm: "",
|
|
67
|
+
"icon-xs": "size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0",
|
|
68
|
+
"icon-sm": "size-8 p-0 has-[>svg]:p-0"
|
|
69
|
+
}
|
|
70
|
+
},
|
|
71
|
+
defaultVariants: {
|
|
72
|
+
size: "xs"
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
);
|
|
76
|
+
function InputGroupButton({
|
|
77
|
+
className,
|
|
78
|
+
type = "button",
|
|
79
|
+
variant = "ghost",
|
|
80
|
+
size = "xs",
|
|
81
|
+
...props
|
|
82
|
+
}) {
|
|
83
|
+
return /* @__PURE__ */ jsx(
|
|
84
|
+
Button,
|
|
85
|
+
{
|
|
86
|
+
type,
|
|
87
|
+
"data-size": size,
|
|
88
|
+
variant,
|
|
89
|
+
className: cn(inputGroupButtonVariants({ size }), className),
|
|
90
|
+
...props
|
|
91
|
+
}
|
|
92
|
+
);
|
|
93
|
+
}
|
|
94
|
+
function InputGroupText({ className, ...props }) {
|
|
95
|
+
return /* @__PURE__ */ jsx(
|
|
96
|
+
"span",
|
|
97
|
+
{
|
|
98
|
+
className: cn(
|
|
99
|
+
"text-muted-foreground flex items-center gap-2 text-sm [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4",
|
|
100
|
+
className
|
|
101
|
+
),
|
|
102
|
+
...props
|
|
103
|
+
}
|
|
104
|
+
);
|
|
105
|
+
}
|
|
106
|
+
function InputGroupInput({
|
|
107
|
+
className,
|
|
108
|
+
...props
|
|
109
|
+
}) {
|
|
110
|
+
return /* @__PURE__ */ jsx(
|
|
111
|
+
Input,
|
|
112
|
+
{
|
|
113
|
+
"data-slot": "input-group-control",
|
|
114
|
+
className: cn(
|
|
115
|
+
"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent",
|
|
116
|
+
className
|
|
117
|
+
),
|
|
118
|
+
...props
|
|
119
|
+
}
|
|
120
|
+
);
|
|
121
|
+
}
|
|
122
|
+
function InputGroupTextarea({
|
|
123
|
+
className,
|
|
124
|
+
...props
|
|
125
|
+
}) {
|
|
126
|
+
return /* @__PURE__ */ jsx(
|
|
127
|
+
Textarea,
|
|
128
|
+
{
|
|
129
|
+
"data-slot": "input-group-control",
|
|
130
|
+
className: cn(
|
|
131
|
+
"flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent",
|
|
132
|
+
className
|
|
133
|
+
),
|
|
134
|
+
...props
|
|
135
|
+
}
|
|
136
|
+
);
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea };
|
|
140
|
+
//# sourceMappingURL=chunk-IQ7YQ5XA.js.map
|
|
141
|
+
//# sourceMappingURL=chunk-IQ7YQ5XA.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/input-group.tsx"],"names":[],"mappings":"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","file":"chunk-IQ7YQ5XA.js","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"./lib/utils\"\nimport { Button } from \"./button\"\nimport { Input } from \"./input\"\nimport { Textarea } from \"./textarea\"\n\ntype InputGroupProps = React.ComponentProps<\"div\">\n\ntype InputGroupAddonProps = React.ComponentProps<\"div\"> &\n VariantProps<typeof inputGroupAddonVariants>\n\ntype InputGroupButtonProps = Omit<React.ComponentProps<typeof Button>, \"size\" | \"type\"> &\n VariantProps<typeof inputGroupButtonVariants> & {\n type?: \"button\" | \"submit\" | \"reset\"\n }\n\ntype InputGroupTextProps = React.ComponentProps<\"span\">\n\ntype InputGroupInputProps = React.ComponentProps<\"input\">\n\ntype InputGroupTextareaProps = React.ComponentProps<\"textarea\">\n\nfunction InputGroup({ className, ...props }: InputGroupProps) {\n return (\n <div\n data-slot=\"input-group\"\n role=\"group\"\n className={cn(\n \"border-input dark:bg-input/30 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 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 has-disabled:bg-input/50 dark:has-disabled:bg-input/80 group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 not-has-disabled:has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-3 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5\",\n className\n )}\n {...props}\n />\n )\n}\n\nconst inputGroupAddonVariants = cva(\n \"text-muted-foreground h-auto gap-2 py-1.5 text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4 flex cursor-text items-center justify-center select-none\",\n {\n variants: {\n align: {\n \"inline-start\":\n \"pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem] order-first\",\n \"inline-end\":\n \"pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem] order-last\",\n \"block-start\":\n \"px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2 order-first w-full justify-start\",\n \"block-end\":\n \"px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2 order-last w-full justify-start\",\n },\n },\n defaultVariants: {\n align: \"inline-start\",\n },\n }\n)\n\nfunction InputGroupAddon({\n className,\n align = \"inline-start\",\n ...props\n}: InputGroupAddonProps) {\n return (\n <div\n role=\"group\"\n data-slot=\"input-group-addon\"\n data-align={align}\n className={cn(inputGroupAddonVariants({ align }), className)}\n onClick={(e) => {\n if ((e.target as HTMLElement).closest(\"button\")) {\n return\n }\n e.currentTarget.parentElement?.querySelector(\"input\")?.focus()\n }}\n {...props}\n />\n )\n}\n\nconst inputGroupButtonVariants = cva(\n \"gap-2 text-sm shadow-none flex items-center\",\n {\n variants: {\n size: {\n xs: \"h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5\",\n sm: \"\",\n \"icon-xs\":\n \"size-6 rounded-[calc(var(--radius)-3px)] 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}: InputGroupButtonProps) {\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 }: InputGroupTextProps) {\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}: InputGroupInputProps) {\n return (\n <Input\n data-slot=\"input-group-control\"\n className={cn(\n \"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction InputGroupTextarea({\n className,\n ...props\n}: InputGroupTextareaProps) {\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-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled: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"]}
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
import { cn } from './chunk-76UQO56T.js';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { Field as Field$1 } from '@base-ui/react/field';
|
|
4
|
+
export { Field as FieldPrimitive } from '@base-ui/react/field';
|
|
5
|
+
import { jsx } from 'react/jsx-runtime';
|
|
6
|
+
|
|
7
|
+
function Field({ className, ...props }) {
|
|
8
|
+
return /* @__PURE__ */ jsx(
|
|
9
|
+
Field$1.Root,
|
|
10
|
+
{
|
|
11
|
+
"data-slot": "field",
|
|
12
|
+
className: cn(
|
|
13
|
+
"grid w-full gap-2 data-[invalid]:text-destructive",
|
|
14
|
+
className
|
|
15
|
+
),
|
|
16
|
+
...props
|
|
17
|
+
}
|
|
18
|
+
);
|
|
19
|
+
}
|
|
20
|
+
function FieldLabel({ className, ...props }) {
|
|
21
|
+
return /* @__PURE__ */ jsx(
|
|
22
|
+
Field$1.Label,
|
|
23
|
+
{
|
|
24
|
+
"data-slot": "field-label",
|
|
25
|
+
className: cn(
|
|
26
|
+
"text-sm font-medium leading-none data-[disabled]:cursor-not-allowed data-[disabled]:opacity-70",
|
|
27
|
+
className
|
|
28
|
+
),
|
|
29
|
+
...props
|
|
30
|
+
}
|
|
31
|
+
);
|
|
32
|
+
}
|
|
33
|
+
var FieldControl = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
34
|
+
Field$1.Control,
|
|
35
|
+
{
|
|
36
|
+
ref,
|
|
37
|
+
"data-slot": "field-control",
|
|
38
|
+
className: cn(
|
|
39
|
+
"rounded-md outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50",
|
|
40
|
+
className
|
|
41
|
+
),
|
|
42
|
+
...props
|
|
43
|
+
}
|
|
44
|
+
));
|
|
45
|
+
FieldControl.displayName = "FieldControl";
|
|
46
|
+
function FieldDescription({ className, ...props }) {
|
|
47
|
+
return /* @__PURE__ */ jsx(
|
|
48
|
+
Field$1.Description,
|
|
49
|
+
{
|
|
50
|
+
"data-slot": "field-description",
|
|
51
|
+
className: cn(
|
|
52
|
+
"text-muted-foreground text-left text-sm leading-normal font-normal group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5",
|
|
53
|
+
"last:mt-0 nth-last-2:-mt-1",
|
|
54
|
+
"[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4",
|
|
55
|
+
className
|
|
56
|
+
),
|
|
57
|
+
...props
|
|
58
|
+
}
|
|
59
|
+
);
|
|
60
|
+
}
|
|
61
|
+
function FieldItem({ className, ...props }) {
|
|
62
|
+
return /* @__PURE__ */ jsx(
|
|
63
|
+
Field$1.Item,
|
|
64
|
+
{
|
|
65
|
+
"data-slot": "field-item",
|
|
66
|
+
className: cn("flex items-center gap-2", className),
|
|
67
|
+
...props
|
|
68
|
+
}
|
|
69
|
+
);
|
|
70
|
+
}
|
|
71
|
+
function FieldError({ className, ...props }) {
|
|
72
|
+
return /* @__PURE__ */ jsx(
|
|
73
|
+
Field$1.Error,
|
|
74
|
+
{
|
|
75
|
+
"data-slot": "field-error",
|
|
76
|
+
className: cn("text-destructive text-sm font-normal", className),
|
|
77
|
+
...props
|
|
78
|
+
}
|
|
79
|
+
);
|
|
80
|
+
}
|
|
81
|
+
var FieldValidity = Field$1.Validity;
|
|
82
|
+
|
|
83
|
+
export { Field, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldValidity };
|
|
84
|
+
//# sourceMappingURL=chunk-NCHHHWTB.js.map
|
|
85
|
+
//# sourceMappingURL=chunk-NCHHHWTB.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/field.tsx"],"names":["FieldPrimitive"],"mappings":";;;;;;AAiBO,SAAS,KAAA,CAAM,EAAE,SAAA,EAAW,GAAG,OAAM,EAAe;AACzD,EAAA,uBACE,GAAA;AAAA,IAACA,OAAA,CAAe,IAAA;AAAA,IAAf;AAAA,MACC,WAAA,EAAU,OAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,mDAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ;AAEO,SAAS,UAAA,CAAW,EAAE,SAAA,EAAW,GAAG,OAAM,EAAoB;AACnE,EAAA,uBACE,GAAA;AAAA,IAACA,OAAA,CAAe,KAAA;AAAA,IAAf;AAAA,MACC,WAAA,EAAU,aAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,gGAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ;AAEO,IAAM,YAAA,GAAqB,iBAGhC,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,qBAC1B,GAAA;AAAA,EAACA,OAAA,CAAe,OAAA;AAAA,EAAf;AAAA,IACC,GAAA;AAAA,IACA,WAAA,EAAU,eAAA;AAAA,IACV,SAAA,EAAW,EAAA;AAAA,MACT,gKAAA;AAAA,MACA;AAAA,KACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,YAAA,CAAa,WAAA,GAAc,cAAA;AAEpB,SAAS,gBAAA,CAAiB,EAAE,SAAA,EAAW,GAAG,OAAM,EAA0B;AAC/E,EAAA,uBACE,GAAA;AAAA,IAACA,OAAA,CAAe,WAAA;AAAA,IAAf;AAAA,MACC,WAAA,EAAU,mBAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,mJAAA;AAAA,QACA,4BAAA;AAAA,QACA,mEAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ;AAEO,SAAS,SAAA,CAAU,EAAE,SAAA,EAAW,GAAG,OAAM,EAAmB;AACjE,EAAA,uBACE,GAAA;AAAA,IAACA,OAAA,CAAe,IAAA;AAAA,IAAf;AAAA,MACC,WAAA,EAAU,YAAA;AAAA,MACV,SAAA,EAAW,EAAA,CAAG,yBAAA,EAA2B,SAAS,CAAA;AAAA,MACjD,GAAG;AAAA;AAAA,GACN;AAEJ;AAEO,SAAS,UAAA,CAAW,EAAE,SAAA,EAAW,GAAG,OAAM,EAAoB;AACnE,EAAA,uBACE,GAAA;AAAA,IAACA,OAAA,CAAe,KAAA;AAAA,IAAf;AAAA,MACC,WAAA,EAAU,aAAA;AAAA,MACV,SAAA,EAAW,EAAA,CAAG,sCAAA,EAAwC,SAAS,CAAA;AAAA,MAC9D,GAAG;AAAA;AAAA,GACN;AAEJ;AAGO,IAAM,gBAAgBA,OAAA,CAAe","file":"chunk-NCHHHWTB.js","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Field as FieldPrimitive } from \"@base-ui/react/field\"\n\nimport { cn } from \"./lib/utils\"\n\nexport type FieldProps = React.ComponentProps<typeof FieldPrimitive.Root>\nexport type FieldLabelProps = React.ComponentProps<typeof FieldPrimitive.Label>\nexport type FieldDescriptionProps = React.ComponentProps<typeof FieldPrimitive.Description>\nexport type FieldItemProps = React.ComponentProps<typeof FieldPrimitive.Item>\nexport type FieldErrorProps = React.ComponentProps<typeof FieldPrimitive.Error>\nexport type FieldValidityProps = React.ComponentProps<typeof FieldPrimitive.Validity>\n\n// `ref` is important for React Hook Form / focus management, so we forward it only on the control.\nexport type FieldControlProps = React.ComponentPropsWithoutRef<typeof FieldPrimitive.Control>\n\nexport function Field({ className, ...props }: FieldProps) {\n return (\n <FieldPrimitive.Root\n data-slot=\"field\"\n className={cn(\n \"grid w-full gap-2 data-[invalid]:text-destructive\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport function FieldLabel({ className, ...props }: FieldLabelProps) {\n return (\n <FieldPrimitive.Label\n data-slot=\"field-label\"\n className={cn(\n \"text-sm font-medium leading-none data-[disabled]:cursor-not-allowed data-[disabled]:opacity-70\",\n className,\n )}\n {...props}\n />\n )\n}\n\nexport const FieldControl = React.forwardRef<\n React.ComponentRef<typeof FieldPrimitive.Control>,\n FieldControlProps\n>(({ className, ...props }, ref) => (\n <FieldPrimitive.Control\n ref={ref}\n data-slot=\"field-control\"\n className={cn(\n \"rounded-md outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\",\n className,\n )}\n {...props}\n />\n))\nFieldControl.displayName = \"FieldControl\"\n\nexport function FieldDescription({ className, ...props }: FieldDescriptionProps) {\n return (\n <FieldPrimitive.Description\n data-slot=\"field-description\"\n className={cn(\n \"text-muted-foreground text-left text-sm leading-normal font-normal group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5\",\n \"last:mt-0 nth-last-2:-mt-1\",\n \"[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport function FieldItem({ className, ...props }: FieldItemProps) {\n return (\n <FieldPrimitive.Item\n data-slot=\"field-item\"\n className={cn(\"flex items-center gap-2\", className)}\n {...props}\n />\n )\n}\n\nexport function FieldError({ className, ...props }: FieldErrorProps) {\n return (\n <FieldPrimitive.Error\n data-slot=\"field-error\"\n className={cn(\"text-destructive text-sm font-normal\", className)}\n {...props}\n />\n )\n}\n\n// Base UI's Validity does not accept `className`/`ref` (and we don't need to style it yet), so we export it as-is.\nexport const FieldValidity = FieldPrimitive.Validity\n\nexport { FieldPrimitive }"]}
|
|
@@ -0,0 +1,143 @@
|
|
|
1
|
+
import { Button } from './chunk-OUFYQLVN.js';
|
|
2
|
+
import { CloseIcon } from './chunk-DIGOLJIR.js';
|
|
3
|
+
import { cn } from './chunk-76UQO56T.js';
|
|
4
|
+
import { DrawerPreview } from '@base-ui/react/drawer';
|
|
5
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
6
|
+
|
|
7
|
+
function Drawer({ ...props }) {
|
|
8
|
+
return /* @__PURE__ */ jsx(DrawerPreview.Root, { "data-slot": "drawer", ...props });
|
|
9
|
+
}
|
|
10
|
+
function DrawerTrigger({ ...props }) {
|
|
11
|
+
return /* @__PURE__ */ jsx(DrawerPreview.Trigger, { "data-slot": "drawer-trigger", ...props });
|
|
12
|
+
}
|
|
13
|
+
function DrawerPortal({ ...props }) {
|
|
14
|
+
return /* @__PURE__ */ jsx(DrawerPreview.Portal, { "data-slot": "drawer-portal", ...props });
|
|
15
|
+
}
|
|
16
|
+
function DrawerClose({ ...props }) {
|
|
17
|
+
return /* @__PURE__ */ jsx(DrawerPreview.Close, { "data-slot": "drawer-close", ...props });
|
|
18
|
+
}
|
|
19
|
+
function DrawerOverlay({ className, ...props }) {
|
|
20
|
+
return /* @__PURE__ */ jsx(
|
|
21
|
+
DrawerPreview.Backdrop,
|
|
22
|
+
{
|
|
23
|
+
"data-slot": "drawer-overlay",
|
|
24
|
+
className: cn(
|
|
25
|
+
"fixed inset-0 z-50 bg-black/10 transition-opacity duration-300 data-[starting-style]:opacity-0 data-[ending-style]:opacity-0 supports-backdrop-filter:backdrop-blur-xs",
|
|
26
|
+
className
|
|
27
|
+
),
|
|
28
|
+
...props
|
|
29
|
+
}
|
|
30
|
+
);
|
|
31
|
+
}
|
|
32
|
+
function DrawerContent({
|
|
33
|
+
className,
|
|
34
|
+
children,
|
|
35
|
+
showCloseButton = false,
|
|
36
|
+
...props
|
|
37
|
+
}) {
|
|
38
|
+
return /* @__PURE__ */ jsxs(DrawerPortal, { children: [
|
|
39
|
+
/* @__PURE__ */ jsx(DrawerOverlay, {}),
|
|
40
|
+
/* @__PURE__ */ jsxs(
|
|
41
|
+
DrawerPreview.Popup,
|
|
42
|
+
{
|
|
43
|
+
"data-slot": "drawer-content",
|
|
44
|
+
className: cn(
|
|
45
|
+
// Base layout & appearance
|
|
46
|
+
"group/drawer-content bg-background fixed z-50 flex flex-col overflow-y-auto text-sm shadow-lg outline-none",
|
|
47
|
+
// Transition — animate translate, disable during swipe
|
|
48
|
+
"transition-[translate] duration-300 ease-out data-[swiping]:duration-0",
|
|
49
|
+
// Bottom drawer (swipeDirection="down")
|
|
50
|
+
"data-[swipe-direction=down]:inset-x-0 data-[swipe-direction=down]:bottom-0 data-[swipe-direction=down]:mt-24 data-[swipe-direction=down]:max-h-[80vh] data-[swipe-direction=down]:rounded-t-xl data-[swipe-direction=down]:border-t",
|
|
51
|
+
// Top drawer (swipeDirection="up")
|
|
52
|
+
"data-[swipe-direction=up]:inset-x-0 data-[swipe-direction=up]:top-0 data-[swipe-direction=up]:mb-24 data-[swipe-direction=up]:max-h-[80vh] data-[swipe-direction=up]:rounded-b-xl data-[swipe-direction=up]:border-b",
|
|
53
|
+
// Left drawer (swipeDirection="left")
|
|
54
|
+
"data-[swipe-direction=left]:inset-y-0 data-[swipe-direction=left]:left-0 data-[swipe-direction=left]:w-3/4 data-[swipe-direction=left]:rounded-r-xl data-[swipe-direction=left]:border-r data-[swipe-direction=left]:sm:max-w-sm",
|
|
55
|
+
// Right drawer (swipeDirection="right")
|
|
56
|
+
"data-[swipe-direction=right]:inset-y-0 data-[swipe-direction=right]:right-0 data-[swipe-direction=right]:w-3/4 data-[swipe-direction=right]:rounded-l-xl data-[swipe-direction=right]:border-l data-[swipe-direction=right]:sm:max-w-sm",
|
|
57
|
+
// Enter/exit slide — bottom
|
|
58
|
+
"data-[swipe-direction=down]:data-[starting-style]:translate-y-full data-[swipe-direction=down]:data-[ending-style]:translate-y-full",
|
|
59
|
+
// Enter/exit slide — top
|
|
60
|
+
"data-[swipe-direction=up]:data-[starting-style]:-translate-y-full data-[swipe-direction=up]:data-[ending-style]:-translate-y-full",
|
|
61
|
+
// Enter/exit slide — left
|
|
62
|
+
"data-[swipe-direction=left]:data-[starting-style]:-translate-x-full data-[swipe-direction=left]:data-[ending-style]:-translate-x-full",
|
|
63
|
+
// Enter/exit slide — right
|
|
64
|
+
"data-[swipe-direction=right]:data-[starting-style]:translate-x-full data-[swipe-direction=right]:data-[ending-style]:translate-x-full",
|
|
65
|
+
className
|
|
66
|
+
),
|
|
67
|
+
...props,
|
|
68
|
+
children: [
|
|
69
|
+
/* @__PURE__ */ jsx("div", { className: "bg-muted mx-auto mt-4 hidden h-1 w-[100px] shrink-0 rounded-full group-data-[swipe-direction=down]/drawer-content:block" }),
|
|
70
|
+
children,
|
|
71
|
+
showCloseButton && /* @__PURE__ */ jsxs(
|
|
72
|
+
DrawerPreview.Close,
|
|
73
|
+
{
|
|
74
|
+
"data-slot": "drawer-close",
|
|
75
|
+
render: /* @__PURE__ */ jsx(
|
|
76
|
+
Button,
|
|
77
|
+
{
|
|
78
|
+
variant: "ghost",
|
|
79
|
+
className: "absolute top-2 right-2",
|
|
80
|
+
size: "icon-sm"
|
|
81
|
+
}
|
|
82
|
+
),
|
|
83
|
+
children: [
|
|
84
|
+
/* @__PURE__ */ jsx(CloseIcon, {}),
|
|
85
|
+
/* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
|
|
86
|
+
]
|
|
87
|
+
}
|
|
88
|
+
)
|
|
89
|
+
]
|
|
90
|
+
}
|
|
91
|
+
)
|
|
92
|
+
] });
|
|
93
|
+
}
|
|
94
|
+
function DrawerHeader({ className, ...props }) {
|
|
95
|
+
return /* @__PURE__ */ jsx(
|
|
96
|
+
"div",
|
|
97
|
+
{
|
|
98
|
+
"data-slot": "drawer-header",
|
|
99
|
+
className: cn(
|
|
100
|
+
"flex flex-col gap-0.5 p-4 group-data-[swipe-direction=down]/drawer-content:text-center group-data-[swipe-direction=up]/drawer-content:text-center md:text-left",
|
|
101
|
+
className
|
|
102
|
+
),
|
|
103
|
+
...props
|
|
104
|
+
}
|
|
105
|
+
);
|
|
106
|
+
}
|
|
107
|
+
function DrawerFooter({ className, ...props }) {
|
|
108
|
+
return /* @__PURE__ */ jsx(
|
|
109
|
+
"div",
|
|
110
|
+
{
|
|
111
|
+
"data-slot": "drawer-footer",
|
|
112
|
+
className: cn("mt-auto flex flex-col gap-2 p-4", className),
|
|
113
|
+
...props
|
|
114
|
+
}
|
|
115
|
+
);
|
|
116
|
+
}
|
|
117
|
+
function DrawerTitle({ className, ...props }) {
|
|
118
|
+
return /* @__PURE__ */ jsx(
|
|
119
|
+
DrawerPreview.Title,
|
|
120
|
+
{
|
|
121
|
+
"data-slot": "drawer-title",
|
|
122
|
+
className: cn("text-foreground text-base font-medium", className),
|
|
123
|
+
...props
|
|
124
|
+
}
|
|
125
|
+
);
|
|
126
|
+
}
|
|
127
|
+
function DrawerDescription({
|
|
128
|
+
className,
|
|
129
|
+
...props
|
|
130
|
+
}) {
|
|
131
|
+
return /* @__PURE__ */ jsx(
|
|
132
|
+
DrawerPreview.Description,
|
|
133
|
+
{
|
|
134
|
+
"data-slot": "drawer-description",
|
|
135
|
+
className: cn("text-muted-foreground text-sm", className),
|
|
136
|
+
...props
|
|
137
|
+
}
|
|
138
|
+
);
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger };
|
|
142
|
+
//# sourceMappingURL=chunk-PVX4VQFJ.js.map
|
|
143
|
+
//# sourceMappingURL=chunk-PVX4VQFJ.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/drawer.tsx"],"names":["DrawerPrimitive"],"mappings":"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","file":"chunk-PVX4VQFJ.js","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { DrawerPreview as DrawerPrimitive } from \"@base-ui/react/drawer\"\n\nimport { cn } from \"./lib/utils\"\nimport { Button } from \"./button\"\nimport { CloseIcon } from \"./lib/internal-icons\"\n\ntype DrawerProps = React.ComponentProps<typeof DrawerPrimitive.Root>\ntype DrawerTriggerProps = React.ComponentProps<typeof DrawerPrimitive.Trigger>\ntype DrawerPortalProps = React.ComponentProps<typeof DrawerPrimitive.Portal>\ntype DrawerCloseProps = React.ComponentProps<typeof DrawerPrimitive.Close>\ntype DrawerOverlayProps = React.ComponentProps<typeof DrawerPrimitive.Backdrop>\ntype DrawerPopupProps = React.ComponentProps<typeof DrawerPrimitive.Popup>\ntype DrawerTitleProps = React.ComponentProps<typeof DrawerPrimitive.Title>\ntype DrawerDescriptionProps = React.ComponentProps<typeof DrawerPrimitive.Description>\ntype DrawerHeaderProps = React.ComponentProps<\"div\">\ntype DrawerFooterProps = React.ComponentProps<\"div\">\n\ntype DrawerContentProps = DrawerPopupProps & {\n showCloseButton?: boolean\n}\n\nfunction Drawer({ ...props }: DrawerProps) {\n return <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />\n}\n\nfunction DrawerTrigger({ ...props }: DrawerTriggerProps) {\n return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />\n}\n\nfunction DrawerPortal({ ...props }: DrawerPortalProps) {\n return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />\n}\n\nfunction DrawerClose({ ...props }: DrawerCloseProps) {\n return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />\n}\n\nfunction DrawerOverlay({ className, ...props }: DrawerOverlayProps) {\n return (\n <DrawerPrimitive.Backdrop\n data-slot=\"drawer-overlay\"\n className={cn(\n \"fixed inset-0 z-50 bg-black/10 transition-opacity duration-300 data-[starting-style]:opacity-0 data-[ending-style]:opacity-0 supports-backdrop-filter:backdrop-blur-xs\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DrawerContent({\n className,\n children,\n showCloseButton = false,\n ...props\n}: DrawerContentProps) {\n return (\n <DrawerPortal>\n <DrawerOverlay />\n <DrawerPrimitive.Popup\n data-slot=\"drawer-content\"\n className={cn(\n // Base layout & appearance\n \"group/drawer-content bg-background fixed z-50 flex flex-col overflow-y-auto text-sm shadow-lg outline-none\",\n // Transition — animate translate, disable during swipe\n \"transition-[translate] duration-300 ease-out data-[swiping]:duration-0\",\n // Bottom drawer (swipeDirection=\"down\")\n \"data-[swipe-direction=down]:inset-x-0 data-[swipe-direction=down]:bottom-0 data-[swipe-direction=down]:mt-24 data-[swipe-direction=down]:max-h-[80vh] data-[swipe-direction=down]:rounded-t-xl data-[swipe-direction=down]:border-t\",\n // Top drawer (swipeDirection=\"up\")\n \"data-[swipe-direction=up]:inset-x-0 data-[swipe-direction=up]:top-0 data-[swipe-direction=up]:mb-24 data-[swipe-direction=up]:max-h-[80vh] data-[swipe-direction=up]:rounded-b-xl data-[swipe-direction=up]:border-b\",\n // Left drawer (swipeDirection=\"left\")\n \"data-[swipe-direction=left]:inset-y-0 data-[swipe-direction=left]:left-0 data-[swipe-direction=left]:w-3/4 data-[swipe-direction=left]:rounded-r-xl data-[swipe-direction=left]:border-r data-[swipe-direction=left]:sm:max-w-sm\",\n // Right drawer (swipeDirection=\"right\")\n \"data-[swipe-direction=right]:inset-y-0 data-[swipe-direction=right]:right-0 data-[swipe-direction=right]:w-3/4 data-[swipe-direction=right]:rounded-l-xl data-[swipe-direction=right]:border-l data-[swipe-direction=right]:sm:max-w-sm\",\n // Enter/exit slide — bottom\n \"data-[swipe-direction=down]:data-[starting-style]:translate-y-full data-[swipe-direction=down]:data-[ending-style]:translate-y-full\",\n // Enter/exit slide — top\n \"data-[swipe-direction=up]:data-[starting-style]:-translate-y-full data-[swipe-direction=up]:data-[ending-style]:-translate-y-full\",\n // Enter/exit slide — left\n \"data-[swipe-direction=left]:data-[starting-style]:-translate-x-full data-[swipe-direction=left]:data-[ending-style]:-translate-x-full\",\n // Enter/exit slide — right\n \"data-[swipe-direction=right]:data-[starting-style]:translate-x-full data-[swipe-direction=right]:data-[ending-style]:translate-x-full\",\n className,\n )}\n {...props}\n >\n {/* Drag handle — visible only for bottom drawers */}\n <div className=\"bg-muted mx-auto mt-4 hidden h-1 w-[100px] shrink-0 rounded-full group-data-[swipe-direction=down]/drawer-content:block\" />\n {children}\n {showCloseButton && (\n <DrawerPrimitive.Close\n data-slot=\"drawer-close\"\n render={\n <Button\n variant=\"ghost\"\n className=\"absolute top-2 right-2\"\n size=\"icon-sm\"\n />\n }\n >\n <CloseIcon />\n <span className=\"sr-only\">Close</span>\n </DrawerPrimitive.Close>\n )}\n </DrawerPrimitive.Popup>\n </DrawerPortal>\n )\n}\n\nfunction DrawerHeader({ className, ...props }: DrawerHeaderProps) {\n return (\n <div\n data-slot=\"drawer-header\"\n className={cn(\n \"flex flex-col gap-0.5 p-4 group-data-[swipe-direction=down]/drawer-content:text-center group-data-[swipe-direction=up]/drawer-content:text-center md:text-left\",\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DrawerFooter({ className, ...props }: DrawerFooterProps) {\n return (\n <div\n data-slot=\"drawer-footer\"\n className={cn(\"mt-auto flex flex-col gap-2 p-4\", className)}\n {...props}\n />\n )\n}\n\nfunction DrawerTitle({ className, ...props }: DrawerTitleProps) {\n return (\n <DrawerPrimitive.Title\n data-slot=\"drawer-title\"\n className={cn(\"text-foreground text-base font-medium\", className)}\n {...props}\n />\n )\n}\n\nfunction DrawerDescription({\n className,\n ...props\n}: DrawerDescriptionProps) {\n return (\n <DrawerPrimitive.Description\n data-slot=\"drawer-description\"\n className={cn(\"text-muted-foreground text-sm\", className)}\n {...props}\n />\n )\n}\n\nexport {\n Drawer,\n DrawerPortal,\n DrawerOverlay,\n DrawerTrigger,\n DrawerClose,\n DrawerContent,\n DrawerHeader,\n DrawerFooter,\n DrawerTitle,\n DrawerDescription,\n}\n"]}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { cn } from './chunk-76UQO56T.js';
|
|
2
|
+
import { Input as Input$1 } from '@base-ui/react/input';
|
|
3
|
+
import { jsx } from 'react/jsx-runtime';
|
|
4
|
+
|
|
5
|
+
function Input({ className, type, ...props }) {
|
|
6
|
+
return /* @__PURE__ */ jsx(
|
|
7
|
+
Input$1,
|
|
8
|
+
{
|
|
9
|
+
type,
|
|
10
|
+
"data-slot": "input",
|
|
11
|
+
className: cn(
|
|
12
|
+
"dark:bg-input/30 border-input 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:aria-invalid:border-destructive/50 disabled:bg-input/50 dark:disabled:bg-input/80 file:text-foreground placeholder:text-muted-foreground h-8 w-full min-w-0 rounded-lg border bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:ring-3 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm",
|
|
13
|
+
className
|
|
14
|
+
),
|
|
15
|
+
...props
|
|
16
|
+
}
|
|
17
|
+
);
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
export { Input };
|
|
21
|
+
//# sourceMappingURL=chunk-QFSEK4M6.js.map
|
|
22
|
+
//# sourceMappingURL=chunk-QFSEK4M6.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/input.tsx"],"names":["InputPrimitive"],"mappings":";;;;AAOA,SAAS,MAAM,EAAE,SAAA,EAAW,IAAA,EAAM,GAAG,OAAM,EAAe;AACxD,EAAA,uBACE,GAAA;AAAA,IAACA,OAAA;AAAA,IAAA;AAAA,MACC,IAAA;AAAA,MACA,WAAA,EAAU,OAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,6oBAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ","file":"chunk-QFSEK4M6.js","sourcesContent":["import * as React from \"react\"\nimport { Input as InputPrimitive } from \"@base-ui/react/input\"\n\nimport { cn } from \"./lib/utils\"\n\ntype InputProps = React.ComponentProps<\"input\">\n\nfunction Input({ className, type, ...props }: InputProps) {\n return (\n <InputPrimitive\n type={type}\n data-slot=\"input\"\n className={cn(\n \"dark:bg-input/30 border-input 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:aria-invalid:border-destructive/50 disabled:bg-input/50 dark:disabled:bg-input/80 file:text-foreground placeholder:text-muted-foreground h-8 w-full min-w-0 rounded-lg border bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:ring-3 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport { Input }\n"]}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { cn } from './chunk-76UQO56T.js';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
|
|
4
|
+
function Textarea({ className, onChange, onValueChange, ...props }) {
|
|
5
|
+
function handleChange(e) {
|
|
6
|
+
onChange?.(e);
|
|
7
|
+
onValueChange?.(e.target.value);
|
|
8
|
+
}
|
|
9
|
+
return /* @__PURE__ */ jsx(
|
|
10
|
+
"textarea",
|
|
11
|
+
{
|
|
12
|
+
"data-slot": "textarea",
|
|
13
|
+
className: cn(
|
|
14
|
+
"border-input dark:bg-input/30 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:aria-invalid:border-destructive/50 resize-none disabled:bg-input/50 disabled:cursor-not-allowed dark:disabled:bg-input/80 placeholder:text-muted-foreground flex field-sizing-content min-h-16 w-full rounded-lg border bg-transparent px-2.5 py-2 text-base transition-colors outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm",
|
|
15
|
+
className
|
|
16
|
+
),
|
|
17
|
+
onChange: handleChange,
|
|
18
|
+
...props
|
|
19
|
+
}
|
|
20
|
+
);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
export { Textarea };
|
|
24
|
+
//# sourceMappingURL=chunk-QRW37LRP.js.map
|
|
25
|
+
//# sourceMappingURL=chunk-QRW37LRP.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/textarea.tsx"],"names":[],"mappings":";;;AASA,SAAS,SAAS,EAAE,SAAA,EAAW,UAAU,aAAA,EAAe,GAAG,OAAM,EAAkB;AACjF,EAAA,SAAS,aAAa,CAAA,EAA2C;AAC/D,IAAA,QAAA,GAAW,CAAC,CAAA;AACZ,IAAA,aAAA,GAAgB,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,EAChC;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,UAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,gkBAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,QAAA,EAAU,YAAA;AAAA,MACT,GAAG;AAAA;AAAA,GACN;AAEJ","file":"chunk-QRW37LRP.js","sourcesContent":["import * as React from \"react\"\n\nimport { cn } from \"./lib/utils\"\n\ntype TextareaProps = Omit<React.ComponentProps<\"textarea\">, \"onChange\"> & {\n onChange?: React.ChangeEventHandler<HTMLTextAreaElement>\n onValueChange?: (value: string) => void\n}\n\nfunction Textarea({ className, onChange, onValueChange, ...props }: TextareaProps) {\n function handleChange(e: React.ChangeEvent<HTMLTextAreaElement>) {\n onChange?.(e)\n onValueChange?.(e.target.value)\n }\n\n return (\n <textarea\n data-slot=\"textarea\"\n className={cn(\n \"border-input dark:bg-input/30 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:aria-invalid:border-destructive/50 resize-none disabled:bg-input/50 disabled:cursor-not-allowed dark:disabled:bg-input/80 placeholder:text-muted-foreground flex field-sizing-content min-h-16 w-full rounded-lg border bg-transparent px-2.5 py-2 text-base transition-colors outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm\",\n className,\n )}\n onChange={handleChange}\n {...props}\n />\n )\n}\n\nexport { Textarea }\n"]}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { cn } from './chunk-76UQO56T.js';
|
|
2
|
+
import { Separator as Separator$1 } from '@base-ui/react/separator';
|
|
3
|
+
import { jsx } from 'react/jsx-runtime';
|
|
4
|
+
|
|
5
|
+
function Separator({
|
|
6
|
+
className,
|
|
7
|
+
orientation = "horizontal",
|
|
8
|
+
...props
|
|
9
|
+
}) {
|
|
10
|
+
return /* @__PURE__ */ jsx(
|
|
11
|
+
Separator$1,
|
|
12
|
+
{
|
|
13
|
+
"data-slot": "separator",
|
|
14
|
+
orientation,
|
|
15
|
+
className: cn(
|
|
16
|
+
"bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-px data-[orientation=vertical]:self-stretch",
|
|
17
|
+
className
|
|
18
|
+
),
|
|
19
|
+
...props
|
|
20
|
+
}
|
|
21
|
+
);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
export { Separator };
|
|
25
|
+
//# sourceMappingURL=chunk-RPQHL6C5.js.map
|
|
26
|
+
//# sourceMappingURL=chunk-RPQHL6C5.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/separator.tsx"],"names":["SeparatorPrimitive"],"mappings":";;;;AAUA,SAAS,SAAA,CAAU;AAAA,EACjB,SAAA;AAAA,EACA,WAAA,GAAc,YAAA;AAAA,EACd,GAAG;AACL,CAAA,EAAmB;AACjB,EAAA,uBACE,GAAA;AAAA,IAACA,WAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,WAAA;AAAA,MACV,WAAA;AAAA,MACA,SAAA,EAAW,EAAA;AAAA,QACT,sKAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ","file":"chunk-RPQHL6C5.js","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { Separator as SeparatorPrimitive } from \"@base-ui/react/separator\"\n\nimport { cn } from \"./lib/utils\"\n\ntype SeparatorProps = React.ComponentProps<typeof SeparatorPrimitive>\n\nfunction Separator({\n className,\n orientation = \"horizontal\",\n ...props\n}: SeparatorProps) {\n return (\n <SeparatorPrimitive\n data-slot=\"separator\"\n orientation={orientation}\n className={cn(\n \"bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-px data-[orientation=vertical]:self-stretch\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport { Separator }\n"]}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { cn } from './chunk-76UQO56T.js';
|
|
2
|
+
import { Toggle as Toggle$1 } from '@base-ui/react/toggle';
|
|
3
|
+
import { cva } from 'class-variance-authority';
|
|
4
|
+
import { jsx } from 'react/jsx-runtime';
|
|
5
|
+
|
|
6
|
+
var toggleVariants = cva(
|
|
7
|
+
"cursor-pointer hover:text-foreground aria-pressed:bg-muted focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive data-[state=on]:bg-muted gap-1 rounded-lg text-sm font-medium transition-all [&_svg:not([class*='size-'])]:size-4 group/toggle hover:bg-muted inline-flex items-center justify-center whitespace-nowrap outline-none focus-visible:ring-3 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
|
8
|
+
{
|
|
9
|
+
variants: {
|
|
10
|
+
variant: {
|
|
11
|
+
default: "bg-transparent",
|
|
12
|
+
outline: "border-input hover:bg-muted border bg-transparent"
|
|
13
|
+
},
|
|
14
|
+
size: {
|
|
15
|
+
default: "h-8 min-w-8 px-2",
|
|
16
|
+
sm: "h-7 min-w-7 rounded-[min(var(--radius-md),12px)] px-1.5 text-[0.8rem]",
|
|
17
|
+
lg: "h-9 min-w-9 px-2.5"
|
|
18
|
+
}
|
|
19
|
+
},
|
|
20
|
+
defaultVariants: {
|
|
21
|
+
variant: "default",
|
|
22
|
+
size: "default"
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
);
|
|
26
|
+
function Toggle({
|
|
27
|
+
className,
|
|
28
|
+
variant = "default",
|
|
29
|
+
size = "default",
|
|
30
|
+
...props
|
|
31
|
+
}) {
|
|
32
|
+
return /* @__PURE__ */ jsx(
|
|
33
|
+
Toggle$1,
|
|
34
|
+
{
|
|
35
|
+
"data-slot": "toggle",
|
|
36
|
+
className: cn(toggleVariants({ variant, size, className })),
|
|
37
|
+
...props
|
|
38
|
+
}
|
|
39
|
+
);
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
export { Toggle, toggleVariants };
|
|
43
|
+
//# sourceMappingURL=chunk-YTSQQTSF.js.map
|
|
44
|
+
//# sourceMappingURL=chunk-YTSQQTSF.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/toggle.tsx"],"names":["TogglePrimitive"],"mappings":";;;;;AAQA,IAAM,cAAA,GAAiB,GAAA;AAAA,EACrB,giBAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,OAAA,EAAS,gBAAA;AAAA,QACT,OAAA,EAAS;AAAA,OACX;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,OAAA,EAAS,kBAAA;AAAA,QACT,EAAA,EAAI,uEAAA;AAAA,QACJ,EAAA,EAAI;AAAA;AACN,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS,SAAA;AAAA,MACT,IAAA,EAAM;AAAA;AACR;AAEJ;AAKA,SAAS,MAAA,CAAO;AAAA,EACd,SAAA;AAAA,EACA,OAAA,GAAU,SAAA;AAAA,EACV,IAAA,GAAO,SAAA;AAAA,EACP,GAAG;AACL,CAAA,EAAgB;AACd,EAAA,uBACE,GAAA;AAAA,IAACA,QAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,QAAA;AAAA,MACV,SAAA,EAAW,GAAG,cAAA,CAAe,EAAE,SAAS,IAAA,EAAM,SAAA,EAAW,CAAC,CAAA;AAAA,MACzD,GAAG;AAAA;AAAA,GACN;AAEJ","file":"chunk-YTSQQTSF.js","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"./lib/utils\"\n\nconst toggleVariants = cva(\n \"cursor-pointer hover:text-foreground aria-pressed:bg-muted focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive data-[state=on]:bg-muted gap-1 rounded-lg text-sm font-medium transition-all [&_svg:not([class*='size-'])]:size-4 group/toggle hover:bg-muted inline-flex items-center justify-center whitespace-nowrap outline-none focus-visible:ring-3 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n {\n variants: {\n variant: {\n default: \"bg-transparent\",\n outline: \"border-input hover:bg-muted border bg-transparent\",\n },\n size: {\n default: \"h-8 min-w-8 px-2\",\n sm: \"h-7 min-w-7 rounded-[min(var(--radius-md),12px)] px-1.5 text-[0.8rem]\",\n lg: \"h-9 min-w-9 px-2.5\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n },\n)\n\ntype ToggleProps = React.ComponentProps<typeof TogglePrimitive> &\n VariantProps<typeof toggleVariants>\n\nfunction Toggle({\n className,\n variant = \"default\",\n size = \"default\",\n ...props\n}: ToggleProps) {\n return (\n <TogglePrimitive\n data-slot=\"toggle\"\n className={cn(toggleVariants({ variant, size, className }))}\n {...props}\n />\n )\n}\n\nexport { Toggle, toggleVariants }\n"]}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
var DEFAULT_MOBILE_BREAKPOINT = 768;
|
|
4
|
+
function useIsMobile(breakpoint = DEFAULT_MOBILE_BREAKPOINT) {
|
|
5
|
+
const [isMobile, setIsMobile] = React.useState(() => {
|
|
6
|
+
if (typeof window === "undefined") return false;
|
|
7
|
+
return window.innerWidth < breakpoint;
|
|
8
|
+
});
|
|
9
|
+
React.useEffect(() => {
|
|
10
|
+
const mql = window.matchMedia(`(max-width: ${breakpoint - 1}px)`);
|
|
11
|
+
const onChange = () => {
|
|
12
|
+
setIsMobile(window.innerWidth < breakpoint);
|
|
13
|
+
};
|
|
14
|
+
mql.addEventListener("change", onChange);
|
|
15
|
+
setIsMobile(window.innerWidth < breakpoint);
|
|
16
|
+
return () => mql.removeEventListener("change", onChange);
|
|
17
|
+
}, [breakpoint]);
|
|
18
|
+
return isMobile;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export { useIsMobile };
|
|
22
|
+
//# sourceMappingURL=chunk-ZZZH3JGW.js.map
|
|
23
|
+
//# sourceMappingURL=chunk-ZZZH3JGW.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/hooks/use-mobile.ts"],"names":[],"mappings":";;AAIA,IAAM,yBAAA,GAA4B,GAAA;AAO3B,SAAS,WAAA,CAAY,aAAqB,yBAAA,EAA2B;AAC1E,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAU,eAAS,MAAM;AACnD,IAAA,IAAI,OAAO,MAAA,KAAW,WAAA,EAAa,OAAO,KAAA;AAC1C,IAAA,OAAO,OAAO,UAAA,GAAa,UAAA;AAAA,EAC7B,CAAC,CAAA;AAED,EAAM,gBAAU,MAAM;AACpB,IAAA,MAAM,MAAM,MAAA,CAAO,UAAA,CAAW,CAAA,YAAA,EAAe,UAAA,GAAa,CAAC,CAAA,GAAA,CAAK,CAAA;AAChE,IAAA,MAAM,WAAW,MAAM;AACrB,MAAA,WAAA,CAAY,MAAA,CAAO,aAAa,UAAU,CAAA;AAAA,IAC5C,CAAA;AACA,IAAA,GAAA,CAAI,gBAAA,CAAiB,UAAU,QAAQ,CAAA;AAEvC,IAAA,WAAA,CAAY,MAAA,CAAO,aAAa,UAAU,CAAA;AAC1C,IAAA,OAAO,MAAM,GAAA,CAAI,mBAAA,CAAoB,QAAA,EAAU,QAAQ,CAAA;AAAA,EACzD,CAAA,EAAG,CAAC,UAAU,CAAC,CAAA;AAEf,EAAA,OAAO,QAAA;AACT","file":"chunk-ZZZH3JGW.js","sourcesContent":["'use client';\n\nimport * as React from \"react\";\n\nconst DEFAULT_MOBILE_BREAKPOINT = 768;\n\n/**\n * Returns `true` when the viewport is below the given breakpoint.\n *\n * @param breakpoint - Width in pixels. Defaults to 768.\n */\nexport function useIsMobile(breakpoint: number = DEFAULT_MOBILE_BREAKPOINT) {\n const [isMobile, setIsMobile] = React.useState(() => {\n if (typeof window === 'undefined') return false;\n return window.innerWidth < breakpoint;\n });\n\n React.useEffect(() => {\n const mql = window.matchMedia(`(max-width: ${breakpoint - 1}px)`);\n const onChange = () => {\n setIsMobile(window.innerWidth < breakpoint);\n };\n mql.addEventListener(\"change\", onChange);\n // Sync in case breakpoint prop changed\n setIsMobile(window.innerWidth < breakpoint);\n return () => mql.removeEventListener(\"change\", onChange);\n }, [breakpoint]);\n\n return isMobile;\n}\n"]}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { Collapsible as Collapsible$1 } from '@base-ui/react/collapsible';
|
|
4
|
+
|
|
5
|
+
type CollapsibleProps = React.ComponentProps<typeof Collapsible$1.Root>;
|
|
6
|
+
type CollapsibleTriggerProps = React.ComponentProps<typeof Collapsible$1.Trigger>;
|
|
7
|
+
type CollapsibleContentProps = React.ComponentProps<typeof Collapsible$1.Panel>;
|
|
8
|
+
declare function Collapsible({ ...props }: CollapsibleProps): react_jsx_runtime.JSX.Element;
|
|
9
|
+
declare function CollapsibleTrigger({ ...props }: CollapsibleTriggerProps): react_jsx_runtime.JSX.Element;
|
|
10
|
+
declare function CollapsibleContent({ ...props }: CollapsibleContentProps): react_jsx_runtime.JSX.Element;
|
|
11
|
+
|
|
12
|
+
export { Collapsible, CollapsibleContent, CollapsibleTrigger };
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { Collapsible as Collapsible$1 } from '@base-ui/react/collapsible';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
|
|
4
|
+
function Collapsible({ ...props }) {
|
|
5
|
+
return /* @__PURE__ */ jsx(Collapsible$1.Root, { "data-slot": "collapsible", ...props });
|
|
6
|
+
}
|
|
7
|
+
function CollapsibleTrigger({ ...props }) {
|
|
8
|
+
return /* @__PURE__ */ jsx(Collapsible$1.Trigger, { "data-slot": "collapsible-trigger", ...props });
|
|
9
|
+
}
|
|
10
|
+
function CollapsibleContent({ ...props }) {
|
|
11
|
+
return /* @__PURE__ */ jsx(Collapsible$1.Panel, { "data-slot": "collapsible-content", ...props });
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
export { Collapsible, CollapsibleContent, CollapsibleTrigger };
|
|
15
|
+
//# sourceMappingURL=collapsible.js.map
|
|
16
|
+
//# sourceMappingURL=collapsible.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/collapsible.tsx"],"names":["CollapsiblePrimitive"],"mappings":";;;AAUA,SAAS,WAAA,CAAY,EAAE,GAAG,KAAA,EAAM,EAAqB;AACnD,EAAA,2BAAQA,aAAA,CAAqB,IAAA,EAArB,EAA0B,WAAA,EAAU,aAAA,EAAe,GAAG,KAAA,EAAO,CAAA;AACvE;AAEA,SAAS,kBAAA,CAAmB,EAAE,GAAG,KAAA,EAAM,EAA4B;AACjE,EAAA,2BACGA,aAAA,CAAqB,OAAA,EAArB,EAA6B,WAAA,EAAU,qBAAA,EAAuB,GAAG,KAAA,EAAO,CAAA;AAE7E;AAEA,SAAS,kBAAA,CAAmB,EAAE,GAAG,KAAA,EAAM,EAA4B;AACjE,EAAA,2BACGA,aAAA,CAAqB,KAAA,EAArB,EAA2B,WAAA,EAAU,qBAAA,EAAuB,GAAG,KAAA,EAAO,CAAA;AAE3E","file":"collapsible.js","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { Collapsible as CollapsiblePrimitive } from \"@base-ui/react/collapsible\"\n\ntype CollapsibleProps = React.ComponentProps<typeof CollapsiblePrimitive.Root>\ntype CollapsibleTriggerProps = React.ComponentProps<typeof CollapsiblePrimitive.Trigger>\ntype CollapsibleContentProps = React.ComponentProps<typeof CollapsiblePrimitive.Panel>\n\nfunction Collapsible({ ...props }: CollapsibleProps) {\n return <CollapsiblePrimitive.Root data-slot=\"collapsible\" {...props} />\n}\n\nfunction CollapsibleTrigger({ ...props }: CollapsibleTriggerProps) {\n return (\n <CollapsiblePrimitive.Trigger data-slot=\"collapsible-trigger\" {...props} />\n )\n}\n\nfunction CollapsibleContent({ ...props }: CollapsibleContentProps) {\n return (\n <CollapsiblePrimitive.Panel data-slot=\"collapsible-content\" {...props} />\n )\n}\n\nexport {\n Collapsible,\n CollapsibleTrigger,\n CollapsibleContent\n}\n"]}
|