@autumnsgrove/groveengine 0.1.0 → 0.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@autumnsgrove/groveengine",
-  "version": "0.1.0",
+  "version": "0.3.0",
   "description": "Multi-tenant blog engine for Grove Platform. Features gutter annotations, markdown editing, magic code auth, and Cloudflare Workers deployment.",
   "author": "AutumnsGrove",
   "license": "MIT",
@@ -114,6 +114,7 @@
     "vitest": "^4.0.14"
   },
   "dependencies": {
+    "@groveengine/ui": "^0.3.0",
     "@types/dompurify": "^3.0.5",
     "chart.js": "^4.5.1",
     "clsx": "^2.1.1",

package/dist/components/ui/Badge.svelte

@@ -1,48 +0,0 @@
-<script lang="ts">
-	import { Badge as ShadcnBadge } from "./badge";
-	import type { Snippet } from "svelte";
-
-	type BadgeVariant = "default" | "secondary" | "destructive" | "tag";
-
-	/**
-	 * Badge component wrapper for displaying small labels, tags, or status indicators
-	 *
-	 * @prop {BadgeVariant} [variant="default"] - Badge style variant (default|secondary|destructive|tag)
-	 * @prop {string} [class] - Additional CSS classes to apply
-	 * @prop {Snippet} [children] - Badge content (typically short text)
-	 *
-	 * @example
-	 * <Badge variant="default">New</Badge>
-	 *
-	 * @example
-	 * <Badge variant="destructive">Error</Badge>
-	 *
-	 * @example
-	 * <Badge variant="tag">TypeScript</Badge>
-	 */
-	interface Props {
-		variant?: BadgeVariant;
-		class?: string;
-		children?: Snippet;
-	}
-
-	let {
-		variant = "default",
-		class: className,
-		children
-	}: Props = $props();
-
-	// Map tag variant to secondary styling
-	const variantMap: Record<BadgeVariant, "default" | "secondary" | "destructive"> = {
-		default: "default",
-		secondary: "secondary",
-		destructive: "destructive",
-		tag: "secondary"
-	};
-
-	const shadcnVariant = $derived(variantMap[variant]);
-</script>
-
-<ShadcnBadge variant={shadcnVariant} class={className}>
-	{@render children?.()}
-</ShadcnBadge>

package/dist/components/ui/Badge.svelte.d.ts

@@ -1,26 +0,0 @@
-import type { Snippet } from "svelte";
-type BadgeVariant = "default" | "secondary" | "destructive" | "tag";
-/**
- * Badge component wrapper for displaying small labels, tags, or status indicators
- *
- * @prop {BadgeVariant} [variant="default"] - Badge style variant (default|secondary|destructive|tag)
- * @prop {string} [class] - Additional CSS classes to apply
- * @prop {Snippet} [children] - Badge content (typically short text)
- *
- * @example
- * <Badge variant="default">New</Badge>
- *
- * @example
- * <Badge variant="destructive">Error</Badge>
- *
- * @example
- * <Badge variant="tag">TypeScript</Badge>
- */
-interface Props {
-    variant?: BadgeVariant;
-    class?: string;
-    children?: Snippet;
-}
-declare const Badge: import("svelte").Component<Props, {}, "">;
-type Badge = ReturnType<typeof Badge>;
-export default Badge;

package/dist/components/ui/Button.svelte

@@ -1,74 +0,0 @@
-<script lang="ts">
-	import { Button as ShadcnButton } from "./button";
-	import type { Snippet } from "svelte";
-	import type { HTMLButtonAttributes } from "svelte/elements";
-
-	type ButtonVariant = "primary" | "secondary" | "danger" | "ghost" | "link";
-	type ButtonSize = "sm" | "md" | "lg";
-
-	/**
-	 * Button component wrapper around shadcn-svelte Button
-	 *
-	 * @prop {ButtonVariant} [variant="primary"] - Button style variant (primary|secondary|danger|ghost|link)
-	 * @prop {ButtonSize} [size="md"] - Button size (sm|md|lg)
-	 * @prop {boolean} [disabled=false] - Whether button is disabled
-	 * @prop {Function} [onclick] - Click handler function
-	 * @prop {string} [href] - Optional link href (renders as anchor element)
-	 * @prop {string} [class] - Additional CSS classes to apply
-	 * @prop {Snippet} [children] - Button content (text/icons/etc)
-	 *
-	 * @example
-	 * <Button variant="primary" size="lg">Save Changes</Button>
-	 *
-	 * @example
-	 * <Button variant="danger" onclick={() => handleDelete()}>Delete</Button>
-	 *
-	 * @example
-	 * <Button variant="ghost" href="/settings">Settings</Button>
-	 */
-	interface Props extends Omit<HTMLButtonAttributes, "class"> {
-		variant?: ButtonVariant;
-		size?: ButtonSize;
-		disabled?: boolean;
-		class?: string;
-		children?: Snippet;
-	}
-
-	let {
-		variant = "primary",
-		size = "md",
-		disabled = false,
-		class: className,
-		children,
-		...restProps
-	}: Props = $props();
-
-	// Map our simplified variants to shadcn variants
-	const variantMap: Record<ButtonVariant, "default" | "secondary" | "destructive" | "ghost" | "link"> = {
-		primary: "default",
-		secondary: "secondary",
-		danger: "destructive",
-		ghost: "ghost",
-		link: "link"
-	};
-
-	// Map our size variants to shadcn sizes
-	const sizeMap: Record<ButtonSize, "sm" | "default" | "lg"> = {
-		sm: "sm",
-		md: "default",
-		lg: "lg"
-	};
-
-	const shadcnVariant = $derived(variantMap[variant]);
-	const shadcnSize = $derived(sizeMap[size]);
-</script>
-
-<ShadcnButton
-	variant={shadcnVariant}
-	size={shadcnSize}
-	disabled={disabled}
-	class={className}
-	{...restProps}
->
-	{@render children?.()}
-</ShadcnButton>

package/dist/components/ui/Button.svelte.d.ts

@@ -1,34 +0,0 @@
-import type { Snippet } from "svelte";
-import type { HTMLButtonAttributes } from "svelte/elements";
-type ButtonVariant = "primary" | "secondary" | "danger" | "ghost" | "link";
-type ButtonSize = "sm" | "md" | "lg";
-/**
- * Button component wrapper around shadcn-svelte Button
- *
- * @prop {ButtonVariant} [variant="primary"] - Button style variant (primary|secondary|danger|ghost|link)
- * @prop {ButtonSize} [size="md"] - Button size (sm|md|lg)
- * @prop {boolean} [disabled=false] - Whether button is disabled
- * @prop {Function} [onclick] - Click handler function
- * @prop {string} [href] - Optional link href (renders as anchor element)
- * @prop {string} [class] - Additional CSS classes to apply
- * @prop {Snippet} [children] - Button content (text/icons/etc)
- *
- * @example
- * <Button variant="primary" size="lg">Save Changes</Button>
- *
- * @example
- * <Button variant="danger" onclick={() => handleDelete()}>Delete</Button>
- *
- * @example
- * <Button variant="ghost" href="/settings">Settings</Button>
- */
-interface Props extends Omit<HTMLButtonAttributes, "class"> {
-    variant?: ButtonVariant;
-    size?: ButtonSize;
-    disabled?: boolean;
-    class?: string;
-    children?: Snippet;
-}
-declare const Button: import("svelte").Component<Props, {}, "">;
-type Button = ReturnType<typeof Button>;
-export default Button;

package/dist/components/ui/Card.svelte

@@ -1,102 +0,0 @@
-<script lang="ts">
-	import {
-		Card as ShadcnCard,
-		CardHeader,
-		CardTitle,
-		CardDescription,
-		CardContent,
-		CardFooter
-	} from "./card";
-	import type { Snippet } from "svelte";
-	import { cn } from "../../utils";
-
-	/**
-	 * Card component wrapper providing structured layout with header, content, and footer
-	 *
-	 * @prop {string} [title] - Card title (renders in CardHeader with CardTitle)
-	 * @prop {string} [description] - Card description (renders in CardHeader with CardDescription)
-	 * @prop {boolean} [hoverable=false] - Enable hover shadow effect for interactive cards
-	 * @prop {Snippet} [header] - Custom header content (overrides title/description)
-	 * @prop {Snippet} [footer] - Footer content (rendered in CardFooter)
-	 * @prop {Snippet} [children] - Main card content (rendered in CardContent)
-	 * @prop {string} [class] - Additional CSS classes for Card root
-	 *
-	 * @example
-	 * <Card title="Profile" description="Update your profile settings">
-	 *   <p>Card content here</p>
-	 * </Card>
-	 *
-	 * @example
-	 * <Card hoverable>
-	 *   {#snippet header()}
-	 *     <CustomHeader />
-	 *   {/snippet}
-	 *   Content here
-	 * </Card>
-	 *
-	 * @example
-	 * <Card title="Actions">
-	 *   {#snippet footer()}
-	 *     <Button>Save</Button>
-	 *   {/snippet}
-	 *   Form content
-	 * </Card>
-	 */
-	interface Props {
-		title?: string;
-		description?: string;
-		hoverable?: boolean;
-		class?: string;
-		header?: Snippet;
-		footer?: Snippet;
-		children?: Snippet;
-		[key: string]: any; // Allow any additional props to be forwarded
-	}
-
-	let {
-		title,
-		description,
-		hoverable = false,
-		class: className,
-		header,
-		footer,
-		children,
-		...restProps
-	}: Props = $props();
-
-	const cardClass = $derived(
-		cn(
-			hoverable && "hover:shadow-lg transition-shadow cursor-pointer",
-			className
-		)
-	);
-</script>
-
-<ShadcnCard class={cardClass} {...restProps}>
-	{#if header || title || description}
-		<CardHeader>
-			{#if header}
-				{@render header()}
-			{:else}
-				{#if title}
-					<CardTitle>{title}</CardTitle>
-				{/if}
-				{#if description}
-					<CardDescription>{description}</CardDescription>
-				{/if}
-			{/if}
-		</CardHeader>
-	{/if}
-
-	{#if children}
-		<CardContent>
-			{@render children()}
-		</CardContent>
-	{/if}
-
-	{#if footer}
-		<CardFooter>
-			{@render footer()}
-		</CardFooter>
-	{/if}
-</ShadcnCard>

package/dist/components/ui/Card.svelte.d.ts

@@ -1,46 +0,0 @@
-import type { Snippet } from "svelte";
-/**
- * Card component wrapper providing structured layout with header, content, and footer
- *
- * @prop {string} [title] - Card title (renders in CardHeader with CardTitle)
- * @prop {string} [description] - Card description (renders in CardHeader with CardDescription)
- * @prop {boolean} [hoverable=false] - Enable hover shadow effect for interactive cards
- * @prop {Snippet} [header] - Custom header content (overrides title/description)
- * @prop {Snippet} [footer] - Footer content (rendered in CardFooter)
- * @prop {Snippet} [children] - Main card content (rendered in CardContent)
- * @prop {string} [class] - Additional CSS classes for Card root
- *
- * @example
- * <Card title="Profile" description="Update your profile settings">
- *   <p>Card content here</p>
- * </Card>
- *
- * @example
- * <Card hoverable>
- *   {#snippet header()}
- *     <CustomHeader />
- *   {/snippet}
- *   Content here
- * </Card>
- *
- * @example
- * <Card title="Actions">
- *   {#snippet footer()}
- *     <Button>Save</Button>
- *   {/snippet}
- *   Form content
- * </Card>
- */
-interface Props {
-    title?: string;
-    description?: string;
-    hoverable?: boolean;
-    class?: string;
-    header?: Snippet;
-    footer?: Snippet;
-    children?: Snippet;
-    [key: string]: any;
-}
-declare const Card: import("svelte").Component<Props, {}, "">;
-type Card = ReturnType<typeof Card>;
-export default Card;

package/dist/components/ui/Input.svelte

@@ -1,81 +0,0 @@
-<script lang="ts">
-	import { Input as ShadcnInput } from "./input";
-	import type { HTMLInputAttributes } from "svelte/elements";
-	import { cn } from "../../utils";
-
-	/**
-	 * Input component wrapper with label, error handling, and validation
-	 *
-	 * @prop {string} [label] - Input label text (renders above input)
-	 * @prop {string} [error] - Error message to display (turns border red)
-	 * @prop {string|number} [value] - Input value (bindable for two-way binding)
-	 * @prop {string} [placeholder] - Placeholder text
-	 * @prop {string} [type="text"] - Input type (text|email|password|number)
-	 * @prop {boolean} [required=false] - Whether input is required (shows asterisk)
-	 * @prop {boolean} [disabled=false] - Whether input is disabled
-	 * @prop {string} [class] - Additional CSS classes to apply
-	 *
-	 * @example
-	 * <Input label="Email" type="email" bind:value={email} required />
-	 *
-	 * @example
-	 * <Input label="Password" type="password" bind:value={password} error={passwordError} />
-	 *
-	 * @example
-	 * <Input placeholder="Search..." bind:value={searchQuery} />
-	 */
-	interface Props extends Omit<HTMLInputAttributes, "class"> {
-		label?: string;
-		error?: string;
-		value?: string | number;
-		placeholder?: string;
-		type?: "text" | "email" | "password" | "number";
-		required?: boolean;
-		disabled?: boolean;
-		class?: string;
-	}
-
-	let {
-		label,
-		error,
-		value = $bindable(""),
-		placeholder,
-		type = "text",
-		required = false,
-		disabled = false,
-		class: className,
-		...restProps
-	}: Props = $props();
-
-	const inputClass = $derived(
-		cn(
-			error && "border-destructive focus-visible:ring-destructive/20",
-			className
-		)
-	);
-</script>
-
-<div class="flex flex-col gap-1.5">
-	{#if label}
-		<label class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70">
-			{label}
-			{#if required}
-				<span class="text-destructive">*</span>
-			{/if}
-		</label>
-	{/if}
-
-	<ShadcnInput
-		bind:value
-		{type}
-		{placeholder}
-		{required}
-		{disabled}
-		class={inputClass}
-		{...restProps}
-	/>
-
-	{#if error}
-		<p class="text-sm text-destructive">{error}</p>
-	{/if}
-</div>

package/dist/components/ui/Input.svelte.d.ts

@@ -1,35 +0,0 @@
-import type { HTMLInputAttributes } from "svelte/elements";
-/**
- * Input component wrapper with label, error handling, and validation
- *
- * @prop {string} [label] - Input label text (renders above input)
- * @prop {string} [error] - Error message to display (turns border red)
- * @prop {string|number} [value] - Input value (bindable for two-way binding)
- * @prop {string} [placeholder] - Placeholder text
- * @prop {string} [type="text"] - Input type (text|email|password|number)
- * @prop {boolean} [required=false] - Whether input is required (shows asterisk)
- * @prop {boolean} [disabled=false] - Whether input is disabled
- * @prop {string} [class] - Additional CSS classes to apply
- *
- * @example
- * <Input label="Email" type="email" bind:value={email} required />
- *
- * @example
- * <Input label="Password" type="password" bind:value={password} error={passwordError} />
- *
- * @example
- * <Input placeholder="Search..." bind:value={searchQuery} />
- */
-interface Props extends Omit<HTMLInputAttributes, "class"> {
-    label?: string;
-    error?: string;
-    value?: string | number;
-    placeholder?: string;
-    type?: "text" | "email" | "password" | "number";
-    required?: boolean;
-    disabled?: boolean;
-    class?: string;
-}
-declare const Input: import("svelte").Component<Props, {}, "value">;
-type Input = ReturnType<typeof Input>;
-export default Input;

package/dist/components/ui/Skeleton.svelte

@@ -1,31 +0,0 @@
-<script lang="ts">
-	import { Skeleton as ShadcnSkeleton } from "./skeleton";
-	import type { HTMLAttributes } from "svelte/elements";
-
-	/**
-	 * Skeleton component wrapper for loading placeholders
-	 * Creates animated gray rectangles that indicate loading content
-	 *
-	 * @prop {string} [class] - CSS classes to customize size/shape (e.g., "h-12 w-12 rounded-full")
-	 *
-	 * @example
-	 * <Skeleton class="h-4 w-full" />
-	 *
-	 * @example
-	 * <Skeleton class="h-12 w-12 rounded-full" />
-	 *
-	 * @example
-	 * <div class="flex flex-col gap-2">
-	 *   <Skeleton class="h-6 w-3/4" />
-	 *   <Skeleton class="h-4 w-full" />
-	 *   <Skeleton class="h-4 w-5/6" />
-	 * </div>
-	 */
-	interface Props extends HTMLAttributes<HTMLDivElement> {
-		class?: string;
-	}
-
-	let { class: className, ...restProps }: Props = $props();
-</script>
-
-<ShadcnSkeleton class={className} {...restProps} />

package/dist/components/ui/Skeleton.svelte.d.ts

@@ -1,26 +0,0 @@
-import type { HTMLAttributes } from "svelte/elements";
-/**
- * Skeleton component wrapper for loading placeholders
- * Creates animated gray rectangles that indicate loading content
- *
- * @prop {string} [class] - CSS classes to customize size/shape (e.g., "h-12 w-12 rounded-full")
- *
- * @example
- * <Skeleton class="h-4 w-full" />
- *
- * @example
- * <Skeleton class="h-12 w-12 rounded-full" />
- *
- * @example
- * <div class="flex flex-col gap-2">
- *   <Skeleton class="h-6 w-3/4" />
- *   <Skeleton class="h-4 w-full" />
- *   <Skeleton class="h-4 w-5/6" />
- * </div>
- */
-interface Props extends HTMLAttributes<HTMLDivElement> {
-    class?: string;
-}
-declare const Skeleton: import("svelte").Component<Props, {}, "">;
-type Skeleton = ReturnType<typeof Skeleton>;
-export default Skeleton;

package/dist/components/ui/Textarea.svelte

@@ -1,81 +0,0 @@
-<script lang="ts">
-	import { Textarea as ShadcnTextarea } from "./textarea";
-	import type { HTMLTextareaAttributes } from "svelte/elements";
-	import { cn } from "../../utils";
-
-	/**
-	 * Textarea component wrapper with label, error handling, and validation
-	 *
-	 * @prop {string} [label] - Textarea label text (renders above textarea)
-	 * @prop {string} [error] - Error message to display (turns border red)
-	 * @prop {string} [value] - Textarea value (bindable for two-way binding)
-	 * @prop {string} [placeholder] - Placeholder text
-	 * @prop {number} [rows] - Number of visible text rows
-	 * @prop {boolean} [required=false] - Whether textarea is required (shows asterisk)
-	 * @prop {boolean} [disabled=false] - Whether textarea is disabled
-	 * @prop {string} [class] - Additional CSS classes to apply
-	 *
-	 * @example
-	 * <Textarea label="Description" bind:value={description} required />
-	 *
-	 * @example
-	 * <Textarea label="Notes" bind:value={notes} rows={5} error={notesError} />
-	 *
-	 * @example
-	 * <Textarea placeholder="Enter your message..." bind:value={message} />
-	 */
-	interface Props extends Omit<HTMLTextareaAttributes, "class"> {
-		label?: string;
-		error?: string;
-		value?: string;
-		placeholder?: string;
-		rows?: number;
-		required?: boolean;
-		disabled?: boolean;
-		class?: string;
-	}
-
-	let {
-		label,
-		error,
-		value = $bindable(""),
-		placeholder,
-		rows,
-		required = false,
-		disabled = false,
-		class: className,
-		...restProps
-	}: Props = $props();
-
-	const textareaClass = $derived(
-		cn(
-			error && "border-destructive focus-visible:ring-destructive/20",
-			className
-		)
-	);
-</script>
-
-<div class="flex flex-col gap-1.5">
-	{#if label}
-		<label class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70">
-			{label}
-			{#if required}
-				<span class="text-destructive">*</span>
-			{/if}
-		</label>
-	{/if}
-
-	<ShadcnTextarea
-		bind:value
-		{placeholder}
-		{rows}
-		{required}
-		{disabled}
-		class={textareaClass}
-		{...restProps}
-	/>
-
-	{#if error}
-		<p class="text-sm text-destructive">{error}</p>
-	{/if}
-</div>

package/dist/components/ui/Textarea.svelte.d.ts

@@ -1,35 +0,0 @@
-import type { HTMLTextareaAttributes } from "svelte/elements";
-/**
- * Textarea component wrapper with label, error handling, and validation
- *
- * @prop {string} [label] - Textarea label text (renders above textarea)
- * @prop {string} [error] - Error message to display (turns border red)
- * @prop {string} [value] - Textarea value (bindable for two-way binding)
- * @prop {string} [placeholder] - Placeholder text
- * @prop {number} [rows] - Number of visible text rows
- * @prop {boolean} [required=false] - Whether textarea is required (shows asterisk)
- * @prop {boolean} [disabled=false] - Whether textarea is disabled
- * @prop {string} [class] - Additional CSS classes to apply
- *
- * @example
- * <Textarea label="Description" bind:value={description} required />
- *
- * @example
- * <Textarea label="Notes" bind:value={notes} rows={5} error={notesError} />
- *
- * @example
- * <Textarea placeholder="Enter your message..." bind:value={message} />
- */
-interface Props extends Omit<HTMLTextareaAttributes, "class"> {
-    label?: string;
-    error?: string;
-    value?: string;
-    placeholder?: string;
-    rows?: number;
-    required?: boolean;
-    disabled?: boolean;
-    class?: string;
-}
-declare const Textarea: import("svelte").Component<Props, {}, "value">;
-type Textarea = ReturnType<typeof Textarea>;
-export default Textarea;