loopwind 0.12.0 → 0.12.2
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.
- package/README.md +119 -104
- package/dist/default-templates/AGENTS.md +59 -41
- package/dist/default-templates/image-template/template.tsx +1 -1
- package/dist/default-templates/video-intro/template.tsx +37 -0
- package/dist/default-templates/video-template/template.tsx +4 -21
- package/dist/lib/renderer.d.ts.map +1 -1
- package/dist/lib/renderer.js +8 -2
- package/dist/lib/renderer.js.map +1 -1
- package/package.json +1 -1
- package/FONTS.md +0 -160
- package/HELPERS_DEMO.md +0 -126
- package/PROJECT_STRUCTURE.md +0 -284
- package/PUBLISHING.md +0 -171
- package/SHADCN_INTEGRATION.md +0 -269
- package/TAILWIND.md +0 -228
- package/TEMPLATE_SOURCES.md +0 -347
package/TEMPLATE_SOURCES.md
DELETED
|
@@ -1,347 +0,0 @@
|
|
|
1
|
-
# Installing Templates from Different Sources
|
|
2
|
-
|
|
3
|
-
## Overview
|
|
4
|
-
|
|
5
|
-
loopwind supports installing templates from multiple sources:
|
|
6
|
-
|
|
7
|
-
1. **Official Registry** (default)
|
|
8
|
-
2. **Direct URLs**
|
|
9
|
-
3. **GitHub Repositories**
|
|
10
|
-
4. **Local Filesystem**
|
|
11
|
-
|
|
12
|
-
## 1. Official Registry (Default)
|
|
13
|
-
|
|
14
|
-
Install templates from the official loopwind registry at `https://loopwind.dev/r`
|
|
15
|
-
|
|
16
|
-
```bash
|
|
17
|
-
loopwind add banner-hero
|
|
18
|
-
loopwind add product-card
|
|
19
|
-
loopwind add social-og-image
|
|
20
|
-
```
|
|
21
|
-
|
|
22
|
-
**How it works:**
|
|
23
|
-
- Fetches from: `https://loopwind.dev/r/banner-hero`
|
|
24
|
-
- Returns JSON with template files
|
|
25
|
-
- Installs to: `loopwind/templates/banner-hero/`
|
|
26
|
-
|
|
27
|
-
### Custom Registry
|
|
28
|
-
|
|
29
|
-
Use a different registry:
|
|
30
|
-
|
|
31
|
-
```bash
|
|
32
|
-
loopwind add banner-hero --registry https://my-registry.com/templates
|
|
33
|
-
```
|
|
34
|
-
|
|
35
|
-
## 2. Direct URLs
|
|
36
|
-
|
|
37
|
-
Install a template from any publicly accessible URL:
|
|
38
|
-
|
|
39
|
-
```bash
|
|
40
|
-
loopwind add https://example.com/templates/my-template.json
|
|
41
|
-
loopwind add https://cdn.example.com/templates/awesome-banner.json
|
|
42
|
-
```
|
|
43
|
-
|
|
44
|
-
**Requirements:**
|
|
45
|
-
- URL must return JSON in the registry template format
|
|
46
|
-
- Must be publicly accessible (no authentication)
|
|
47
|
-
|
|
48
|
-
**Example template JSON:**
|
|
49
|
-
|
|
50
|
-
```json
|
|
51
|
-
{
|
|
52
|
-
"name": "my-template",
|
|
53
|
-
"version": "1.0.0",
|
|
54
|
-
"description": "My custom template",
|
|
55
|
-
"files": [
|
|
56
|
-
{
|
|
57
|
-
"path": "template.tsx",
|
|
58
|
-
"content": "export const meta = {...};\n\nexport default function..."
|
|
59
|
-
}
|
|
60
|
-
]
|
|
61
|
-
}
|
|
62
|
-
```
|
|
63
|
-
|
|
64
|
-
## 3. GitHub Repositories
|
|
65
|
-
|
|
66
|
-
Install templates directly from GitHub repos:
|
|
67
|
-
|
|
68
|
-
```bash
|
|
69
|
-
# From a GitHub repo (looks for template.json in repo root)
|
|
70
|
-
loopwind add github:username/repo
|
|
71
|
-
|
|
72
|
-
# From a specific path in the repo
|
|
73
|
-
loopwind add github:username/repo/templates/banner-hero
|
|
74
|
-
|
|
75
|
-
# From an organization
|
|
76
|
-
loopwind add github:myorg/design-templates/social-media/og-image
|
|
77
|
-
```
|
|
78
|
-
|
|
79
|
-
**How it works:**
|
|
80
|
-
- Converts to raw GitHub URLs
|
|
81
|
-
- Fetches `template.json` from the specified path
|
|
82
|
-
- Downloads all referenced files
|
|
83
|
-
- Uses `main` branch by default
|
|
84
|
-
|
|
85
|
-
**Example repo structure:**
|
|
86
|
-
|
|
87
|
-
```
|
|
88
|
-
username/repo/
|
|
89
|
-
└── template.tsx # Contains export const meta + component
|
|
90
|
-
```
|
|
91
|
-
|
|
92
|
-
Or with path:
|
|
93
|
-
|
|
94
|
-
```
|
|
95
|
-
username/repo/
|
|
96
|
-
└── templates/
|
|
97
|
-
└── banner-hero/
|
|
98
|
-
└── template.tsx # Contains export const meta + component
|
|
99
|
-
```
|
|
100
|
-
|
|
101
|
-
**template.json format (for registry):**
|
|
102
|
-
|
|
103
|
-
```json
|
|
104
|
-
{
|
|
105
|
-
"name": "banner-hero",
|
|
106
|
-
"version": "1.0.0",
|
|
107
|
-
"description": "Hero banner template",
|
|
108
|
-
"files": [
|
|
109
|
-
{
|
|
110
|
-
"path": "template.tsx",
|
|
111
|
-
"content": "export const meta = {...};\n\nexport default function..."
|
|
112
|
-
}
|
|
113
|
-
]
|
|
114
|
-
}
|
|
115
|
-
```
|
|
116
|
-
|
|
117
|
-
## 4. Local Filesystem
|
|
118
|
-
|
|
119
|
-
Install templates from your local filesystem:
|
|
120
|
-
|
|
121
|
-
```bash
|
|
122
|
-
# Relative path
|
|
123
|
-
loopwind add ./my-templates/banner-hero
|
|
124
|
-
loopwind add ../shared-templates/product-card
|
|
125
|
-
|
|
126
|
-
# Absolute path
|
|
127
|
-
loopwind add /Users/you/templates/social-card
|
|
128
|
-
```
|
|
129
|
-
|
|
130
|
-
**Requirements:**
|
|
131
|
-
- Directory must contain `template.tsx` with `export const meta`
|
|
132
|
-
- Or a single file `template-name.tsx` with `export const meta`
|
|
133
|
-
- All template files should be in the directory
|
|
134
|
-
|
|
135
|
-
**Example local structure:**
|
|
136
|
-
|
|
137
|
-
```
|
|
138
|
-
my-templates/banner-hero/
|
|
139
|
-
├── template.tsx # Contains export const meta + component
|
|
140
|
-
└── assets/
|
|
141
|
-
└── logo.png
|
|
142
|
-
```
|
|
143
|
-
|
|
144
|
-
**Use cases:**
|
|
145
|
-
- Development and testing
|
|
146
|
-
- Private templates
|
|
147
|
-
- Shared team templates (monorepo)
|
|
148
|
-
- Before publishing to registry
|
|
149
|
-
|
|
150
|
-
## Template Format
|
|
151
|
-
|
|
152
|
-
All sources must provide templates in this format:
|
|
153
|
-
|
|
154
|
-
```typescript
|
|
155
|
-
interface RegistryTemplate {
|
|
156
|
-
name: string;
|
|
157
|
-
version: string;
|
|
158
|
-
description: string;
|
|
159
|
-
files: Array<{
|
|
160
|
-
path: string; // Relative path within template folder
|
|
161
|
-
content: string; // File contents
|
|
162
|
-
}>;
|
|
163
|
-
}
|
|
164
|
-
```
|
|
165
|
-
|
|
166
|
-
## Examples
|
|
167
|
-
|
|
168
|
-
### Example 1: Company Templates on GitHub
|
|
169
|
-
|
|
170
|
-
```bash
|
|
171
|
-
# Install from company repo
|
|
172
|
-
loopwind add github:mycompany/design-templates/marketing/hero-banner
|
|
173
|
-
|
|
174
|
-
# Result: Installs to loopwind/templates/hero-banner/
|
|
175
|
-
```
|
|
176
|
-
|
|
177
|
-
### Example 2: Local Development
|
|
178
|
-
|
|
179
|
-
```bash
|
|
180
|
-
# Create template locally
|
|
181
|
-
mkdir -p my-template
|
|
182
|
-
cd my-template
|
|
183
|
-
|
|
184
|
-
# Create template.tsx with export const meta
|
|
185
|
-
# ...
|
|
186
|
-
|
|
187
|
-
# Install from local
|
|
188
|
-
cd ../my-project
|
|
189
|
-
loopwind add ../my-template
|
|
190
|
-
|
|
191
|
-
# Test it
|
|
192
|
-
loopwind render banner --props props.json
|
|
193
|
-
```
|
|
194
|
-
|
|
195
|
-
### Example 3: Direct URL
|
|
196
|
-
|
|
197
|
-
```bash
|
|
198
|
-
# Install from CDN
|
|
199
|
-
loopwind add https://cdn.mycompany.com/templates/v2/social-card.json
|
|
200
|
-
|
|
201
|
-
# Install from gist (if formatted correctly)
|
|
202
|
-
loopwind add https://gist.githubusercontent.com/user/id/raw/template.json
|
|
203
|
-
```
|
|
204
|
-
|
|
205
|
-
### Example 4: Custom Registry
|
|
206
|
-
|
|
207
|
-
```bash
|
|
208
|
-
# Team's private registry
|
|
209
|
-
loopwind add product-card --registry https://templates.mycompany.com/api
|
|
210
|
-
|
|
211
|
-
# Alternative registry
|
|
212
|
-
loopwind add banner --registry https://awesome-templates.dev/registry
|
|
213
|
-
```
|
|
214
|
-
|
|
215
|
-
## Creating Shareable Templates
|
|
216
|
-
|
|
217
|
-
### For GitHub
|
|
218
|
-
|
|
219
|
-
1. Create a repo with your templates:
|
|
220
|
-
|
|
221
|
-
```
|
|
222
|
-
my-templates/
|
|
223
|
-
├── README.md
|
|
224
|
-
└── templates/
|
|
225
|
-
├── banner-hero/
|
|
226
|
-
│ └── template.tsx # Contains export const meta + component
|
|
227
|
-
└── product-card/
|
|
228
|
-
└── template.tsx # Contains export const meta + component
|
|
229
|
-
```
|
|
230
|
-
|
|
231
|
-
2. Share installation command:
|
|
232
|
-
|
|
233
|
-
```bash
|
|
234
|
-
loopwind add github:username/my-templates/templates/banner-hero
|
|
235
|
-
```
|
|
236
|
-
|
|
237
|
-
### For Direct URL
|
|
238
|
-
|
|
239
|
-
1. Host template JSON on a CDN or static site
|
|
240
|
-
2. Ensure CORS headers allow access
|
|
241
|
-
3. Share the URL:
|
|
242
|
-
|
|
243
|
-
```bash
|
|
244
|
-
loopwind add https://my-cdn.com/templates/banner.json
|
|
245
|
-
```
|
|
246
|
-
|
|
247
|
-
### For Local Sharing (Teams)
|
|
248
|
-
|
|
249
|
-
1. Create templates in shared monorepo:
|
|
250
|
-
|
|
251
|
-
```
|
|
252
|
-
company-monorepo/
|
|
253
|
-
├── apps/
|
|
254
|
-
├── packages/
|
|
255
|
-
└── design-templates/
|
|
256
|
-
├── banner/
|
|
257
|
-
├── card/
|
|
258
|
-
└── hero/
|
|
259
|
-
```
|
|
260
|
-
|
|
261
|
-
2. Team members install with relative paths:
|
|
262
|
-
|
|
263
|
-
```bash
|
|
264
|
-
loopwind add ../../design-templates/banner
|
|
265
|
-
```
|
|
266
|
-
|
|
267
|
-
## Security Considerations
|
|
268
|
-
|
|
269
|
-
### URLs
|
|
270
|
-
- Only download from trusted sources
|
|
271
|
-
- Review template code before using
|
|
272
|
-
- URLs should use HTTPS
|
|
273
|
-
|
|
274
|
-
### GitHub
|
|
275
|
-
- Templates from public repos only
|
|
276
|
-
- Review repository before installing
|
|
277
|
-
- Check template contents
|
|
278
|
-
|
|
279
|
-
### Local
|
|
280
|
-
- Most secure option
|
|
281
|
-
- Full control over template code
|
|
282
|
-
- Good for development/testing
|
|
283
|
-
|
|
284
|
-
## Troubleshooting
|
|
285
|
-
|
|
286
|
-
### "Failed to fetch template"
|
|
287
|
-
|
|
288
|
-
**Registry:**
|
|
289
|
-
- Check template name spelling
|
|
290
|
-
- Verify registry is accessible
|
|
291
|
-
- Try custom registry with `--registry`
|
|
292
|
-
|
|
293
|
-
**URL:**
|
|
294
|
-
- Ensure URL is publicly accessible
|
|
295
|
-
- Check URL returns valid JSON
|
|
296
|
-
- Verify CORS headers
|
|
297
|
-
|
|
298
|
-
**GitHub:**
|
|
299
|
-
- Check repo and path exist
|
|
300
|
-
- Ensure `template.json` exists
|
|
301
|
-
- Verify repo is public
|
|
302
|
-
- Branch must be `main`
|
|
303
|
-
|
|
304
|
-
**Local:**
|
|
305
|
-
- Check path is correct
|
|
306
|
-
- Ensure `template.tsx` exists with `export const meta`
|
|
307
|
-
- Verify file permissions
|
|
308
|
-
|
|
309
|
-
### "Template already installed"
|
|
310
|
-
|
|
311
|
-
Delete existing template and reinstall:
|
|
312
|
-
|
|
313
|
-
```bash
|
|
314
|
-
rm -rf loopwind/templates/banner-hero
|
|
315
|
-
loopwind add github:user/repo/banner-hero
|
|
316
|
-
```
|
|
317
|
-
|
|
318
|
-
## Advanced: Publishing Your Own Registry
|
|
319
|
-
|
|
320
|
-
Create a registry server that responds to:
|
|
321
|
-
|
|
322
|
-
```
|
|
323
|
-
GET /your-template
|
|
324
|
-
```
|
|
325
|
-
|
|
326
|
-
Returns:
|
|
327
|
-
|
|
328
|
-
```json
|
|
329
|
-
{
|
|
330
|
-
"name": "your-template",
|
|
331
|
-
"version": "1.0.0",
|
|
332
|
-
"description": "...",
|
|
333
|
-
"files": [...]
|
|
334
|
-
}
|
|
335
|
-
```
|
|
336
|
-
|
|
337
|
-
Users can install with:
|
|
338
|
-
|
|
339
|
-
```bash
|
|
340
|
-
loopwind add your-template --registry https://your-registry.com
|
|
341
|
-
```
|
|
342
|
-
|
|
343
|
-
See `ROADMAP.md` for future registry features (versioning, search, marketplace).
|
|
344
|
-
|
|
345
|
-
---
|
|
346
|
-
|
|
347
|
-
**Pro tip:** Start with local development, then move to GitHub for sharing, and eventually publish to the official registry!
|