@postxl/generators 1.1.0 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (169) hide show
  1. package/dist/backend-core/template/apps/api/src/e2e.ts +13 -4
  2. package/dist/e2e/e2e.generator.js +2 -14
  3. package/dist/e2e/e2e.generator.js.map +1 -1
  4. package/dist/e2e/generators/docker-sh.generator.d.ts +2 -0
  5. package/dist/e2e/generators/docker-sh.generator.js +25 -0
  6. package/dist/e2e/generators/docker-sh.generator.js.map +1 -0
  7. package/dist/frontend-core/frontend.generator.d.ts +0 -58
  8. package/dist/frontend-core/frontend.generator.js +6 -172
  9. package/dist/frontend-core/frontend.generator.js.map +1 -1
  10. package/dist/frontend-core/template/README.md +1 -1
  11. package/dist/frontend-core/template/src/components/admin/table-filter.tsx +1 -5
  12. package/dist/frontend-core/template/src/components/ui/color-mode-toggle/color-mode-toggle.tsx +10 -4
  13. package/dist/frontend-core/template/src/context-providers/auth-context-provider.tsx +2 -5
  14. package/dist/frontend-core/template/src/pages/dashboard/dashboard.page.tsx +2 -3
  15. package/dist/frontend-core/template/src/pages/error/default-error.page.tsx +1 -1
  16. package/dist/frontend-core/template/src/pages/error/not-found-error.page.tsx +1 -1
  17. package/dist/frontend-core/template/src/styles/styles.css +13 -1
  18. package/dist/frontend-core/template/tsconfig.json +2 -0
  19. package/dist/frontend-core/types/component.d.ts +1 -1
  20. package/dist/frontend-forms/generators/discriminated-union/fields.generator.js +4 -6
  21. package/dist/frontend-forms/generators/discriminated-union/fields.generator.js.map +1 -1
  22. package/dist/frontend-forms/generators/discriminated-union/inputs.generator.js +1 -1
  23. package/dist/frontend-forms/generators/discriminated-union/inputs.generator.js.map +1 -1
  24. package/dist/frontend-forms/generators/enum/inputs.generator.js +1 -1
  25. package/dist/frontend-forms/generators/enum/inputs.generator.js.map +1 -1
  26. package/dist/frontend-forms/generators/model/forms.generator.js +8 -12
  27. package/dist/frontend-forms/generators/model/forms.generator.js.map +1 -1
  28. package/dist/frontend-forms/generators/model/inputs.generator.js +2 -6
  29. package/dist/frontend-forms/generators/model/inputs.generator.js.map +1 -1
  30. package/dist/frontend-forms/template/src/components/ui/field/field.tsx +1 -4
  31. package/dist/frontend-tables/generators/model-table.generator.js +1 -5
  32. package/dist/frontend-tables/generators/model-table.generator.js.map +1 -1
  33. package/package.json +3 -2
  34. package/dist/e2e/template/scripts/docker.sh +0 -17
  35. package/dist/frontend-core/template/src/components/ui/accordion/accordion.stories.tsx +0 -47
  36. package/dist/frontend-core/template/src/components/ui/accordion/accordion.tsx +0 -52
  37. package/dist/frontend-core/template/src/components/ui/admin-sidebar/admin-sidebar.tsx +0 -195
  38. package/dist/frontend-core/template/src/components/ui/alert/alert.stories.tsx +0 -61
  39. package/dist/frontend-core/template/src/components/ui/alert/alert.tsx +0 -45
  40. package/dist/frontend-core/template/src/components/ui/alert-dialog/alert-dialog.stories.tsx +0 -52
  41. package/dist/frontend-core/template/src/components/ui/alert-dialog/alert-dialog.tsx +0 -105
  42. package/dist/frontend-core/template/src/components/ui/avatar/avatar.stories.tsx +0 -30
  43. package/dist/frontend-core/template/src/components/ui/avatar/avatar.tsx +0 -39
  44. package/dist/frontend-core/template/src/components/ui/badge/badge.stories.tsx +0 -78
  45. package/dist/frontend-core/template/src/components/ui/badge/badge.tsx +0 -48
  46. package/dist/frontend-core/template/src/components/ui/breadcrumb/breadcrumb.stories.tsx +0 -67
  47. package/dist/frontend-core/template/src/components/ui/breadcrumb/breadcrumb.tsx +0 -85
  48. package/dist/frontend-core/template/src/components/ui/button/button.stories.tsx +0 -150
  49. package/dist/frontend-core/template/src/components/ui/button/button.tsx +0 -68
  50. package/dist/frontend-core/template/src/components/ui/calendar/calendar.stories.tsx +0 -160
  51. package/dist/frontend-core/template/src/components/ui/calendar/calendar.tsx +0 -293
  52. package/dist/frontend-core/template/src/components/ui/card/card.stories.tsx +0 -77
  53. package/dist/frontend-core/template/src/components/ui/card/card.tsx +0 -45
  54. package/dist/frontend-core/template/src/components/ui/card-hover/card-hover.stories.tsx +0 -29
  55. package/dist/frontend-core/template/src/components/ui/card-hover/card-hover.tsx +0 -28
  56. package/dist/frontend-core/template/src/components/ui/carousel/carousel.stories.tsx +0 -154
  57. package/dist/frontend-core/template/src/components/ui/carousel/carousel.tsx +0 -227
  58. package/dist/frontend-core/template/src/components/ui/checkbox/checkbox.stories.tsx +0 -106
  59. package/dist/frontend-core/template/src/components/ui/checkbox/checkbox.tsx +0 -88
  60. package/dist/frontend-core/template/src/components/ui/checkbox/shadcn-checkbox.stories.tsx +0 -90
  61. package/dist/frontend-core/template/src/components/ui/checkbox/shadcn-checkbox.tsx +0 -54
  62. package/dist/frontend-core/template/src/components/ui/collapse/collapse.stories.tsx +0 -52
  63. package/dist/frontend-core/template/src/components/ui/collapse/collapse.tsx +0 -9
  64. package/dist/frontend-core/template/src/components/ui/combobox/combobox.stories.tsx +0 -207
  65. package/dist/frontend-core/template/src/components/ui/combobox/combobox.tsx +0 -79
  66. package/dist/frontend-core/template/src/components/ui/command/command.stories.tsx +0 -186
  67. package/dist/frontend-core/template/src/components/ui/command/command.tsx +0 -165
  68. package/dist/frontend-core/template/src/components/ui/command-palette/command-palette.stories.tsx +0 -160
  69. package/dist/frontend-core/template/src/components/ui/command-palette/command-palette.tsx +0 -134
  70. package/dist/frontend-core/template/src/components/ui/content-frame/content-frame.stories.tsx +0 -198
  71. package/dist/frontend-core/template/src/components/ui/content-frame/content-frame.tsx +0 -100
  72. package/dist/frontend-core/template/src/components/ui/context-menu/context-menu.stories.tsx +0 -78
  73. package/dist/frontend-core/template/src/components/ui/context-menu/context-menu.tsx +0 -179
  74. package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/cell-variant-types.ts +0 -11
  75. package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/checkbox-cell.tsx +0 -116
  76. package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/date-cell.tsx +0 -157
  77. package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/gantt-cell.tsx +0 -82
  78. package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/long-text-cell.tsx +0 -180
  79. package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/multi-select-cell.tsx +0 -280
  80. package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/number-cell.tsx +0 -169
  81. package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/react-node-cell.tsx +0 -33
  82. package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/select-cell.tsx +0 -175
  83. package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/short-text-cell.tsx +0 -138
  84. package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/utils/gantt-timeline.tsx +0 -92
  85. package/dist/frontend-core/template/src/components/ui/data-grid/cell-variants/utils/gantt-timerange-picker.tsx +0 -330
  86. package/dist/frontend-core/template/src/components/ui/data-grid/data-grid-cell-wrapper.tsx +0 -212
  87. package/dist/frontend-core/template/src/components/ui/data-grid/data-grid-cell.tsx +0 -157
  88. package/dist/frontend-core/template/src/components/ui/data-grid/data-grid-column-header.tsx +0 -340
  89. package/dist/frontend-core/template/src/components/ui/data-grid/data-grid-context-menu.tsx +0 -271
  90. package/dist/frontend-core/template/src/components/ui/data-grid/data-grid-row.tsx +0 -123
  91. package/dist/frontend-core/template/src/components/ui/data-grid/data-grid-search.tsx +0 -211
  92. package/dist/frontend-core/template/src/components/ui/data-grid/data-grid-types.ts +0 -159
  93. package/dist/frontend-core/template/src/components/ui/data-grid/data-grid-utils.ts +0 -67
  94. package/dist/frontend-core/template/src/components/ui/data-grid/data-grid-view-menu.tsx +0 -360
  95. package/dist/frontend-core/template/src/components/ui/data-grid/data-grid.stories.tsx +0 -780
  96. package/dist/frontend-core/template/src/components/ui/data-grid/data-grid.tsx +0 -217
  97. package/dist/frontend-core/template/src/components/ui/data-grid/hooks/use-callback-ref.ts +0 -22
  98. package/dist/frontend-core/template/src/components/ui/data-grid/hooks/use-data-grid.tsx +0 -1892
  99. package/dist/frontend-core/template/src/components/ui/data-grid/hooks/use-debounced-callback.ts +0 -19
  100. package/dist/frontend-core/template/src/components/ui/data-grid/styles.css +0 -3
  101. package/dist/frontend-core/template/src/components/ui/data-table/context-menu-simple.tsx +0 -141
  102. package/dist/frontend-core/template/src/components/ui/data-table/data-table.stories.tsx +0 -146
  103. package/dist/frontend-core/template/src/components/ui/data-table/data-table.tsx +0 -447
  104. package/dist/frontend-core/template/src/components/ui/data-table/renderers/country-array-cell-renderer.tsx +0 -77
  105. package/dist/frontend-core/template/src/components/ui/data-table/renderers/country-cell-renderer.tsx +0 -56
  106. package/dist/frontend-core/template/src/components/ui/data-table/renderers/favorite-cell-renderer.tsx +0 -68
  107. package/dist/frontend-core/template/src/components/ui/data-table/renderers/links-cell-renderer.tsx +0 -205
  108. package/dist/frontend-core/template/src/components/ui/data-table/utils/columns.ts +0 -351
  109. package/dist/frontend-core/template/src/components/ui/data-table/utils/data-table.utils.ts +0 -49
  110. package/dist/frontend-core/template/src/components/ui/date-picker/date-picker.stories.tsx +0 -149
  111. package/dist/frontend-core/template/src/components/ui/date-picker/date-picker.tsx +0 -30
  112. package/dist/frontend-core/template/src/components/ui/dialog/dialog.stories.tsx +0 -80
  113. package/dist/frontend-core/template/src/components/ui/dialog/dialog.tsx +0 -134
  114. package/dist/frontend-core/template/src/components/ui/drawer/drawer.stories.tsx +0 -104
  115. package/dist/frontend-core/template/src/components/ui/drawer/drawer.tsx +0 -87
  116. package/dist/frontend-core/template/src/components/ui/dropdown-menu/dropdown-menu.stories.tsx +0 -168
  117. package/dist/frontend-core/template/src/components/ui/dropdown-menu/dropdown-menu.tsx +0 -225
  118. package/dist/frontend-core/template/src/components/ui/input/input.stories.tsx +0 -141
  119. package/dist/frontend-core/template/src/components/ui/input/input.tsx +0 -47
  120. package/dist/frontend-core/template/src/components/ui/label/label.stories.tsx +0 -41
  121. package/dist/frontend-core/template/src/components/ui/label/label.tsx +0 -20
  122. package/dist/frontend-core/template/src/components/ui/loader/loader.stories.tsx +0 -45
  123. package/dist/frontend-core/template/src/components/ui/loader/loader.tsx +0 -17
  124. package/dist/frontend-core/template/src/components/ui/mark-value-renderer/mark-value-renderer.stories.tsx +0 -114
  125. package/dist/frontend-core/template/src/components/ui/mark-value-renderer/mark-value-renderer.tsx +0 -48
  126. package/dist/frontend-core/template/src/components/ui/menubar/menu.stories.tsx +0 -134
  127. package/dist/frontend-core/template/src/components/ui/menubar/menubar.tsx +0 -208
  128. package/dist/frontend-core/template/src/components/ui/modal/modal.stories.tsx +0 -297
  129. package/dist/frontend-core/template/src/components/ui/modal/modal.tsx +0 -80
  130. package/dist/frontend-core/template/src/components/ui/navigation-menu/navigation-menu.stories.tsx +0 -213
  131. package/dist/frontend-core/template/src/components/ui/navigation-menu/navigation-menu.tsx +0 -142
  132. package/dist/frontend-core/template/src/components/ui/pagination/pagination.stories.tsx +0 -49
  133. package/dist/frontend-core/template/src/components/ui/pagination/pagination.tsx +0 -84
  134. package/dist/frontend-core/template/src/components/ui/popover/popover.stories.tsx +0 -82
  135. package/dist/frontend-core/template/src/components/ui/popover/popover.tsx +0 -55
  136. package/dist/frontend-core/template/src/components/ui/progress/progress.stories.tsx +0 -80
  137. package/dist/frontend-core/template/src/components/ui/progress/progress.tsx +0 -17
  138. package/dist/frontend-core/template/src/components/ui/radio-group/radio-group.stories.tsx +0 -154
  139. package/dist/frontend-core/template/src/components/ui/radio-group/radio-group.tsx +0 -68
  140. package/dist/frontend-core/template/src/components/ui/resizable/resizable.stories.tsx +0 -73
  141. package/dist/frontend-core/template/src/components/ui/resizable/resizeable.tsx +0 -38
  142. package/dist/frontend-core/template/src/components/ui/scroll-area/scroll-area.stories.tsx +0 -55
  143. package/dist/frontend-core/template/src/components/ui/scroll-area/scroll-area.tsx +0 -39
  144. package/dist/frontend-core/template/src/components/ui/select/select.stories.tsx +0 -297
  145. package/dist/frontend-core/template/src/components/ui/select/select.tsx +0 -227
  146. package/dist/frontend-core/template/src/components/ui/separator/separator.tsx +0 -21
  147. package/dist/frontend-core/template/src/components/ui/separator/seperator.stories.tsx +0 -25
  148. package/dist/frontend-core/template/src/components/ui/sheet/sheet.stories.tsx +0 -45
  149. package/dist/frontend-core/template/src/components/ui/sheet/sheet.tsx +0 -107
  150. package/dist/frontend-core/template/src/components/ui/skeleton/skeleton.stories.tsx +0 -26
  151. package/dist/frontend-core/template/src/components/ui/skeleton/skeleton.tsx +0 -7
  152. package/dist/frontend-core/template/src/components/ui/slider/slider.stories.tsx +0 -101
  153. package/dist/frontend-core/template/src/components/ui/slider/slider.tsx +0 -98
  154. package/dist/frontend-core/template/src/components/ui/spinner/spinner.stories.tsx +0 -19
  155. package/dist/frontend-core/template/src/components/ui/spinner/spinner.tsx +0 -21
  156. package/dist/frontend-core/template/src/components/ui/switch/switch.stories.tsx +0 -33
  157. package/dist/frontend-core/template/src/components/ui/switch/switch.tsx +0 -28
  158. package/dist/frontend-core/template/src/components/ui/tabs/tabs.stories.tsx +0 -215
  159. package/dist/frontend-core/template/src/components/ui/tabs/tabs.tsx +0 -70
  160. package/dist/frontend-core/template/src/components/ui/textarea/textarea.stories.tsx +0 -138
  161. package/dist/frontend-core/template/src/components/ui/textarea/textarea.tsx +0 -40
  162. package/dist/frontend-core/template/src/components/ui/toast/toast.mdx +0 -31
  163. package/dist/frontend-core/template/src/components/ui/toast/toast.stories.tsx +0 -89
  164. package/dist/frontend-core/template/src/components/ui/toggle/toggle.stories.tsx +0 -65
  165. package/dist/frontend-core/template/src/components/ui/toggle/toggle.tsx +0 -38
  166. package/dist/frontend-core/template/src/components/ui/toggle-group/toggle-group.stories.tsx +0 -85
  167. package/dist/frontend-core/template/src/components/ui/toggle-group/toggle-group.tsx +0 -54
  168. package/dist/frontend-core/template/src/components/ui/tooltip/tooltip.stories.tsx +0 -29
  169. package/dist/frontend-core/template/src/components/ui/tooltip/tooltip.tsx +0 -29
