@heyramzi/ui 6.1.0 → 8.0.0

package/src/showcase/demos/shadcn/alert-dialog.svelte

@@ -1,23 +0,0 @@
-<script lang="ts">
-	import * as AlertDialog from "../../../shadcn/alert-dialog/index.js";
-	import { buttonVariants } from "../../../shadcn/button/index.js";
-</script>
-
-<AlertDialog.Root>
-	<AlertDialog.Trigger class={buttonVariants({ variant: "outline" })}>
-		Show Dialog
-	</AlertDialog.Trigger>
-	<AlertDialog.Content>
-		<AlertDialog.Header>
-			<AlertDialog.Title>Are you absolutely sure?</AlertDialog.Title>
-			<AlertDialog.Description>
-				This action cannot be undone. This will permanently delete your account and remove your data
-				from our servers.
-			</AlertDialog.Description>
-		</AlertDialog.Header>
-		<AlertDialog.Footer>
-			<AlertDialog.Cancel>Cancel</AlertDialog.Cancel>
-			<AlertDialog.Action>Continue</AlertDialog.Action>
-		</AlertDialog.Footer>
-	</AlertDialog.Content>
-</AlertDialog.Root>

package/src/showcase/demos/shadcn/alert.svelte

@@ -1,30 +0,0 @@
-<script lang="ts">
-	import AlertCircleIcon from "@lucide/svelte/icons/alert-circle";
-	import CheckCircle2Icon from "@lucide/svelte/icons/check-circle-2";
-	import PopcornIcon from "@lucide/svelte/icons/popcorn";
-	import * as Alert from "../../../shadcn/alert/index.js";
-</script>
-
-<div class="grid w-full max-w-xl items-start gap-4">
-	<Alert.Root>
-		<CheckCircle2Icon />
-		<Alert.Title>Success! Your changes have been saved</Alert.Title>
-		<Alert.Description>This is an alert with icon, title and description.</Alert.Description>
-	</Alert.Root>
-	<Alert.Root>
-		<PopcornIcon />
-		<Alert.Title>This Alert has a title and an icon. No description.</Alert.Title>
-	</Alert.Root>
-	<Alert.Root variant="destructive">
-		<AlertCircleIcon />
-		<Alert.Title>Unable to process your payment.</Alert.Title>
-		<Alert.Description>
-			<p>Please verify your billing information and try again.</p>
-			<ul class="list-inside list-disc text-sm">
-				<li>Check your card details</li>
-				<li>Ensure sufficient funds</li>
-				<li>Verify billing address</li>
-			</ul>
-		</Alert.Description>
-	</Alert.Root>
-</div>

package/src/showcase/demos/shadcn/attachment.svelte

