howone 0.0.3 → 0.0.5

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 (167) hide show
  1. package/package.json +1 -1
  2. package/templates/nextjs/.prettierignore +7 -0
  3. package/templates/nextjs/.prettierrc +11 -0
  4. package/templates/nextjs/README.md +12 -27
  5. package/templates/nextjs/app/globals.css +123 -40
  6. package/templates/nextjs/app/layout.tsx +19 -19
  7. package/templates/nextjs/app/page.tsx +13 -60
  8. package/templates/nextjs/bun.lock +925 -53
  9. package/templates/nextjs/components/.gitkeep +0 -0
  10. package/templates/nextjs/components/theme-provider.tsx +71 -0
  11. package/templates/nextjs/components/ui/accordion.tsx +81 -0
  12. package/templates/nextjs/components/ui/alert-dialog.tsx +199 -0
  13. package/templates/nextjs/components/ui/alert.tsx +76 -0
  14. package/templates/nextjs/components/ui/aspect-ratio.tsx +11 -0
  15. package/templates/nextjs/components/ui/avatar.tsx +112 -0
  16. package/templates/nextjs/components/ui/badge.tsx +49 -0
  17. package/templates/nextjs/components/ui/breadcrumb.tsx +122 -0
  18. package/templates/nextjs/components/ui/button-group.tsx +83 -0
  19. package/templates/nextjs/components/ui/button.tsx +67 -0
  20. package/templates/nextjs/components/ui/calendar.tsx +222 -0
  21. package/templates/nextjs/components/ui/card.tsx +103 -0
  22. package/templates/nextjs/components/ui/carousel.tsx +242 -0
  23. package/templates/nextjs/components/ui/chart.tsx +373 -0
  24. package/templates/nextjs/components/ui/checkbox.tsx +33 -0
  25. package/templates/nextjs/components/ui/collapsible.tsx +33 -0
  26. package/templates/nextjs/components/ui/combobox.tsx +299 -0
  27. package/templates/nextjs/components/ui/command.tsx +195 -0
  28. package/templates/nextjs/components/ui/context-menu.tsx +263 -0
  29. package/templates/nextjs/components/ui/dialog.tsx +168 -0
  30. package/templates/nextjs/components/ui/direction.tsx +22 -0
  31. package/templates/nextjs/components/ui/drawer.tsx +134 -0
  32. package/templates/nextjs/components/ui/dropdown-menu.tsx +269 -0
  33. package/templates/nextjs/components/ui/empty.tsx +104 -0
  34. package/templates/nextjs/components/ui/field.tsx +238 -0
  35. package/templates/nextjs/components/ui/hover-card.tsx +44 -0
  36. package/templates/nextjs/components/ui/input-group.tsx +156 -0
  37. package/templates/nextjs/components/ui/input-otp.tsx +87 -0
  38. package/templates/nextjs/components/ui/input.tsx +19 -0
  39. package/templates/nextjs/components/ui/item.tsx +196 -0
  40. package/templates/nextjs/components/ui/kbd.tsx +26 -0
  41. package/templates/nextjs/components/ui/label.tsx +24 -0
  42. package/templates/nextjs/components/ui/menubar.tsx +280 -0
  43. package/templates/nextjs/components/ui/native-select.tsx +61 -0
  44. package/templates/nextjs/components/ui/navigation-menu.tsx +164 -0
  45. package/templates/nextjs/components/ui/pagination.tsx +129 -0
  46. package/templates/nextjs/components/ui/popover.tsx +89 -0
  47. package/templates/nextjs/components/ui/progress.tsx +31 -0
  48. package/templates/nextjs/components/ui/radio-group.tsx +44 -0
  49. package/templates/nextjs/components/ui/resizable.tsx +50 -0
  50. package/templates/nextjs/components/ui/scroll-area.tsx +55 -0
  51. package/templates/nextjs/components/ui/select.tsx +192 -0
  52. package/templates/nextjs/components/ui/separator.tsx +28 -0
  53. package/templates/nextjs/components/ui/sheet.tsx +147 -0
  54. package/templates/nextjs/components/ui/sidebar.tsx +702 -0
  55. package/templates/nextjs/components/ui/skeleton.tsx +13 -0
  56. package/templates/nextjs/components/ui/slider.tsx +59 -0
  57. package/templates/nextjs/components/ui/sonner.tsx +49 -0
  58. package/templates/nextjs/components/ui/spinner.tsx +10 -0
  59. package/templates/nextjs/components/ui/switch.tsx +33 -0
  60. package/templates/nextjs/components/ui/table.tsx +116 -0
  61. package/templates/nextjs/components/ui/tabs.tsx +90 -0
  62. package/templates/nextjs/components/ui/textarea.tsx +18 -0
  63. package/templates/nextjs/components/ui/toggle-group.tsx +89 -0
  64. package/templates/nextjs/components/ui/toggle.tsx +47 -0
  65. package/templates/nextjs/components/ui/tooltip.tsx +57 -0
  66. package/templates/nextjs/components.json +25 -0
  67. package/templates/nextjs/hooks/.gitkeep +0 -0
  68. package/templates/nextjs/hooks/use-mobile.ts +19 -0
  69. package/templates/nextjs/lib/.gitkeep +0 -0
  70. package/templates/nextjs/lib/sdk.ts +7 -0
  71. package/templates/nextjs/lib/utils.ts +6 -0
  72. package/templates/nextjs/next.config.mjs +4 -0
  73. package/templates/vite/.prettierignore +7 -0
  74. package/templates/vite/.prettierrc +11 -0
  75. package/templates/vite/AGENTS.md +0 -0
  76. package/templates/vite/README.md +12 -64
  77. package/templates/vite/bun.lock +1478 -0
  78. package/templates/vite/components.json +25 -0
  79. package/templates/vite/eslint.config.js +1 -0
  80. package/templates/vite/index.html +2 -2
  81. package/templates/vite/package.json +39 -13
  82. package/templates/vite/public/vite.svg +1 -0
  83. package/templates/vite/src/App.tsx +6 -115
  84. package/templates/vite/src/components/theme-provider.tsx +230 -0
  85. package/templates/vite/src/components/ui/accordion.tsx +79 -0
  86. package/templates/vite/src/components/ui/alert-dialog.tsx +197 -0
  87. package/templates/vite/src/components/ui/alert.tsx +76 -0
  88. package/templates/vite/src/components/ui/aspect-ratio.tsx +11 -0
  89. package/templates/vite/src/components/ui/avatar.tsx +110 -0
  90. package/templates/vite/src/components/ui/badge.tsx +49 -0
  91. package/templates/vite/src/components/ui/breadcrumb.tsx +122 -0
  92. package/templates/vite/src/components/ui/button-group.tsx +83 -0
  93. package/templates/vite/src/components/ui/button.tsx +67 -0
  94. package/templates/vite/src/components/ui/calendar.tsx +222 -0
  95. package/templates/vite/src/components/ui/card.tsx +103 -0
  96. package/templates/vite/src/components/ui/carousel.tsx +240 -0
  97. package/templates/vite/src/components/ui/chart.tsx +373 -0
  98. package/templates/vite/src/components/ui/checkbox.tsx +31 -0
  99. package/templates/vite/src/components/ui/collapsible.tsx +33 -0
  100. package/templates/vite/src/components/ui/combobox.tsx +299 -0
  101. package/templates/vite/src/components/ui/command.tsx +193 -0
  102. package/templates/vite/src/components/ui/context-menu.tsx +261 -0
  103. package/templates/vite/src/components/ui/dialog.tsx +168 -0
  104. package/templates/vite/src/components/ui/direction.tsx +22 -0
  105. package/templates/vite/src/components/ui/drawer.tsx +132 -0
  106. package/templates/vite/src/components/ui/dropdown-menu.tsx +269 -0
  107. package/templates/vite/src/components/ui/empty.tsx +104 -0
  108. package/templates/vite/src/components/ui/field.tsx +238 -0
  109. package/templates/vite/src/components/ui/hover-card.tsx +42 -0
  110. package/templates/vite/src/components/ui/input-group.tsx +154 -0
  111. package/templates/vite/src/components/ui/input-otp.tsx +87 -0
  112. package/templates/vite/src/components/ui/input.tsx +19 -0
  113. package/templates/vite/src/components/ui/item.tsx +196 -0
  114. package/templates/vite/src/components/ui/kbd.tsx +26 -0
  115. package/templates/vite/src/components/ui/label.tsx +22 -0
  116. package/templates/vite/src/components/ui/menubar.tsx +280 -0
  117. package/templates/vite/src/components/ui/native-select.tsx +61 -0
  118. package/templates/vite/src/components/ui/navigation-menu.tsx +164 -0
  119. package/templates/vite/src/components/ui/pagination.tsx +129 -0
  120. package/templates/vite/src/components/ui/popover.tsx +87 -0
  121. package/templates/vite/src/components/ui/progress.tsx +31 -0
  122. package/templates/vite/src/components/ui/radio-group.tsx +42 -0
  123. package/templates/vite/src/components/ui/resizable.tsx +50 -0
  124. package/templates/vite/src/components/ui/scroll-area.tsx +53 -0
  125. package/templates/vite/src/components/ui/select.tsx +192 -0
  126. package/templates/vite/src/components/ui/separator.tsx +26 -0
  127. package/templates/vite/src/components/ui/sheet.tsx +145 -0
  128. package/templates/vite/src/components/ui/sidebar.tsx +700 -0
  129. package/templates/vite/src/components/ui/skeleton.tsx +13 -0
  130. package/templates/vite/src/components/ui/slider.tsx +59 -0
  131. package/templates/vite/src/components/ui/sonner.tsx +47 -0
  132. package/templates/vite/src/components/ui/spinner.tsx +10 -0
  133. package/templates/vite/src/components/ui/switch.tsx +33 -0
  134. package/templates/vite/src/components/ui/table.tsx +114 -0
  135. package/templates/vite/src/components/ui/tabs.tsx +90 -0
  136. package/templates/vite/src/components/ui/textarea.tsx +18 -0
  137. package/templates/vite/src/components/ui/toggle-group.tsx +89 -0
  138. package/templates/vite/src/components/ui/toggle.tsx +45 -0
  139. package/templates/vite/src/components/ui/tooltip.tsx +57 -0
  140. package/templates/vite/src/hooks/use-mobile.ts +19 -0
  141. package/templates/vite/src/index.css +125 -103
  142. package/templates/vite/src/lib/sdk.ts +7 -0
  143. package/templates/vite/src/lib/utils.ts +6 -0
  144. package/templates/vite/src/main.tsx +11 -7
  145. package/templates/vite/tsconfig.app.json +11 -4
  146. package/templates/vite/tsconfig.json +7 -1
  147. package/templates/vite/tsconfig.node.json +5 -3
  148. package/templates/vite/vite.config.ts +10 -3
  149. package/templates/nextjs/AGENTS.md +0 -5
  150. package/templates/nextjs/CLAUDE.md +0 -1
  151. package/templates/nextjs/app/page.module.css +0 -142
  152. package/templates/nextjs/gitignore +0 -41
  153. package/templates/nextjs/next-env.d.ts +0 -6
  154. package/templates/nextjs/next.config.ts +0 -7
  155. package/templates/nextjs/package.json +0 -32
  156. package/templates/nextjs/public/file.svg +0 -1
  157. package/templates/nextjs/public/globe.svg +0 -1
  158. package/templates/nextjs/public/next.svg +0 -1
  159. package/templates/nextjs/public/vercel.svg +0 -1
  160. package/templates/nextjs/public/window.svg +0 -1
  161. package/templates/nextjs/tsconfig.json +0 -34
  162. package/templates/vite/gitignore +0 -24
  163. package/templates/vite/public/favicon.svg +0 -1
  164. package/templates/vite/public/icons.svg +0 -24
  165. package/templates/vite/src/App.css +0 -184
  166. package/templates/vite/src/assets/hero.png +0 -0
  167. package/templates/vite/src/assets/vite.svg +0 -1
