create-tauri-ui 0.3.0 → 0.3.2

package/templates/sveltekit/src/content/components/button.md

@@ -1,165 +0,0 @@
----
-title: Button
-description: Displays a button or a component that looks like a button.
-featured: true
-component: true
-source: https://github.com/huntabyte/shadcn-svelte/tree/main/apps/www/src/lib/components/ui/button
----
-
-<script>
-  import { ButtonDemo, ButtonDemoDestructive, ButtonDemoGhost, ButtonDemoOutline, ButtonDemoSecondary, ButtonDemoIcon, ButtonDemoLoading, ButtonDemoLink, ComponentExample, ManualInstall } from '$lib/components/docs';
-</script>
-
-<ComponentExample src="src/lib/components/docs/examples/button/ButtonDemo.svelte">
-
-<div slot="example">
-<ButtonDemo />
-</div>
-
-</ComponentExample>
-
-## Installation
-
-```bash
-npx shadcn-svelte add button
-```
-
-<ManualInstall>
-
-1. Copy and paste the component source files linked at the top of this page into your project.
-
-</ManualInstall>
-
-## Usage
-
-```svelte
-<script lang="ts">
-  import { Button } from '$components/ui/button';
-</script>
-```
-
-```svelte
-<Button variant="outline">Button</Button>
-```
-
-### Link
-
-You can convert the `<button>` into an `<a>` element by simply passing an `href` as a prop.
-
-```svelte
-<script lang="ts">
-  import { Button } from '$components/ui/button';
-</script>
-```
-
-```svelte
-<Button href="/dashboard">Dashboard</Button>
-```
-
-Alternatively, you can use the `buttonVariants` helper to create a link that looks like a button.
-
-```svelte
-<script lang="ts">
-  import { buttonVariants } from '$components/ui/button';
-</script>
-```
-
-```svelte
-<a href="/dashboard" class={buttonVariants({ variant: 'outline' })}> Dashboard </a>
-```
-
-## Examples
-
-### Primary
-
-<ComponentExample src="src/lib/components/docs/examples/button/ButtonDemo.svelte">
-
-<div slot="example">
-<ButtonDemo />
-</div>
-
-</ComponentExample>
-
----
-
-### Secondary
-
-<ComponentExample src="src/lib/components/docs/examples/button/ButtonDemoSecondary.svelte">
-
-<div slot="example">
-<ButtonDemoSecondary />
-</div>
-
-</ComponentExample>
-
----
-
-### Destructive
-
-<ComponentExample src="src/lib/components/docs/examples/button/ButtonDemoDestructive.svelte">
-
-<div slot="example">
-<ButtonDemoDestructive />
-</div>
-
-</ComponentExample>
-
----
-
-### Outline
-
-<ComponentExample src="src/lib/components/docs/examples/button/ButtonDemoOutline.svelte">
-
-<div slot="example">
-<ButtonDemoOutline />
-</div>
-
-</ComponentExample>
-
----
-
-### Ghost
-
-<ComponentExample src="src/lib/components/docs/examples/button/ButtonDemoGhost.svelte">
-
-<div slot="example">
-<ButtonDemoGhost />
-</div>
-
-</ComponentExample>
-
----
-
-### Link
-
-<ComponentExample src="src/lib/components/docs/examples/button/ButtonDemoLink.svelte">
-
-<div slot="example">
-<ButtonDemoLink />
-</div>
-
-</ComponentExample>
-
----
-
-### With Icon
-
-<ComponentExample src="src/lib/components/docs/examples/button/ButtonDemoIcon.svelte">
-
-<div slot="example">
-<ButtonDemoIcon />
-</div>
-
-</ComponentExample>
-
----
-
-### Loading
-
-<ComponentExample src="src/lib/components/docs/examples/button/ButtonDemoLoading.svelte">
-
-<div slot="example">
-<ButtonDemoLoading />
-</div>
-
-</ComponentExample>

package/templates/sveltekit/src/content/components/card.md

