npm - @goldencomm/create-baseline - Versions diffs - 0.0.1 → 0.1.0 - Mend

@goldencomm/create-baseline 0.0.1 → 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (756) hide show

package/templates/next/.claude/skills/ai-elements/references/node.md DELETED Viewed

@@ -1,73 +0,0 @@
-# Node
-A composable node component for React Flow-based canvases with Card-based styling.
-The `Node` component provides a composable, Card-based node for React Flow canvases. It includes support for connection handles, structured layouts, and consistent styling using shadcn/ui components.
-## Installation
-```bash
-npx ai-elements@latest add node
-```
-## Features
-- Built on shadcn/ui Card components for consistent styling
-- Automatic handle placement (left for target, right for source)
-- Composable sub-components (Header, Title, Description, Action, Content, Footer)
-- Semantic structure for organizing node information
-- Pre-styled sections with borders and backgrounds
-- Responsive sizing with fixed small width
-- Full TypeScript support with proper type definitions
-- Compatible with React Flow's node system
-## Props
-### `<Node />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `handles` | `unknown` | - | Configuration for connection handles. Target renders on the left, source on the right. |
-| `className` | `string` | - | Additional CSS classes to apply to the node. |
-| `...props` | `ComponentProps<typeof Card>` | - | Any other props are spread to the underlying Card component. |
-### `<NodeHeader />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `className` | `string` | - | Additional CSS classes to apply to the header. |
-| `...props` | `ComponentProps<typeof CardHeader>` | - | Any other props are spread to the underlying CardHeader component. |
-### `<NodeTitle />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `ComponentProps<typeof CardTitle>` | - | Any other props are spread to the underlying CardTitle component. |
-### `<NodeDescription />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `ComponentProps<typeof CardDescription>` | - | Any other props are spread to the underlying CardDescription component. |
-### `<NodeAction />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `ComponentProps<typeof CardAction>` | - | Any other props are spread to the underlying CardAction component. |
-### `<NodeContent />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `className` | `string` | - | Additional CSS classes to apply to the content. |
-| `...props` | `ComponentProps<typeof CardContent>` | - | Any other props are spread to the underlying CardContent component. |
-### `<NodeFooter />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `className` | `string` | - | Additional CSS classes to apply to the footer. |
-| `...props` | `ComponentProps<typeof CardFooter>` | - | Any other props are spread to the underlying CardFooter component. |

package/templates/next/.claude/skills/ai-elements/references/open-in-chat.md DELETED Viewed

@@ -1,67 +0,0 @@
-# Open In Chat
-A dropdown menu for opening queries in various AI chat platforms including ChatGPT, Claude, T3, Scira, and v0.
-The `OpenIn` component provides a dropdown menu that allows users to open queries in different AI chat platforms with a single click.
-See `scripts/open-in-chat.tsx` for this example.
-## Installation
-```bash
-npx ai-elements@latest add open-in-chat
-```
-## Features
-- Pre-configured links to popular AI chat platforms
-- Context-based query passing for cleaner API
-- Customizable dropdown trigger button
-- Automatic URL parameter encoding for queries
-- Support for ChatGPT, Claude, T3 Chat, Scira AI, v0, and Cursor
-- Branded icons for each platform
-- TypeScript support with proper type definitions
-- Accessible dropdown menu with keyboard navigation
-- External link indicators for clarity
-## Supported Platforms
-- **ChatGPT** - Opens query in OpenAI's ChatGPT with search hints
-- **Claude** - Opens query in Anthropic's Claude AI
-- **T3 Chat** - Opens query in T3 Chat platform
-- **Scira AI** - Opens query in Scira's AI assistant
-- **v0** - Opens query in Vercel's v0 platform
-- **Cursor** - Opens query in Cursor AI editor
-## Props
-### `<OpenIn />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `query` | `string` | - | The query text to be sent to all AI platforms. |
-| `...props` | `React.ComponentProps<typeof DropdownMenu>` | - | Props to spread to the underlying radix-ui DropdownMenu component. |
-### `<OpenInTrigger />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `children` | `React.ReactNode` | - | Custom trigger button. |
-| `...props` | `React.ComponentProps<typeof DropdownMenuTrigger>` | - | Props to spread to the underlying DropdownMenuTrigger component. |
-### `<OpenInContent />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `className` | `string` | - | Additional CSS classes to apply to the dropdown content. |
-| `...props` | `React.ComponentProps<typeof DropdownMenuContent>` | - | Props to spread to the underlying DropdownMenuContent component. |
-### `<OpenInChatGPT />`, `<OpenInClaude />`, `<OpenInT3 />`, `<OpenInScira />`, `<OpenInv0 />`, `<OpenInCursor />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof DropdownMenuItem>` | - | Props to spread to the underlying DropdownMenuItem component. The query is automatically provided via context from the parent OpenIn component. |
-### `<OpenInItem />`, `<OpenInLabel />`, `<OpenInSeparator />`
-Additional composable components for custom dropdown menu items, labels, and separators that follow the same props pattern as their underlying radix-ui counterparts.

