@tanstack/cta-ui 0.15.2 → 0.15.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (88) hide show
  1. package/dist/assets/index-BLGJkAxX.css +1 -0
  2. package/dist/assets/index-DPjMQkKx.js +208 -0
  3. package/dist/assets/index-DPjMQkKx.js.map +1 -0
  4. package/dist/index.html +3 -2
  5. package/index.html +1 -0
  6. package/lib/engine-handling/create-app-wrapper.ts +3 -4
  7. package/lib/engine-handling/generate-initial-payload.ts +12 -20
  8. package/lib/engine-handling/server-environment.ts +2 -2
  9. package/lib/index.ts +33 -15
  10. package/lib-dist/engine-handling/create-app-wrapper.js +3 -2
  11. package/lib-dist/engine-handling/generate-initial-payload.d.ts +8 -6
  12. package/lib-dist/engine-handling/generate-initial-payload.js +9 -14
  13. package/lib-dist/engine-handling/server-environment.d.ts +3 -3
  14. package/lib-dist/index.d.ts +1 -0
  15. package/lib-dist/index.js +29 -11
  16. package/package.json +3 -32
  17. package/src/index.tsx +2 -42
  18. package/src/main.tsx +0 -1
  19. package/src/styles.css +2 -0
  20. package/src/types.d.ts +13 -8
  21. package/dist/assets/index-BktnQA5a.js +0 -213
  22. package/dist/assets/index-BktnQA5a.js.map +0 -1
  23. package/dist/assets/index-CpoUtYXp.css +0 -1
  24. package/dist/logo-color-100w.png +0 -0
  25. package/dist/logo192.png +0 -0
  26. package/dist/logo512.png +0 -0
  27. package/dist/tailwind.svg +0 -1
  28. package/dist/tanstack.png +0 -0
  29. package/dist/typescript.svg +0 -1
  30. package/lib/engine-handling/framework-registration.ts +0 -11
  31. package/lib-dist/engine-handling/framework-registration.d.ts +0 -1
  32. package/lib-dist/engine-handling/framework-registration.js +0 -10
  33. package/public/logo-color-100w.png +0 -0
  34. package/public/logo192.png +0 -0
  35. package/public/logo512.png +0 -0
  36. package/public/tailwind.svg +0 -1
  37. package/public/tanstack.png +0 -0
  38. package/public/typescript.svg +0 -1
  39. package/src/components/StatusList.tsx +0 -22
  40. package/src/components/add-on-info-dialog.tsx +0 -39
  41. package/src/components/background-animation.tsx +0 -229
  42. package/src/components/cta-sidebar.tsx +0 -50
  43. package/src/components/custom-add-on-dialog.tsx +0 -79
  44. package/src/components/file-navigator.tsx +0 -203
  45. package/src/components/file-tree.tsx +0 -35
  46. package/src/components/file-viewer.tsx +0 -67
  47. package/src/components/header.tsx +0 -31
  48. package/src/components/sidebar-items/add-ons.tsx +0 -94
  49. package/src/components/sidebar-items/mode-selector.tsx +0 -57
  50. package/src/components/sidebar-items/project-name.tsx +0 -28
  51. package/src/components/sidebar-items/run-add-ons.tsx +0 -71
  52. package/src/components/sidebar-items/run-create-app.tsx +0 -82
  53. package/src/components/sidebar-items/starter.tsx +0 -123
  54. package/src/components/sidebar-items/typescript-switch.tsx +0 -52
  55. package/src/components/starters-carousel.tsx +0 -45
  56. package/src/components/startup-dialog.tsx +0 -71
  57. package/src/components/toaster.tsx +0 -29
  58. package/src/components/ui/button.tsx +0 -61
  59. package/src/components/ui/carousel.tsx +0 -239
  60. package/src/components/ui/checkbox.tsx +0 -30
  61. package/src/components/ui/dialog.tsx +0 -138
  62. package/src/components/ui/dropdown-menu.tsx +0 -255
  63. package/src/components/ui/input.tsx +0 -21
  64. package/src/components/ui/label.tsx +0 -22
  65. package/src/components/ui/popover.tsx +0 -46
  66. package/src/components/ui/separator.tsx +0 -28
  67. package/src/components/ui/sheet.tsx +0 -137
  68. package/src/components/ui/sidebar.tsx +0 -726
  69. package/src/components/ui/skeleton.tsx +0 -13
  70. package/src/components/ui/sonner.tsx +0 -23
  71. package/src/components/ui/switch.tsx +0 -29
  72. package/src/components/ui/table.tsx +0 -114
  73. package/src/components/ui/tabs.tsx +0 -64
  74. package/src/components/ui/toggle-group.tsx +0 -71
  75. package/src/components/ui/toggle.tsx +0 -49
  76. package/src/components/ui/tooltip.tsx +0 -61
  77. package/src/components/ui/tree-view.tsx +0 -497
  78. package/src/file-classes.ts +0 -54
  79. package/src/hooks/use-mobile.ts +0 -19
  80. package/src/hooks/use-mounted.ts +0 -9
  81. package/src/hooks/use-preferred-reduced-motion.ts +0 -27
  82. package/src/hooks/use-streaming-status.ts +0 -70
  83. package/src/lib/api.ts +0 -92
  84. package/src/lib/utils.ts +0 -6
  85. package/src/store/add-ons.ts +0 -81
  86. package/src/store/project.ts +0 -347
  87. package/tests/store/add-ons.test.ts +0 -222
  88. package/vitest.config.ts +0 -6
