Skip to content

Commit 312a886

Browse files
ariflogsariflogs
committed
now you can open in v0
1 parent 7521a1e commit 312a886

47 files changed

Lines changed: 1348 additions & 18 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.vscode/settings.json‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,5 @@
11
{
2-
"cSpell.words": [
3-
"clsx",
4-
"rehype"
5-
],
2+
"cSpell.words": ["clsx", "rehype", "retroui"],
63
"tailwindCSS.experimental.classRegex": [
74
["cva\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"],
85
["cx\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"]

‎app/(marketing)/page.tsx‎

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ export default async function Home() {
7979
into your projects.
8080
</p>
8181

82-
<div className="max-w-96 grid gap-4 grid-cols-2 mx-auto lg:mx-0">
82+
<div className="flex space-x-4">
8383
<Link href="/docs" passHref>
8484
<Button
8585
className="w-full"
@@ -88,17 +88,13 @@ export default async function Home() {
8888
Get Started
8989
</Button>
9090
</Link>
91-
<Link
92-
href="https://github.com/Logging-Stuff/retroui"
93-
target="_blank"
94-
passHref
95-
>
91+
<Link href="https://pro.retroui.dev/blocks" passHref>
9692
<Button
9793
className="w-full"
9894
variant="outline"
9995
aria-label="Get Started with RetroUI"
10096
>
101-
Github
97+
Browse Blocks
10298
</Button>
10399
</Link>
104100
</div>

‎components/ComponentInstall.tsx‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,9 @@ function ComponentInstall({ children }: IComponentShowcase) {
2323
<Tab className="min-w-12 cursor-pointer relative px-2 py-1 bg-transparent data-selected:border data-selected:border-b-0 data-selected:bg-black data-selected:text-white focus:outline-hidden">
2424
Manual
2525
</Tab>
26+
<Tab className="min-w-12 cursor-pointer relative px-2 py-1 bg-transparent data-selected:border data-selected:border-b-0 data-selected:bg-black data-selected:text-white focus:outline-hidden">
27+
Open in V0
28+
</Tab>
2629
</TabList>
2730

2831
<TabPanels>{children}</TabPanels>

‎components/ComponentShowcase.tsx‎

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { componentConfig } from "@/config";
22
import { TabGroup, TabList, TabPanels, TabPanel, Tab } from "@headlessui/react";
33
import React, { HTMLAttributes } from "react";
4+
import { Button } from "./ui";
45

56
interface IComponentShowcase extends HTMLAttributes<HTMLDivElement> {
67
name: keyof typeof componentConfig.examples;
@@ -22,7 +23,35 @@ export function ComponentShowcase({ name, children }: IComponentShowcase) {
2223
</TabList>
2324
<TabPanels>
2425
<TabPanel>
25-
<div className="border rounded-sm p-6 mt-4">
26+
<div className="border rounded-sm px-6 py-24 flex justify-center items-center min-h-80 mt-4 relative">
27+
<a
28+
href={`https://v0.dev/chat/api/open?url=https://retroui.dev/r/${name}.json`}
29+
target="_blank"
30+
>
31+
<Button
32+
variant="secondary"
33+
size="sm"
34+
className="font-sans absolute top-4 right-4"
35+
>
36+
Open in
37+
<svg
38+
viewBox="0 0 40 20"
39+
fill="none"
40+
xmlns="http://www.w3.org/2000/svg"
41+
className="h-5 w-5 ml-2 text-current"
42+
>
43+
<path
44+
d="M23.3919 0H32.9188C36.7819 0 39.9136 3.13165 39.9136 6.99475V16.0805H36.0006V6.99475C36.0006 6.90167 35.9969 6.80925 35.9898 6.71766L26.4628 16.079C26.4949 16.08 26.5272 16.0805 26.5595 16.0805H36.0006V19.7762H26.5595C22.6964 19.7762 19.4788 16.6139 19.4788 12.7508V3.68923H23.3919V12.7508C23.3919 12.9253 23.4054 13.0977 23.4316 13.2668L33.1682 3.6995C33.0861 3.6927 33.003 3.68923 32.9188 3.68923H23.3919V0Z"
45+
fill="currentColor"
46+
></path>
47+
<path
48+
d="M13.7688 19.0956L0 3.68759H5.53933L13.6231 12.7337V3.68759H17.7535V17.5746C17.7535 19.6705 15.1654 20.6584 13.7688 19.0956Z"
49+
fill="currentColor"
50+
></path>
51+
</svg>
52+
</Button>
53+
</a>
54+
2655
<Preview />
2756
</div>
2857
</TabPanel>

‎components/SideNav.tsx‎

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,31 @@
1+
"use client";
2+
13
import { navConfig } from "@/config/navigation";
24
import { Badge, Text } from "@/components/ui";
35
import Link from "next/link";
6+
import { usePathname } from "next/navigation";
47

58
export default function SideNav() {
9+
const pathname = usePathname();
10+
611
return (
712
<div
8-
className={`fixed right-auto border-r-2 border-black h-full overflow-y-scroll transition-transform transform md:translate-x-0 w-64 bg-white flex flex-col justify-center md:justify-start py-14 md:py-8`}
13+
className={`fixed right-auto border-r-2 border-black h-full overflow-y-scroll transition-transform transform md:translate-x-0 w-60 bg-white flex flex-col justify-center md:justify-start py-14 md:py-8`}
914
>
1015
<nav className="flex flex-col items-start px-6 lg:pl-0 pb-26 space-y-4">
1116
{navConfig.sideNavItems.map((item) => (
12-
<div key={item.title}>
17+
<div key={item.title} className="w-full">
1318
<Text as="h6">{item.title}</Text>
14-
<div className="flex flex-col space-y-2">
19+
<div className="flex flex-col w-full">
1520
{item.children.map((child) => (
16-
<Link key={child.title} href={child.href}>
21+
<Link
22+
key={child.title}
23+
href={child.href}
24+
className={`px-2 py-1 w-full border border-transparent ${
25+
pathname === child.href &&
26+
"bg-primary text-black border-black"
27+
}`}
28+
>
1729
{child.title}
1830
{child.tag && (
1931
<Badge size="sm" className="ml-2">

‎components/ui/Card.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { cn } from "@/lib/utils";
22
import { HTMLAttributes } from "react";
3-
import { Text } from "@/components/ui/Text";
3+
import { Text } from "./Text";
44

55
interface ICardProps extends HTMLAttributes<HTMLDivElement> {
66
className?: string;

‎public/r/accordion-style-default.json‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
3+
"name": "accordion-style-default",
4+
"type": "registry:block",
5+
"title": "accordion-style-default",
6+
"registryDependencies": [
7+
"accordion"
8+
],
9+
"files": [
10+
{
11+
"path": "preview/components/accordion-style-default.tsx",
12+
"content": "\"use client\";\n\nimport { Accordion } from \"@/components/ui\";\n\nexport default function AccordionStyleDefault() {\n return (\n <Accordion type=\"single\" collapsible className=\"space-y-4\">\n <Accordion.Item value=\"item-1\">\n <Accordion.Header>Accordion Item 1</Accordion.Header>\n <Accordion.Content>\n This is the content of the first accordion item.\n </Accordion.Content>\n </Accordion.Item>\n <Accordion.Item value=\"item-2\">\n <Accordion.Header>Accordion Item 2</Accordion.Header>\n <Accordion.Content>\n This is the content of the second accordion item.\n </Accordion.Content>\n </Accordion.Item>\n <Accordion.Item value=\"item-3\">\n <Accordion.Header>Accordion Item 3</Accordion.Header>\n <Accordion.Content>\n This is the content of the third accordion item.\n </Accordion.Content>\n </Accordion.Item>\n </Accordion>\n );\n}\n",
13+
"type": "registry:block",
14+
"target": "components/retroui/preview/accordion-style-default.tsx"
15+
}
16+
]
17+
}

‎public/r/alert-style-all-status.json‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
3+
"name": "alert-style-all-status",
4+
"type": "registry:block",
5+
"title": "alert-style-all-status",
6+
"registryDependencies": [
7+
"alert"
8+
],
9+
"files": [
10+
{
11+
"path": "preview/components/alert-style-all-status.tsx",
12+
"content": "import { Alert } from \"@/components/ui\";\nimport { CheckCircle, InfoIcon, XIcon } from \"lucide-react\";\n\nexport default function AlertAllStatus() {\n return (\n <div className=\"space-y-4\">\n <Alert status=\"success\" className=\"flex items-center\">\n <CheckCircle className=\"h-4 w-4 mr-4\" />\n <Alert.Title>This is a success alert!</Alert.Title>\n </Alert>\n <Alert status=\"info\" className=\"flex items-center\">\n <InfoIcon className=\"h-4 w-4 mr-4\" />\n <Alert.Title>This is an info alert!</Alert.Title>\n </Alert>\n <Alert status=\"error\" className=\"flex items-center\">\n <XIcon className=\"h-4 w-4 mr-4\" />\n <Alert.Title>This is an error alert!</Alert.Title>\n </Alert>\n <Alert status=\"warning\" className=\"flex items-center\">\n <InfoIcon className=\"h-4 w-4 mr-4\" />\n <Alert.Title>This is an error alert!</Alert.Title>\n </Alert>\n </div>\n );\n}\n",
13+
"type": "registry:block",
14+
"target": "components/retroui/preview/alert-style-all-status.tsx"
15+
}
16+
]
17+
}

‎public/r/alert-style-default.json‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
3+
"name": "alert-style-default",
4+
"type": "registry:block",
5+
"title": "alert-style-default",
6+
"registryDependencies": [
7+
"alert"
8+
],
9+
"files": [
10+
{
11+
"path": "preview/components/alert-style-default.tsx",
12+
"content": "import { Alert } from \"@/components/ui\";\n\nexport default function AlertStyleDefault() {\n return (\n <Alert>\n <Alert.Title>Heads up!</Alert.Title>\n <Alert.Description>\n This is where you can write description that no one reads...\n </Alert.Description>\n </Alert>\n );\n}\n",
13+
"type": "registry:block",
14+
"target": "components/retroui/preview/alert-style-default.tsx"
15+
}
16+
]
17+
}

‎public/r/alert-style-solid.json‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
3+
"name": "alert-style-solid",
4+
"type": "registry:block",
5+
"title": "alert-style-solid",
6+
"registryDependencies": [
7+
"alert"
8+
],
9+
"files": [
10+
{
11+
"path": "preview/components/alert-style-solid.tsx",
12+
"content": "import { Alert } from \"@/components/ui\";\n\nexport default function AlertStyleDefault() {\n return (\n <Alert variant=\"solid\">\n <Alert.Title>Heads up!</Alert.Title>\n <Alert.Description>\n This is where you can write description that no one reads...\n </Alert.Description>\n </Alert>\n );\n}\n",
13+
"type": "registry:block",
14+
"target": "components/retroui/preview/alert-style-solid.tsx"
15+
}
16+
]
17+
}

0 commit comments

Comments
 (0)