@goldencomm/create-baseline 0.0.1 → 0.1.0

package/templates/next/.claude/skills/ai-elements/references/artifact.md

@@ -1,84 +0,0 @@
-# Artifact
-
-A container component for displaying generated content like code, documents, or other outputs with built-in actions.
-
-The `Artifact` component provides a structured container for displaying generated content like code, documents, or other outputs with built-in header actions.
-
-See `scripts/artifact.tsx` for this example.
-
-## Installation
-
-```bash
-npx ai-elements@latest add artifact
-```
-
-## Features
-
-- Structured container with header and content areas
-- Built-in header with title and description support
-- Flexible action buttons with tooltips
-- Customizable styling for all subcomponents
-- Support for close buttons and action groups
-- Clean, modern design with border and shadow
-- Responsive layout that adapts to content
-- TypeScript support with proper type definitions
-- Composable architecture for maximum flexibility
-
-## Examples
-
-### With Code Display
-
-See `scripts/artifact.tsx` for this example.
-
-## Props
-
-### `<Artifact />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Any other props are spread to the underlying div element. |
-
-### `<ArtifactHeader />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Any other props are spread to the underlying div element. |
-
-### `<ArtifactTitle />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.HTMLAttributes<HTMLParagraphElement>` | - | Any other props are spread to the underlying paragraph element. |
-
-### `<ArtifactDescription />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.HTMLAttributes<HTMLParagraphElement>` | - | Any other props are spread to the underlying paragraph element. |
-
-### `<ArtifactActions />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Any other props are spread to the underlying div element. |
-
-### `<ArtifactAction />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `tooltip` | `string` | - | Tooltip text to display on hover. |
-| `label` | `string` | - | Screen reader label for the action button. |
-| `icon` | `LucideIcon` | - | Lucide icon component to display in the button. |
-| `...props` | `React.ComponentProps<typeof Button>` | - | Any other props are spread to the underlying shadcn/ui Button component. |
-
-### `<ArtifactClose />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof Button>` | - | Any other props are spread to the underlying shadcn/ui Button component. |
-
-### `<ArtifactContent />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Any other props are spread to the underlying div element. |

package/templates/next/.claude/skills/ai-elements/references/attachments.md