@@ -0,0 +1,59 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+ import { Slider as SliderPrimitive } from "radix-ui"
5
+
6
+ import { cn } from "@/lib/utils"
7
+
8
+ function Slider({
9
+ className,
10
+ defaultValue,
11
+ value,
12
+ min = 0,
13
+ max = 100,
14
+ ...props
15
+ }: React.ComponentProps<typeof SliderPrimitive.Root>) {
16
+ const _values = React.useMemo(
17
+ () =>
18
+ Array.isArray(value)
19
+ ? value
20
+ : Array.isArray(defaultValue)
21
+ ? defaultValue
22
+ : [min, max],
23
+ [value, defaultValue, min, max]
24
+ )
25
+
26
+ return (
27
+ <SliderPrimitive.Root
28
+ data-slot="slider"
29
+ defaultValue={defaultValue}
30
+ value={value}
31
+ min={min}
32
+ max={max}
33
+ className={cn(
34
+ "relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-vertical:h-full data-vertical:min-h-40 data-vertical:w-auto data-vertical:flex-col",
35
+ className
36
+ )}
37
+ {...props}
38
+ >
39
+ <SliderPrimitive.Track
40
+ data-slot="slider-track"
41
+ className="relative grow overflow-hidden rounded-full bg-muted data-horizontal:h-1 data-horizontal:w-full data-vertical:h-full data-vertical:w-1"
42
+ >
43
+ <SliderPrimitive.Range
44
+ data-slot="slider-range"
45
+ className="absolute bg-primary select-none data-horizontal:h-full data-vertical:w-full"
46
+ />
47
+ </SliderPrimitive.Track>
48
+ {Array.from({ length: _values.length }, (_, index) => (
49
+ <SliderPrimitive.Thumb
50
+ data-slot="slider-thumb"
51
+ key={index}
52
+ className="relative block size-3 shrink-0 rounded-full border border-ring bg-white ring-ring/50 transition-[color,box-shadow] select-none after:absolute after:-inset-2 hover:ring-3 focus-visible:ring-3 focus-visible:outline-hidden active:ring-3 disabled:pointer-events-none disabled:opacity-50"
53
+ />
54
+ ))}
55
+ </SliderPrimitive.Root>
56
+ )
57
+ }
58
+
59
+ export { Slider }
@@ -0,0 +1,49 @@
1
+ "use client"
2
+
3
+ import { useTheme } from "next-themes"
4
+ import { Toaster as Sonner, type ToasterProps } from "sonner"
5
+ import { CircleCheckIcon, InfoIcon, TriangleAlertIcon, OctagonXIcon, Loader2Icon } from "lucide-react"
6
+
7
+ const Toaster = ({ ...props }: ToasterProps) => {
8
+ const { theme = "system" } = useTheme()
9
+
10
+ return (
11
+ <Sonner
12
+ theme={theme as ToasterProps["theme"]}
13
+ className="toaster group"
14
+ icons={{
15
+ success: (
16
+ <CircleCheckIcon className="size-4" />
17
+ ),
18
+ info: (
19
+ <InfoIcon className="size-4" />
20
+ ),
21
+ warning: (
22
+ <TriangleAlertIcon className="size-4" />
23
+ ),
24
+ error: (
25
+ <OctagonXIcon className="size-4" />
26
+ ),
27
+ loading: (
28
+ <Loader2Icon className="size-4 animate-spin" />
29
+ ),
30
+ }}
31
+ style={
32
+ {
33
+ "--normal-bg": "var(--popover)",
34
+ "--normal-text": "var(--popover-foreground)",
35
+ "--normal-border": "var(--border)",
36
+ "--border-radius": "var(--radius)",
37
+ } as React.CSSProperties
38
+ }
39
+ toastOptions={{
40
+ classNames: {
41
+ toast: "cn-toast",
42
+ },
43
+ }}
44
+ {...props}
45
+ />
46
+ )
47
+ }
48
+
49
+ export { Toaster }
@@ -0,0 +1,10 @@
1
+ import { cn } from "@/lib/utils"
2
+ import { Loader2Icon } from "lucide-react"
3
+
4
+ function Spinner({ className, ...props }: React.ComponentProps<"svg">) {
5
+ return (
6
+ <Loader2Icon role="status" aria-label="Loading" className={cn("size-4 animate-spin", className)} {...props} />
7
+ )
8
+ }
9
+
10
+ export { Spinner }
@@ -0,0 +1,33 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+ import { Switch as SwitchPrimitive } from "radix-ui"
5
+
6
+ import { cn } from "@/lib/utils"
7
+
8
+ function Switch({
9
+ className,
10
+ size = "default",
11
+ ...props
12
+ }: React.ComponentProps<typeof SwitchPrimitive.Root> & {
13
+ size?: "sm" | "default"
14
+ }) {
15
+ return (
16
+ <SwitchPrimitive.Root
17
+ data-slot="switch"
18
+ data-size={size}
19
+ className={cn(
20
+ "peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-[size=default]:h-[18.4px] data-[size=default]:w-[32px] data-[size=sm]:h-[14px] data-[size=sm]:w-[24px] dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:bg-primary data-unchecked:bg-input dark:data-unchecked:bg-input/80 data-disabled:cursor-not-allowed data-disabled:opacity-50",
21
+ className
22
+ )}
23
+ {...props}
24
+ >
25
+ <SwitchPrimitive.Thumb
26
+ data-slot="switch-thumb"
27
+ className="pointer-events-none block rounded-full bg-background ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 group-data-[size=default]/switch:data-checked:translate-x-[calc(100%-2px)] group-data-[size=sm]/switch:data-checked:translate-x-[calc(100%-2px)] dark:data-checked:bg-primary-foreground group-data-[size=default]/switch:data-unchecked:translate-x-0 group-data-[size=sm]/switch:data-unchecked:translate-x-0 dark:data-unchecked:bg-foreground"
28
+ />
29
+ </SwitchPrimitive.Root>
30
+ )
31
+ }
32
+
33
+ export { Switch }
@@ -0,0 +1,116 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+
5
+ import { cn } from "@/lib/utils"
6
+
7
+ function Table({ className, ...props }: React.ComponentProps<"table">) {
8
+ return (
9
+ <div
10
+ data-slot="table-container"
11
+ className="relative w-full overflow-x-auto"
12
+ >
13
+ <table
14
+ data-slot="table"
15
+ className={cn("w-full caption-bottom text-sm", className)}
16
+ {...props}
17
+ />
18
+ </div>
19
+ )
20
+ }
21
+
22
+ function TableHeader({ className, ...props }: React.ComponentProps<"thead">) {
23
+ return (
24
+ <thead
25
+ data-slot="table-header"
26
+ className={cn("[&_tr]:border-b", className)}
27
+ {...props}
28
+ />
29
+ )
30
+ }
31
+
32
+ function TableBody({ className, ...props }: React.ComponentProps<"tbody">) {
33
+ return (
34
+ <tbody
35
+ data-slot="table-body"
36
+ className={cn("[&_tr:last-child]:border-0", className)}
37
+ {...props}
38
+ />
39
+ )
40
+ }
41
+
42
+ function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">) {
43
+ return (
44
+ <tfoot
45
+ data-slot="table-footer"
46
+ className={cn(
47
+ "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
48
+ className
49
+ )}
50
+ {...props}
51
+ />
52
+ )
53
+ }
54
+
55
+ function TableRow({ className, ...props }: React.ComponentProps<"tr">) {
56
+ return (
57
+ <tr
58
+ data-slot="table-row"
59
+ className={cn(
60
+ "border-b transition-colors hover:bg-muted/50 has-aria-expanded:bg-muted/50 data-[state=selected]:bg-muted",
61
+ className
62
+ )}
63
+ {...props}
64
+ />
65
+ )
66
+ }
67
+
68
+ function TableHead({ className, ...props }: React.ComponentProps<"th">) {
69
+ return (
70
+ <th
71
+ data-slot="table-head"
72
+ className={cn(
73
+ "h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0",
74
+ className
75
+ )}
76
+ {...props}
77
+ />
78
+ )
79
+ }
80
+
81
+ function TableCell({ className, ...props }: React.ComponentProps<"td">) {
82
+ return (
83
+ <td
84
+ data-slot="table-cell"
85
+ className={cn(
86
+ "p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0",
87
+ className
88
+ )}
89
+ {...props}
90
+ />
91
+ )
92
+ }
93
+
94
+ function TableCaption({
95
+ className,
96
+ ...props
97
+ }: React.ComponentProps<"caption">) {
98
+ return (
99
+ <caption
100
+ data-slot="table-caption"
101
+ className={cn("mt-4 text-sm text-muted-foreground", className)}
102
+ {...props}
103
+ />
104
+ )
105
+ }
106
+
107
+ export {
108
+ Table,
109
+ TableHeader,
110
+ TableBody,
111
+ TableFooter,
112
+ TableHead,
113
+ TableRow,
114
+ TableCell,
115
+ TableCaption,
116
+ }
@@ -0,0 +1,90 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+ import { cva, type VariantProps } from "class-variance-authority"
5
+ import { Tabs as TabsPrimitive } from "radix-ui"
6
+
7
+ import { cn } from "@/lib/utils"
8
+
9
+ function Tabs({
10
+ className,
11
+ orientation = "horizontal",
12
+ ...props
13
+ }: React.ComponentProps<typeof TabsPrimitive.Root>) {
14
+ return (
15
+ <TabsPrimitive.Root
16
+ data-slot="tabs"
17
+ data-orientation={orientation}
18
+ className={cn(
19
+ "group/tabs flex gap-2 data-horizontal:flex-col",
20
+ className
21
+ )}
22
+ {...props}
23
+ />
24
+ )
25
+ }
26
+
27
+ const tabsListVariants = cva(
28
+ "group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-muted-foreground group-data-horizontal/tabs:h-8 group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none",
29
+ {
30
+ variants: {
31
+ variant: {
32
+ default: "bg-muted",
33
+ line: "gap-1 bg-transparent",
34
+ },
35
+ },
36
+ defaultVariants: {
37
+ variant: "default",
38
+ },
39
+ }
40
+ )
41
+
42
+ function TabsList({
43
+ className,
44
+ variant = "default",
45
+ ...props
46
+ }: React.ComponentProps<typeof TabsPrimitive.List> &
47
+ VariantProps<typeof tabsListVariants>) {
48
+ return (
49
+ <TabsPrimitive.List
50
+ data-slot="tabs-list"
51
+ data-variant={variant}
52
+ className={cn(tabsListVariants({ variant }), className)}
53
+ {...props}
54
+ />
55
+ )
56
+ }
57
+
58
+ function TabsTrigger({
59
+ className,
60
+ ...props
61
+ }: React.ComponentProps<typeof TabsPrimitive.Trigger>) {
62
+ return (
63
+ <TabsPrimitive.Trigger
64
+ data-slot="tabs-trigger"
65
+ className={cn(
66
+ "relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pr-1 has-data-[icon=inline-start]:pl-1 dark:text-muted-foreground dark:hover:text-foreground group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
67
+ "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent",
68
+ "data-active:bg-background data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 dark:data-active:text-foreground",
69
+ "after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:bottom-[-5px] group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100",
70
+ className
71
+ )}
72
+ {...props}
73
+ />
74
+ )
75
+ }
76
+
77
+ function TabsContent({
78
+ className,
79
+ ...props
80
+ }: React.ComponentProps<typeof TabsPrimitive.Content>) {
81
+ return (
82
+ <TabsPrimitive.Content
83
+ data-slot="tabs-content"
84
+ className={cn("flex-1 text-sm outline-none", className)}
85
+ {...props}
86
+ />
87
+ )
88
+ }
89
+
90
+ export { Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants }
@@ -0,0 +1,18 @@
1
+ import * as React from "react"
2
+
3
+ import { cn } from "@/lib/utils"
4
+
5
+ function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
6
+ return (
7
+ <textarea
8
+ data-slot="textarea"
9
+ className={cn(
10
+ "flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
11
+ className
12
+ )}
13
+ {...props}
14
+ />
15
+ )
16
+ }
17
+
18
+ export { Textarea }
@@ -0,0 +1,89 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+ import { type VariantProps } from "class-variance-authority"
5
+ import { ToggleGroup as ToggleGroupPrimitive } from "radix-ui"
6
+
7
+ import { cn } from "@/lib/utils"
8
+ import { toggleVariants } from "@/components/ui/toggle"
9
+
10
+ const ToggleGroupContext = React.createContext<
11
+ VariantProps<typeof toggleVariants> & {
12
+ spacing?: number
13
+ orientation?: "horizontal" | "vertical"
14
+ }
15
+ >({
16
+ size: "default",
17
+ variant: "default",
18
+ spacing: 0,
19
+ orientation: "horizontal",
20
+ })
21
+
22
+ function ToggleGroup({
23
+ className,
24
+ variant,
25
+ size,
26
+ spacing = 0,
27
+ orientation = "horizontal",
28
+ children,
29
+ ...props
30
+ }: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &
31
+ VariantProps<typeof toggleVariants> & {
32
+ spacing?: number
33
+ orientation?: "horizontal" | "vertical"
34
+ }) {
35
+ return (
36
+ <ToggleGroupPrimitive.Root
37
+ data-slot="toggle-group"
38
+ data-variant={variant}
39
+ data-size={size}
40
+ data-spacing={spacing}
41
+ data-orientation={orientation}
42
+ style={{ "--gap": spacing } as React.CSSProperties}
43
+ className={cn(
44
+ "group/toggle-group flex w-fit flex-row items-center gap-[--spacing(var(--gap))] rounded-lg data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-vertical:flex-col data-vertical:items-stretch",
45
+ className
46
+ )}
47
+ {...props}
48
+ >
49
+ <ToggleGroupContext.Provider
50
+ value={{ variant, size, spacing, orientation }}
51
+ >
52
+ {children}
53
+ </ToggleGroupContext.Provider>
54
+ </ToggleGroupPrimitive.Root>
55
+ )
56
+ }
57
+
58
+ function ToggleGroupItem({
59
+ className,
60
+ children,
61
+ variant = "default",
62
+ size = "default",
63
+ ...props
64
+ }: React.ComponentProps<typeof ToggleGroupPrimitive.Item> &
65
+ VariantProps<typeof toggleVariants>) {
66
+ const context = React.useContext(ToggleGroupContext)
67
+
68
+ return (
69
+ <ToggleGroupPrimitive.Item
70
+ data-slot="toggle-group-item"
71
+ data-variant={context.variant || variant}
72
+ data-size={context.size || size}
73
+ data-spacing={context.spacing}
74
+ className={cn(
75
+ "shrink-0 group-data-[spacing=0]/toggle-group:rounded-none group-data-[spacing=0]/toggle-group:px-2 focus:z-10 focus-visible:z-10 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-end]:pr-1.5 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-start]:pl-1.5 group-data-horizontal/toggle-group:data-[spacing=0]:first:rounded-l-lg group-data-vertical/toggle-group:data-[spacing=0]:first:rounded-t-lg group-data-horizontal/toggle-group:data-[spacing=0]:last:rounded-r-lg group-data-vertical/toggle-group:data-[spacing=0]:last:rounded-b-lg group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:border-l-0 group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:border-t-0 group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-l group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-t",
76
+ toggleVariants({
77
+ variant: context.variant || variant,
78
+ size: context.size || size,
79
+ }),
80
+ className
81
+ )}
82
+ {...props}
83
+ >
84
+ {children}
85
+ </ToggleGroupPrimitive.Item>
86
+ )
87
+ }
88
+
89
+ export { ToggleGroup, ToggleGroupItem }
@@ -0,0 +1,47 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+ import { cva, type VariantProps } from "class-variance-authority"
5
+ import { Toggle as TogglePrimitive } from "radix-ui"
6
+
7
+ import { cn } from "@/lib/utils"
8
+
9
+ const toggleVariants = cva(
10
+ "group/toggle inline-flex items-center justify-center gap-1 rounded-lg text-sm font-medium whitespace-nowrap transition-all outline-none hover:bg-muted hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-muted data-[state=on]:bg-muted dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
11
+ {
12
+ variants: {
13
+ variant: {
14
+ default: "bg-transparent",
15
+ outline: "border border-input bg-transparent hover:bg-muted",
16
+ },
17
+ size: {
18
+ default:
19
+ "h-8 min-w-8 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
20
+ sm: "h-7 min-w-7 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
21
+ lg: "h-9 min-w-9 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
22
+ },
23
+ },
24
+ defaultVariants: {
25
+ variant: "default",
26
+ size: "default",
27
+ },
28
+ }
29
+ )
30
+
31
+ function Toggle({
32
+ className,
33
+ variant = "default",
34
+ size = "default",
35
+ ...props
36
+ }: React.ComponentProps<typeof TogglePrimitive.Root> &
37
+ VariantProps<typeof toggleVariants>) {
38
+ return (
39
+ <TogglePrimitive.Root
40
+ data-slot="toggle"
41
+ className={cn(toggleVariants({ variant, size, className }))}
42
+ {...props}
43
+ />
44
+ )
45
+ }
46
+
47
+ export { Toggle, toggleVariants }
@@ -0,0 +1,57 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+ import { Tooltip as TooltipPrimitive } from "radix-ui"
5
+
6
+ import { cn } from "@/lib/utils"
7
+
8
+ function TooltipProvider({
9
+ delayDuration = 0,
10
+ ...props
11
+ }: React.ComponentProps<typeof TooltipPrimitive.Provider>) {
12
+ return (
13
+ <TooltipPrimitive.Provider
14
+ data-slot="tooltip-provider"
15
+ delayDuration={delayDuration}
16
+ {...props}
17
+ />
18
+ )
19
+ }
20
+
21
+ function Tooltip({
22
+ ...props
23
+ }: React.ComponentProps<typeof TooltipPrimitive.Root>) {
24
+ return <TooltipPrimitive.Root data-slot="tooltip" {...props} />
25
+ }
26
+
27
+ function TooltipTrigger({
28
+ ...props
29
+ }: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {
30
+ return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />
31
+ }
32
+
33
+ function TooltipContent({
34
+ className,
35
+ sideOffset = 0,
36
+ children,
37
+ ...props
38
+ }: React.ComponentProps<typeof TooltipPrimitive.Content>) {
39
+ return (
40
+ <TooltipPrimitive.Portal>
41
+ <TooltipPrimitive.Content
42
+ data-slot="tooltip-content"
43
+ sideOffset={sideOffset}
44
+ className={cn(
45
+ "z-50 inline-flex w-fit max-w-xs origin-(--radix-tooltip-content-transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pr-1.5 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 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 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",
46
+ className
47
+ )}
48
+ {...props}
49
+ >
50
+ {children}
51
+ <TooltipPrimitive.Arrow className="z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground" />
52
+ </TooltipPrimitive.Content>
53
+ </TooltipPrimitive.Portal>
54
+ )
55
+ }
56
+
57
+ export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger }
@@ -0,0 +1,25 @@
1
+ {
2
+ "$schema": "https://ui.shadcn.com/schema.json",
3
+ "style": "radix-nova",
4
+ "rsc": true,
5
+ "tsx": true,
6
+ "tailwind": {
7
+ "config": "",
8
+ "css": "app/globals.css",
9
+ "baseColor": "mist",
10
+ "cssVariables": true,
11
+ "prefix": ""
12
+ },
13
+ "iconLibrary": "lucide",
14
+ "rtl": false,
15
+ "aliases": {
16
+ "components": "@/components",
17
+ "utils": "@/lib/utils",
18
+ "ui": "@/components/ui",
19
+ "lib": "@/lib",
20
+ "hooks": "@/hooks"
21
+ },
22
+ "menuColor": "default",
23
+ "menuAccent": "subtle",
24
+ "registries": {}
25
+ }
File without changes
@@ -0,0 +1,19 @@
1
+ import * as React from "react"
2
+
3
+ const MOBILE_BREAKPOINT = 768
4
+
5
+ export function useIsMobile() {
6
+ const [isMobile, setIsMobile] = React.useState<boolean | undefined>(undefined)
7
+
8
+ React.useEffect(() => {
9
+ const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`)
10
+ const onChange = () => {
11
+ setIsMobile(window.innerWidth < MOBILE_BREAKPOINT)
12
+ }
13
+ mql.addEventListener("change", onChange)
14
+ setIsMobile(window.innerWidth < MOBILE_BREAKPOINT)
15
+ return () => mql.removeEventListener("change", onChange)
16
+ }, [])
17
+
18
+ return !!isMobile
19
+ }
File without changes
@@ -0,0 +1,7 @@
1
+ import { createClient } from "@howone/sdk"
2
+
3
+ const howone = createClient({
4
+ projectId: "demo",
5
+ })
6
+
7
+ export default howone
@@ -0,0 +1,6 @@
1
+ import { clsx, type ClassValue } from "clsx"
2
+ import { twMerge } from "tailwind-merge"
3
+
4
+ export function cn(...inputs: ClassValue[]) {
5
+ return twMerge(clsx(inputs))
6
+ }
@@ -0,0 +1,4 @@
1
+ /** @type {import('next').NextConfig} */
2
+ const nextConfig = {}
3
+
4
+ export default nextConfig
@@ -0,0 +1,7 @@
1
+ node_modules/
2
+ coverage/
3
+ .pnpm-store/
4
+ pnpm-lock.yaml
5
+ package-lock.json
6
+ pnpm-lock.yaml
7
+ yarn.lock
@@ -0,0 +1,11 @@
1
+ {
2
+ "endOfLine": "lf",
3
+ "semi": false,
4
+ "singleQuote": false,
5
+ "tabWidth": 2,
6
+ "trailingComma": "es5",
7
+ "printWidth": 80,
8
+ "plugins": ["prettier-plugin-tailwindcss"],
9
+ "tailwindStylesheet": "src/index.css",
10
+ "tailwindFunctions": ["cn", "cva"]
11
+ }
File without changes