@@ -1,13 +0,0 @@
1
- import { cn } from "@/lib/utils"
2
-
3
- function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
4
- return (
5
- <div
6
- data-slot="skeleton"
7
- className={cn("bg-accent animate-pulse rounded-md", className)}
8
- {...props}
9
- />
10
- )
11
- }
12
-
13
- export { Skeleton }
@@ -1,23 +0,0 @@
1
- import { useTheme } from "next-themes"
2
- import { Toaster as Sonner, ToasterProps } from "sonner"
3
-
4
- const Toaster = ({ ...props }: ToasterProps) => {
5
- const { theme = "system" } = useTheme()
6
-
7
- return (
8
- <Sonner
9
- theme={theme as ToasterProps["theme"]}
10
- className="toaster group"
11
- style={
12
- {
13
- "--normal-bg": "var(--popover)",
14
- "--normal-text": "var(--popover-foreground)",
15
- "--normal-border": "var(--border)",
16
- } as React.CSSProperties
17
- }
18
- {...props}
19
- />
20
- )
21
- }
22
-
23
- export { Toaster }
@@ -1,29 +0,0 @@
1
- import * as React from 'react'
2
- import * as SwitchPrimitive from '@radix-ui/react-switch'
3
-
4
- import { cn } from '@/lib/utils'
5
-
6
- function Switch({
7
- className,
8
- ...props
9
- }: React.ComponentProps<typeof SwitchPrimitive.Root>) {
10
- return (
11
- <SwitchPrimitive.Root
12
- data-slot="switch"
13
- className={cn(
14
- 'peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 border-1 border-gray-500/30',
15
- className,
16
- )}
17
- {...props}
18
- >
19
- <SwitchPrimitive.Thumb
20
- data-slot="switch-thumb"
21
- className={cn(
22
- 'bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0',
23
- )}
24
- />
25
- </SwitchPrimitive.Root>
26
- )
27
- }
28
-
29
- export { Switch }
@@ -1,114 +0,0 @@
1
- import * as React from "react"
2
-
3
- import { cn } from "@/lib/utils"
4
-
5
- function Table({ className, ...props }: React.ComponentProps<"table">) {
6
- return (
7
- <div
8
- data-slot="table-container"
9
- className="relative w-full overflow-x-auto"
10
- >
11
- <table
12
- data-slot="table"
13
- className={cn("w-full caption-bottom text-sm", className)}
14
- {...props}
15
- />
16
- </div>
17
- )
18
- }
19
-
20
- function TableHeader({ className, ...props }: React.ComponentProps<"thead">) {
21
- return (
22
- <thead
23
- data-slot="table-header"
24
- className={cn("[&_tr]:border-b", className)}
25
- {...props}
26
- />
27
- )
28
- }
29
-
30
- function TableBody({ className, ...props }: React.ComponentProps<"tbody">) {
31
- return (
32
- <tbody
33
- data-slot="table-body"
34
- className={cn("[&_tr:last-child]:border-0", className)}
35
- {...props}
36
- />
37
- )
38
- }
39
-
40
- function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">) {
41
- return (
42
- <tfoot
43
- data-slot="table-footer"
44
- className={cn(
45
- "bg-muted/50 border-t font-medium [&>tr]:last:border-b-0",
46
- className
47
- )}
48
- {...props}
49
- />
50
- )
51
- }
52
-
53
- function TableRow({ className, ...props }: React.ComponentProps<"tr">) {
54
- return (
55
- <tr
56
- data-slot="table-row"
57
- className={cn(
58
- "hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors",
59
- className
60
- )}
61
- {...props}
62
- />
63
- )
64
- }
65
-
66
- function TableHead({ className, ...props }: React.ComponentProps<"th">) {
67
- return (
68
- <th
69
- data-slot="table-head"
70
- className={cn(
71
- "text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
72
- className
73
- )}
74
- {...props}
75
- />
76
- )
77
- }
78
-
79
- function TableCell({ className, ...props }: React.ComponentProps<"td">) {
80
- return (
81
- <td
82
- data-slot="table-cell"
83
- className={cn(
84
- "p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
85
- className
86
- )}
87
- {...props}
88
- />
89
- )
90
- }
91
-
92
- function TableCaption({
93
- className,
94
- ...props
95
- }: React.ComponentProps<"caption">) {
96
- return (
97
- <caption
98
- data-slot="table-caption"
99
- className={cn("text-muted-foreground mt-4 text-sm", className)}
100
- {...props}
101
- />
102
- )
103
- }
104
-
105
- export {
106
- Table,
107
- TableHeader,
108
- TableBody,
109
- TableFooter,
110
- TableHead,
111
- TableRow,
112
- TableCell,
113
- TableCaption,
114
- }
@@ -1,64 +0,0 @@
1
- import * as React from "react"
2
- import * as TabsPrimitive from "@radix-ui/react-tabs"
3
-
4
- import { cn } from "@/lib/utils"
5
-
6
- function Tabs({
7
- className,
8
- ...props
9
- }: React.ComponentProps<typeof TabsPrimitive.Root>) {
10
- return (
11
- <TabsPrimitive.Root
12
- data-slot="tabs"
13
- className={cn("flex flex-col gap-2", className)}
14
- {...props}
15
- />
16
- )
17
- }
18
-
19
- function TabsList({
20
- className,
21
- ...props
22
- }: React.ComponentProps<typeof TabsPrimitive.List>) {
23
- return (
24
- <TabsPrimitive.List
25
- data-slot="tabs-list"
26
- className={cn(
27
- "bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]",
28
- className
29
- )}
30
- {...props}
31
- />
32
- )
33
- }
34
-
35
- function TabsTrigger({
36
- className,
37
- ...props
38
- }: React.ComponentProps<typeof TabsPrimitive.Trigger>) {
39
- return (
40
- <TabsPrimitive.Trigger
41
- data-slot="tabs-trigger"
42
- className={cn(
43
- "data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
44
- className
45
- )}
46
- {...props}
47
- />
48
- )
49
- }
50
-
51
- function TabsContent({
52
- className,
53
- ...props
54
- }: React.ComponentProps<typeof TabsPrimitive.Content>) {
55
- return (
56
- <TabsPrimitive.Content
57
- data-slot="tabs-content"
58
- className={cn("flex-1 outline-none", className)}
59
- {...props}
60
- />
61
- )
62
- }
63
-
64
- export { Tabs, TabsList, TabsTrigger, TabsContent }
@@ -1,71 +0,0 @@
1
- import * as React from 'react'
2
- import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group'
3
- import type { VariantProps } from 'class-variance-authority'
4
-
5
- import { cn } from '@/lib/utils'
6
- import { toggleVariants } from '@/components/ui/toggle'
7
-
8
- const ToggleGroupContext = React.createContext<
9
- VariantProps<typeof toggleVariants>
10
- >({
11
- size: 'default',
12
- variant: 'default',
13
- })
14
-
15
- function ToggleGroup({
16
- className,
17
- variant,
18
- size,
19
- children,
20
- ...props
21
- }: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &
22
- VariantProps<typeof toggleVariants>) {
23
- return (
24
- <ToggleGroupPrimitive.Root
25
- data-slot="toggle-group"
26
- data-variant={variant}
27
- data-size={size}
28
- className={cn(
29
- 'group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs',
30
- className,
31
- )}
32
- {...props}
33
- >
34
- <ToggleGroupContext.Provider value={{ variant, size }}>
35
- {children}
36
- </ToggleGroupContext.Provider>
37
- </ToggleGroupPrimitive.Root>
38
- )
39
- }
40
-
41
- function ToggleGroupItem({
42
- className,
43
- children,
44
- variant,
45
- size,
46
- ...props
47
- }: React.ComponentProps<typeof ToggleGroupPrimitive.Item> &
48
- VariantProps<typeof toggleVariants>) {
49
- const context = React.useContext(ToggleGroupContext)
50
-
51
- return (
52
- <ToggleGroupPrimitive.Item
53
- data-slot="toggle-group-item"
54
- data-variant={context.variant || variant}
55
- data-size={context.size || size}
56
- className={cn(
57
- toggleVariants({
58
- variant: context.variant || variant,
59
- size: context.size || size,
60
- }),
61
- 'min-w-0 flex-1 shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l',
62
- className,
63
- )}
64
- {...props}
65
- >
66
- {children}
67
- </ToggleGroupPrimitive.Item>
68
- )
69
- }
70
-
71
- export { ToggleGroup, ToggleGroupItem }
@@ -1,49 +0,0 @@
1
- 'use client'
2
-
3
- import * as React from 'react'
4
- import * as TogglePrimitive from '@radix-ui/react-toggle'
5
- import { cva } from 'class-variance-authority'
6
-
7
- import type { VariantProps } from 'class-variance-authority'
8
-
9
- import { cn } from '@/lib/utils'
10
-
11
- const toggleVariants = cva(
12
- "inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap",
13
- {
14
- variants: {
15
- variant: {
16
- default: 'bg-transparent',
17
- outline:
18
- 'border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground',
19
- },
20
- size: {
21
- default: 'h-9 px-2 min-w-9',
22
- sm: 'h-8 px-1.5 min-w-8',
23
- lg: 'h-10 px-2.5 min-w-10',
24
- },
25
- },
26
- defaultVariants: {
27
- variant: 'default',
28
- size: 'default',
29
- },
30
- },
31
- )
32
-
33
- function Toggle({
34
- className,
35
- variant,
36
- size,
37
- ...props
38
- }: React.ComponentProps<typeof TogglePrimitive.Root> &
39
- VariantProps<typeof toggleVariants>) {
40
- return (
41
- <TogglePrimitive.Root
42
- data-slot="toggle"
43
- className={cn(toggleVariants({ variant, size, className }))}
44
- {...props}
45
- />
46
- )
47
- }
48
-
49
- export { Toggle, toggleVariants }
@@ -1,61 +0,0 @@
1
- "use client"
2
-
3
- import * as React from "react"
4
- import * as TooltipPrimitive from "@radix-ui/react-tooltip"
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 (
25
- <TooltipProvider>
26
- <TooltipPrimitive.Root data-slot="tooltip" {...props} />
27
- </TooltipProvider>
28
- )
29
- }
30
-
31
- function TooltipTrigger({
32
- ...props
33
- }: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {
34
- return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />
35
- }
36
-
37
- function TooltipContent({
38
- className,
39
- sideOffset = 0,
40
- children,
41
- ...props
42
- }: React.ComponentProps<typeof TooltipPrimitive.Content>) {
43
- return (
44
- <TooltipPrimitive.Portal>
45
- <TooltipPrimitive.Content
46
- data-slot="tooltip-content"
47
- sideOffset={sideOffset}
48
- className={cn(
49
- "bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
50
- className
51
- )}
52
- {...props}
53
- >
54
- {children}
55
- <TooltipPrimitive.Arrow className="bg-primary fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" />
56
- </TooltipPrimitive.Content>
57
- </TooltipPrimitive.Portal>
58
- )
59
- }
60
-
61
- export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }