10-of-my-most-popular-text-to-image-series-prompts-78b0897e
generate a bunch of images, then you curate the results to handpick the best ones
Universal AI Interface framework for making applications AI-controllable. Use when adding AI tool decorators, setting up chat adapters, creating AI-callable functions, or integrating CopilotKit.
Follow the repository instructions for this skill and your agent. Review the files and dependencies before adding it to your workflow.
SkillHub CLI
skillhub install ianderrington/supernal-interfaceInspect the source and compatibility requirements, then follow its installation steps.
Give your agent the source link and ask it to inspect instructions and dependencies before explaining the installation steps.
npm install @supernal/interface
Decorate functions → AI can call them with full type safety.
import { Tool } from '@supernal/interface';
class TodoApp {
@Tool({
name: 'add_todo',
description: 'Add a new todo item',
category: 'productivity'
})
async addTodo(text: string): Promise<Todo> {
return this.db.create({ text, done: false });
}
@Tool({
name: 'complete_todo',
description: 'Mark a todo as complete'
})
async completeTodo(id: string): Promise<void> {
await this.db.update(id, { done: true });
}
}
import { createCopilotKitAdapter, ChatUIProvider } from '@supernal/interface';
const adapter = createCopilotKitAdapter({
autoRegisterTools: true,
autoRegisterReadables: true
});
function App() {
return (
<ChatUIProvider adapter={adapter}>
<YourApp />
</ChatUIProvider>
);
}
AI assistants can now discover and call your decorated functions.
| Decorator | Purpose |
|---|---|
@Tool |
Expose function as AI-callable tool |
@ToolProvider |
Class containing multiple tools |
@Component |
React component with AI context |
import { createCopilotKitAdapter } from '@supernal/interface';
const adapter = createCopilotKitAdapter({
autoRegisterTools: true
});
import { ChatUIAdapter } from '@supernal/interface';
class MyAdapter implements ChatUIAdapter {
name = 'my-adapter';
registerTools(tools) { /* convert to your format */ }
render(props) { return <MyChat {...props} />; }
}
import { useToolBinding, usePersistedState, useChatWithContext } from '@supernal/interface';
// Bind a tool to component state
const [todos, setTodos] = us...
These signals come from indexed source analysis and may lag behind changes. Check the current source files.
# Supernal Interface - AI Controllability Framework
## Installation
```bash
npm install @supernal/interface
```
## Core Concept
Decorate functions → AI can call them with full type safety.
## Quick Start
### 1. Decorate Functions
```typescript
import { Tool } from '@supernal/interface';
class TodoApp {
@Tool({
name: 'add_todo',
description: 'Add a new todo item',
category: 'productivity'
})
async addTodo(text: string): Promise<Todo> {
return this.db.create({ text, done: false });
}
@Tool({
name: 'complete_todo',
description: 'Mark a todo as complete'
})
async completeTodo(id: string): Promise<void> {
await this.db.update(id, { done: true });
}
}
```
### 2. Set Up Adapter
```typescript
import { createCopilotKitAdapter, ChatUIProvider } from '@supernal/interface';
const adapter = createCopilotKitAdapter({
autoRegisterTools: true,
autoRegisterReadables: true
});
function App() {
return (
<ChatUIProvider adapter={adapter}>
<YourApp />
</ChatUIProvider>
);
}
```
### 3. Done
AI assistants can now discover and call your decorated functions.
## Decorators
| Decorator | Purpose |
|-----------|---------|
| `@Tool` | Expose function as AI-callable tool |
| `@ToolProvider` | Class containing multiple tools |
| `@Component` | React component with AI context |
## Adapters
### CopilotKit (recommended)
```typescript
import { createCopilotKitAdapter } from '@supernal/interface';
const adapter = createCopilotKitAdapter({
autoRegisterTools: true
});
```
### Custom Adapter
```typescript
import { ChatUIAdapter } from '@supernal/interface';
class MyAdapter implements ChatUIAdapter {
name = 'my-adapter';
registerTools(tools) { /* convert to your format */ }
render(props) { return <MyChat {...props} />; }
}
```
## React Hooks
```typescript
import { useToolBinding, usePersistedState, useChatWithContext } from '@supernal/interface';
// Bind a tool to component state
const [todos, setTodos] = us...generate a bunch of images, then you curate the results to handpick the best ones
generate a bunch of images, then you curate the results to handpick the best ones
Productivity system based on Maya calendar with 13 natural tones for project management and personal development
Set up and use 1Password CLI (op). Use when installing the CLI, enabling desktop app integration, signing in (single or multi-account), or reading/injecting/running secrets via op.