@@ -1,190 +0,0 @@
-# Attachments
-
-A flexible, composable attachment component for displaying files, images, videos, audio, and source documents.
-
-The `Attachment` component provides a unified way to display file attachments and source documents with multiple layout variants.
-
-See `scripts/attachments.tsx` for this example.
-
-## Installation
-
-```bash
-npx ai-elements@latest add attachments
-```
-
-## Usage with AI SDK
-
-Display user-uploaded files in chat messages or input areas.
-
-```tsx title="app/page.tsx"
-"use client";
-
-import {
-  Attachments,
-  Attachment,
-  AttachmentPreview,
-  AttachmentInfo,
-  AttachmentRemove,
-} from "@/components/ai-elements/attachments";
-import type { FileUIPart } from "ai";
-
-interface MessageProps {
-  attachments: (FileUIPart & { id: string })[];
-  onRemove?: (id: string) => void;
-}
-
-const MessageAttachments = ({ attachments, onRemove }: MessageProps) => (
-  <Attachments variant="grid">
-    {attachments.map((file) => (
-      <Attachment
-        key={file.id}
-        data={file}
-        onRemove={onRemove ? () => onRemove(file.id) : undefined}
-      >
-        <AttachmentPreview />
-        <AttachmentRemove />
-      </Attachment>
-    ))}
-  </Attachments>
-);
-
-export default MessageAttachments;
-```
-
-## Features
-
-- Three display variants: grid (thumbnails), inline (badges), and list (rows)
-- Supports both FileUIPart and SourceDocumentUIPart from the AI SDK
-- Automatic media type detection (image, video, audio, document, source)
-- Hover card support for inline previews
-- Remove button with customizable callback
-- Composable architecture for maximum flexibility
-- Accessible with proper ARIA labels
-- TypeScript support with exported utility functions
-
-## Examples
-
-### Grid Variant
-
-Best for displaying attachments in messages with visual thumbnails.
-
-See `scripts/attachments.tsx` for this example.
-
-### Inline Variant
-
-Best for compact badge-style display in input areas with hover previews.
-
-See `scripts/attachments-inline.tsx` for this example.
-
-### List Variant
-
-Best for file lists with full metadata display.
-
-See `scripts/attachments-list.tsx` for this example.
-
-## Props
-
-### `<Attachments />`
-
-Container component that sets the layout variant.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `variant` | `unknown` | - | The display layout variant. |
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Spread to the underlying div element. |
-
-### `<Attachment />`
-
-Individual attachment item wrapper.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `data` | `unknown` | - | The attachment data (FileUIPart or SourceDocumentUIPart with id). |
-| `onRemove` | `() => void` | - | Callback fired when the remove button is clicked. |
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Spread to the underlying div element. |
-
-### `<AttachmentPreview />`
-
-Displays the media preview (image, video, or icon).
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `fallbackIcon` | `React.ReactNode` | - | Custom icon to display when no preview is available. |
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Spread to the underlying div element. |
-
-### `<AttachmentInfo />`
-
-Displays the filename and optional media type.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `showMediaType` | `boolean` | `false` | Whether to show the media type below the filename. |
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Spread to the underlying div element. |
-
-### `<AttachmentRemove />`
-
-Remove button that appears on hover.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `label` | `string` | - | Screen reader label for the button. |
-| `...props` | `React.ComponentProps<typeof Button>` | - | Spread to the underlying Button component. |
-
-### `<AttachmentHoverCard />`
-
-Wrapper for hover preview functionality.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `openDelay` | `number` | `0` | Delay in ms before opening the hover card. |
-| `closeDelay` | `number` | `0` | Delay in ms before closing the hover card. |
-| `...props` | `React.ComponentProps<typeof HoverCard>` | - | Spread to the underlying HoverCard component. |
-
-### `<AttachmentHoverCardTrigger />`
-
-Trigger element for the hover card.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof HoverCardTrigger>` | - | Spread to the underlying HoverCardTrigger component. |
-
-### `<AttachmentHoverCardContent />`
-
-Content displayed in the hover card.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `align` | `unknown` | - | Alignment of the hover card content. |
-| `...props` | `React.ComponentProps<typeof HoverCardContent>` | - | Spread to the underlying HoverCardContent component. |
-
-### `<AttachmentEmpty />`
-
-Empty state component when no attachments are present.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Spread to the underlying div element. |
-
-## Utility Functions
-
-### `getMediaCategory(data)`
-
-Returns the media category for an attachment.
-
-```tsx
-import { getMediaCategory } from "@/components/ai-elements/attachments";
-
-const category = getMediaCategory(attachment);
-// Returns: "image" | "video" | "audio" | "document" | "source" | "unknown"
-```
-
-### `getAttachmentLabel(data)`
-
-Returns the display label for an attachment.
-
-```tsx
-import { getAttachmentLabel } from "@/components/ai-elements/attachments";
-
-const label = getAttachmentLabel(attachment);
-// Returns filename or fallback like "Image" or "Attachment"
-```

package/templates/next/.claude/skills/ai-elements/references/audio-player.md

@@ -1,134 +0,0 @@
-# Audio Player
-
-A composable audio player component built on media-chrome, with shadcn styling and flexible controls.
-
-The `AudioPlayer` component provides a flexible and customizable audio playback interface built on top of media-chrome. It features a composable architecture that allows you to build audio experiences with custom controls, metadata display, and seamless integration with AI-generated audio content.
-
-See `scripts/audio-player.tsx` for this example.
-
-## Installation
-
-```bash
-npx ai-elements@latest add audio-player
-```
-
-## Features
-
-- Built on media-chrome for reliable audio playback
-- Fully composable architecture with granular control components
-- ButtonGroup integration for cohesive control layout
-- Individual control components (play, seek, volume, etc.)
-- Flexible layout with customizable control bars
-- CSS custom properties for deep theming
-- Shadcn/ui Button component styling
-- Responsive design that works across devices
-- Full TypeScript support with proper types for all components
-
-## Variants
-
-### AI SDK Speech Result
-
-The `AudioPlayer` component can be used to play audio from an AI SDK Speech Result.
-
-See `scripts/audio-player.tsx` for this example.
-
-### Remote Audio
-
-The `AudioPlayer` component can be used to play remote audio files.
-
-See `scripts/audio-player-remote.tsx` for this example.
-
-## Props
-
-### `<AudioPlayer />`
-
-Root MediaController component. Accepts all MediaController props except `audio` (which is set to `true` by default).
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `style` | `CSSProperties` | - | Custom CSS properties can be passed to override media-chrome theming variables. |
-| `...props` | `Omit<React.ComponentProps<typeof MediaController>, ` | - | Any other props are spread to the MediaController component. |
-
-### `<AudioPlayerElement />`
-
-The audio element that contains the media source. Accepts either a remote URL or AI SDK Speech Result data.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `src` | `string` | - | The URL of the audio file to play (for remote audio). |
-| `data` | `SpeechResult[` | - | AI SDK Speech Result audio data with base64 encoding (for AI-generated audio). |
-| `...props` | `Omit<React.ComponentProps<` | - | Any other props are spread to the audio element (excluding src when using data). |
-
-### `<AudioPlayerControlBar />`
-
-Container for control buttons, wraps children in a ButtonGroup.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof MediaControlBar>` | - | Any other props are spread to the MediaControlBar component. |
-
-### `<AudioPlayerPlayButton />`
-
-Play/pause button wrapped in a shadcn Button component.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof MediaPlayButton>` | - | Any other props are spread to the MediaPlayButton component. |
-
-### `<AudioPlayerSeekBackwardButton />`
-
-Seek backward button wrapped in a shadcn Button component.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `seekOffset` | `number` | `10` | The number of seconds to seek backward. |
-| `...props` | `React.ComponentProps<typeof MediaSeekBackwardButton>` | - | Any other props are spread to the MediaSeekBackwardButton component. |
-
-### `<AudioPlayerSeekForwardButton />`
-
-Seek forward button wrapped in a shadcn Button component.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `seekOffset` | `number` | `10` | The number of seconds to seek forward. |
-| `...props` | `React.ComponentProps<typeof MediaSeekForwardButton>` | - | Any other props are spread to the MediaSeekForwardButton component. |
-
-### `<AudioPlayerTimeDisplay />`
-
-Displays the current playback time, wrapped in ButtonGroupText.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof MediaTimeDisplay>` | - | Any other props are spread to the MediaTimeDisplay component. |
-
-### `<AudioPlayerTimeRange />`
-
-Seek slider for controlling playback position, wrapped in ButtonGroupText.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof MediaTimeRange>` | - | Any other props are spread to the MediaTimeRange component. |
-
-### `<AudioPlayerDurationDisplay />`
-
-Displays the total duration of the audio, wrapped in ButtonGroupText.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof MediaDurationDisplay>` | - | Any other props are spread to the MediaDurationDisplay component. |
-
-### `<AudioPlayerMuteButton />`
-
-Mute/unmute button, wrapped in ButtonGroupText.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof MediaMuteButton>` | - | Any other props are spread to the MediaMuteButton component. |
-
-### `<AudioPlayerVolumeRange />`
-
-Volume slider control, wrapped in ButtonGroupText.
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof MediaVolumeRange>` | - | Any other props are spread to the MediaVolumeRange component. |

package/templates/next/.claude/skills/ai-elements/references/canvas.md

@@ -1,34 +0,0 @@
-# Canvas
-
-A React Flow-based canvas component for building interactive node-based interfaces.
-
-The `Canvas` component provides a React Flow-based canvas for building interactive node-based interfaces. It comes pre-configured with sensible defaults for AI applications, including panning, zooming, and selection behaviors.
-
-
-
-## Installation
-
-```bash
-npx ai-elements@latest add canvas
-```
-
-## Features
-
-- Pre-configured React Flow canvas with AI-optimized defaults
-- Pan on scroll enabled for intuitive navigation
-- Selection on drag for multi-node operations
-- Customizable background color using CSS variables
-- Delete key support (Backspace and Delete keys)
-- Auto-fit view to show all nodes
-- Disabled double-click zoom for better UX
-- Disabled pan on drag to prevent accidental canvas movement
-- Fully compatible with React Flow props and API
-
-## Props
-
-### `<Canvas />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `children` | `ReactNode` | - | Child components like Background, Controls, or MiniMap. |
-| `...props` | `ReactFlowProps` | - | Any other React Flow props like nodes, edges, nodeTypes, edgeTypes, onNodesChange, etc. |

package/templates/next/.claude/skills/ai-elements/references/chain-of-thought.md

@@ -1,81 +0,0 @@
-# Chain of Thought
-
-A collapsible component that visualizes AI reasoning steps with support for search results, images, and step-by-step progress indicators.
-
-The `ChainOfThought` component provides a visual representation of an AI's reasoning process, showing step-by-step thinking with support for search results, images, and progress indicators. It helps users understand how AI arrives at conclusions.
-
-See `scripts/chain-of-thought.tsx` for this example.
-
-## Installation
-
-```bash
-npx ai-elements@latest add chain-of-thought
-```
-
-## Features
-
-- Collapsible interface with smooth animations powered by Radix UI
-- Step-by-step visualization of AI reasoning process
-- Support for different step statuses (complete, active, pending)
-- Built-in search results display with badge styling
-- Image support with captions for visual content
-- Custom icons for different step types
-- Context-aware components using React Context API
-- Fully typed with TypeScript
-- Accessible with keyboard navigation support
-- Responsive design that adapts to different screen sizes
-- Smooth fade and slide animations for content transitions
-- Composable architecture for flexible customization
-
-## Props
-
-### `<ChainOfThought />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `open` | `boolean` | - | Controlled open state of the collapsible. |
-| `defaultOpen` | `boolean` | `false` | Default open state when uncontrolled. |
-| `onOpenChange` | `(open: boolean) => void` | - | Callback when the open state changes. |
-| `...props` | `React.ComponentProps<` | - | Any other props are spread to the root div element. |
-
-### `<ChainOfThoughtHeader />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `children` | `React.ReactNode` | - | Custom header text. |
-| `...props` | `React.ComponentProps<typeof CollapsibleTrigger>` | - | Any other props are spread to the CollapsibleTrigger component. |
-
-### `<ChainOfThoughtStep />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `icon` | `LucideIcon` | `DotIcon` | Icon to display for the step. |
-| `label` | `string` | - | The main text label for the step. |
-| `description` | `string` | - | Optional description text shown below the label. |
-| `status` | `unknown` | - | Visual status of the step. |
-| `...props` | `React.ComponentProps<` | - | Any other props are spread to the root div element. |
-
-### `<ChainOfThoughtSearchResults />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<` | - | Any props are spread to the container div element. |
-
-### `<ChainOfThoughtSearchResult />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof Badge>` | - | Any props are spread to the Badge component. |
-
-### `<ChainOfThoughtContent />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof CollapsibleContent>` | - | Any props are spread to the CollapsibleContent component. |
-
-### `<ChainOfThoughtImage />`
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `caption` | `string` | - | Optional caption text displayed below the image. |
-| `...props` | `React.ComponentProps<` | - | Any other props are spread to the container div element. |