@@ -1,82 +0,0 @@
----
-title: Card
-description: Displays a card with header, content, and footer.
-featured: true
-source: https://github.com/huntabyte/shadcn-svelte/tree/main/apps/www/src/lib/components/ui/card
----
-
-<script>
-  import { CardDemo, ComponentExample, ManualInstall } from '$lib/components/docs';
-</script>
-
-<ComponentExample src="src/lib/components/docs/examples/card/CardDemo.svelte">
-
-<div slot="example">
-<CardDemo />
-</div>
-
-</ComponentExample>
-
-## Installation
-
-```bash
-npx shadcn-svelte add card
-```
-
-<ManualInstall>
-
-1. Copy and paste the component source files linked at the top of this page into your project.
-
-</ManualInstall>
-
-## Usage
-
-```svelte
-<script lang="ts">
-  import {
-    Card,
-    CardContent,
-    CardDescription,
-    CardFooter,
-    CardHeader,
-    CardTitle
-  } from '$components/ui/card';
-</script>
-```
-
-```svelte
-<Card>
-  <CardHeader>
-    <CardTitle>Card Title</CardTitle>
-    <CardDescription>Card Description</CardDescription>
-  </CardHeader>
-  <CardContent>
-    <p>Card Content</p>
-  </CardContent>
-  <CardFooter>
-    <p>Card Footer</p>
-  </CardFooter>
-</Card>
-```
-
-### Modify the heading level
-
-By default, the `<CardTitle>` component renders an `<h3>` element. You can change this by passing a `tag` prop to the component.
-
-For example:
-
-```svelte
-<CardTitle tag={'h2'}>This will render an H2</CardTitle>
-```
-
-```svelte
-<CardTitle tag={'h5'}>This will render an H5</CardTitle>
-```
-
-```svelte
-<CardTitle tag={'p'}>This will render a P tag</CardTitle>
-```
-
-## Examples
-
-Coming soon

package/templates/sveltekit/src/content/components/checkbox.md

@@ -1,71 +0,0 @@
----
-title: Checkbox
-description: A control that allows the user to toggle between checked and not checked.
-component: true
-source: https://github.com/huntabyte/shadcn-svelte/tree/main/apps/www/src/lib/components/ui/checkbox
-radix: https://www.radix-svelte.com/docs/checkbox
----
-
-<script>
-  import { CheckboxDemo, CheckboxDemoDisabled, CheckboxDemoText, ComponentExample, ManualInstall } from '$lib/components/docs';
-</script>
-
-<ComponentExample src="src/lib/components/docs/examples/checkbox/CheckboxDemo.svelte">
-
-<div slot="example">
-<CheckboxDemo />
-</div>
-
-</ComponentExample>
-
-## Installation
-
-```bash
-npx shadcn-svelte add checkbox
-```
-
-<ManualInstall>
-
-1. Install `radix-svelte`:
-
-```bash
-npm install radix-svelte
-```
-
-2. Copy and paste the component source files linked at the top of this page into your project.
-
-</ManualInstall>
-
-## Usage
-
-```svelte
-<script lang="ts">
-  import { Checkbox } from '$components/ui/checkbox';
-</script>
-```
-
-```svelte
-<Checkbox />
-```
-
-## Examples
-
-### With Text
-
-<ComponentExample src="src/lib/components/docs/examples/checkbox/CheckboxDemoText.svelte">
-
-<div slot="example">
-<CheckboxDemoText />
-</div>
-
-</ComponentExample>
-
-### Disabled
-
-<ComponentExample src="src/lib/components/docs/examples/checkbox/CheckboxDemoDisabled.svelte">
-
-<div slot="example">
-<CheckboxDemoDisabled />
-</div>
-
-</ComponentExample>

package/templates/sveltekit/src/content/components/collapsible.md

@@ -1,55 +0,0 @@
----
-title: Collapsible
-description: An interactive component which expands/collapses a panel.
-component: true
-featured: true
-source: https://github.com/huntabyte/shadcn-svelte/tree/main/apps/www/src/lib/components/ui/collapsible
-radix: https://www.radix-svelte.com/docs/collapsible
----
-
-<script>
-  import { CollapsibleDemo, ComponentExample, ManualInstall } from '$lib/components/docs';
-</script>
-
-<ComponentExample src="src/lib/components/docs/examples/collapsible/CollapsibleDemo.svelte">
-
-<div slot="example">
-<CollapsibleDemo />
-</div>
-
-</ComponentExample>
-
-## Installation
-
-```bash
-npx shadcn-svelte add collapsible
-```
-
-<ManualInstall>
-
-1. Install `radix-svelte`:
-
-```bash
-npm install radix-svelte
-```
-
-2. Copy and paste the component source files linked at the top of this page into your project.
-
-</ManualInstall>
-
-## Usage
-
-```svelte
-<script lang="ts">
-  import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '$components/ui/collapsible';
-</script>
-```
-
-```svelte
-<Collapsible>
-  <CollapsibleTrigger>Can I use this in my project?</CollapsibleTrigger>
-  <CollapsibleContent>
-    Yes. Free to use for personal and commercial projects. No attribution required.
-  </CollapsibleContent>
-</Collapsible>
-```