package/templates/next/.claude/skills/ai-elements/references/package-info.md DELETED Viewed

@@ -1,95 +0,0 @@
-# Package Info
-Display dependency information and version changes.
-The `PackageInfo` component displays package dependency information including version changes and change type badges.
-See `scripts/package-info.tsx` for this example.
-## Installation
-```bash
-npx ai-elements@latest add package-info
-```
-## Features
-- Version change display (current → new)
-- Color-coded change type badges
-- Dependencies list
-- Description support
-## Change Types
-| Type      | Color  | Use Case           |
-| --------- | ------ | ------------------ |
-| `major`   | Red    | Breaking changes   |
-| `minor`   | Yellow | New features       |
-| `patch`   | Green  | Bug fixes          |
-| `added`   | Blue   | New dependency     |
-| `removed` | Gray   | Removed dependency |
-## Props
-### `<PackageInfo />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `name` | `string` | Required | Package name. |
-| `currentVersion` | `string` | - | Current installed version. |
-| `newVersion` | `string` | - | New version being installed. |
-| `changeType` | `unknown` | - | Type of version change. |
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Spread to the container div. |
-### `<PackageInfoHeader />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Spread to the header div. |
-### `<PackageInfoName />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `children` | `React.ReactNode` | - | Custom name content. Defaults to the name from context. |
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Spread to the container div. |
-### `<PackageInfoChangeType />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `children` | `React.ReactNode` | - | Custom change type label. Defaults to the changeType from context. |
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Spread to the Badge component. |
-### `<PackageInfoVersion />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `children` | `React.ReactNode` | - | Custom version content. Defaults to version transition display. |
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Spread to the container div. |
-### `<PackageInfoDescription />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.HTMLAttributes<HTMLParagraphElement>` | - | Spread to the p element. |
-### `<PackageInfoContent />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Spread to the container div. |
-### `<PackageInfoDependencies />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Spread to the container div. |
-### `<PackageInfoDependency />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `name` | `string` | Required | Dependency name. |
-| `version` | `string` | - | Dependency version. |
-| `...props` | `React.HTMLAttributes<HTMLDivElement>` | - | Spread to the row div. |

package/templates/next/.claude/skills/ai-elements/references/panel.md DELETED Viewed

@@ -1,33 +0,0 @@
-# Panel
-A styled panel component for React Flow-based canvases to position custom UI elements.
-The `Panel` component provides a positioned container for custom UI elements on React Flow canvases. It includes modern card styling with backdrop blur and flexible positioning options.
-## Installation
-```bash
-npx ai-elements@latest add panel
-```
-## Features
-- Flexible positioning (top-left, top-right, bottom-left, bottom-right, top-center, bottom-center)
-- Rounded pill design with backdrop blur
-- Theme-aware card background
-- Flexbox layout for easy content alignment
-- Subtle drop shadow for depth
-- Full TypeScript support
-- Compatible with React Flow's panel system
-## Props
-### `<Panel />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `position` | `unknown` | - | Position of the panel on the canvas. |
-| `className` | `string` | - | Additional CSS classes to apply to the panel. |
-| `...props` | `ComponentProps<typeof Panel>` | - | Any other props from @xyflow/react Panel component. |

