From 061086bb2cf702380e50668a58edccaec3db6241 Mon Sep 17 00:00:00 2001 From: Ankan Bhattacharya Date: Tue, 22 Apr 2025 19:03:04 +0530 Subject: [PATCH 1/8] feat: :sparkles: add base support --- app/layout.tsx | 2 + components/retroui/Popover.tsx | 72 +++ components/retroui/Sonner.tsx | 30 ++ components/retroui/Toggle.tsx | 49 ++ components/retroui/ToggleGroup.tsx | 61 +++ components/retroui/Tooltip.tsx | 52 ++ components/retroui/index.ts | 5 + config/components.ts | 120 ++++- config/navigation.ts | 25 + content/docs/components/popover.mdx | 80 +++ content/docs/components/slider.mdx | 6 +- content/docs/components/sonner.mdx | 86 +++ content/docs/components/toggle-group.mdx | 84 +++ content/docs/components/toggle.mdx | 58 ++ content/docs/components/tooltip.mdx | 52 ++ package.json | 5 + pnpm-lock.yaml | 496 ++++++++++++++++++ preview/components/label.tsx | 13 + .../popover-style-default-shadow.tsx | 52 ++ preview/components/popover-style-default.tsx | 52 ++ .../popover-style-primary-shadow.tsx | 52 ++ preview/components/popover-style-primary.tsx | 52 ++ preview/components/sonner-style-default.tsx | 16 + preview/components/sonner-style-error.tsx | 10 + .../components/sonner-style-rich-colors.tsx | 12 + preview/components/sonner-style-warning.tsx | 10 + .../components/toggle-group-style-default.tsx | 22 + .../toggle-group-style-outline-muted.tsx | 22 + .../toggle-group-style-outlined.tsx | 22 + .../components/toggle-group-style-solid.tsx | 22 + preview/components/toggle-style-default.tsx | 10 + .../components/toggle-style-outline-muted.tsx | 10 + preview/components/toggle-style-outlined.tsx | 10 + preview/components/toggle-style-solid.tsx | 10 + preview/components/tooltip-style-default.tsx | 22 + preview/components/tooltip-style-primary.tsx | 22 + preview/components/tooltip-style-solid.tsx | 22 + public/r/popover.json | 16 + public/r/sonner.json | 15 + public/r/toggle-group.json | 26 + public/r/toggle.json | 17 + public/r/tooltip.json | 16 + registry.json | 128 ++++- 43 files changed, 1956 insertions(+), 8 deletions(-) create mode 100644 components/retroui/Popover.tsx create mode 100644 components/retroui/Sonner.tsx create mode 100644 components/retroui/Toggle.tsx create mode 100644 components/retroui/ToggleGroup.tsx create mode 100644 components/retroui/Tooltip.tsx create mode 100644 content/docs/components/popover.mdx create mode 100644 content/docs/components/sonner.mdx create mode 100644 content/docs/components/toggle-group.mdx create mode 100644 content/docs/components/toggle.mdx create mode 100644 content/docs/components/tooltip.mdx create mode 100644 preview/components/label.tsx create mode 100644 preview/components/popover-style-default-shadow.tsx create mode 100644 preview/components/popover-style-default.tsx create mode 100644 preview/components/popover-style-primary-shadow.tsx create mode 100644 preview/components/popover-style-primary.tsx create mode 100644 preview/components/sonner-style-default.tsx create mode 100644 preview/components/sonner-style-error.tsx create mode 100644 preview/components/sonner-style-rich-colors.tsx create mode 100644 preview/components/sonner-style-warning.tsx create mode 100644 preview/components/toggle-group-style-default.tsx create mode 100644 preview/components/toggle-group-style-outline-muted.tsx create mode 100644 preview/components/toggle-group-style-outlined.tsx create mode 100644 preview/components/toggle-group-style-solid.tsx create mode 100644 preview/components/toggle-style-default.tsx create mode 100644 preview/components/toggle-style-outline-muted.tsx create mode 100644 preview/components/toggle-style-outlined.tsx create mode 100644 preview/components/toggle-style-solid.tsx create mode 100644 preview/components/tooltip-style-default.tsx create mode 100644 preview/components/tooltip-style-primary.tsx create mode 100644 preview/components/tooltip-style-solid.tsx create mode 100644 public/r/popover.json create mode 100644 public/r/sonner.json create mode 100644 public/r/toggle-group.json create mode 100644 public/r/toggle.json create mode 100644 public/r/tooltip.json diff --git a/app/layout.tsx b/app/layout.tsx index 0396d04..1582a7e 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -2,6 +2,7 @@ import TopNav from "@/components/TopNav"; import "./global.css"; import { Archivo_Black, Space_Grotesk, Space_Mono } from "next/font/google"; import { Metadata } from "next"; +import { Toaster } from "@/components/retroui"; const archivoBlack = Archivo_Black({ subsets: ["latin"], @@ -55,6 +56,7 @@ export default function RootLayout({ {children} + ); diff --git a/components/retroui/Popover.tsx b/components/retroui/Popover.tsx new file mode 100644 index 0000000..6a7ad1a --- /dev/null +++ b/components/retroui/Popover.tsx @@ -0,0 +1,72 @@ +"use client"; + +import * as React from "react"; +import * as PopoverPrimitive from "@radix-ui/react-popover"; + +import { cn } from "@/lib/utils"; +import { cva, VariantProps } from "class-variance-authority"; + +const popoverContentVariants = cva( + "z-50 w-72 rounded-md border bg-primary p-4 text-popover-foreground 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 origin-[--radix-popover-content-transform-origin]", + { + variants: { + variant: { + default: "bg-background", + primary: "bg-primary", + }, + shadow: { + default: "", + sm: "shadow-sm", + md: "shadow-md", + lg: "shadow-lg", + }, + }, + defaultVariants: { + variant: "default", + shadow: "default", + }, + }, +); + +const Popover = PopoverPrimitive.Root; + +const PopoverTrigger = PopoverPrimitive.Trigger; + +const PopoverAnchor = PopoverPrimitive.Anchor; + +const PopoverContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & + VariantProps +>( + ( + { + className, + align = "center", + sideOffset = 4, + variant, + shadow, + ...props + }, + ref, + ) => ( + + + + ), +); +PopoverContent.displayName = PopoverPrimitive.Content.displayName; + +export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor }; diff --git a/components/retroui/Sonner.tsx b/components/retroui/Sonner.tsx new file mode 100644 index 0000000..71a47da --- /dev/null +++ b/components/retroui/Sonner.tsx @@ -0,0 +1,30 @@ +"use client"; + +import { Toaster as Sonner } from "sonner"; + +type ToasterProps = React.ComponentProps; + +const Toaster = ({ ...props }: ToasterProps) => { + return ( + + ); +}; + +export { Toaster }; diff --git a/components/retroui/Toggle.tsx b/components/retroui/Toggle.tsx new file mode 100644 index 0000000..9270e0c --- /dev/null +++ b/components/retroui/Toggle.tsx @@ -0,0 +1,49 @@ +"use client"; + +import * as React from "react"; +import * as TogglePrimitive from "@radix-ui/react-toggle"; +import { cva, type VariantProps } from "class-variance-authority"; + +import { cn } from "@/lib/utils"; + +const toggleVariants = cva( + "inline-flex items-center justify-center text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 gap-2", + { + variants: { + variant: { + default: + "bg-transparent hover:bg-muted/70 hover:text-muted-foreground data-[state=on]:bg-muted", + outlined: + "border-2 border-input bg-transparent hover:bg-accent hover:text-accent-foreground/80 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground", + solid: "border-2 border-input bg-transparent hover:bg-black hover:text-white/90 hover:border-black data-[state=on]:bg-black data-[state=on]:text-white data-[state=on]:border-black", + "outline-muted": + "border-2 border-input bg-transparent hover:hover:bg-muted/70 hover:hover:text-muted-foreground data-[state=on]:bg-muted", + }, + size: { + default: "h-10 px-3 min-w-10", + sm: "h-9 px-2.5 min-w-9", + lg: "h-11 px-5 min-w-11", + }, + }, + defaultVariants: { + variant: "default", + size: "default", + }, + }, +); + +const Toggle = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & + VariantProps +>(({ className, variant, size, ...props }, ref) => ( + +)); + +Toggle.displayName = TogglePrimitive.Root.displayName; + +export { Toggle, toggleVariants }; diff --git a/components/retroui/ToggleGroup.tsx b/components/retroui/ToggleGroup.tsx new file mode 100644 index 0000000..5d9d129 --- /dev/null +++ b/components/retroui/ToggleGroup.tsx @@ -0,0 +1,61 @@ +"use client"; + +import * as React from "react"; +import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group"; +import { type VariantProps } from "class-variance-authority"; + +import { cn } from "@/lib/utils"; +import { toggleVariants } from "./Toggle"; + +const ToggleGroupContext = React.createContext< + VariantProps +>({ + size: "default", + variant: "default", +}); + +const ToggleGroup = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & + VariantProps +>(({ className, variant, size, children, ...props }, ref) => ( + + + {children} + + +)); + +ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName; + +const ToggleGroupItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & + VariantProps +>(({ className, children, variant, size, ...props }, ref) => { + const context = React.useContext(ToggleGroupContext); + + return ( + + {children} + + ); +}); + +ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName; + +export { ToggleGroup, ToggleGroupItem }; diff --git a/components/retroui/Tooltip.tsx b/components/retroui/Tooltip.tsx new file mode 100644 index 0000000..37d7c5d --- /dev/null +++ b/components/retroui/Tooltip.tsx @@ -0,0 +1,52 @@ +"use client"; + +import * as React from "react"; +import * as TooltipPrimitive from "@radix-ui/react-tooltip"; + +import { cn } from "@/lib/utils"; +import { cva, VariantProps } from "class-variance-authority"; + +const tooltipContentVariants = cva( + "z-50 overflow-hidden border-2 border-border bg-background px-3 py-1.5 text-xs 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 origin-[--radix-tooltip-content-transform-origin]", + { + variants: { + variant: { + default: "bg-background text-foreground", + primary: "bg-primary text-foreground", + solid: "bg-solid text-solid-foreground", + }, + }, + defaultVariants: { + variant: "default", + }, + }, +); + +const TooltipProvider = TooltipPrimitive.Provider; + +const Tooltip = TooltipPrimitive.Root; + +const TooltipTrigger = TooltipPrimitive.Trigger; + +const TooltipContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef & + VariantProps +>(({ className, sideOffset = 4, variant, ...props }, ref) => ( + + + +)); +TooltipContent.displayName = TooltipPrimitive.Content.displayName; + +export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }; diff --git a/components/retroui/index.ts b/components/retroui/index.ts index ba8f34c..63ebfae 100644 --- a/components/retroui/index.ts +++ b/components/retroui/index.ts @@ -17,3 +17,8 @@ export * from "./Tab"; export * from "./Dialog"; export * from "./Menu"; export * from "./Progress"; +export * from "./Popover"; +export * from "./Toggle"; +export * from "./ToggleGroup"; +export * from "./Sonner"; +export * from "./Tooltip"; diff --git a/config/components.ts b/config/components.ts index ca40200..df5300a 100644 --- a/config/components.ts +++ b/config/components.ts @@ -67,6 +67,10 @@ export const componentConfig: { name: "progress", filePath: "components/retroui/Progress.tsx", }, + popover: { + name: "popover", + filePath: "components/retroui/Popover.tsx", + }, radio: { name: "radio", filePath: "components/retroui/Radio.tsx", @@ -79,15 +83,31 @@ export const componentConfig: { name: "switch", filePath: "components/retroui/Switch.tsx", }, - text: { - name: "text", - filePath: "components/retroui/Text.tsx", - }, slider: { name: "slider", dependencies: ["@radix-ui/react-slider"], filePath: "components/retroui/Slider.tsx", }, + sonner: { + name: "sonner", + filePath: "components/retroui/Sonner.tsx", + }, + text: { + name: "text", + filePath: "components/retroui/Text.tsx", + }, + toggle: { + name: "toggle", + filePath: "components/retroui/Toggle.tsx", + }, + "toggle-group": { + name: "toggle-group", + filePath: "components/retroui/ToggleGroup.tsx", + }, + tooltip: { + name: "tooltip", + filePath: "components/retroui/Tooltip.tsx", + }, }, examples: { "accordion-style-default": { @@ -345,5 +365,97 @@ export const componentConfig: { filePath: "preview/components/slider-style-default.tsx", preview: lazy(() => import("@/preview/components/slider-style-default")), }, + "toggle-style-default": { + name: "toggle-style-default", + filePath: "preview/components/toggle-style-default.tsx", + preview: lazy(() => import("@/preview/components/toggle-style-default")), + }, + "toggle-style-outlined": { + name: "toggle-style-outlined", + filePath: "preview/components/toggle-style-outlined.tsx", + preview: lazy(() => import("@/preview/components/toggle-style-outlined")), + }, + "toggle-style-solid": { + name: "toggle-style-solid", + filePath: "preview/components/toggle-style-solid.tsx", + preview: lazy(() => import("@/preview/components/toggle-style-solid")), + }, + "toggle-style-outline-muted": { + name: "toggle-style-outline-muted", + filePath: "preview/components/toggle-style-outline-muted.tsx", + preview: lazy( + () => import("@/preview/components/toggle-style-outline-muted"), + ), + }, + "sonner-style-default": { + name: "sonner-style-default", + filePath: "preview/components/sonner-style-default.tsx", + preview: lazy(() => import("@/preview/components/sonner-style-default")), + }, + "sonner-style-warning": { + name: "sonner-style-warning", + filePath: "preview/components/sonner-style-warning.tsx", + preview: lazy(() => import("@/preview/components/sonner-style-warning")), + }, + "sonner-style-error": { + name: "sonner-style-error", + filePath: "preview/components/sonner-style-error.tsx", + preview: lazy(() => import("@/preview/components/sonner-style-error")), + }, + "sonner-style-rich-colors": { + name: "sonner-style-rich-colors", + filePath: "preview/components/sonner-style-rich-colors.tsx", + preview: lazy( + () => import("@/preview/components/sonner-style-rich-colors"), + ), + }, + label: { + name: "label", + filePath: "preview/components/label.tsx", + preview: lazy(() => import("@/preview/components/label")), + }, + "tooltip-style-default": { + name: "tooltip-style-default", + filePath: "preview/components/tooltip-style-default.tsx", + preview: lazy(() => import("@/preview/components/tooltip-style-default")), + }, + "tooltip-style-solid": { + name: "tooltip-style-solid", + filePath: "preview/components/tooltip-style-solid.tsx", + preview: lazy(() => import("@/preview/components/tooltip-style-solid")), + }, + "tooltip-style-primary": { + name: "tooltip-style-primary", + filePath: "preview/components/tooltip-style-primary.tsx", + preview: lazy(() => import("@/preview/components/tooltip-style-primary")), + }, + "toggle-group-style-default": { + name: "toggle-group-style-default", + filePath: "preview/components/toggle-group-style-default.tsx", + preview: lazy( + () => import("@/preview/components/toggle-group-style-default"), + ), + }, + "toggle-group-style-outlined": { + name: "toggle-group-style-outlined", + filePath: "preview/components/toggle-group-style-outlined.tsx", + preview: lazy( + () => import("@/preview/components/toggle-group-style-outlined"), + ), + }, + "toggle-group-style-outline-muted": { + name: "toggle-group-style-outline-muted", + filePath: "preview/components/toggle-group-style-outline-muted.tsx", + preview: lazy( + () => import("@/preview/components/toggle-group-style-outline-muted"), + ), + }, + "toggle-group-style-solid": { + name: "toggle-group-style-solid", + filePath: "preview/components/toggle-group-style-solid.tsx", + preview: lazy( + () => import("@/preview/components/toggle-group-style-solid"), + ), + }, }, }; diff --git a/config/navigation.ts b/config/navigation.ts index 7f18508..59092bf 100644 --- a/config/navigation.ts +++ b/config/navigation.ts @@ -35,14 +35,39 @@ export const navConfig: INavigationConfig = { { title: "Input", href: `${componentsRoute}/input` }, { title: "Label", href: `${componentsRoute}/label`, tag: "New" }, { title: "Menu", href: `${componentsRoute}/menu` }, + { + title: "Popover", + href: `${componentsRoute}/popover`, + tag: "New", + }, { title: "Progress", href: `${componentsRoute}/progress` }, { title: "Radio", href: `${componentsRoute}/radio` }, { title: "Select", href: `${componentsRoute}/select` }, { title: "Slider", href: `${componentsRoute}/slider`, tag: "New" }, + { + title: "Sonner", + href: `${componentsRoute}/sonner`, + tag: "New", + }, { title: "Switch", href: `${componentsRoute}/switch` }, { title: "Tab", href: `${componentsRoute}/tab` }, { title: "Textarea", href: `${componentsRoute}/textarea` }, { title: "Text", href: `${componentsRoute}/text` }, + { + title: "Toggle", + href: `${componentsRoute}/toggle`, + tag: "New", + }, + { + title: "Toggle Group", + href: `${componentsRoute}/toggle-group`, + tag: "New", + }, + { + title: "Tooltip", + href: `${componentsRoute}/tooltip`, + tag: "New", + }, ], }, { diff --git a/content/docs/components/popover.mdx b/content/docs/components/popover.mdx new file mode 100644 index 0000000..86a7273 --- /dev/null +++ b/content/docs/components/popover.mdx @@ -0,0 +1,80 @@ +--- +title: Popover +description: A handy small component for your little input needs...😉 +lastUpdated: 08 Apr, 2025 +--- + + +
+
+ + + + ```sh + npx shadcn@latest add "https://retroui.dev/r/popover.json" + ``` + + +#### 1. Install dependencies: + +```sh +npm install @radix-ui/react-popover +``` + +
+ +#### 2. Copy the code 👇 into your project: + + +
+ +
+ +
+
+ +## Usage + +```typescript +import { + Popover, + PopoverContent, + PopoverTrigger, +} from "@/components/retroui/popover"; +``` + +```typescript + + Open + Place content for the popover here. + +``` + +
+
+ +## Examples + +### Default + + +
+
+ +### Primary + + +
+
+ +### Shadowed + + +
+
+ +### Primary Shadowed + + +
+
diff --git a/content/docs/components/slider.mdx b/content/docs/components/slider.mdx index 4c7b46f..6cdf54e 100644 --- a/content/docs/components/slider.mdx +++ b/content/docs/components/slider.mdx @@ -4,7 +4,7 @@ description: A customizable slider component with two variants. lastUpdated: 25 Mar, 2025 links: api_reference: https://www.radix-ui.com/docs/primitives/components/slider#api-reference - source: https://github.com/Logging-Stuff/RetroUI/blob/main/components/ui/Slider.tsx + source: https://github.com/Logging-Stuff/RetroUI/blob/main/components/retroui/Slider.tsx --- @@ -20,7 +20,7 @@ links: ``` - + #### 1. Install dependencies: ```sh @@ -43,4 +43,4 @@ npm install @radix-ui/react-slider ### Default - \ No newline at end of file + diff --git a/content/docs/components/sonner.mdx b/content/docs/components/sonner.mdx new file mode 100644 index 0000000..4159099 --- /dev/null +++ b/content/docs/components/sonner.mdx @@ -0,0 +1,86 @@ +--- +title: Sonner +description: A beautiful toast component that can grab audience attention from any place. +lastUpdated: 04 Apr, 2025 +--- + + +
+
+ +## About + +[Sonner](https://sonner.emilkowal.ski) is built and maintained by [Emil Kowalski](https://x.com/emilkowalski_) + +
+
+ +## Installation + + + + ```sh + npx shadcn@latest add "https://retroui.dev/r/sonner.json" + ``` + + + #### 1. Install dependencies: + + ```sh + npm install sonner + ``` + +
+ #### 2. Copy the code 👇 into your project: + + + +
+ ### 3. Add ``Toaster`` in your ``app/layout.tsx`` + + ```tsx + import { Toaster } from "@/components/retroui/sonner" + + export default function RootLayout({ children }) { + return ( + + + +
{children}
+ + + + ) + } + ``` +
+ +
+ +
+
+ +## Examples + +### Default + + +
+
+ +### Warning Sonner + + +
+
+ +### Error Sonner + + + +
+
+ +### Rich Colors Sonner + + diff --git a/content/docs/components/toggle-group.mdx b/content/docs/components/toggle-group.mdx new file mode 100644 index 0000000..e7b8035 --- /dev/null +++ b/content/docs/components/toggle-group.mdx @@ -0,0 +1,84 @@ +--- +title: Toggle Group +description: Group of toggling buttons...🤙 +lastUpdated: 08 Apr, 2025 +--- + + +
+
+ + + + ```sh + npx shadcn@latest add "https://retroui.dev/r/toggle-group.json" + ``` + + +#### 1. Install dependencies: + +```sh +npm install @radix-ui/react-toggle-group @radix-ui/react-toggle +``` + +
+ +#### 2. Copy the code 👇 into your project `toggle.tsx`: + + + +
+ +#### 3. Copy the code 👇 into your project `toggle-group.tsx`: + + +
+ +
+ +
+
+ +## Usage + +```tsx +import { + ToggleGroup, + ToggleGroupItem, +} from "@/components/retroui/toggle-group"; +``` + +```tsx + + A + B + C + +``` + +
+
+ +## Examples + +### Default + + +
+
+ +### Outlined + + +
+
+ +### Solid + + +
+
+ +### Outline Muted + + diff --git a/content/docs/components/toggle.mdx b/content/docs/components/toggle.mdx new file mode 100644 index 0000000..cfb30c6 --- /dev/null +++ b/content/docs/components/toggle.mdx @@ -0,0 +1,58 @@ +--- +title: Toggle +description: This crazy toggling button keeps people toggling...😃 +lastUpdated: 02 Apr, 2025 +--- + + +
+
+ + + + ```sh + npx shadcn@latest add "https://retroui.dev/r/toggle.json" + ``` + + +#### 1. Install dependencies: + +```sh +npm install @radix-ui/react-toggle +``` + +
+ +#### 2. Copy the code 👇 into your project: + + +
+ +
+ +
+
+ +## Examples + +### Default + + +
+
+ +### Outlined + + +
+
+ +### Solid + + +
+
+ +### Outline Muted + + diff --git a/content/docs/components/tooltip.mdx b/content/docs/components/tooltip.mdx new file mode 100644 index 0000000..d075801 --- /dev/null +++ b/content/docs/components/tooltip.mdx @@ -0,0 +1,52 @@ +--- +title: Tooltip +description: A cool way to give your users a hint of what a component does...😉 +lastUpdated: 08 Apr, 2025 +--- + + +
+
+ + + + ```sh + npx shadcn@latest add "https://retroui.dev/r/tooltip.json" + ``` + + +#### 1. Install dependencies: + +```sh +npm install @radix-ui/react-tooltip +``` + +
+ +#### 2. Copy the code 👇 into your project: + + +
+ +
+ +
+
+ +## Examples + +### Default + + +
+
+ +### Primary + + +
+
+ +### Solid + + diff --git a/package.json b/package.json index aed2675..60a7205 100644 --- a/package.json +++ b/package.json @@ -17,11 +17,15 @@ "@radix-ui/react-dialog": "^1.1.2", "@radix-ui/react-dropdown-menu": "^2.1.2", "@radix-ui/react-label": "^2.1.2", + "@radix-ui/react-popover": "^1.1.10", "@radix-ui/react-progress": "^1.1.2", "@radix-ui/react-radio-group": "^1.2.3", "@radix-ui/react-select": "^2.1.6", "@radix-ui/react-slider": "^1.2.4", "@radix-ui/react-switch": "^1.1.3", + "@radix-ui/react-toggle": "^1.1.6", + "@radix-ui/react-toggle-group": "^1.1.7", + "@radix-ui/react-tooltip": "^1.2.3", "@radix-ui/react-visually-hidden": "^1.1.0", "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", @@ -35,6 +39,7 @@ "rehype-pretty-code": "^0.14.0", "rehype-slug": "^6.0.0", "shadcn": "2.4.0-canary.10", + "sonner": "^2.0.3", "tailwind-merge": "^2.5.3", "unist-builder": "^4.0.0", "unist-util-visit": "^5.0.0" diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 8b4dade..5fa3acc 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -29,6 +29,9 @@ importers: '@radix-ui/react-label': specifier: ^2.1.2 version: 2.1.2(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-popover': + specifier: ^1.1.10 + version: 1.1.10(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) '@radix-ui/react-progress': specifier: ^1.1.2 version: 1.1.2(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) @@ -44,6 +47,15 @@ importers: '@radix-ui/react-switch': specifier: ^1.1.3 version: 1.1.3(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-toggle': + specifier: ^1.1.6 + version: 1.1.6(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-toggle-group': + specifier: ^1.1.7 + version: 1.1.7(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-tooltip': + specifier: ^1.2.3 + version: 1.2.3(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) '@radix-ui/react-visually-hidden': specifier: ^1.1.0 version: 1.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) @@ -83,6 +95,9 @@ importers: shadcn: specifier: 2.4.0-canary.10 version: 2.4.0-canary.10(@types/node@20.17.1)(typescript@5.6.3) + sonner: + specifier: ^2.0.3 + version: 2.0.3(react-dom@18.0.0(react@18.0.0))(react@18.0.0) tailwind-merge: specifier: ^2.5.3 version: 2.5.4 @@ -890,6 +905,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-arrow@1.1.4': + resolution: {integrity: sha512-qz+fxrqgNxG0dYew5l7qR3c7wdgRu1XVUHGnGYX7rg5HM4p9SWaRmJwfgR3J0SgyUKayLmzQIun+N6rWRgiRKw==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-avatar@1.1.1': resolution: {integrity: sha512-eoOtThOmxeoizxpX6RiEsQZ2wj5r4+zoeqAwO0cBaFQGjJwIH3dIX0OCxNrCyrrdxG+vBweMETh3VziQG7c1kw==} peerDependencies: @@ -968,6 +996,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-collection@1.1.4': + resolution: {integrity: sha512-cv4vSf7HttqXilDnAnvINd53OTl1/bjUYVZrkFnA7nwmY9Ob2POUy0WY0sfqBAe1s5FyKsyceQlqiEGPYNTadg==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-compose-refs@1.1.0': resolution: {integrity: sha512-b4inOtiaOnYf9KWyO3jAeeCG6FeyfY6ldiEPanbUjWd+xIk5wZeHa8yVwmrJ2vderhu/BQvzCrJI0lHd+wIiqw==} peerDependencies: @@ -1079,6 +1120,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-dismissable-layer@1.1.7': + resolution: {integrity: sha512-j5+WBUdhccJsmH5/H0K6RncjDtoALSEr6jbkaZu+bjw6hOPOhHycr6vEUujl+HBK8kjUfWcoCJXxP6e4lUlMZw==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-dropdown-menu@2.1.2': resolution: {integrity: sha512-GVZMR+eqK8/Kes0a36Qrv+i20bAPXSn8rCBTHx30w+3ECnR5o3xixAlqcVaYvLeyKUsm0aqyhWfmUcqufM8nYA==} peerDependencies: @@ -1101,6 +1155,15 @@ packages: '@types/react': optional: true + '@radix-ui/react-focus-guards@1.1.2': + resolution: {integrity: sha512-fyjAACV62oPV925xFCrH8DR5xWhg9KYtJT4s3u54jxp+L/hbpTY2kIeEFFbFe+a/HCE94zGQMZLIpVTPVZDhaA==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@radix-ui/react-focus-scope@1.1.0': resolution: {integrity: sha512-200UD8zylvEyL8Bx+z76RJnASR2gRMuxlgFCPAe/Q/679a/r0eK3MBVYMb7vZODZcffZBdob1EGnky78xmVvcA==} peerDependencies: @@ -1127,6 +1190,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-focus-scope@1.1.4': + resolution: {integrity: sha512-r2annK27lIW5w9Ho5NyQgqs0MmgZSTIKXWpVCJaLC1q2kZrZkcqnmHkCHMEmv8XLvsLlurKMPT+kbKkRkm/xVA==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-id@1.1.0': resolution: {integrity: sha512-EJUrI8yYh7WOjNOqpoJaf1jlFIH2LvtgAl+YcFqNCa+4hj64ZXmPkAKOFs/ukjz3byN6bdb/AVUqHkI8/uWWMA==} peerDependencies: @@ -1136,6 +1212,15 @@ packages: '@types/react': optional: true + '@radix-ui/react-id@1.1.1': + resolution: {integrity: sha512-kGkGegYIdQsOb4XjsfM97rXsiHaBwco+hFI66oO4s9LU+PLAC5oJ7khdOVFxkhsmlbpUqDAvXw11CluXP+jkHg==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@radix-ui/react-label@2.1.2': resolution: {integrity: sha512-zo1uGMTaNlHehDyFQcDZXRJhUPDuukcnHz0/jnrup0JA6qL+AFpAnty+7VKa9esuU5xTblAZzTGYJKSKaBxBhw==} peerDependencies: @@ -1162,6 +1247,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-popover@1.1.10': + resolution: {integrity: sha512-IZN7b3sXqajiPsOzKuNJBSP9obF4MX5/5UhTgWNofw4r1H+eATWb0SyMlaxPD/kzA4vadFgy1s7Z1AEJ6WMyHQ==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-popper@1.2.0': resolution: {integrity: sha512-ZnRMshKF43aBxVWPWvbj21+7TQCvhuULWJ4gNIKYpRlQt5xGRhLx66tMp8pya2UkGHTSlhpXwmjqltDYHhw7Vg==} peerDependencies: @@ -1188,6 +1286,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-popper@1.2.4': + resolution: {integrity: sha512-3p2Rgm/a1cK0r/UVkx5F/K9v/EplfjAeIFCGOPYPO4lZ0jtg4iSQXt/YGTSLWaf4x7NG6Z4+uKFcylcTZjeqDA==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-portal@1.1.2': resolution: {integrity: sha512-WeDYLGPxJb/5EGBoedyJbT0MpoULmwnIPMJMSldkuiMsBAv7N1cRdsTWZWht9vpPOiN3qyiGAtbK2is47/uMFg==} peerDependencies: @@ -1214,6 +1325,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-portal@1.1.6': + resolution: {integrity: sha512-XmsIl2z1n/TsYFLIdYam2rmFwf9OC/Sh2avkbmVMDuBZIe7hSpM0cYnWPAo7nHOVx8zTuwDZGByfcqLdnzp3Vw==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-presence@1.1.1': resolution: {integrity: sha512-IeFXVi4YS1K0wVZzXNrbaaUvIJ3qdY+/Ih4eHFhWA9SwGR9UDX7Ck8abvL57C4cv3wwMvUE0OG69Qc3NCcTe/A==} peerDependencies: @@ -1240,6 +1364,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-presence@1.1.3': + resolution: {integrity: sha512-IrVLIhskYhH3nLvtcBLQFZr61tBG7wx7O3kEmdzcYwRGAEBmBicGGL7ATzNgruYJ3xBTbuzEEq9OXJM3PAX3tA==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-primitive@2.0.0': resolution: {integrity: sha512-ZSpFm0/uHa8zTvKBDjLFWLo8dkr4MBsiDLz0g3gMUwqgLHz9rTaRRGYDgvZPtBJgYCBKXkS9fzmoySgr8CO6Cw==} peerDependencies: @@ -1279,6 +1416,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-primitive@2.1.0': + resolution: {integrity: sha512-/J/FhLdK0zVcILOwt5g+dH4KnkonCtkVJsa2G6JmvbbtZfBEI1gMsO3QMjseL4F/SwfAMt1Vc/0XKYKq+xJ1sw==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-progress@1.1.2': resolution: {integrity: sha512-u1IgJFQ4zNAUTjGdDL5dcl/U8ntOR6jsnhxKb5RKp5Ozwl88xKR9EqRZOe/Mk8tnx0x5tNUe2F+MzsyjqMg0MA==} peerDependencies: @@ -1331,6 +1481,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-roving-focus@1.1.7': + resolution: {integrity: sha512-C6oAg451/fQT3EGbWHbCQjYTtbyjNO1uzQgMzwyivcHT3GKNEmu1q3UuREhN+HzHAVtv3ivMVK08QlC+PkYw9Q==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-select@2.1.6': resolution: {integrity: sha512-T6ajELxRvTuAMWH0YmRJ1qez+x4/7Nq7QIx7zJ0VK3qaEWdnWpNbEDnmWldG1zBDwqrLy5aLMUWcoGirVj5kMg==} peerDependencies: @@ -1397,6 +1560,45 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-toggle-group@1.1.7': + resolution: {integrity: sha512-GRaPJhxrRSOqAcmcX3MwRL/SZACkoYdmoY9/sg7Bd5DhBYsB2t4co0NxTvVW8H7jUmieQDQwRtUlZ5Ta8UbgJA==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + + '@radix-ui/react-toggle@1.1.6': + resolution: {integrity: sha512-3SeJxKeO3TO1zVw1Nl++Cp0krYk6zHDHMCUXXVkosIzl6Nxcvb07EerQpyD2wXQSJ5RZajrYAmPaydU8Hk1IyQ==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + + '@radix-ui/react-tooltip@1.2.3': + resolution: {integrity: sha512-0KX7jUYFA02np01Y11NWkk6Ip6TqMNmD4ijLelYAzeIndl2aVeltjJFJ2gwjNa1P8U/dgjQ+8cr9Y3Ni+ZNoRA==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/react-use-callback-ref@1.1.0': resolution: {integrity: sha512-CasTfvsy+frcFkbXtSJ2Zu9JHpN8TYKxkgJGWbjiZhFivxaeW7rMeZt7QELGVLaYVfFMsKHjb7Ak0nMEe+2Vfw==} peerDependencies: @@ -1433,6 +1635,24 @@ packages: '@types/react': optional: true + '@radix-ui/react-use-controllable-state@1.2.2': + resolution: {integrity: sha512-BjasUjixPFdS+NKkypcyyN5Pmg83Olst0+c6vGov0diwTEo6mgdqVR6hxcEgFuh4QrAs7Rc+9KuGJ9TVCj0Zzg==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + + '@radix-ui/react-use-effect-event@0.0.2': + resolution: {integrity: sha512-Qp8WbZOBe+blgpuUT+lw2xheLP8q0oatc9UpmiemEICxGvFLYmHm9QowVZGHtJlGbS6A6yJ3iViad/2cVjnOiA==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@radix-ui/react-use-escape-keydown@1.1.0': resolution: {integrity: sha512-L7vwWlR1kTTQ3oh7g1O0CBF3YCyyTj8NmhLR+phShpyA50HCfBFKVJTpshm9PzLiKmehsrQzTYTpX9HvmC9rhw==} peerDependencies: @@ -1442,6 +1662,15 @@ packages: '@types/react': optional: true + '@radix-ui/react-use-escape-keydown@1.1.1': + resolution: {integrity: sha512-Il0+boE7w/XebUHyBjroE+DbByORGR9KKmITzbR7MyQ4akpORYP/ZmbhAr0DG7RmmBqoOnZdy2QlvajJ2QA59g==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@radix-ui/react-use-layout-effect@1.1.0': resolution: {integrity: sha512-+FPE0rOdziWSrH9athwI1R0HDVbWlEhd+FR+aSDk4uWGmSJ9Z54sdZVDQPZAinJhJXwfT+qnj969mCsT2gfm5w==} peerDependencies: @@ -1487,6 +1716,15 @@ packages: '@types/react': optional: true + '@radix-ui/react-use-rect@1.1.1': + resolution: {integrity: sha512-QTYuDesS0VtuHNNvMh+CjlKJ4LJickCMUAqjlE3+j8w+RlRpwyX3apEQKGFzbZGdo7XNG1tXa+bQqIE7HIXT2w==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@radix-ui/react-use-size@1.1.0': resolution: {integrity: sha512-XW3/vWuIXHa+2Uwcc2ABSfcCledmXhhQPlGbfcRXbiUQI5Icjcg19BGCZVKKInYbvUCut/ufbbLLPFC5cbb1hw==} peerDependencies: @@ -1531,9 +1769,25 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-visually-hidden@1.2.0': + resolution: {integrity: sha512-rQj0aAWOpCdCMRbI6pLQm8r7S2BM3YhTa0SzOYD55k+hJA8oo9J+H+9wLM9oMlZWOX/wJWPTzfDfmZkf7LvCfg==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + '@radix-ui/rect@1.1.0': resolution: {integrity: sha512-A9+lCBZoaMJlVKcRBz2YByCG+Cp2t6nAnMnNba+XiWxnj6r4JUFqfsgwocMBZU9LPtdxC6wB56ySYpc7LQIoJg==} + '@radix-ui/rect@1.1.1': + resolution: {integrity: sha512-HPwpGIzkl28mWyZqG52jiqDJ12waP11Pa1lGoiyUkIEuMLBP0oeK/C89esbXrxsky5we7dfd8U58nm0SgAWpVw==} + '@react-aria/focus@3.18.4': resolution: {integrity: sha512-91J35077w9UNaMK1cpMUEFRkNNz0uZjnSwiyBCFuRdaVuivO53wNC9XtWSDNDdcO5cGy87vfJRVAiyoCn/mjqA==} peerDependencies: @@ -3762,6 +4016,12 @@ packages: resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==} engines: {node: '>=8'} + sonner@2.0.3: + resolution: {integrity: sha512-njQ4Hht92m0sMqqHVDL32V2Oun9W1+PHO9NDv9FHfJjT3JT22IG4Jpo3FPQy+mouRKCXFWO+r67v6MrHX2zeIA==} + peerDependencies: + react: ^18.0.0 || ^19.0.0 || ^19.0.0-rc + react-dom: ^18.0.0 || ^19.0.0 || ^19.0.0-rc + source-map-js@1.2.1: resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==} engines: {node: '>=0.10.0'} @@ -5034,6 +5294,15 @@ snapshots: '@types/react': 18.0.0 '@types/react-dom': 18.0.0 + '@radix-ui/react-arrow@1.1.4(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@radix-ui/react-primitive': 2.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + '@radix-ui/react-avatar@1.1.1(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': dependencies: '@radix-ui/react-context': 1.1.1(@types/react@18.0.0)(react@18.0.0) @@ -5114,6 +5383,18 @@ snapshots: '@types/react': 18.0.0 '@types/react-dom': 18.0.0 + '@radix-ui/react-collection@1.1.4(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@radix-ui/react-compose-refs': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-context': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-primitive': 2.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-slot': 1.2.0(@types/react@18.0.0)(react@18.0.0) + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + '@radix-ui/react-compose-refs@1.1.0(@types/react@18.0.0)(react@18.0.0)': dependencies: react: 18.0.0 @@ -5210,6 +5491,19 @@ snapshots: '@types/react': 18.0.0 '@types/react-dom': 18.0.0 + '@radix-ui/react-dismissable-layer@1.1.7(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@radix-ui/primitive': 1.1.2 + '@radix-ui/react-compose-refs': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-primitive': 2.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-use-escape-keydown': 1.1.1(@types/react@18.0.0)(react@18.0.0) + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + '@radix-ui/react-dropdown-menu@2.1.2(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': dependencies: '@radix-ui/primitive': 1.1.0 @@ -5231,6 +5525,12 @@ snapshots: optionalDependencies: '@types/react': 18.0.0 + '@radix-ui/react-focus-guards@1.1.2(@types/react@18.0.0)(react@18.0.0)': + dependencies: + react: 18.0.0 + optionalDependencies: + '@types/react': 18.0.0 + '@radix-ui/react-focus-scope@1.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': dependencies: '@radix-ui/react-compose-refs': 1.1.0(@types/react@18.0.0)(react@18.0.0) @@ -5253,6 +5553,17 @@ snapshots: '@types/react': 18.0.0 '@types/react-dom': 18.0.0 + '@radix-ui/react-focus-scope@1.1.4(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@radix-ui/react-compose-refs': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-primitive': 2.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@18.0.0)(react@18.0.0) + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + '@radix-ui/react-id@1.1.0(@types/react@18.0.0)(react@18.0.0)': dependencies: '@radix-ui/react-use-layout-effect': 1.1.0(@types/react@18.0.0)(react@18.0.0) @@ -5260,6 +5571,13 @@ snapshots: optionalDependencies: '@types/react': 18.0.0 + '@radix-ui/react-id@1.1.1(@types/react@18.0.0)(react@18.0.0)': + dependencies: + '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@18.0.0)(react@18.0.0) + react: 18.0.0 + optionalDependencies: + '@types/react': 18.0.0 + '@radix-ui/react-label@2.1.2(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': dependencies: '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) @@ -5295,6 +5613,29 @@ snapshots: '@types/react': 18.0.0 '@types/react-dom': 18.0.0 + '@radix-ui/react-popover@1.1.10(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@radix-ui/primitive': 1.1.2 + '@radix-ui/react-compose-refs': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-context': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-dismissable-layer': 1.1.7(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-focus-guards': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-focus-scope': 1.1.4(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-id': 1.1.1(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-popper': 1.2.4(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-portal': 1.1.6(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-presence': 1.1.3(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-primitive': 2.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-slot': 1.2.0(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@18.0.0)(react@18.0.0) + aria-hidden: 1.2.4 + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + react-remove-scroll: 2.6.3(@types/react@18.0.0)(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + '@radix-ui/react-popper@1.2.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': dependencies: '@floating-ui/react-dom': 2.1.2(react-dom@18.0.0(react@18.0.0))(react@18.0.0) @@ -5331,6 +5672,24 @@ snapshots: '@types/react': 18.0.0 '@types/react-dom': 18.0.0 + '@radix-ui/react-popper@1.2.4(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@floating-ui/react-dom': 2.1.2(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-arrow': 1.1.4(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-compose-refs': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-context': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-primitive': 2.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-use-rect': 1.1.1(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-use-size': 1.1.1(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/rect': 1.1.1 + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + '@radix-ui/react-portal@1.1.2(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': dependencies: '@radix-ui/react-primitive': 2.0.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) @@ -5351,6 +5710,16 @@ snapshots: '@types/react': 18.0.0 '@types/react-dom': 18.0.0 + '@radix-ui/react-portal@1.1.6(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@radix-ui/react-primitive': 2.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@18.0.0)(react@18.0.0) + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + '@radix-ui/react-presence@1.1.1(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': dependencies: '@radix-ui/react-compose-refs': 1.1.0(@types/react@18.0.0)(react@18.0.0) @@ -5371,6 +5740,16 @@ snapshots: '@types/react': 18.0.0 '@types/react-dom': 18.0.0 + '@radix-ui/react-presence@1.1.3(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@radix-ui/react-compose-refs': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@18.0.0)(react@18.0.0) + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + '@radix-ui/react-primitive@2.0.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': dependencies: '@radix-ui/react-slot': 1.1.0(@types/react@18.0.0)(react@18.0.0) @@ -5398,6 +5777,15 @@ snapshots: '@types/react': 18.0.0 '@types/react-dom': 18.0.0 + '@radix-ui/react-primitive@2.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@radix-ui/react-slot': 1.2.0(@types/react@18.0.0)(react@18.0.0) + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + '@radix-ui/react-progress@1.1.2(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': dependencies: '@radix-ui/react-context': 1.1.1(@types/react@18.0.0)(react@18.0.0) @@ -5460,6 +5848,23 @@ snapshots: '@types/react': 18.0.0 '@types/react-dom': 18.0.0 + '@radix-ui/react-roving-focus@1.1.7(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@radix-ui/primitive': 1.1.2 + '@radix-ui/react-collection': 1.1.4(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-compose-refs': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-context': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-direction': 1.1.1(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-id': 1.1.1(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-primitive': 2.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@18.0.0)(react@18.0.0) + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + '@radix-ui/react-select@2.1.6(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': dependencies: '@radix-ui/number': 1.1.0 @@ -5544,6 +5949,52 @@ snapshots: '@types/react': 18.0.0 '@types/react-dom': 18.0.0 + '@radix-ui/react-toggle-group@1.1.7(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@radix-ui/primitive': 1.1.2 + '@radix-ui/react-context': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-direction': 1.1.1(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-primitive': 2.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-roving-focus': 1.1.7(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-toggle': 1.1.6(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@18.0.0)(react@18.0.0) + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + + '@radix-ui/react-toggle@1.1.6(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@radix-ui/primitive': 1.1.2 + '@radix-ui/react-primitive': 2.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@18.0.0)(react@18.0.0) + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + + '@radix-ui/react-tooltip@1.2.3(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@radix-ui/primitive': 1.1.2 + '@radix-ui/react-compose-refs': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-context': 1.1.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-dismissable-layer': 1.1.7(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-id': 1.1.1(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-popper': 1.2.4(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-portal': 1.1.6(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-presence': 1.1.3(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-primitive': 2.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + '@radix-ui/react-slot': 1.2.0(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-use-controllable-state': 1.2.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-visually-hidden': 1.2.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + '@radix-ui/react-use-callback-ref@1.1.0(@types/react@18.0.0)(react@18.0.0)': dependencies: react: 18.0.0 @@ -5570,6 +6021,21 @@ snapshots: optionalDependencies: '@types/react': 18.0.0 + '@radix-ui/react-use-controllable-state@1.2.2(@types/react@18.0.0)(react@18.0.0)': + dependencies: + '@radix-ui/react-use-effect-event': 0.0.2(@types/react@18.0.0)(react@18.0.0) + '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@18.0.0)(react@18.0.0) + react: 18.0.0 + optionalDependencies: + '@types/react': 18.0.0 + + '@radix-ui/react-use-effect-event@0.0.2(@types/react@18.0.0)(react@18.0.0)': + dependencies: + '@radix-ui/react-use-layout-effect': 1.1.1(@types/react@18.0.0)(react@18.0.0) + react: 18.0.0 + optionalDependencies: + '@types/react': 18.0.0 + '@radix-ui/react-use-escape-keydown@1.1.0(@types/react@18.0.0)(react@18.0.0)': dependencies: '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@18.0.0)(react@18.0.0) @@ -5577,6 +6043,13 @@ snapshots: optionalDependencies: '@types/react': 18.0.0 + '@radix-ui/react-use-escape-keydown@1.1.1(@types/react@18.0.0)(react@18.0.0)': + dependencies: + '@radix-ui/react-use-callback-ref': 1.1.1(@types/react@18.0.0)(react@18.0.0) + react: 18.0.0 + optionalDependencies: + '@types/react': 18.0.0 + '@radix-ui/react-use-layout-effect@1.1.0(@types/react@18.0.0)(react@18.0.0)': dependencies: react: 18.0.0 @@ -5608,6 +6081,13 @@ snapshots: optionalDependencies: '@types/react': 18.0.0 + '@radix-ui/react-use-rect@1.1.1(@types/react@18.0.0)(react@18.0.0)': + dependencies: + '@radix-ui/rect': 1.1.1 + react: 18.0.0 + optionalDependencies: + '@types/react': 18.0.0 + '@radix-ui/react-use-size@1.1.0(@types/react@18.0.0)(react@18.0.0)': dependencies: '@radix-ui/react-use-layout-effect': 1.1.0(@types/react@18.0.0)(react@18.0.0) @@ -5640,8 +6120,19 @@ snapshots: '@types/react': 18.0.0 '@types/react-dom': 18.0.0 + '@radix-ui/react-visually-hidden@1.2.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0)': + dependencies: + '@radix-ui/react-primitive': 2.1.0(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0(react@18.0.0))(react@18.0.0) + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + optionalDependencies: + '@types/react': 18.0.0 + '@types/react-dom': 18.0.0 + '@radix-ui/rect@1.1.0': {} + '@radix-ui/rect@1.1.1': {} + '@react-aria/focus@3.18.4(react@18.0.0)': dependencies: '@react-aria/interactions': 3.22.4(react@18.0.0) @@ -8424,6 +8915,11 @@ snapshots: slash@3.0.0: {} + sonner@2.0.3(react-dom@18.0.0(react@18.0.0))(react@18.0.0): + dependencies: + react: 18.0.0 + react-dom: 18.0.0(react@18.0.0) + source-map-js@1.2.1: {} source-map-support@0.5.21: diff --git a/preview/components/label.tsx b/preview/components/label.tsx new file mode 100644 index 0000000..a5a4ec5 --- /dev/null +++ b/preview/components/label.tsx @@ -0,0 +1,13 @@ +"use client"; + +import { Checkbox } from "@/components/retroui"; +import { Label } from "@/components/retroui"; + +export default function LabelDefault() { + return ( +
+ + +
+ ); +} diff --git a/preview/components/popover-style-default-shadow.tsx b/preview/components/popover-style-default-shadow.tsx new file mode 100644 index 0000000..3a3efc3 --- /dev/null +++ b/preview/components/popover-style-default-shadow.tsx @@ -0,0 +1,52 @@ +"use client"; + +import { + Popover, + PopoverTrigger, + PopoverContent, + Label, + Button, + Input, +} from "@/components/retroui"; + +export default function PopoverStyleDefaultShadow() { + return ( + + + + + +
+
+

Dimensions

+

+ Set the dimensions for the layer. +

+
+ +
+
+ + + +
+ +
+ + + +
+
+
+
+
+ ); +} diff --git a/preview/components/popover-style-default.tsx b/preview/components/popover-style-default.tsx new file mode 100644 index 0000000..ffb62ea --- /dev/null +++ b/preview/components/popover-style-default.tsx @@ -0,0 +1,52 @@ +"use client"; + +import { + Popover, + PopoverTrigger, + PopoverContent, + Label, + Button, + Input, +} from "@/components/retroui"; + +export default function PopoverStyleDefault() { + return ( + + + + + +
+
+

Dimensions

+

+ Set the dimensions for the layer. +

+
+ +
+
+ + + +
+ +
+ + + +
+
+
+
+
+ ); +} diff --git a/preview/components/popover-style-primary-shadow.tsx b/preview/components/popover-style-primary-shadow.tsx new file mode 100644 index 0000000..57b11d4 --- /dev/null +++ b/preview/components/popover-style-primary-shadow.tsx @@ -0,0 +1,52 @@ +"use client"; + +import { + Popover, + PopoverTrigger, + PopoverContent, + Label, + Button, + Input, +} from "@/components/retroui"; + +export default function PopoverStylePrimaryShadow() { + return ( + + + + + +
+
+

Dimensions

+

+ Set the dimensions for the layer. +

+
+ +
+
+ + + +
+ +
+ + + +
+
+
+
+
+ ); +} diff --git a/preview/components/popover-style-primary.tsx b/preview/components/popover-style-primary.tsx new file mode 100644 index 0000000..e7cc9ab --- /dev/null +++ b/preview/components/popover-style-primary.tsx @@ -0,0 +1,52 @@ +"use client"; + +import { + Popover, + PopoverTrigger, + PopoverContent, + Label, + Button, + Input, +} from "@/components/retroui"; + +export default function PopoverStylePrimary() { + return ( + + + + + +
+
+

Dimensions

+

+ Set the dimensions for the layer. +

+
+ +
+
+ + + +
+ +
+ + + +
+
+
+
+
+ ); +} diff --git a/preview/components/sonner-style-default.tsx b/preview/components/sonner-style-default.tsx new file mode 100644 index 0000000..916680e --- /dev/null +++ b/preview/components/sonner-style-default.tsx @@ -0,0 +1,16 @@ +import { Button } from "@/components/retroui"; +import { toast } from "sonner"; + +export default function SonnerStyleDefault() { + const onClick = () => { + toast("Event has been created", { + description: "Sunday, December 03, 2025", + cancel: { + label: "Undo", + onClick: () => {}, + }, + }); + }; + + return ; +} diff --git a/preview/components/sonner-style-error.tsx b/preview/components/sonner-style-error.tsx new file mode 100644 index 0000000..08d8a00 --- /dev/null +++ b/preview/components/sonner-style-error.tsx @@ -0,0 +1,10 @@ +import { Button } from "@/components/retroui"; +import { toast } from "sonner"; + +export default function SonnerStyleError() { + const onClick = () => { + toast.error("Oops! you ran into a pot hole"); + }; + + return ; +} diff --git a/preview/components/sonner-style-rich-colors.tsx b/preview/components/sonner-style-rich-colors.tsx new file mode 100644 index 0000000..afdf208 --- /dev/null +++ b/preview/components/sonner-style-rich-colors.tsx @@ -0,0 +1,12 @@ +import { Button } from "@/components/retroui"; +import { toast } from "sonner"; + +export default function SonnerStyleRichColors() { + const onClick = () => { + toast.success("Congrats man 🎉", { + richColors: true, + }); + }; + + return ; +} diff --git a/preview/components/sonner-style-warning.tsx b/preview/components/sonner-style-warning.tsx new file mode 100644 index 0000000..a136c1a --- /dev/null +++ b/preview/components/sonner-style-warning.tsx @@ -0,0 +1,10 @@ +import { Button } from "@/components/retroui"; +import { toast } from "sonner"; + +export default function SonnerStyleWarning() { + const onClick = () => { + toast.warning("This is a serious warning"); + }; + + return ; +} diff --git a/preview/components/toggle-group-style-default.tsx b/preview/components/toggle-group-style-default.tsx new file mode 100644 index 0000000..5890be7 --- /dev/null +++ b/preview/components/toggle-group-style-default.tsx @@ -0,0 +1,22 @@ +"use client"; + +import { ToggleGroup, ToggleGroupItem } from "@/components/retroui"; +import { Bold, Italic, Underline } from "lucide-react"; + +export default function ToggleGroupStyleDefault() { + return ( + + + + + + + + + + + + + + ); +} diff --git a/preview/components/toggle-group-style-outline-muted.tsx b/preview/components/toggle-group-style-outline-muted.tsx new file mode 100644 index 0000000..57abb57 --- /dev/null +++ b/preview/components/toggle-group-style-outline-muted.tsx @@ -0,0 +1,22 @@ +"use client"; + +import { ToggleGroup, ToggleGroupItem } from "@/components/retroui"; +import { Bold, Italic, Underline } from "lucide-react"; + +export default function ToggleGroupStyleOutlineMuted() { + return ( + + + + + + + + + + + + + + ); +} diff --git a/preview/components/toggle-group-style-outlined.tsx b/preview/components/toggle-group-style-outlined.tsx new file mode 100644 index 0000000..a34de35 --- /dev/null +++ b/preview/components/toggle-group-style-outlined.tsx @@ -0,0 +1,22 @@ +"use client"; + +import { ToggleGroup, ToggleGroupItem } from "@/components/retroui"; +import { Bold, Italic, Underline } from "lucide-react"; + +export default function ToggleGroupStyleOutlined() { + return ( + + + + + + + + + + + + + + ); +} diff --git a/preview/components/toggle-group-style-solid.tsx b/preview/components/toggle-group-style-solid.tsx new file mode 100644 index 0000000..a32745e --- /dev/null +++ b/preview/components/toggle-group-style-solid.tsx @@ -0,0 +1,22 @@ +"use client"; + +import { ToggleGroup, ToggleGroupItem } from "@/components/retroui"; +import { Bold, Italic, Underline } from "lucide-react"; + +export default function ToggleGroupStyleSolid() { + return ( + + + + + + + + + + + + + + ); +} diff --git a/preview/components/toggle-style-default.tsx b/preview/components/toggle-style-default.tsx new file mode 100644 index 0000000..7b77ea7 --- /dev/null +++ b/preview/components/toggle-style-default.tsx @@ -0,0 +1,10 @@ +import { Toggle } from "@/components/retroui"; +import { Bold } from "lucide-react"; + +export default function ToggleStyleDefault() { + return ( + + + + ); +} diff --git a/preview/components/toggle-style-outline-muted.tsx b/preview/components/toggle-style-outline-muted.tsx new file mode 100644 index 0000000..d4a4a21 --- /dev/null +++ b/preview/components/toggle-style-outline-muted.tsx @@ -0,0 +1,10 @@ +import { Toggle } from "@/components/retroui"; +import { Bold } from "lucide-react"; + +export default function ToggleStyleOutlineMuted() { + return ( + + + + ); +} diff --git a/preview/components/toggle-style-outlined.tsx b/preview/components/toggle-style-outlined.tsx new file mode 100644 index 0000000..4c95db1 --- /dev/null +++ b/preview/components/toggle-style-outlined.tsx @@ -0,0 +1,10 @@ +import { Toggle } from "@/components/retroui"; +import { Bold } from "lucide-react"; + +export default function ToggleStyleOutlined() { + return ( + + + + ); +} diff --git a/preview/components/toggle-style-solid.tsx b/preview/components/toggle-style-solid.tsx new file mode 100644 index 0000000..1fa1517 --- /dev/null +++ b/preview/components/toggle-style-solid.tsx @@ -0,0 +1,10 @@ +import { Toggle } from "@/components/retroui"; +import { Italic } from "lucide-react"; + +export default function ToggleStyleSolid() { + return ( + + Italics + + ); +} diff --git a/preview/components/tooltip-style-default.tsx b/preview/components/tooltip-style-default.tsx new file mode 100644 index 0000000..10557be --- /dev/null +++ b/preview/components/tooltip-style-default.tsx @@ -0,0 +1,22 @@ +"use client"; + +import { + Button, + Tooltip, + TooltipProvider, + TooltipTrigger, + TooltipContent, +} from "@/components/retroui"; + +export default function TooltipStyleDefault() { + return ( + + + + + + Add to Library + + + ); +} diff --git a/preview/components/tooltip-style-primary.tsx b/preview/components/tooltip-style-primary.tsx new file mode 100644 index 0000000..170b0ff --- /dev/null +++ b/preview/components/tooltip-style-primary.tsx @@ -0,0 +1,22 @@ +"use client"; + +import { + Button, + Tooltip, + TooltipProvider, + TooltipTrigger, + TooltipContent, +} from "@/components/retroui"; + +export default function TooltipStylePrimary() { + return ( + + + + + + Add to Library + + + ); +} diff --git a/preview/components/tooltip-style-solid.tsx b/preview/components/tooltip-style-solid.tsx new file mode 100644 index 0000000..5f926d5 --- /dev/null +++ b/preview/components/tooltip-style-solid.tsx @@ -0,0 +1,22 @@ +"use client"; + +import { + Button, + Tooltip, + TooltipProvider, + TooltipTrigger, + TooltipContent, +} from "@/components/retroui"; + +export default function TooltipStyleSolid() { + return ( + + + + + + Add to Library + + + ); +} diff --git a/public/r/popover.json b/public/r/popover.json new file mode 100644 index 0000000..71a97a6 --- /dev/null +++ b/public/r/popover.json @@ -0,0 +1,16 @@ +{ + "name": "popover", + "type": "registry:component", + "title": "Popover", + "description": "A handy small component for your little input needs...😉", + "dependencies": ["@radix-ui/react-popover", "class-variance-authority"], + "author": "Ankan Bhattacharya ", + "files": [ + { + "path": "components/retroui/Popover.tsx", + "target": "components/retroui/Popover.tsx", + "type": "registry:component", + "content": "\"use client\";\n\nimport * as React from \"react\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\n\nimport { cn } from \"@/lib/utils\";\nimport { cva, VariantProps } from \"class-variance-authority\";\n\nconst popoverContentVariants = cva(\n \"z-50 w-72 rounded-md border bg-primary p-4 text-popover-foreground 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 origin-[--radix-popover-content-transform-origin]\",\n {\n variants: {\n variant: {\n default: \"bg-background\",\n primary: \"bg-primary\",\n },\n shadow: {\n default: \"\",\n sm: \"shadow-sm\",\n md: \"shadow-md\",\n lg: \"shadow-lg\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n shadow: \"default\",\n },\n },\n);\n\nconst Popover = PopoverPrimitive.Root;\n\nconst PopoverTrigger = PopoverPrimitive.Trigger;\n\nconst PopoverAnchor = PopoverPrimitive.Anchor;\n\nconst PopoverContent = React.forwardRef<\n React.ElementRef,\n React.ComponentPropsWithoutRef &\n VariantProps\n>(\n (\n {\n className,\n align = \"center\",\n sideOffset = 4,\n variant,\n shadow,\n ...props\n },\n ref,\n ) => (\n \n \n \n ),\n);\nPopoverContent.displayName = PopoverPrimitive.Content.displayName;\n\nexport { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };\n" + } + ] +} diff --git a/public/r/sonner.json b/public/r/sonner.json new file mode 100644 index 0000000..055f571 --- /dev/null +++ b/public/r/sonner.json @@ -0,0 +1,15 @@ +{ + "name": "sonner", + "type": "registry:component", + "title": "Sonner", + "description": "A beautiful toast component that can grab audience attention from any place.", + "dependencies": ["sonner", "lucide-react", "class-variance-authority"], + "files": [ + { + "path": "components/retroui/Sonner.tsx", + "target": "components/retroui/Sonner.tsx", + "type": "registry:component", + "content": "\"use client\";\n\nimport { Toaster as Sonner } from \"sonner\";\n\ntype ToasterProps = React.ComponentProps;\n\nconst Toaster = ({ ...props }: ToasterProps) => {\n return (\n \n );\n};\n\nexport { Toaster };\n" + } + ] +} diff --git a/public/r/toggle-group.json b/public/r/toggle-group.json new file mode 100644 index 0000000..249622b --- /dev/null +++ b/public/r/toggle-group.json @@ -0,0 +1,26 @@ +{ + "name": "toggle-group", + "type": "registry:component", + "title": "Toggle Group", + "description": "Group of toggling buttons...🤙", + "dependencies": [ + "@radix-ui/react-toggle", + "@radix-ui/react-toggle-group", + "class-variance-authority" + ], + "author": "Ankan Bhattacharya ", + "files": [ + { + "path": "components/retroui/Toggle.tsx", + "target": "components/retroui/Toggle.tsx", + "type": "registry:component", + "content": "\"use client\";\n\nimport * as React from \"react\";\nimport * as TogglePrimitive from \"@radix-ui/react-toggle\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@/lib/utils\";\n\nconst toggleVariants = cva(\n \"inline-flex items-center justify-center text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 gap-2\",\n {\n variants: {\n variant: {\n default:\n \"bg-transparent hover:bg-muted/70 hover:text-muted-foreground data-[state=on]:bg-muted\",\n outlined:\n \"border-2 border-input bg-transparent hover:bg-accent hover:text-accent-foreground/80 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground\",\n solid: \"border-2 border-input bg-transparent hover:bg-black hover:text-white/90 hover:border-black data-[state=on]:bg-black data-[state=on]:text-white data-[state=on]:border-black\",\n \"outline-muted\":\n \"border-2 border-input bg-transparent hover:hover:bg-muted/70 hover:hover:text-muted-foreground data-[state=on]:bg-muted\",\n },\n size: {\n default: \"h-10 px-3 min-w-10\",\n sm: \"h-9 px-2.5 min-w-9\",\n lg: \"h-11 px-5 min-w-11\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n },\n);\n\nconst Toggle = React.forwardRef<\n React.ElementRef,\n React.ComponentPropsWithoutRef &\n VariantProps\n>(({ className, variant, size, ...props }, ref) => (\n \n));\n\nToggle.displayName = TogglePrimitive.Root.displayName;\n\nexport { Toggle, toggleVariants };\n" + }, + { + "path": "components/retroui/ToggleGroup.tsx", + "target": "components/retroui/ToggleGroup.tsx", + "type": "registry:component", + "content": "\"use client\";\n\nimport * as React from \"react\";\nimport * as ToggleGroupPrimitive from \"@radix-ui/react-toggle-group\";\nimport { type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@/lib/utils\";\nimport { toggleVariants } from \"./Toggle\";\n\nconst ToggleGroupContext = React.createContext<\n VariantProps\n>({\n size: \"default\",\n variant: \"default\",\n});\n\nconst ToggleGroup = React.forwardRef<\n React.ElementRef,\n React.ComponentPropsWithoutRef &\n VariantProps\n>(({ className, variant, size, children, ...props }, ref) => (\n \n \n {children}\n \n \n));\n\nToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;\n\nconst ToggleGroupItem = React.forwardRef<\n React.ElementRef,\n React.ComponentPropsWithoutRef &\n VariantProps\n>(({ className, children, variant, size, ...props }, ref) => {\n const context = React.useContext(ToggleGroupContext);\n\n return (\n \n {children}\n \n );\n});\n\nToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;\n\nexport { ToggleGroup, ToggleGroupItem };\n" + } + ] +} diff --git a/public/r/toggle.json b/public/r/toggle.json new file mode 100644 index 0000000..d0b3ec0 --- /dev/null +++ b/public/r/toggle.json @@ -0,0 +1,17 @@ +{ + "$schema": "https://ui.shadcn.com/schema/registry-item.json", + "name": "toggle", + "type": "registry:component", + "title": "toggle", + "description": "This crazy toggling button keeps people toggling...😃", + "dependencies": ["@radix-ui/react-toggle", "class-variance-authority"], + "author": "Ankan Bhattacharya ", + "files": [ + { + "path": "components/retroui/Toggle.tsx", + "content": "\"use client\";\n\nimport * as React from \"react\";\nimport * as TogglePrimitive from \"@radix-ui/react-toggle\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@/lib/utils\";\n\nconst toggleVariants = cva(\n \"inline-flex items-center justify-center text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 gap-2\",\n {\n variants: {\n variant: {\n default:\n \"bg-transparent hover:bg-muted/70 hover:text-muted-foreground data-[state=on]:bg-muted\",\n outlined:\n \"border-2 border-input bg-transparent hover:bg-accent hover:text-accent-foreground/80 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground\",\n solid: \"border-2 border-input bg-transparent hover:bg-black hover:text-white/90 hover:border-black data-[state=on]:bg-black data-[state=on]:text-white data-[state=on]:border-black\",\n \"outline-muted\":\n \"border-2 border-input bg-transparent hover:hover:bg-muted/70 hover:hover:text-muted-foreground data-[state=on]:bg-muted\",\n },\n size: {\n default: \"h-10 px-3 min-w-10\",\n sm: \"h-9 px-2.5 min-w-9\",\n lg: \"h-11 px-5 min-w-11\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n },\n);\n\nconst Toggle = React.forwardRef<\n React.ElementRef,\n React.ComponentPropsWithoutRef &\n VariantProps\n>(({ className, variant, size, ...props }, ref) => (\n \n));\n\nToggle.displayName = TogglePrimitive.Root.displayName;\n\nexport { Toggle, toggleVariants };\n", + "type": "registry:component", + "target": "components/retroui/Toggle.tsx" + } + ] +} diff --git a/public/r/tooltip.json b/public/r/tooltip.json new file mode 100644 index 0000000..8415157 --- /dev/null +++ b/public/r/tooltip.json @@ -0,0 +1,16 @@ +{ + "name": "tooltip", + "type": "registry:component", + "title": "Tooltip", + "description": "A cool way to give your users a hint of what a component does...😉", + "dependencies": ["@radix-ui/react-tooltip", "class-variance-authority"], + "author": "Ankan Bhattacharya ", + "files": [ + { + "path": "components/retroui/Tooltip.tsx", + "target": "components/retroui/Tooltip.tsx", + "type": "registry:component", + "content": "\"use client\";\n\nimport * as React from \"react\";\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\n\nimport { cn } from \"@/lib/utils\";\nimport { cva, VariantProps } from \"class-variance-authority\";\n\nconst tooltipContentVariants = cva(\n \"z-50 overflow-hidden border-2 border-border bg-background px-3 py-1.5 text-xs 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 origin-[--radix-tooltip-content-transform-origin]\",\n {\n variants: {\n variant: {\n default: \"bg-background text-foreground\",\n primary: \"bg-primary text-foreground\",\n solid: \"bg-solid text-solid-foreground\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n },\n },\n);\n\nconst TooltipProvider = TooltipPrimitive.Provider;\n\nconst Tooltip = TooltipPrimitive.Root;\n\nconst TooltipTrigger = TooltipPrimitive.Trigger;\n\nconst TooltipContent = React.forwardRef<\n React.ElementRef,\n React.ComponentPropsWithoutRef &\n VariantProps\n>(({ className, sideOffset = 4, variant, ...props }, ref) => (\n \n \n \n));\nTooltipContent.displayName = TooltipPrimitive.Content.displayName;\n\nexport { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };\n" + } + ] +} diff --git a/registry.json b/registry.json index 56d1b98..7bdf4cf 100644 --- a/registry.json +++ b/registry.json @@ -246,6 +246,24 @@ } ] }, + { + "name": "popover", + "type": "registry:component", + "title": "Popover", + "description": "A handy small component for your little input needs...😉", + "dependencies": [ + "@radix-ui/react-popover", + "class-variance-authority" + ], + "author": "Ankan Bhattacharya ", + "files": [ + { + "path": "components/retroui/Popover.tsx", + "target": "components/retroui/Popover.tsx", + "type": "registry:component" + } + ] + }, { "name": "radio", "type": "registry:component", @@ -297,6 +315,24 @@ } ] }, + { + "name": "sonner", + "type": "registry:component", + "title": "Sonner", + "description": "A beautiful toast component that can grab audience attention from any place.", + "dependencies": [ + "sonner", + "lucide-react", + "class-variance-authority" + ], + "files": [ + { + "path": "components/retroui/Sonner.tsx", + "target": "components/retroui/Sonner.tsx", + "type": "registry:component" + } + ] + }, { "name": "switch", "type": "registry:component", @@ -358,6 +394,96 @@ } ] }, + { + "name": "toggle", + "type": "registry:component", + "title": "Toggle", + "description": "This crazy toggling button keeps people toggling...😃", + "dependencies": [ + "@radix-ui/react-toggle", + "class-variance-authority" + ], + "author": "Ankan Bhattacharya ", + "files": [ + { + "path": "components/retroui/Toggle.tsx", + "target": "components/retroui/Toggle.tsx", + "type": "registry:component", + "name": "accordion-style-default", + "title": "accordion-style-default", + "registryDependencies": [ + "https://retroui.dev/r/accordion.json" + ], + "files": [ + { + "path": "preview/components/accordion-style-default.tsx", + "target": "components/retroui/preview/accordion-style-default.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "toggle-group", + "type": "registry:component", + "title": "Toggle Group", + "description": "Group of toggling buttons...🤙", + "dependencies": [ + "@radix-ui/react-toggle", + "@radix-ui/react-toggle-group", + "class-variance-authority" + ], + "author": "Ankan Bhattacharya ", + "files": [ + { + "path": "components/retroui/Toggle.tsx", + "target": "components/retroui/Toggle.tsx", + "type": "registry:component" + }, + { + "path": "components/retroui/ToggleGroup.tsx", + "target": "components/retroui/ToggleGroup.tsx", + "type": "registry:component", + "name": "alert-style-default", + "title": "alert-style-default", + "registryDependencies": [ + "https://retroui.dev/r/alert.json" + ], + "files": [ + { + "path": "preview/components/alert-style-default.tsx", + "target": "components/retroui/preview/alert-style-default.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "tooltip", + "type": "registry:component", + "title": "Tooltip", + "description": "A cool way to give your users a hint of what a component does...😉", + "dependencies": [ + "@radix-ui/react-tooltip", + "class-variance-authority" + ], + "author": "Ankan Bhattacharya ", + "files": [ + { + "path": "components/retroui/Tooltip.tsx", + "target": "components/retroui/Tooltip.tsx", + "type": "registry:component", + "name": "alert-style-solid", + "title": "alert-style-solid", + "registryDependencies": [ + "https://retroui.dev/r/alert.json" + ], + "files": [ + { + "path": "preview/components/alert-style-solid.tsx", + "target": "components/retroui/preview/alert-style-solid.tsx", + "type": "registry:block" + } + ] + }, { "name": "accordion-style-default", "title": "accordion-style-default", @@ -1004,4 +1130,4 @@ ] } ] -} \ No newline at end of file +} From 802779e7bd59a8ae0426d7a5e8d6395f09763348 Mon Sep 17 00:00:00 2001 From: Ankan Bhattacharya Date: Thu, 24 Apr 2025 14:36:27 +0530 Subject: [PATCH 2/8] feat: :sparkles: add toggle group and toogle v0 compat --- public/r/toggle-group-outlined.json | 18 +++ public/r/toggle-group-style-default.json | 18 +++ .../r/toggle-group-style-outline-muted.json | 18 +++ public/r/toggle-group-style-solid.json | 18 +++ public/r/toggle-style-default.json | 15 ++ public/r/toggle-style-outline-muted.json | 15 ++ public/r/toggle-style-outlined.json | 15 ++ public/r/toggle-style-solid.json | 15 ++ registry.json | 132 ++++++++++++++++++ 9 files changed, 264 insertions(+) create mode 100644 public/r/toggle-group-outlined.json create mode 100644 public/r/toggle-group-style-default.json create mode 100644 public/r/toggle-group-style-outline-muted.json create mode 100644 public/r/toggle-group-style-solid.json create mode 100644 public/r/toggle-style-default.json create mode 100644 public/r/toggle-style-outline-muted.json create mode 100644 public/r/toggle-style-outlined.json create mode 100644 public/r/toggle-style-solid.json diff --git a/public/r/toggle-group-outlined.json b/public/r/toggle-group-outlined.json new file mode 100644 index 0000000..132b404 --- /dev/null +++ b/public/r/toggle-group-outlined.json @@ -0,0 +1,18 @@ +{ + "name": "toggle-group-style-outline-muted", + "title": "toggle-group-style-outline-muted", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/toggle.json", + "https://retroui.dev/r/toggle-group.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-group-style-outline-muted.tsx", + "target": "components/retroui/preview/toggle-group-style-outline-muted.tsx", + "type": "registry:block", + "content": "\"use client\";\n\nimport { ToggleGroup, ToggleGroupItem } from \"@/components/retroui\";\nimport { Bold, Italic, Underline } from \"lucide-react\";\n\nexport default function ToggleGroupStyleOutlined() {\n return (\n \n \n \n \n\n \n \n \n\n \n \n \n \n );\n}\n" + } + ] +} diff --git a/public/r/toggle-group-style-default.json b/public/r/toggle-group-style-default.json new file mode 100644 index 0000000..8512102 --- /dev/null +++ b/public/r/toggle-group-style-default.json @@ -0,0 +1,18 @@ +{ + "name": "toggle-group-style-default", + "title": "toggle-group-style-default", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/toggle.json", + "https://retroui.dev/r/toggle-group.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-group-style-default.tsx", + "target": "components/retroui/preview/toggle-group-style-default.tsx", + "type": "registry:block", + "content": "\"use client\";\n\nimport { ToggleGroup, ToggleGroupItem } from \"@/components/retroui\";\nimport { Bold, Italic, Underline } from \"lucide-react\";\n\nexport default function ToggleGroupStyleDefault() {\n return (\n \n \n \n \n\n \n \n \n\n \n \n \n \n );\n}" + } + ] +} diff --git a/public/r/toggle-group-style-outline-muted.json b/public/r/toggle-group-style-outline-muted.json new file mode 100644 index 0000000..35061d1 --- /dev/null +++ b/public/r/toggle-group-style-outline-muted.json @@ -0,0 +1,18 @@ +{ + "name": "toggle-group-style-outline-muted", + "title": "toggle-group-style-outline-muted", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/toggle.json", + "https://retroui.dev/r/toggle-group.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-group-style-outline-muted.tsx", + "target": "components/retroui/preview/toggle-group-style-outline-muted.tsx", + "type": "registry:block", + "content": "\"use client\";\n\nimport { ToggleGroup, ToggleGroupItem } from \"@/components/retroui\";\nimport { Bold, Italic, Underline } from \"lucide-react\";\n\nexport default function ToggleGroupStyleOutlineMuted() {\n return (\n \n \n \n \n\n \n \n \n\n \n \n \n \n );\n}" + } + ] +} diff --git a/public/r/toggle-group-style-solid.json b/public/r/toggle-group-style-solid.json new file mode 100644 index 0000000..e85e918 --- /dev/null +++ b/public/r/toggle-group-style-solid.json @@ -0,0 +1,18 @@ +{ + "name": "toggle-group-style-outline-muted", + "title": "toggle-group-style-outline-muted", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/toggle.json", + "https://retroui.dev/r/toggle-group.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-group-style-outline-muted.tsx", + "target": "components/retroui/preview/toggle-group-style-outline-muted.tsx", + "type": "registry:block", + "content": "\"use client\";\n\nimport { ToggleGroup, ToggleGroupItem } from \"@/components/retroui\";\nimport { Bold, Italic, Underline } from \"lucide-react\";\n\nexport default function ToggleGroupStyleSolid() {\n return (\n \n \n \n \n\n \n \n \n\n \n \n \n \n );\n}\n" + } + ] +} diff --git a/public/r/toggle-style-default.json b/public/r/toggle-style-default.json new file mode 100644 index 0000000..964802e --- /dev/null +++ b/public/r/toggle-style-default.json @@ -0,0 +1,15 @@ +{ + "name": "toggle-style-default", + "title": "toggle-style-default", + "type": "registry:block", + "registryDependencies": ["https://retroui.dev/r/toggle.json"], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-style-default.tsx", + "target": "components/retroui/preview/toggle-style-default.tsx", + "type": "registry:block", + "content": "import { Toggle } from \"@/components/retroui\";\nimport { Bold } from \"lucide-react\";\n\nexport default function ToggleStyleDefault() {\n return (\n \n \n \n );\n}\n" + } + ] +} diff --git a/public/r/toggle-style-outline-muted.json b/public/r/toggle-style-outline-muted.json new file mode 100644 index 0000000..feaa8eb --- /dev/null +++ b/public/r/toggle-style-outline-muted.json @@ -0,0 +1,15 @@ +{ + "name": "toggle-style-outline-muted", + "title": "toggle-style-outline-muted", + "type": "registry:block", + "registryDependencies": ["https://retroui.dev/r/toggle.json"], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-style-outline-muted.tsx", + "target": "components/retroui/preview/toggle-style-outline-muted.tsx", + "type": "registry:block", + "content": "import { Toggle } from \"@/components/retroui\";\nimport { Bold } from \"lucide-react\";\n\nexport default function ToggleStyleOutlineMuted() {\n return (\n \n \n \n );\n}" + } + ] +} diff --git a/public/r/toggle-style-outlined.json b/public/r/toggle-style-outlined.json new file mode 100644 index 0000000..c51fbf4 --- /dev/null +++ b/public/r/toggle-style-outlined.json @@ -0,0 +1,15 @@ +{ + "name": "toggle-style-outlined", + "title": "toggle-style-outlined", + "type": "registry:block", + "registryDependencies": ["https://retroui.dev/r/toggle.json"], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-style-outlined.tsx", + "target": "components/retroui/preview/toggle-style-outlined.tsx", + "type": "registry:block", + "content": "import { Toggle } from \"@/components/retroui\";\nimport { Bold } from \"lucide-react\";\n\nexport default function ToggleStyleOutlined() {\n return (\n \n \n \n );\n}" + } + ] +} diff --git a/public/r/toggle-style-solid.json b/public/r/toggle-style-solid.json new file mode 100644 index 0000000..7332e8f --- /dev/null +++ b/public/r/toggle-style-solid.json @@ -0,0 +1,15 @@ +{ + "name": "toggle-style-solid", + "title": "toggle-style-solid", + "type": "registry:block", + "registryDependencies": ["https://retroui.dev/r/toggle.json"], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-style-solid.tsx", + "target": "components/retroui/preview/toggle-style-solid.tsx", + "type": "registry:block", + "content": "import { Toggle } from \"@/components/retroui\";\nimport { Italic } from \"lucide-react\";\n\nexport default function ToggleStyleSolid() {\n return (\n \n Italics\n \n );\n}" + } + ] +} diff --git a/registry.json b/registry.json index 7bdf4cf..b77d31c 100644 --- a/registry.json +++ b/registry.json @@ -1128,6 +1128,138 @@ "type": "registry:block" } ] + }, + { + "name": "toggle-style-default", + "title": "toggle-style-default", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/toggle.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-style-default.tsx", + "target": "components/retroui/preview/toggle-style-default.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "toggle-style-outline-muted", + "title": "toggle-style-outline-muted", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/toggle.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-style-outline-muted.tsx", + "target": "components/retroui/preview/toggle-style-outline-muted.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "toggle-style-outlined", + "title": "toggle-style-outlined", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/toggle.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-style-outlined.tsx", + "target": "components/retroui/preview/toggle-style-outlined.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "toggle-style-solid", + "title": "toggle-style-solid", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/toggle.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-style-solid.tsx", + "target": "components/retroui/preview/toggle-style-solid.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "toggle-group-style-default", + "title": "toggle-group-style-default", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/toggle.json", + "https://retroui.dev/r/toggle-group.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-group-style-default.tsx", + "target": "components/retroui/preview/toggle-group-style-default.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "toggle-group-style-outline-muted", + "title": "toggle-group-style-outline-muted", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/toggle.json", + "https://retroui.dev/r/toggle-group.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-group-style-outline-muted.tsx", + "target": "components/retroui/preview/toggle-group-style-outline-muted.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "toggle-group-style-outlined", + "title": "toggle-group-style-outlined", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/toggle.json", + "https://retroui.dev/r/toggle-group.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-group-style-outlined.tsx", + "target": "components/retroui/preview/toggle-group-style-outlined.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "toggle-group-style-solid", + "title": "toggle-group-style-solid", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/toggle.json", + "https://retroui.dev/r/toggle-group.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/toggle-style-solid.tsx", + "target": "components/retroui/preview/toggle-group-style-solid.tsx", + "type": "registry:block" + } + ] } ] } From d902313cfe558a8234210778a1e8ac7e16e04e9c Mon Sep 17 00:00:00 2001 From: Ankan Bhattacharya Date: Thu, 24 Apr 2025 15:28:29 +0530 Subject: [PATCH 3/8] feat: :sparkles: add tooltip v0 integrations --- public/r/tooltip-style-default.json | 15 +++++++++ public/r/tooltip-style-primary.json | 15 +++++++++ public/r/tooltip-style-solid.json | 15 +++++++++ registry.json | 48 +++++++++++++++++++++++++++++ 4 files changed, 93 insertions(+) create mode 100644 public/r/tooltip-style-default.json create mode 100644 public/r/tooltip-style-primary.json create mode 100644 public/r/tooltip-style-solid.json diff --git a/public/r/tooltip-style-default.json b/public/r/tooltip-style-default.json new file mode 100644 index 0000000..129149a --- /dev/null +++ b/public/r/tooltip-style-default.json @@ -0,0 +1,15 @@ +{ + "name": "tooltip-style-default", + "title": "tooltip-style-default", + "type": "registry:block", + "registryDependencies": ["https://retroui.dev/r/tooltip.json"], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/tooltip-style-default.tsx", + "target": "components/retroui/preview/tooltip-style-default.tsx", + "type": "registry:block", + "content": "\"use client\";\n\nimport {\n Button,\n Tooltip,\n TooltipProvider,\n TooltipTrigger,\n TooltipContent,\n} from \"@/components/retroui\";\n\nexport default function TooltipStyleDefault() {\n return (\n \n \n \n \n \n Add to Library\n \n \n );\n}\n" + } + ] +} diff --git a/public/r/tooltip-style-primary.json b/public/r/tooltip-style-primary.json new file mode 100644 index 0000000..2c8bf4d --- /dev/null +++ b/public/r/tooltip-style-primary.json @@ -0,0 +1,15 @@ +{ + "name": "tooltip-style-primary", + "title": "tooltip-style-primary", + "type": "registry:block", + "registryDependencies": ["https://retroui.dev/r/tooltip.json"], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/tooltip-style-primary.tsx", + "target": "components/retroui/preview/tooltip-style-primary.tsx", + "type": "registry:block", + "content": "\"use client\";\n\nimport {\n Button,\n Tooltip,\n TooltipProvider,\n TooltipTrigger,\n TooltipContent,\n} from \"@/components/retroui\";\n\nexport default function TooltipStyleDefault() {\n return (\n \n \n \n \n \n Add to Library\n \n \n );\n}\n" + } + ] +} diff --git a/public/r/tooltip-style-solid.json b/public/r/tooltip-style-solid.json new file mode 100644 index 0000000..17003b1 --- /dev/null +++ b/public/r/tooltip-style-solid.json @@ -0,0 +1,15 @@ +{ + "name": "tooltip-style-solid", + "title": "tooltip-style-solid", + "type": "registry:block", + "registryDependencies": ["https://retroui.dev/r/tooltip.json"], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/tooltip-style-solid.tsx", + "target": "components/retroui/preview/tooltip-style-solid.tsx", + "type": "registry:block", + "content": "\"use client\";\n\nimport {\n Button,\n Tooltip,\n TooltipProvider,\n TooltipTrigger,\n TooltipContent,\n} from \"@/components/retroui\";\n\nexport default function TooltipStyleSolid() {\n return (\n \n \n \n \n \n Add to Library\n \n \n );\n}\n" + } + ] +} diff --git a/registry.json b/registry.json index b77d31c..0b63e22 100644 --- a/registry.json +++ b/registry.json @@ -1260,6 +1260,54 @@ "type": "registry:block" } ] + }, + { + "name": "tooltip-style-default", + "title": "tooltip-style-default", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/tooltip.json", + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/tooltip-style-default.tsx", + "target": "components/retroui/preview/tooltip-style-default.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "tooltip-style-primary", + "title": "tooltip-style-primary", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/tooltip.json", + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/tooltip-style-primary.tsx", + "target": "components/retroui/preview/tooltip-style-primary.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "tooltip-style-solid", + "title": "tooltip-style-solid", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/tooltip.json", + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/tooltip-style-solid.tsx", + "target": "components/retroui/preview/tooltip-style-solid.tsx", + "type": "registry:block" + } + ] } ] } From d2554ab5dcaea257952a605b1b070c254f1b5a49 Mon Sep 17 00:00:00 2001 From: Ankan Bhattacharya Date: Thu, 24 Apr 2025 15:41:21 +0530 Subject: [PATCH 4/8] feat: :sparkles: add sonner v0 integrations --- public/r/sonner-style-default.json | 18 +++++++ public/r/sonner-style-error.json | 18 +++++++ public/r/sonner-style-rich-colors.json | 18 +++++++ public/r/sonner-style-warning.json | 18 +++++++ registry.json | 74 ++++++++++++++++++++++++-- 5 files changed, 143 insertions(+), 3 deletions(-) create mode 100644 public/r/sonner-style-default.json create mode 100644 public/r/sonner-style-error.json create mode 100644 public/r/sonner-style-rich-colors.json create mode 100644 public/r/sonner-style-warning.json diff --git a/public/r/sonner-style-default.json b/public/r/sonner-style-default.json new file mode 100644 index 0000000..30f0e9e --- /dev/null +++ b/public/r/sonner-style-default.json @@ -0,0 +1,18 @@ +{ + "name": "sonner-style-default", + "title": "sonner-style-default", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/sonner.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/sonner-style-default.tsx", + "target": "components/retroui/preview/sonner-style-default.tsx", + "type": "registry:block", + "content": "import { Button } from \"@/components/retroui\";\nimport { toast } from \"sonner\";\n\nexport default function SonnerStyleDefault() {\n const onClick = () => {\n toast(\"Event has been created\", {\n description: \"Sunday, December 03, 2025\",\n cancel: {\n label: \"Undo\",\n onClick: () => {},\n },\n });\n };\n\n return ;\n}\n" + } + ] +} diff --git a/public/r/sonner-style-error.json b/public/r/sonner-style-error.json new file mode 100644 index 0000000..056e7ad --- /dev/null +++ b/public/r/sonner-style-error.json @@ -0,0 +1,18 @@ +{ + "name": "sonner-style-error", + "title": "sonner-style-error", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/sonner.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/sonner-style-error.tsx", + "target": "components/retroui/preview/sonner-style-error.tsx", + "type": "registry:block", + "content": "import { Button } from \"@/components/retroui\";\nimport { toast } from \"sonner\";\n\nexport default function SonnerStyleError() {\n const onClick = () => {\n toast.error(\"Oops! you ran into a pot hole\");\n };\n\n return ;\n}\n" + } + ] +} diff --git a/public/r/sonner-style-rich-colors.json b/public/r/sonner-style-rich-colors.json new file mode 100644 index 0000000..34c0640 --- /dev/null +++ b/public/r/sonner-style-rich-colors.json @@ -0,0 +1,18 @@ +{ + "name": "sonner-style-rich-colors", + "title": "sonner-style-rich-colors", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/sonner.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/sonner-style-rich-colors.tsx", + "target": "components/retroui/preview/sonner-style-rich-colors.tsx", + "type": "registry:block", + "content": "import { Button } from \"@/components/retroui\";\nimport { toast } from \"sonner\";\n\nexport default function SonnerStyleRichColors() {\n const onClick = () => {\n toast.success(\"Congrats man 🎉\", {\n richColors: true,\n });\n };\n\n return ;\n}\n" + } + ] +} diff --git a/public/r/sonner-style-warning.json b/public/r/sonner-style-warning.json new file mode 100644 index 0000000..b9b679a --- /dev/null +++ b/public/r/sonner-style-warning.json @@ -0,0 +1,18 @@ +{ + "name": "sonner-style-warning", + "title": "sonner-style-warning", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/sonner.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/sonner-style-warning.tsx", + "target": "components/retroui/preview/sonner-style-warning.tsx", + "type": "registry:block", + "content": "import { Button } from \"@/components/retroui\";\nimport { toast } from \"sonner\";\n\nexport default function SonnerStyleWarning() {\n const onClick = () => {\n toast.warning(\"This is a serious warning\");\n };\n\n return ;\n}\n" + } + ] +} diff --git a/registry.json b/registry.json index 0b63e22..15f92bb 100644 --- a/registry.json +++ b/registry.json @@ -1266,7 +1266,7 @@ "title": "tooltip-style-default", "type": "registry:block", "registryDependencies": [ - "https://retroui.dev/r/tooltip.json", + "https://retroui.dev/r/tooltip.json" ], "dependencies": ["lucide-react"], "files": [ @@ -1282,7 +1282,7 @@ "title": "tooltip-style-primary", "type": "registry:block", "registryDependencies": [ - "https://retroui.dev/r/tooltip.json", + "https://retroui.dev/r/tooltip.json" ], "dependencies": ["lucide-react"], "files": [ @@ -1298,7 +1298,7 @@ "title": "tooltip-style-solid", "type": "registry:block", "registryDependencies": [ - "https://retroui.dev/r/tooltip.json", + "https://retroui.dev/r/tooltip.json" ], "dependencies": ["lucide-react"], "files": [ @@ -1308,6 +1308,74 @@ "type": "registry:block" } ] + }, + { + "name": "sonner-style-default", + "title": "sonner-style-default", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/sonner.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/sonner-style-default.tsx", + "target": "components/retroui/preview/sonner-style-default.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "sonner-style-error", + "title": "sonner-style-error", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/sonner.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/sonner-style-error.tsx", + "target": "components/retroui/preview/sonner-style-error.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "sonner-style-warning", + "title": "sonner-style-warning", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/sonner.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/sonner-style-warning.tsx", + "target": "components/retroui/preview/sonner-style-warning.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "sonner-style-rich-colors", + "title": "sonner-style-rich-colors", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/sonner.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/sonner-style-rich-colors.tsx", + "target": "components/retroui/preview/sonner-style-rich-colors.tsx", + "type": "registry:block" + } + ] } ] } From 5ce4bbab6f52f5833ed588fc5f2ae9bd971e75a0 Mon Sep 17 00:00:00 2001 From: Ankan Bhattacharya Date: Thu, 24 Apr 2025 16:25:13 +0530 Subject: [PATCH 5/8] feat: :sparkles: add popover v0 integrations --- config/components.ts | 24 + public/r/popover-style-default-shadow.json | 20 + public/r/popover-style-default.json | 20 + public/r/popover-style-primary-shadow.json | 20 + public/r/popover-style-primary.json | 20 + registry.json | 543 +++++++++------------ 6 files changed, 326 insertions(+), 321 deletions(-) create mode 100644 public/r/popover-style-default-shadow.json create mode 100644 public/r/popover-style-default.json create mode 100644 public/r/popover-style-primary-shadow.json create mode 100644 public/r/popover-style-primary.json diff --git a/config/components.ts b/config/components.ts index df5300a..453eb06 100644 --- a/config/components.ts +++ b/config/components.ts @@ -282,6 +282,30 @@ export const componentConfig: { () => import("@/preview/components/progress-style-default"), ), }, + "popover-style-default": { + name: "popover-style-default", + filePath: "preview/components/popover-style-default.tsx", + preview: lazy(() => import("@/preview/components/popover-style-default")), + }, + "popover-style-primary": { + name: "popover-style-primary", + filePath: "preview/components/popover-style-primary.tsx", + preview: lazy(() => import("@/preview/components/popover-style-primary")), + }, + "popover-style-default-shadow": { + name: "popover-style-default-shadow", + filePath: "preview/components/popover-style-default-shadow.tsx", + preview: lazy( + () => import("@/preview/components/popover-style-default-shadow"), + ), + }, + "popover-style-primary-shadow": { + name: "popover-style-primary-shadow", + filePath: "preview/components/popover-style-primary-shadow.tsx", + preview: lazy( + () => import("@/preview/components/popover-style-primary-shadow"), + ), + }, "radio-style-default": { name: "radio-style-default", filePath: "preview/components/radio-style-default.tsx", diff --git a/public/r/popover-style-default-shadow.json b/public/r/popover-style-default-shadow.json new file mode 100644 index 0000000..441d09c --- /dev/null +++ b/public/r/popover-style-default-shadow.json @@ -0,0 +1,20 @@ +{ + "name": "popover-style-default-shadow", + "title": "popover-style-default-shadow", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/popover.json", + "https://retroui.dev/r/label.json", + "https://retroui.dev/r/input.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/popover-style-default-shadow.tsx", + "target": "components/retroui/preview/popover-style-default-shadow.tsx", + "type": "registry:block", + "content": "\"use client\";\n\nimport {\n Popover,\n PopoverTrigger,\n PopoverContent,\n Label,\n Button,\n Input,\n} from \"@/components/retroui\";\n\nexport default function PopoverStyleDefaultShadow() {\n return (\n \n \n \n \n \n
\n
\n

Dimensions

\n

\n Set the dimensions for the layer.\n

\n
\n\n
\n
\n \n\n \n
\n\n
\n \n\n \n
\n
\n
\n
\n
\n );\n}\n" + } + ] +} diff --git a/public/r/popover-style-default.json b/public/r/popover-style-default.json new file mode 100644 index 0000000..dfc6d03 --- /dev/null +++ b/public/r/popover-style-default.json @@ -0,0 +1,20 @@ +{ + "name": "popover-style-default", + "title": "popover-style-default", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/popover.json", + "https://retroui.dev/r/label.json", + "https://retroui.dev/r/input.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/popover-style-default.tsx", + "target": "components/retroui/preview/popover-style-default.tsx", + "type": "registry:block", + "content": "\"use client\";\n\nimport {\n Popover,\n PopoverTrigger,\n PopoverContent,\n Label,\n Button,\n Input,\n} from \"@/components/retroui\";\n\nexport default function PopoverStyleDefault() {\n return (\n \n \n \n \n \n
\n
\n

Dimensions

\n

\n Set the dimensions for the layer.\n

\n
\n\n
\n
\n \n\n \n
\n\n
\n \n\n \n
\n
\n
\n
\n
\n );\n}\n" + } + ] +} diff --git a/public/r/popover-style-primary-shadow.json b/public/r/popover-style-primary-shadow.json new file mode 100644 index 0000000..9fcef1e --- /dev/null +++ b/public/r/popover-style-primary-shadow.json @@ -0,0 +1,20 @@ +{ + "name": "popover-style-primary-shadow", + "title": "popover-style-primary-shadow", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/popover.json", + "https://retroui.dev/r/label.json", + "https://retroui.dev/r/input.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/popover-style-primary-shadow.tsx", + "target": "components/retroui/preview/popover-style-primary-shadow.tsx", + "type": "registry:block", + "content": "\"use client\";\n\nimport {\n Popover,\n PopoverTrigger,\n PopoverContent,\n Label,\n Button,\n Input,\n} from \"@/components/retroui\";\n\nexport default function PopoverStylePrimaryShadow() {\n return (\n \n \n \n \n \n
\n
\n

Dimensions

\n

\n Set the dimensions for the layer.\n

\n
\n\n
\n
\n \n\n \n
\n\n
\n \n\n \n
\n
\n
\n
\n
\n );\n}\n" + } + ] +} diff --git a/public/r/popover-style-primary.json b/public/r/popover-style-primary.json new file mode 100644 index 0000000..6b60964 --- /dev/null +++ b/public/r/popover-style-primary.json @@ -0,0 +1,20 @@ +{ + "name": "popover-style-primary", + "title": "popover-style-default-shadow", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/popover.json", + "https://retroui.dev/r/label.json", + "https://retroui.dev/r/input.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/popover-style-default-shadow.tsx", + "target": "components/retroui/preview/popover-style-default-shadow.tsx", + "type": "registry:block", + "content": "\"use client\";\n\nimport {\n Popover,\n PopoverTrigger,\n PopoverContent,\n Label,\n Button,\n Input,\n} from \"@/components/retroui\";\n\nexport default function PopoverStylePrimary() {\n return (\n \n \n \n \n \n
\n
\n

Dimensions

\n

\n Set the dimensions for the layer.\n

\n
\n\n
\n
\n \n\n \n
\n\n
\n \n\n \n
\n
\n
\n
\n
\n );\n}\n" + } + ] +} diff --git a/registry.json b/registry.json index 15f92bb..307c4fa 100644 --- a/registry.json +++ b/registry.json @@ -2,10 +2,7 @@ "$schema": "https://ui.shadcn.com/schema/registry.json", "name": "retro ui", "homepage": "https://retroui.dev", - "dependencies": [ - "tailwind-merge", - "clsx" - ], + "dependencies": ["tailwind-merge", "clsx"], "items": [ { "$schema": "https://ui.shadcn.com/schema/registry-item.json", @@ -58,10 +55,7 @@ "name": "utils", "type": "registry:lib", "title": "Utils", - "dependencies": [ - "clsx", - "tailwind-merge" - ], + "dependencies": ["clsx", "tailwind-merge"], "files": [ { "path": "lib/utils.ts", @@ -74,10 +68,7 @@ "type": "registry:component", "title": "Accordion", "description": "This collapsible component let's your users read only the content they care about. 😌", - "dependencies": [ - "@radix-ui/react-accordion", - "lucide-react" - ], + "dependencies": ["@radix-ui/react-accordion", "lucide-react"], "files": [ { "path": "components/retroui/Accordion.tsx", @@ -91,9 +82,7 @@ "type": "registry:component", "title": "Alert", "description": "Notify your users about important events and updates. 📣", - "dependencies": [ - "class-variance-authority" - ], + "dependencies": ["class-variance-authority"], "files": [ { "path": "components/retroui/Alert.tsx", @@ -107,9 +96,7 @@ "type": "registry:component", "title": "Avatar", "description": "Default rounded avatar that can show your users profile picture. ✨", - "dependencies": [ - "@radix-ui/react-avatar" - ], + "dependencies": ["@radix-ui/react-avatar"], "files": [ { "path": "components/retroui/Avatar.tsx", @@ -123,9 +110,7 @@ "type": "registry:component", "title": "Badge", "description": "The component that looks like a button but isn't clickable!", - "dependencies": [ - "class-variance-authority" - ], + "dependencies": ["class-variance-authority"], "files": [ { "path": "components/retroui/Badge.tsx", @@ -139,9 +124,7 @@ "type": "registry:component", "title": "Retro Button", "description": "This bold button makes sure your users click on it and perform the actions you want!", - "dependencies": [ - "class-variance-authority" - ], + "dependencies": ["class-variance-authority"], "files": [ { "path": "components/retroui/Button.tsx", @@ -218,10 +201,7 @@ "type": "registry:component", "title": "Label", "description": "Label for form fields", - "dependencies": [ - "@radix-ui/react-label", - "class-variance-authority" - ], + "dependencies": ["@radix-ui/react-label", "class-variance-authority"], "files": [ { "path": "components/retroui/Label.tsx", @@ -235,9 +215,7 @@ "type": "registry:component", "title": "Menu", "description": "Show your users a list of actions they can take. 📋", - "dependencies": [ - "@radix-ui/react-dropdown-menu" - ], + "dependencies": ["@radix-ui/react-dropdown-menu"], "files": [ { "path": "components/retroui/Menu.tsx", @@ -247,22 +225,19 @@ ] }, { - "name": "popover", - "type": "registry:component", - "title": "Popover", - "description": "A handy small component for your little input needs...😉", - "dependencies": [ - "@radix-ui/react-popover", - "class-variance-authority" - ], - "author": "Ankan Bhattacharya ", - "files": [ - { - "path": "components/retroui/Popover.tsx", - "target": "components/retroui/Popover.tsx", - "type": "registry:component" - } - ] + "name": "popover", + "type": "registry:component", + "title": "Popover", + "description": "A handy small component for your little input needs...😉", + "dependencies": ["@radix-ui/react-popover", "class-variance-authority"], + "author": "Ankan Bhattacharya ", + "files": [ + { + "path": "components/retroui/Popover.tsx", + "target": "components/retroui/Popover.tsx", + "type": "registry:component" + } + ] }, { "name": "radio", @@ -286,10 +261,7 @@ "type": "registry:component", "title": "Select", "description": "Let your users pick what they want.", - "dependencies": [ - "@radix-ui/react-select", - "lucide-react" - ], + "dependencies": ["@radix-ui/react-select", "lucide-react"], "files": [ { "path": "components/retroui/Select.tsx", @@ -303,10 +275,7 @@ "type": "registry:component", "title": "Slider", "description": "Let your users pick what they want.", - "dependencies": [ - "@radix-ui/react-slider", - "lucide-react" - ], + "dependencies": ["@radix-ui/react-slider", "lucide-react"], "files": [ { "path": "components/retroui/Slider.tsx", @@ -316,31 +285,25 @@ ] }, { - "name": "sonner", - "type": "registry:component", - "title": "Sonner", - "description": "A beautiful toast component that can grab audience attention from any place.", - "dependencies": [ - "sonner", - "lucide-react", - "class-variance-authority" - ], - "files": [ - { - "path": "components/retroui/Sonner.tsx", - "target": "components/retroui/Sonner.tsx", - "type": "registry:component" - } - ] + "name": "sonner", + "type": "registry:component", + "title": "Sonner", + "description": "A beautiful toast component that can grab audience attention from any place.", + "dependencies": ["sonner", "lucide-react", "class-variance-authority"], + "files": [ + { + "path": "components/retroui/Sonner.tsx", + "target": "components/retroui/Sonner.tsx", + "type": "registry:component" + } + ] }, { "name": "switch", "type": "registry:component", "title": "Switch", "description": "Let users to turn on or off your marketing emails or notifications.", - "dependencies": [ - "@radix-ui/react-switch" - ], + "dependencies": ["@radix-ui/react-switch"], "files": [ { "path": "components/retroui/Switch.tsx", @@ -354,9 +317,7 @@ "type": "registry:component", "title": "Tab", "description": "Switch between different views using tabs.", - "dependencies": [ - "@headlessui/react" - ], + "dependencies": ["@headlessui/react"], "files": [ { "path": "components/retroui/Tab.tsx", @@ -370,9 +331,7 @@ "type": "registry:component", "title": "text", "description": "Show your texts in different styles. 💅", - "dependencies": [ - "class-variance-authority" - ], + "dependencies": ["class-variance-authority"], "files": [ { "path": "components/retroui/Text.tsx", @@ -395,102 +354,64 @@ ] }, { - "name": "toggle", - "type": "registry:component", - "title": "Toggle", - "description": "This crazy toggling button keeps people toggling...😃", - "dependencies": [ - "@radix-ui/react-toggle", - "class-variance-authority" - ], - "author": "Ankan Bhattacharya ", - "files": [ - { - "path": "components/retroui/Toggle.tsx", - "target": "components/retroui/Toggle.tsx", - "type": "registry:component", - "name": "accordion-style-default", - "title": "accordion-style-default", - "registryDependencies": [ - "https://retroui.dev/r/accordion.json" - ], - "files": [ - { - "path": "preview/components/accordion-style-default.tsx", - "target": "components/retroui/preview/accordion-style-default.tsx", - "type": "registry:block" - } - ] - }, - { - "name": "toggle-group", - "type": "registry:component", - "title": "Toggle Group", - "description": "Group of toggling buttons...🤙", - "dependencies": [ - "@radix-ui/react-toggle", - "@radix-ui/react-toggle-group", - "class-variance-authority" - ], - "author": "Ankan Bhattacharya ", - "files": [ - { - "path": "components/retroui/Toggle.tsx", - "target": "components/retroui/Toggle.tsx", - "type": "registry:component" - }, - { - "path": "components/retroui/ToggleGroup.tsx", - "target": "components/retroui/ToggleGroup.tsx", - "type": "registry:component", - "name": "alert-style-default", - "title": "alert-style-default", - "registryDependencies": [ - "https://retroui.dev/r/alert.json" - ], - "files": [ - { - "path": "preview/components/alert-style-default.tsx", - "target": "components/retroui/preview/alert-style-default.tsx", - "type": "registry:block" - } - ] - }, - { - "name": "tooltip", - "type": "registry:component", - "title": "Tooltip", - "description": "A cool way to give your users a hint of what a component does...😉", - "dependencies": [ - "@radix-ui/react-tooltip", - "class-variance-authority" - ], - "author": "Ankan Bhattacharya ", - "files": [ - { - "path": "components/retroui/Tooltip.tsx", - "target": "components/retroui/Tooltip.tsx", - "type": "registry:component", - "name": "alert-style-solid", - "title": "alert-style-solid", - "registryDependencies": [ - "https://retroui.dev/r/alert.json" - ], - "files": [ - { - "path": "preview/components/alert-style-solid.tsx", - "target": "components/retroui/preview/alert-style-solid.tsx", - "type": "registry:block" - } - ] + "name": "toggle", + "type": "registry:component", + "title": "Toggle", + "description": "This crazy toggling button keeps people toggling...😃", + "dependencies": ["@radix-ui/react-toggle", "class-variance-authority"], + "author": "Ankan Bhattacharya ", + "files": [ + { + "path": "preview/components/accordion-style-default.tsx", + "target": "components/retroui/preview/accordion-style-default.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "toggle-group", + "type": "registry:component", + "title": "Toggle Group", + "description": "Group of toggling buttons...🤙", + "dependencies": [ + "@radix-ui/react-toggle", + "@radix-ui/react-toggle-group", + "class-variance-authority" + ], + "author": "Ankan Bhattacharya ", + "files": [ + { + "path": "components/retroui/Toggle.tsx", + "target": "components/retroui/Toggle.tsx", + "type": "registry:component" + }, + { + "path": "components/retroui/ToggleGroup.tsx", + "target": "components/retroui/ToggleGroup.tsx", + "type": "registry:component" + } + ] + }, + { + "name": "tooltip", + "type": "registry:component", + "title": "Tooltip", + "description": "A cool way to give your users a hint of what a component does...😉", + "dependencies": ["@radix-ui/react-tooltip", "class-variance-authority"], + "author": "Ankan Bhattacharya ", + "files": [ + { + "path": "preview/components/alert-style-solid.tsx", + "target": "components/retroui/preview/alert-style-solid.tsx", + "type": "registry:block" + } + ] }, { "name": "accordion-style-default", "title": "accordion-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/accordion.json" - ], + "registryDependencies": ["https://retroui.dev/r/accordion.json"], "files": [ { "path": "preview/components/accordion-style-default.tsx", @@ -503,9 +424,7 @@ "name": "alert-style-default", "title": "alert-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/alert.json" - ], + "registryDependencies": ["https://retroui.dev/r/alert.json"], "files": [ { "path": "preview/components/alert-style-default.tsx", @@ -518,9 +437,7 @@ "name": "alert-style-solid", "title": "alert-style-solid", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/alert.json" - ], + "registryDependencies": ["https://retroui.dev/r/alert.json"], "files": [ { "path": "preview/components/alert-style-solid.tsx", @@ -533,9 +450,7 @@ "name": "alert-style-with-icon", "title": "alert-style-with-icon", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/alert.json" - ], + "registryDependencies": ["https://retroui.dev/r/alert.json"], "files": [ { "path": "preview/components/alert-style-with-icon.tsx", @@ -548,9 +463,7 @@ "name": "alert-style-all-status", "title": "alert-style-all-status", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/alert.json" - ], + "registryDependencies": ["https://retroui.dev/r/alert.json"], "files": [ { "path": "preview/components/alert-style-all-status.tsx", @@ -563,9 +476,7 @@ "name": "avatar-style-circle", "title": "avatar-style-circle", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/avatar.json" - ], + "registryDependencies": ["https://retroui.dev/r/avatar.json"], "files": [ { "path": "preview/components/avatar-style-circle.tsx", @@ -578,9 +489,7 @@ "name": "avatar-style-fallbacks", "title": "avatar-style-fallbacks", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/avatar.json" - ], + "registryDependencies": ["https://retroui.dev/r/avatar.json"], "files": [ { "path": "preview/components/avatar-style-circle-fallbacks.tsx", @@ -593,9 +502,7 @@ "name": "avatar-style-circle-sizes", "title": "avatar-style-circle-sizes", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/avatar.json" - ], + "registryDependencies": ["https://retroui.dev/r/avatar.json"], "files": [ { "path": "preview/components/avatar-style-circle-sizes.tsx", @@ -608,9 +515,7 @@ "name": "badge-style-default", "title": "badge-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/badge.json" - ], + "registryDependencies": ["https://retroui.dev/r/badge.json"], "files": [ { "path": "preview/components/badge-style-default.tsx", @@ -623,9 +528,7 @@ "name": "badge-style-variants", "title": "badge-style-variants", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/badge.json" - ], + "registryDependencies": ["https://retroui.dev/r/badge.json"], "files": [ { "path": "preview/components/badge-style-variants.tsx", @@ -638,9 +541,7 @@ "name": "badge-style-default", "title": "badge-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/badge.json" - ], + "registryDependencies": ["https://retroui.dev/r/badge.json"], "files": [ { "path": "preview/components/badge-style-rounded.tsx", @@ -653,9 +554,7 @@ "name": "badge-style-sizes", "title": "badge-style-sizes", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/badge.json" - ], + "registryDependencies": ["https://retroui.dev/r/badge.json"], "files": [ { "path": "preview/components/badge-style-sizes.tsx", @@ -668,9 +567,7 @@ "name": "button-style-default", "title": "button-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/button.json" - ], + "registryDependencies": ["https://retroui.dev/r/button.json"], "files": [ { "path": "preview/components/button-style-default.tsx", @@ -698,9 +595,7 @@ "name": "button-style-secondary", "title": "button-style-secondary", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/button.json" - ], + "registryDependencies": ["https://retroui.dev/r/button.json"], "files": [ { "path": "preview/components/button-style-secondary.tsx", @@ -713,9 +608,7 @@ "name": "button-style-outline", "title": "button-style-outline", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/button.json" - ], + "registryDependencies": ["https://retroui.dev/r/button.json"], "files": [ { "path": "preview/components/button-style-outline.tsx", @@ -728,9 +621,7 @@ "name": "button-style-link", "title": "button-style-link", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/button.json" - ], + "registryDependencies": ["https://retroui.dev/r/button.json"], "files": [ { "path": "preview/components/button-style-link.tsx", @@ -743,9 +634,7 @@ "name": "button-style-with-icon", "title": "button-style-with-icon", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/button.json" - ], + "registryDependencies": ["https://retroui.dev/r/button.json"], "files": [ { "path": "preview/components/button-style-with-icon.tsx", @@ -758,9 +647,7 @@ "name": "card-style-default", "title": "card-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/card.json" - ], + "registryDependencies": ["https://retroui.dev/r/card.json"], "files": [ { "path": "preview/components/card-style-default.tsx", @@ -773,9 +660,7 @@ "name": "card-style-commerce", "title": "card-style-commerce", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/card.json" - ], + "registryDependencies": ["https://retroui.dev/r/card.json"], "files": [ { "path": "preview/components/card-style-commerce.tsx", @@ -788,9 +673,7 @@ "name": "card-style-testimonial", "title": "card-style-testimonial", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/card.json" - ], + "registryDependencies": ["https://retroui.dev/r/card.json"], "files": [ { "path": "preview/components/card-style-testimonial.tsx", @@ -803,9 +686,7 @@ "name": "checkbox-style-default", "title": "checkbox-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/checkbox.json" - ], + "registryDependencies": ["https://retroui.dev/r/checkbox.json"], "files": [ { "path": "preview/components/checkbox-style-default.tsx", @@ -818,9 +699,7 @@ "name": "checkbox-style-toggle", "title": "checkbox-style-toggle", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/checkbox.json" - ], + "registryDependencies": ["https://retroui.dev/r/checkbox.json"], "files": [ { "path": "preview/components/checkbox-style-variants.tsx", @@ -833,9 +712,7 @@ "name": "checkbox-style-default", "title": "checkbox-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/checkbox.json" - ], + "registryDependencies": ["https://retroui.dev/r/checkbox.json"], "files": [ { "path": "preview/components/checkbox-style-sizes.tsx", @@ -848,9 +725,7 @@ "name": "input-style-default", "title": "input-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/input.json" - ], + "registryDependencies": ["https://retroui.dev/r/input.json"], "files": [ { "path": "preview/components/input-style-default.tsx", @@ -863,9 +738,7 @@ "name": "input-style-with-label", "title": "input-style-with-label", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/input.json" - ], + "registryDependencies": ["https://retroui.dev/r/input.json"], "files": [ { "path": "preview/components/input-style-with-label.tsx", @@ -878,9 +751,7 @@ "name": "input-style-error", "title": "input-style-error", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/input.json" - ], + "registryDependencies": ["https://retroui.dev/r/input.json"], "files": [ { "path": "preview/components/input-style-error.tsx", @@ -893,9 +764,7 @@ "name": "menu-style-default", "title": "menu-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/menu.json" - ], + "registryDependencies": ["https://retroui.dev/r/menu.json"], "files": [ { "path": "preview/components/menu-style-default.tsx", @@ -908,9 +777,7 @@ "name": "progress-style-default", "title": "progress-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/progress.json" - ], + "registryDependencies": ["https://retroui.dev/r/progress.json"], "files": [ { "path": "preview/components/progress-style-default.tsx", @@ -923,9 +790,7 @@ "name": "radio-style-default", "title": "radio-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/radio.json" - ], + "registryDependencies": ["https://retroui.dev/r/radio.json"], "files": [ { "path": "preview/components/radio-style-default.tsx", @@ -938,9 +803,7 @@ "name": "radio-style-variants", "title": "radio-style-variants", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/radio.json" - ], + "registryDependencies": ["https://retroui.dev/r/radio.json"], "files": [ { "path": "preview/components/radio-style-variants.tsx", @@ -953,9 +816,7 @@ "name": "radio-style-sizes", "title": "radio-style-sizes", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/radio.json" - ], + "registryDependencies": ["https://retroui.dev/r/radio.json"], "files": [ { "path": "preview/components/radio-style-sizes.tsx", @@ -968,9 +829,7 @@ "name": "select-style-default", "title": "select-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/select.json" - ], + "registryDependencies": ["https://retroui.dev/r/select.json"], "files": [ { "path": "preview/components/select-style-default.tsx", @@ -983,9 +842,7 @@ "name": "switch-style-default", "title": "switch-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/switch.json" - ], + "registryDependencies": ["https://retroui.dev/r/switch.json"], "files": [ { "path": "preview/components/switch-style-default.tsx", @@ -998,9 +855,7 @@ "name": "switch-style-disabled", "title": "switch-style-disabled", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/switch.json" - ], + "registryDependencies": ["https://retroui.dev/r/switch.json"], "files": [ { "path": "preview/components/switch-style-disabled.tsx", @@ -1013,9 +868,7 @@ "name": "textarea-style-default", "title": "textarea-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/textarea.json" - ], + "registryDependencies": ["https://retroui.dev/r/textarea.json"], "files": [ { "path": "preview/components/textarea-style-default.tsx", @@ -1028,9 +881,7 @@ "name": "text-headings", "title": "text-headings", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/text.json" - ], + "registryDependencies": ["https://retroui.dev/r/text.json"], "files": [ { "path": "preview/components/text-headings.tsx", @@ -1043,9 +894,7 @@ "name": "typography-p", "title": "typography-p", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/text.json" - ], + "registryDependencies": ["https://retroui.dev/r/text.json"], "files": [ { "path": "preview/components/typography-p.tsx", @@ -1058,9 +907,7 @@ "name": "tab-style-default", "title": "tab-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/tab.json" - ], + "registryDependencies": ["https://retroui.dev/r/tab.json"], "files": [ { "path": "preview/components/tab-style-default.tsx", @@ -1073,9 +920,7 @@ "name": "dialog-style-default", "title": "dialog-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/dialog.json" - ], + "registryDependencies": ["https://retroui.dev/r/dialog.json"], "files": [ { "path": "preview/components/dialog-style-default.tsx", @@ -1088,9 +933,7 @@ "name": "dialog-style-with-footer", "title": "dialog-style-with-footer", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/dialog.json" - ], + "registryDependencies": ["https://retroui.dev/r/dialog.json"], "files": [ { "path": "preview/components/dialog-style-with-footer.tsx", @@ -1103,9 +946,7 @@ "name": "dialog-style-width-variant", "title": "dialog-style-width-variant", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/dialog.json" - ], + "registryDependencies": ["https://retroui.dev/r/dialog.json"], "files": [ { "path": "preview/components/dialog-style-width-variant.tsx", @@ -1118,9 +959,7 @@ "name": "dialog-style-with-form", "title": "dialog-style-with-form", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/dialog.json" - ], + "registryDependencies": ["https://retroui.dev/r/dialog.json"], "files": [ { "path": "preview/components/dialog-style-with-form.tsx", @@ -1133,9 +972,7 @@ "name": "toggle-style-default", "title": "toggle-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/toggle.json" - ], + "registryDependencies": ["https://retroui.dev/r/toggle.json"], "dependencies": ["lucide-react"], "files": [ { @@ -1149,9 +986,7 @@ "name": "toggle-style-outline-muted", "title": "toggle-style-outline-muted", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/toggle.json" - ], + "registryDependencies": ["https://retroui.dev/r/toggle.json"], "dependencies": ["lucide-react"], "files": [ { @@ -1165,9 +1000,7 @@ "name": "toggle-style-outlined", "title": "toggle-style-outlined", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/toggle.json" - ], + "registryDependencies": ["https://retroui.dev/r/toggle.json"], "dependencies": ["lucide-react"], "files": [ { @@ -1181,9 +1014,7 @@ "name": "toggle-style-solid", "title": "toggle-style-solid", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/toggle.json" - ], + "registryDependencies": ["https://retroui.dev/r/toggle.json"], "dependencies": ["lucide-react"], "files": [ { @@ -1198,8 +1029,8 @@ "title": "toggle-group-style-default", "type": "registry:block", "registryDependencies": [ - "https://retroui.dev/r/toggle.json", - "https://retroui.dev/r/toggle-group.json" + "https://retroui.dev/r/toggle.json", + "https://retroui.dev/r/toggle-group.json" ], "dependencies": ["lucide-react"], "files": [ @@ -1215,8 +1046,8 @@ "title": "toggle-group-style-outline-muted", "type": "registry:block", "registryDependencies": [ - "https://retroui.dev/r/toggle.json", - "https://retroui.dev/r/toggle-group.json" + "https://retroui.dev/r/toggle.json", + "https://retroui.dev/r/toggle-group.json" ], "dependencies": ["lucide-react"], "files": [ @@ -1232,8 +1063,8 @@ "title": "toggle-group-style-outlined", "type": "registry:block", "registryDependencies": [ - "https://retroui.dev/r/toggle.json", - "https://retroui.dev/r/toggle-group.json" + "https://retroui.dev/r/toggle.json", + "https://retroui.dev/r/toggle-group.json" ], "dependencies": ["lucide-react"], "files": [ @@ -1265,9 +1096,7 @@ "name": "tooltip-style-default", "title": "tooltip-style-default", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/tooltip.json" - ], + "registryDependencies": ["https://retroui.dev/r/tooltip.json"], "dependencies": ["lucide-react"], "files": [ { @@ -1281,9 +1110,7 @@ "name": "tooltip-style-primary", "title": "tooltip-style-primary", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/tooltip.json" - ], + "registryDependencies": ["https://retroui.dev/r/tooltip.json"], "dependencies": ["lucide-react"], "files": [ { @@ -1297,9 +1124,7 @@ "name": "tooltip-style-solid", "title": "tooltip-style-solid", "type": "registry:block", - "registryDependencies": [ - "https://retroui.dev/r/tooltip.json" - ], + "registryDependencies": ["https://retroui.dev/r/tooltip.json"], "dependencies": ["lucide-react"], "files": [ { @@ -1376,6 +1201,82 @@ "type": "registry:block" } ] + }, + { + "name": "popover-style-default", + "title": "popover-style-default", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/popover.json", + "https://retroui.dev/r/label.json", + "https://retroui.dev/r/input.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/popover-style-default.tsx", + "target": "components/retroui/preview/popover-style-default.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "popover-style-default-shadow", + "title": "popover-style-default-shadow", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/popover.json", + "https://retroui.dev/r/label.json", + "https://retroui.dev/r/input.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/popover-style-default-shadow.tsx", + "target": "components/retroui/preview/popover-style-default-shadow.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "popover-style-primary", + "title": "popover-style-primary", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/popover.json", + "https://retroui.dev/r/label.json", + "https://retroui.dev/r/input.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/popover-style-primary.tsx", + "target": "components/retroui/preview/popover-style-primary.tsx", + "type": "registry:block" + } + ] + }, + { + "name": "popover-style-primary-shadow", + "title": "popover-style-primary-shadow", + "type": "registry:block", + "registryDependencies": [ + "https://retroui.dev/r/popover.json", + "https://retroui.dev/r/label.json", + "https://retroui.dev/r/input.json", + "https://retroui.dev/r/button.json" + ], + "dependencies": ["lucide-react"], + "files": [ + { + "path": "preview/components/popover-style-primary-shadow.tsx", + "target": "components/retroui/preview/popover-style-primary-shadow.tsx", + "type": "registry:block" + } + ] } ] } From a325fee82b494c0481921b5e6ef5e728e0397cb5 Mon Sep 17 00:00:00 2001 From: Ankan Bhattacharya Date: Thu, 24 Apr 2025 16:44:18 +0530 Subject: [PATCH 6/8] feat: :sparkles: add popover v0 integrations --- public/r/popover-style-primary.json | 6 +++--- public/r/toggle-group-style-solid.json | 8 ++++---- public/r/tooltip-style-default.json | 5 ++++- public/r/tooltip-style-primary.json | 7 +++++-- public/r/tooltip-style-solid.json | 5 ++++- registry.json | 25 +++++++++++++++++-------- 6 files changed, 37 insertions(+), 19 deletions(-) diff --git a/public/r/popover-style-primary.json b/public/r/popover-style-primary.json index 6b60964..2bc5bd2 100644 --- a/public/r/popover-style-primary.json +++ b/public/r/popover-style-primary.json @@ -1,6 +1,6 @@ { "name": "popover-style-primary", - "title": "popover-style-default-shadow", + "title": "popover-style-default", "type": "registry:block", "registryDependencies": [ "https://retroui.dev/r/popover.json", @@ -11,8 +11,8 @@ "dependencies": ["lucide-react"], "files": [ { - "path": "preview/components/popover-style-default-shadow.tsx", - "target": "components/retroui/preview/popover-style-default-shadow.tsx", + "path": "preview/components/popover-style-primary.tsx", + "target": "components/retroui/preview/popover-style-primary.tsx", "type": "registry:block", "content": "\"use client\";\n\nimport {\n Popover,\n PopoverTrigger,\n PopoverContent,\n Label,\n Button,\n Input,\n} from \"@/components/retroui\";\n\nexport default function PopoverStylePrimary() {\n return (\n \n \n \n \n \n
\n
\n

Dimensions

\n

\n Set the dimensions for the layer.\n

\n
\n\n
\n
\n \n\n \n
\n\n
\n \n\n \n
\n
\n
\n
\n
\n );\n}\n" } diff --git a/public/r/toggle-group-style-solid.json b/public/r/toggle-group-style-solid.json index e85e918..1eb1397 100644 --- a/public/r/toggle-group-style-solid.json +++ b/public/r/toggle-group-style-solid.json @@ -1,6 +1,6 @@ { - "name": "toggle-group-style-outline-muted", - "title": "toggle-group-style-outline-muted", + "name": "toggle-group-style-solid", + "title": "toggle-group-style-solid", "type": "registry:block", "registryDependencies": [ "https://retroui.dev/r/toggle.json", @@ -9,8 +9,8 @@ "dependencies": ["lucide-react"], "files": [ { - "path": "preview/components/toggle-group-style-outline-muted.tsx", - "target": "components/retroui/preview/toggle-group-style-outline-muted.tsx", + "path": "preview/components/toggle-group-style-solid.tsx", + "target": "components/retroui/preview/toggle-group-style-solid.tsx", "type": "registry:block", "content": "\"use client\";\n\nimport { ToggleGroup, ToggleGroupItem } from \"@/components/retroui\";\nimport { Bold, Italic, Underline } from \"lucide-react\";\n\nexport default function ToggleGroupStyleSolid() {\n return (\n \n \n \n \n\n \n \n \n\n \n \n \n \n );\n}\n" } diff --git a/public/r/tooltip-style-default.json b/public/r/tooltip-style-default.json index 129149a..32e3eaf 100644 --- a/public/r/tooltip-style-default.json +++ b/public/r/tooltip-style-default.json @@ -2,7 +2,10 @@ "name": "tooltip-style-default", "title": "tooltip-style-default", "type": "registry:block", - "registryDependencies": ["https://retroui.dev/r/tooltip.json"], + "registryDependencies": [ + "https://retroui.dev/r/tooltip.json", + "https://retroui.dev/r/button.json" + ], "dependencies": ["lucide-react"], "files": [ { diff --git a/public/r/tooltip-style-primary.json b/public/r/tooltip-style-primary.json index 2c8bf4d..cddad58 100644 --- a/public/r/tooltip-style-primary.json +++ b/public/r/tooltip-style-primary.json @@ -2,14 +2,17 @@ "name": "tooltip-style-primary", "title": "tooltip-style-primary", "type": "registry:block", - "registryDependencies": ["https://retroui.dev/r/tooltip.json"], + "registryDependencies": [ + "https://retroui.dev/r/tooltip.json", + "https://retroui.dev/r/button.json" + ], "dependencies": ["lucide-react"], "files": [ { "path": "preview/components/tooltip-style-primary.tsx", "target": "components/retroui/preview/tooltip-style-primary.tsx", "type": "registry:block", - "content": "\"use client\";\n\nimport {\n Button,\n Tooltip,\n TooltipProvider,\n TooltipTrigger,\n TooltipContent,\n} from \"@/components/retroui\";\n\nexport default function TooltipStyleDefault() {\n return (\n \n \n \n \n \n Add to Library\n \n \n );\n}\n" + "content": "\"use client\";\n\nimport {\n Button,\n Tooltip,\n TooltipProvider,\n TooltipTrigger,\n TooltipContent,\n} from \"@/components/retroui\";\n\nexport default function TooltipStylePrimary() {\n return (\n \n \n \n \n \n Add to Library\n \n \n );\n}\n" } ] } diff --git a/public/r/tooltip-style-solid.json b/public/r/tooltip-style-solid.json index 17003b1..a663046 100644 --- a/public/r/tooltip-style-solid.json +++ b/public/r/tooltip-style-solid.json @@ -2,7 +2,10 @@ "name": "tooltip-style-solid", "title": "tooltip-style-solid", "type": "registry:block", - "registryDependencies": ["https://retroui.dev/r/tooltip.json"], + "registryDependencies": [ + "https://retroui.dev/r/tooltip.json", + "https://retroui.dev/r/button.json" + ], "dependencies": ["lucide-react"], "files": [ { diff --git a/registry.json b/registry.json index 307c4fa..b8462b0 100644 --- a/registry.json +++ b/registry.json @@ -362,8 +362,8 @@ "author": "Ankan Bhattacharya ", "files": [ { - "path": "preview/components/accordion-style-default.tsx", - "target": "components/retroui/preview/accordion-style-default.tsx", + "path": "preview/components/toggle.tsx", + "target": "components/retroui/preview/toggle.tsx", "type": "registry:block" } ] @@ -401,8 +401,8 @@ "author": "Ankan Bhattacharya ", "files": [ { - "path": "preview/components/alert-style-solid.tsx", - "target": "components/retroui/preview/alert-style-solid.tsx", + "path": "preview/components/tooltip.tsx", + "target": "components/retroui/preview/tooltip.tsx", "type": "registry:block" } ] @@ -1086,7 +1086,7 @@ "dependencies": ["lucide-react"], "files": [ { - "path": "preview/components/toggle-style-solid.tsx", + "path": "preview/components/toggle-group-style-solid.tsx", "target": "components/retroui/preview/toggle-group-style-solid.tsx", "type": "registry:block" } @@ -1096,7 +1096,10 @@ "name": "tooltip-style-default", "title": "tooltip-style-default", "type": "registry:block", - "registryDependencies": ["https://retroui.dev/r/tooltip.json"], + "registryDependencies": [ + "https://retroui.dev/r/tooltip.json", + "https://retroui.dev/r/button.json" + ], "dependencies": ["lucide-react"], "files": [ { @@ -1110,7 +1113,10 @@ "name": "tooltip-style-primary", "title": "tooltip-style-primary", "type": "registry:block", - "registryDependencies": ["https://retroui.dev/r/tooltip.json"], + "registryDependencies": [ + "https://retroui.dev/r/tooltip.json", + "https://retroui.dev/r/button.json" + ], "dependencies": ["lucide-react"], "files": [ { @@ -1124,7 +1130,10 @@ "name": "tooltip-style-solid", "title": "tooltip-style-solid", "type": "registry:block", - "registryDependencies": ["https://retroui.dev/r/tooltip.json"], + "registryDependencies": [ + "https://retroui.dev/r/tooltip.json", + "https://retroui.dev/r/button.json" + ], "dependencies": ["lucide-react"], "files": [ { From 0af2a942a0c02e31f9abf706309ab3c341151cae Mon Sep 17 00:00:00 2001 From: Ankan Bhattacharya Date: Thu, 24 Apr 2025 16:50:28 +0530 Subject: [PATCH 7/8] fix: :bug: registry issue --- registry.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/registry.json b/registry.json index b8462b0..e3171f1 100644 --- a/registry.json +++ b/registry.json @@ -401,9 +401,9 @@ "author": "Ankan Bhattacharya ", "files": [ { - "path": "preview/components/tooltip.tsx", - "target": "components/retroui/preview/tooltip.tsx", - "type": "registry:block" + "path": "components/retroui/Tooltip.tsx", + "target": "components/retroui/Tooltip.tsx", + "type": "registry:component" } ] }, From 41fee80d6e329c59890fc15c9f35a2119bf0fd47 Mon Sep 17 00:00:00 2001 From: Ankan Bhattacharya Date: Thu, 24 Apr 2025 16:53:24 +0530 Subject: [PATCH 8/8] fix: :bug: registry issue --- registry.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/registry.json b/registry.json index e3171f1..e8517ef 100644 --- a/registry.json +++ b/registry.json @@ -362,9 +362,9 @@ "author": "Ankan Bhattacharya ", "files": [ { - "path": "preview/components/toggle.tsx", - "target": "components/retroui/preview/toggle.tsx", - "type": "registry:block" + "path": "components/retroui/Toggle.tsx", + "target": "components/retroui/Toggle.tsx", + "type": "registry:component" } ] },