package/templates/sveltekit/src/content/components/dialog.md

@@ -1,72 +0,0 @@
----
-title: Dialog
-description: A window overlaid on either the primary window or another dialog window, rendering the content underneath inert.
-component: true
-featured: true
-source: https://github.com/huntabyte/shadcn-svelte/tree/main/apps/www/src/lib/components/ui/dialog
-radix: https://www.radix-svelte.com/docs/dialog
----
-
-<script>
-  import { DialogDemo, ComponentExample, ManualInstall } from '$lib/components/docs';
-</script>
-
-<ComponentExample src="src/lib/components/docs/examples/dialog/DialogDemo.svelte">
-
-<div slot="example">
-<DialogDemo />
-</div>
-
-</ComponentExample>
-
-## Installation
-
-```bash
-npx shadcn-svelte add dialog
-```
-
-<ManualInstall>
-
-1. Install `radix-svelte`:
-
-```bash
-npm install radix-svelte
-```
-
-2. Copy and paste the component source files linked at the top of this page into your project.
-
-</ManualInstall>
-
-## Usage
-
-```svelte
-<script lang="ts">
-  import {
-    Dialog,
-    DialogContent,
-    DialogDescription,
-    DialogHeader,
-    DialogTitle,
-    DialogTrigger
-  } from '$components/ui/dialog';
-</script>
-```
-
-```svelte
-<Dialog>
-  <DialogTrigger>Open</DialogTrigger>
-  <DialogContent>
-    <DialogHeader>
-      <DialogTitle>Are you sure absolutely sure?</DialogTitle>
-      <DialogDescription>
-        This action cannot be undone. This will permanently delete your account and remove your data
-        from our servers.
-      </DialogDescription>
-    </DialogHeader>
-  </DialogContent>
-</Dialog>
-```
-
-## Notes
-
-(coming soon)

package/templates/sveltekit/src/content/components/hover-card.md

@@ -1,52 +0,0 @@
----
-title: Hover Card
-description: For sighted users to preview content available behind a link.
-component: true
-source: https://github.com/huntabyte/shadcn-svelte/tree/main/apps/www/src/lib/components/ui/hover-card
-radix: https://www.radix-svelte.com/docs/hovercard
----
-
-<script>
-  import { HoverCardDemo, ComponentExample, ManualInstall } from '$lib/components/docs';
-</script>
-
-<ComponentExample src="src/lib/components/docs/examples/hover-card/HoverCardDemo.svelte">
-
-<div slot="example">
-<HoverCardDemo />
-</div>
-
-</ComponentExample>
-
-## Installation
-
-```bash
-npx shadcn-svelte add hover-card
-```
-
-<ManualInstall>
-
-1. Install `radix-svelte`:
-
-```bash
-npm install radix-svelte
-```
-
-2. Copy and paste the component source files linked at the top of this page into your project.
-
-</ManualInstall>
-
-## Usage
-
-```svelte
-<script lang="ts">
-  import { HoverCard, HoverCardContent, HoverCardTrigger } from '$components/ui/hover-card';
-</script>
-```
-
-```svelte
-<HoverCard>
-  <HoverCardTrigger>Hover</HoverCardTrigger>
-  <HoverCardContent>SvelteKit - Web development, streamlined</HoverCardContent>
-</HoverCard>
-```

package/templates/sveltekit/src/content/components/input.md