@@ -1,227 +0,0 @@
1
- import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from '@radix-ui/react-icons'
2
- import * as SelectPrimitive from '@radix-ui/react-select'
3
- import { Slot } from '@radix-ui/react-slot'
4
-
5
- import { cva, type VariantProps } from 'class-variance-authority'
6
- import * as React from 'react'
7
-
8
- import { cn } from '@lib/utils'
9
-
10
- type SelectProps = React.ComponentProps<typeof SelectPrimitive.Root> & {
11
- /**
12
- * E2E test_id to identify the select.
13
- */
14
- __e2e_test_id__?: string
15
- }
16
-
17
- function Select({ __e2e_test_id__, ...rest }: SelectProps) {
18
- return <SelectPrimitive.Root data-test-id={__e2e_test_id__} {...rest} />
19
- }
20
-
21
- function SelectGroup({ ...props }: React.ComponentProps<typeof SelectPrimitive.Group>) {
22
- return <SelectPrimitive.Group data-slot="select-group" {...props} />
23
- }
24
-
25
- function SelectValue({ ...props }: React.ComponentProps<typeof SelectPrimitive.Value>) {
26
- return <SelectPrimitive.Value data-slot="select-value" {...props} />
27
- }
28
-
29
- const selectTriggerVariants = cva(
30
- "data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground flex items-center gap-2 rounded-md border text-md shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50",
31
- {
32
- variants: {
33
- size: {
34
- default: 'h-9 px-3 py-2',
35
- sm: 'h-8 px-2.5 py-1.5',
36
- lg: 'h-10 px-4 py-2.5',
37
- xs: 'h-7 px-2 py-1',
38
- },
39
- variant: {
40
- default:
41
- 'justify-between border-input focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 bg-transparent',
42
- simple:
43
- 'justify-start bg-background cursor-pointer border-foreground text-left data-[placeholder]:border-(--discreet-border)',
44
- },
45
- },
46
- defaultVariants: {
47
- size: 'default',
48
- variant: 'default',
49
- },
50
- },
51
- )
52
- const selectTriggerTextVariants = cva('', {
53
- variants: {
54
- variant: {
55
- default: '',
56
- simple: 'overflow-hidden whitespace-nowrap text-ellipsis',
57
- },
58
- },
59
- defaultVariants: {
60
- variant: 'default',
61
- },
62
- })
63
-
64
- function SelectTrigger({
65
- className,
66
- size,
67
- variant,
68
- children,
69
- asChild = false,
70
- ...props
71
- }: React.ComponentProps<typeof SelectPrimitive.Trigger> &
72
- VariantProps<typeof selectTriggerVariants> & { asChild?: boolean }) {
73
- const Comp = asChild ? Slot : SelectPrimitive.Trigger
74
-
75
- return (
76
- <Comp
77
- data-slot="select-trigger"
78
- data-size={size}
79
- className={cn(selectTriggerVariants({ size, variant, className }), '[&[data-state=open]>svg]:rotate-180')}
80
- {...props}
81
- >
82
- <span className={cn('flex-1', selectTriggerTextVariants({ variant }))}>{children}</span>
83
- <SelectPrimitive.Icon asChild>
84
- <ChevronDownIcon className="flex-none size-4 opacity-50 " />
85
- </SelectPrimitive.Icon>
86
- </Comp>
87
- )
88
- }
89
-
90
- function SelectContent({
91
- className,
92
- children,
93
- position = 'popper',
94
- ...props
95
- }: React.ComponentProps<typeof SelectPrimitive.Content>) {
96
- return (
97
- <SelectPrimitive.Portal>
98
- <SelectPrimitive.Content
99
- data-slot="select-content"
100
- className={cn(
101
- 'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md',
102
- className,
103
- position === 'popper' &&
104
- 'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',
105
- )}
106
- position={position}
107
- {...props}
108
- >
109
- <SelectScrollUpButton />
110
- <SelectPrimitive.Viewport
111
- className={cn(
112
- 'p-1',
113
- position === 'popper' &&
114
- 'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1',
115
- )}
116
- >
117
- {children}
118
- </SelectPrimitive.Viewport>
119
- <SelectScrollDownButton />
120
- </SelectPrimitive.Content>
121
- </SelectPrimitive.Portal>
122
- )
123
- }
124
-
125
- function SelectLabel({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Label>) {
126
- return (
127
- <SelectPrimitive.Label
128
- data-slot="select-label"
129
- className={cn('text-muted-foreground px-2 py-1.5 text-xs', className)}
130
- {...props}
131
- />
132
- )
133
- }
134
-
135
- const selectItemVariants = cva(
136
- "focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded pr-8 pl-2 text-md outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
137
- {
138
- variants: {
139
- type: {
140
- default: '',
141
- deselect: 'italic text-muted-foreground focus:text-muted-foreground',
142
- },
143
- spacing: {
144
- sm: 'py-1',
145
- md: 'py-1.5',
146
- lg: 'py-2.5',
147
- },
148
- },
149
- defaultVariants: {
150
- type: 'default',
151
- spacing: 'md',
152
- },
153
- },
154
- )
155
-
156
- function SelectItem({
157
- className,
158
- children,
159
- type,
160
- spacing,
161
- ...props
162
- }: React.ComponentProps<typeof SelectPrimitive.Item> & VariantProps<typeof selectItemVariants>) {
163
- return (
164
- <SelectPrimitive.Item
165
- data-slot="select-item"
166
- className={cn(selectItemVariants({ type, spacing, className }))}
167
- {...props}
168
- >
169
- <span className="absolute right-2 flex size-3.5 items-center justify-center">
170
- <SelectPrimitive.ItemIndicator>
171
- <CheckIcon className="size-4 " />
172
- </SelectPrimitive.ItemIndicator>
173
- </span>
174
- <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
175
- </SelectPrimitive.Item>
176
- )
177
- }
178
-
179
- function SelectSeparator({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Separator>) {
180
- return (
181
- <SelectPrimitive.Separator
182
- data-slot="select-separator"
183
- className={cn('bg-border pointer-events-none -mx-1 my-1 h-px', className)}
184
- {...props}
185
- />
186
- )
187
- }
188
-
189
- function SelectScrollUpButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>) {
190
- return (
191
- <SelectPrimitive.ScrollUpButton
192
- data-slot="select-scroll-up-button"
193
- className={cn('flex cursor-default items-center justify-center py-1', className)}
194
- {...props}
195
- >
196
- <ChevronUpIcon className="size-4" />
197
- </SelectPrimitive.ScrollUpButton>
198
- )
199
- }
200
-
201
- function SelectScrollDownButton({
202
- className,
203
- ...props
204
- }: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>) {
205
- return (
206
- <SelectPrimitive.ScrollDownButton
207
- data-slot="select-scroll-down-button"
208
- className={cn('flex cursor-default items-center justify-center py-1', className)}
209
- {...props}
210
- >
211
- <ChevronDownIcon className="size-4" />
212
- </SelectPrimitive.ScrollDownButton>
213
- )
214
- }
215
-
216
- export {
217
- Select,
218
- SelectContent,
219
- SelectGroup,
220
- SelectItem,
221
- SelectLabel,
222
- SelectScrollDownButton,
223
- SelectScrollUpButton,
224
- SelectSeparator,
225
- SelectTrigger,
226
- SelectValue,
227
- }
@@ -1,21 +0,0 @@
1
- import * as SeparatorPrimitive from '@radix-ui/react-separator'
2
-
3
- import * as React from 'react'
4
-
5
- import { cn } from '@lib/utils'
6
-
7
- const Separator = React.forwardRef<
8
- React.ElementRef<typeof SeparatorPrimitive.Root>,
9
- React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>
10
- >(({ className, orientation = 'horizontal', decorative = true, ...props }, ref) => (
11
- <SeparatorPrimitive.Root
12
- ref={ref}
13
- decorative={decorative}
14
- orientation={orientation}
15
- className={cn('shrink-0 bg-border', orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]', className)}
16
- {...props}
17
- />
18
- ))
19
- Separator.displayName = SeparatorPrimitive.Root.displayName
20
-
21
- export { Separator }
@@ -1,25 +0,0 @@
1
- import { Separator } from './separator'
2
- import React from 'react'
3
- import { Meta, StoryObj } from '@storybook/react-vite'
4
-
5
- const meta: Meta<typeof Separator> = {
6
- title: 'Separator',
7
- component: Separator,
8
- tags: ['autodocs'],
9
- argTypes: {
10
- orientation: {
11
- control: 'radio',
12
- options: ['horizontal', 'vertical'],
13
- },
14
- },
15
- }
16
- export default meta
17
-
18
- export const Default: StoryObj<typeof meta> = {
19
- args: { orientation: 'horizontal' },
20
- render: (args) => (
21
- <div className="flex items-center justify-center h-56">
22
- <Separator orientation={args.orientation} />
23
- </div>
24
- ),
25
- }
@@ -1,45 +0,0 @@
1
- import {
2
- Sheet,
3
- SheetClose,
4
- SheetContent,
5
- SheetDescription,
6
- SheetFooter,
7
- SheetHeader,
8
- SheetTitle,
9
- SheetTrigger,
10
- } from './sheet'
11
- import { Meta, StoryObj } from '@storybook/react-vite'
12
- import { Button } from '@components/ui/button/button'
13
-
14
- const meta: Meta<typeof Sheet> = {
15
- title: 'Sheet',
16
- component: Sheet,
17
- tags: ['autodocs'],
18
- parameters: {
19
- layout: 'centered',
20
- },
21
- }
22
- export default meta
23
-
24
- export const Default: StoryObj<typeof meta> = {
25
- render: () => (
26
- <div className="flex items-center justify-center">
27
- <Sheet>
28
- <SheetTrigger asChild>
29
- <Button variant="outline">Open</Button>
30
- </SheetTrigger>
31
- <SheetContent>
32
- <SheetHeader>
33
- <SheetTitle>Edit profile</SheetTitle>
34
- <SheetDescription>Make changes to your profile here. Click save when you're done.</SheetDescription>
35
- </SheetHeader>
36
- <SheetFooter>
37
- <SheetClose asChild>
38
- <Button type="submit">Save changes</Button>
39
- </SheetClose>
40
- </SheetFooter>
41
- </SheetContent>
42
- </Sheet>
43
- </div>
44
- ),
45
- }
@@ -1,107 +0,0 @@
1
- import * as SheetPrimitive from '@radix-ui/react-dialog'
2
- import { Cross2Icon } from '@radix-ui/react-icons'
3
-
4
- import { cva, type VariantProps } from 'class-variance-authority'
5
- import * as React from 'react'
6
-
7
- import { cn } from '@lib/utils'
8
-
9
- const Sheet = SheetPrimitive.Root
10
-
11
- const SheetTrigger = SheetPrimitive.Trigger
12
-
13
- const SheetClose = SheetPrimitive.Close
14
-
15
- const SheetPortal = SheetPrimitive.Portal
16
-
17
- const SheetOverlay = React.forwardRef<
18
- React.ElementRef<typeof SheetPrimitive.Overlay>,
19
- React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>
20
- >(({ className, ...props }, ref) => (
21
- <SheetPrimitive.Overlay
22
- className={cn(
23
- 'fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
24
- className,
25
- )}
26
- {...props}
27
- ref={ref}
28
- />
29
- ))
30
- SheetOverlay.displayName = SheetPrimitive.Overlay.displayName
31
-
32
- const sheetVariants = cva(
33
- 'fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out',
34
- {
35
- variants: {
36
- side: {
37
- top: 'inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top',
38
- bottom:
39
- 'inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom',
40
- left: 'inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm',
41
- right:
42
- 'inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm',
43
- },
44
- },
45
- defaultVariants: {
46
- side: 'right',
47
- },
48
- },
49
- )
50
-
51
- type SheetContentProps = React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content> &
52
- VariantProps<typeof sheetVariants>
53
-
54
- const SheetContent = React.forwardRef<React.ElementRef<typeof SheetPrimitive.Content>, SheetContentProps>(
55
- ({ side = 'right', className, children, ...props }, ref) => (
56
- <SheetPortal>
57
- <SheetOverlay />
58
- <SheetPrimitive.Content ref={ref} className={cn(sheetVariants({ side }), className)} {...props}>
59
- <SheetPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
60
- <Cross2Icon className="h-4 w-4" />
61
- <span className="sr-only">Close</span>
62
- </SheetPrimitive.Close>
63
- {children}
64
- </SheetPrimitive.Content>
65
- </SheetPortal>
66
- ),
67
- )
68
- SheetContent.displayName = SheetPrimitive.Content.displayName
69
-
70
- const SheetHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
71
- <div className={cn('flex flex-col space-y-2 text-center sm:text-left', className)} {...props} />
72
- )
73
- SheetHeader.displayName = 'SheetHeader'
74
-
75
- const SheetFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
76
- <div className={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)} {...props} />
77
- )
78
- SheetFooter.displayName = 'SheetFooter'
79
-
80
- const SheetTitle = React.forwardRef<
81
- React.ElementRef<typeof SheetPrimitive.Title>,
82
- React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>
83
- >(({ className, ...props }, ref) => (
84
- <SheetPrimitive.Title ref={ref} className={cn('text-lg font-semibold text-foreground', className)} {...props} />
85
- ))
86
- SheetTitle.displayName = SheetPrimitive.Title.displayName
87
-
88
- const SheetDescription = React.forwardRef<
89
- React.ElementRef<typeof SheetPrimitive.Description>,
90
- React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>
91
- >(({ className, ...props }, ref) => (
92
- <SheetPrimitive.Description ref={ref} className={cn('text-sm text-muted-foreground', className)} {...props} />
93
- ))
94
- SheetDescription.displayName = SheetPrimitive.Description.displayName
95
-
96
- export {
97
- Sheet,
98
- SheetPortal,
99
- SheetOverlay,
100
- SheetTrigger,
101
- SheetClose,
102
- SheetContent,
103
- SheetHeader,
104
- SheetFooter,
105
- SheetTitle,
106
- SheetDescription,
107
- }
@@ -1,26 +0,0 @@
1
- import { Skeleton } from './skeleton'
2
- import { Meta, StoryObj } from '@storybook/react-vite'
3
-
4
- const meta: Meta<typeof Skeleton> = {
5
- title: 'Skeleton',
6
- component: Skeleton,
7
- tags: ['autodocs'],
8
- parameters: {
9
- layout: 'centered',
10
- },
11
- }
12
- export default meta
13
-
14
- export const Default: StoryObj<typeof meta> = {
15
- render: (args) => (
16
- <div className="flex items-center justify-center">
17
- <div className="flex flex-col space-y-3">
18
- <Skeleton className="h-[125px] w-[250px] rounded-xl" />
19
- <div className="space-y-2">
20
- <Skeleton className="h-4 w-[250px]" />
21
- <Skeleton className="h-4 w-[200px]" />
22
- </div>
23
- </div>
24
- </div>
25
- ),
26
- }
@@ -1,7 +0,0 @@
1
- import { cn } from '@lib/utils'
2
-
3
- function Skeleton({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {
4
- return <div className={cn('animate-pulse rounded-md bg-primary/10', className)} {...props} />
5
- }
6
-
7
- export { Skeleton }
@@ -1,101 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react-vite'
2
- import { expect, userEvent, screen } from 'storybook/test'
3
- import { useState } from 'react'
4
- import { Slider } from './slider'
5
-
6
- const meta = {
7
- title: 'Slider',
8
- component: Slider,
9
- parameters: {
10
- layout: 'centered',
11
- },
12
- tags: ['autodocs'],
13
- argTypes: {
14
- min: { control: 'number' },
15
- max: { control: 'number' },
16
- step: { control: 'number' },
17
- defaultValue: { control: 'object' },
18
- sliderVariant: {
19
- control: 'select',
20
- options: ['default', 'gray'],
21
- },
22
- knobVariant: {
23
- control: 'select',
24
- options: ['default', 'gray'],
25
- },
26
- },
27
- args: {
28
- min: 0,
29
- max: 100,
30
- step: 1,
31
- defaultValue: [25],
32
- sliderVariant: 'default',
33
- knobVariant: 'default',
34
- },
35
- } satisfies Meta<typeof Slider>
36
-
37
- export default meta
38
-
39
- type Story = StoryObj<typeof meta>
40
-
41
- export const Default: Story = {
42
- args: {
43
- defaultValue: [25],
44
- className: 'w-64',
45
- },
46
- }
47
-
48
- export const Variants: Story = {
49
- render: () => {
50
- return (
51
- <div className="space-y-4">
52
- <div className="flex flex-col items-center space-y-2">
53
- <Slider defaultValue={[25]} className="w-64" />
54
- <span>Default</span>
55
- </div>
56
- <div className="flex flex-col items-center space-y-2">
57
- <Slider defaultValue={[25, 75]} className="w-64" />
58
- <span>Range</span>
59
- </div>
60
- <div className="flex flex-col items-center space-y-2">
61
- <Slider defaultValue={[25]} sliderVariant="gray" className="w-64" />
62
- <span>Gray Slider</span>
63
- </div>
64
- <div className="flex flex-col items-center space-y-2">
65
- <Slider defaultValue={[25]} knobVariant="gray" className="w-64" />
66
- <span>Gray Knob</span>
67
- </div>
68
- <div className="flex flex-col items-center space-y-2">
69
- <Slider defaultValue={[25]} sliderVariant="gray" knobVariant="gray" className="w-64" />
70
- <span>Gray Both</span>
71
- </div>
72
- </div>
73
- )
74
- },
75
- }
76
-
77
- export const InteractiveTest: Story = {
78
- render: () => {
79
- const [value, setValue] = useState<number[]>([30])
80
- return (
81
- <div className="space-y-4">
82
- <Slider value={value} onValueChange={setValue} className="w-64" data-testid="controlled-slider" />
83
- <p data-testid="slider-value">Value: {value}</p>
84
- </div>
85
- )
86
- },
87
- play: async () => {
88
- // Find the slider
89
- const slider = screen.getByTestId('controlled-slider')
90
- const valueText = screen.getByTestId('slider-value')
91
-
92
- // Get the thumb and track to simulate interactions
93
- const thumb = slider.querySelector('[data-orientation]')
94
-
95
- // Click on a different position on the slider
96
- await userEvent.click(screen.getByTestId('controlled-slider'))
97
-
98
- // Check if the value updates (approximate check)
99
- await expect(valueText.textContent).toBe('Value: 0')
100
- },
101
- }
@@ -1,98 +0,0 @@
1
- import * as SliderPrimitive from '@radix-ui/react-slider'
2
-
3
- import { cva, type VariantProps } from 'class-variance-authority'
4
- import type { CSSProperties } from 'react'
5
- import * as React from 'react'
6
-
7
- import { cn } from '@lib/utils'
8
-
9
- const sliderVariants = cva('absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full', {
10
- variants: {
11
- sliderVariant: {
12
- default: 'bg-primary',
13
- gray: 'bg-muted-foreground',
14
- },
15
- },
16
- defaultVariants: {
17
- sliderVariant: 'default',
18
- },
19
- })
20
-
21
- const knobVariants = cva(
22
- 'bg-background block size-4 shrink-0 rounded-full border shadow-sm transition-[color,box-shadow] focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50',
23
- {
24
- variants: {
25
- knobVariant: {
26
- default: 'border-primary ring-ring/50 hover:ring-4 focus-visible:ring-4',
27
- gray: 'border-muted-foreground border-2',
28
- },
29
- },
30
- defaultVariants: {
31
- knobVariant: 'default',
32
- },
33
- },
34
- )
35
-
36
- type SliderProps = React.ComponentProps<typeof SliderPrimitive.Root> &
37
- VariantProps<typeof sliderVariants> &
38
- VariantProps<typeof knobVariants> & { knobSize?: number }
39
-
40
- function Slider({
41
- className,
42
- defaultValue,
43
- value,
44
- min = 0,
45
- max = 100,
46
- sliderVariant,
47
- knobVariant,
48
- knobSize,
49
- ...props
50
- }: SliderProps) {
51
- const _values = React.useMemo(() => {
52
- if (Array.isArray(value)) {
53
- return value
54
- } else if (Array.isArray(defaultValue)) {
55
- return defaultValue
56
- }
57
- return [min, max]
58
- }, [value, defaultValue, min, max])
59
-
60
- return (
61
- <SliderPrimitive.Root
62
- data-slot="slider"
63
- defaultValue={defaultValue}
64
- value={value}
65
- min={min}
66
- max={max}
67
- className={cn(
68
- 'cursor-pointer relative flex w-full touch-none items-center select-none data-[disabled]:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col',
69
- className,
70
- )}
71
- {...props}
72
- >
73
- <SliderPrimitive.Track
74
- data-slot="slider-track"
75
- className={cn(
76
- 'bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5',
77
- )}
78
- >
79
- <SliderPrimitive.Range data-slot="slider-range" className={cn(sliderVariants({ sliderVariant }))} />
80
- </SliderPrimitive.Track>
81
- {Array.from({ length: _values.length }, (_, index) => (
82
- <SliderPrimitive.Thumb
83
- data-slot="slider-thumb"
84
- key={index}
85
- className={cn(
86
- knobVariants({
87
- knobVariant,
88
- }),
89
- knobSize ? 'size-(--knob-size)' : '',
90
- )}
91
- style={{ '--knob-size': `${knobSize}px` } as CSSProperties}
92
- />
93
- ))}
94
- </SliderPrimitive.Root>
95
- )
96
- }
97
-
98
- export { Slider, sliderVariants, knobVariants }
@@ -1,19 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react-vite'
2
- import { Spinner } from './spinner'
3
-
4
- const meta = {
5
- title: 'Spinner',
6
- component: Spinner,
7
- parameters: {
8
- layout: 'centered',
9
- },
10
- tags: ['autodocs'],
11
- } satisfies Meta<typeof Spinner>
12
-
13
- export default meta
14
-
15
- type Story = StoryObj<typeof meta>
16
-
17
- export const Default: Story = {
18
- render: () => <Spinner classNames="w-8 h-8" />,
19
- }