mirror of
https://github.com/shadcnstudio/shadcn-studio
synced 2026-04-21 13:27:16 +00:00
feat(multi): added new themes and component variants
Added Calendar, Combobox, Date and Time Picker, Form, Input, Input Mask, Input OTP, Select, Switch & Textarea component variants Added Art Deco & Marshmallow themes
This commit is contained in:
Aayush Makwana
parent
49826c845c
commit
0883162a39
967 changed files with 20301 additions and 15847 deletions
7
.vscode/settings.json
vendored
7
.vscode/settings.json
vendored
|
|
@ -42,6 +42,7 @@
|
|||
"cSpell.words": [
|
||||
"behance",
|
||||
"Botosh",
|
||||
"chrono",
|
||||
"cmdk",
|
||||
"customizer",
|
||||
"Didn",
|
||||
|
|
@ -50,6 +51,7 @@
|
|||
"Dribbble",
|
||||
"Duarte",
|
||||
"Dulce",
|
||||
"emblor",
|
||||
"Español",
|
||||
"firstname",
|
||||
"Flyon",
|
||||
|
|
@ -61,12 +63,17 @@
|
|||
"Kianna",
|
||||
"lastname",
|
||||
"nums",
|
||||
"oklch",
|
||||
"peduarte",
|
||||
"pixinvent",
|
||||
"qwik",
|
||||
"Rosser",
|
||||
"samira",
|
||||
"shadcn",
|
||||
"shadcnstudio",
|
||||
"Shawshank",
|
||||
"Skylar",
|
||||
"solidjs",
|
||||
"sonner",
|
||||
"themeselection",
|
||||
"Throwdown",
|
||||
|
|
|
|||
20
CHANGELOG.md
20
CHANGELOG.md
|
|
@ -4,6 +4,26 @@
|
|||
|
||||
All notable changes to this project will be documented in this file.
|
||||
|
||||
## v1.0.0-beta.1 (2025-06-20)
|
||||
|
||||
### Added
|
||||
|
||||
- Added Calendar, Combobox, Date and Time Picker, Form, Input, Input Mask, Input OTP, Select, Switch & Textarea component variants
|
||||
- Added Animated Combobox, Select & Switch component variants
|
||||
- Added Art Deco & Marshmallow themes
|
||||
|
||||
### Updated
|
||||
|
||||
- Relocated the following folders to their new paths:
|
||||
- All ui components from `src/registry/new-york/ui` to `src/components/ui`
|
||||
- All component variants from `src/registry/new-york/components` to `src/components/shadcn-studio`
|
||||
- All hooks from `src/registry/new-york/hooks` to `src/hooks`
|
||||
- All libs from `src/registry/new-york/lib` to `src/lib`
|
||||
|
||||
### Removed
|
||||
|
||||
- Removed all registries from `public/r` and `src/registry` directories including generating scripts
|
||||
|
||||
## v1.0.0-alpha.3 (2025-06-06)
|
||||
|
||||
### Added
|
||||
|
|
|
|||
14
README.md
14
README.md
|
|
@ -2,7 +2,7 @@
|
|||
<img alt="shadcn/studio logo" width="800" src="https://cdn.shadcnstudio.com/ss-assets/smm/marketing/shadcn-studio-smm-banner.png">
|
||||
</a><br/><br/>
|
||||
|
||||
[shadcn/studio](https://shadcnstudio.com) is an open-source shadcn registry of copy-and-paste components, blocks, and templates—paired with a powerful theme editor to craft, customize, and ship faster. 🚀
|
||||
[shadcn/studio](https://shadcnstudio.com) is an open-source collection of copy-and-paste shadcn components, blocks, and templates - paired with a powerful theme generator to craft, customize, and ship faster. 🚀
|
||||
|
||||
<p>
|
||||
<a href="https://github.com/themeselection/shadcn-studio/blob/main/LICENSE.md"><img src="https://img.shields.io/badge/license-MIT-blue" alt="MIT License"></a>
|
||||
|
|
@ -45,7 +45,7 @@ Supported by [ThemeSelection](https://themeselection.com), with a commitment to
|
|||
|
||||
**This isn't a traditional component library or a replacement for Shadcn**. Instead, it's a unique collection offers customizable variants of components, blocks, and templates. Preview, customize, and copy-paste them into your apps with ease.
|
||||
|
||||
Building on the solid foundation of the Shadcn registry, we've enhanced it with custom-designed components & blocks to give you a head start. This allows you to craft, customize, and ship your projects faster and more efficiently.
|
||||
Building on the solid foundation of the Shadcn components & blocks, we've enhanced it with custom-designed components & blocks to give you a head start. This allows you to craft, customize, and ship your projects faster and more efficiently.
|
||||
|
||||
### Not a standard library, but a distribution of components
|
||||
|
||||
|
|
@ -59,12 +59,12 @@ While this approach offers flexibility and control, it comes with some limitatio
|
|||
|
||||
## This is where shadcn/studio shines ✨
|
||||
|
||||
An open-source Shadcn registry of copy-and-paste components, blocks, and templates—paired with a powerful theme editor to craft, customize, and ship faster 🚀. It provides a robust toolkit for building stunning, interactive user interfaces with ease.
|
||||
An open-source collection of copy-and-paste shadcn components, blocks, and templates - paired with a powerful theme generator to craft, customize, and ship faster 🚀. It provides a robust toolkit for building stunning, interactive user interfaces with ease.
|
||||
|
||||
- **Open-source:** Dive into a growing, community-driven collection of copy-and-paste components, blocks, and templates.
|
||||
- **Component & Blocks variants:** Access a diverse, collection of customizable shadcn component and block variants to quickly build and style your UI with ease.
|
||||
- **Animated variants with Motion:** Add smooth, modern animations to your components, enhancing user experiences with minimal effort.
|
||||
- **Powerful theme editor:** Tailor your UI effortlessly with real-time previews, ensuring consistent, branded designs delivered faster.
|
||||
- **Powerful theme generator:** Tailor your UI effortlessly with real-time previews, ensuring consistent, branded designs delivered faster.
|
||||
|
||||
## Features ✨
|
||||
|
||||
|
|
@ -124,15 +124,15 @@ Join the shadcn/studio community to discuss the library, ask questions, and shar
|
|||
We are grateful for the contributions of the open-source community, particularly:
|
||||
|
||||
- [shadcn/ui](https://ui.shadcn.com/)
|
||||
- [tweakcn](https://tweakcn.com/) (Our Theme Editor is heavily inspired by tweakcn)
|
||||
- [tweakcn](https://tweakcn.com/) (Our Theme Generator is heavily inspired by tweakcn)
|
||||
|
||||
These projects form the backbone of shadcn/studio, allowing us to build a powerful shadcn registry of copy-and-paste components.
|
||||
These projects form the backbone of shadcn/studio, allowing us to build a powerful copy-and-paste components.
|
||||
|
||||
## License ©
|
||||
|
||||
- Copyright © [ThemeSelection](https://themeselection.com/)
|
||||
- Licensed under [MIT](https://github.com/themeselection/shadcn-studio/blob/main/LICENSE.md)
|
||||
- shadcn/studio is an open-source shadcn registry of copy-and-paste components, blocks, and templates—paired with a powerful theme editor to craft, customize, and ship faster.
|
||||
- shadcn/studio is an open-source collection of copy-and-paste shadcn components, blocks, and templates - paired with a powerful theme generator to craft, customize, and ship faster.
|
||||
|
||||
## Useful Links 🎁
|
||||
|
||||
|
|
|
|||
|
|
@ -12,10 +12,10 @@
|
|||
},
|
||||
"aliases": {
|
||||
"components": "@/components",
|
||||
"hooks": "@/registry/new-york/hooks",
|
||||
"lib": "@/registry/new-york/lib",
|
||||
"utils": "@/registry/new-york/lib/utils",
|
||||
"ui": "@/registry/new-york/ui"
|
||||
"hooks": "@/hooks",
|
||||
"lib": "@/lib",
|
||||
"utils": "@/lib/utils",
|
||||
"ui": "@/components/ui"
|
||||
},
|
||||
"iconLibrary": "lucide"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,12 @@ const nextConfig: NextConfig = {
|
|||
return [
|
||||
{
|
||||
source: '/',
|
||||
destination: '/theme-editor',
|
||||
destination: '/theme-generator',
|
||||
permanent: true
|
||||
},
|
||||
{
|
||||
source: '/theme-editor',
|
||||
destination: '/theme-generator',
|
||||
permanent: true
|
||||
},
|
||||
{
|
||||
|
|
|
|||
101
package.json
101
package.json
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "shadcn-studio",
|
||||
"version": "1.0.0-alpha.3",
|
||||
"version": "1.0.0-beta.1",
|
||||
"license": "MIT",
|
||||
"publishConfig": {
|
||||
"access": "public"
|
||||
|
|
@ -13,41 +13,40 @@
|
|||
"lint:fix": "next lint --fix",
|
||||
"format": "prettier --write \"src/**/*.{js,jsx,ts,tsx,md,mdx}\"",
|
||||
"check-types": "tsc --noEmit",
|
||||
"registry:theme-generate": "tsx src/scripts/generate-theme-registry.ts",
|
||||
"registry:components-generate": "tsx src/scripts/generate-components-registry.ts",
|
||||
"clean": "rm -rf .next *.tsbuildinfo",
|
||||
"clean:node_modules": "rm -rf .next node_modules *.tsbuildinfo"
|
||||
},
|
||||
"dependencies": {
|
||||
"@hookform/resolvers": "^4.1.2",
|
||||
"@radix-ui/react-accordion": "^1.2.3",
|
||||
"@hookform/resolvers": "^5.1.1",
|
||||
"@radix-ui/react-accordion": "^1.2.11",
|
||||
"@radix-ui/react-alert-dialog": "^1.1.14",
|
||||
"@radix-ui/react-aspect-ratio": "^1.1.7",
|
||||
"@radix-ui/react-avatar": "^1.1.3",
|
||||
"@radix-ui/react-checkbox": "^1.1.4",
|
||||
"@radix-ui/react-collapsible": "^1.1.3",
|
||||
"@radix-ui/react-context-menu": "^2.2.7",
|
||||
"@radix-ui/react-dialog": "^1.1.6",
|
||||
"@radix-ui/react-dropdown-menu": "^2.1.6",
|
||||
"@radix-ui/react-avatar": "^1.1.10",
|
||||
"@radix-ui/react-checkbox": "^1.3.2",
|
||||
"@radix-ui/react-collapsible": "^1.1.11",
|
||||
"@radix-ui/react-context-menu": "^2.2.15",
|
||||
"@radix-ui/react-dialog": "^1.1.14",
|
||||
"@radix-ui/react-dropdown-menu": "^2.1.15",
|
||||
"@radix-ui/react-hover-card": "^1.1.14",
|
||||
"@radix-ui/react-label": "^2.1.2",
|
||||
"@radix-ui/react-menubar": "^1.1.7",
|
||||
"@radix-ui/react-label": "^2.1.7",
|
||||
"@radix-ui/react-menubar": "^1.1.15",
|
||||
"@radix-ui/react-navigation-menu": "^1.2.13",
|
||||
"@radix-ui/react-popover": "^1.1.6",
|
||||
"@radix-ui/react-popover": "^1.1.14",
|
||||
"@radix-ui/react-progress": "^1.1.7",
|
||||
"@radix-ui/react-radio-group": "^1.2.3",
|
||||
"@radix-ui/react-scroll-area": "^1.2.3",
|
||||
"@radix-ui/react-select": "^2.1.6",
|
||||
"@radix-ui/react-separator": "^1.1.2",
|
||||
"@radix-ui/react-slider": "^1.2.3",
|
||||
"@radix-ui/react-slot": "^1.1.2",
|
||||
"@radix-ui/react-switch": "^1.1.3",
|
||||
"@radix-ui/react-tabs": "^1.1.3",
|
||||
"@radix-ui/react-toggle": "^1.1.2",
|
||||
"@radix-ui/react-toggle-group": "^1.1.2",
|
||||
"@radix-ui/react-tooltip": "^1.1.8",
|
||||
"@tanstack/react-table": "^8.21.2",
|
||||
"@radix-ui/react-radio-group": "^1.3.7",
|
||||
"@radix-ui/react-scroll-area": "^1.2.9",
|
||||
"@radix-ui/react-select": "^2.2.5",
|
||||
"@radix-ui/react-separator": "^1.1.7",
|
||||
"@radix-ui/react-slider": "^1.3.5",
|
||||
"@radix-ui/react-slot": "^1.2.3",
|
||||
"@radix-ui/react-switch": "^1.2.5",
|
||||
"@radix-ui/react-tabs": "^1.1.12",
|
||||
"@radix-ui/react-toggle": "^1.1.9",
|
||||
"@radix-ui/react-toggle-group": "^1.1.10",
|
||||
"@radix-ui/react-tooltip": "^1.2.7",
|
||||
"@tanstack/react-table": "^8.21.3",
|
||||
"chroma-js": "^3.1.2",
|
||||
"chrono-node": "^2.8.3",
|
||||
"class-variance-authority": "^0.7.1",
|
||||
"clsx": "^2.1.1",
|
||||
"cmdk": "^1.1.1",
|
||||
|
|
@ -55,43 +54,47 @@
|
|||
"embla-carousel-react": "^8.6.0",
|
||||
"hast-util-to-jsx-runtime": "^2.3.6",
|
||||
"input-otp": "^1.4.2",
|
||||
"lucide-react": "^0.483.0",
|
||||
"motion": "^12.15.0",
|
||||
"next": "^15.2.4",
|
||||
"little-date": "^1.0.0",
|
||||
"lucide-react": "^0.516.0",
|
||||
"motion": "^12.18.1",
|
||||
"next": "^15.3.3",
|
||||
"next-themes": "^0.4.6",
|
||||
"react": "^19.0.0",
|
||||
"react-day-picker": "8.10.1",
|
||||
"react-dom": "^19.0.0",
|
||||
"react-hook-form": "^7.56.4",
|
||||
"react-resizable-panels": "^2.1.7",
|
||||
"react": "^19.1.0",
|
||||
"react-aria-components": "^1.10.1",
|
||||
"react-day-picker": "9.7.0",
|
||||
"react-dom": "^19.1.0",
|
||||
"react-hook-form": "^7.58.0",
|
||||
"react-payment-inputs": "^1.2.0",
|
||||
"react-resizable-panels": "^3.0.3",
|
||||
"react-use": "^17.6.0",
|
||||
"recharts": "^2.15.1",
|
||||
"recharts": "^2.15.3",
|
||||
"server-only": "^0.0.1",
|
||||
"shadcn": "^2.6.0",
|
||||
"shepherd.js": "^14.5.0",
|
||||
"sonner": "^2.0.1",
|
||||
"tailwind-merge": "^3.0.2",
|
||||
"tw-animate-css": "^1.2.4",
|
||||
"sonner": "^2.0.5",
|
||||
"tailwind-merge": "^3.3.1",
|
||||
"use-mask-input": "^3.4.2",
|
||||
"vaul": "^1.1.2",
|
||||
"zod": "^3.25.28"
|
||||
"zod": "^3.25.67"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/postcss": "^4.0.15",
|
||||
"@tailwindcss/postcss": "^4.1.10",
|
||||
"@types/chroma-js": "^3.1.1",
|
||||
"@types/eslint": "^8.56.12",
|
||||
"@types/node": "^22.13.13",
|
||||
"@types/react": "^19.0.12",
|
||||
"@types/react-dom": "^19.0.4",
|
||||
"@types/node": "^22.15.32",
|
||||
"@types/react": "^19.1.8",
|
||||
"@types/react-dom": "^19.1.6",
|
||||
"@types/react-payment-inputs": "^1.1.4",
|
||||
"@typescript-eslint/eslint-plugin": "^7.18.0",
|
||||
"@typescript-eslint/parser": "^7.18.0",
|
||||
"eslint": "^8.57.1",
|
||||
"eslint-config-next": "^15.2.4",
|
||||
"eslint-config-prettier": "^10.1.1",
|
||||
"eslint-config-next": "^15.3.3",
|
||||
"eslint-config-prettier": "^10.1.5",
|
||||
"eslint-plugin-import": "^2.31.0",
|
||||
"prettier": "^3.5.3",
|
||||
"prettier-plugin-tailwindcss": "^0.6.11",
|
||||
"shiki": "^3.2.2",
|
||||
"tailwindcss": "^4.0.15",
|
||||
"prettier-plugin-tailwindcss": "^0.6.12",
|
||||
"shiki": "^3.6.0",
|
||||
"tailwindcss": "^4.1.10",
|
||||
"tw-animate-css": "^1.3.4",
|
||||
"typescript": "5.5.4"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
5438
pnpm-lock.yaml
5438
pnpm-lock.yaml
File diff suppressed because it is too large
Load diff
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-01",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"accordion"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-01.tsx",
|
||||
"content": "import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/registry/new-york/ui/accordion'\n\nconst items = [\n {\n title: 'How do I track my order?',\n content: `You can track your order by logging into your account and visiting the \"Orders\" section. You'll receive tracking information via email once your order ships. For real-time updates, you can also use the tracking number provided in your shipping confirmation email.`\n },\n {\n title: 'What is your return policy?',\n content:\n 'We offer a 30-day return policy for most items. Products must be unused and in their original packaging. To initiate a return, please contact our customer service team or use the return portal in your account dashboard.'\n },\n {\n title: 'How can I contact customer support?',\n content:\n 'Our customer support team is available 24/7. You can reach us via live chat, email at support@example.com, or by phone at 1-800-123-4567. For faster service, please have your order number ready when contacting us.'\n }\n]\n\nconst AccordionDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem key={index} value={`item-${index + 1}`}>\n <AccordionTrigger>{item.title}</AccordionTrigger>\n <AccordionContent className='text-muted-foreground'>{item.content}</AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-01.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-02",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"accordion"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-02.tsx",
|
||||
"content": "import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/registry/new-york/ui/accordion'\n\nconst items = [\n {\n title: 'How do I track my order?',\n content: `You can track your order by logging into your account and visiting the \"Orders\" section. You'll receive tracking information via email once your order ships. For real-time updates, you can also use the tracking number provided in your shipping confirmation email.`\n },\n {\n title: 'What is your return policy?',\n content:\n 'We offer a 30-day return policy for most items. Products must be unused and in their original packaging. To initiate a return, please contact our customer service team or use the return portal in your account dashboard.'\n },\n {\n title: 'How can I contact customer support?',\n content:\n 'Our customer support team is available 24/7. You can reach us via live chat, email at support@example.com, or by phone at 1-800-123-4567. For faster service, please have your order number ready when contacting us.'\n }\n]\n\nconst AccordionSplitDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full space-y-2' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem\n key={index}\n value={`item-${index + 1}`}\n className='bg-card rounded-md border-b-0 shadow-md data-[state=open]:shadow-lg'\n >\n <AccordionTrigger className='px-5 [&>svg]:rotate-90 [&[data-state=open]>svg]:rotate-0'>\n {item.title}\n </AccordionTrigger>\n <AccordionContent className='text-muted-foreground px-5'>{item.content}</AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionSplitDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-02.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-03",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"accordion"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-03.tsx",
|
||||
"content": "import { HeadsetIcon, PackageIcon, RefreshCwIcon } from 'lucide-react'\n\nimport { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/registry/new-york/ui/accordion'\n\nconst items = [\n {\n icon: PackageIcon,\n title: 'How do I track my order?',\n content: `You can track your order by logging into your account and visiting the \"Orders\" section. You'll receive tracking information via email once your order ships. For real-time updates, you can also use the tracking number provided in your shipping confirmation email.`\n },\n {\n icon: RefreshCwIcon,\n title: 'What is your return policy?',\n content:\n 'We offer a 30-day return policy for most items. Products must be unused and in their original packaging. To initiate a return, please contact our customer service team or use the return portal in your account dashboard.'\n },\n {\n icon: HeadsetIcon,\n title: 'How can I contact customer support?',\n content:\n 'Our customer support team is available 24/7. You can reach us via live chat, email at support@example.com, or by phone at 1-800-123-4567. For faster service, please have your order number ready when contacting us.'\n }\n]\n\nconst AccordionLeftIconDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem key={index} value={`item-${index + 1}`}>\n <AccordionTrigger className='justify-start [&>svg]:order-first'>\n <span className='flex items-center gap-4'>\n <item.icon className='text-muted-foreground size-4 shrink-0' />\n <span>{item.title}</span>\n </span>\n </AccordionTrigger>\n <AccordionContent className='text-muted-foreground'>{item.content}</AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionLeftIconDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-03.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-04",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"@radix-ui/react-accordion",
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"accordion"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-04.tsx",
|
||||
"content": "import { PlusIcon } from 'lucide-react'\n\nimport * as AccordionPrimitive from '@radix-ui/react-accordion'\n\nimport { Accordion, AccordionContent, AccordionItem } from '@/registry/new-york/ui/accordion'\n\nconst items = [\n {\n title: 'How do I track my order?',\n content: `You can track your order by logging into your account and visiting the \"Orders\" section. You'll receive tracking information via email once your order ships. For real-time updates, you can also use the tracking number provided in your shipping confirmation email.`\n },\n {\n title: 'What is your return policy?',\n content:\n 'We offer a 30-day return policy for most items. Products must be unused and in their original packaging. To initiate a return, please contact our customer service team or use the return portal in your account dashboard.'\n },\n {\n title: 'How can I contact customer support?',\n content:\n 'Our customer support team is available 24/7. You can reach us via live chat, email at support@example.com, or by phone at 1-800-123-4567. For faster service, please have your order number ready when contacting us.'\n }\n]\n\nconst AccordionPlusMinusIconDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem key={index} value={`item-${index + 1}`}>\n <AccordionPrimitive.Header className='flex'>\n <AccordionPrimitive.Trigger\n data-slot='accordion-trigger'\n className='focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-center justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&>svg>path:last-child]:origin-center [&>svg>path:last-child]:transition-all [&>svg>path:last-child]:duration-200 [&[data-state=open]>svg]:rotate-180 [&[data-state=open]>svg>path:last-child]:rotate-90 [&[data-state=open]>svg>path:last-child]:opacity-0'\n >\n {item.title}\n <PlusIcon className='text-muted-foreground pointer-events-none size-4 shrink-0 transition-transform duration-200' />\n </AccordionPrimitive.Trigger>\n </AccordionPrimitive.Header>\n <AccordionContent className='text-muted-foreground'>{item.content}</AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionPlusMinusIconDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-04.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-05",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"accordion"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-05.tsx",
|
||||
"content": "import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/registry/new-york/ui/accordion'\n\nconst items = [\n {\n title: 'How do I track my order?',\n content: `You can track your order by logging into your account and visiting the \"Orders\" section. You'll receive tracking information via email once your order ships. For real-time updates, you can also use the tracking number provided in your shipping confirmation email.`\n },\n {\n title: 'What is your return policy?',\n content:\n 'We offer a 30-day return policy for most items. Products must be unused and in their original packaging. To initiate a return, please contact our customer service team or use the return portal in your account dashboard.'\n },\n {\n title: 'How can I contact customer support?',\n content:\n 'Our customer support team is available 24/7. You can reach us via live chat, email at support@example.com, or by phone at 1-800-123-4567. For faster service, please have your order number ready when contacting us.'\n }\n]\n\nconst AccordionActiveItemDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem\n key={index}\n value={`item-${index + 1}`}\n className='data-[state=open]:border-amber-600 not-last:data-[state=open]:border-b-2 dark:data-[state=open]:border-amber-400'\n >\n <AccordionTrigger className='data-[state=open]:text-amber-600 dark:data-[state=open]:text-amber-400 [&[data-state=open]>svg]:text-amber-600 dark:[&[data-state=open]>svg]:text-amber-400'>\n {item.title}\n </AccordionTrigger>\n <AccordionContent className='text-muted-foreground'>{item.content}</AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionActiveItemDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-05.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-06",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"@radix-ui/react-accordion",
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"accordion"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-06.tsx",
|
||||
"content": "import { HeadsetIcon, PackageIcon, PlusIcon, RefreshCwIcon } from 'lucide-react'\n\nimport * as AccordionPrimitive from '@radix-ui/react-accordion'\n\nimport { Accordion, AccordionContent, AccordionItem } from '@/registry/new-york/ui/accordion'\n\nconst items = [\n {\n icon: PackageIcon,\n title: 'How do I track my order?',\n content: `You can track your order by logging into your account and visiting the \"Orders\" section. You'll receive tracking information via email once your order ships. For real-time updates, you can also use the tracking number provided in your shipping confirmation email.`\n },\n {\n icon: RefreshCwIcon,\n title: 'What is your return policy?',\n content:\n 'We offer a 30-day return policy for most items. Products must be unused and in their original packaging. To initiate a return, please contact our customer service team or use the return portal in your account dashboard.'\n },\n {\n icon: HeadsetIcon,\n title: 'How can I contact customer support?',\n content:\n 'Our customer support team is available 24/7. You can reach us via live chat, email at support@example.com, or by phone at 1-800-123-4567. For faster service, please have your order number ready when contacting us.'\n }\n]\n\nconst AccordionExpandIconDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem key={index} value={`item-${index + 1}`}>\n <AccordionPrimitive.Header className='flex'>\n <AccordionPrimitive.Trigger\n data-slot='accordion-trigger'\n className='focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-45'\n >\n <span className='flex items-center gap-4'>\n <item.icon className='size-4 shrink-0' />\n <span>{item.title}</span>\n </span>\n <PlusIcon className='text-muted-foreground pointer-events-none size-4 shrink-0 transition-transform duration-200' />\n </AccordionPrimitive.Trigger>\n </AccordionPrimitive.Header>\n <AccordionContent className='text-muted-foreground'>{item.content}</AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionExpandIconDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-06.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-07",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"accordion",
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-07.tsx",
|
||||
"content": "import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/registry/new-york/ui/accordion'\nimport { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst items = [\n {\n name: 'Richard Payne',\n email: 'pwright@yahoo.com',\n avatarImage: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-1.png',\n content:\n 'Richard Payne is a remarkable individual known for his exceptional skills and expertise in various fields. With a strong background in technology and a passion for innovation, Richard has made significant contributions to the industry.'\n },\n {\n name: 'Jordan Stevenson',\n email: 'wramirez@outlook.com',\n avatarImage: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-2.png',\n content:\n 'Jordan Stevenson is a talented individual with a passion for technology and innovation. Jordan has made significant contributions to various projects and has a deep understanding of programming languages and frameworks.'\n },\n {\n name: 'Nicholas Tanner',\n email: 'snguyen@icloud.com',\n avatarImage: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-3.png',\n content:\n 'Nicholas Tanner is a highly skilled individual with a strong passion for technology and innovation. Nicholas has made significant contributions to numerous projects and possesses a deep understanding of various programming languages and frameworks.'\n }\n]\n\nconst AccordionAvatarDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem key={index} value={`item-${index + 1}`}>\n <AccordionTrigger className='items-center hover:no-underline'>\n <span className='flex items-center gap-4'>\n <Avatar className='size-10.5 rounded-sm'>\n <AvatarImage src={item.avatarImage} alt={item.name} className='rounded-sm' />\n <AvatarFallback className='rounded-sm text-xs'>\n {item.name.split(/\\s/).reduce((response, word) => (response += word.slice(0, 1)), '')}\n </AvatarFallback>\n </Avatar>\n <span className='flex flex-col space-y-0.5'>\n <span>{item.name}</span>\n <span className='text-muted-foreground font-normal'>{item.email}</span>\n </span>\n </span>\n </AccordionTrigger>\n <AccordionContent className='text-muted-foreground'>{item.content}</AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionAvatarDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-07.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-08",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"@radix-ui/react-accordion",
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"accordion"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-08.tsx",
|
||||
"content": "import { HeadsetIcon, PackageIcon, PlusIcon, RefreshCwIcon } from 'lucide-react'\n\nimport * as AccordionPrimitive from '@radix-ui/react-accordion'\n\nimport { Accordion, AccordionContent, AccordionItem } from '@/registry/new-york/ui/accordion'\n\nconst items = [\n {\n icon: PackageIcon,\n title: 'How do I track my order?',\n subtitle: 'Shipping & Delivery',\n content: `You can track your order by logging into your account and visiting the \"Orders\" section. You'll receive tracking information via email once your order ships. For real-time updates, you can also use the tracking number provided in your shipping confirmation email.`\n },\n {\n icon: RefreshCwIcon,\n title: 'What is your return policy?',\n subtitle: 'Returns & Refunds',\n content:\n 'We offer a 30-day return policy for most items. Products must be unused and in their original packaging. To initiate a return, please contact our customer service team or use the return portal in your account dashboard.'\n },\n {\n icon: HeadsetIcon,\n title: 'How can I contact customer support?',\n subtitle: 'Help & Support',\n content:\n 'Our customer support team is available 24/7. You can reach us via live chat, email at support@example.com, or by phone at 1-800-123-4567. For faster service, please have your order number ready when contacting us.'\n }\n]\n\nconst AccordionIconSubtitleDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem key={index} value={`item-${index + 1}`}>\n <AccordionPrimitive.Header className='flex'>\n <AccordionPrimitive.Trigger\n data-slot='accordion-trigger'\n className='focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-center justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&>svg>path:last-child]:origin-center [&>svg>path:last-child]:transition-all [&>svg>path:last-child]:duration-200 [&[data-state=open]>svg]:rotate-180 [&[data-state=open]>svg>path:last-child]:rotate-90 [&[data-state=open]>svg>path:last-child]:opacity-0'\n >\n <span className='flex items-center gap-4'>\n <span\n className='flex size-10 shrink-0 items-center justify-center rounded-full border'\n aria-hidden='true'\n >\n <item.icon className='size-4' />\n </span>\n <span className='flex flex-col space-y-0.5'>\n <span>{item.title}</span>\n <span className='text-muted-foreground font-normal'>{item.subtitle}</span>\n </span>\n </span>\n <PlusIcon className='text-muted-foreground pointer-events-none size-4 shrink-0 transition-transform duration-200' />\n </AccordionPrimitive.Trigger>\n </AccordionPrimitive.Header>\n <AccordionContent className='text-muted-foreground'>{item.content}</AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionIconSubtitleDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-08.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-09",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"accordion"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-09.tsx",
|
||||
"content": "import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/registry/new-york/ui/accordion'\n\nconst items = [\n {\n title: 'How do I track my order?',\n content: `You can track your order by logging into your account and visiting the \"Orders\" section. You'll receive tracking information via email once your order ships. For real-time updates, you can also use the tracking number provided in your shipping confirmation email.`\n },\n {\n title: 'What is your return policy?',\n content:\n 'We offer a 30-day return policy for most items. Products must be unused and in their original packaging. To initiate a return, please contact our customer service team or use the return portal in your account dashboard.'\n },\n {\n title: 'How can I contact customer support?',\n content:\n 'Our customer support team is available 24/7. You can reach us via live chat, email at support@example.com, or by phone at 1-800-123-4567. For faster service, please have your order number ready when contacting us.'\n }\n]\n\nconst AccordionOutlineDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full space-y-2' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem key={index} value={`item-${index + 1}`} className='rounded-md border!'>\n <AccordionTrigger className='px-5'>{item.title}</AccordionTrigger>\n <AccordionContent className='text-muted-foreground px-5'>{item.content}</AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionOutlineDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-09.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-10",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"accordion"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-10.tsx",
|
||||
"content": "import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/registry/new-york/ui/accordion'\n\nconst items = [\n {\n title: 'How do I track my order?',\n content: `You can track your order by logging into your account and visiting the \"Orders\" section. You'll receive tracking information via email once your order ships. For real-time updates, you can also use the tracking number provided in your shipping confirmation email.`\n },\n {\n title: 'What is your return policy?',\n content:\n 'We offer a 30-day return policy for most items. Products must be unused and in their original packaging. To initiate a return, please contact our customer service team or use the return portal in your account dashboard.'\n },\n {\n title: 'How can I contact customer support?',\n content:\n 'Our customer support team is available 24/7. You can reach us via live chat, email at support@example.com, or by phone at 1-800-123-4567. For faster service, please have your order number ready when contacting us.'\n }\n]\n\nconst AccordionBoxDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full rounded-md border' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem key={index} value={`item-${index + 1}`}>\n <AccordionTrigger className='px-5'>{item.title}</AccordionTrigger>\n <AccordionContent className='text-muted-foreground px-5'>{item.content}</AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionBoxDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-10.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-11",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"accordion"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-11.tsx",
|
||||
"content": "import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/registry/new-york/ui/accordion'\n\nconst items = [\n {\n title: 'How do I track my order?',\n content: `You can track your order by logging into your account and visiting the \"Orders\" section. You'll receive tracking information via email once your order ships. For real-time updates, you can also use the tracking number provided in your shipping confirmation email.`\n },\n {\n title: 'What is your return policy?',\n content:\n 'We offer a 30-day return policy for most items. Products must be unused and in their original packaging. To initiate a return, please contact our customer service team or use the return portal in your account dashboard.'\n },\n {\n title: 'How can I contact customer support?',\n content:\n 'Our customer support team is available 24/7. You can reach us via live chat, email at support@example.com, or by phone at 1-800-123-4567. For faster service, please have your order number ready when contacting us.'\n }\n]\n\nconst AccordionTabsDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem\n key={index}\n value={`item-${index + 1}`}\n className='data-[state=open]:bg-accent rounded-md border-none px-5 transition-colors duration-200'\n >\n <AccordionTrigger>{item.title}</AccordionTrigger>\n <AccordionContent className='text-muted-foreground'>{item.content}</AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionTabsDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-11.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-12",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"@radix-ui/react-accordion",
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"accordion"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-12.tsx",
|
||||
"content": "import { PlusIcon } from 'lucide-react'\n\nimport * as AccordionPrimitive from '@radix-ui/react-accordion'\n\nimport { Accordion, AccordionContent, AccordionItem } from '@/registry/new-york/ui/accordion'\n\nconst items = [\n {\n title: 'How do I track my order?',\n content: `You can track your order by logging into your account and visiting the \"Orders\" section. You'll receive tracking information via email once your order ships. For real-time updates, you can also use the tracking number provided in your shipping confirmation email.`\n },\n {\n title: 'What is your return policy?',\n content:\n 'We offer a 30-day return policy for most items. Products must be unused and in their original packaging. To initiate a return, please contact our customer service team or use the return portal in your account dashboard.'\n },\n {\n title: 'How can I contact customer support?',\n content:\n 'Our customer support team is available 24/7. You can reach us via live chat, email at support@example.com, or by phone at 1-800-123-4567. For faster service, please have your order number ready when contacting us.'\n }\n]\n\nconst AccordionTabsOutlineDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem\n key={index}\n value={`item-${index + 1}`}\n className='data-[state=open]:border-border rounded-md border border-transparent px-5 transition-colors duration-200 data-[state=open]:border data-[state=open]:shadow-md'\n >\n <AccordionPrimitive.Header className='flex'>\n <AccordionPrimitive.Trigger\n data-slot='accordion-trigger'\n className='focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-center justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&>svg>path:last-child]:origin-center [&>svg>path:last-child]:transition-all [&>svg>path:last-child]:duration-200 [&[data-state=open]>svg]:rotate-180 [&[data-state=open]>svg>path:last-child]:rotate-90 [&[data-state=open]>svg>path:last-child]:opacity-0'\n >\n {item.title}\n <PlusIcon className='text-muted-foreground pointer-events-none size-4 shrink-0 transition-transform duration-200' />\n </AccordionPrimitive.Trigger>\n </AccordionPrimitive.Header>\n <AccordionContent className='text-muted-foreground'>{item.content}</AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionTabsOutlineDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-12.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-13",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"accordion"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-13.tsx",
|
||||
"content": "import { HeadsetIcon, PackageIcon, RefreshCwIcon } from 'lucide-react'\n\nimport { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/registry/new-york/ui/accordion'\n\nconst items = [\n {\n icon: PackageIcon,\n title: 'How do I track my order?',\n content: \"You'll receive tracking information via email once your order ships.\",\n media: 'https://cdn.shadcnstudio.com/ss-assets/components/accordion/image-1.jpg?width=520&format=auto'\n },\n {\n icon: RefreshCwIcon,\n title: 'What is your return policy?',\n content: 'We offer a 30-day return policy for most items.',\n media: 'https://cdn.shadcnstudio.com/ss-assets/components/accordion/image-2.jpg?width=520&format=auto'\n },\n {\n icon: HeadsetIcon,\n title: 'How can I contact customer support?',\n content: 'You can reach us via live chat, email at support@example.com, or by phone at 1-800-123-4567.',\n media: 'https://cdn.shadcnstudio.com/ss-assets/components/accordion/image-3.jpg?width=520&format=auto'\n }\n]\n\nconst AccordionMediaContentDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem key={index} value={`item-${index + 1}`}>\n <AccordionTrigger>\n <span className='flex items-center gap-4'>\n <item.icon className='size-4 shrink-0' />\n <span>{item.title}</span>\n </span>\n </AccordionTrigger>\n <AccordionContent className='space-y-4'>\n <p className='text-muted-foreground'>{item.content}</p>\n <img src={item.media} alt={item.title} className='w-full rounded-md' />\n </AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionMediaContentDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-13.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "accordion-14",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"accordion"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/accordion/accordion-14.tsx",
|
||||
"content": "import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/registry/new-york/ui/accordion'\n\nconst items = [\n {\n title: 'How do I track my order?',\n content: `You can track your order by logging into your account and visiting the \"Orders\" section. You'll receive tracking information via email once your order ships. For real-time updates, you can also use the tracking number provided in your shipping confirmation email.`\n },\n {\n title: 'What is your return policy?',\n content:\n 'We offer a 30-day return policy for most items. Products must be unused and in their original packaging. To initiate a return, please contact our customer service team or use the return portal in your account dashboard.'\n },\n {\n title: 'How can I contact customer support?',\n content:\n 'Our customer support team is available 24/7. You can reach us via live chat, email at support@example.com, or by phone at 1-800-123-4567. For faster service, please have your order number ready when contacting us.'\n }\n]\n\nconst AccordionFilledDemo = () => {\n return (\n <Accordion type='single' collapsible className='w-full space-y-2' defaultValue='item-1'>\n {items.map((item, index) => (\n <AccordionItem key={index} value={`item-${index + 1}`} className='rounded-md border!'>\n <AccordionTrigger className='bg-accent px-5 data-[state=open]:rounded-b-none'>{item.title}</AccordionTrigger>\n <AccordionContent className='text-muted-foreground px-5 pt-4'>{item.content}</AccordionContent>\n </AccordionItem>\n ))}\n </Accordion>\n )\n}\n\nexport default AccordionFilledDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/accordion/accordion-14.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-01",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-01.tsx",
|
||||
"content": "import { CircleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle } from '@/registry/new-york/ui/alert'\n\nconst AlertDemo = () => {\n return (\n <Alert>\n <CircleAlert />\n <AlertTitle>New message!</AlertTitle>\n </Alert>\n )\n}\n\nexport default AlertDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-01.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-02",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert",
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-02.tsx",
|
||||
"content": "import { CircleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\nimport { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst AlertWithAvatarDemo = () => {\n return (\n <Alert className='flex items-center justify-between'>\n <Avatar className='rounded-sm'>\n <AvatarImage\n src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png'\n alt='Hallie Richards'\n className='rounded-sm'\n />\n <AvatarFallback className='text-xs'>HR</AvatarFallback>\n </Avatar>\n <div className='flex-1 flex-col justify-center gap-1'>\n <AlertTitle className='flex-1'>Sara has replied on the uploaded image.</AlertTitle>\n <AlertDescription>12 unread messages. Tap to see.</AlertDescription>\n </div>\n <CircleAlert />\n </Alert>\n )\n}\n\nexport default AlertWithAvatarDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-02.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-03",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-03.tsx",
|
||||
"content": "'use client'\n\nimport { useState } from 'react'\n\nimport { CircleAlert, XIcon } from 'lucide-react'\n\nimport { Alert, AlertDescription, AlertTitle } from '@/registry/new-york/ui/alert'\n\nconst AlertClosableDemo = () => {\n const [isActive, setIsActive] = useState(true)\n\n if (!isActive) return null\n\n return (\n <Alert className='flex justify-between'>\n <CircleAlert />\n <div className='flex-1 flex-col justify-center gap-1'>\n <AlertTitle>New message!</AlertTitle>\n <AlertDescription>12 unread messages. Tap to see.</AlertDescription>\n </div>\n <button className='cursor-pointer' onClick={() => setIsActive(false)}>\n <XIcon className='size-5' />\n <span className='sr-only'>Close</span>\n </button>\n </Alert>\n )\n}\n\nexport default AlertClosableDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-03.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-04",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert",
|
||||
"button"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-04.tsx",
|
||||
"content": "import { ArrowRight, CircleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle } from '@/registry/new-york/ui/alert'\nimport { Button } from '@/registry/new-york/ui/button'\n\nconst AlertWithLinkDemo = () => {\n return (\n <Alert className='flex items-center justify-between border-sky-600 text-sky-600 dark:border-sky-400 dark:text-sky-400 [&>svg]:translate-y-0'>\n <CircleAlert />\n <AlertTitle className='flex-1'>New message!</AlertTitle>\n <Button\n variant='outline'\n className='h-7 cursor-pointer rounded-md border-sky-600 px-2 text-sky-600! hover:bg-sky-600/10 focus-visible:border-sky-600 focus-visible:ring-sky-600/20 dark:border-sky-400 dark:text-sky-400! dark:hover:bg-sky-400/10 dark:focus-visible:border-sky-400 dark:focus-visible:ring-sky-400/40'\n asChild\n >\n <a href='#'>\n Link\n <ArrowRight />\n </a>\n </Button>\n </Alert>\n )\n}\n\nexport default AlertWithLinkDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-04.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-05",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-05.tsx",
|
||||
"content": "import { FileWarning } from 'lucide-react'\n\nimport { Alert, AlertTitle } from '@/registry/new-york/ui/alert'\n\nconst AlertAttachedIconDemo = () => {\n return (\n <Alert className='flex items-stretch p-0'>\n <div className='bg-destructive/10 text-destructive flex items-center rounded-s-[10px] border-r p-2'>\n <FileWarning className='size-4' />\n </div>\n <AlertTitle className='p-3'>This file contains virus!</AlertTitle>\n </Alert>\n )\n}\n\nexport default AlertAttachedIconDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-05.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-06",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert",
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-06.tsx",
|
||||
"content": "import { FileWarning } from 'lucide-react'\n\nimport { Alert, AlertTitle } from '@/registry/new-york/ui/alert'\nimport { Avatar, AvatarFallback } from '@/registry/new-york/ui/avatar'\n\nconst AlertFocusedIconDemo = () => {\n return (\n <Alert className='flex items-center gap-3'>\n <Avatar className='rounded-md'>\n <AvatarFallback className='bg-destructive dark:bg-destructive/60 rounded-md text-white'>\n <FileWarning className='size-4' />\n </AvatarFallback>\n </Avatar>\n <AlertTitle>This file contains virus!</AlertTitle>\n </Alert>\n )\n}\n\nexport default AlertFocusedIconDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-06.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-07",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert",
|
||||
"button"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-07.tsx",
|
||||
"content": "'use client'\n\nimport { useState, useEffect } from 'react'\n\nimport { Upload, XIcon } from 'lucide-react'\n\nimport { Alert, AlertDescription, AlertTitle } from '@/registry/new-york/ui/alert'\nimport { Button } from '@/registry/new-york/ui/button'\nimport { Progress } from '@/registry/new-york/ui/progress'\n\nconst AlertFileUploadDemo = () => {\n const [isActive, setIsActive] = useState(true)\n\n const [progress, setProgress] = useState(0)\n\n useEffect(() => {\n const timer = setTimeout(() => setProgress(50), 100)\n\n return () => clearTimeout(timer)\n }, [])\n\n if (!isActive) return null\n\n return (\n <Alert className='flex justify-between'>\n <Upload />\n <div className='flex flex-1 flex-col gap-4'>\n <div className='flex-1 flex-col justify-center gap-1'>\n <AlertTitle>Uploading your 'Img-234.png'</AlertTitle>\n <AlertDescription>Please wait While we upload your image.</AlertDescription>\n </div>\n <Progress\n value={progress}\n className='bg-sky-600/20 *:bg-sky-600 dark:bg-sky-400/20 dark:*:bg-sky-400'\n aria-label='Upload Progress'\n />\n <div className='flex items-center gap-4'>\n <Button variant='ghost' className='h-7 cursor-pointer rounded-md px-2'>\n Cancel\n </Button>\n <Button\n variant='ghost'\n disabled\n className='h-7 cursor-pointer rounded-md px-2 text-sky-600 hover:bg-sky-600/10 hover:text-sky-600 dark:text-sky-400 dark:hover:bg-sky-400/10 dark:hover:text-sky-400'\n >\n Upload another\n </Button>\n </div>\n </div>\n <button className='size-5 cursor-pointer' onClick={() => setIsActive(false)}>\n <XIcon className='size-5' />\n <span className='sr-only'>Close</span>\n </button>\n </Alert>\n )\n}\n\nexport default AlertFileUploadDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-07.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-08",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert",
|
||||
"button"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-08.tsx",
|
||||
"content": "'use client'\n\nimport { useState } from 'react'\n\nimport { CircleAlert, XIcon } from 'lucide-react'\n\nimport { Alert, AlertDescription, AlertTitle } from '@/registry/new-york/ui/alert'\nimport { Button } from '@/registry/new-york/ui/button'\n\nconst AlertMultipleActionDemo = () => {\n const [isActive, setIsActive] = useState(true)\n\n if (!isActive) return null\n\n return (\n <Alert className='bg-primary text-primary-foreground flex justify-between border-none'>\n <CircleAlert />\n <div className='flex flex-1 flex-col gap-4'>\n <div className='flex-1 flex-col justify-center gap-1'>\n <AlertTitle>A new update is available</AlertTitle>\n <AlertDescription className='text-primary-foreground/80'>\n Includes the at new dashboard View. Pages end exports will now load taster\n </AlertDescription>\n </div>\n <div className='flex items-center gap-4'>\n <Button className='bg-secondary/10 focus-visible:bg-secondary/20 hover:bg-secondary/20 h-7 cursor-pointer rounded-md px-2'>\n Skip this update\n </Button>\n <Button variant='secondary' className='h-7 cursor-pointer rounded-md px-2'>\n Install now\n </Button>\n </div>\n </div>\n <button className='size-5 cursor-pointer' onClick={() => setIsActive(false)}>\n <XIcon className='size-5' />\n <span className='sr-only'>Close</span>\n </button>\n </Alert>\n )\n}\n\nexport default AlertMultipleActionDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-08.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,21 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-09",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert",
|
||||
"avatar",
|
||||
"progress"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-09.tsx",
|
||||
"content": "'use client'\n\nimport { useState, useEffect } from 'react'\n\nimport { Alert, AlertDescription, AlertTitle } from '@/registry/new-york/ui/alert'\nimport { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\nimport { Progress } from '@/registry/new-york/ui/progress'\n\nconst AlertTaskDemo = () => {\n const [progress, setProgress] = useState(0)\n\n useEffect(() => {\n const timer = setTimeout(() => setProgress(50), 100)\n\n return () => clearTimeout(timer)\n }, [])\n\n return (\n <Alert className='flex gap-3'>\n <Avatar className='rounded-sm'>\n <AvatarImage\n src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png'\n alt='Hallie Richards'\n className='rounded-sm'\n />\n <AvatarFallback className='text-xs'>HR</AvatarFallback>\n </Avatar>\n <div className='flex flex-1 flex-col gap-2'>\n <div className='flex-1 flex-col justify-center gap-1'>\n <AlertTitle>@Rocky</AlertTitle>\n <AlertDescription>this projects task is remaining, deadline is near.</AlertDescription>\n </div>\n <Progress\n value={progress}\n className='bg-amber-600/20 *:bg-amber-600 dark:bg-amber-400/20 dark:*:bg-amber-400'\n aria-label='Task progress'\n />\n </div>\n </Alert>\n )\n}\n\nexport default AlertTaskDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-09.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,21 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-10",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert",
|
||||
"button",
|
||||
"progress"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-10.tsx",
|
||||
"content": "'use client'\n\nimport { useState } from 'react'\n\nimport { CircleAlert, XIcon } from 'lucide-react'\n\nimport { Alert, AlertDescription, AlertTitle } from '@/registry/new-york/ui/alert'\n\nconst AlertGradientDemo = () => {\n const [isActive, setIsActive] = useState(true)\n\n if (!isActive) return null\n\n return (\n <Alert className='border-accent-foreground/20 from-accent text-accent-foreground flex justify-between bg-gradient-to-b to-transparent to-60%'>\n <CircleAlert />\n <div className='flex flex-1 flex-col gap-1'>\n <AlertTitle>Verify your email to activate your account</AlertTitle>\n <AlertDescription className='text-accent-foreground/60'>\n We've sent a confirmation link to your inbox. Check your email to complete the sign-up.\n </AlertDescription>\n </div>\n <button className='cursor-pointer' onClick={() => setIsActive(false)}>\n <XIcon className='size-5' />\n <span className='sr-only'>Close</span>\n </button>\n </Alert>\n )\n}\n\nexport default AlertGradientDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-10.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-11",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-11.tsx",
|
||||
"content": "import { UserCheck } from 'lucide-react'\n\nimport { Alert, AlertTitle } from '@/registry/new-york/ui/alert'\n\nconst AlertIndicatorSuccessDemo = () => {\n return (\n <Alert className='rounded-md border-l-6 border-green-600 bg-green-600/10 text-green-600 dark:border-green-400 dark:bg-green-400/10 dark:text-green-400'>\n <UserCheck />\n <AlertTitle>Your request to join the team is approved.</AlertTitle>\n </Alert>\n )\n}\n\nexport default AlertIndicatorSuccessDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-11.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-12",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-12.tsx",
|
||||
"content": "import { UserRoundX } from 'lucide-react'\n\nimport { Alert, AlertTitle } from '@/registry/new-york/ui/alert'\n\nconst AlertIndicatorDestructiveDemo = () => {\n return (\n <Alert className='border-destructive bg-destructive/10 text-destructive rounded-none border-0 border-l-6'>\n <UserRoundX />\n <AlertTitle>Your request to join the team is denied.</AlertTitle>\n </Alert>\n )\n}\n\nexport default AlertIndicatorDestructiveDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-12.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-13",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert",
|
||||
"button"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-13.tsx",
|
||||
"content": "import { CircleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle } from '@/registry/new-york/ui/alert'\nimport { Button } from '@/registry/new-york/ui/button'\n\nconst AlertWithActionDemo = () => {\n return (\n <Alert className='flex items-center justify-between [&>svg]:translate-y-0'>\n <CircleAlert />\n <AlertTitle className='flex-1'>New message!</AlertTitle>\n <Button variant='outline' className='h-7 cursor-pointer rounded-md px-2'>\n Open\n </Button>\n </Alert>\n )\n}\n\nexport default AlertWithActionDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-13.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-14",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-14.tsx",
|
||||
"content": "import { TriangleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle } from '@/registry/new-york/ui/alert'\n\nconst AlertDestructiveDemo = () => {\n return (\n <Alert variant='destructive'>\n <TriangleAlert />\n <AlertTitle>Something went wrong!</AlertTitle>\n </Alert>\n )\n}\n\nexport default AlertDestructiveDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-14.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-15",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-15.tsx",
|
||||
"content": "import { TriangleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle } from '@/registry/new-york/ui/alert'\n\nconst AlertPureDestructiveDemo = () => {\n return (\n <Alert variant='destructive' className='border-destructive'>\n <TriangleAlert />\n <AlertTitle>Unable to process your payment.</AlertTitle>\n </Alert>\n )\n}\n\nexport default AlertPureDestructiveDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-15.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-16",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-16.tsx",
|
||||
"content": "import { Alert, AlertTitle } from '@/registry/new-york/ui/alert'\n\nconst AlertWithoutIconDemo = () => {\n return (\n <Alert>\n <AlertTitle>New message!</AlertTitle>\n </Alert>\n )\n}\n\nexport default AlertWithoutIconDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-16.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-17",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-17.tsx",
|
||||
"content": "import { CircleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertDescriptionDemo = () => {\n return (\n <Alert>\n <CircleAlert />\n <AlertTitle>Creating your account</AlertTitle>\n <AlertDescription>Fill in your details to get started.</AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertDescriptionDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-17.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-18",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-18.tsx",
|
||||
"content": "import { CircleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertOutlineInfoDemo = () => {\n return (\n <Alert className='border-sky-600 text-sky-600 dark:border-sky-400 dark:text-sky-400'>\n <CircleAlert />\n <AlertTitle>Verify your email to activate your account</AlertTitle>\n <AlertDescription className='text-sky-600/80 dark:text-sky-400/80'>\n We've sent a confirmation link to your inbox. Check your email to complete the sign-up.\n </AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertOutlineInfoDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-18.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-19",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-19.tsx",
|
||||
"content": "import { CheckCheck } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertOutlineSuccessDemo = () => {\n return (\n <Alert className='border-green-600 text-green-600 dark:border-green-400 dark:text-green-400'>\n <CheckCheck />\n <AlertTitle>Account created successfully</AlertTitle>\n <AlertDescription className='text-green-600/80 dark:text-green-400/80'>\n You are all set! You can now log in and start exploring your dashboard.\n </AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertOutlineSuccessDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-19.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-20",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-20.tsx",
|
||||
"content": "import { CircleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertOutlineWarningDemo = () => {\n return (\n <Alert className='border-amber-600 text-amber-600 dark:border-amber-400 dark:text-amber-400'>\n <CircleAlert />\n <AlertTitle>Your password is too weak</AlertTitle>\n <AlertDescription className='text-amber-600/80 dark:text-amber-400/80'>\n Try using a mix of uppercase letters, numbers, and symbols for better security.\n </AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertOutlineWarningDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-20.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-21",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-21.tsx",
|
||||
"content": "import { CircleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertSoftDemo = () => {\n return (\n <Alert className='bg-primary/10 border-none'>\n <CircleAlert />\n <AlertTitle>File Should be PDF,DOCX,JPG, or PNG.</AlertTitle>\n <AlertDescription>If the file type is not one of this than we can't get your files</AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertSoftDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-21.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-22",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-22.tsx",
|
||||
"content": "import { CircleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertSoftInfoDemo = () => {\n return (\n <Alert className='border-none bg-sky-600/10 text-sky-600 dark:bg-sky-400/10 dark:text-sky-400'>\n <CircleAlert />\n <AlertTitle>Only certain file types are allowed</AlertTitle>\n <AlertDescription className='text-sky-600/80 dark:text-sky-400/80'>\n You can upload PDF, DOCX, JPG, or PNG files up to 20MB.\n </AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertSoftInfoDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-22.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-23",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-23.tsx",
|
||||
"content": "import { CheckCheck } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertSoftSuccessDemo = () => {\n return (\n <Alert className='border-none bg-green-600/10 text-green-600 dark:bg-green-400/10 dark:text-green-400'>\n <CheckCheck />\n <AlertTitle>File uploaded successfully</AlertTitle>\n <AlertDescription className='text-green-600/80 dark:text-green-400/80'>\n Your document has been saved and is now available in your files.\n </AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertSoftSuccessDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-23.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-24",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-24.tsx",
|
||||
"content": "import { CircleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertSoftWarningDemo = () => {\n return (\n <Alert className='border-none bg-amber-600/10 text-amber-600 dark:bg-amber-400/10 dark:text-amber-400'>\n <CircleAlert />\n <AlertTitle>This file might be too large</AlertTitle>\n <AlertDescription className='text-amber-600/80 dark:text-amber-400/80'>\n Uploading large files may take longer or fail. Consider compressing it first.\n </AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertSoftWarningDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-24.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-25",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-25.tsx",
|
||||
"content": "import { TriangleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertSoftDestructiveDemo = () => {\n return (\n <Alert className='bg-destructive/10 text-destructive border-none'>\n <TriangleAlert />\n <AlertTitle>Upload failed</AlertTitle>\n <AlertDescription className='text-destructive/80'>\n Something went wrong. Please try again or use a different file format.\n </AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertSoftDestructiveDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-25.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-26",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-26.tsx",
|
||||
"content": "import { CircleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertSolidDemo = () => {\n return (\n <Alert className='bg-primary text-primary-foreground border-none'>\n <CircleAlert />\n <AlertTitle>Editing your profile</AlertTitle>\n <AlertDescription className='text-primary-foreground/80'>\n Changes won't be saved until you click “Update.”\n </AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertSolidDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-26.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-27",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-27.tsx",
|
||||
"content": "import { CheckCheck } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertSolidSuccessDemo = () => {\n return (\n <Alert className='border-none bg-green-600 text-white dark:bg-green-400'>\n <CheckCheck />\n <AlertTitle>Profile updated</AlertTitle>\n <AlertDescription className='text-white/80'>Your changes have been saved successfully.</AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertSolidSuccessDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-27.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-28",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-28.tsx",
|
||||
"content": "import { CircleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertSolidWarningDemo = () => {\n return (\n <Alert className='border-none bg-amber-600 text-white dark:bg-amber-400'>\n <CircleAlert />\n <AlertTitle>Some details are missing</AlertTitle>\n <AlertDescription className='text-white/80'>Complete your profile to get the best experience.</AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertSolidWarningDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-28.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-29",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-29.tsx",
|
||||
"content": "import { CircleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertSolidInfoDemo = () => {\n return (\n <Alert className='border-none bg-sky-600 text-white dark:bg-sky-400'>\n <CircleAlert />\n <AlertTitle>Your profile is visible</AlertTitle>\n <AlertDescription className='text-white/80'>Anyone can view your basic information.</AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertSolidInfoDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-29.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "alert-30",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"alert"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/alert/alert-30.tsx",
|
||||
"content": "import { TriangleAlert } from 'lucide-react'\n\nimport { Alert, AlertTitle, AlertDescription } from '@/registry/new-york/ui/alert'\n\nconst AlertSolidDestructiveDemo = () => {\n return (\n <Alert className='bg-destructive dark:bg-destructive/60 border-none text-white'>\n <TriangleAlert />\n <AlertTitle>Couldn't save changes</AlertTitle>\n <AlertDescription className='text-white/80'>Please try again or reload the page.</AlertDescription>\n </Alert>\n )\n}\n\nexport default AlertSolidDestructiveDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/alert/alert-30.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-01",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-01.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst AvatarDemo = () => {\n return (\n <Avatar>\n <AvatarImage src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png' alt='Hallie Richards' />\n <AvatarFallback className='text-xs'>HR</AvatarFallback>\n </Avatar>\n )\n}\n\nexport default AvatarDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-01.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-02",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-02.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst AvatarRingDemo = () => {\n return (\n <Avatar className='ring-ring ring-2'>\n <AvatarImage src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png' alt='Hallie Richards' />\n <AvatarFallback className='text-xs'>HR</AvatarFallback>\n </Avatar>\n )\n}\n\nexport default AvatarRingDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-02.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-03",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-03.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst AvatarRoundedDemo = () => {\n return (\n <Avatar className='rounded-sm'>\n <AvatarImage\n src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png'\n alt='Hallie Richards'\n className='rounded-sm'\n />\n <AvatarFallback className='text-xs'>HR</AvatarFallback>\n </Avatar>\n )\n}\n\nexport default AvatarRoundedDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-03.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-04",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-04.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst AvatarSizeDemo = () => {\n return (\n <Avatar className='size-12'>\n <AvatarImage src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png' alt='Hallie Richards' />\n <AvatarFallback className='text-xs'>HR</AvatarFallback>\n </Avatar>\n )\n}\n\nexport default AvatarSizeDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-04.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-05",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-05.tsx",
|
||||
"content": "import { Avatar, AvatarFallback } from '@/registry/new-york/ui/avatar'\n\nconst AvatarFallbackDemo = () => {\n return (\n <Avatar>\n <AvatarFallback className='text-xs'>HR</AvatarFallback>\n </Avatar>\n )\n}\n\nexport default AvatarFallbackDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-05.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-06",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-06.tsx",
|
||||
"content": "import { HomeIcon } from 'lucide-react'\n\nimport { Avatar, AvatarFallback } from '@/registry/new-york/ui/avatar'\n\nconst AvatarIconDemo = () => {\n return (\n <Avatar>\n <AvatarFallback className='bg-indigo-500/10 text-indigo-500'>\n <HomeIcon className='size-4' />\n </AvatarFallback>\n </Avatar>\n )\n}\n\nexport default AvatarIconDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-06.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-07",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-07.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst AvatarStatusBusyDemo = () => {\n return (\n <div className='relative w-fit'>\n <Avatar>\n <AvatarImage src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png' alt='Hallie Richards' />\n <AvatarFallback className='text-xs'>HR</AvatarFallback>\n </Avatar>\n <span className='border-background bg-destructive absolute -end-0.5 -bottom-0.5 size-3 rounded-full border-2'>\n <span className='sr-only'>Busy</span>\n </span>\n </div>\n )\n}\n\nexport default AvatarStatusBusyDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-07.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-08",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-08.tsx",
|
||||
"content": "import { CheckIcon } from 'lucide-react'\n\nimport { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst AvatarStatusRingDemo = () => {\n return (\n <div className='relative w-fit'>\n <Avatar className='ring-offset-background ring-2 ring-green-600 ring-offset-2 dark:ring-green-400'>\n <AvatarImage src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png' alt='Hallie Richards' />\n <AvatarFallback className='text-xs'>HR</AvatarFallback>\n </Avatar>\n <span className='absolute -end-1.5 -bottom-1.5 inline-flex size-4 items-center justify-center rounded-full bg-green-600 dark:bg-green-400'>\n <CheckIcon className='size-3 text-white' />\n </span>\n </div>\n )\n}\n\nexport default AvatarStatusRingDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-08.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-09",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-09.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst AvatarStatusAwayDemo = () => {\n return (\n <div className='relative w-fit'>\n <Avatar className='rounded-sm'>\n <AvatarImage\n src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png'\n alt='Hallie Richards'\n className='rounded-sm'\n />\n <AvatarFallback className='text-xs'>HR</AvatarFallback>\n </Avatar>\n <span className='border-background absolute -end-1.5 -top-1.5 size-3 rounded-full border-2 bg-amber-600 dark:bg-amber-400'>\n <span className='sr-only'>Away</span>\n </span>\n </div>\n )\n}\n\nexport default AvatarStatusAwayDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-09.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-10",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-10.tsx",
|
||||
"content": "import { PlusCircleIcon } from 'lucide-react'\n\nimport { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst AvatarPlusDemo = () => {\n return (\n <div className='relative w-fit'>\n <Avatar className='size-10'>\n <AvatarImage src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png' alt='Hallie Richards' />\n <AvatarFallback className='text-xs'>HR</AvatarFallback>\n </Avatar>\n <button className='focus-visible:ring-ring/50 absolute -end-1 -bottom-1 inline-flex cursor-pointer items-center justify-center rounded-full focus-visible:ring-[3px] focus-visible:outline-none'>\n <PlusCircleIcon className='text-background size-5 fill-slate-400' />\n <span className='sr-only'>Add</span>\n </button>\n </div>\n )\n}\n\nexport default AvatarPlusDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-10.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-11",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar",
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-11.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\nimport { Badge } from '@/registry/new-york/ui/badge'\n\nconst AvatarNotificationBadgeDemo = () => {\n return (\n <div className='relative w-fit'>\n <Avatar className='size-10 rounded-sm'>\n <AvatarImage\n src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png'\n alt='Hallie Richards'\n className='rounded-sm'\n />\n <AvatarFallback className='text-xs'>HR</AvatarFallback>\n </Avatar>\n <Badge className='absolute -end-2.5 -top-2.5 h-5 min-w-5 rounded-full bg-indigo-500 px-1 tabular-nums'>8</Badge>\n </div>\n )\n}\n\nexport default AvatarNotificationBadgeDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-11.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-12",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-12.tsx",
|
||||
"content": "import { BadgeCheckIcon } from 'lucide-react'\n\nimport { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst AvatarVerifiedDemo = () => {\n return (\n <div className='relative w-fit'>\n <Avatar className='size-10'>\n <AvatarImage src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png' alt='Hallie Richards' />\n <AvatarFallback className='text-xs'>HR</AvatarFallback>\n </Avatar>\n <span className='absolute -end-1.5 -top-1.5'>\n <span className='sr-only'>Verified</span>\n <BadgeCheckIcon className='text-background size-5 fill-sky-500' />\n </span>\n </div>\n )\n}\n\nexport default AvatarVerifiedDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-12.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-13",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-13.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst avatars = [\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-3.png',\n fallback: 'OS',\n name: 'Olivia Sparks'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-6.png',\n fallback: 'HL',\n name: 'Howard Lloyd'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png',\n fallback: 'HR',\n name: 'Hallie Richards'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-16.png',\n fallback: 'JW',\n name: 'Jenny Wilson'\n }\n]\n\nconst AvatarGroupDemo = () => {\n return (\n <div className='flex -space-x-2'>\n {avatars.map((avatar, index) => (\n <Avatar key={index} className='ring-background ring-2'>\n <AvatarImage src={avatar.src} alt={avatar.name} />\n <AvatarFallback className='text-xs'>{avatar.fallback}</AvatarFallback>\n </Avatar>\n ))}\n </div>\n )\n}\n\nexport default AvatarGroupDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-13.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-14",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-14.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst avatars = [\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-3.png',\n fallback: 'OS',\n name: 'Olivia Sparks'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-6.png',\n fallback: 'HL',\n name: 'Howard Lloyd'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png',\n fallback: 'HR',\n name: 'Hallie Richards'\n }\n]\n\nconst AvatarGroupMaxDemo = () => {\n return (\n <div className='flex -space-x-2'>\n {avatars.map((avatar, index) => (\n <Avatar key={index} className='ring-background ring-2'>\n <AvatarImage src={avatar.src} alt={avatar.name} />\n <AvatarFallback className='text-xs'>{avatar.fallback}</AvatarFallback>\n </Avatar>\n ))}\n <Avatar className='ring-background ring-2'>\n <AvatarFallback className='text-xs'>+9</AvatarFallback>\n </Avatar>\n </div>\n )\n}\n\nexport default AvatarGroupMaxDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-14.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-15",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-15.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst avatars = [\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-3.png',\n fallback: 'OS',\n name: 'Olivia Sparks'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-6.png',\n fallback: 'HL',\n name: 'Howard Lloyd'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png',\n fallback: 'HR',\n name: 'Hallie Richards'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-16.png',\n fallback: 'JW',\n name: 'Jenny Wilson'\n }\n]\n\nconst AvatarGroupSizeDemo = () => {\n return (\n <div className='flex -space-x-2'>\n {avatars.map((avatar, index) => (\n <Avatar key={index} className='ring-background size-12 ring-2'>\n <AvatarImage src={avatar.src} alt={avatar.name} />\n <AvatarFallback>{avatar.fallback}</AvatarFallback>\n </Avatar>\n ))}\n </div>\n )\n}\n\nexport default AvatarGroupSizeDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-15.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-16",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar",
|
||||
"tooltip"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-16.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/registry/new-york/ui/tooltip'\n\nconst avatars = [\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-3.png',\n fallback: 'OS',\n name: 'Olivia Sparks'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-6.png',\n fallback: 'HL',\n name: 'Howard Lloyd'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png',\n fallback: 'HR',\n name: 'Hallie Richards'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-16.png',\n fallback: 'JW',\n name: 'Jenny Wilson'\n }\n]\n\nconst AvatarGroupTooltipDemo = () => {\n return (\n <div className='flex -space-x-2'>\n {avatars.map((avatar, index) => (\n <TooltipProvider delayDuration={0} key={index}>\n <Tooltip>\n <TooltipTrigger asChild>\n <Avatar className='ring-background ring-2 transition-all duration-300 ease-in-out hover:z-1 hover:-translate-y-1 hover:shadow-md'>\n <AvatarImage src={avatar.src} alt={avatar.name} />\n <AvatarFallback className='text-xs'>{avatar.fallback}</AvatarFallback>\n </Avatar>\n </TooltipTrigger>\n <TooltipContent>{avatar.name}</TooltipContent>\n </Tooltip>\n </TooltipProvider>\n ))}\n </div>\n )\n}\n\nexport default AvatarGroupTooltipDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-16.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-17",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-17.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst avatars = [\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-3.png',\n fallback: 'OS',\n name: 'Olivia Sparks'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-6.png',\n fallback: 'HL',\n name: 'Howard Lloyd'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png',\n fallback: 'HR',\n name: 'Hallie Richards'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-16.png',\n fallback: 'JW',\n name: 'Jenny Wilson'\n }\n]\n\nconst AvatarGroupTransitionDemo = () => {\n return (\n <div className='flex -space-x-2 hover:space-x-1'>\n {avatars.map((avatar, index) => (\n <Avatar key={index} className='ring-background ring-2 transition-all duration-300 ease-in-out'>\n <AvatarImage src={avatar.src} alt={avatar.name} />\n <AvatarFallback className='text-xs'>{avatar.fallback}</AvatarFallback>\n </Avatar>\n ))}\n </div>\n )\n}\n\nexport default AvatarGroupTransitionDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-17.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-18",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar",
|
||||
"tooltip"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-18.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/registry/new-york/ui/tooltip'\n\nconst avatars = [\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-3.png',\n fallback: 'OS',\n name: 'Olivia Sparks'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-6.png',\n fallback: 'HL',\n name: 'Howard Lloyd'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png',\n fallback: 'HR',\n name: 'Hallie Richards'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-16.png',\n fallback: 'JW',\n name: 'Jenny Wilson'\n }\n]\n\nconst AvatarGroupTooltipTransitionDemo = () => {\n return (\n <div className='flex -space-x-2 hover:space-x-1'>\n {avatars.map((avatar, index) => (\n <TooltipProvider delayDuration={0} key={index}>\n <Tooltip>\n <TooltipTrigger asChild>\n <Avatar className='ring-background ring-2 transition-all duration-300 ease-in-out'>\n <AvatarImage src={avatar.src} alt={avatar.name} />\n <AvatarFallback className='text-xs'>{avatar.fallback}</AvatarFallback>\n </Avatar>\n </TooltipTrigger>\n <TooltipContent>{avatar.name}</TooltipContent>\n </Tooltip>\n </TooltipProvider>\n ))}\n </div>\n )\n}\n\nexport default AvatarGroupTooltipTransitionDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-18.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-19",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"avatar",
|
||||
"dropdown-menu"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-19.tsx",
|
||||
"content": "import { PlusIcon } from 'lucide-react'\n\nimport { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuTrigger\n} from '@/registry/new-york/ui/dropdown-menu'\n\nconst avatars = [\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-3.png',\n fallback: 'OS',\n name: 'Olivia Sparks'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-6.png',\n fallback: 'HL',\n name: 'Howard Lloyd'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png',\n fallback: 'HR',\n name: 'Hallie Richards'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-16.png',\n fallback: 'JW',\n name: 'Jenny Wilson'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-1.png',\n fallback: 'DR',\n name: 'Darlene Robertson'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-2.png',\n fallback: 'LA',\n name: 'Leslie Alexander'\n }\n]\n\nconst AvatarGroupDropdownDemo = () => {\n return (\n <div className='flex -space-x-2'>\n {avatars.slice(0, 3).map((avatar, index) => (\n <Avatar key={index} className='ring-background ring-2'>\n <AvatarImage src={avatar.src} alt={avatar.name} />\n <AvatarFallback className='text-xs'>{avatar.fallback}</AvatarFallback>\n </Avatar>\n ))}\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <button className='bg-muted has-focus-visible:ring-ring/50 ring-background flex size-8 shrink-0 cursor-pointer items-center justify-center rounded-full ring-2'>\n <PlusIcon className='size-4' />\n <span className='sr-only'>Add</span>\n </button>\n </DropdownMenuTrigger>\n <DropdownMenuContent>\n {avatars.slice(3).map((avatar, index) => (\n <DropdownMenuItem key={index}>\n <Avatar>\n <AvatarImage src={avatar.src} alt={avatar.name} />\n <AvatarFallback className='text-xs'>{avatar.fallback}</AvatarFallback>\n </Avatar>\n <span>{avatar.name}</span>\n </DropdownMenuItem>\n ))}\n </DropdownMenuContent>\n </DropdownMenu>\n </div>\n )\n}\n\nexport default AvatarGroupDropdownDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-19.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-20",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-20.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst avatars = [\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-3.png',\n fallback: 'OS',\n name: 'Olivia Sparks'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-6.png',\n fallback: 'HL',\n name: 'Howard Lloyd'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png',\n fallback: 'HR',\n name: 'Hallie Richards'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-16.png',\n fallback: 'JW',\n name: 'Jenny Wilson'\n }\n]\n\nconst AvatarGroupOutlineDemo = () => {\n return (\n <div className='bg-background flex items-center rounded-full border p-1 shadow-sm'>\n <div className='flex -space-x-2'>\n {avatars.map((avatar, index) => (\n <Avatar key={index} className='ring-background ring-2'>\n <AvatarImage src={avatar.src} alt={avatar.name} />\n <AvatarFallback className='text-xs'>{avatar.fallback}</AvatarFallback>\n </Avatar>\n ))}\n </div>\n <span className='text-muted-foreground hover:text-foreground flex items-center justify-center rounded-full bg-transparent px-2 text-xs shadow-none hover:bg-transparent'>\n +3\n </span>\n </div>\n )\n}\n\nexport default AvatarGroupOutlineDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-20.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "avatar-21",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/avatar/avatar-21.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst avatars = [\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-3.png',\n fallback: 'OS',\n name: 'Olivia Sparks'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-6.png',\n fallback: 'HL',\n name: 'Howard Lloyd'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png',\n fallback: 'HR',\n name: 'Hallie Richards'\n },\n {\n src: 'https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-16.png',\n fallback: 'JW',\n name: 'Jenny Wilson'\n }\n]\n\nconst AvatarGroupPopularityIndicatorDemo = () => {\n return (\n <div className='bg-background flex flex-wrap items-center justify-center rounded-full border p-1 shadow-sm'>\n <div className='flex -space-x-1'>\n {avatars.map((avatar, index) => (\n <Avatar key={index} className='ring-background size-6 ring-2'>\n <AvatarImage src={avatar.src} alt={avatar.name} />\n <AvatarFallback className='text-xs'>{avatar.fallback}</AvatarFallback>\n </Avatar>\n ))}\n </div>\n <p className='text-muted-foreground px-2 text-xs'>\n Loved by <strong className='text-foreground font-medium'>10K+</strong> developers.\n </p>\n </div>\n )\n}\n\nexport default AvatarGroupPopularityIndicatorDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/avatar/avatar-21.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-01",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-01.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeDemo = () => {\n return <Badge>Default</Badge>\n}\n\nexport default BadgeDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-01.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-02",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-02.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeSecondaryDemo = () => {\n return <Badge variant='secondary'>Secondary</Badge>\n}\n\nexport default BadgeSecondaryDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-02.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-03",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-03.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeDestructiveDemo = () => {\n return <Badge variant='destructive'>Destructive</Badge>\n}\n\nexport default BadgeDestructiveDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-03.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-04",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-04.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeOutlineDemo = () => {\n return <Badge variant='outline'>Outline</Badge>\n}\n\nexport default BadgeOutlineDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-04.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-05",
|
||||
"type": "registry:component",
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-05.tsx",
|
||||
"content": "const BadgeDotDemo = () => {\n return (\n <span className='inline-flex w-fit shrink-0 items-center justify-center gap-1 px-2 py-0.5 text-xs font-medium whitespace-nowrap'>\n <span className='bg-primary size-2 rounded-full' aria-hidden='true' />\n Dot Badge\n </span>\n )\n}\n\nexport default BadgeDotDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-05.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-06",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-06.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeRoundedDemo = () => {\n return <Badge className='rounded-full'>Rounded</Badge>\n}\n\nexport default BadgeRoundedDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-06.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-07",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-07.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeNumberDemo = () => {\n return <Badge className='h-5 min-w-5 rounded-full px-1 tabular-nums'>8</Badge>\n}\n\nexport default BadgeNumberDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-07.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-08",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-08.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeLargeDemo = () => {\n return <Badge className='px-3 py-1'>Large</Badge>\n}\n\nexport default BadgeLargeDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-08.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-09",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-09.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeSmallDemo = () => {\n return <Badge className='px-1.5 py-px'>Small</Badge>\n}\n\nexport default BadgeSmallDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-09.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-10",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-10.tsx",
|
||||
"content": "import { StarIcon } from 'lucide-react'\n\nimport { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeWithIconDemo = () => {\n return (\n <Badge>\n <StarIcon className='size-3' />\n With Icon\n </Badge>\n )\n}\n\nexport default BadgeWithIconDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-10.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-11",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-11.tsx",
|
||||
"content": "import { ArrowRightIcon } from 'lucide-react'\n\nimport { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeLinkDemo = () => {\n return (\n <Badge asChild>\n <a href='#' className='focus-visible:ring-ring/50 focus-visible:ring-2 focus-visible:outline-0'>\n Link <ArrowRightIcon className='size-3' />\n </a>\n </Badge>\n )\n}\n\nexport default BadgeLinkDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-11.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-12",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-12.tsx",
|
||||
"content": "'use client'\n\nimport { useState } from 'react'\n\nimport { XIcon } from 'lucide-react'\n\nimport { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeClosableDemo = () => {\n const [isActive, setIsActive] = useState(true)\n\n if (!isActive) return null\n\n return (\n <Badge>\n Closable\n <button\n className='focus-visible:border-ring focus-visible:ring-ring/50 text-primary-foreground/60 hover:text-primary-foreground -my-px -ms-px -me-1.5 inline-flex size-4 shrink-0 cursor-pointer items-center justify-center rounded-[inherit] p-0 transition-[color,box-shadow] outline-none focus-visible:ring-[3px]'\n aria-label='Close'\n onClick={() => setIsActive(false)}\n >\n <XIcon className='size-3' aria-hidden='true' />\n </button>\n </Badge>\n )\n}\n\nexport default BadgeClosableDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-12.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-13",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"badge",
|
||||
"checkbox"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-13.tsx",
|
||||
"content": "'use client'\n\nimport { useState, useId } from 'react'\n\nimport { CheckCircleIcon } from 'lucide-react'\n\nimport { Badge } from '@/registry/new-york/ui/badge'\nimport { Checkbox } from '@/registry/new-york/ui/checkbox'\n\nconst BadgeSelectableDemo = () => {\n const [selected, setSelected] = useState(false)\n\n const id = useId()\n\n return (\n <Badge\n variant={selected ? 'secondary' : 'outline'}\n className='has-focus-visible:border-ring/50 has-focus-visible:ring-ring/50 relative cursor-pointer outline-none has-focus-visible:ring-2'\n >\n <Checkbox\n id={id}\n className='peer sr-only after:absolute after:inset-0'\n checked={selected}\n onCheckedChange={checked => setSelected(!!checked)}\n />\n <CheckCircleIcon\n className='hidden size-3 text-green-600 peer-data-[state=checked]:block dark:text-green-400'\n aria-hidden='true'\n />\n <label htmlFor={id} className='cursor-pointer select-none after:absolute after:inset-0'>\n {selected ? 'Selected' : 'Selectable'}\n </label>\n </Badge>\n )\n}\n\nexport default BadgeSelectableDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-13.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-14",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-14.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeGradientDemo = () => {\n return (\n <Badge className='border-transparent bg-gradient-to-r from-indigo-500 to-pink-500 [background-size:105%] bg-center text-white'>\n Gradient\n </Badge>\n )\n}\n\nexport default BadgeGradientDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-14.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-15",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-15.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeGradientOutlineDemo = () => {\n return (\n <div className='flex items-center justify-center rounded-full bg-gradient-to-r from-indigo-500 to-pink-500 p-0.5'>\n <Badge className='bg-background hover:bg-background text-foreground rounded-full border-none'>\n Gradient Outline\n </Badge>\n </div>\n )\n}\n\nexport default BadgeGradientOutlineDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-15.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-16",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-16.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeInProgressDemo = () => {\n return (\n <Badge className='rounded-full border-none bg-amber-600/10 text-amber-600 focus-visible:ring-amber-600/20 focus-visible:outline-none dark:bg-amber-400/10 dark:text-amber-400 dark:focus-visible:ring-amber-400/40 [a&]:hover:bg-amber-600/5 dark:[a&]:hover:bg-amber-400/5'>\n <span className='size-1.5 rounded-full bg-amber-600 dark:bg-amber-400' aria-hidden='true' />\n In Progress\n </Badge>\n )\n}\n\nexport default BadgeInProgressDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-16.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-17",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-17.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeBlockedDemo = () => {\n return (\n <Badge className='bg-destructive/10 [a&]:hover:bg-destructive/5 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 text-destructive rounded-full border-none focus-visible:outline-none'>\n <span className='bg-destructive size-1.5 rounded-full' aria-hidden='true' />\n Blocked\n </Badge>\n )\n}\n\nexport default BadgeBlockedDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-17.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-18",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-18.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeCompletedDemo = () => {\n return (\n <Badge className='rounded-full border-none bg-green-600/10 text-green-600 focus-visible:ring-green-600/20 focus-visible:outline-none dark:bg-green-400/10 dark:text-green-400 dark:focus-visible:ring-green-400/40 [a&]:hover:bg-green-600/5 dark:[a&]:hover:bg-green-400/5'>\n <span className='size-1.5 rounded-full bg-green-600 dark:bg-green-400' aria-hidden='true' />\n Completed\n </Badge>\n )\n}\n\nexport default BadgeCompletedDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-18.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-19",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-19.tsx",
|
||||
"content": "import { AlertCircleIcon } from 'lucide-react'\n\nimport { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgePendingDemo = () => {\n return (\n <Badge\n variant='outline'\n className='border-amber-600 text-amber-600 dark:border-amber-400 dark:text-amber-400 [a&]:hover:bg-amber-600/10 [a&]:hover:text-amber-600/90 dark:[a&]:hover:bg-amber-400/10 dark:[a&]:hover:text-amber-400/90'\n >\n <AlertCircleIcon className='size-3' />\n Pending\n </Badge>\n )\n}\n\nexport default BadgePendingDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-19.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-20",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-20.tsx",
|
||||
"content": "import { BanIcon } from 'lucide-react'\n\nimport { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeFailedDemo = () => {\n return (\n <Badge\n variant='outline'\n className='text-destructive [a&]:hover:bg-destructive/10 [a&]:hover:text-destructive/90 border-destructive'\n >\n <BanIcon className='size-3' />\n Failed\n </Badge>\n )\n}\n\nexport default BadgeFailedDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-20.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-21",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-21.tsx",
|
||||
"content": "import { CheckCircleIcon } from 'lucide-react'\n\nimport { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeSuccessfulDemo = () => {\n return (\n <Badge\n variant='outline'\n className='border-green-600 text-green-600 dark:border-green-400 dark:text-green-400 [a&]:hover:bg-green-600/10 [a&]:hover:text-green-600/90 dark:[a&]:hover:bg-green-400/10 dark:[a&]:hover:text-green-400/90'\n >\n <CheckCircleIcon className='size-3' />\n Successful\n </Badge>\n )\n}\n\nexport default BadgeSuccessfulDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-21.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-22",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-22.tsx",
|
||||
"content": "import { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeAvatarDemo = () => {\n return (\n <Badge variant='outline' className='rounded-full p-1 pe-2'>\n <img\n src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png'\n alt='Hallie Richards'\n className='size-6 rounded-full'\n />\n Avatar\n </Badge>\n )\n}\n\nexport default BadgeAvatarDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-22.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-23",
|
||||
"type": "registry:component",
|
||||
"dependencies": [
|
||||
"lucide-react"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"avatar",
|
||||
"badge"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-23.tsx",
|
||||
"content": "import { ShoppingCartIcon } from 'lucide-react'\n\nimport { Avatar, AvatarFallback } from '@/registry/new-york/ui/avatar'\nimport { Badge } from '@/registry/new-york/ui/badge'\n\nconst BadgeCartDemo = () => {\n return (\n <div className='relative w-fit'>\n <Avatar className='size-9 rounded-sm'>\n <AvatarFallback className='rounded-sm'>\n <ShoppingCartIcon className='size-5' />\n </AvatarFallback>\n </Avatar>\n <Badge className='absolute -end-2.5 -top-2.5 h-5 min-w-5 rounded-full px-1 tabular-nums'>8</Badge>\n </div>\n )\n}\n\nexport default BadgeCartDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-23.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "badge-24",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"avatar"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/badge/badge-24.tsx",
|
||||
"content": "import { Avatar, AvatarFallback, AvatarImage } from '@/registry/new-york/ui/avatar'\n\nconst BadgeStatusOnlineDemo = () => {\n return (\n <div className='relative w-fit'>\n <Avatar className='size-10'>\n <AvatarImage src='https://cdn.shadcnstudio.com/ss-assets/avatar/avatar-5.png' alt='Hallie Richards' />\n <AvatarFallback>HR</AvatarFallback>\n </Avatar>\n <span className='border-background absolute -end-0.5 -bottom-0.5 size-3 rounded-full border-2 bg-green-600 dark:bg-green-400'>\n <span className='sr-only'>Online</span>\n </span>\n </div>\n )\n}\n\nexport default BadgeStatusOnlineDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/badge/badge-24.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "bounce-button",
|
||||
"type": "registry:ui",
|
||||
"dependencies": [
|
||||
"class-variance-authority",
|
||||
"motion"
|
||||
],
|
||||
"registryDependencies": [
|
||||
"button",
|
||||
"utils"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/ui/bounce-button.tsx",
|
||||
"content": "'use client'\n\nimport * as React from 'react'\n\nimport { motion, type HTMLMotionProps } from 'motion/react'\nimport type { VariantProps } from 'class-variance-authority'\n\nimport { cn } from '@/registry/new-york/lib/utils'\nimport { buttonVariants } from '@/registry/new-york/ui/button'\n\ninterface BounceButtonProps extends HTMLMotionProps<'button'>, VariantProps<typeof buttonVariants> {\n children: React.ReactNode\n}\n\nfunction BounceButton({ children, className, size, variant, ...props }: BounceButtonProps) {\n return (\n <motion.button\n whileHover={{ scale: 1.1 }}\n className={cn(buttonVariants({ variant, size }), 'transition-none', className)}\n transition={{ type: 'spring', stiffness: 400, damping: 10 }}\n {...props}\n >\n {children}\n </motion.button>\n )\n}\n\nexport { BounceButton, type BounceButtonProps }\n",
|
||||
"type": "registry:ui"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
{
|
||||
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
||||
"name": "breadcrumb-01",
|
||||
"type": "registry:component",
|
||||
"registryDependencies": [
|
||||
"breadcrumb"
|
||||
],
|
||||
"files": [
|
||||
{
|
||||
"path": "src/registry/new-york/components/breadcrumb/breadcrumb-01.tsx",
|
||||
"content": "import {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbList,\n BreadcrumbPage,\n BreadcrumbSeparator\n} from '@/registry/new-york/ui/breadcrumb'\n\nconst BreadcrumbDemo = () => {\n return (\n <Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem>\n <BreadcrumbLink href='#'>Home</BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator />\n <BreadcrumbItem>\n <BreadcrumbLink href='#'>Documents</BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator />\n <BreadcrumbItem>\n <BreadcrumbPage>Add Document</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n </Breadcrumb>\n )\n}\n\nexport default BreadcrumbDemo\n",
|
||||
"type": "registry:component",
|
||||
"target": "components/shadcn-studio/breadcrumb/breadcrumb-01.tsx"
|
||||
}
|
||||
]
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Reference in a new issue