@@ -1,71 +0,0 @@
-<script lang="ts">
-	import FileCodeIcon from "@lucide/svelte/icons/file-code";
-	import XIcon from "@lucide/svelte/icons/x";
-	import * as Attachment from "../../../shadcn/attachment/index.js";
-	import { Spinner } from "../../../shadcn/spinner/index.js";
-
-	const images = [
-		{
-			name: "workspace.png",
-			meta: "PNG · 820 KB",
-			src: "https://images.unsplash.com/photo-1497366754035-f200968a6e72?w=900&auto=format&fit=crop&q=80",
-			alt: "Workspace",
-		},
-		{
-			name: "desk-reference.jpg",
-			meta: "JPG · 1.1 MB",
-			src: "https://images.unsplash.com/photo-1497215728101-856f4ea42174?w=900&auto=format&fit=crop&q=80",
-			alt: "Desk",
-		},
-		{
-			name: "office-reference.jpg",
-			meta: "JPG · 940 KB",
-			src: "https://images.unsplash.com/photo-1497366811353-6870744d04b2?w=900&auto=format&fit=crop&q=80",
-			alt: "Office",
-		},
-	];
-</script>
-
-<div class="mx-auto flex w-full max-w-sm flex-col gap-3 py-12">
-	<Attachment.Group>
-		{#each images as image (image.name)}
-			<Attachment.Root orientation="vertical">
-				<Attachment.Media variant="image">
-					<img src={image.src} alt={image.alt} />
-				</Attachment.Media>
-				<Attachment.Content>
-					<Attachment.Title>{image.name}</Attachment.Title>
-					<Attachment.Description>{image.meta}</Attachment.Description>
-				</Attachment.Content>
-			</Attachment.Root>
-		{/each}
-	</Attachment.Group>
-	<Attachment.Root state="uploading" class="w-full">
-		<Attachment.Media>
-			<Spinner />
-		</Attachment.Media>
-		<Attachment.Content>
-			<Attachment.Title>sales-dashboard.pdf</Attachment.Title>
-			<Attachment.Description>Uploading · 64%</Attachment.Description>
-		</Attachment.Content>
-		<Attachment.Actions>
-			<Attachment.Action aria-label="Cancel upload">
-				<XIcon />
-			</Attachment.Action>
-		</Attachment.Actions>
-	</Attachment.Root>
-	<Attachment.Root class="w-full">
-		<Attachment.Media>
-			<FileCodeIcon />
-		</Attachment.Media>
-		<Attachment.Content>
-			<Attachment.Title>message-renderer.tsx</Attachment.Title>
-			<Attachment.Description>TypeScript · 12 KB</Attachment.Description>
-		</Attachment.Content>
-		<Attachment.Actions>
-			<Attachment.Action aria-label="Remove message-renderer.tsx">
-				<XIcon />
-			</Attachment.Action>
-		</Attachment.Actions>
-	</Attachment.Root>
-</div>

package/src/showcase/demos/shadcn/avatar.svelte

@@ -1,30 +0,0 @@
-<script lang="ts">
-	import * as Avatar from "../../../shadcn/avatar/index.js";
-</script>
-
-<div class="flex flex-row flex-wrap items-center gap-12">
-	<Avatar.Root>
-		<Avatar.Image src="https://github.com/shadcn.png" alt="@shadcn" />
-		<Avatar.Fallback>CN</Avatar.Fallback>
-	</Avatar.Root>
-	<Avatar.Root class="rounded-lg">
-		<Avatar.Image src="https://github.com/evilrabbit.png" alt="@evilrabbit" />
-		<Avatar.Fallback>ER</Avatar.Fallback>
-	</Avatar.Root>
-	<div
-		class="flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background *:data-[slot=avatar]:grayscale"
-	>
-		<Avatar.Root>
-			<Avatar.Image src="https://github.com/shadcn.png" alt="@shadcn" />
-			<Avatar.Fallback>CN</Avatar.Fallback>
-		</Avatar.Root>
-		<Avatar.Root>
-			<Avatar.Image src="https://github.com/leerob.png" alt="@leerob" />
-			<Avatar.Fallback>LR</Avatar.Fallback>
-		</Avatar.Root>
-		<Avatar.Root>
-			<Avatar.Image src="https://github.com/evilrabbit.png" alt="@evilrabbit" />
-			<Avatar.Fallback>ER</Avatar.Fallback>
-		</Avatar.Root>
-	</div>
-</div>

package/src/showcase/demos/shadcn/badge.svelte

@@ -1,26 +0,0 @@
-<script lang="ts">
-	import BadgeCheckIcon from "@lucide/svelte/icons/badge-check";
-	import { Badge } from "../../../shadcn/badge/index.js";
-</script>
-
-<div class="flex flex-col items-center gap-2">
-	<div class="flex w-full flex-wrap gap-2">
-		<Badge>Badge</Badge>
-		<Badge variant="secondary">Secondary</Badge>
-		<Badge variant="destructive">Destructive</Badge>
-		<Badge variant="outline">Outline</Badge>
-	</div>
-	<div class="flex w-full flex-wrap gap-2">
-		<Badge variant="secondary" class="bg-blue-500 text-white dark:bg-blue-600">
-			<BadgeCheckIcon />
-			Verified
-		</Badge>
-		<Badge class="h-5 min-w-5 rounded-full px-1 font-mono tabular-nums">8</Badge>
-		<Badge class="h-5 min-w-5 rounded-full px-1 font-mono tabular-nums" variant="destructive">
-			99
-		</Badge>
-		<Badge class="h-5 min-w-5 rounded-full px-1 font-mono tabular-nums" variant="outline">
-			20+
-		</Badge>
-	</div>
-</div>

package/src/showcase/demos/shadcn/breadcrumb.svelte

@@ -1,34 +0,0 @@
-<script lang="ts">
-	import * as Breadcrumb from "../../../shadcn/breadcrumb/index.js";
-	import * as DropdownMenu from "../../../shadcn/dropdown-menu/index.js";
-</script>
-
-<Breadcrumb.Root>
-	<Breadcrumb.List>
-		<Breadcrumb.Item>
-			<Breadcrumb.Link href="/">Home</Breadcrumb.Link>
-		</Breadcrumb.Item>
-		<Breadcrumb.Separator />
-		<Breadcrumb.Item>
-			<DropdownMenu.Root>
-				<DropdownMenu.Trigger class="flex items-center gap-1">
-					<Breadcrumb.Ellipsis class="size-4" />
-					<span class="sr-only">Toggle menu</span>
-				</DropdownMenu.Trigger>
-				<DropdownMenu.Content align="start">
-					<DropdownMenu.Item>Documentation</DropdownMenu.Item>
-					<DropdownMenu.Item>Themes</DropdownMenu.Item>
-					<DropdownMenu.Item>GitHub</DropdownMenu.Item>
-				</DropdownMenu.Content>
-			</DropdownMenu.Root>
-		</Breadcrumb.Item>
-		<Breadcrumb.Separator />
-		<Breadcrumb.Item>
-			<Breadcrumb.Link href="/docs/components">Components</Breadcrumb.Link>
-		</Breadcrumb.Item>
-		<Breadcrumb.Separator />
-		<Breadcrumb.Item>
-			<Breadcrumb.Page>Breadcrumb</Breadcrumb.Page>
-		</Breadcrumb.Item>
-	</Breadcrumb.List>
-</Breadcrumb.Root>

package/src/showcase/demos/shadcn/bubble.svelte

@@ -1,36 +0,0 @@
-<script lang="ts">
-	import * as Bubble from "../../../shadcn/bubble/index.js";
-</script>
-
-<div class="flex w-full max-w-sm flex-col gap-8 py-12">
-	<Bubble.Root align="end">
-		<Bubble.Content>Hey there! what's up?</Bubble.Content>
-	</Bubble.Root>
-	<Bubble.Group>
-		<Bubble.Root variant="muted">
-			<Bubble.Content>Hey! Want to see chat bubbles?</Bubble.Content>
-		</Bubble.Root>
-		<Bubble.Root variant="muted">
-			<Bubble.Content>
-				I can group messages, switch sides, and keep the whole thread easy to scan.
-			</Bubble.Content>
-			<Bubble.Reactions role="img" aria-label="Reaction: thumbs up">
-				<span>👍</span>
-			</Bubble.Reactions>
-		</Bubble.Root>
-	</Bubble.Group>
-	<Bubble.Root align="end">
-		<Bubble.Content>Sure. Hit me with your best demo.</Bubble.Content>
-	</Bubble.Root>
-	<Bubble.Root variant="muted">
-		<Bubble.Content>
-			Yes. You are reading a demo that is demoing itself. Very meta. Very on-brand.
-		</Bubble.Content>
-		<Bubble.Reactions role="img" aria-label="Reactions: thumbs up, fire, eyes, and 2 more">
-			<span>👍</span>
-			<span>🔥</span>
-			<span>👀</span>
-			<span>+2</span>
-		</Bubble.Reactions>
-	</Bubble.Root>
-</div>

package/src/showcase/demos/shadcn/button.svelte

@@ -1,11 +0,0 @@
-<script lang="ts">
-	import ArrowUpIcon from "@lucide/svelte/icons/arrow-up";
-	import { Button } from "../../../shadcn/button/index.js";
-</script>
-
-<div class="flex flex-wrap items-center gap-2 md:flex-row">
-	<Button variant="outline">Button</Button>
-	<Button variant="outline" size="icon" aria-label="Submit">
-		<ArrowUpIcon />
-	</Button>
-</div>

package/src/showcase/demos/shadcn/calendar.svelte

@@ -1,8 +0,0 @@
-<script lang="ts">
-	import { getLocalTimeZone, today } from "@internationalized/date";
-	import { Calendar } from "../../../shadcn/calendar/index.js";
-
-	let value = today(getLocalTimeZone());
-</script>
-
-<Calendar type="single" bind:value class="rounded-md border shadow-sm" captionLayout="dropdown" />

package/src/showcase/demos/shadcn/card.svelte

@@ -1,39 +0,0 @@
-<script lang="ts">
-	import * as Card from "../../../shadcn/card/index.js";
-	import { Button } from "../../../shadcn/button/index.js";
-	import { Input } from "../../../shadcn/input/index.js";
-	import { Label } from "../../../shadcn/label/index.js";
-</script>
-
-<Card.Root class="-my-4 w-full max-w-sm">
-	<Card.Header>
-		<Card.Title>Login to your account</Card.Title>
-		<Card.Description>Enter your email below to login to your account</Card.Description>
-		<Card.Action>
-			<Button variant="link">Sign Up</Button>
-		</Card.Action>
-	</Card.Header>
-	<Card.Content>
-		<form>
-			<div class="flex flex-col gap-6">
-				<div class="grid gap-2">
-					<Label for="email">Email</Label>
-					<Input id="email" type="email" placeholder="m@example.com" required />
-				</div>
-				<div class="grid gap-2">
-					<div class="flex items-center">
-						<Label for="password">Password</Label>
-						<a href="##" class="ms-auto inline-block text-sm underline-offset-4 hover:underline">
-							Forgot your password?
-						</a>
-					</div>
-					<Input id="password" type="password" required />
-				</div>
-			</div>
-		</form>
-	</Card.Content>
-	<Card.Footer class="flex-col gap-2">
-		<Button type="submit" class="w-full">Login</Button>
-		<Button variant="outline" class="w-full">Login with Google</Button>
-	</Card.Footer>
-</Card.Root>

package/src/showcase/demos/shadcn/checkbox.svelte

@@ -1,39 +0,0 @@
-<script lang="ts">
-	import { Checkbox } from "../../../shadcn/checkbox/index.js";
-	import { Label } from "../../../shadcn/label/index.js";
-</script>
-
-<div class="flex flex-col gap-6">
-	<div class="flex items-center gap-3">
-		<Checkbox id="terms" />
-		<Label for="terms">Accept terms and conditions</Label>
-	</div>
-	<div class="flex items-start gap-3">
-		<Checkbox id="terms-2" checked />
-		<div class="grid gap-2">
-			<Label for="terms-2">Accept terms and conditions</Label>
-			<p class="text-sm text-muted-foreground">
-				By clicking this checkbox, you agree to the terms and conditions.
-			</p>
-		</div>
-	</div>
-	<div class="flex items-start gap-3">
-		<Checkbox id="toggle" disabled />
-		<Label for="toggle">Enable notifications</Label>
-	</div>
-	<Label
-		class="flex items-start gap-3 rounded-lg border p-3 hover:bg-accent/50 has-[[aria-checked=true]]:border-blue-600 has-[[aria-checked=true]]:bg-blue-50 dark:has-[[aria-checked=true]]:border-blue-900 dark:has-[[aria-checked=true]]:bg-blue-950"
-	>
-		<Checkbox
-			id="toggle-2"
-			checked
-			class="data-[state=checked]:border-blue-600 data-[state=checked]:bg-blue-600 data-[state=checked]:text-white dark:data-[state=checked]:border-blue-700 dark:data-[state=checked]:bg-blue-700"
-		/>
-		<div class="grid gap-1.5 font-normal">
-			<p class="text-sm leading-none font-medium">Enable notifications</p>
-			<p class="text-sm text-muted-foreground">
-				You can enable or disable notifications at any time.
-			</p>
-		</div>
-	</Label>
-</div>

package/src/showcase/demos/shadcn/collapsible.svelte

@@ -1,20 +0,0 @@
-<script lang="ts">
-	import ChevronsUpDownIcon from "@lucide/svelte/icons/chevrons-up-down";
-	import * as Collapsible from "../../../shadcn/collapsible/index.js";
-	import { buttonVariants } from "../../../shadcn/button/index.js";
-</script>
-
-<Collapsible.Root class="w-[350px] space-y-2">
-	<div class="flex items-center justify-between space-x-4 px-4">
-		<h4 class="text-sm font-semibold">@huntabyte starred 3 repositories</h4>
-		<Collapsible.Trigger class={buttonVariants({ variant: "ghost", size: "sm", class: "w-9 p-0" })}>
-			<ChevronsUpDownIcon />
-			<span class="sr-only">Toggle</span>
-		</Collapsible.Trigger>
-	</div>
-	<div class="rounded-md border px-4 py-3 font-mono text-sm">@huntabyte/bits-ui</div>
-	<Collapsible.Content class="space-y-2">
-		<div class="rounded-md border px-4 py-3 font-mono text-sm">@melt-ui/melt-ui</div>
-		<div class="rounded-md border px-4 py-3 font-mono text-sm">@sveltejs/svelte</div>
-	</Collapsible.Content>
-</Collapsible.Root>

package/src/showcase/demos/shadcn/command.svelte

@@ -1,48 +0,0 @@
-<script lang="ts">
-	import CalculatorIcon from "@lucide/svelte/icons/calculator";
-	import CalendarIcon from "@lucide/svelte/icons/calendar";
-	import CreditCardIcon from "@lucide/svelte/icons/credit-card";
-	import SettingsIcon from "@lucide/svelte/icons/settings";
-	import SmileIcon from "@lucide/svelte/icons/smile";
-	import UserIcon from "@lucide/svelte/icons/user";
-	import * as Command from "../../../shadcn/command/index.js";
-</script>
-
-<Command.Root class="rounded-lg border shadow-md md:min-w-[450px]">
-	<Command.Input placeholder="Type a command or search..." />
-	<Command.List>
-		<Command.Empty>No results found.</Command.Empty>
-		<Command.Group heading="Suggestions">
-			<Command.Item>
-				<CalendarIcon />
-				<span>Calendar</span>
-			</Command.Item>
-			<Command.Item>
-				<SmileIcon />
-				<span>Search Emoji</span>
-			</Command.Item>
-			<Command.Item disabled>
-				<CalculatorIcon />
-				<span>Calculator</span>
-			</Command.Item>
-		</Command.Group>
-		<Command.Separator />
-		<Command.Group heading="Settings">
-			<Command.Item>
-				<UserIcon />
-				<span>Profile</span>
-				<Command.Shortcut>⌘P</Command.Shortcut>
-			</Command.Item>
-			<Command.Item>
-				<CreditCardIcon />
-				<span>Billing</span>
-				<Command.Shortcut>⌘B</Command.Shortcut>
-			</Command.Item>
-			<Command.Item>
-				<SettingsIcon />
-				<span>Settings</span>
-				<Command.Shortcut>⌘S</Command.Shortcut>
-			</Command.Item>
-		</Command.Group>
-	</Command.List>
-</Command.Root>

package/src/showcase/demos/shadcn/context-menu.svelte

@@ -1,54 +0,0 @@
-<script lang="ts">
-	import * as ContextMenu from "../../../shadcn/context-menu/index.js";
-
-	let showBookmarks = $state(false);
-	let showFullURLs = $state(true);
-
-	let value = $state("pedro");
-</script>
-
-<ContextMenu.Root>
-	<ContextMenu.Trigger
-		class="flex h-[150px] w-[300px] items-center justify-center rounded-md border border-dashed text-sm"
-	>
-		Right click here
-	</ContextMenu.Trigger>
-	<ContextMenu.Content class="w-52">
-		<ContextMenu.Item>
-			Back
-			<ContextMenu.Shortcut>⌘[</ContextMenu.Shortcut>
-		</ContextMenu.Item>
-		<ContextMenu.Item disabled>
-			Forward
-			<ContextMenu.Shortcut>⌘]</ContextMenu.Shortcut>
-		</ContextMenu.Item>
-		<ContextMenu.Item>
-			Reload
-			<ContextMenu.Shortcut>⌘R</ContextMenu.Shortcut>
-		</ContextMenu.Item>
-		<ContextMenu.Sub>
-			<ContextMenu.SubTrigger>More Tools</ContextMenu.SubTrigger>
-			<ContextMenu.SubContent class="w-48">
-				<ContextMenu.Item>
-					Save Page As...
-					<ContextMenu.Shortcut>⇧⌘S</ContextMenu.Shortcut>
-				</ContextMenu.Item>
-				<ContextMenu.Item>Create Shortcut...</ContextMenu.Item>
-				<ContextMenu.Item>Name Window...</ContextMenu.Item>
-				<ContextMenu.Separator />
-				<ContextMenu.Item>Developer Tools</ContextMenu.Item>
-			</ContextMenu.SubContent>
-		</ContextMenu.Sub>
-		<ContextMenu.Separator />
-		<ContextMenu.CheckboxItem bind:checked={showBookmarks}>Show Bookmarks</ContextMenu.CheckboxItem>
-		<ContextMenu.CheckboxItem bind:checked={showFullURLs}>Show Full URLs</ContextMenu.CheckboxItem>
-		<ContextMenu.Separator />
-		<ContextMenu.RadioGroup bind:value>
-			<ContextMenu.Group>
-				<ContextMenu.Label>People</ContextMenu.Label>
-				<ContextMenu.RadioItem value="pedro">Pedro Duarte</ContextMenu.RadioItem>
-				<ContextMenu.RadioItem value="colm">Colm Tuite</ContextMenu.RadioItem>
-			</ContextMenu.Group>
-		</ContextMenu.RadioGroup>
-	</ContextMenu.Content>
-</ContextMenu.Root>

package/src/showcase/demos/shadcn/demo-harness.svelte

@@ -1,12 +0,0 @@
-<script lang="ts">
-	// What ShadcnSection puts around a demo, so the test mounts what the page
-	// mounts: `input-group` reaches for a tooltip provider it does not create.
-	import type { Component } from "svelte";
-	import { TooltipProvider } from "../../../shadcn/tooltip/index.js";
-
-	let { Comp }: { Comp: Component } = $props();
-</script>
-
-<TooltipProvider>
-	<Comp />
-</TooltipProvider>

package/src/showcase/demos/shadcn/demos.test.ts

@@ -1,20 +0,0 @@
-// The demos are upstream's and arrive by script, so nothing reviews them before
-// they land. This is the gate: every one of them mounts and draws something.
-import { flushSync, mount, unmount } from "svelte";
-import { describe, expect, it } from "vite-plus/test";
-import Harness from "./demo-harness.svelte";
-import { SHADCN_DEMOS } from "./index.js";
-
-describe("shadcn demos", () => {
-  for (const demo of SHADCN_DEMOS) {
-    it(`${demo.name} renders`, () => {
-      const target = document.createElement("div");
-      document.body.appendChild(target);
-      const app = mount(Harness, { target, props: { Comp: demo.Comp } });
-      flushSync();
-      expect(target.innerHTML.length).toBeGreaterThan(0);
-      void unmount(app);
-      target.remove();
-    });
-  }
-});

package/src/showcase/demos/shadcn/dialog.svelte

@@ -1,38 +0,0 @@
-<script lang="ts">
-	import * as Dialog from "../../../shadcn/dialog/index.js";
-	import { Button, buttonVariants } from "../../../shadcn/button/index.js";
-	import { Input } from "../../../shadcn/input/index.js";
-	import { Label } from "../../../shadcn/label/index.js";
-</script>
-
-<Dialog.Root>
-	<form>
-		<Dialog.Trigger type="button" class={buttonVariants({ variant: "outline" })}>
-			Open Dialog
-		</Dialog.Trigger>
-		<Dialog.Content class="sm:max-w-[425px]">
-			<Dialog.Header>
-				<Dialog.Title>Edit profile</Dialog.Title>
-				<Dialog.Description>
-					Make changes to your profile here. Click save when you&apos;re done.
-				</Dialog.Description>
-			</Dialog.Header>
-			<div class="grid gap-4">
-				<div class="grid gap-3">
-					<Label for="name-1">Name</Label>
-					<Input id="name-1" name="name" defaultValue="Pedro Duarte" />
-				</div>
-				<div class="grid gap-3">
-					<Label for="username-1">Username</Label>
-					<Input id="username-1" name="username" defaultValue="@peduarte" />
-				</div>
-			</div>
-			<Dialog.Footer>
-				<Dialog.Close type="button" class={buttonVariants({ variant: "outline" })}>
-					Cancel
-				</Dialog.Close>
-				<Button type="submit">Save changes</Button>
-			</Dialog.Footer>
-		</Dialog.Content>
-	</form>
-</Dialog.Root>

package/src/showcase/demos/shadcn/dropdown-menu.svelte

@@ -1,59 +0,0 @@
-<script lang="ts">
-	import * as DropdownMenu from "../../../shadcn/dropdown-menu/index.js";
-	import { Button } from "../../../shadcn/button/index.js";
-</script>
-
-<DropdownMenu.Root>
-	<DropdownMenu.Trigger>
-		{#snippet child({ props })}
-			<Button {...props} variant="outline">Open</Button>
-		{/snippet}
-	</DropdownMenu.Trigger>
-	<DropdownMenu.Content class="w-56" align="start">
-		<DropdownMenu.Label>My Account</DropdownMenu.Label>
-		<DropdownMenu.Group>
-			<DropdownMenu.Item>
-				Profile
-				<DropdownMenu.Shortcut>⇧⌘P</DropdownMenu.Shortcut>
-			</DropdownMenu.Item>
-			<DropdownMenu.Item>
-				Billing
-				<DropdownMenu.Shortcut>⌘B</DropdownMenu.Shortcut>
-			</DropdownMenu.Item>
-			<DropdownMenu.Item>
-				Settings
-				<DropdownMenu.Shortcut>⌘S</DropdownMenu.Shortcut>
-			</DropdownMenu.Item>
-			<DropdownMenu.Item>
-				Keyboard shortcuts
-				<DropdownMenu.Shortcut>⌘K</DropdownMenu.Shortcut>
-			</DropdownMenu.Item>
-		</DropdownMenu.Group>
-		<DropdownMenu.Separator />
-		<DropdownMenu.Group>
-			<DropdownMenu.Item>Team</DropdownMenu.Item>
-			<DropdownMenu.Sub>
-				<DropdownMenu.SubTrigger>Invite users</DropdownMenu.SubTrigger>
-				<DropdownMenu.SubContent>
-					<DropdownMenu.Item>Email</DropdownMenu.Item>
-					<DropdownMenu.Item>Message</DropdownMenu.Item>
-					<DropdownMenu.Separator />
-					<DropdownMenu.Item>More...</DropdownMenu.Item>
-				</DropdownMenu.SubContent>
-			</DropdownMenu.Sub>
-			<DropdownMenu.Item>
-				New Team
-				<DropdownMenu.Shortcut>⌘+T</DropdownMenu.Shortcut>
-			</DropdownMenu.Item>
-		</DropdownMenu.Group>
-		<DropdownMenu.Separator />
-		<DropdownMenu.Item>GitHub</DropdownMenu.Item>
-		<DropdownMenu.Item>Support</DropdownMenu.Item>
-		<DropdownMenu.Item disabled>API</DropdownMenu.Item>
-		<DropdownMenu.Separator />
-		<DropdownMenu.Item>
-			Log out
-			<DropdownMenu.Shortcut>⇧⌘Q</DropdownMenu.Shortcut>
-		</DropdownMenu.Item>
-	</DropdownMenu.Content>
-</DropdownMenu.Root>

package/src/showcase/demos/shadcn/empty.svelte

@@ -1,29 +0,0 @@
-<script lang="ts">
-	import ArrowUpRightIcon from "@lucide/svelte/icons/arrow-up-right";
-	import FolderCodeIcon from "@tabler/icons-svelte-runes/icons/folder-code";
-	import * as Empty from "../../../shadcn/empty/index.js";
-	import { Button } from "../../../shadcn/button/index.js";
-</script>
-
-<Empty.Root>
-	<Empty.Header>
-		<Empty.Media variant="icon">
-			<FolderCodeIcon />
-		</Empty.Media>
-		<Empty.Title>No Projects Yet</Empty.Title>
-		<Empty.Description>
-			You haven't created any projects yet. Get started by creating your first project.
-		</Empty.Description>
-	</Empty.Header>
-	<Empty.Content>
-		<div class="flex gap-2">
-			<Button>Create Project</Button>
-			<Button variant="outline">Import Project</Button>
-		</div>
-	</Empty.Content>
-	<Button variant="link" class="text-muted-foreground" size="sm">
-		<a href="#/">
-			Learn More <ArrowUpRightIcon class="inline" />
-		</a>
-	</Button>
-</Empty.Root>