@@ -1,114 +0,0 @@
----
-title: Input
-description: Displays a form input field or a component that looks like an input field.
-component: true
-source: https://github.com/huntabyte/shadcn-svelte/tree/main/apps/www/src/lib/components/ui/input
----
-
-<script>
-  import { InputDemo, InputDemoDisabled, InputDemoLabel, InputDemoText, InputDemoFile, InputDemoButton, ComponentExample, ManualInstall } from '$lib/components/docs';
-</script>
-
-<ComponentExample src="src/lib/components/docs/examples/input/InputDemo.svelte" >
-
-<div slot="example" style="max-width: 24rem; width: 100%;">
-<InputDemo />
-</div>
-
-</ComponentExample>
-
-## Installation
-
-```bash
-npx shadcn-svelte add input
-```
-
-<ManualInstall>
-
-1. Copy and paste the component source files linked at the top of this page into your project.
-
-</ManualInstall>
-
-## Usage
-
-```svelte
-<script lang="ts">
-  import { Input } from '$components/ui/input';
-</script>
-```
-
-```svelte
-<Input />
-```
-
-## Examples
-
-### Default
-
-<ComponentExample src="src/lib/components/docs/examples/input/InputDemo.svelte">
-
-<div slot="example" style="max-width: 24rem; width: 100%;">
-<InputDemo />
-</div>
-
-</ComponentExample>
-
----
-
-### Disabled
-
-<ComponentExample src="src/lib/components/docs/examples/input/InputDemoDisabled.svelte">
-
-<div slot="example" style="max-width: 24rem; width: 100%;">
-<InputDemoDisabled />
-</div>
-
-</ComponentExample>
-
----
-
-### With Label
-
-<ComponentExample src="src/lib/components/docs/examples/input/InputDemoLabel.svelte">
-
-<div slot="example" style="max-width: 24rem; width: 100%;">
-<InputDemoLabel />
-</div>
-
-</ComponentExample>
-
----
-
-### With Text
-
-<ComponentExample src="src/lib/components/docs/examples/input/InputDemoText.svelte">
-
-<div slot="example" style="max-width: 24rem; width: 100%;">
-<InputDemoText />
-</div>
-
-</ComponentExample>
-
----
-
-### With Button
-
-<ComponentExample src="src/lib/components/docs/examples/input/InputDemoButton.svelte">
-
-<div slot="example" style="max-width: 24rem; width: 100%;">
-<InputDemoButton />
-</div>
-
-</ComponentExample>
-
----
-
-### File
-
-<ComponentExample src="src/lib/components/docs/examples/input/InputDemoFile.svelte">
-
-<div slot="example" style="max-width: 24rem; width: 100%;">
-<InputDemoFile />
-</div>
-
-</ComponentExample>

package/templates/sveltekit/src/content/components/label.md

@@ -1,49 +0,0 @@
----
-title: Label
-description: Renders an accessible label associated with controls.
-component: true
-source: https://github.com/huntabyte/shadcn-svelte/tree/main/apps/www/src/lib/components/ui/label
-radix: https://www.radix-svelte.com/docs/label
----
-
-<script>
-  import { LabelDemo, ComponentExample, ManualInstall } from '$lib/components/docs';
-</script>
-
-<ComponentExample src="src/lib/components/docs/examples/label/LabelDemo.svelte">
-
-<div slot="example">
-<LabelDemo />
-</div>
-
-</ComponentExample>
-
-## Installation
-
-```bash
-npx shadcn-svelte add label
-```
-
-<ManualInstall>
-
-1. Install `radix-svelte`:
-
-```bash
-npm install radix-svelte
-```
-
-2. Copy and paste the component source files linked at the top of this page into your project.
-
-</ManualInstall>
-
-## Usage
-
-```svelte
-<script lang="ts">
-  import { Label } from '$components/ui/label';
-</script>
-```
-
-```svelte
-<Label for="email">Your email address</Label>
-```

package/templates/sveltekit/src/content/components/progress.md

@@ -1,49 +0,0 @@
----
-title: Progress
-description: Displays an indicator showing the completion progress of a task, typically displayed as a progress bar.
-component: true
-source: https://github.com/huntabyte/shadcn-svelte/tree/main/apps/www/src/lib/components/ui/progress
-radix: https://www.radix-svelte.com/docs/progress
----
-
-<script>
-  import { ProgressDemo, ComponentExample, ManualInstall } from '$lib/components/docs';
-</script>
-
-<ComponentExample src="src/lib/components/docs/examples/progress/ProgressDemo.svelte">
-
-<div slot="example" style="width: 60%;">
-<ProgressDemo />
-</div>
-
-</ComponentExample>
-
-## Installation
-
-```bash
-npx shadcn-svelte add progress
-```
-
-<ManualInstall>
-
-1. Install `radix-svelte`:
-
-```bash
-npm install radix-svelte
-```
-
-2. Copy and paste the component source files linked at the top of this page into your project.
-
-</ManualInstall>
-
-## Usage
-
-```svelte
-<script lang="ts">
-  import { Progress } from '$components/ui/progress';
-</script>
-```
-
-```svelte
-<Progress value={33}>
-```