mirror of
https://github.com/heygen-com/hyperframes.git
synced 2026-08-31 02:41:44 +00:00
chore(catalog): remove two AI UI items (#3317)
This commit is contained in:
Miguel Ángel
@@ -1,136 +0,0 @@
|
||||
---
|
||||
title: "AI Generation Canvas"
|
||||
description: "A prompt composer expands into a generated dashboard preview."
|
||||
---
|
||||
|
||||
import { InstallCommand } from "/snippets/install-command.jsx";
|
||||
|
||||
<iframe
|
||||
className="w-full aspect-video rounded-xl border-0 bg-zinc-100 dark:bg-zinc-800"
|
||||
title="ai-generation-canvas preview"
|
||||
loading="lazy"
|
||||
srcDoc={`<!doctype html><html><head><meta charset="utf-8"><style>html,body{margin:0;height:100%;overflow:hidden;background:transparent}hyperframes-player{display:block;width:100%;height:100%}</style><script src="https://cdn.jsdelivr.net/npm/@hyperframes/player@0.7/dist/hyperframes-player.global.js"><\/script></head><body><script>fetch("/public/catalog/components/ai-generation-canvas.json").then(function(r){return r.json()}).then(function(d){var p=document.createElement("hyperframes-player");p.setAttribute("srcdoc",d.html);p.setAttribute("controls","");p.setAttribute("autoplay","");p.setAttribute("loop","");p.setAttribute("muted","");p.setAttribute("poster","https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/ai-generation-canvas.png");document.body.appendChild(p)});<\/script></body></html>`}
|
||||
/>
|
||||
|
||||
## Install
|
||||
|
||||
<InstallCommand command="npx hyperframes add ai-generation-canvas" item="ai-generation-canvas" />
|
||||
|
||||
That writes one file: `compositions/components/ai-generation-canvas.html`.
|
||||
|
||||
## Source
|
||||
|
||||
<Accordion title={`ai-generation-canvas.html`}>
|
||||
|
||||
```html
|
||||
<!--
|
||||
AI Generation Canvas - catalog component for HyperFrames.
|
||||
|
||||
Paste the markup and CSS into a composition. Drive the timeline integration
|
||||
from a paused GSAP timeline so renders remain deterministic.
|
||||
-->
|
||||
|
||||
<div class="hf-catalog-ai-generation-canvas">
|
||||
<div class="panel prompt">
|
||||
<h3>AI Generation Canvas</h3>
|
||||
<p>A prompt composer expands into a generated dashboard preview.</p>
|
||||
<div class="pill">Generate scene</div>
|
||||
<div class="pill">Refine motion</div>
|
||||
<div class="pill">Export</div>
|
||||
</div>
|
||||
<div class="panel preview">
|
||||
<div class="card"></div>
|
||||
<div class="card"></div>
|
||||
<div class="card"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.hf-catalog-ai-generation-canvas {
|
||||
--hf-accent: var(--accent, #18181b);
|
||||
--hf-ink: #111827;
|
||||
--hf-muted: #6b7280;
|
||||
--hf-surface: #ffffff;
|
||||
color: var(--hf-ink);
|
||||
font-family: Inter, system-ui, sans-serif;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas {
|
||||
width: 820px;
|
||||
min-height: 460px;
|
||||
border-radius: 34px;
|
||||
padding: 28px;
|
||||
background: linear-gradient(135deg, #fafafa, #e4e4e7);
|
||||
box-shadow: 0 28px 80px rgba(15, 23, 42, 0.18);
|
||||
display: grid;
|
||||
grid-template-columns: 280px 1fr;
|
||||
gap: 22px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .panel {
|
||||
border: 1px solid rgba(15, 23, 42, 0.08);
|
||||
border-radius: 24px;
|
||||
background: rgba(255, 255, 255, 0.76);
|
||||
padding: 22px;
|
||||
backdrop-filter: blur(12px);
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .prompt {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
align-content: start;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .pill {
|
||||
height: 42px;
|
||||
border-radius: 999px;
|
||||
background: #111827;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 18px;
|
||||
font-weight: 800;
|
||||
transform: translateX(var(--hf-pill-x, 0px));
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .preview {
|
||||
display: grid;
|
||||
gap: 14px;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .card {
|
||||
min-height: 78px;
|
||||
border-radius: 18px;
|
||||
background: #fff;
|
||||
box-shadow: 0 14px 40px rgba(15, 23, 42, 0.08);
|
||||
transform: translate(var(--hf-card-x, 0px), var(--hf-card-y, 0px))
|
||||
scale(var(--hf-card-scale, 1));
|
||||
opacity: var(--hf-card-opacity, 1);
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas h3 {
|
||||
margin: 0 0 14px;
|
||||
font-size: 32px;
|
||||
letter-spacing: -0.04em;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas p {
|
||||
margin: 0;
|
||||
color: #475569;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!--
|
||||
Timeline integration:
|
||||
tl.fromTo('.hf-catalog-ai-generation-canvas .pill', { '--hf-pill-x': '-18px', opacity: 0 }, { '--hf-pill-x': '0px', opacity: 1, duration: 0.25, stagger: 0.08, ease: 'power2.out' }, startTime); tl.fromTo('.hf-catalog-ai-generation-canvas .card', { '--hf-card-y': '28px', '--hf-card-scale': 0.96, '--hf-card-opacity': 0 }, { '--hf-card-y': '0px', '--hf-card-scale': 1, '--hf-card-opacity': 1, duration: 0.42, stagger: 0.12, ease: 'power3.out' }, startTime + 0.2);
|
||||
-->
|
||||
```
|
||||
|
||||
</Accordion>
|
||||
|
||||
## Usage
|
||||
|
||||
Open `compositions/components/ai-generation-canvas.html` and paste its contents into your composition. See the comment header in the file for timeline integration guidance.
|
||||
|
||||
{/* hf:generated-footer */}
|
||||
|
||||
Tagged `showcase` `ai`.
|
||||
|
||||
## Related topics
|
||||
|
||||
- [Browse the complete Catalog](/catalog)
|
||||
- [Add assets and Catalog items in Studio](/studio/assets-and-blocks)
|
||||
- [Build a richer composition](/go-further)
|
||||
@@ -1,145 +0,0 @@
|
||||
---
|
||||
title: "AI Prompt Flow"
|
||||
description: "A composed AI prompt flow with prompt field, suggestion chips, generate action, and preview result card"
|
||||
---
|
||||
|
||||
import { InstallCommand } from "/snippets/install-command.jsx";
|
||||
|
||||
<iframe
|
||||
className="w-full aspect-video rounded-xl border-0 bg-zinc-100 dark:bg-zinc-800"
|
||||
title="ai-prompt-flow preview"
|
||||
loading="lazy"
|
||||
srcDoc={`<!doctype html><html><head><meta charset="utf-8"><style>html,body{margin:0;height:100%;overflow:hidden;background:transparent}hyperframes-player{display:block;width:100%;height:100%}</style><script src="https://cdn.jsdelivr.net/npm/@hyperframes/player@0.7/dist/hyperframes-player.global.js"><\/script></head><body><script>fetch("/public/catalog/components/ai-prompt-flow.json").then(function(r){return r.json()}).then(function(d){var p=document.createElement("hyperframes-player");p.setAttribute("srcdoc",d.html);p.setAttribute("controls","");p.setAttribute("autoplay","");p.setAttribute("loop","");p.setAttribute("muted","");p.setAttribute("poster","https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/ai-prompt-flow.png");document.body.appendChild(p)});<\/script></body></html>`}
|
||||
/>
|
||||
|
||||
## Install
|
||||
|
||||
<InstallCommand command="npx hyperframes add ai-prompt-flow" item="ai-prompt-flow" />
|
||||
|
||||
That writes one file: `compositions/components/ai-prompt-flow.html`.
|
||||
|
||||
## Source
|
||||
|
||||
<Accordion title={`ai-prompt-flow.html`}>
|
||||
|
||||
```html
|
||||
<!--
|
||||
AI Prompt Flow - Composed UI flow for HyperFrames.
|
||||
|
||||
Paste the markup and CSS into a composition. Use the timeline integration
|
||||
note at the bottom as the starting point for deterministic GSAP animation.
|
||||
-->
|
||||
|
||||
<div class="hf-ui-ai-prompt-flow">
|
||||
<div class="hf-ui-ai-prompt-panel">
|
||||
<span class="hf-ui-ai-prompt-label">Prompt</span>
|
||||
<div class="hf-ui-ai-prompt-field">Create a launch video for our new feature</div>
|
||||
<div class="hf-ui-ai-prompt-chips">
|
||||
<span>fast cuts</span><span>captions</span><span>product UI</span>
|
||||
</div>
|
||||
<button type="button">Generate</button>
|
||||
</div>
|
||||
<div class="hf-ui-ai-prompt-result">
|
||||
<strong>Preview ready</strong><span>18 scenes matched</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.hf-ui-ai-prompt-flow {
|
||||
display: grid;
|
||||
gap: 18px;
|
||||
width: 620px;
|
||||
color: #18181b;
|
||||
font-family: Inter, system-ui, sans-serif;
|
||||
}
|
||||
.hf-ui-ai-prompt-panel,
|
||||
.hf-ui-ai-prompt-result {
|
||||
border: 1px solid #e4e4e7;
|
||||
border-radius: 26px;
|
||||
background: #ffffff;
|
||||
box-shadow: 0 26px 80px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.hf-ui-ai-prompt-panel {
|
||||
display: grid;
|
||||
gap: 16px;
|
||||
padding: 28px;
|
||||
}
|
||||
.hf-ui-ai-prompt-label {
|
||||
color: #71717a;
|
||||
font-size: 13px;
|
||||
font-weight: 900;
|
||||
letter-spacing: 0.1em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.hf-ui-ai-prompt-field {
|
||||
min-height: 92px;
|
||||
padding: 18px;
|
||||
border-radius: 18px;
|
||||
background: #f4f4f5;
|
||||
font-size: 22px;
|
||||
font-weight: 760;
|
||||
line-height: 1.25;
|
||||
}
|
||||
.hf-ui-ai-prompt-chips {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
.hf-ui-ai-prompt-chips span {
|
||||
padding: 8px 11px;
|
||||
border-radius: 999px;
|
||||
background: #eef2ff;
|
||||
color: #4338ca;
|
||||
font-size: 13px;
|
||||
font-weight: 850;
|
||||
}
|
||||
.hf-ui-ai-prompt-panel button {
|
||||
justify-self: start;
|
||||
height: 46px;
|
||||
padding: 0 20px;
|
||||
border: 0;
|
||||
border-radius: 13px;
|
||||
background: #18181b;
|
||||
color: #ffffff;
|
||||
font-weight: 900;
|
||||
}
|
||||
.hf-ui-ai-prompt-result {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 18px 22px;
|
||||
}
|
||||
.hf-ui-ai-prompt-result strong {
|
||||
font-size: 18px;
|
||||
}
|
||||
.hf-ui-ai-prompt-result span {
|
||||
color: #16a34a;
|
||||
font-size: 14px;
|
||||
font-weight: 850;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!--
|
||||
Timeline integration:
|
||||
tl.fromTo('.hf-ui-ai-prompt-panel', { opacity: 0, y: 26 }, { opacity: 1, y: 0, duration: 0.38, ease: 'power2.out' }, 0.25);
|
||||
tl.fromTo('.hf-ui-ai-prompt-chips span', { y: 14, opacity: 0 }, { y: 0, opacity: 1, duration: 0.24, stagger: 0.06, ease: 'power2.out' }, 0.62);
|
||||
tl.to('.hf-ui-ai-prompt-panel button', { scale: 0.96, duration: 0.12, yoyo: true, repeat: 1, ease: 'power1.inOut' }, 1.0);
|
||||
tl.fromTo('.hf-ui-ai-prompt-result', { opacity: 0, y: 22, scale: 0.97 }, { opacity: 1, y: 0, scale: 1, duration: 0.36, ease: 'back.out(1.3)' }, 1.24);
|
||||
-->
|
||||
```
|
||||
|
||||
</Accordion>
|
||||
|
||||
## Usage
|
||||
|
||||
Open `compositions/components/ai-prompt-flow.html` and paste its contents into your composition. See the comment header in the file for detailed instructions.
|
||||
|
||||
{/* hf:generated-footer */}
|
||||
|
||||
Tagged `ui-flow` `ai` `prompt`.
|
||||
|
||||
## Related topics
|
||||
|
||||
- [Browse the complete Catalog](/catalog)
|
||||
- [Add assets and Catalog items in Studio](/studio/assets-and-blocks)
|
||||
- [Build a richer composition](/go-further)
|
||||
@@ -467,7 +467,6 @@
|
||||
"group": "Showcases",
|
||||
"pages": [
|
||||
"catalog/blocks/ai-chat-reveal",
|
||||
"catalog/components/ai-generation-canvas",
|
||||
"catalog/blocks/app-showcase",
|
||||
"catalog/blocks/apple-money-count",
|
||||
"catalog/blocks/blue-sweater-intro-video",
|
||||
@@ -622,7 +621,6 @@
|
||||
{
|
||||
"group": "Effects",
|
||||
"pages": [
|
||||
"catalog/components/ai-prompt-flow",
|
||||
"catalog/components/avatar-cloud",
|
||||
"catalog/components/beat-timeline",
|
||||
"catalog/components/before-after-wipe",
|
||||
|
||||
@@ -15,31 +15,6 @@
|
||||
"href": "/catalog/blocks/ai-chat-reveal",
|
||||
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/ai-chat-reveal.png"
|
||||
},
|
||||
{
|
||||
"name": "ai-generation-canvas",
|
||||
"type": "component",
|
||||
"title": "AI Generation Canvas",
|
||||
"description": "A prompt composer expands into a generated dashboard preview.",
|
||||
"tags": [
|
||||
"showcase",
|
||||
"ai"
|
||||
],
|
||||
"href": "/catalog/components/ai-generation-canvas",
|
||||
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/ai-generation-canvas.png"
|
||||
},
|
||||
{
|
||||
"name": "ai-prompt-flow",
|
||||
"type": "component",
|
||||
"title": "AI Prompt Flow",
|
||||
"description": "A composed AI prompt flow with prompt field, suggestion chips, generate action, and preview result card",
|
||||
"tags": [
|
||||
"ui-flow",
|
||||
"ai",
|
||||
"prompt"
|
||||
],
|
||||
"href": "/catalog/components/ai-prompt-flow",
|
||||
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/ai-prompt-flow.png"
|
||||
},
|
||||
{
|
||||
"name": "animated-bar-chart",
|
||||
"type": "component",
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -1 +0,0 @@
|
||||
{"html":"<!doctype html>\n<html lang=\"en\">\n <head>\n <meta charset=\"UTF-8\" />\n <meta name=\"viewport\" content=\"width=1920, height=1080\" />\n <title>AI Prompt Flow - Demo</title>\n <script src=\"https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js\"></script>\n <style>\n * {\n box-sizing: border-box;\n }\n html,\n body {\n margin: 0;\n width: 1920px;\n height: 1080px;\n overflow: hidden;\n }\n #demo {\n width: 1920px;\n height: 1080px;\n display: grid;\n place-items: center;\n background: #f4f4f5;\n font-family: Inter, system-ui, sans-serif;\n }\n .demo-frame {\n display: grid;\n place-items: center;\n min-width: 760px;\n min-height: 520px;\n padding: 56px;\n /* ponytail: scale-up only; demo-frame is not a GSAP target */\n transform: scale(2.2);\n transform-origin: center center;\n }\n .hf-ui-ai-prompt-flow {\n display: grid;\n gap: 18px;\n width: 620px;\n color: #18181b;\n font-family: Inter, system-ui, sans-serif;\n }\n .hf-ui-ai-prompt-panel,\n .hf-ui-ai-prompt-result {\n border: 1px solid #e4e4e7;\n border-radius: 26px;\n background: #ffffff;\n box-shadow: 0 26px 80px rgba(0, 0, 0, 0.1);\n }\n .hf-ui-ai-prompt-panel {\n display: grid;\n gap: 16px;\n padding: 28px;\n }\n .hf-ui-ai-prompt-label {\n color: #71717a;\n font-size: 13px;\n font-weight: 900;\n letter-spacing: 0.1em;\n text-transform: uppercase;\n }\n .hf-ui-ai-prompt-field {\n min-height: 92px;\n padding: 18px;\n border-radius: 18px;\n background: #f4f4f5;\n font-size: 22px;\n font-weight: 760;\n line-height: 1.25;\n }\n .hf-ui-ai-prompt-chips {\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n }\n .hf-ui-ai-prompt-chips span {\n padding: 8px 11px;\n border-radius: 999px;\n background: #eef2ff;\n color: #4338ca;\n font-size: 13px;\n font-weight: 850;\n }\n .hf-ui-ai-prompt-panel button {\n justify-self: start;\n height: 46px;\n padding: 0 20px;\n border: 0;\n border-radius: 13px;\n background: #18181b;\n color: #ffffff;\n font-size: 15px;\n font-weight: 700;\n cursor: default;\n }\n .hf-ui-ai-prompt-result {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 18px 22px;\n }\n .hf-ui-ai-prompt-result strong {\n font-size: 18px;\n }\n .hf-ui-ai-prompt-result span {\n color: #16a34a;\n font-size: 14px;\n font-weight: 850;\n }\n </style>\n </head>\n <body>\n <div\n id=\"demo\"\n data-composition-id=\"ai-prompt-flow-demo\"\n data-start=\"0\"\n data-width=\"1920\"\n data-height=\"1080\"\n data-duration=\"5\"\n >\n <div class=\"demo-frame\">\n <div class=\"hf-ui-ai-prompt-flow\">\n <div class=\"hf-ui-ai-prompt-panel\">\n <span class=\"hf-ui-ai-prompt-label\">Prompt</span>\n <div class=\"hf-ui-ai-prompt-field\">Create a launch video for our new feature</div>\n <div class=\"hf-ui-ai-prompt-chips\">\n <span>fast cuts</span><span>captions</span><span>product UI</span>\n </div>\n <button type=\"button\">Generate</button>\n </div>\n <div class=\"hf-ui-ai-prompt-result\">\n <strong>Preview ready</strong><span>18 scenes matched</span>\n </div>\n </div>\n </div>\n <script>\n const tl = gsap.timeline({ paused: true });\n tl.fromTo(\n \".hf-ui-ai-prompt-panel\",\n { opacity: 0, y: 26 },\n { opacity: 1, y: 0, duration: 0.38, ease: \"power2.out\" },\n 0.25,\n );\n tl.fromTo(\n \".hf-ui-ai-prompt-chips span\",\n { y: 14, opacity: 0 },\n { y: 0, opacity: 1, duration: 0.24, stagger: 0.06, ease: \"power2.out\" },\n 0.62,\n );\n tl.to(\n \".hf-ui-ai-prompt-panel button\",\n { scale: 0.96, duration: 0.12, yoyo: true, repeat: 1, ease: \"power1.inOut\" },\n 1.0,\n );\n tl.fromTo(\n \".hf-ui-ai-prompt-result\",\n { opacity: 0, y: 22, scale: 0.97 },\n { opacity: 1, y: 0, scale: 1, duration: 0.36, ease: \"back.out(1.3)\" },\n 1.24,\n );\n tl.set({}, {}, 5);\n window.__timelines = window.__timelines || {};\n window.__timelines[\"ai-prompt-flow-demo\"] = tl;\n </script>\n </div>\n </body>\n</html>\n"}
|
||||
Binary file not shown.
@@ -2,11 +2,9 @@
|
||||
"model": "bge-small-en-v1.5",
|
||||
"modelRevision": "ea104dacec62c0de699686887e3f920caeb4f3e3",
|
||||
"dimensions": 384,
|
||||
"revision": "192d7e2178533342f6242faf4556f7d8d3c23e106b8dbf79170da2aa5ff45adc",
|
||||
"revision": "032078c10ac211b74a29a4826f113876ee4ef14c3e4cf9f935b0ec763cdca97f",
|
||||
"names": [
|
||||
"ai-chat-reveal",
|
||||
"ai-generation-canvas",
|
||||
"ai-prompt-flow",
|
||||
"animated-bar-chart",
|
||||
"app-showcase",
|
||||
"apple-money-count",
|
||||
|
||||
@@ -1,94 +0,0 @@
|
||||
<!--
|
||||
AI Generation Canvas - catalog component for HyperFrames.
|
||||
|
||||
Paste the markup and CSS into a composition. Drive the timeline integration
|
||||
from a paused GSAP timeline so renders remain deterministic.
|
||||
-->
|
||||
|
||||
<div class="hf-catalog-ai-generation-canvas">
|
||||
<div class="panel prompt">
|
||||
<h3>AI Generation Canvas</h3>
|
||||
<p>A prompt composer expands into a generated dashboard preview.</p>
|
||||
<div class="pill">Generate scene</div>
|
||||
<div class="pill">Refine motion</div>
|
||||
<div class="pill">Export</div>
|
||||
</div>
|
||||
<div class="panel preview">
|
||||
<div class="card"></div>
|
||||
<div class="card"></div>
|
||||
<div class="card"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.hf-catalog-ai-generation-canvas {
|
||||
--hf-accent: var(--accent, #18181b);
|
||||
--hf-ink: #111827;
|
||||
--hf-muted: #6b7280;
|
||||
--hf-surface: #ffffff;
|
||||
color: var(--hf-ink);
|
||||
font-family: Inter, system-ui, sans-serif;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas {
|
||||
width: 820px;
|
||||
min-height: 460px;
|
||||
border-radius: 34px;
|
||||
padding: 28px;
|
||||
background: linear-gradient(135deg, #fafafa, #e4e4e7);
|
||||
box-shadow: 0 28px 80px rgba(15, 23, 42, 0.18);
|
||||
display: grid;
|
||||
grid-template-columns: 280px 1fr;
|
||||
gap: 22px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .panel {
|
||||
border: 1px solid rgba(15, 23, 42, 0.08);
|
||||
border-radius: 24px;
|
||||
background: rgba(255, 255, 255, 0.76);
|
||||
padding: 22px;
|
||||
backdrop-filter: blur(12px);
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .prompt {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
align-content: start;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .pill {
|
||||
height: 42px;
|
||||
border-radius: 999px;
|
||||
background: #111827;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 18px;
|
||||
font-weight: 800;
|
||||
transform: translateX(var(--hf-pill-x, 0px));
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .preview {
|
||||
display: grid;
|
||||
gap: 14px;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .card {
|
||||
min-height: 78px;
|
||||
border-radius: 18px;
|
||||
background: #fff;
|
||||
box-shadow: 0 14px 40px rgba(15, 23, 42, 0.08);
|
||||
transform: translate(var(--hf-card-x, 0px), var(--hf-card-y, 0px))
|
||||
scale(var(--hf-card-scale, 1));
|
||||
opacity: var(--hf-card-opacity, 1);
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas h3 {
|
||||
margin: 0 0 14px;
|
||||
font-size: 32px;
|
||||
letter-spacing: -0.04em;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas p {
|
||||
margin: 0;
|
||||
color: #475569;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!--
|
||||
Timeline integration:
|
||||
tl.fromTo('.hf-catalog-ai-generation-canvas .pill', { '--hf-pill-x': '-18px', opacity: 0 }, { '--hf-pill-x': '0px', opacity: 1, duration: 0.25, stagger: 0.08, ease: 'power2.out' }, startTime); tl.fromTo('.hf-catalog-ai-generation-canvas .card', { '--hf-card-y': '28px', '--hf-card-scale': 0.96, '--hf-card-opacity': 0 }, { '--hf-card-y': '0px', '--hf-card-scale': 1, '--hf-card-opacity': 1, duration: 0.42, stagger: 0.12, ease: 'power3.out' }, startTime + 0.2);
|
||||
-->
|
||||
-192
@@ -1,192 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=1920, height=1080" />
|
||||
<title>AI Generation Canvas - Demo</title>
|
||||
<script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
|
||||
<style>
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
width: 1920px;
|
||||
height: 1080px;
|
||||
overflow: hidden;
|
||||
}
|
||||
#demo {
|
||||
width: 1920px;
|
||||
height: 1080px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
background: #f7f7f8;
|
||||
font-family: Inter, system-ui, sans-serif;
|
||||
}
|
||||
.demo-frame {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
padding: 52px;
|
||||
/* ponytail: scale on wrapper (not GSAP target) to fill ~65% of 1920×1080 */
|
||||
transform: scale(1.52);
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas {
|
||||
--hf-accent: var(--accent, #18181b);
|
||||
--hf-ink: #111827;
|
||||
--hf-muted: #6b7280;
|
||||
--hf-surface: #ffffff;
|
||||
color: var(--hf-ink);
|
||||
font-family: Inter, system-ui, sans-serif;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas {
|
||||
width: 820px;
|
||||
min-height: 460px;
|
||||
border-radius: 34px;
|
||||
padding: 28px;
|
||||
background: linear-gradient(135deg, #fafafa, #e4e4e7);
|
||||
box-shadow: 0 28px 80px rgba(15, 23, 42, 0.18);
|
||||
display: grid;
|
||||
grid-template-columns: 280px 1fr;
|
||||
gap: 22px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .panel {
|
||||
border: 1px solid rgba(15, 23, 42, 0.08);
|
||||
border-radius: 24px;
|
||||
background: rgba(255, 255, 255, 0.76);
|
||||
padding: 22px;
|
||||
backdrop-filter: blur(12px);
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .prompt {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
align-content: start;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .pill {
|
||||
height: 42px;
|
||||
border-radius: 999px;
|
||||
background: #111827;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 18px;
|
||||
font-weight: 800;
|
||||
transform: translateX(var(--hf-pill-x, 0px));
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .preview {
|
||||
display: grid;
|
||||
gap: 14px;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .card {
|
||||
min-height: 78px;
|
||||
border-radius: 18px;
|
||||
background: #fff;
|
||||
box-shadow: 0 14px 40px rgba(15, 23, 42, 0.08);
|
||||
transform: translate(var(--hf-card-x, 0px), var(--hf-card-y, 0px))
|
||||
scale(var(--hf-card-scale, 1));
|
||||
opacity: var(--hf-card-opacity, 1);
|
||||
padding: 16px 18px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
/* skeleton bars that make the dashboard cards readable as a thumbnail */
|
||||
.hf-catalog-ai-generation-canvas .card-label {
|
||||
height: 10px;
|
||||
border-radius: 6px;
|
||||
background: #e4e4e7;
|
||||
width: 55%;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .card-bar {
|
||||
height: 8px;
|
||||
border-radius: 6px;
|
||||
background: #f4f4f5;
|
||||
width: 85%;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .card-bar.short {
|
||||
width: 60%;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas .card-accent {
|
||||
height: 28px;
|
||||
border-radius: 8px;
|
||||
background: #d4d4d8;
|
||||
width: 100%;
|
||||
margin-top: 2px;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas h3 {
|
||||
margin: 0 0 14px;
|
||||
font-size: 32px;
|
||||
letter-spacing: -0.04em;
|
||||
}
|
||||
.hf-catalog-ai-generation-canvas p {
|
||||
margin: 0;
|
||||
color: #71717a;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div
|
||||
id="demo"
|
||||
data-composition-id="ai-generation-canvas-demo"
|
||||
data-start="0"
|
||||
data-width="1920"
|
||||
data-height="1080"
|
||||
data-duration="5"
|
||||
>
|
||||
<div class="demo-frame">
|
||||
<div class="hf-catalog-ai-generation-canvas">
|
||||
<div class="panel prompt">
|
||||
<h3>AI Generation Canvas</h3>
|
||||
<p>A prompt composer expands into a generated dashboard preview.</p>
|
||||
<div class="pill">Generate scene</div>
|
||||
<div class="pill">Refine motion</div>
|
||||
<div class="pill">Export</div>
|
||||
</div>
|
||||
<div class="panel preview">
|
||||
<div class="card">
|
||||
<div class="card-label"></div>
|
||||
<div class="card-accent"></div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-label"></div>
|
||||
<div class="card-bar"></div>
|
||||
<div class="card-bar short"></div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-label"></div>
|
||||
<div class="card-bar"></div>
|
||||
<div class="card-bar short"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
const tl = gsap.timeline({ paused: true });
|
||||
const startTime = 0.5;
|
||||
tl.fromTo(
|
||||
".hf-catalog-ai-generation-canvas .pill",
|
||||
{ "--hf-pill-x": "-18px", opacity: 0 },
|
||||
{ "--hf-pill-x": "0px", opacity: 1, duration: 0.25, stagger: 0.08, ease: "power2.out" },
|
||||
startTime,
|
||||
);
|
||||
tl.fromTo(
|
||||
".hf-catalog-ai-generation-canvas .card",
|
||||
{ "--hf-card-y": "28px", "--hf-card-scale": 0.96, "--hf-card-opacity": 0 },
|
||||
{
|
||||
"--hf-card-y": "0px",
|
||||
"--hf-card-scale": 1,
|
||||
"--hf-card-opacity": 1,
|
||||
duration: 0.42,
|
||||
stagger: 0.12,
|
||||
ease: "power3.out",
|
||||
},
|
||||
startTime + 0.2,
|
||||
);
|
||||
tl.set({}, {}, 5);
|
||||
window.__timelines = window.__timelines || {};
|
||||
window.__timelines["ai-generation-canvas-demo"] = tl;
|
||||
</script>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,18 +0,0 @@
|
||||
{
|
||||
"$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
|
||||
"name": "ai-generation-canvas",
|
||||
"type": "hyperframes:component",
|
||||
"title": "AI Generation Canvas",
|
||||
"description": "A prompt composer expands into a generated dashboard preview.",
|
||||
"tags": ["showcase", "ai"],
|
||||
"files": [
|
||||
{
|
||||
"path": "ai-generation-canvas.html",
|
||||
"target": "compositions/components/ai-generation-canvas.html",
|
||||
"type": "hyperframes:snippet"
|
||||
}
|
||||
],
|
||||
"preview": {
|
||||
"poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/ai-generation-canvas.png"
|
||||
}
|
||||
}
|
||||
@@ -1,103 +0,0 @@
|
||||
<!--
|
||||
AI Prompt Flow - Composed UI flow for HyperFrames.
|
||||
|
||||
Paste the markup and CSS into a composition. Use the timeline integration
|
||||
note at the bottom as the starting point for deterministic GSAP animation.
|
||||
-->
|
||||
|
||||
<div class="hf-ui-ai-prompt-flow">
|
||||
<div class="hf-ui-ai-prompt-panel">
|
||||
<span class="hf-ui-ai-prompt-label">Prompt</span>
|
||||
<div class="hf-ui-ai-prompt-field">Create a launch video for our new feature</div>
|
||||
<div class="hf-ui-ai-prompt-chips">
|
||||
<span>fast cuts</span><span>captions</span><span>product UI</span>
|
||||
</div>
|
||||
<button type="button">Generate</button>
|
||||
</div>
|
||||
<div class="hf-ui-ai-prompt-result">
|
||||
<strong>Preview ready</strong><span>18 scenes matched</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.hf-ui-ai-prompt-flow {
|
||||
display: grid;
|
||||
gap: 18px;
|
||||
width: 620px;
|
||||
color: #18181b;
|
||||
font-family: Inter, system-ui, sans-serif;
|
||||
}
|
||||
.hf-ui-ai-prompt-panel,
|
||||
.hf-ui-ai-prompt-result {
|
||||
border: 1px solid #e4e4e7;
|
||||
border-radius: 26px;
|
||||
background: #ffffff;
|
||||
box-shadow: 0 26px 80px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.hf-ui-ai-prompt-panel {
|
||||
display: grid;
|
||||
gap: 16px;
|
||||
padding: 28px;
|
||||
}
|
||||
.hf-ui-ai-prompt-label {
|
||||
color: #71717a;
|
||||
font-size: 13px;
|
||||
font-weight: 900;
|
||||
letter-spacing: 0.1em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.hf-ui-ai-prompt-field {
|
||||
min-height: 92px;
|
||||
padding: 18px;
|
||||
border-radius: 18px;
|
||||
background: #f4f4f5;
|
||||
font-size: 22px;
|
||||
font-weight: 760;
|
||||
line-height: 1.25;
|
||||
}
|
||||
.hf-ui-ai-prompt-chips {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
.hf-ui-ai-prompt-chips span {
|
||||
padding: 8px 11px;
|
||||
border-radius: 999px;
|
||||
background: #eef2ff;
|
||||
color: #4338ca;
|
||||
font-size: 13px;
|
||||
font-weight: 850;
|
||||
}
|
||||
.hf-ui-ai-prompt-panel button {
|
||||
justify-self: start;
|
||||
height: 46px;
|
||||
padding: 0 20px;
|
||||
border: 0;
|
||||
border-radius: 13px;
|
||||
background: #18181b;
|
||||
color: #ffffff;
|
||||
font-weight: 900;
|
||||
}
|
||||
.hf-ui-ai-prompt-result {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 18px 22px;
|
||||
}
|
||||
.hf-ui-ai-prompt-result strong {
|
||||
font-size: 18px;
|
||||
}
|
||||
.hf-ui-ai-prompt-result span {
|
||||
color: #16a34a;
|
||||
font-size: 14px;
|
||||
font-weight: 850;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!--
|
||||
Timeline integration:
|
||||
tl.fromTo('.hf-ui-ai-prompt-panel', { opacity: 0, y: 26 }, { opacity: 1, y: 0, duration: 0.38, ease: 'power2.out' }, 0.25);
|
||||
tl.fromTo('.hf-ui-ai-prompt-chips span', { y: 14, opacity: 0 }, { y: 0, opacity: 1, duration: 0.24, stagger: 0.06, ease: 'power2.out' }, 0.62);
|
||||
tl.to('.hf-ui-ai-prompt-panel button', { scale: 0.96, duration: 0.12, yoyo: true, repeat: 1, ease: 'power1.inOut' }, 1.0);
|
||||
tl.fromTo('.hf-ui-ai-prompt-result', { opacity: 0, y: 22, scale: 0.97 }, { opacity: 1, y: 0, scale: 1, duration: 0.36, ease: 'back.out(1.3)' }, 1.24);
|
||||
-->
|
||||
-168
@@ -1,168 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=1920, height=1080" />
|
||||
<title>AI Prompt Flow - Demo</title>
|
||||
<script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
|
||||
<style>
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
width: 1920px;
|
||||
height: 1080px;
|
||||
overflow: hidden;
|
||||
}
|
||||
#demo {
|
||||
width: 1920px;
|
||||
height: 1080px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
background: #f4f4f5;
|
||||
font-family: Inter, system-ui, sans-serif;
|
||||
}
|
||||
.demo-frame {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
min-width: 760px;
|
||||
min-height: 520px;
|
||||
padding: 56px;
|
||||
/* ponytail: scale-up only; demo-frame is not a GSAP target */
|
||||
transform: scale(2.2);
|
||||
transform-origin: center center;
|
||||
}
|
||||
.hf-ui-ai-prompt-flow {
|
||||
display: grid;
|
||||
gap: 18px;
|
||||
width: 620px;
|
||||
color: #18181b;
|
||||
font-family: Inter, system-ui, sans-serif;
|
||||
}
|
||||
.hf-ui-ai-prompt-panel,
|
||||
.hf-ui-ai-prompt-result {
|
||||
border: 1px solid #e4e4e7;
|
||||
border-radius: 26px;
|
||||
background: #ffffff;
|
||||
box-shadow: 0 26px 80px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.hf-ui-ai-prompt-panel {
|
||||
display: grid;
|
||||
gap: 16px;
|
||||
padding: 28px;
|
||||
}
|
||||
.hf-ui-ai-prompt-label {
|
||||
color: #71717a;
|
||||
font-size: 13px;
|
||||
font-weight: 900;
|
||||
letter-spacing: 0.1em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.hf-ui-ai-prompt-field {
|
||||
min-height: 92px;
|
||||
padding: 18px;
|
||||
border-radius: 18px;
|
||||
background: #f4f4f5;
|
||||
font-size: 22px;
|
||||
font-weight: 760;
|
||||
line-height: 1.25;
|
||||
}
|
||||
.hf-ui-ai-prompt-chips {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
.hf-ui-ai-prompt-chips span {
|
||||
padding: 8px 11px;
|
||||
border-radius: 999px;
|
||||
background: #eef2ff;
|
||||
color: #4338ca;
|
||||
font-size: 13px;
|
||||
font-weight: 850;
|
||||
}
|
||||
.hf-ui-ai-prompt-panel button {
|
||||
justify-self: start;
|
||||
height: 46px;
|
||||
padding: 0 20px;
|
||||
border: 0;
|
||||
border-radius: 13px;
|
||||
background: #18181b;
|
||||
color: #ffffff;
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
cursor: default;
|
||||
}
|
||||
.hf-ui-ai-prompt-result {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 18px 22px;
|
||||
}
|
||||
.hf-ui-ai-prompt-result strong {
|
||||
font-size: 18px;
|
||||
}
|
||||
.hf-ui-ai-prompt-result span {
|
||||
color: #16a34a;
|
||||
font-size: 14px;
|
||||
font-weight: 850;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div
|
||||
id="demo"
|
||||
data-composition-id="ai-prompt-flow-demo"
|
||||
data-start="0"
|
||||
data-width="1920"
|
||||
data-height="1080"
|
||||
data-duration="5"
|
||||
>
|
||||
<div class="demo-frame">
|
||||
<div class="hf-ui-ai-prompt-flow">
|
||||
<div class="hf-ui-ai-prompt-panel">
|
||||
<span class="hf-ui-ai-prompt-label">Prompt</span>
|
||||
<div class="hf-ui-ai-prompt-field">Create a launch video for our new feature</div>
|
||||
<div class="hf-ui-ai-prompt-chips">
|
||||
<span>fast cuts</span><span>captions</span><span>product UI</span>
|
||||
</div>
|
||||
<button type="button">Generate</button>
|
||||
</div>
|
||||
<div class="hf-ui-ai-prompt-result">
|
||||
<strong>Preview ready</strong><span>18 scenes matched</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
const tl = gsap.timeline({ paused: true });
|
||||
tl.fromTo(
|
||||
".hf-ui-ai-prompt-panel",
|
||||
{ opacity: 0, y: 26 },
|
||||
{ opacity: 1, y: 0, duration: 0.38, ease: "power2.out" },
|
||||
0.25,
|
||||
);
|
||||
tl.fromTo(
|
||||
".hf-ui-ai-prompt-chips span",
|
||||
{ y: 14, opacity: 0 },
|
||||
{ y: 0, opacity: 1, duration: 0.24, stagger: 0.06, ease: "power2.out" },
|
||||
0.62,
|
||||
);
|
||||
tl.to(
|
||||
".hf-ui-ai-prompt-panel button",
|
||||
{ scale: 0.96, duration: 0.12, yoyo: true, repeat: 1, ease: "power1.inOut" },
|
||||
1.0,
|
||||
);
|
||||
tl.fromTo(
|
||||
".hf-ui-ai-prompt-result",
|
||||
{ opacity: 0, y: 22, scale: 0.97 },
|
||||
{ opacity: 1, y: 0, scale: 1, duration: 0.36, ease: "back.out(1.3)" },
|
||||
1.24,
|
||||
);
|
||||
tl.set({}, {}, 5);
|
||||
window.__timelines = window.__timelines || {};
|
||||
window.__timelines["ai-prompt-flow-demo"] = tl;
|
||||
</script>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,18 +0,0 @@
|
||||
{
|
||||
"$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
|
||||
"name": "ai-prompt-flow",
|
||||
"type": "hyperframes:component",
|
||||
"title": "AI Prompt Flow",
|
||||
"description": "A composed AI prompt flow with prompt field, suggestion chips, generate action, and preview result card",
|
||||
"tags": ["ui-flow", "ai", "prompt"],
|
||||
"files": [
|
||||
{
|
||||
"path": "ai-prompt-flow.html",
|
||||
"target": "compositions/components/ai-prompt-flow.html",
|
||||
"type": "hyperframes:snippet"
|
||||
}
|
||||
],
|
||||
"preview": {
|
||||
"poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/ai-prompt-flow.png"
|
||||
}
|
||||
}
|
||||
@@ -655,14 +655,6 @@
|
||||
"name": "yt-vertical-fill",
|
||||
"type": "hyperframes:block"
|
||||
},
|
||||
{
|
||||
"name": "ai-generation-canvas",
|
||||
"type": "hyperframes:component"
|
||||
},
|
||||
{
|
||||
"name": "ai-prompt-flow",
|
||||
"type": "hyperframes:component"
|
||||
},
|
||||
{
|
||||
"name": "animated-bar-chart",
|
||||
"type": "hyperframes:component"
|
||||
@@ -1541,6 +1533,6 @@
|
||||
}
|
||||
],
|
||||
"catalogArtifact": {
|
||||
"revision": "192d7e2178533342f6242faf4556f7d8d3c23e106b8dbf79170da2aa5ff45adc"
|
||||
"revision": "032078c10ac211b74a29a4826f113876ee4ef14c3e4cf9f935b0ec763cdca97f"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -37,6 +37,46 @@ const BASE_FLAG = "--base";
|
||||
* its own. Remove an entry once its deletion has landed on the base.
|
||||
*/
|
||||
export const ALLOWED_DELETIONS = new Map([
|
||||
[
|
||||
"docs/catalog/components/ai-generation-canvas.mdx",
|
||||
"owner-directed removal of the AI Generation Canvas catalog item and its generated documentation",
|
||||
],
|
||||
[
|
||||
"docs/catalog/components/ai-prompt-flow.mdx",
|
||||
"owner-directed removal of the AI Prompt Flow catalog item and its generated documentation",
|
||||
],
|
||||
[
|
||||
"docs/public/catalog/components/ai-generation-canvas.json",
|
||||
"owner-directed removal of the AI Generation Canvas catalog item and its generated public payload",
|
||||
],
|
||||
[
|
||||
"docs/public/catalog/components/ai-prompt-flow.json",
|
||||
"owner-directed removal of the AI Prompt Flow catalog item and its generated public payload",
|
||||
],
|
||||
[
|
||||
"registry/components/ai-generation-canvas/ai-generation-canvas.html",
|
||||
"owner-directed removal of the AI Generation Canvas catalog source component",
|
||||
],
|
||||
[
|
||||
"registry/components/ai-generation-canvas/demo.html",
|
||||
"owner-directed removal of the AI Generation Canvas catalog preview source",
|
||||
],
|
||||
[
|
||||
"registry/components/ai-generation-canvas/registry-item.json",
|
||||
"owner-directed removal of the AI Generation Canvas catalog registry entry",
|
||||
],
|
||||
[
|
||||
"registry/components/ai-prompt-flow/ai-prompt-flow.html",
|
||||
"owner-directed removal of the AI Prompt Flow catalog source component",
|
||||
],
|
||||
[
|
||||
"registry/components/ai-prompt-flow/demo.html",
|
||||
"owner-directed removal of the AI Prompt Flow catalog preview source",
|
||||
],
|
||||
[
|
||||
"registry/components/ai-prompt-flow/registry-item.json",
|
||||
"owner-directed removal of the AI Prompt Flow catalog registry entry",
|
||||
],
|
||||
[
|
||||
"packages/studio/src/components/StudioFeedbackBar.tsx",
|
||||
"replaced by components/feedback/StudioFeedbackCard.tsx; too little shared content for git to pair as a rename",
|
||||
|
||||
Reference in New Issue
Block a user