package/templates/next/.claude/skills/ai-elements/references/persona.md DELETED Viewed

@@ -1,166 +0,0 @@
-# Persona
-An animated AI visual component powered by Rive that responds to different states like listening, thinking, and speaking.
-The `Persona` component displays an animated AI visual that responds to different conversational states. Built with Rive WebGL2, it provides smooth, high-performance animations for various AI interaction states including idle, listening, thinking, speaking, and asleep. The component supports multiple visual variants to match different design aesthetics.
-See `scripts/persona-obsidian.tsx` for this example.
-## Installation
-```bash
-npx ai-elements@latest add persona
-```
-## Features
-- Smooth state-based animations powered by Rive
-- Multiple visual variants (obsidian, mana, opal, halo, glint, command)
-- Responsive to five distinct states: idle, listening, thinking, speaking, and asleep
-- WebGL2-accelerated rendering for optimal performance
-- Customizable size and styling
-- Lifecycle callbacks for load, ready, pause, play, and stop events
-- TypeScript support with full type definitions
-## Variants
-The Persona component comes with 6 distinct visual variants, each with its own unique aesthetic:
-### Obsidian (Default)
-See `scripts/persona-obsidian.tsx` for this example.
-### Mana
-See `scripts/persona-mana.tsx` for this example.
-### Opal
-See `scripts/persona-opal.tsx` for this example.
-### Halo
-See `scripts/persona-halo.tsx` for this example.
-### Glint
-See `scripts/persona-glint.tsx` for this example.
-### Command
-See `scripts/persona-command.tsx` for this example.
-## Props
-### `<Persona />`
-The root component that renders the animated AI visual.
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `state` | `unknown` | - | The current state of the AI persona. Controls which animation is displayed. |
-| `variant` | `unknown` | - | The visual style variant to display. |
-| `className` | `string` | - | Additional CSS classes to apply to the component. |
-| `onLoad` | `RiveParameters[` | - | Callback fired when the Rive file starts loading. |
-| `onLoadError` | `RiveParameters[` | - | Callback fired if the Rive file fails to load. |
-| `onReady` | `() => void` | - | Callback fired when the Rive animation is ready to play. |
-| `onPause` | `RiveParameters[` | - | Callback fired when the animation is paused. |
-| `onPlay` | `RiveParameters[` | - | Callback fired when the animation starts playing. |
-| `onStop` | `RiveParameters[` | - | Callback fired when the animation is stopped. |
-## States
-The Persona component responds to five distinct states, each triggering different animations:
-- **idle**: The default resting state when the AI is not active
-- **listening**: Displayed when the AI is actively listening to user input (e.g., during voice recording)
-- **thinking**: Shown when the AI is processing or generating a response
-- **speaking**: Active when the AI is delivering a response (e.g., text-to-speech output)
-- **asleep**: A dormant state for when the AI is inactive or in low-power mode
-## React Strict Mode (Vite)
-The Persona component uses WebGL2 for rendering. Browsers limit the number of active WebGL2 contexts (~8–16), and React Strict Mode (enabled by default in Vite dev) double-mounts components, which can exhaust that limit and crash the page.
-The component includes a built-in guard that defers WebGL2 initialization by one frame, preventing context creation during Strict Mode's throw-away mount. This means the component works in Vite dev mode out of the box — no configuration needed.
-If you still experience crashes (for example, when rendering many Persona instances simultaneously), reduce the number of concurrent Persona components on screen.
-## Usage Examples
-### Basic Usage
-```tsx
-import { Persona } from "@repo/elements/persona";
-export default function App() {
-  return <Persona state="listening" variant="opal" />;
-}
-```
-### With State Management
-```tsx
-import { Persona } from "@repo/elements/persona";
-import { useState } from "react";
-export default function App() {
-  const [state, setState] = useState<
-    "idle" | "listening" | "thinking" | "speaking" | "asleep"
-  >("idle");
-  const startListening = () => setState("listening");
-  const startThinking = () => setState("thinking");
-  const startSpeaking = () => setState("speaking");
-  const reset = () => setState("idle");
-  return (
-    <div>
-      <Persona state={state} variant="opal" className="size-32" />
-      <div>
-        <button onClick={startListening}>Listen</button>
-        <button onClick={startThinking}>Think</button>
-        <button onClick={startSpeaking}>Speak</button>
-        <button onClick={reset}>Reset</button>
-      </div>
-    </div>
-  );
-}
-```
-### With Custom Styling
-```tsx
-import { Persona } from "@repo/elements/persona";
-export default function App() {
-  return (
-    <Persona
-      state="thinking"
-      variant="halo"
-      className="size-64 rounded-full border border-border"
-    />
-  );
-}
-```
-### With Lifecycle Callbacks
-```tsx
-import { Persona } from "@repo/elements/persona";
-export default function App() {
-  return (
-    <Persona
-      state="listening"
-      variant="glint"
-      onReady={() => console.log("Animation ready")}
-      onLoad={() => console.log("Starting to load")}
-      onLoadError={(error) => console.error("Failed to load:", error)}
-      onPlay={() => console.log("Animation playing")}
-      onPause={() => console.log("Animation paused")}
-      onStop={() => console.log("Animation stopped")}
-    />
-  );
-}
-```

