@agent-native/core 0.76.5 → 0.76.6

package/docs/content/locales/ko-KR/template-analytics.md

@@ -0,0 +1,259 @@
+---
+title: "분석"
+description: "평이한 영어로 분석 질문을 하고 차트와 대시보드를 다시 받아보세요. Amplitude, Mixpanel 및 Looker를 대체하는 오픈 소스입니다."
+---
+
+# 분석
+
+평이한 영어로 분석 질문을 하고 차트와 대시보드를 다시 받아보세요. 에이전트는 BigQuery, GA4, Amplitude, 내장된 자사 이벤트 수집기, HubSpot, Jira 및 기타 12개 소스에 연결하여 쿼리를 작성하고 검증한 후 답변을 차트, 테이블 또는 저장된 대시보드 패널로 렌더링합니다.
+
+```an-wireframe
+{
+  "surface": "desktop",
+  "html": "<div style='display:flex;flex-direction:column;gap:14px;padding:18px;min-height:500px;box-sizing:border-box'><h1 style='margin:0'>Agent-Native Templates</h1><p class='wf-muted' style='margin:0'>Adoption and engagement across the last 12 weeks.</p><div style='display:grid;grid-template-columns:repeat(3,1fr);gap:12px'><div class='wf-card'><small class='wf-muted'>Weekly active users</small><br/><strong>24,318</strong><br/><span class='wf-pill accent'>+12.4%</span></div><div class='wf-card'><small class='wf-muted'>New signups</small><br/><strong>1,842</strong><br/><span class='wf-pill accent'>+8.7%</span></div><div class='wf-card'><small class='wf-muted'>Revenue MRR</small><br/><strong>$48,210</strong><br/><span class='wf-pill accent'>+21.3%</span></div></div><div style='display:grid;grid-template-columns:1fr 1fr;gap:12px;flex:1'><div class='wf-card' style='display:flex;flex-direction:column;gap:10px'><strong>Weekly active users</strong><div style='flex:1;display:flex;align-items:end;gap:8px'><div style='height:38%;flex:1;background:var(--wf-accent-soft)'></div><div style='height:44%;flex:1;background:var(--wf-accent-soft)'></div><div style='height:58%;flex:1;background:var(--wf-accent-soft)'></div><div style='height:74%;flex:1;background:var(--wf-accent-soft)'></div></div></div><div class='wf-card' style='display:flex;flex-direction:column;gap:10px'><strong>Revenue over time</strong><div style='flex:1;display:flex;align-items:end;gap:8px'><div style='height:32%;flex:1;background:var(--wf-accent-soft)'></div><div style='height:48%;flex:1;background:var(--wf-accent-soft)'></div><div style='height:63%;flex:1;background:var(--wf-accent-soft)'></div><div style='height:80%;flex:1;background:var(--wf-accent-soft)'></div></div></div></div><div class='wf-card'><strong>Signups by source</strong><br/><small class='wf-muted'>Lower chart begins below the main charts.</small></div></div>"
+}
+```
+
+코드, 쿼리 및 데이터를 소유하려는 팀을 위한 Amplitude, Mixpanel 및 Looker를 대체하는 오픈 소스입니다.
+
+```an-diagram title="Question to chart" summary="The agent consults the data dictionary, writes SQL, validates it against the warehouse, then renders a chart or saves a panel."
+{
+  "html": "<div class=\"diagram-flow\"><div class=\"diagram-node\">Plain-English<br>question</div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel center\"><span class=\"diagram-pill accent\">Agent</span><small class=\"diagram-muted\">reads data dictionary</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough>Writes SQL</div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-col\"><div class=\"diagram-pill ok\">Dry-run validate</div><small class=\"diagram-muted\">BigQuery / source</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\">Chart, table, or<br>saved panel</div></div>",
+  "css": ".diagram-flow{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.diagram-flow .diagram-col{display:flex;flex-direction:column;gap:6px;align-items:center}.diagram-flow .center{display:flex;flex-direction:column;align-items:center;gap:4px}.diagram-flow .diagram-arrow{font-size:22px;line-height:1}"
+}
+```
+
+## 그것으로 무엇을 할 수 있나요
+
+- **쉬운 영어로 데이터 질문을 하세요.** "지난달 가입 중 몇 퍼센트가 유료로 전환되었습니까?" 또는 "지난 6개월 동안의 주간 활성 사용자를 보여주세요." 에이전트는 올바른 소스를 선택하고 SQL를 작성한 후 차트를 렌더링합니다.
+- **필터, 저장된 보기 및 매개변수 쿼리를 사용하여 재사용 가능한 SQL 대시보드**를 구축하세요.
+- **여러 데이터 소스를 상호 참조하는 임시 분석을 실행**합니다. 원래 질문, 지침 및 결과와 함께 다시 실행 가능한 조사로 저장됩니다.
+- **메트릭, 테이블 및 SQL 레시피의 살아있는 데이터 사전**을 유지 관리하여 에이전트가 매번 올바른 열 이름을 사용할 수 있도록 합니다(실제로 `hs_is_closed`일 때 더 이상 `is_closed`를 추측하지 않음).
+- 팀과 **대시보드 공유** - 기본적으로 비공개이며 사용자별 또는 조직별로 뷰어/편집자/관리자 역할로 공유 가능합니다.
+- **BigQuery, GA4, Mixpanel, Amplitude, PostHog, HubSpot, Jira, Apollo, Pylon, Gong, Common Room, Twitter 및 앱별 SEO 소스 등 다양한 소스에 바로 연결 가능**
+- **워크스페이스 통합 재사용** 작업공간이 이미 연결되어 있는 경우
+  Analytics에 공급자를 부여했습니다. 공유 통합 저장소 제공자
+  신원 및 자격 증명 참조; Analytics는 앱별 소스 선택을 유지합니다.
+  데이터 사전 항목, 대시보드 SQL 및 분석 기록.
+
+## 시작하기
+
+라이브 데모: [analytics.agent-native.com](https://analytics.agent-native.com).
+
+처음 앱을 열 때:
+
+1. Google로 로그인하세요.
+2. 사이드바에서 **데이터 소스** 페이지를 엽니다.
+3. 각 소스에는 둘러보기가 있습니다. 필요한 소스를 연결하세요(BigQuery, GA4, Amplitude 또는 자사 추적과 같은 소스부터 시작하세요).
+4. 상담원과 새 채팅을 열고 "지난 주에 몇 건의 가입이 이루어졌나요?"라고 질문하세요.
+
+첫 번째 질문으로 연결이 제대로 작동하는지 확인할 수 있습니다. 그런 다음 상담원에게 "이것을 대시보드로 저장"하거나 "주요 측정항목에 대한 4패널 개요 대시보드를 구축"하라고 요청하세요.
+
+### 유용한 메시지
+
+- "지난 6개월 동안의 주간 활성 사용자를 표시하는 대시보드를 구축하세요."
+- "지난달 가입 중 몇 퍼센트가 유료로 전환되었습니까?"
+- "이 대시보드에 계획별 수익을 비교하는 차트를 추가하세요."
+- "MRR 측정항목이 먼저 나오도록 이 대시보드의 패널 순서를 변경하세요."
+- "1분기의 종료되고 손실된 거래를 분석하고 분석 내용을 저장합니다."
+- "이달의 데이터로 이탈 분석을 다시 실행합니다."
+- "이 측정항목을 데이터 사전에 문서화하세요."
+
+에이전트는 현재 대시보드, 필터, 보기 등 사용자가 무엇을 보고 있는지 항상 알고 있으므로 명시적으로 말하지 않고도 "이 대시보드" 또는 "저 패널"이라고 말할 수 있습니다.
+
+## 알아야 할 세 가지 사항
+
+앱에는 시간을 보낼 수 있는 세 가지 주요 표면이 있습니다.
+
+- **SQL 대시보드** — 필터와 저장된 보기가 포함된 재사용 가능한 패널입니다. 정기적으로 확인하는 측정항목에 가장 적합합니다.
+- **임시 분석** — 재실행 지침이 함께 저장된 여러 소스에서 가져온 장문의 조사입니다. 다시 확인하고 싶은 일회성 질문에 가장 적합합니다.
+- **데이터 사전** — 측정항목, 테이블, 열 및 SQL 레시피의 표준 카탈로그입니다. 에이전트는 SQL를 작성하기 전에 이를 참조하므로 실제 웨어하우스 열 이름을 사용하고 "내부 이메일 제외"와 같은 주의 사항을 알고 있습니다.
+
+사전은 에이전트에게 "dbt 정의 가져오기" 또는 "Notion 핸드북에서 측정항목 가져오기"를 요청하여 시드되며 작업을 수행합니다.
+
+## 개발자용
+
+이 문서의 나머지 부분은 Analytics 템플릿을 포크하거나 확장하는 모든 사람을 위한 것입니다.
+
+### 빠른 시작
+
+CLI에서 새 Analytics 앱 만들기:
+
+```bash
+npx @agent-native/core@latest create my-analytics --standalone --template analytics
+```
+
+로컬 개발자:
+
+```bash
+cd my-analytics
+pnpm install
+pnpm dev
+```
+
+CLI는 로컬 개발자 URL를 인쇄합니다. Google에 로그인한 다음 **데이터 소스** 페이지를 열어 BigQuery, GA4, 자사 추적, HubSpot, Jira 등을 연결하세요.
+
+### 주요 기능
+
+**질문하고 차트를 받으세요.** 에이전트는 데이터 소스를 선택하고 SQL를 작성 및 확인한 다음 차트, 표, 측정항목 또는 저장된 패널을 렌더링합니다.
+
+**대시보드 및 조사.** 재사용 가능한 대시보드는 SQL 패널, 필터, 저장된 보기 및 공유를 유지합니다. 임시 분석은 재실행 지침을 통해 더 긴 결과를 저장합니다.
+
+**실시간 데이터 사전.** 측정항목 정의, 소유자, 소스 테이블 및 알려진 주의 사항은 에이전트가 쿼리를 작성하기 전에 실제 웨어하우스 어휘를 제공합니다.
+
+**광범위한 커넥터 표면.** BigQuery, GA4, 제품 분석, CRM, 지원, 커뮤니티, GitHub/Jira, SEO 및 자사 `/track` 이벤트는 모두 에이전트가 호출할 수 있는 actions를 통해 제공됩니다.
+
+### 에이전트와 협력하기
+
+에이전트는 항상 귀하가 무엇을 보고 있는지 알고 있습니다. 현재 화면 상태는 모든 메시지에 `<current-screen>` 블록으로 삽입됩니다. 여기에는 활성 보기, 열려 있는 대시보드 또는 분석, 선택한 필터가 포함됩니다.
+
+에이전트의 시스템 프롬프트는 활성 조직에 대해 승인된 메트릭 항목과 함께 삽입된 `<data-dictionary>` 블록을 가져옵니다. 대시보드를 요청하면 상담원은 먼저 사전을 참조하고 문서화된 `table` / `columns` / `queryTemplate` 축어를 사용하며 열 이름을 추측하지 않습니다.
+
+**자동으로 포함되는 컨텍스트:**
+
+- **현재 보기** — `overview`, `adhoc`(`dashboardId` 포함), `analyses`(`analysisId` 포함), `data-dictionary`, `data-sources` 또는 `settings`.
+- **활성 조직** — 모든 쿼리 및 쓰기 범위를 지정합니다.
+- **승인된 사전 항목** — 활성 작업공간용.
+
+**대시보드 편집.** 에이전트는 `update-dashboard` 작업을 사용하여 대시보드를 편집합니다. 두 가지 모드를 지원합니다:
+
+- `ops` — 수술 편집을 위한 JSON-포인터 패치(패널 이동, SQL 문자열 하나 교체, 필터 제거).
+- `config` — 대시보드 구성을 완전히 교체했습니다.
+
+모든 BigQuery 패널의 SQL는 대시보드가 저장되기 전에 웨어하우스에 대해 테스트 실행됩니다. 열이 잘못된 경우 BigQuery 오류로 인해 저장이 거부됩니다. 에이전트는 손상된 패널을 유지하는 대신 SQL를 수정하고 재시도합니다.
+
+### 데이터 소스 연결
+
+**데이터 소스** 페이지(`/data-sources`)를 열어 공급자를 연결하세요. 각각
+소스는 env-key 목록, 연습 및 **연결 테스트** 버튼을 노출합니다.
+분석이 작업 공간에서 실행되면 `data-source-status`도 보고합니다
+`appId=analytics`에 재사용 가능한 작업 공간 연결을 부여하여 에이전트가 다음 작업을 수행할 수 있게 했습니다.
+동일한 공급자 키의 다른 사본 대신 앱 부여를 요청하세요.
+Slack, HubSpot, Notion 및 GitHub와 같은 재사용 가능한 공급자의 경우 데이터
+소스 UI는 공유 통합 상태를 직접 보여줍니다: 작업 공간을 통해 준비됨,
+허가 필요, 자격 증명 또는 로컬 자격 증명이 필요합니다.
+
+재사용 가능한 작업 공간 통합은 공유 공급자의 런타임 방향입니다.
+프레임워크는 공급자 ID, 계정 메타데이터, 자격 증명 참조 및
+앱당 한 번만 부여됩니다. Analytics는 데이터 소스 해석, 소스를 저장합니다.
+진실 선택, 지표 정의, 대시보드 및 분석
+
+자격 증명은 프레임워크의 설정/환경 계층을 통해 저장됩니다. git에는 비밀이 없습니다. 제작 요구사항:
+
+| 변수                                     | 목적                                        |
+| ---------------------------------------- | ------------------------------------------- |
+| `DATABASE_URL`                           | 지속적인 SQL 연결 URL                       |
+| `BETTER_AUTH_SECRET` / `BETTER_AUTH_URL` | 인증                                        |
+| `GOOGLE_SIGN_IN_CLIENT_ID` / `_SECRET`   | 기본 Google 로그인 클라이언트(OAuth 2.0)    |
+| `GOOGLE_CLIENT_ID` / `_SECRET`           | 기존 로그인 대체/Google API 통합 클라이언트 |
+| `BIGQUERY_PROJECT_ID`                    | BigQuery 프로젝트                           |
+| `GOOGLE_APPLICATION_CREDENTIALS_JSON`    | BigQuery 서비스 계정 JSON                   |
+| `ANTHROPIC_API_KEY`                      | 에이전트 채팅                               |
+
+공급자별 키(HubSpot, Jira, Gong, Pylon 등)는 데이터 소스 페이지의 각 소스 연습에 문서화되어 있습니다. API 키가 필요한 새 작업을 추가하면 템플릿의 온보딩 등록을 통해 해당 페이지에 새 소스로 나타납니다.
+
+참고: Google 로그인을 위한 BigQuery OAuth 사용자 인증 정보는 **별도**입니다.
+BigQuery 서비스 계정 JSON의 사용자 인증 정보입니다.
+GCP 콘솔 → APIs & 서비스 → 자격 증명 → OAuth 클라이언트 ID, 선호
+`GOOGLE_SIGN_IN_CLIENT_ID` / `GOOGLE_SIGN_IN_CLIENT_SECRET` 환경 이름은 이렇습니다
+낮은 범위의 로그인 클라이언트는 Google API 통합 클라이언트와 별도로 유지됩니다.
+
+### 데이터 모델
+
+핵심 테이블(`templates/analytics/server/db/schema.ts` 참조):
+
+```an-schema title="Analytics data model" summary="Dashboards and analyses are the resources; views, shares, and a query cache hang off them. Org tables come from @agent-native/core/org."
+{
+  "entities": [
+    {
+      "id": "dashboards",
+      "name": "dashboards",
+      "note": "Explorer and SQL dashboards",
+      "fields": [
+        { "name": "id", "type": "text", "pk": true },
+        { "name": "kind", "type": "text", "note": "\"explorer\" or \"sql\"" },
+        { "name": "config", "type": "text", "note": "JSON matching SqlDashboardConfig" }
+      ]
+    },
+    {
+      "id": "dashboard_views",
+      "name": "dashboard_views",
+      "note": "Saved filter presets per dashboard",
+      "fields": [
+        { "name": "id", "type": "text", "pk": true },
+        { "name": "dashboard_id", "type": "text", "fk": "dashboards.id" }
+      ]
+    },
+    {
+      "id": "analyses",
+      "name": "analyses",
+      "note": "Re-runnable ad-hoc investigations",
+      "fields": [
+        { "name": "id", "type": "text", "pk": true },
+        { "name": "question", "type": "text" },
+        { "name": "instructions", "type": "text", "note": "Re-run steps" },
+        { "name": "dataSources", "type": "text", "note": "Sources touched" },
+        { "name": "resultMarkdown", "type": "text" },
+        { "name": "resultData", "type": "text", "nullable": true }
+      ]
+    },
+    {
+      "id": "bigquery_cache",
+      "name": "bigquery_cache",
+      "note": "Result cache keyed by SQL hash",
+      "fields": [
+        { "name": "sql_hash", "type": "text", "pk": true },
+        { "name": "bytes_processed", "type": "integer" }
+      ]
+    }
+  ],
+  "relations": [
+    { "from": "dashboards", "to": "dashboard_views", "kind": "1-n", "label": "saved views" }
+  ]
+}
+```
+
+또한 `@agent-native/core/org`에서 제공하는 리소스별 공유 테이블(`dashboard_shares`, `analysis_shares`) 및 조직 테이블(`organizations`, `org_members`, `org_invitations`)도 있습니다. 데이터 사전은 범위가 지정된 키 아래 프레임워크의 `settings` 테이블에 있습니다.
+
+- **`dashboards`** — Explorer 및 SQL 대시보드 모두. `kind`는 `"explorer"` 또는 `"sql"`이고; `config`는 `SqlDashboardConfig`와 일치하는 JSON 얼룩입니다.
+- **`dashboard_shares`** — 리소스별 공유 부여(주체, 역할).
+- **`dashboard_views`** — 대시보드당 저장된 필터 사전 설정.
+- **`analyses`** — `question`, `instructions`, `dataSources`, `resultMarkdown` 및 선택적 `resultData`를 사용한 임시 조사.
+- **`analysis_shares`** — 분석을 위한 리소스별 공유 부여.
+- **`bigquery_cache`** — 바이트 처리 계정을 사용하여 SQL 해시로 입력된 쿼리 결과 캐시.
+
+또한 `@agent-native/core/org`에서 제공하는 조직 테이블(`organizations`, `org_members`, `org_invitations`)도 있습니다.
+
+데이터 사전은 범위가 지정된 키 아래 프레임워크의 `settings` 테이블에 있습니다. 전체 모양은 `list-data-dictionary` 및 `save-data-dictionary-entry` actions를 참조하세요.
+
+### 사용자 정의
+
+Analytics 템플릿은 분기 및 확장을 위한 것입니다. 모든 것은 `templates/analytics/`에 있습니다:
+
+- **`AGENTS.md`** — 상담원의 최상위 가이드입니다. 문서 보기, actions 및 작업 흐름.
+- **`actions/`** — 모든 에이전트 호출 가능 작업. 새 작업을 추가하려면 새 파일을 추가하세요. 주목할만한 것:
+  - `update-dashboard.ts` — 대시보드 편집(ops + 전체 교체)
+  - `save-analysis.ts` / `list-analyses.ts` — 임시 분석
+  - `save-data-dictionary-entry.ts` / `list-data-dictionary.ts` — 사전
+  - `bigquery.ts` — 원시 BigQuery 실행
+  - `view-screen.ts` / `navigate.ts` — 상황 인식
+- **`app/routes/`** — 파일 기반 경로. 각 경로는 `app/pages/`의 페이지를 둘러싸는 얇은 래퍼입니다.
+- **`app/pages/adhoc/sql-dashboard/`** — SQL 대시보드 렌더러, 패널 편집기, 필터 표시줄, 저장된 보기.
+- **`app/pages/analyses/`** — 목록 및 세부정보 보기를 분석합니다.
+- **`app/pages/DataSources.tsx`** — UI를 온보딩하는 데이터 소스.
+- **`app/pages/DataDictionary.tsx`** — 사전 브라우저 및 편집기.
+- **`.agents/skills/`** — 요청 시 에이전트가 읽는 패턴 가이드:
+  - `dashboard-management` — 저장 공간, 범위 해상도, 대시보드 구성 형태
+  - `data-querying` — 접근할 스크립트, 필터링 패턴
+  - `adhoc-analysis` — 소스 간 조사를 위한 워크플로
+  - `data-querying`, `real-time-sync`, `frontend-design`, `storing-data`, `self-modifying-code`
+- **`.builder/skills/<provider>/SKILL.md`** — 제공업체별 문제(BigQuery, HubSpot, Jira, GA4 등). 쿼리하기 전에 읽어보세요. 새로운 것을 배우면 업데이트하세요.
+- **`server/db/schema.ts`** — 대시보드, 공유, 보기, 분석, BigQuery 캐시를 위한 Drizzle 스키마
+- **`server/lib/dashboards-store.ts`** — 범위 확인 및 레거시 KV 마이그레이션을 포함한 대시보드 읽기/쓰기.
+- **`server/lib/bigquery.ts`** — BigQuery 클라이언트, 테스트 실행 유효성 검사기, 캐시 로직.
+
+새 데이터 소스를 추가하려면 공급자를 호출하고 `output()` 도우미를 통해 결과를 반환하는 스크립트를 `actions/`에 놓습니다. 에이전트가 즉시 사용할 수 있게 되며 대시보드 패널 내에서 사용할 수 있습니다(서버 핸들러를 통해 결과를 노출하는 경우).
+
+새 차트 유형을 추가하려면 `app/pages/adhoc/sql-dashboard/types.ts`에서 `ChartType` 통합을 확장하고 `SqlChartCard.tsx`에서 처리하면 에이전트가 모든 패널에서 사용할 수 있습니다.
+
+템플릿 확장에 대한 더 넓은 패턴을 보려면 [Skills guide](/docs/skills-guide) 및 [Actions](/docs/actions)를 참조하세요.

package/docs/content/locales/ko-KR/template-assets.md

@@ -0,0 +1,307 @@
+---
+title: "자산"
+description: "브랜드 일관성이 있는 미디어를 위한 에이전트 기반 디지털 자산 관리자 및 에이전트 간 생성 서비스입니다."
+---
+
+# 자산
+
+Assets는 브랜드와 일관된 미디어를 생성하고 관리하기 위한 상담원 기본 작업 공간입니다. 업로드 및 생성된 결과를 라이브러리와 폴더에 정리하고 팀이 블로그 히어로, 다이어그램, 랜딩 페이지, 제품 사진, 비디오 및 로고에 대한 예를 수집한 다음 에이전트 채팅을 통해 생성을 라우팅하여 모든 자산을 검토하고 개선할 수 있도록 합니다.
+
+```an-wireframe
+{
+  "surface": "desktop",
+  "html": "<div style='display:flex;flex-direction:column;gap:14px;padding:18px;min-height:520px;box-sizing:border-box'><div style='display:flex;align-items:center;gap:10px'><h1 style='margin:0'>Launch brand</h1><span class='wf-pill accent'>Blog heroes</span><span class='wf-pill'>Product shots</span><span class='wf-pill'>Logos</span><div style='flex:1'></div><button>Upload</button><button class='primary'>Generate</button></div><div class='wf-card' style='display:flex;flex-direction:column;gap:10px'><strong>Create brand media</strong><div class='wf-box'>Three homepage hero options using the approved logo and product references.</div><div style='display:flex;gap:8px;flex-wrap:wrap'><span class='wf-pill accent'>4 references</span><span class='wf-pill'>16:9</span><span class='wf-pill'>Web export</span></div></div><div style='display:grid;grid-template-columns:repeat(3,1fr);gap:12px;flex:1'><div class='wf-card' style='display:flex;align-items:end;min-height:130px'><span class='wf-pill accent'>Hero A</span></div><div class='wf-card' style='display:flex;align-items:end;min-height:130px'><span class='wf-pill'>Reference set</span></div><div class='wf-card' style='display:flex;align-items:end;min-height:130px'><span class='wf-pill'>Logo safe</span></div></div><div class='wf-card' style='display:grid;grid-template-columns:repeat(4,1fr);gap:8px'><div class='wf-box'>Use</div><div class='wf-box'>Refine</div><div class='wf-box'>Compare</div><div class='wf-box'>Export</div></div></div>"
+}
+```
+
+앱을 열면 선택한 라이브러리, 프롬프트, 참조 및 생성된 후보가 하나의 작업 공간에 유지됩니다. 에이전트는 UI가 사용하는 것과 동일한 actions를 통해 모든 자산을 탐색, 검색, 생성, 구체화 및 내보낼 수 있습니다.
+
+```an-diagram title="Generate, review, reuse" summary="References and prompts feed a generate-and-choose session; chosen assets land in a library and flow out to other apps via the picker or A2A."
+{
+  "html": "<div class=\"diagram-assets\"><div class=\"diagram-col\"><div class=\"diagram-node\">References<br><small class=\"diagram-muted\">logos, product shots, style</small></div><div class=\"diagram-node\">Prompt<br><small class=\"diagram-muted\">chat or Generate controls</small></div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough><span class=\"diagram-pill accent\">Generation session</span><small class=\"diagram-muted\">image &amp; video candidates · audit log</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough><span class=\"diagram-pill ok\">Library</span><small class=\"diagram-muted\">chosen, brand-consistent assets</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-col\"><div class=\"diagram-node\">Picker<br><small class=\"diagram-muted\">iframe / MCP App</small></div><div class=\"diagram-node\">A2A<br><small class=\"diagram-muted\">Slides · Design · Content</small></div></div></div>",
+  "css": ".diagram-assets{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.diagram-assets .diagram-col{display:flex;flex-direction:column;gap:10px}.diagram-assets .diagram-box{display:flex;flex-direction:column;gap:4px}.diagram-assets .diagram-arrow{font-size:20px;line-height:1}"
+}
+```
+
+## 선택 시기
+
+- **팀에는 일회성 일반 미디어 프롬프트가 아닌 재사용 가능한 시각적 방향**이 필요합니다. 승인된 로고, 제품 사진, 스타일 예시를 수집하여 여러 세대가 브랜드를 유지할 수 있도록 하세요.
+- **생성된 미디어를 검토하고 개선하여** 프롬프트, 모델, 참조 및 모든 실행 계보에 대한 전체 감사 로그를 원합니다.
+- **다른 앱에는 자산 선택기 또는 생성기가 필요합니다** — 슬라이드, 디자인, 콘텐츠, 블로그 편집기 또는 사이트 빌더는 선택기를 삽입하거나 A2A를 통해 자산을 호출할 수 있습니다.
+- **코딩 에이전트에서 브랜드 미디어를 사용할 수 있기를 원합니다** — Codex, Claude Code, Claude 또는 ChatGPT는 채팅을 종료하지 않고도 자산을 생성하고 선택할 수 있습니다.
+
+## 시작하기
+
+라이브 데모: [assets.agent-native.com](https://assets.agent-native.com).
+
+1. **라이브러리를 만듭니다.** 브랜드, 캠페인, 제품 또는 콘텐츠 스트림을 추가하세요.
+   관리하고 싶습니다.
+2. **참조를 업로드하세요.** 승인된 로고, 제품 사진, 스타일 예시 등을 추가하세요.
+   기존 동영상을 통해 상담원이 작업할 구체적인 자료를 확보할 수 있습니다.
+3. **채팅이나 라이브러리에서 생성합니다.** 히어로 이미지, 다이어그램, 제품을 요청하세요.
+   샷 또는 비디오 변형. 자산은 프롬프트, 참조, 모델, 상태를 저장합니다.
+   검토를 위한 계보
+4. **다른 곳에 자산을 사용하세요.** 내보내기를 복사하고 선택기를 다른 곳에 삽입하세요.
+   앱을 실행하거나 다른 에이전트가 A2A를 통해 자산을 호출하도록 허용하세요.
+
+## 유용한 메시지
+
+- "Acme 제품 참조를 사용하여 세 가지 블로그 히어로 옵션을 생성합니다."
+- "캠페인 시작 스타일로 정사각형 소셜 이미지를 만듭니다."
+- "온보딩 재설계를 위해 승인된 모든 자산을 찾으십시오."
+- "업로드된 이 다이어그램을 더욱 깔끔한 제품 설명 이미지로 바꾸세요."
+- "비디오 스토리보드를 만들고 가장 좋은 프레임 세트를 이 라이브러리에 저장하세요."
+
+## 그것으로 무엇을 할 수 있나요
+
+- **자산 라이브러리를 생성합니다.** 참조 이미지, 비디오, 표준 로고, 스타일 노트, 팔레트, 폴더 및 생성된 출력을 브랜드, 캠페인, 제품 또는 카테고리별로 그룹화합니다.
+- **채팅을 통해 생성합니다.** 홈 작성기 및 라이브러리 생성 컨트롤은 `sendToAgentChat()`를 사용하여 에이전트에 프롬프트를 보내므로 사용자는 변형을 검사하고 피드백을 제공하고 반복할 수 있습니다.
+- **이미지 및 비디오 생성.** 활성화된 경우 Builder 관리 이미지 생성을 사용할 수 있으며 Gemini는 비디오 생성과 수동 이미지 대체 기능을 제공합니다.
+- **참조를 업로드하고 설명하세요.** 라이브러리 UI에서 이미지나 비디오를 추가하거나 작곡가 첨부 버튼을 표시한 다음 제목, 설명, 대체 텍스트, 프롬프트, 모델, 미디어 유형, 상태, 역할, 폴더 또는 컬렉션별로 검색하세요.
+- **생성 감사 로그를 유지합니다.** 모든 실행은 나중에 설계 검토를 위해 프롬프트, 모델, 종횡비, 참조, 소스 자산, 계보, 생성된 자산, 상태, 오류 및 타임스탬프를 기록합니다.
+- **로고 정확성을 유지합니다.** 에이전트는 자리 표시자 영역을 생성할 수 있으며 서버는 이미지 모델을 사용하여 다시 그리는 대신 업로드된 표준 로고를 최종 이미지에 합성합니다.
+- **선택기로 삽입.** 다른 앱은 `/picker`를 iframe하고 `@agent-native/embedding`에서 `chooseAsset` 이벤트를 수신하여 자산을 블로그 편집자, 사이트 빌더, 슬라이드 데크 및 사용자 정의 앱을 위한 자산 선택기/생성기로 전환할 수 있습니다. 또한 선택기는 기존 이미지 전용 호스트에 대한 레거시 `chooseImage` 별칭을 내보냅니다.
+- **앱 지원 스킬로 설치합니다.** `agent-native.app-skill.json` 매니페스트는 자산 스킬과 MCP 커넥터 메타데이터를 내보내므로 마켓플레이스가 앱, 지침 및 선택기를 함께 설치할 수 있습니다.
+- **다른 에이전트에게 서비스를 제공합니다.** 슬라이드, 디자인, 콘텐츠, 메일 및 발송은 A2A를 통해 자산을 호출하여 라이브러리 나열, 배치 생성, 비디오 생성, 자산 구체화, 내보내기 가져오기 및 삽입이 허용되는 인라인 미리 보기 렌더링을 수행할 수 있습니다.
+
+## 코딩 에이전트에서 사용
+
+Codex, Claude 코드, Claude 또는 ChatGPT를 떠나지 않고 브랜드 미디어를 생성하고 선택하세요.
+
+1. **한 번 설치합니다.** 기술 지침이 추가되고 호스팅된 MCP 커넥터가 함께 등록됩니다.
+
+   `````배시
+   npx @agent-native/core@latest skills 자산 # 별칭 추가: 이미지 생성
+   ```
+
+   기본 클라이언트는 `codex`입니다. 다른 사용자에게는 `--client claude-code` 또는 `--client all`를 추가하세요.
+   Vercel/open을 통한 휴대용 스킬 지시만 원하는 경우
+   Skills CLI, 사용:
+
+   ````배쉬
+   npx skills@latest BuilderIO/agent-native --skill 자산 추가
+   ```
+
+   Vercel/open Skills CLI는 지침 파일만 설치합니다. 그렇지 않습니다
+   MCP 커넥터 설정을 실행하세요. 원하는 경우 위의 Agent Native CLI 경로를 사용하세요
+   단일 명령 설정
+
+   `````
+
+2. **이미지를 요청하세요.** 에이전트 채팅에서 "Acme 제품 사진에서 세 가지 블로그 히어로 옵션을 생성하세요." 에이전트는 재생성, 재조정(프롬프트, 측면, 개수) 및 선택할 수 있는 후보 이미지가 포함된 선택기를 엽니다.
+3. **선택.** 인라인 호스트(ChatGPT, Claude.ai, Claude 데스크톱 기본 채팅)에서 선택기는 채팅에서 바로 렌더링됩니다. 후보자를 클릭하면 선택 항목이 자동으로 되돌아갑니다. CLI/링크 전용 호스트(Codex, Claude 코드, Claude 데스크톱 "코드" 탭)에서는 **"자산에서 열기 →"** 링크가 표시됩니다. 그것을 열고 브라우저에서 선택한 다음 복사한 핸드오프 요약을 다시 채팅에 붙여넣거나 "이미지 A 사용"이라고 말하면 됩니다.
+
+   ````텍스트
+   상담원이 사용할 수 있도록 이 선택 항목을 채팅에 다시 붙여넣으세요.
+
+   다음 단계를 위해 선택된 자산 이미지: <label>
+   미디어 URL: <url>
+   현재 아티팩트 또는 디자인에서 선택한 자산을 사용하세요.
+
+   선택한 자산 컨텍스트:
+   { "selectedAsset": { "assetId": "...", "url": "...", "mediaType": "image", ... } }
+   ```
+
+   ````
+
+4. **코드에 적용.** 선택한 미디어 URL 및 `assetId`가 에이전트로 돌아오며 에이전트는 작성하는 코드(`<img>` src, 다운로드)에서 직접 URL를 사용하거나 `export-asset`를 호출합니다.
+
+## 개발자용
+
+이 문서의 나머지 부분은 자산 템플릿을 포크하거나 확장하는 모든 사람을 위한 것입니다.
+
+### 비계
+
+```bash
+npx @agent-native/core@latest create my-assets --standalone --template assets
+```
+
+### 데이터 모델
+
+모든 데이터는 Drizzle ORM를 통해 SQL에 있습니다(바이너리 미디어는 개체 스토리지에 있거나 개발 중 로컬 파일 업로드 대체에 있음). 스키마: `templates/assets/server/db/schema.ts`. 라이브러리는 표준 `ownableColumns`와 일치하는 프레임워크 공유 테이블을 전달하므로 사용자별/조직별 공유 모델에 속합니다.
+
+참고: SQL 테이블 이름은 앱이 이미지라고 불렸을 때의 레거시 `image_*` 접두사를 유지합니다. 동영상과 기타 미디어도 다루고 있습니다.
+
+| 테이블                           | 무엇을 담고 있는지                                                                                                                                                                   |
+| -------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
+| `image_libraries`                | 라이브러리 — 브랜드, 캠페인, 제품 또는 카테고리별로 그룹화된 최상위 컨테이너입니다. `custom_instructions`, `style_brief`, 표준 로고 및 표지 자산 참조 및 아카이브 상태를 보유합니다. |
+| `image_library_shares`           | 프레임워크는 라이브러리당 주체(사용자 또는 조직)를 역할(뷰어, 편집자, 관리자)로 매핑하는 테이블을 공유합니다.                                                                        |
+| `image_collections`              | 라이브러리 내부의 스타일/카테고리 그룹화 — `style_brief`, `prompt_template`, 기본 종횡비 및 이미지 크기                                                                              |
+| `asset_folders`                  | 라이브러리 내부에 중첩 가능한 폴더(계층 구조의 경우 `parent_id`)                                                                                                                     |
+| `image_generation_presets`       | 저장된 생성 레시피 — 미디어 유형, 프롬프트 템플릿, 종횡비, 모델 및 텍스트/참조 정책                                                                                                  |
+| `image_generation_sessions`      | 간단한 상태, 활성 자산 및 피드백 요약이 포함된 반복적인 생성 및 선택 세션                                                                                                            |
+| `image_generation_session_items` | 세션 내의 후보 자산(각각 역할 및 메모 포함)                                                                                                                                          |
+| `image_assets`                   | 자산 기록 — 미디어 유형, 역할, 상태, 제목/설명/대체 텍스트, 프롬프트, 모델, 크기, MIME 유형, 개체/썸네일 키 및 계보                                                                  |
+| `image_generation_runs`          | 생성 감사 로그 — 프롬프트, 컴파일된 프롬프트, 모델, 참조, 상태, 오류 및 이를 트리거한 `source`(`chat` / `ui` / `a2a`)                                                                |
+
+```an-schema title="Assets data model" summary="Libraries are the ownable container; collections, folders, and presets organize them. Sessions drive generate-and-choose; assets and runs hold output and the audit log. Table names keep the legacy image_* prefix but cover all media."
+{
+  "entities": [
+    { "id": "library", "name": "image_libraries", "note": "Top-level ownable container", "fields": [
+      { "name": "id", "type": "id", "pk": true },
+      { "name": "custom_instructions", "type": "text", "nullable": true },
+      { "name": "style_brief", "type": "text", "nullable": true },
+      { "name": "logo_asset_id", "type": "id", "fk": "image_assets.id", "nullable": true },
+      { "name": "archived", "type": "boolean" }
+    ] },
+    { "id": "library_shares", "name": "image_library_shares", "note": "Framework shares table", "fields": [
+      { "name": "library_id", "type": "id", "fk": "image_libraries.id" },
+      { "name": "role", "type": "text", "note": "viewer / editor / admin" }
+    ] },
+    { "id": "collections", "name": "image_collections", "note": "Style/category groupings", "fields": [
+      { "name": "library_id", "type": "id", "fk": "image_libraries.id" },
+      { "name": "style_brief", "type": "text", "nullable": true },
+      { "name": "prompt_template", "type": "text", "nullable": true }
+    ] },
+    { "id": "folders", "name": "asset_folders", "note": "Nestable folders", "fields": [
+      { "name": "library_id", "type": "id", "fk": "image_libraries.id" },
+      { "name": "parent_id", "type": "id", "fk": "asset_folders.id", "nullable": true }
+    ] },
+    { "id": "presets", "name": "image_generation_presets", "note": "Saved generation recipes", "fields": [
+      { "name": "media_type", "type": "text" },
+      { "name": "prompt_template", "type": "text" },
+      { "name": "model", "type": "text" }
+    ] },
+    { "id": "sessions", "name": "image_generation_sessions", "note": "Iterative generate-and-choose", "fields": [
+      { "name": "id", "type": "id", "pk": true },
+      { "name": "status", "type": "text" },
+      { "name": "active_asset_id", "type": "id", "fk": "image_assets.id", "nullable": true }
+    ] },
+    { "id": "session_items", "name": "image_generation_session_items", "note": "Candidate assets in a session", "fields": [
+      { "name": "session_id", "type": "id", "fk": "image_generation_sessions.id" },
+      { "name": "asset_id", "type": "id", "fk": "image_assets.id" },
+      { "name": "role", "type": "text" }
+    ] },
+    { "id": "assets", "name": "image_assets", "note": "The asset record", "fields": [
+      { "name": "id", "type": "id", "pk": true },
+      { "name": "media_type", "type": "text", "note": "image / video" },
+      { "name": "status", "type": "text" },
+      { "name": "prompt", "type": "text", "nullable": true },
+      { "name": "object_key", "type": "text", "nullable": true }
+    ] },
+    { "id": "runs", "name": "image_generation_runs", "note": "Generation audit log", "fields": [
+      { "name": "model", "type": "text" },
+      { "name": "status", "type": "text" },
+      { "name": "source", "type": "text", "note": "chat / ui / a2a" }
+    ] }
+  ],
+  "relations": [
+    { "from": "library", "to": "collections", "kind": "1-n" },
+    { "from": "library", "to": "folders", "kind": "1-n" },
+    { "from": "library", "to": "assets", "kind": "1-n" },
+    { "from": "sessions", "to": "session_items", "kind": "1-n" },
+    { "from": "library", "to": "library_shares", "kind": "1-n" }
+  ]
+}
+```
+
+### 맞춤설정
+
+자산은 완전하고 복제 가능한 템플릿입니다. 실용적인 확장 아이디어:
+
+- "SKU에서 제품 참조 사진을 선택할 수 있도록 제품 카탈로그 커넥터를 추가하세요."
+- "생성된 자산을 마케팅에 사용할 수 있는 것으로 표시하기 전에 엄격한 승인 대기열을 추가하세요."
+- "모델별로 실패했거나 낮은 평가를 받은 세대를 필터링하는 브랜드 리뷰 대시보드를 추가하세요."
+- "작업 공간 전체의 기본 자산 라이브러리를 생성하고 이를 통해 슬라이드 이미지 생성을 라우팅합니다."
+- "최신 제공업체 문서를 확인한 후 이미지 생성 인터페이스 뒤에 새 제공업체를 추가하세요."
+
+에이전트는 필요에 따라 경로, 구성 요소, actions, skills 및 SQL 지원 모델을 편집합니다. 전체 복제, 사용자 정의, 배포 흐름에 대해서는 [Templates](/docs/cloneable-saas)를, 교차 앱 생성에 대해서는 [A2A Protocol](/docs/a2a-protocol)를 참조하세요.
+
+### 선택기 삽입
+
+사람이 내부 자산을 선택하거나 생성할 때 선택기 경로를 사용하세요.
+다른 제품. 이미지는 기본 미디어 유형입니다. 다음의 경우 `mediaType=video`를 전달
+동영상 탐색/선택을 원합니다:
+
+```tsx
+import { EmbeddedApp } from "@agent-native/embedding";
+
+<EmbeddedApp
+  url="https://assets.agent-native.com/picker?mediaType=image"
+  onMessage={(name, payload) => {
+    if (name === "chooseAsset") {
+      insertAsset((payload as { url: string }).url);
+    }
+  }}
+/>;
+```
+
+외부 MCP 호스트는 이것을 구성하는 대신 `open-asset-picker`를 호출해야 합니다.
+iframe을 직접 작성합니다. 이 작업은 브라우저 대체 링크와 MCP 앱 메타데이터를 반환합니다.
+인라인 호스트용. 사용자가 자산을 선택하면 선택기가 `chooseAsset`를 방출합니다.
+이미지 자산의 기존 `chooseImage` 별칭 및 MCP 앱 모델 업데이트
+호스트가 지원하는 컨텍스트입니다. 호스트가
+MCP 앱을 인라인으로 렌더링하는 대신 일반 브라우저 탭에서 자산 선택
+핸드오프 요약을 복사하고 복사 가능한 컨텍스트 블록을 표시합니다. 요약 붙여넣기
+외부 상담원이 선택한 미디어 URL를 사용할 수 있도록 채팅으로 돌아가
+자산 메타데이터.
+
+Codex, Claude 코드 및 Claude 데스크톱 코드는 링크아웃 호스트로 처리되어야 합니다.
+이 흐름에 대한 것입니다. MCP 앱을 인라인으로 렌더링하지 못할 수 있으며 원격 CDN 마크다운
+채팅 내용에 이미지가 안정적으로 표시되지 않을 수 있습니다. 상담원은
+진실의 소스로서의 자산 링크; 눈에 보이는 인라인 미리보기가 필요한 경우
+코드 편집기 채팅, 선택한 `previewUrl`/`downloadUrl`를 로컬에 다운로드
+이미지 파일을 삭제하고 해당 절대 로컬 경로를 삽입하세요.
+
+흐름 생성 및 선택의 경우 `prompt`로 `open-asset-picker`를 호출하세요.
+`autoGenerate: true` 및 `count: 3`(1-6에서 사용자 정의 가능). 선택기가 열립니다
+후보 이미지를 사용하여 사용자가 개수, 가로세로 비율 또는 이미지를 조정할 수 있습니다
+최종 자산 URL를 선택하기 전 생성 사전 설정
+
+다른 에이전트가 자산 없이 자산을 생성, 검색 또는 내보내야 하는 경우 A2A를 사용하세요.
+인간 선택기 UI.
+
+### 개발자: 앱 스킬 배포
+
+자산 앱 스킬에는 앱 ID가 `assets`이고 호스팅된 MCP URL가 있습니다.
+`https://assets.agent-native.com/_agent-native/mcp`.
+
+```bash
+# Easiest hosted install: exported skill instructions plus MCP connector.
+npx @agent-native/core@latest skills add assets
+
+# Vercel/open Skills CLI install: exported instructions only, no MCP config.
+npx skills@latest add BuilderIO/agent-native --skill assets
+
+# Hosted install: URL-only MCP connector, no shared secrets in skill files.
+npx @agent-native/core@latest app-skill ensure --manifest templates/assets/agent-native.app-skill.json
+
+# Local editable launch.
+npx @agent-native/core@latest app-skill launch --manifest templates/assets/agent-native.app-skill.json --local --into ./assets-local
+
+# Marketplace package, including Claude Code marketplace and Vercel Labs skills adapters.
+npx @agent-native/core@latest app-skill pack --manifest templates/assets/agent-native.app-skill.json --out ./dist/assets-skill
+
+# Install a local exported Assets bundle with the open skills CLI.
+npx skills@latest add ./dist/assets-skill --skill assets -a codex -y
+
+# Install from the generated Claude Code marketplace adapter.
+claude plugin marketplace add ./dist/assets-skill/adapters/claude-marketplace
+claude plugin install agent-native-assets@agent-native-apps
+```
+
+내보낸 기술은 상담원에게 인간 참여형 선택 도구를 사용하도록 가르칩니다.
+선택, 무인 이미지/비디오 생성을 위한 직접 actions 및 브라우저
+인라인 MCP 앱을 사용할 수 없을 때의 링크
+
+Claude 마켓플레이스 어댑터에는 `.claude-plugin/marketplace.json`가 포함되어 있습니다.
+`skills/assets/SKILL.md` 플러스가 포함된 카탈로그 및 `agent-native-assets` 플러그인
+호스팅된 `.mcp.json`. 대화형 Claude 코드에서도 동일한 흐름을 사용할 수 있습니다
+`/plugin marketplace add ./dist/assets-skill/adapters/claude-marketplace`
+`/plugin install agent-native-assets@agent-native-apps`, `/reload-plugins` 및
+MCP 인증을 위한 `/mcp`.
+
+`npx skills@latest`가 포함된 원시 마켓플레이스 번들에서 설치하는 경우
+호스팅된 MCP 커넥터를 통해 해당 지침이 라이브 자산 앱을 호출할 수 있습니다.
+
+```bash
+npx @agent-native/core@latest app-skill ensure --manifest ./dist/assets-skill/agent-native.app-skill.json --yes
+```
+
+## 다음 단계
+
+- [**Templates**](/docs/cloneable-saas) — 복제 및 소유 모델
+- [**Embedding SDK**](/docs/embedding-sdk) — iframe 선택기 및 사이드카 패턴
+- [**A2A Protocol**](/docs/a2a-protocol) — 다른 앱이 자산을 호출하는 방법
+- [**File Uploads**](/docs/file-uploads) — 저장 및 인증된 자산 제공
+- [**Sharing & Privacy**](/docs/sharing) — 라이브러리 수준 액세스 제어