@zukhruf/shadcn 0.0.0-stage → 0.3.22
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 +48 -0
- package/README.md +190 -2
- package/dist/components/accordion.d.ts +7 -0
- package/dist/components/accordion.d.ts.map +1 -0
- package/dist/components/accordion.js +18 -0
- package/dist/components/accordion.js.map +1 -0
- package/dist/components/alert-dialog.d.ts +19 -0
- package/dist/components/alert-dialog.d.ts.map +1 -0
- package/dist/components/alert-dialog.js +44 -0
- package/dist/components/alert-dialog.js.map +1 -0
- package/dist/components/alert.d.ts +11 -0
- package/dist/components/alert.d.ts.map +1 -0
- package/dist/components/alert.js +29 -0
- package/dist/components/alert.js.map +1 -0
- package/dist/components/aspect-ratio.d.ts +5 -0
- package/dist/components/aspect-ratio.d.ts.map +1 -0
- package/dist/components/aspect-ratio.js +9 -0
- package/dist/components/aspect-ratio.js.map +1 -0
- package/dist/components/attachment.d.ts +24 -0
- package/dist/components/attachment.d.ts.map +1 -0
- package/dist/components/attachment.js +70 -0
- package/dist/components/attachment.js.map +1 -0
- package/dist/components/avatar.d.ts +12 -0
- package/dist/components/avatar.d.ts.map +1 -0
- package/dist/components/avatar.js +25 -0
- package/dist/components/avatar.js.map +1 -0
- package/dist/components/badge.d.ts +8 -0
- package/dist/components/badge.d.ts.map +1 -0
- package/dist/components/badge.js +34 -0
- package/dist/components/badge.js.map +1 -0
- package/dist/components/breadcrumb.d.ts +11 -0
- package/dist/components/breadcrumb.d.ts.map +1 -0
- package/dist/components/breadcrumb.js +38 -0
- package/dist/components/breadcrumb.js.map +1 -0
- package/dist/components/bubble.d.ts +17 -0
- package/dist/components/bubble.d.ts.map +1 -0
- package/dist/components/bubble.js +61 -0
- package/dist/components/bubble.js.map +1 -0
- package/dist/components/button-group.d.ts +11 -0
- package/dist/components/button-group.d.ts.map +1 -0
- package/dist/components/button-group.js +37 -0
- package/dist/components/button-group.js.map +1 -0
- package/dist/components/button.d.ts +9 -0
- package/dist/components/button.d.ts.map +1 -0
- package/dist/components/button.js +35 -0
- package/dist/components/button.js.map +1 -0
- package/dist/components/calendar.d.ts +11 -0
- package/dist/components/calendar.d.ts.map +1 -0
- package/dist/components/calendar.js +77 -0
- package/dist/components/calendar.js.map +1 -0
- package/dist/components/card.d.ts +12 -0
- package/dist/components/card.d.ts.map +1 -0
- package/dist/components/card.js +26 -0
- package/dist/components/card.js.map +1 -0
- package/dist/components/carousel.d.ts +29 -0
- package/dist/components/carousel.d.ts.map +1 -0
- package/dist/components/carousel.js +92 -0
- package/dist/components/carousel.js.map +1 -0
- package/dist/components/chart.d.ts +45 -0
- package/dist/components/chart.d.ts.map +1 -0
- package/dist/components/chart.js +133 -0
- package/dist/components/chart.js.map +1 -0
- package/dist/components/checkbox.d.ts +4 -0
- package/dist/components/checkbox.d.ts.map +1 -0
- package/dist/components/checkbox.js +10 -0
- package/dist/components/checkbox.js.map +1 -0
- package/dist/components/code-block.d.ts +27 -0
- package/dist/components/code-block.d.ts.map +1 -0
- package/dist/components/code-block.js +81 -0
- package/dist/components/code-block.js.map +1 -0
- package/dist/components/collapsible.d.ts +6 -0
- package/dist/components/collapsible.d.ts.map +1 -0
- package/dist/components/collapsible.js +14 -0
- package/dist/components/collapsible.js.map +1 -0
- package/dist/components/combobox.d.ts +25 -0
- package/dist/components/combobox.d.ts.map +1 -0
- package/dist/components/combobox.js +59 -0
- package/dist/components/combobox.js.map +1 -0
- package/dist/components/command.d.ts +20 -0
- package/dist/components/command.d.ts.map +1 -0
- package/dist/components/command.js +37 -0
- package/dist/components/command.js.map +1 -0
- package/dist/components/context-menu.d.ts +30 -0
- package/dist/components/context-menu.d.ts.map +1 -0
- package/dist/components/context-menu.js +53 -0
- package/dist/components/context-menu.js.map +1 -0
- package/dist/components/dialog.d.ts +18 -0
- package/dist/components/dialog.d.ts.map +1 -0
- package/dist/components/dialog.js +39 -0
- package/dist/components/dialog.js.map +1 -0
- package/dist/components/direction.d.ts +2 -0
- package/dist/components/direction.d.ts.map +1 -0
- package/dist/components/direction.js +3 -0
- package/dist/components/direction.js.map +1 -0
- package/dist/components/drawer.d.ts +17 -0
- package/dist/components/drawer.d.ts.map +1 -0
- package/dist/components/drawer.js +76 -0
- package/dist/components/drawer.js.map +1 -0
- package/dist/components/dropdown-menu.d.ts +30 -0
- package/dist/components/dropdown-menu.d.ts.map +1 -0
- package/dist/components/dropdown-menu.js +53 -0
- package/dist/components/dropdown-menu.js.map +1 -0
- package/dist/components/empty.d.ts +12 -0
- package/dist/components/empty.d.ts.map +1 -0
- package/dist/components/empty.js +34 -0
- package/dist/components/empty.js.map +1 -0
- package/dist/components/field.d.ts +25 -0
- package/dist/components/field.d.ts.map +1 -0
- package/dist/components/field.js +69 -0
- package/dist/components/field.js.map +1 -0
- package/dist/components/hover-card.d.ts +6 -0
- package/dist/components/hover-card.d.ts.map +1 -0
- package/dist/components/hover-card.js +15 -0
- package/dist/components/hover-card.js.map +1 -0
- package/dist/components/input-group.d.ts +19 -0
- package/dist/components/input-group.d.ts.map +1 -0
- package/dist/components/input-group.js +59 -0
- package/dist/components/input-group.js.map +1 -0
- package/dist/components/input-otp.d.ts +12 -0
- package/dist/components/input-otp.d.ts.map +1 -0
- package/dist/components/input-otp.js +22 -0
- package/dist/components/input-otp.js.map +1 -0
- package/dist/components/input.d.ts +4 -0
- package/dist/components/input.d.ts.map +1 -0
- package/dist/components/input.js +9 -0
- package/dist/components/input.js.map +1 -0
- package/dist/components/item.d.ts +23 -0
- package/dist/components/item.d.ts.map +1 -0
- package/dist/components/item.js +80 -0
- package/dist/components/item.js.map +1 -0
- package/dist/components/kbd.d.ts +4 -0
- package/dist/components/kbd.d.ts.map +1 -0
- package/dist/components/kbd.js +10 -0
- package/dist/components/kbd.js.map +1 -0
- package/dist/components/label.d.ts +4 -0
- package/dist/components/label.d.ts.map +1 -0
- package/dist/components/label.js +9 -0
- package/dist/components/label.js.map +1 -0
- package/dist/components/marker.d.ts +11 -0
- package/dist/components/marker.d.ts.map +1 -0
- package/dist/components/marker.js +36 -0
- package/dist/components/marker.js.map +1 -0
- package/dist/components/menubar.d.ts +30 -0
- package/dist/components/menubar.d.ts.map +1 -0
- package/dist/components/menubar.js +58 -0
- package/dist/components/menubar.js.map +1 -0
- package/dist/components/message-scroller.d.ts +11 -0
- package/dist/components/message-scroller.d.ts.map +1 -0
- package/dist/components/message-scroller.js +27 -0
- package/dist/components/message-scroller.js.map +1 -0
- package/dist/components/message.d.ts +11 -0
- package/dist/components/message.d.ts.map +1 -0
- package/dist/components/message.js +23 -0
- package/dist/components/message.js.map +1 -0
- package/dist/components/native-select.d.ts +9 -0
- package/dist/components/native-select.d.ts.map +1 -0
- package/dist/components/native-select.js +15 -0
- package/dist/components/native-select.js.map +1 -0
- package/dist/components/navigation-menu.d.ts +12 -0
- package/dist/components/navigation-menu.d.ts.map +1 -0
- package/dist/components/navigation-menu.js +32 -0
- package/dist/components/navigation-menu.js.map +1 -0
- package/dist/components/pagination.d.ts +18 -0
- package/dist/components/pagination.d.ts.map +1 -0
- package/dist/components/pagination.js +28 -0
- package/dist/components/pagination.js.map +1 -0
- package/dist/components/popover.d.ts +10 -0
- package/dist/components/popover.d.ts.map +1 -0
- package/dist/components/popover.js +25 -0
- package/dist/components/popover.js.map +1 -0
- package/dist/components/progress.d.ts +8 -0
- package/dist/components/progress.d.ts.map +1 -0
- package/dist/components/progress.js +21 -0
- package/dist/components/progress.js.map +1 -0
- package/dist/components/questionnaire.d.ts +20 -0
- package/dist/components/questionnaire.d.ts.map +1 -0
- package/dist/components/questionnaire.js +54 -0
- package/dist/components/questionnaire.js.map +1 -0
- package/dist/components/radio-group.d.ts +6 -0
- package/dist/components/radio-group.d.ts.map +1 -0
- package/dist/components/radio-group.js +13 -0
- package/dist/components/radio-group.js.map +1 -0
- package/dist/components/resizable.d.ts +8 -0
- package/dist/components/resizable.d.ts.map +1 -0
- package/dist/components/resizable.js +15 -0
- package/dist/components/resizable.js.map +1 -0
- package/dist/components/scroll-area.d.ts +6 -0
- package/dist/components/scroll-area.d.ts.map +1 -0
- package/dist/components/scroll-area.js +13 -0
- package/dist/components/scroll-area.js.map +1 -0
- package/dist/components/select.d.ts +16 -0
- package/dist/components/select.d.ts.map +1 -0
- package/dist/components/select.js +36 -0
- package/dist/components/select.js.map +1 -0
- package/dist/components/separator.d.ts +4 -0
- package/dist/components/separator.d.ts.map +1 -0
- package/dist/components/separator.js +9 -0
- package/dist/components/separator.js.map +1 -0
- package/dist/components/sheet.d.ts +15 -0
- package/dist/components/sheet.d.ts.map +1 -0
- package/dist/components/sheet.js +39 -0
- package/dist/components/sheet.js.map +1 -0
- package/dist/components/sidebar.d.ts +64 -0
- package/dist/components/sidebar.d.ts.map +1 -0
- package/dist/components/sidebar.js +257 -0
- package/dist/components/sidebar.js.map +1 -0
- package/dist/components/skeleton.d.ts +3 -0
- package/dist/components/skeleton.d.ts.map +1 -0
- package/dist/components/skeleton.js +7 -0
- package/dist/components/skeleton.js.map +1 -0
- package/dist/components/slider.d.ts +4 -0
- package/dist/components/slider.d.ts.map +1 -0
- package/dist/components/slider.js +13 -0
- package/dist/components/slider.js.map +1 -0
- package/dist/components/spinner.d.ts +3 -0
- package/dist/components/spinner.d.ts.map +1 -0
- package/dist/components/spinner.js +8 -0
- package/dist/components/spinner.js.map +1 -0
- package/dist/components/switch.d.ts +6 -0
- package/dist/components/switch.d.ts.map +1 -0
- package/dist/components/switch.js +9 -0
- package/dist/components/switch.js.map +1 -0
- package/dist/components/table.d.ts +11 -0
- package/dist/components/table.d.ts.map +1 -0
- package/dist/components/table.js +30 -0
- package/dist/components/table.js.map +1 -0
- package/dist/components/tabs.d.ts +11 -0
- package/dist/components/tabs.d.ts.map +1 -0
- package/dist/components/tabs.js +30 -0
- package/dist/components/tabs.js.map +1 -0
- package/dist/components/textarea.d.ts +4 -0
- package/dist/components/textarea.d.ts.map +1 -0
- package/dist/components/textarea.js +8 -0
- package/dist/components/textarea.js.map +1 -0
- package/dist/components/toast.d.ts +17 -0
- package/dist/components/toast.d.ts.map +1 -0
- package/dist/components/toast.js +68 -0
- package/dist/components/toast.js.map +1 -0
- package/dist/components/toggle-group.d.ts +12 -0
- package/dist/components/toggle-group.d.ts.map +1 -0
- package/dist/components/toggle-group.js +26 -0
- package/dist/components/toggle-group.js.map +1 -0
- package/dist/components/toggle.d.ts +9 -0
- package/dist/components/toggle.d.ts.map +1 -0
- package/dist/components/toggle.js +27 -0
- package/dist/components/toggle.js.map +1 -0
- package/dist/components/tooltip.d.ts +7 -0
- package/dist/components/tooltip.d.ts.map +1 -0
- package/dist/components/tooltip.js +18 -0
- package/dist/components/tooltip.js.map +1 -0
- package/dist/components/trace.d.ts +19 -0
- package/dist/components/trace.d.ts.map +1 -0
- package/dist/components/trace.js +31 -0
- package/dist/components/trace.js.map +1 -0
- package/dist/hooks/use-highlighted-code.d.ts +3 -0
- package/dist/hooks/use-highlighted-code.d.ts.map +1 -0
- package/dist/hooks/use-highlighted-code.js +50 -0
- package/dist/hooks/use-highlighted-code.js.map +1 -0
- package/dist/hooks/use-mobile.d.ts +2 -0
- package/dist/hooks/use-mobile.d.ts.map +1 -0
- package/dist/hooks/use-mobile.js +16 -0
- package/dist/hooks/use-mobile.js.map +1 -0
- package/dist/index.d.ts +66 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +66 -0
- package/dist/index.js.map +1 -0
- package/dist/lib/highlighter.d.ts +10 -0
- package/dist/lib/highlighter.d.ts.map +1 -0
- package/dist/lib/highlighter.js +92 -0
- package/dist/lib/highlighter.js.map +1 -0
- package/dist/lib/utils.d.ts +2 -0
- package/dist/lib/utils.d.ts.map +1 -0
- package/dist/lib/utils.js +2 -0
- package/dist/lib/utils.js.map +1 -0
- package/package.json +85 -4
- package/styles.css +29 -0
- package/theme.css +772 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 ezzabuzaid
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
|
22
|
+
|
|
23
|
+
---
|
|
24
|
+
|
|
25
|
+
The components, hooks, lib files and theme.css in this package are generated
|
|
26
|
+
by the shadcn CLI from shadcn/ui, which carries this notice:
|
|
27
|
+
|
|
28
|
+
MIT License
|
|
29
|
+
|
|
30
|
+
Copyright (c) 2023 shadcn
|
|
31
|
+
|
|
32
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
33
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
34
|
+
in the Software without restriction, including without limitation the rights
|
|
35
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
36
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
37
|
+
furnished to do so, subject to the following conditions:
|
|
38
|
+
|
|
39
|
+
The above copyright notice and this permission notice shall be included in all
|
|
40
|
+
copies or substantial portions of the Software.
|
|
41
|
+
|
|
42
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
43
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
44
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
45
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
46
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
47
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
48
|
+
SOFTWARE.
|
package/README.md
CHANGED
|
@@ -1,3 +1,191 @@
|
|
|
1
|
-
#
|
|
1
|
+
# @zukhruf/shadcn
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Each [shadcn/ui](https://ui.shadcn.com) component, as one package. The components use Base UI as their headless library and nova as their preset. An app imports the components from one entry and the styles from one stylesheet. The app sets its theme with CSS variables.
|
|
4
|
+
|
|
5
|
+
The words in these documents have one meaning each. See the glossary in [CONTEXT.md](./CONTEXT.md).
|
|
6
|
+
|
|
7
|
+
## The problem
|
|
8
|
+
|
|
9
|
+
shadcn/ui is not a package. Its CLI copies the source of each component into the repo of the app. Thus each app keeps its own copy, and the copies drift apart. A fix in one copy does not go into the other copies. For example, two apps each wrote the same fix for a tall dialog, and other apps still do not have it. Also, `shadcn add --overwrite` writes over a copy, and it removes the changes that an app made by hand.
|
|
10
|
+
|
|
11
|
+
This package keeps one copy. A fix goes into the package one time, and each app gets it with the next version.
|
|
12
|
+
|
|
13
|
+
## Install
|
|
14
|
+
|
|
15
|
+
```sh
|
|
16
|
+
npm i @zukhruf/shadcn
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
The peer dependencies are `react` 19, `react-dom` 19 and `tailwindcss` 4. The other dependencies, for example `@base-ui/react` and `lucide-react`, install with the package.
|
|
20
|
+
|
|
21
|
+
## Use it
|
|
22
|
+
|
|
23
|
+
Import the stylesheet in the Tailwind CSS file of the app, after Tailwind:
|
|
24
|
+
|
|
25
|
+
```css
|
|
26
|
+
@import 'tailwindcss';
|
|
27
|
+
@import '@zukhruf/shadcn/styles.css';
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
Import the components from the entry:
|
|
31
|
+
|
|
32
|
+
```tsx
|
|
33
|
+
import { Button, Dialog, DialogContent } from '@zukhruf/shadcn';
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
Obey two rules:
|
|
37
|
+
|
|
38
|
+
- **Use a plain `@import`.** Do not write `@import '@zukhruf/shadcn/styles.css' layer(components);`. A `layer()` puts all of the stylesheet into a layer, also its `@utility` and `@source` rules. Tailwind CSS refuses these rules in a layer. The build stops with the error "`@utility` cannot be nested."
|
|
39
|
+
- **Do not add an `@source` for the package.** The stylesheet registers its own `dist` folder. Tailwind CSS then finds the classes of the components. See [ADR 0003](./docs/adr/0003-the-stylesheet-registers-its-own-source-and-keeps-its-patches-in-layers.md).
|
|
40
|
+
|
|
41
|
+
## Theme
|
|
42
|
+
|
|
43
|
+
The theme is the values of a set of CSS variables, for example `--primary`, `--background` and `--radius`. To change the theme, set the variables after the import:
|
|
44
|
+
|
|
45
|
+
```css
|
|
46
|
+
@import 'tailwindcss';
|
|
47
|
+
@import '@zukhruf/shadcn/styles.css';
|
|
48
|
+
|
|
49
|
+
:root {
|
|
50
|
+
--primary: oklch(0.55 0.2 260);
|
|
51
|
+
--radius: 0.5rem;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.dark {
|
|
55
|
+
--primary: oklch(0.7 0.15 260);
|
|
56
|
+
}
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
- Write these rules outside of a layer. The package sets the variables outside of a layer, and a rule in a layer loses to them.
|
|
60
|
+
- The `.dark` class switches to the dark theme. Put it on an element, usually `<html>`. The element and all elements in it then use the `.dark` variables.
|
|
61
|
+
|
|
62
|
+
The preset is fixed. The class strings of each component contain the preset, for example the rounded corners and the spacing of the dialog. Thus an app cannot change the preset. An app changes only the theme. See [ADR 0004](./docs/adr/0004-the-components-use-base-ui-and-the-nova-preset.md).
|
|
63
|
+
|
|
64
|
+
## Composition
|
|
65
|
+
|
|
66
|
+
Base UI uses the `render` prop where Radix UI uses `asChild`. The `render` prop sets the element that the component renders.
|
|
67
|
+
|
|
68
|
+
Radix UI:
|
|
69
|
+
|
|
70
|
+
```tsx
|
|
71
|
+
<DialogTrigger asChild>
|
|
72
|
+
<Button variant="outline">Open</Button>
|
|
73
|
+
</DialogTrigger>
|
|
74
|
+
```
|
|
75
|
+
|
|
76
|
+
Base UI:
|
|
77
|
+
|
|
78
|
+
```tsx
|
|
79
|
+
<DialogTrigger render={<Button variant="outline" />}>Open</DialogTrigger>
|
|
80
|
+
```
|
|
81
|
+
|
|
82
|
+
## What the stylesheet adds to stock shadcn/ui
|
|
83
|
+
|
|
84
|
+
The stylesheet has three patches:
|
|
85
|
+
|
|
86
|
+
- **A pointer cursor on enabled buttons.** In Tailwind CSS 4, a button has the default cursor of the browser, not the pointer. The upgrade guide of Tailwind CSS gives a rule that sets the pointer again. The patch is that rule, in `@layer base`.
|
|
87
|
+
- **A cap on the height of a dialog.** A dialog is never taller than the window minus `2rem`, and it scrolls when its content is taller. Thus the buttons at the bottom of a tall dialog stay on the screen. The rule is `max-height: calc(100dvh - 2rem); overflow-y: auto` on `[data-slot="dialog-content"]`. The patch is in `@layer components`.
|
|
88
|
+
- **The width of the mobile sidebar.** On a small screen, the sidebar is in a `Sheet`. The class `data-[side=left]:w-3/4` of the `Sheet` wins over the class `w-(--sidebar-width)` of the sidebar. Thus the sidebar was 3/4 of the window: 292.5px, not 288px, in a window of 390px. The patch sets `width: var(--sidebar-width)` on `[data-slot="sidebar"][data-mobile="true"][data-side]`.
|
|
89
|
+
|
|
90
|
+
The cursor and the cap are in layers before `utilities`. Thus a utility class of the app, for example `cursor-wait` or `max-h-none`, still changes them.
|
|
91
|
+
|
|
92
|
+
The width patch is in `@layer utilities`, because only a rule in that layer wins over a utility class. Its selector has three attributes, so it wins over the two parts of `data-[side=left]:w-3/4`. The sidebar does not give its `className` to the mobile `Sheet`, so a utility class of the app cannot get to that element. To change the mobile width, write a rule outside of a layer.
|
|
93
|
+
|
|
94
|
+
## Links that look like buttons
|
|
95
|
+
|
|
96
|
+
A control that goes to a different page must stay a link. Do not write `<Button render={<Link />} nativeButton={false}>`. This makes an `<a>` with `role="button"`. A screen reader then calls the link a button, and the Space key activates it.
|
|
97
|
+
|
|
98
|
+
Put the classes of the button on the link:
|
|
99
|
+
|
|
100
|
+
```tsx
|
|
101
|
+
import { cn } from 'cn';
|
|
102
|
+
|
|
103
|
+
import { buttonVariants } from '@zukhruf/shadcn';
|
|
104
|
+
|
|
105
|
+
<Link
|
|
106
|
+
href="/settings"
|
|
107
|
+
className={cn(buttonVariants({ variant: 'outline', size: 'sm' }))}
|
|
108
|
+
>
|
|
109
|
+
Settings
|
|
110
|
+
</Link>;
|
|
111
|
+
```
|
|
112
|
+
|
|
113
|
+
Use `cn` around `buttonVariants`. `Button` merges the classes that conflict through `cn`, which uses tailwind-merge. Without `cn`, the classes that conflict stay on the link, and the link looks different from a button. In one app, the link had a radius of 10px, not 8px, and it was 2px wider than the button.
|
|
114
|
+
|
|
115
|
+
## Your own components
|
|
116
|
+
|
|
117
|
+
An app that writes its own components often needs `cn`, the function that joins class names. Import it from the `cn` package:
|
|
118
|
+
|
|
119
|
+
```tsx
|
|
120
|
+
import { cn } from 'cn';
|
|
121
|
+
```
|
|
122
|
+
|
|
123
|
+
This package does not export `cn`. Each symbol has one home ([zukhruf ADR 0001](../../docs/adr/0001-zukhruf-is-a-layered-standard-library.md), rule 6).
|
|
124
|
+
|
|
125
|
+
## One entry
|
|
126
|
+
|
|
127
|
+
The package has one entry, `@zukhruf/shadcn`. It exports all components and hooks. There are no subpaths such as `@zukhruf/shadcn/button`.
|
|
128
|
+
|
|
129
|
+
- A development server and plain Node.js load all components and their dependencies.
|
|
130
|
+
- A production bundle has only the components that the app uses. The `sideEffects` field of `package.json` lets the bundler remove the others.
|
|
131
|
+
- The bundler resolves each import of the entry before it removes code. Thus the app needs the peers of all dependencies, also when it does not use the component. The package lists `react-is`, a peer of `recharts`, as its own dependency. Then an app builds also when npm does not install peers, for example with `legacy-peer-deps=true`.
|
|
132
|
+
- The stylesheet gives the classes of all components, also of the components that the app does not use. An app that uses only `Button` and `Dialog` got 212 kB of CSS (31 kB with gzip) on 2026-10-15.
|
|
133
|
+
|
|
134
|
+
See [ADR 0002](./docs/adr/0002-one-entry-and-private-imports-between-the-components.md).
|
|
135
|
+
|
|
136
|
+
## Documentation
|
|
137
|
+
|
|
138
|
+
**Decisions**: the [architecture decision records](./docs/adr) tell why the design is as it is.
|
|
139
|
+
|
|
140
|
+
1. [The shadcn CLI writes the source, and the commit pins it](./docs/adr/0001-the-shadcn-cli-writes-the-source-and-the-commit-pins-it.md)
|
|
141
|
+
2. [One entry, and private imports between the components](./docs/adr/0002-one-entry-and-private-imports-between-the-components.md)
|
|
142
|
+
3. [The stylesheet registers its own source and keeps its patches in layers](./docs/adr/0003-the-stylesheet-registers-its-own-source-and-keeps-its-patches-in-layers.md)
|
|
143
|
+
4. [The components use Base UI and the nova preset](./docs/adr/0004-the-components-use-base-ui-and-the-nova-preset.md)
|
|
144
|
+
|
|
145
|
+
## Development
|
|
146
|
+
|
|
147
|
+
This package is part of the [zukhruf](../../README.md) workspace. Run the commands from the workspace root.
|
|
148
|
+
|
|
149
|
+
```sh
|
|
150
|
+
npm install
|
|
151
|
+
npx nx run shadcn:sync # writes the generated source again with the shadcn CLI
|
|
152
|
+
npx nx run shadcn:test # builds, then runs the tests
|
|
153
|
+
npx nx run shadcn:typecheck # formats, lints, then type checks
|
|
154
|
+
npx nx run shadcn:build # compiles src/ to dist/
|
|
155
|
+
```
|
|
156
|
+
|
|
157
|
+
```
|
|
158
|
+
src/
|
|
159
|
+
components/ generated: one file for each component
|
|
160
|
+
hooks/ generated: the hooks that the components use
|
|
161
|
+
lib/ generated: the helpers that the components use
|
|
162
|
+
index.ts generated: the entry
|
|
163
|
+
theme.css generated: the CSS variables, the variants and the ejected shadcn CSS
|
|
164
|
+
styles.css written by hand: imports theme.css, registers dist, holds the patches
|
|
165
|
+
components.json the configuration of the shadcn CLI
|
|
166
|
+
```
|
|
167
|
+
|
|
168
|
+
### The generated source
|
|
169
|
+
|
|
170
|
+
The shadcn CLI writes `src/components`, `src/hooks`, `src/lib`, `src/index.ts` and `theme.css`. Do not edit these files. The next sync writes over them, and the edit is lost. See [ADR 0001](./docs/adr/0001-the-shadcn-cli-writes-the-source-and-the-commit-pins-it.md).
|
|
171
|
+
|
|
172
|
+
- The lint rules and the TypeScript flags that the stock code fails are off. These exceptions apply only to the generated source.
|
|
173
|
+
- To change what a component does, add a patch to `styles.css`, in a layer.
|
|
174
|
+
|
|
175
|
+
### Sync
|
|
176
|
+
|
|
177
|
+
`nx run shadcn:sync` writes the generated source again. It uses `shadcn@4.21.5` and the live registry of shadcn/ui. The registry has no versions, so a sync on a different day can write different source. Read the diff before a commit.
|
|
178
|
+
|
|
179
|
+
The sync does these steps, in this order:
|
|
180
|
+
|
|
181
|
+
1. It resets `theme.css` to one line: `@import "tw-animate-css";`.
|
|
182
|
+
2. It runs `shadcn add index`, then `shadcn add --all`.
|
|
183
|
+
3. It runs `shadcn eject`. This step runs the CLI through `node`, because `npx` cannot find the `shadcn` package that npm hoisted to the workspace root.
|
|
184
|
+
4. It writes `src/index.ts`: one `export *` line for each component and each hook.
|
|
185
|
+
5. It formats the generated source with Prettier.
|
|
186
|
+
|
|
187
|
+
Known facts about the sync:
|
|
188
|
+
|
|
189
|
+
- The ejected CSS comes from the newest `shadcn` package, not always from 4.21.5. The first lines of `theme.css` record its version.
|
|
190
|
+
- `src` does not import `date-fns`, but `date-fns` stays a dependency. The `calendar` item of the registry declares it.
|
|
191
|
+
- One sync in four failed one time, and the cause is not known. A second run passed.
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Accordion as AccordionPrimitive } from '@base-ui/react/accordion';
|
|
2
|
+
declare function Accordion({ className, ...props }: AccordionPrimitive.Root.Props): import("react").JSX.Element;
|
|
3
|
+
declare function AccordionItem({ className, ...props }: AccordionPrimitive.Item.Props): import("react").JSX.Element;
|
|
4
|
+
declare function AccordionTrigger({ className, children, ...props }: AccordionPrimitive.Trigger.Props): import("react").JSX.Element;
|
|
5
|
+
declare function AccordionContent({ className, children, ...props }: AccordionPrimitive.Panel.Props): import("react").JSX.Element;
|
|
6
|
+
export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
|
|
7
|
+
//# sourceMappingURL=accordion.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../src/components/accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,IAAI,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAI3E,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,CAAC,IAAI,CAAC,KAAK,+BAQxE;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,CAAC,IAAI,CAAC,KAAK,+BAQ5E;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,kBAAkB,CAAC,OAAO,CAAC,KAAK,+BAuBlC;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,kBAAkB,CAAC,KAAK,CAAC,KAAK,+BAiBhC;AAED,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Accordion as AccordionPrimitive } from '@base-ui/react/accordion';
|
|
3
|
+
import { cn } from 'cn';
|
|
4
|
+
import { ChevronDownIcon, ChevronUpIcon } from 'lucide-react';
|
|
5
|
+
function Accordion({ className, ...props }) {
|
|
6
|
+
return (_jsx(AccordionPrimitive.Root, { "data-slot": "accordion", className: cn('flex w-full flex-col', className), ...props }));
|
|
7
|
+
}
|
|
8
|
+
function AccordionItem({ className, ...props }) {
|
|
9
|
+
return (_jsx(AccordionPrimitive.Item, { "data-slot": "accordion-item", className: cn('not-last:border-b', className), ...props }));
|
|
10
|
+
}
|
|
11
|
+
function AccordionTrigger({ className, children, ...props }) {
|
|
12
|
+
return (_jsx(AccordionPrimitive.Header, { className: "flex", children: _jsxs(AccordionPrimitive.Trigger, { "data-slot": "accordion-trigger", className: cn('group/accordion-trigger relative flex flex-1 items-start justify-between rounded-lg border border-transparent py-2.5 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground', className), ...props, children: [children, _jsx(ChevronDownIcon, { "data-slot": "accordion-trigger-icon", className: "pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden" }), _jsx(ChevronUpIcon, { "data-slot": "accordion-trigger-icon", className: "pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline" })] }) }));
|
|
13
|
+
}
|
|
14
|
+
function AccordionContent({ className, children, ...props }) {
|
|
15
|
+
return (_jsx(AccordionPrimitive.Panel, { "data-slot": "accordion-content", className: "overflow-hidden text-sm data-open:animate-accordion-down data-closed:animate-accordion-up", ...props, children: _jsx("div", { className: cn('h-(--accordion-panel-height) pt-0 pb-2.5 data-ending-style:h-0 data-starting-style:h-0 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4', className), children: children }) }));
|
|
16
|
+
}
|
|
17
|
+
export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
|
|
18
|
+
//# sourceMappingURL=accordion.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion.js","sourceRoot":"","sources":["../../src/components/accordion.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,IAAI,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAC3E,OAAO,EAAE,EAAE,EAAE,MAAM,IAAI,CAAC;AACxB,OAAO,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE9D,SAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAiC;IACvE,OAAO,CACL,KAAC,kBAAkB,CAAC,IAAI,iBACZ,WAAW,EACrB,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,KAC5C,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAiC;IAC3E,OAAO,CACL,KAAC,kBAAkB,CAAC,IAAI,iBACZ,gBAAgB,EAC1B,SAAS,EAAE,EAAE,CAAC,mBAAmB,EAAE,SAAS,CAAC,KACzC,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACyB;IACjC,OAAO,CACL,KAAC,kBAAkB,CAAC,MAAM,IAAC,SAAS,EAAC,MAAM,YACzC,MAAC,kBAAkB,CAAC,OAAO,iBACf,mBAAmB,EAC7B,SAAS,EAAE,EAAE,CACX,4fAA4f,EAC5f,SAAS,CACV,KACG,KAAK,aAER,QAAQ,EACT,KAAC,eAAe,iBACJ,wBAAwB,EAClC,SAAS,EAAC,2EAA2E,GACrF,EACF,KAAC,aAAa,iBACF,wBAAwB,EAClC,SAAS,EAAC,kFAAkF,GAC5F,IACyB,GACH,CAC7B,CAAC;AACJ,CAAC;AAED,SAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACuB;IAC/B,OAAO,CACL,KAAC,kBAAkB,CAAC,KAAK,iBACb,mBAAmB,EAC7B,SAAS,EAAC,2FAA2F,KACjG,KAAK,YAET,cACE,SAAS,EAAE,EAAE,CACX,yLAAyL,EACzL,SAAS,CACV,YAEA,QAAQ,GACL,GACmB,CAC5B,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { Button } from '#components/button';
|
|
2
|
+
import { AlertDialog as AlertDialogPrimitive } from '@base-ui/react/alert-dialog';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
declare function AlertDialog({ ...props }: AlertDialogPrimitive.Root.Props): React.JSX.Element;
|
|
5
|
+
declare function AlertDialogTrigger({ ...props }: AlertDialogPrimitive.Trigger.Props): React.JSX.Element;
|
|
6
|
+
declare function AlertDialogPortal({ ...props }: AlertDialogPrimitive.Portal.Props): React.JSX.Element;
|
|
7
|
+
declare function AlertDialogOverlay({ className, ...props }: AlertDialogPrimitive.Backdrop.Props): React.JSX.Element;
|
|
8
|
+
declare function AlertDialogContent({ className, size, ...props }: AlertDialogPrimitive.Popup.Props & {
|
|
9
|
+
size?: 'default' | 'sm';
|
|
10
|
+
}): React.JSX.Element;
|
|
11
|
+
declare function AlertDialogHeader({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
12
|
+
declare function AlertDialogFooter({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
13
|
+
declare function AlertDialogMedia({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
14
|
+
declare function AlertDialogTitle({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Title>): React.JSX.Element;
|
|
15
|
+
declare function AlertDialogDescription({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Description>): React.JSX.Element;
|
|
16
|
+
declare function AlertDialogAction({ className, ...props }: React.ComponentProps<typeof Button>): React.JSX.Element;
|
|
17
|
+
declare function AlertDialogCancel({ className, variant, size, ...props }: AlertDialogPrimitive.Close.Props & Pick<React.ComponentProps<typeof Button>, 'variant' | 'size'>): React.JSX.Element;
|
|
18
|
+
export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, };
|
|
19
|
+
//# sourceMappingURL=alert-dialog.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../src/components/alert-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAC5C,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAElF,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,iBAAS,WAAW,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,CAAC,IAAI,CAAC,KAAK,qBAEjE;AAED,iBAAS,kBAAkB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,CAAC,OAAO,CAAC,KAAK,qBAI3E;AAED,iBAAS,iBAAiB,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,CAAC,MAAM,CAAC,KAAK,qBAIzE;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,QAAQ,CAAC,KAAK,qBAWrC;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,KAAK,CAAC,KAAK,GAAG;IACpC,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;CACzB,qBAeA;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW7B;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW7B;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW7B;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,KAAK,CAAC,qBAWzD;AAED,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,WAAW,CAAC,qBAW/D;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,qBAQrC;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,KAAK,CAAC,KAAK,GACjC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC,qBAS9D;AAED,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,sBAAsB,EACtB,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,GACnB,CAAC"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { Button } from '#components/button';
|
|
4
|
+
import { AlertDialog as AlertDialogPrimitive } from '@base-ui/react/alert-dialog';
|
|
5
|
+
import { cn } from 'cn';
|
|
6
|
+
import * as React from 'react';
|
|
7
|
+
function AlertDialog({ ...props }) {
|
|
8
|
+
return _jsx(AlertDialogPrimitive.Root, { "data-slot": "alert-dialog", ...props });
|
|
9
|
+
}
|
|
10
|
+
function AlertDialogTrigger({ ...props }) {
|
|
11
|
+
return (_jsx(AlertDialogPrimitive.Trigger, { "data-slot": "alert-dialog-trigger", ...props }));
|
|
12
|
+
}
|
|
13
|
+
function AlertDialogPortal({ ...props }) {
|
|
14
|
+
return (_jsx(AlertDialogPrimitive.Portal, { "data-slot": "alert-dialog-portal", ...props }));
|
|
15
|
+
}
|
|
16
|
+
function AlertDialogOverlay({ className, ...props }) {
|
|
17
|
+
return (_jsx(AlertDialogPrimitive.Backdrop, { "data-slot": "alert-dialog-overlay", className: cn('fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0', className), ...props }));
|
|
18
|
+
}
|
|
19
|
+
function AlertDialogContent({ className, size = 'default', ...props }) {
|
|
20
|
+
return (_jsxs(AlertDialogPortal, { children: [_jsx(AlertDialogOverlay, {}), _jsx(AlertDialogPrimitive.Popup, { "data-slot": "alert-dialog-content", "data-size": size, className: cn('group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95', className), ...props })] }));
|
|
21
|
+
}
|
|
22
|
+
function AlertDialogHeader({ className, ...props }) {
|
|
23
|
+
return (_jsx("div", { "data-slot": "alert-dialog-header", className: cn('grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]', className), ...props }));
|
|
24
|
+
}
|
|
25
|
+
function AlertDialogFooter({ className, ...props }) {
|
|
26
|
+
return (_jsx("div", { "data-slot": "alert-dialog-footer", className: cn('-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end', className), ...props }));
|
|
27
|
+
}
|
|
28
|
+
function AlertDialogMedia({ className, ...props }) {
|
|
29
|
+
return (_jsx("div", { "data-slot": "alert-dialog-media", className: cn("mb-2 inline-flex size-10 items-center justify-center rounded-md bg-muted sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6", className), ...props }));
|
|
30
|
+
}
|
|
31
|
+
function AlertDialogTitle({ className, ...props }) {
|
|
32
|
+
return (_jsx(AlertDialogPrimitive.Title, { "data-slot": "alert-dialog-title", className: cn('text-base font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2', className), ...props }));
|
|
33
|
+
}
|
|
34
|
+
function AlertDialogDescription({ className, ...props }) {
|
|
35
|
+
return (_jsx(AlertDialogPrimitive.Description, { "data-slot": "alert-dialog-description", className: cn('text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground', className), ...props }));
|
|
36
|
+
}
|
|
37
|
+
function AlertDialogAction({ className, ...props }) {
|
|
38
|
+
return (_jsx(Button, { "data-slot": "alert-dialog-action", className: cn(className), ...props }));
|
|
39
|
+
}
|
|
40
|
+
function AlertDialogCancel({ className, variant = 'outline', size = 'default', ...props }) {
|
|
41
|
+
return (_jsx(AlertDialogPrimitive.Close, { "data-slot": "alert-dialog-cancel", className: cn(className), render: _jsx(Button, { variant: variant, size: size }), ...props }));
|
|
42
|
+
}
|
|
43
|
+
export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, };
|
|
44
|
+
//# sourceMappingURL=alert-dialog.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert-dialog.js","sourceRoot":"","sources":["../../src/components/alert-dialog.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
declare const alertVariants: (props?: ({
|
|
4
|
+
variant?: "default" | "destructive" | null | undefined;
|
|
5
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
6
|
+
declare function Alert({ className, variant, ...props }: React.ComponentProps<'div'> & VariantProps<typeof alertVariants>): React.JSX.Element;
|
|
7
|
+
declare function AlertTitle({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
8
|
+
declare function AlertDescription({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
9
|
+
declare function AlertAction({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
10
|
+
export { Alert, AlertTitle, AlertDescription, AlertAction };
|
|
11
|
+
//# sourceMappingURL=alert.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../src/components/alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAC;AAElE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,QAAA,MAAM,aAAa;;8EAclB,CAAC;AAEF,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,OAAO,EACP,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,qBASlE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWvE;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW7B;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQxE;AAED,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,WAAW,EAAE,CAAC"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { cva } from 'class-variance-authority';
|
|
3
|
+
import { cn } from 'cn';
|
|
4
|
+
import * as React from 'react';
|
|
5
|
+
const alertVariants = cva("group/alert relative grid w-full gap-0.5 rounded-lg border px-2.5 py-2 text-left text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pr-18 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2 *:[svg]:row-span-2 *:[svg]:translate-y-0.5 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4", {
|
|
6
|
+
variants: {
|
|
7
|
+
variant: {
|
|
8
|
+
default: 'bg-card text-card-foreground',
|
|
9
|
+
destructive: 'bg-card text-destructive *:data-[slot=alert-description]:text-destructive/90 *:[svg]:text-current',
|
|
10
|
+
},
|
|
11
|
+
},
|
|
12
|
+
defaultVariants: {
|
|
13
|
+
variant: 'default',
|
|
14
|
+
},
|
|
15
|
+
});
|
|
16
|
+
function Alert({ className, variant, ...props }) {
|
|
17
|
+
return (_jsx("div", { "data-slot": "alert", role: "alert", className: cn(alertVariants({ variant }), className), ...props }));
|
|
18
|
+
}
|
|
19
|
+
function AlertTitle({ className, ...props }) {
|
|
20
|
+
return (_jsx("div", { "data-slot": "alert-title", className: cn('font-medium group-has-[>svg]/alert:col-start-2 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground', className), ...props }));
|
|
21
|
+
}
|
|
22
|
+
function AlertDescription({ className, ...props }) {
|
|
23
|
+
return (_jsx("div", { "data-slot": "alert-description", className: cn('text-sm text-balance text-muted-foreground md:text-pretty [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4', className), ...props }));
|
|
24
|
+
}
|
|
25
|
+
function AlertAction({ className, ...props }) {
|
|
26
|
+
return (_jsx("div", { "data-slot": "alert-action", className: cn('absolute top-2 right-2', className), ...props }));
|
|
27
|
+
}
|
|
28
|
+
export { Alert, AlertTitle, AlertDescription, AlertAction };
|
|
29
|
+
//# sourceMappingURL=alert.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert.js","sourceRoot":"","sources":["../../src/components/alert.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,EAAE,EAAE,MAAM,IAAI,CAAC;AACxB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,aAAa,GAAG,GAAG,CACvB,2TAA2T,EAC3T;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,8BAA8B;YACvC,WAAW,EACT,mGAAmG;SACtG;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;KACnB;CACF,CACF,CAAC;AAEF,SAAS,KAAK,CAAC,EACb,SAAS,EACT,OAAO,EACP,GAAG,KAAK,EACyD;IACjE,OAAO,CACL,2BACY,OAAO,EACjB,IAAI,EAAC,OAAO,EACZ,SAAS,EAAE,EAAE,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,CAAC,KAChD,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACtE,OAAO,CACL,2BACY,aAAa,EACvB,SAAS,EAAE,EAAE,CACX,qHAAqH,EACrH,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACoB;IAC5B,OAAO,CACL,2BACY,mBAAmB,EAC7B,SAAS,EAAE,EAAE,CACX,4JAA4J,EAC5J,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACvE,OAAO,CACL,2BACY,cAAc,EACxB,SAAS,EAAE,EAAE,CAAC,wBAAwB,EAAE,SAAS,CAAC,KAC9C,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,WAAW,EAAE,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"aspect-ratio.d.ts","sourceRoot":"","sources":["../../src/components/aspect-ratio.tsx"],"names":[],"mappings":"AAEA,iBAAS,WAAW,CAAC,EACnB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,+BAajD;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { cn } from 'cn';
|
|
3
|
+
function AspectRatio({ ratio, className, ...props }) {
|
|
4
|
+
return (_jsx("div", { "data-slot": "aspect-ratio", style: {
|
|
5
|
+
'--ratio': ratio,
|
|
6
|
+
}, className: cn('relative aspect-(--ratio)', className), ...props }));
|
|
7
|
+
}
|
|
8
|
+
export { AspectRatio };
|
|
9
|
+
//# sourceMappingURL=aspect-ratio.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"aspect-ratio.js","sourceRoot":"","sources":["../../src/components/aspect-ratio.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,IAAI,CAAC;AAExB,SAAS,WAAW,CAAC,EACnB,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACwC;IAChD,OAAO,CACL,2BACY,cAAc,EACxB,KAAK,EACH;YACE,SAAS,EAAE,KAAK;SACM,EAE1B,SAAS,EAAE,EAAE,CAAC,2BAA2B,EAAE,SAAS,CAAC,KACjD,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { Button } from '#components/button';
|
|
2
|
+
import { useRender } from '@base-ui/react/use-render';
|
|
3
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
4
|
+
import * as React from 'react';
|
|
5
|
+
declare const attachmentVariants: (props?: ({
|
|
6
|
+
size?: "default" | "xs" | "sm" | null | undefined;
|
|
7
|
+
orientation?: "horizontal" | "vertical" | null | undefined;
|
|
8
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
9
|
+
declare function Attachment({ className, state, size, orientation, ...props }: React.ComponentProps<'div'> & VariantProps<typeof attachmentVariants> & {
|
|
10
|
+
state?: 'idle' | 'uploading' | 'processing' | 'error' | 'done';
|
|
11
|
+
}): React.JSX.Element;
|
|
12
|
+
declare const attachmentMediaVariants: (props?: ({
|
|
13
|
+
variant?: "image" | "icon" | null | undefined;
|
|
14
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
15
|
+
declare function AttachmentMedia({ className, variant, ...props }: React.ComponentProps<'div'> & VariantProps<typeof attachmentMediaVariants>): React.JSX.Element;
|
|
16
|
+
declare function AttachmentContent({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
17
|
+
declare function AttachmentTitle({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
|
|
18
|
+
declare function AttachmentDescription({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
|
|
19
|
+
declare function AttachmentActions({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
20
|
+
declare function AttachmentAction({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): React.JSX.Element;
|
|
21
|
+
declare function AttachmentTrigger({ className, render, type, ...props }: useRender.ComponentProps<'button'>): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
|
|
22
|
+
declare function AttachmentGroup({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
23
|
+
export { Attachment, AttachmentGroup, AttachmentMedia, AttachmentContent, AttachmentTitle, AttachmentDescription, AttachmentActions, AttachmentAction, AttachmentTrigger, };
|
|
24
|
+
//# sourceMappingURL=attachment.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"attachment.d.ts","sourceRoot":"","sources":["../../src/components/attachment.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAE5C,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAC;AAElE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,QAAA,MAAM,kBAAkB;;;8EAgBvB,CAAC;AAEF,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,KAAc,EACd,IAAgB,EAChB,WAA0B,EAC1B,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAC5B,YAAY,CAAC,OAAO,kBAAkB,CAAC,GAAG;IACxC,KAAK,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,YAAY,GAAG,OAAO,GAAG,MAAM,CAAC;CAChE,qBAWF;AAED,QAAA,MAAM,uBAAuB;;8EAc5B,CAAC;AAEF,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,OAAgB,EAChB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,uBAAuB,CAAC,qBAS5E;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW7B;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,qBAW9B;AAED,iBAAS,qBAAqB,CAAC,EAC7B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,qBAY9B;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW7B;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,OAAO,EACP,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,qBAUrC;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,MAAM,EACN,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,cAAc,CAAC,QAAQ,CAAC,0EAepC;AAED,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW5E;AAED,OAAO,EACL,UAAU,EACV,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,eAAe,EACf,qBAAqB,EACrB,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,GAClB,CAAC"}
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { Button } from '#components/button';
|
|
3
|
+
import { mergeProps } from '@base-ui/react/merge-props';
|
|
4
|
+
import { useRender } from '@base-ui/react/use-render';
|
|
5
|
+
import { cva } from 'class-variance-authority';
|
|
6
|
+
import { cn } from 'cn';
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
const attachmentVariants = cva('group/attachment relative flex w-fit max-w-full min-w-0 shrink-0 flex-wrap rounded-xl border bg-card text-card-foreground transition-colors focus-within:ring-1 focus-within:ring-ring/50 has-[>a,>button]:hover:bg-muted/50 data-[state=error]:border-destructive/30 data-[state=idle]:border-dashed', {
|
|
9
|
+
variants: {
|
|
10
|
+
size: {
|
|
11
|
+
default: 'gap-2 text-sm has-data-[slot=attachment-content]:px-2.5 has-data-[slot=attachment-content]:py-2 has-data-[slot=attachment-media]:p-2',
|
|
12
|
+
sm: 'gap-2.5 text-xs has-data-[slot=attachment-content]:px-2 has-data-[slot=attachment-content]:py-1.5 has-data-[slot=attachment-media]:p-1.5',
|
|
13
|
+
xs: 'gap-1.5 rounded-lg text-xs has-data-[slot=attachment-content]:px-1.5 has-data-[slot=attachment-content]:py-1 has-data-[slot=attachment-media]:p-1',
|
|
14
|
+
},
|
|
15
|
+
orientation: {
|
|
16
|
+
horizontal: 'min-w-40 items-center',
|
|
17
|
+
vertical: 'w-24 flex-col has-data-[slot=attachment-content]:w-30',
|
|
18
|
+
},
|
|
19
|
+
},
|
|
20
|
+
});
|
|
21
|
+
function Attachment({ className, state = 'done', size = 'default', orientation = 'horizontal', ...props }) {
|
|
22
|
+
return (_jsx("div", { "data-slot": "attachment", "data-state": state, "data-size": size, "data-orientation": orientation, className: cn(attachmentVariants({ size, orientation }), className), ...props }));
|
|
23
|
+
}
|
|
24
|
+
const attachmentMediaVariants = cva("relative flex aspect-square w-10 shrink-0 items-center justify-center overflow-hidden rounded-lg bg-muted text-foreground group-data-[orientation=vertical]/attachment:w-full group-data-[size=sm]/attachment:w-8 group-data-[size=xs]/attachment:w-7 group-data-[size=xs]/attachment:rounded-md group-data-[state=error]/attachment:bg-destructive/10 group-data-[state=error]/attachment:text-destructive group-data-[orientation=vertical]/attachment:*:data-[slot=spinner]:size-6! [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 group-data-[orientation=vertical]/attachment:[&_svg:not([class*='size-'])]:size-6 group-data-[size=xs]/attachment:[&_svg:not([class*='size-'])]:size-3.5", {
|
|
25
|
+
variants: {
|
|
26
|
+
variant: {
|
|
27
|
+
icon: '',
|
|
28
|
+
image: 'opacity-60 group-data-[state=done]/attachment:opacity-100 group-data-[state=idle]/attachment:opacity-100 *:[img]:aspect-square *:[img]:w-full *:[img]:object-cover',
|
|
29
|
+
},
|
|
30
|
+
},
|
|
31
|
+
defaultVariants: {
|
|
32
|
+
variant: 'icon',
|
|
33
|
+
},
|
|
34
|
+
});
|
|
35
|
+
function AttachmentMedia({ className, variant = 'icon', ...props }) {
|
|
36
|
+
return (_jsx("div", { "data-slot": "attachment-media", "data-variant": variant, className: cn(attachmentMediaVariants({ variant }), className), ...props }));
|
|
37
|
+
}
|
|
38
|
+
function AttachmentContent({ className, ...props }) {
|
|
39
|
+
return (_jsx("div", { "data-slot": "attachment-content", className: cn('max-w-full min-w-0 flex-1 leading-tight group-data-[orientation=vertical]/attachment:px-1', className), ...props }));
|
|
40
|
+
}
|
|
41
|
+
function AttachmentTitle({ className, ...props }) {
|
|
42
|
+
return (_jsx("span", { "data-slot": "attachment-title", className: cn('block max-w-full min-w-0 truncate font-medium group-data-[state=processing]/attachment:shimmer group-data-[state=uploading]/attachment:shimmer', className), ...props }));
|
|
43
|
+
}
|
|
44
|
+
function AttachmentDescription({ className, ...props }) {
|
|
45
|
+
return (_jsx("span", { "data-slot": "attachment-description", className: cn('mt-0.5 block min-w-0 truncate text-xs text-muted-foreground group-data-[state=error]/attachment:text-destructive/80', 'max-w-full', className), ...props }));
|
|
46
|
+
}
|
|
47
|
+
function AttachmentActions({ className, ...props }) {
|
|
48
|
+
return (_jsx("div", { "data-slot": "attachment-actions", className: cn('relative z-20 flex shrink-0 items-center group-data-[orientation=vertical]/attachment:absolute group-data-[orientation=vertical]/attachment:top-3 group-data-[orientation=vertical]/attachment:right-3 group-data-[orientation=vertical]/attachment:gap-1', className), ...props }));
|
|
49
|
+
}
|
|
50
|
+
function AttachmentAction({ className, variant, size = 'icon-xs', ...props }) {
|
|
51
|
+
return (_jsx(Button, { "data-slot": "attachment-action", variant: variant ?? 'ghost', size: size, className: cn(className), ...props }));
|
|
52
|
+
}
|
|
53
|
+
function AttachmentTrigger({ className, render, type, ...props }) {
|
|
54
|
+
return useRender({
|
|
55
|
+
defaultTagName: 'button',
|
|
56
|
+
props: mergeProps({
|
|
57
|
+
type: render ? type : (type ?? 'button'),
|
|
58
|
+
className: cn('absolute inset-0 z-10 outline-none', className),
|
|
59
|
+
}, props),
|
|
60
|
+
render,
|
|
61
|
+
state: {
|
|
62
|
+
slot: 'attachment-trigger',
|
|
63
|
+
},
|
|
64
|
+
});
|
|
65
|
+
}
|
|
66
|
+
function AttachmentGroup({ className, ...props }) {
|
|
67
|
+
return (_jsx("div", { "data-slot": "attachment-group", className: cn('flex min-w-0 scroll-fade-x snap-x snap-mandatory scroll-px-1 scrollbar-none gap-3 overflow-x-auto overscroll-x-contain py-1 *:data-[slot=attachment]:flex-none *:data-[slot=attachment]:snap-start', className), ...props }));
|
|
68
|
+
}
|
|
69
|
+
export { Attachment, AttachmentGroup, AttachmentMedia, AttachmentContent, AttachmentTitle, AttachmentDescription, AttachmentActions, AttachmentAction, AttachmentTrigger, };
|
|
70
|
+
//# sourceMappingURL=attachment.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"attachment.js","sourceRoot":"","sources":["../../src/components/attachment.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { Avatar as AvatarPrimitive } from '@base-ui/react/avatar';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
declare function Avatar({ className, size, ...props }: AvatarPrimitive.Root.Props & {
|
|
4
|
+
size?: 'default' | 'sm' | 'lg';
|
|
5
|
+
}): React.JSX.Element;
|
|
6
|
+
declare function AvatarImage({ className, ...props }: AvatarPrimitive.Image.Props): React.JSX.Element;
|
|
7
|
+
declare function AvatarFallback({ className, ...props }: AvatarPrimitive.Fallback.Props): React.JSX.Element;
|
|
8
|
+
declare function AvatarBadge({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
|
|
9
|
+
declare function AvatarGroup({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
10
|
+
declare function AvatarGroupCount({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
11
|
+
export { Avatar, AvatarImage, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarBadge, };
|
|
12
|
+
//# sourceMappingURL=avatar.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar.d.ts","sourceRoot":"","sources":["../../src/components/avatar.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAElE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,eAAe,CAAC,IAAI,CAAC,KAAK,GAAG;IAC9B,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI,GAAG,IAAI,CAAC;CAChC,qBAYA;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,qBAWxE;AAED,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,eAAe,CAAC,QAAQ,CAAC,KAAK,qBAWhC;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,qBAczE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAWxE;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW7B;AAED,OAAO,EACL,MAAM,EACN,WAAW,EACX,cAAc,EACd,WAAW,EACX,gBAAgB,EAChB,WAAW,GACZ,CAAC"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { Avatar as AvatarPrimitive } from '@base-ui/react/avatar';
|
|
4
|
+
import { cn } from 'cn';
|
|
5
|
+
import * as React from 'react';
|
|
6
|
+
function Avatar({ className, size = 'default', ...props }) {
|
|
7
|
+
return (_jsx(AvatarPrimitive.Root, { "data-slot": "avatar", "data-size": size, className: cn('group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten', className), ...props }));
|
|
8
|
+
}
|
|
9
|
+
function AvatarImage({ className, ...props }) {
|
|
10
|
+
return (_jsx(AvatarPrimitive.Image, { "data-slot": "avatar-image", className: cn('aspect-square size-full rounded-full object-cover', className), ...props }));
|
|
11
|
+
}
|
|
12
|
+
function AvatarFallback({ className, ...props }) {
|
|
13
|
+
return (_jsx(AvatarPrimitive.Fallback, { "data-slot": "avatar-fallback", className: cn('flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs', className), ...props }));
|
|
14
|
+
}
|
|
15
|
+
function AvatarBadge({ className, ...props }) {
|
|
16
|
+
return (_jsx("span", { "data-slot": "avatar-badge", className: cn('absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground bg-blend-color ring-2 ring-background select-none', 'group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden', 'group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2', 'group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2', className), ...props }));
|
|
17
|
+
}
|
|
18
|
+
function AvatarGroup({ className, ...props }) {
|
|
19
|
+
return (_jsx("div", { "data-slot": "avatar-group", className: cn('group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background', className), ...props }));
|
|
20
|
+
}
|
|
21
|
+
function AvatarGroupCount({ className, ...props }) {
|
|
22
|
+
return (_jsx("div", { "data-slot": "avatar-group-count", className: cn('relative flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-sm text-muted-foreground ring-2 ring-background group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3', className), ...props }));
|
|
23
|
+
}
|
|
24
|
+
export { Avatar, AvatarImage, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarBadge, };
|
|
25
|
+
//# sourceMappingURL=avatar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar.js","sourceRoot":"","sources":["../../src/components/avatar.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAE,EAAE,EAAE,MAAM,IAAI,CAAC;AACxB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,SAAS,MAAM,CAAC,EACd,SAAS,EACT,IAAI,GAAG,SAAS,EAChB,GAAG,KAAK,EAGT;IACC,OAAO,CACL,KAAC,eAAe,CAAC,IAAI,iBACT,QAAQ,eACP,IAAI,EACf,SAAS,EAAE,EAAE,CACX,uPAAuP,EACvP,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACvE,OAAO,CACL,KAAC,eAAe,CAAC,KAAK,iBACV,cAAc,EACxB,SAAS,EAAE,EAAE,CACX,mDAAmD,EACnD,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,cAAc,CAAC,EACtB,SAAS,EACT,GAAG,KAAK,EACuB;IAC/B,OAAO,CACL,KAAC,eAAe,CAAC,QAAQ,iBACb,iBAAiB,EAC3B,SAAS,EAAE,EAAE,CACX,oIAAoI,EACpI,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAgC;IACxE,OAAO,CACL,4BACY,cAAc,EACxB,SAAS,EAAE,EAAE,CACX,0KAA0K,EAC1K,+EAA+E,EAC/E,2FAA2F,EAC3F,+EAA+E,EAC/E,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACvE,OAAO,CACL,2BACY,cAAc,EACxB,SAAS,EAAE,EAAE,CACX,qGAAqG,EACrG,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACoB;IAC5B,OAAO,CACL,2BACY,oBAAoB,EAC9B,SAAS,EAAE,EAAE,CACX,0VAA0V,EAC1V,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,OAAO,EACL,MAAM,EACN,WAAW,EACX,cAAc,EACd,WAAW,EACX,gBAAgB,EAChB,WAAW,GACZ,CAAC"}
|