package/templates/next/.claude/skills/ai-elements/references/plan.md DELETED Viewed

@@ -1,79 +0,0 @@
-# Plan
-A collapsible plan component for displaying AI-generated execution plans with streaming support and shimmer animations.
-The `Plan` component provides a flexible system for displaying AI-generated execution plans with collapsible content. Perfect for showing multi-step workflows, task breakdowns, and implementation strategies with support for streaming content and loading states.
-See `scripts/plan.tsx` for this example.
-## Installation
-```bash
-npx ai-elements@latest add plan
-```
-## Features
-- Collapsible content with smooth animations
-- Streaming support with shimmer loading states
-- Built on shadcn/ui Card and Collapsible components
-- TypeScript support with comprehensive type definitions
-- Customizable styling with Tailwind CSS
-- Responsive design with mobile-friendly interactions
-- Keyboard navigation and accessibility support
-- Theme-aware with automatic dark mode support
-- Context-based state management for streaming
-## Props
-### `<Plan />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `isStreaming` | `boolean` | `false` | Whether content is currently streaming. Enables shimmer animations on title and description. |
-| `defaultOpen` | `boolean` | - | Whether the plan is expanded by default. |
-| `...props` | `React.ComponentProps<typeof Collapsible>` | - | Any other props are spread to the Collapsible component. |
-### `<PlanHeader />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof CardHeader>` | - | Any other props are spread to the CardHeader component. |
-### `<PlanTitle />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `children` | `string` | - | The title text. Displays with shimmer animation when isStreaming is true. |
-| `...props` | `Omit<React.ComponentProps<typeof CardTitle>, ` | - | Any other props (except children) are spread to the CardTitle component. |
-### `<PlanDescription />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `children` | `string` | - | The description text. Displays with shimmer animation when isStreaming is true. |
-| `...props` | `Omit<React.ComponentProps<typeof CardDescription>, ` | - | Any other props (except children) are spread to the CardDescription component. |
-### `<PlanTrigger />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof CollapsibleTrigger>` | - | Any other props are spread to the CollapsibleTrigger component. Renders as a Button with chevron icon. |
-### `<PlanContent />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof CardContent>` | - | Any other props are spread to the CardContent component. |
-### `<PlanFooter />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<` | - | Any other props are spread to the div element. |
-### `<PlanAction />`
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `...props` | `React.ComponentProps<typeof CardAction>` | - | Any other props are spread to the CardAction component. |