buildgrid-ui 1.1.0-alpha.6 → 1.1.0-dev.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/buildgrid-ui.es.js +4496 -3662
- package/dist/buildgrid-ui.umd.js +83 -58
- package/dist/components/adaptive-input/index.d.ts +1 -0
- package/dist/components/alert-dialog/alert-dialog.d.ts +20 -0
- package/dist/components/alert-dialog/index.d.ts +1 -0
- package/dist/components/badge/badge.d.ts +1 -1
- package/dist/components/button/button.d.ts +1 -1
- package/dist/components/currency-input/currency-input.d.ts +10 -0
- package/dist/components/currency-input/index.d.ts +1 -0
- package/dist/components/index.d.ts +6 -1
- package/dist/components/password-input/index.d.ts +1 -0
- package/dist/components/password-input/password-input.d.ts +16 -0
- package/dist/components/progress/index.d.ts +1 -0
- package/dist/components/progress/progress.d.ts +4 -0
- package/dist/components/switch/index.d.ts +1 -0
- package/dist/components/switch/switch.d.ts +4 -0
- package/dist/index.d.ts +2 -12
- package/dist/lib/index.d.ts +1 -0
- package/dist/lib/utils/formatters.d.ts +8 -0
- package/package.json +12 -2
- package/.editorconfig +0 -5
- package/.eslintrc.json +0 -3
- package/.github/workflows/release.yml +0 -25
- package/.husky/commit-msg +0 -1
- package/.prettierignore +0 -6
- package/.prettierrc +0 -6
- package/.releaserc.json +0 -40
- package/.storybook/main.ts +0 -26
- package/.storybook/preview.ts +0 -15
- package/commitlint.config.js +0 -3
- package/components.json +0 -21
- package/dist/components/adaptative-input/index.d.ts +0 -1
- package/eslint.config.mjs +0 -13
- package/postcss.config.js +0 -6
- package/src/components/adaptative-input/adaptative-input.stories.tsx +0 -30
- package/src/components/adaptative-input/adaptative-input.tsx +0 -66
- package/src/components/adaptative-input/index.ts +0 -1
- package/src/components/autocomplete/autocomplete.stories.tsx +0 -85
- package/src/components/autocomplete/autocomplete.tsx +0 -136
- package/src/components/autocomplete/index.ts +0 -1
- package/src/components/avatar/avatar.stories.tsx +0 -29
- package/src/components/avatar/avatar.tsx +0 -48
- package/src/components/avatar/index.ts +0 -1
- package/src/components/badge/badge.stories.tsx +0 -30
- package/src/components/badge/badge.tsx +0 -34
- package/src/components/badge/index.ts +0 -1
- package/src/components/button/button.stories.tsx +0 -62
- package/src/components/button/button.tsx +0 -82
- package/src/components/button/index.ts +0 -1
- package/src/components/card/card.stories.tsx +0 -41
- package/src/components/card/card.tsx +0 -61
- package/src/components/card/index.ts +0 -1
- package/src/components/checkbox/checkbox.stories.tsx +0 -36
- package/src/components/checkbox/checkbox.tsx +0 -28
- package/src/components/checkbox/index.ts +0 -1
- package/src/components/dropdown-menu/dropdown-menu.stories.tsx +0 -90
- package/src/components/dropdown-menu/dropdown-menu.tsx +0 -192
- package/src/components/dropdown-menu/index.ts +0 -1
- package/src/components/index.ts +0 -11
- package/src/components/input/index.ts +0 -1
- package/src/components/input/input.stories.tsx +0 -22
- package/src/components/input/input.tsx +0 -41
- package/src/components/popover/index.ts +0 -1
- package/src/components/popover/popover.stories.tsx +0 -32
- package/src/components/popover/popover.tsx +0 -30
- package/src/components/skeleton/index.ts +0 -1
- package/src/components/skeleton/skeleton.stories.tsx +0 -24
- package/src/components/skeleton/skeleton.tsx +0 -19
- package/src/index.ts +0 -12
- package/src/lib/index.ts +0 -1
- package/src/lib/utils/cn.ts +0 -6
- package/src/styles/tailwind.css +0 -66
- package/tailwind.config.js +0 -57
- package/tsconfig.app.json +0 -10
- package/tsconfig.json +0 -29
- package/vite.config.ts +0 -34
- /package/dist/components/{adaptative-input/adaptative-input.d.ts → adaptive-input/adaptive-input.d.ts} +0 -0
|
@@ -1,90 +0,0 @@
|
|
|
1
|
-
// organize-imports-ignore
|
|
2
|
-
import React from 'react'
|
|
3
|
-
import type { Meta, StoryObj } from '@storybook/react'
|
|
4
|
-
|
|
5
|
-
import {
|
|
6
|
-
DropdownMenu,
|
|
7
|
-
DropdownMenuContent,
|
|
8
|
-
DropdownMenuItem,
|
|
9
|
-
DropdownMenuLabel,
|
|
10
|
-
DropdownMenuPortal,
|
|
11
|
-
DropdownMenuSeparator,
|
|
12
|
-
DropdownMenuSub,
|
|
13
|
-
DropdownMenuSubContent,
|
|
14
|
-
DropdownMenuSubTrigger,
|
|
15
|
-
DropdownMenuTrigger,
|
|
16
|
-
} from './dropdown-menu'
|
|
17
|
-
import { Button } from '../button/button'
|
|
18
|
-
import {
|
|
19
|
-
Key,
|
|
20
|
-
Mail,
|
|
21
|
-
MessageSquare,
|
|
22
|
-
Pencil,
|
|
23
|
-
PlusCircle,
|
|
24
|
-
Settings2,
|
|
25
|
-
Trash,
|
|
26
|
-
UserPlus,
|
|
27
|
-
} from 'lucide-react'
|
|
28
|
-
|
|
29
|
-
const meta: Meta<typeof DropdownMenu> = {
|
|
30
|
-
component: DropdownMenu,
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
export default meta
|
|
34
|
-
type Story = StoryObj<typeof DropdownMenu>
|
|
35
|
-
|
|
36
|
-
const Template = () => {
|
|
37
|
-
return (
|
|
38
|
-
<DropdownMenu>
|
|
39
|
-
<DropdownMenuTrigger asChild>
|
|
40
|
-
<Button variant="outline" size="icon">
|
|
41
|
-
<Settings2 className="w-6 h-6" />
|
|
42
|
-
<span className="sr-only">Open settings</span>
|
|
43
|
-
</Button>
|
|
44
|
-
</DropdownMenuTrigger>
|
|
45
|
-
<DropdownMenuContent align="end">
|
|
46
|
-
<DropdownMenuLabel>Jhon Doe</DropdownMenuLabel>
|
|
47
|
-
<DropdownMenuSeparator />
|
|
48
|
-
<DropdownMenuItem>
|
|
49
|
-
<Pencil /> Edit
|
|
50
|
-
</DropdownMenuItem>
|
|
51
|
-
<DropdownMenuItem>
|
|
52
|
-
<Trash /> Delete
|
|
53
|
-
</DropdownMenuItem>
|
|
54
|
-
<DropdownMenuSeparator />
|
|
55
|
-
<DropdownMenuItem>
|
|
56
|
-
<Key /> Send password reset
|
|
57
|
-
</DropdownMenuItem>
|
|
58
|
-
<DropdownMenuSeparator />
|
|
59
|
-
<DropdownMenuSub>
|
|
60
|
-
<DropdownMenuSubTrigger>
|
|
61
|
-
<UserPlus />
|
|
62
|
-
<span>Invite users</span>
|
|
63
|
-
</DropdownMenuSubTrigger>
|
|
64
|
-
<DropdownMenuPortal>
|
|
65
|
-
<DropdownMenuSubContent>
|
|
66
|
-
<DropdownMenuItem>
|
|
67
|
-
<Mail />
|
|
68
|
-
<span>Email</span>
|
|
69
|
-
</DropdownMenuItem>
|
|
70
|
-
<DropdownMenuItem>
|
|
71
|
-
<MessageSquare />
|
|
72
|
-
<span>Message</span>
|
|
73
|
-
</DropdownMenuItem>
|
|
74
|
-
<DropdownMenuSeparator />
|
|
75
|
-
<DropdownMenuItem>
|
|
76
|
-
<PlusCircle />
|
|
77
|
-
<span>More...</span>
|
|
78
|
-
</DropdownMenuItem>
|
|
79
|
-
</DropdownMenuSubContent>
|
|
80
|
-
</DropdownMenuPortal>
|
|
81
|
-
</DropdownMenuSub>
|
|
82
|
-
</DropdownMenuContent>
|
|
83
|
-
</DropdownMenu>
|
|
84
|
-
)
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
export const Default: Story = {
|
|
88
|
-
render: Template.bind({}),
|
|
89
|
-
args: {},
|
|
90
|
-
}
|
|
@@ -1,192 +0,0 @@
|
|
|
1
|
-
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu'
|
|
2
|
-
import { Check, ChevronRight, Circle } from 'lucide-react'
|
|
3
|
-
import * as React from 'react'
|
|
4
|
-
|
|
5
|
-
import { cn } from '@/lib/utils/cn'
|
|
6
|
-
|
|
7
|
-
const DropdownMenu = DropdownMenuPrimitive.Root
|
|
8
|
-
|
|
9
|
-
const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger
|
|
10
|
-
|
|
11
|
-
const DropdownMenuGroup = DropdownMenuPrimitive.Group
|
|
12
|
-
|
|
13
|
-
const DropdownMenuPortal = DropdownMenuPrimitive.Portal
|
|
14
|
-
|
|
15
|
-
const DropdownMenuSub = DropdownMenuPrimitive.Sub
|
|
16
|
-
|
|
17
|
-
const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup
|
|
18
|
-
|
|
19
|
-
const DropdownMenuSubTrigger = React.forwardRef<
|
|
20
|
-
React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,
|
|
21
|
-
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {
|
|
22
|
-
inset?: boolean
|
|
23
|
-
}
|
|
24
|
-
>(({ className, inset, children, ...props }, ref) => (
|
|
25
|
-
<DropdownMenuPrimitive.SubTrigger
|
|
26
|
-
ref={ref}
|
|
27
|
-
className={cn(
|
|
28
|
-
'flex cursor-default gap-2 select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',
|
|
29
|
-
inset && 'pl-8',
|
|
30
|
-
className,
|
|
31
|
-
)}
|
|
32
|
-
{...props}
|
|
33
|
-
>
|
|
34
|
-
{children}
|
|
35
|
-
<ChevronRight className="ml-auto" />
|
|
36
|
-
</DropdownMenuPrimitive.SubTrigger>
|
|
37
|
-
))
|
|
38
|
-
DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName
|
|
39
|
-
|
|
40
|
-
const DropdownMenuSubContent = React.forwardRef<
|
|
41
|
-
React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,
|
|
42
|
-
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>
|
|
43
|
-
>(({ className, ...props }, ref) => (
|
|
44
|
-
<DropdownMenuPrimitive.SubContent
|
|
45
|
-
ref={ref}
|
|
46
|
-
className={cn(
|
|
47
|
-
'z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
|
|
48
|
-
className,
|
|
49
|
-
)}
|
|
50
|
-
{...props}
|
|
51
|
-
/>
|
|
52
|
-
))
|
|
53
|
-
DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName
|
|
54
|
-
|
|
55
|
-
const DropdownMenuContent = React.forwardRef<
|
|
56
|
-
React.ElementRef<typeof DropdownMenuPrimitive.Content>,
|
|
57
|
-
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>
|
|
58
|
-
>(({ className, sideOffset = 4, ...props }, ref) => (
|
|
59
|
-
<DropdownMenuPrimitive.Portal>
|
|
60
|
-
<DropdownMenuPrimitive.Content
|
|
61
|
-
ref={ref}
|
|
62
|
-
sideOffset={sideOffset}
|
|
63
|
-
className={cn(
|
|
64
|
-
'z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md',
|
|
65
|
-
'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
|
|
66
|
-
className,
|
|
67
|
-
)}
|
|
68
|
-
{...props}
|
|
69
|
-
/>
|
|
70
|
-
</DropdownMenuPrimitive.Portal>
|
|
71
|
-
))
|
|
72
|
-
DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName
|
|
73
|
-
|
|
74
|
-
const DropdownMenuItem = React.forwardRef<
|
|
75
|
-
React.ElementRef<typeof DropdownMenuPrimitive.Item>,
|
|
76
|
-
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {
|
|
77
|
-
inset?: boolean
|
|
78
|
-
}
|
|
79
|
-
>(({ className, inset, ...props }, ref) => (
|
|
80
|
-
<DropdownMenuPrimitive.Item
|
|
81
|
-
ref={ref}
|
|
82
|
-
className={cn(
|
|
83
|
-
'relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0',
|
|
84
|
-
inset && 'pl-8',
|
|
85
|
-
className,
|
|
86
|
-
)}
|
|
87
|
-
{...props}
|
|
88
|
-
/>
|
|
89
|
-
))
|
|
90
|
-
DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName
|
|
91
|
-
|
|
92
|
-
const DropdownMenuCheckboxItem = React.forwardRef<
|
|
93
|
-
React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,
|
|
94
|
-
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>
|
|
95
|
-
>(({ className, children, checked, ...props }, ref) => (
|
|
96
|
-
<DropdownMenuPrimitive.CheckboxItem
|
|
97
|
-
ref={ref}
|
|
98
|
-
className={cn(
|
|
99
|
-
'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
|
|
100
|
-
className,
|
|
101
|
-
)}
|
|
102
|
-
checked={checked}
|
|
103
|
-
{...props}
|
|
104
|
-
>
|
|
105
|
-
<span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
|
|
106
|
-
<DropdownMenuPrimitive.ItemIndicator>
|
|
107
|
-
<Check className="h-4 w-4" />
|
|
108
|
-
</DropdownMenuPrimitive.ItemIndicator>
|
|
109
|
-
</span>
|
|
110
|
-
{children}
|
|
111
|
-
</DropdownMenuPrimitive.CheckboxItem>
|
|
112
|
-
))
|
|
113
|
-
DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName
|
|
114
|
-
|
|
115
|
-
const DropdownMenuRadioItem = React.forwardRef<
|
|
116
|
-
React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,
|
|
117
|
-
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>
|
|
118
|
-
>(({ className, children, ...props }, ref) => (
|
|
119
|
-
<DropdownMenuPrimitive.RadioItem
|
|
120
|
-
ref={ref}
|
|
121
|
-
className={cn(
|
|
122
|
-
'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
|
|
123
|
-
className,
|
|
124
|
-
)}
|
|
125
|
-
{...props}
|
|
126
|
-
>
|
|
127
|
-
<span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
|
|
128
|
-
<DropdownMenuPrimitive.ItemIndicator>
|
|
129
|
-
<Circle className="h-2 w-2 fill-current" />
|
|
130
|
-
</DropdownMenuPrimitive.ItemIndicator>
|
|
131
|
-
</span>
|
|
132
|
-
{children}
|
|
133
|
-
</DropdownMenuPrimitive.RadioItem>
|
|
134
|
-
))
|
|
135
|
-
DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName
|
|
136
|
-
|
|
137
|
-
const DropdownMenuLabel = React.forwardRef<
|
|
138
|
-
React.ElementRef<typeof DropdownMenuPrimitive.Label>,
|
|
139
|
-
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {
|
|
140
|
-
inset?: boolean
|
|
141
|
-
}
|
|
142
|
-
>(({ className, inset, ...props }, ref) => (
|
|
143
|
-
<DropdownMenuPrimitive.Label
|
|
144
|
-
ref={ref}
|
|
145
|
-
className={cn('px-2 py-1.5 text-sm font-semibold', inset && 'pl-8', className)}
|
|
146
|
-
{...props}
|
|
147
|
-
/>
|
|
148
|
-
))
|
|
149
|
-
DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName
|
|
150
|
-
|
|
151
|
-
const DropdownMenuSeparator = React.forwardRef<
|
|
152
|
-
React.ElementRef<typeof DropdownMenuPrimitive.Separator>,
|
|
153
|
-
React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>
|
|
154
|
-
>(({ className, ...props }, ref) => (
|
|
155
|
-
<DropdownMenuPrimitive.Separator
|
|
156
|
-
ref={ref}
|
|
157
|
-
className={cn('-mx-1 my-1 h-px bg-muted', className)}
|
|
158
|
-
{...props}
|
|
159
|
-
/>
|
|
160
|
-
))
|
|
161
|
-
DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName
|
|
162
|
-
|
|
163
|
-
const DropdownMenuShortcut = ({
|
|
164
|
-
className,
|
|
165
|
-
...props
|
|
166
|
-
}: React.HTMLAttributes<HTMLSpanElement>) => {
|
|
167
|
-
return (
|
|
168
|
-
<span
|
|
169
|
-
className={cn('ml-auto text-xs tracking-widest opacity-60', className)}
|
|
170
|
-
{...props}
|
|
171
|
-
/>
|
|
172
|
-
)
|
|
173
|
-
}
|
|
174
|
-
DropdownMenuShortcut.displayName = 'DropdownMenuShortcut'
|
|
175
|
-
|
|
176
|
-
export {
|
|
177
|
-
DropdownMenu,
|
|
178
|
-
DropdownMenuCheckboxItem,
|
|
179
|
-
DropdownMenuContent,
|
|
180
|
-
DropdownMenuGroup,
|
|
181
|
-
DropdownMenuItem,
|
|
182
|
-
DropdownMenuLabel,
|
|
183
|
-
DropdownMenuPortal,
|
|
184
|
-
DropdownMenuRadioGroup,
|
|
185
|
-
DropdownMenuRadioItem,
|
|
186
|
-
DropdownMenuSeparator,
|
|
187
|
-
DropdownMenuShortcut,
|
|
188
|
-
DropdownMenuSub,
|
|
189
|
-
DropdownMenuSubContent,
|
|
190
|
-
DropdownMenuSubTrigger,
|
|
191
|
-
DropdownMenuTrigger,
|
|
192
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './dropdown-menu'
|
package/src/components/index.ts
DELETED
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
export * from './adaptative-input'
|
|
2
|
-
export * from './autocomplete'
|
|
3
|
-
export * from './avatar'
|
|
4
|
-
export * from './badge'
|
|
5
|
-
export * from './button'
|
|
6
|
-
export * from './card'
|
|
7
|
-
export * from './checkbox'
|
|
8
|
-
export * from './dropdown-menu'
|
|
9
|
-
export * from './input'
|
|
10
|
-
export * from './popover'
|
|
11
|
-
export * from './skeleton'
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './input'
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
// organize-imports-ignore
|
|
2
|
-
import React from 'react'
|
|
3
|
-
import type { Meta, StoryObj } from '@storybook/react'
|
|
4
|
-
|
|
5
|
-
import { Input } from './input'
|
|
6
|
-
|
|
7
|
-
const meta: Meta<typeof Input> = {
|
|
8
|
-
title: 'Components/Input/Simple',
|
|
9
|
-
component: Input,
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
export default meta
|
|
13
|
-
type Story = StoryObj<typeof Input>
|
|
14
|
-
|
|
15
|
-
const Template = () => {
|
|
16
|
-
return <Input className="w-64" />
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
export const Default: Story = {
|
|
20
|
-
render: Template.bind({}),
|
|
21
|
-
args: {},
|
|
22
|
-
}
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
import { cn } from '@/lib/utils/cn'
|
|
2
|
-
import { cva, VariantProps } from 'class-variance-authority'
|
|
3
|
-
import * as React from 'react'
|
|
4
|
-
|
|
5
|
-
const inputVariants = cva(
|
|
6
|
-
'flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50',
|
|
7
|
-
{
|
|
8
|
-
variants: {
|
|
9
|
-
sizing: {
|
|
10
|
-
sm: 'h-8 text-xs px-2',
|
|
11
|
-
md: 'h-10 text-sm px-3',
|
|
12
|
-
lg: 'h-12 text-base px-4',
|
|
13
|
-
xl: 'h-14 text-lg px-5',
|
|
14
|
-
'2xl': 'h-16 text-xl px-6',
|
|
15
|
-
},
|
|
16
|
-
},
|
|
17
|
-
defaultVariants: {
|
|
18
|
-
sizing: 'md',
|
|
19
|
-
},
|
|
20
|
-
},
|
|
21
|
-
)
|
|
22
|
-
|
|
23
|
-
export interface InputProps
|
|
24
|
-
extends React.InputHTMLAttributes<HTMLInputElement>,
|
|
25
|
-
VariantProps<typeof inputVariants> {}
|
|
26
|
-
|
|
27
|
-
const Input = React.forwardRef<HTMLInputElement, InputProps>(
|
|
28
|
-
({ className, sizing, type, ...props }, ref) => {
|
|
29
|
-
return (
|
|
30
|
-
<input
|
|
31
|
-
type={type}
|
|
32
|
-
className={cn(inputVariants({ sizing, className }))}
|
|
33
|
-
ref={ref}
|
|
34
|
-
{...props}
|
|
35
|
-
/>
|
|
36
|
-
)
|
|
37
|
-
},
|
|
38
|
-
)
|
|
39
|
-
Input.displayName = 'Input'
|
|
40
|
-
|
|
41
|
-
export { Input }
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './popover'
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
// organize-imports-ignore
|
|
2
|
-
import React from 'react'
|
|
3
|
-
import type { Meta, StoryObj } from '@storybook/react'
|
|
4
|
-
|
|
5
|
-
import { Popover, PopoverContent, PopoverTrigger } from './popover'
|
|
6
|
-
import { Button } from '../button/button'
|
|
7
|
-
|
|
8
|
-
const meta: Meta<typeof Popover> = {
|
|
9
|
-
component: Popover,
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
export default meta
|
|
13
|
-
type Story = StoryObj<typeof Popover>
|
|
14
|
-
|
|
15
|
-
const Template = () => {
|
|
16
|
-
const variants = ['default', 'secondary', 'destructive', 'outline']
|
|
17
|
-
return (
|
|
18
|
-
<Popover>
|
|
19
|
-
<PopoverTrigger asChild>
|
|
20
|
-
<Button variant="outline">Open popover</Button>
|
|
21
|
-
</PopoverTrigger>
|
|
22
|
-
<PopoverContent className="w-80">
|
|
23
|
-
<div className="bg-gray-200 p-6 w-full h-20">Popover content</div>
|
|
24
|
-
</PopoverContent>
|
|
25
|
-
</Popover>
|
|
26
|
-
)
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
export const Default: Story = {
|
|
30
|
-
render: Template.bind({}),
|
|
31
|
-
args: {},
|
|
32
|
-
}
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import { cn } from '@/lib'
|
|
2
|
-
import * as PopoverPrimitive from '@radix-ui/react-popover'
|
|
3
|
-
import * as React from 'react'
|
|
4
|
-
|
|
5
|
-
const Popover = PopoverPrimitive.Root
|
|
6
|
-
|
|
7
|
-
const PopoverTrigger = PopoverPrimitive.Trigger
|
|
8
|
-
|
|
9
|
-
const PopoverAnchor = PopoverPrimitive.Anchor
|
|
10
|
-
|
|
11
|
-
const PopoverContent = React.forwardRef<
|
|
12
|
-
React.ElementRef<typeof PopoverPrimitive.Content>,
|
|
13
|
-
React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>
|
|
14
|
-
>(({ className, align = 'center', sideOffset = 4, ...props }, ref) => (
|
|
15
|
-
<PopoverPrimitive.Portal>
|
|
16
|
-
<PopoverPrimitive.Content
|
|
17
|
-
ref={ref}
|
|
18
|
-
align={align}
|
|
19
|
-
sideOffset={sideOffset}
|
|
20
|
-
className={cn(
|
|
21
|
-
'z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
|
|
22
|
-
className,
|
|
23
|
-
)}
|
|
24
|
-
{...props}
|
|
25
|
-
/>
|
|
26
|
-
</PopoverPrimitive.Portal>
|
|
27
|
-
))
|
|
28
|
-
PopoverContent.displayName = PopoverPrimitive.Content.displayName
|
|
29
|
-
|
|
30
|
-
export { Popover, PopoverAnchor, PopoverContent, PopoverTrigger }
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './skeleton'
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
// organize-imports-ignore
|
|
2
|
-
import React from 'react'
|
|
3
|
-
import type { Meta, StoryObj } from '@storybook/react'
|
|
4
|
-
import { Skeleton } from './Skeleton'
|
|
5
|
-
|
|
6
|
-
const meta: Meta<typeof Skeleton> = {
|
|
7
|
-
component: Skeleton,
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
export default meta
|
|
11
|
-
type Story = StoryObj<typeof Skeleton>
|
|
12
|
-
|
|
13
|
-
const Template = () => {
|
|
14
|
-
return (
|
|
15
|
-
<div className="space-y-2">
|
|
16
|
-
<Skeleton className="w-96 h-5" repeat={3} />
|
|
17
|
-
</div>
|
|
18
|
-
)
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
export const Default: Story = {
|
|
22
|
-
render: Template.bind({}),
|
|
23
|
-
args: {},
|
|
24
|
-
}
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import { cn } from '@/lib/utils/cn'
|
|
2
|
-
|
|
3
|
-
type SkeletonProps = {
|
|
4
|
-
repeat?: number
|
|
5
|
-
} & React.ComponentProps<'div'>
|
|
6
|
-
|
|
7
|
-
export const Skeleton = ({ className, repeat = 1, ...props }: SkeletonProps) => {
|
|
8
|
-
return (
|
|
9
|
-
<>
|
|
10
|
-
{Array.from({ length: repeat ?? 1 }).map((_, index) => (
|
|
11
|
-
<div
|
|
12
|
-
key={index}
|
|
13
|
-
className={cn('animate-pulse rounded-md bg-gray-700/10', className)}
|
|
14
|
-
{...props}
|
|
15
|
-
/>
|
|
16
|
-
))}
|
|
17
|
-
</>
|
|
18
|
-
)
|
|
19
|
-
}
|
package/src/index.ts
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
export * from './components/adaptative-input'
|
|
2
|
-
export * from './components/autocomplete'
|
|
3
|
-
export * from './components/avatar'
|
|
4
|
-
export * from './components/badge'
|
|
5
|
-
export * from './components/button'
|
|
6
|
-
export * from './components/card'
|
|
7
|
-
export * from './components/checkbox'
|
|
8
|
-
export * from './components/dropdown-menu'
|
|
9
|
-
export * from './components/input'
|
|
10
|
-
export * from './components/popover'
|
|
11
|
-
export * from './components/skeleton'
|
|
12
|
-
export * from './lib/utils/cn'
|
package/src/lib/index.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './utils/cn'
|
package/src/lib/utils/cn.ts
DELETED
package/src/styles/tailwind.css
DELETED
|
@@ -1,66 +0,0 @@
|
|
|
1
|
-
@tailwind base;
|
|
2
|
-
@tailwind components;
|
|
3
|
-
@tailwind utilities;
|
|
4
|
-
@layer base {
|
|
5
|
-
:root {
|
|
6
|
-
--background: 0 0% 100%;
|
|
7
|
-
--foreground: 0 0% 3.9%;
|
|
8
|
-
--card: 0 0% 100%;
|
|
9
|
-
--card-foreground: 0 0% 3.9%;
|
|
10
|
-
--popover: 0 0% 100%;
|
|
11
|
-
--popover-foreground: 0 0% 3.9%;
|
|
12
|
-
--primary: 0 0% 9%;
|
|
13
|
-
--primary-foreground: 0 0% 98%;
|
|
14
|
-
--secondary: 0 0% 96.1%;
|
|
15
|
-
--secondary-foreground: 0 0% 9%;
|
|
16
|
-
--muted: 0 0% 96.1%;
|
|
17
|
-
--muted-foreground: 0 0% 45.1%;
|
|
18
|
-
--accent: 0 0% 96.1%;
|
|
19
|
-
--accent-foreground: 0 0% 9%;
|
|
20
|
-
--destructive: 0 84.2% 60.2%;
|
|
21
|
-
--destructive-foreground: 0 0% 98%;
|
|
22
|
-
--border: 0 0% 89.8%;
|
|
23
|
-
--input: 0 0% 89.8%;
|
|
24
|
-
--ring: 0 0% 3.9%;
|
|
25
|
-
--chart-1: 12 76% 61%;
|
|
26
|
-
--chart-2: 173 58% 39%;
|
|
27
|
-
--chart-3: 197 37% 24%;
|
|
28
|
-
--chart-4: 43 74% 66%;
|
|
29
|
-
--chart-5: 27 87% 67%;
|
|
30
|
-
--radius: 0.5rem
|
|
31
|
-
}
|
|
32
|
-
.dark {
|
|
33
|
-
--background: 0 0% 3.9%;
|
|
34
|
-
--foreground: 0 0% 98%;
|
|
35
|
-
--card: 0 0% 3.9%;
|
|
36
|
-
--card-foreground: 0 0% 98%;
|
|
37
|
-
--popover: 0 0% 3.9%;
|
|
38
|
-
--popover-foreground: 0 0% 98%;
|
|
39
|
-
--primary: 0 0% 98%;
|
|
40
|
-
--primary-foreground: 0 0% 9%;
|
|
41
|
-
--secondary: 0 0% 14.9%;
|
|
42
|
-
--secondary-foreground: 0 0% 98%;
|
|
43
|
-
--muted: 0 0% 14.9%;
|
|
44
|
-
--muted-foreground: 0 0% 63.9%;
|
|
45
|
-
--accent: 0 0% 14.9%;
|
|
46
|
-
--accent-foreground: 0 0% 98%;
|
|
47
|
-
--destructive: 0 62.8% 30.6%;
|
|
48
|
-
--destructive-foreground: 0 0% 98%;
|
|
49
|
-
--border: 0 0% 14.9%;
|
|
50
|
-
--input: 0 0% 14.9%;
|
|
51
|
-
--ring: 0 0% 83.1%;
|
|
52
|
-
--chart-1: 220 70% 50%;
|
|
53
|
-
--chart-2: 160 60% 45%;
|
|
54
|
-
--chart-3: 30 80% 55%;
|
|
55
|
-
--chart-4: 280 65% 60%;
|
|
56
|
-
--chart-5: 340 75% 55%
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
@layer base {
|
|
60
|
-
* {
|
|
61
|
-
@apply border-border;
|
|
62
|
-
}
|
|
63
|
-
body {
|
|
64
|
-
@apply bg-background text-foreground;
|
|
65
|
-
}
|
|
66
|
-
}
|
package/tailwind.config.js
DELETED
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
/** @type {import('tailwindcss').Config} */
|
|
2
|
-
module.exports = {
|
|
3
|
-
darkMode: ["class"],
|
|
4
|
-
content: ["./src/**/*.{js,ts,jsx,tsx}"],
|
|
5
|
-
theme: {
|
|
6
|
-
extend: {
|
|
7
|
-
borderRadius: {
|
|
8
|
-
lg: 'var(--radius)',
|
|
9
|
-
md: 'calc(var(--radius) - 2px)',
|
|
10
|
-
sm: 'calc(var(--radius) - 4px)'
|
|
11
|
-
},
|
|
12
|
-
colors: {
|
|
13
|
-
background: 'hsl(var(--background))',
|
|
14
|
-
foreground: 'hsl(var(--foreground))',
|
|
15
|
-
card: {
|
|
16
|
-
DEFAULT: 'hsl(var(--card))',
|
|
17
|
-
foreground: 'hsl(var(--card-foreground))'
|
|
18
|
-
},
|
|
19
|
-
popover: {
|
|
20
|
-
DEFAULT: 'hsl(var(--popover))',
|
|
21
|
-
foreground: 'hsl(var(--popover-foreground))'
|
|
22
|
-
},
|
|
23
|
-
primary: {
|
|
24
|
-
DEFAULT: 'hsl(var(--primary))',
|
|
25
|
-
foreground: 'hsl(var(--primary-foreground))'
|
|
26
|
-
},
|
|
27
|
-
secondary: {
|
|
28
|
-
DEFAULT: 'hsl(var(--secondary))',
|
|
29
|
-
foreground: 'hsl(var(--secondary-foreground))'
|
|
30
|
-
},
|
|
31
|
-
muted: {
|
|
32
|
-
DEFAULT: 'hsl(var(--muted))',
|
|
33
|
-
foreground: 'hsl(var(--muted-foreground))'
|
|
34
|
-
},
|
|
35
|
-
accent: {
|
|
36
|
-
DEFAULT: 'hsl(var(--accent))',
|
|
37
|
-
foreground: 'hsl(var(--accent-foreground))'
|
|
38
|
-
},
|
|
39
|
-
destructive: {
|
|
40
|
-
DEFAULT: 'hsl(var(--destructive))',
|
|
41
|
-
foreground: 'hsl(var(--destructive-foreground))'
|
|
42
|
-
},
|
|
43
|
-
border: 'hsl(var(--border))',
|
|
44
|
-
input: 'hsl(var(--input))',
|
|
45
|
-
ring: 'hsl(var(--ring))',
|
|
46
|
-
chart: {
|
|
47
|
-
'1': 'hsl(var(--chart-1))',
|
|
48
|
-
'2': 'hsl(var(--chart-2))',
|
|
49
|
-
'3': 'hsl(var(--chart-3))',
|
|
50
|
-
'4': 'hsl(var(--chart-4))',
|
|
51
|
-
'5': 'hsl(var(--chart-5))'
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
},
|
|
56
|
-
plugins: [require("tailwindcss-animate")],
|
|
57
|
-
};
|
package/tsconfig.app.json
DELETED
package/tsconfig.json
DELETED
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"compilerOptions": {
|
|
3
|
-
"baseUrl": ".",
|
|
4
|
-
"target": "esnext",
|
|
5
|
-
"module": "esnext",
|
|
6
|
-
"lib": ["dom", "esnext"],
|
|
7
|
-
"jsx": "react-jsx",
|
|
8
|
-
"strict": true,
|
|
9
|
-
"moduleResolution": "node",
|
|
10
|
-
"esModuleInterop": true,
|
|
11
|
-
"declaration": true,
|
|
12
|
-
"emitDeclarationOnly": true,
|
|
13
|
-
"outDir": "dist",
|
|
14
|
-
"skipLibCheck": true,
|
|
15
|
-
"forceConsistentCasingInFileNames": true,
|
|
16
|
-
"paths": {
|
|
17
|
-
"@/*": ["./src/*"]
|
|
18
|
-
}
|
|
19
|
-
},
|
|
20
|
-
"include": ["src"],
|
|
21
|
-
"exclude": [
|
|
22
|
-
"node_modules",
|
|
23
|
-
"dist",
|
|
24
|
-
".husky",
|
|
25
|
-
"**/*.test.ts",
|
|
26
|
-
"**/*.test.tsx",
|
|
27
|
-
"**/*.stories.tsx"
|
|
28
|
-
]
|
|
29
|
-
}
|