@axis-ds/agentic-ui 1.3.0 → 1.5.0

package/dist/constants/a11y-labels.d.mts

@@ -0,0 +1,86 @@
+/**
+ * 접근성(a11y)을 위한 레이블 상수
+ * WCAG 2.1 AA 기준 준수를 위한 스크린 리더 텍스트
+ */
+/** 상태 레이블 (도구 호출, 실행 단계 등) */
+declare const STATUS_LABELS: {
+    readonly pending: "대기 중";
+    readonly running: "실행 중";
+    readonly complete: "완료";
+    readonly success: "성공";
+    readonly error: "오류";
+    readonly skipped: "건너뜀";
+    readonly idle: "대기 중";
+};
+/** 심각도 레이블 (알림, 승인 카드 등) */
+declare const SEVERITY_LABELS: {
+    readonly info: "정보";
+    readonly warning: "주의";
+    readonly error: "오류";
+};
+/** 에이전트 상태 레이블 */
+declare const AGENT_STATUS_LABELS: {
+    readonly online: "온라인";
+    readonly busy: "사용 중";
+    readonly offline: "오프라인";
+};
+/** 에이전트 타입 레이블 */
+declare const AGENT_TYPE_LABELS: {
+    readonly assistant: "어시스턴트";
+    readonly tool: "도구";
+    readonly system: "시스템";
+};
+/** 소스 타입 레이블 */
+declare const SOURCE_TYPE_LABELS: {
+    readonly web: "웹 페이지";
+    readonly file: "파일";
+    readonly database: "데이터베이스";
+    readonly api: "API";
+};
+type StatusLabel = keyof typeof STATUS_LABELS;
+type SeverityLabel = keyof typeof SEVERITY_LABELS;
+type AgentStatusLabel = keyof typeof AGENT_STATUS_LABELS;
+type AgentTypeLabel = keyof typeof AGENT_TYPE_LABELS;
+/** 메시지 역할 레이블 */
+declare const MESSAGE_ROLE_LABELS: {
+    readonly user: "사용자";
+    readonly assistant: "어시스턴트";
+    readonly system: "시스템";
+};
+/** 피드백 레이블 */
+declare const FEEDBACK_LABELS: {
+    readonly like: "좋아요";
+    readonly dislike: "싫어요";
+    readonly none: "피드백 없음";
+};
+/** 첨부파일 타입 레이블 */
+declare const ATTACHMENT_TYPE_LABELS: {
+    readonly image: "이미지";
+    readonly document: "문서";
+    readonly code: "코드";
+    readonly archive: "압축 파일";
+    readonly other: "기타 파일";
+};
+/** Diff 변경 타입 레이블 */
+declare const DIFF_LABELS: {
+    readonly added: "추가됨";
+    readonly removed: "삭제됨";
+    readonly unchanged: "변경 없음";
+};
+/** 계획 상태 레이블 */
+declare const PLAN_STATUS_LABELS: {
+    readonly draft: "초안";
+    readonly pending: "승인 대기";
+    readonly approved: "승인됨";
+    readonly rejected: "거절됨";
+    readonly executing: "실행 중";
+    readonly completed: "완료";
+};
+type SourceTypeLabel = keyof typeof SOURCE_TYPE_LABELS;
+type MessageRoleLabel = keyof typeof MESSAGE_ROLE_LABELS;
+type FeedbackLabel = keyof typeof FEEDBACK_LABELS;
+type AttachmentTypeLabel = keyof typeof ATTACHMENT_TYPE_LABELS;
+type DiffLabel = keyof typeof DIFF_LABELS;
+type PlanStatusLabel = keyof typeof PLAN_STATUS_LABELS;
+
+export { AGENT_STATUS_LABELS, AGENT_TYPE_LABELS, ATTACHMENT_TYPE_LABELS, type AgentStatusLabel, type AgentTypeLabel, type AttachmentTypeLabel, DIFF_LABELS, type DiffLabel, FEEDBACK_LABELS, type FeedbackLabel, MESSAGE_ROLE_LABELS, type MessageRoleLabel, PLAN_STATUS_LABELS, type PlanStatusLabel, SEVERITY_LABELS, SOURCE_TYPE_LABELS, STATUS_LABELS, type SeverityLabel, type SourceTypeLabel, type StatusLabel };

package/dist/constants/a11y-labels.d.ts

@@ -0,0 +1,86 @@
+/**
+ * 접근성(a11y)을 위한 레이블 상수
+ * WCAG 2.1 AA 기준 준수를 위한 스크린 리더 텍스트
+ */
+/** 상태 레이블 (도구 호출, 실행 단계 등) */
+declare const STATUS_LABELS: {
+    readonly pending: "대기 중";
+    readonly running: "실행 중";
+    readonly complete: "완료";
+    readonly success: "성공";
+    readonly error: "오류";
+    readonly skipped: "건너뜀";
+    readonly idle: "대기 중";
+};
+/** 심각도 레이블 (알림, 승인 카드 등) */
+declare const SEVERITY_LABELS: {
+    readonly info: "정보";
+    readonly warning: "주의";
+    readonly error: "오류";
+};
+/** 에이전트 상태 레이블 */
+declare const AGENT_STATUS_LABELS: {
+    readonly online: "온라인";
+    readonly busy: "사용 중";
+    readonly offline: "오프라인";
+};
+/** 에이전트 타입 레이블 */
+declare const AGENT_TYPE_LABELS: {
+    readonly assistant: "어시스턴트";
+    readonly tool: "도구";
+    readonly system: "시스템";
+};
+/** 소스 타입 레이블 */
+declare const SOURCE_TYPE_LABELS: {
+    readonly web: "웹 페이지";
+    readonly file: "파일";
+    readonly database: "데이터베이스";
+    readonly api: "API";
+};
+type StatusLabel = keyof typeof STATUS_LABELS;
+type SeverityLabel = keyof typeof SEVERITY_LABELS;
+type AgentStatusLabel = keyof typeof AGENT_STATUS_LABELS;
+type AgentTypeLabel = keyof typeof AGENT_TYPE_LABELS;
+/** 메시지 역할 레이블 */
+declare const MESSAGE_ROLE_LABELS: {
+    readonly user: "사용자";
+    readonly assistant: "어시스턴트";
+    readonly system: "시스템";
+};
+/** 피드백 레이블 */
+declare const FEEDBACK_LABELS: {
+    readonly like: "좋아요";
+    readonly dislike: "싫어요";
+    readonly none: "피드백 없음";
+};
+/** 첨부파일 타입 레이블 */
+declare const ATTACHMENT_TYPE_LABELS: {
+    readonly image: "이미지";
+    readonly document: "문서";
+    readonly code: "코드";
+    readonly archive: "압축 파일";
+    readonly other: "기타 파일";
+};
+/** Diff 변경 타입 레이블 */
+declare const DIFF_LABELS: {
+    readonly added: "추가됨";
+    readonly removed: "삭제됨";
+    readonly unchanged: "변경 없음";
+};
+/** 계획 상태 레이블 */
+declare const PLAN_STATUS_LABELS: {
+    readonly draft: "초안";
+    readonly pending: "승인 대기";
+    readonly approved: "승인됨";
+    readonly rejected: "거절됨";
+    readonly executing: "실행 중";
+    readonly completed: "완료";
+};
+type SourceTypeLabel = keyof typeof SOURCE_TYPE_LABELS;
+type MessageRoleLabel = keyof typeof MESSAGE_ROLE_LABELS;
+type FeedbackLabel = keyof typeof FEEDBACK_LABELS;
+type AttachmentTypeLabel = keyof typeof ATTACHMENT_TYPE_LABELS;
+type DiffLabel = keyof typeof DIFF_LABELS;
+type PlanStatusLabel = keyof typeof PLAN_STATUS_LABELS;
+
+export { AGENT_STATUS_LABELS, AGENT_TYPE_LABELS, ATTACHMENT_TYPE_LABELS, type AgentStatusLabel, type AgentTypeLabel, type AttachmentTypeLabel, DIFF_LABELS, type DiffLabel, FEEDBACK_LABELS, type FeedbackLabel, MESSAGE_ROLE_LABELS, type MessageRoleLabel, PLAN_STATUS_LABELS, type PlanStatusLabel, SEVERITY_LABELS, SOURCE_TYPE_LABELS, STATUS_LABELS, type SeverityLabel, type SourceTypeLabel, type StatusLabel };

package/dist/constants/a11y-labels.js

@@ -0,0 +1,105 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var a11y_labels_exports = {};
+__export(a11y_labels_exports, {
+  AGENT_STATUS_LABELS: () => AGENT_STATUS_LABELS,
+  AGENT_TYPE_LABELS: () => AGENT_TYPE_LABELS,
+  ATTACHMENT_TYPE_LABELS: () => ATTACHMENT_TYPE_LABELS,
+  DIFF_LABELS: () => DIFF_LABELS,
+  FEEDBACK_LABELS: () => FEEDBACK_LABELS,
+  MESSAGE_ROLE_LABELS: () => MESSAGE_ROLE_LABELS,
+  PLAN_STATUS_LABELS: () => PLAN_STATUS_LABELS,
+  SEVERITY_LABELS: () => SEVERITY_LABELS,
+  SOURCE_TYPE_LABELS: () => SOURCE_TYPE_LABELS,
+  STATUS_LABELS: () => STATUS_LABELS
+});
+module.exports = __toCommonJS(a11y_labels_exports);
+const STATUS_LABELS = {
+  pending: "\uB300\uAE30 \uC911",
+  running: "\uC2E4\uD589 \uC911",
+  complete: "\uC644\uB8CC",
+  success: "\uC131\uACF5",
+  error: "\uC624\uB958",
+  skipped: "\uAC74\uB108\uB700",
+  idle: "\uB300\uAE30 \uC911"
+};
+const SEVERITY_LABELS = {
+  info: "\uC815\uBCF4",
+  warning: "\uC8FC\uC758",
+  error: "\uC624\uB958"
+};
+const AGENT_STATUS_LABELS = {
+  online: "\uC628\uB77C\uC778",
+  busy: "\uC0AC\uC6A9 \uC911",
+  offline: "\uC624\uD504\uB77C\uC778"
+};
+const AGENT_TYPE_LABELS = {
+  assistant: "\uC5B4\uC2DC\uC2A4\uD134\uD2B8",
+  tool: "\uB3C4\uAD6C",
+  system: "\uC2DC\uC2A4\uD15C"
+};
+const SOURCE_TYPE_LABELS = {
+  web: "\uC6F9 \uD398\uC774\uC9C0",
+  file: "\uD30C\uC77C",
+  database: "\uB370\uC774\uD130\uBCA0\uC774\uC2A4",
+  api: "API"
+};
+const MESSAGE_ROLE_LABELS = {
+  user: "\uC0AC\uC6A9\uC790",
+  assistant: "\uC5B4\uC2DC\uC2A4\uD134\uD2B8",
+  system: "\uC2DC\uC2A4\uD15C"
+};
+const FEEDBACK_LABELS = {
+  like: "\uC88B\uC544\uC694",
+  dislike: "\uC2EB\uC5B4\uC694",
+  none: "\uD53C\uB4DC\uBC31 \uC5C6\uC74C"
+};
+const ATTACHMENT_TYPE_LABELS = {
+  image: "\uC774\uBBF8\uC9C0",
+  document: "\uBB38\uC11C",
+  code: "\uCF54\uB4DC",
+  archive: "\uC555\uCD95 \uD30C\uC77C",
+  other: "\uAE30\uD0C0 \uD30C\uC77C"
+};
+const DIFF_LABELS = {
+  added: "\uCD94\uAC00\uB428",
+  removed: "\uC0AD\uC81C\uB428",
+  unchanged: "\uBCC0\uACBD \uC5C6\uC74C"
+};
+const PLAN_STATUS_LABELS = {
+  draft: "\uCD08\uC548",
+  pending: "\uC2B9\uC778 \uB300\uAE30",
+  approved: "\uC2B9\uC778\uB428",
+  rejected: "\uAC70\uC808\uB428",
+  executing: "\uC2E4\uD589 \uC911",
+  completed: "\uC644\uB8CC"
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  AGENT_STATUS_LABELS,
+  AGENT_TYPE_LABELS,
+  ATTACHMENT_TYPE_LABELS,
+  DIFF_LABELS,
+  FEEDBACK_LABELS,
+  MESSAGE_ROLE_LABELS,
+  PLAN_STATUS_LABELS,
+  SEVERITY_LABELS,
+  SOURCE_TYPE_LABELS,
+  STATUS_LABELS
+});

package/dist/{chunk-SCZ4BQ2G.mjs → constants/a11y-labels.mjs}

@@ -1,5 +1,4 @@
-// src/constants/a11y-labels.ts
-var STATUS_LABELS = {
+const STATUS_LABELS = {
   pending: "\uB300\uAE30 \uC911",
   running: "\uC2E4\uD589 \uC911",
   complete: "\uC644\uB8CC",
@@ -8,45 +7,50 @@ var STATUS_LABELS = {
   skipped: "\uAC74\uB108\uB700",
   idle: "\uB300\uAE30 \uC911"
 };
-var SEVERITY_LABELS = {
+const SEVERITY_LABELS = {
   info: "\uC815\uBCF4",
   warning: "\uC8FC\uC758",
   error: "\uC624\uB958"
 };
-var AGENT_STATUS_LABELS = {
+const AGENT_STATUS_LABELS = {
   online: "\uC628\uB77C\uC778",
   busy: "\uC0AC\uC6A9 \uC911",
   offline: "\uC624\uD504\uB77C\uC778"
 };
-var SOURCE_TYPE_LABELS = {
+const AGENT_TYPE_LABELS = {
+  assistant: "\uC5B4\uC2DC\uC2A4\uD134\uD2B8",
+  tool: "\uB3C4\uAD6C",
+  system: "\uC2DC\uC2A4\uD15C"
+};
+const SOURCE_TYPE_LABELS = {
   web: "\uC6F9 \uD398\uC774\uC9C0",
   file: "\uD30C\uC77C",
   database: "\uB370\uC774\uD130\uBCA0\uC774\uC2A4",
   api: "API"
 };
-var MESSAGE_ROLE_LABELS = {
+const MESSAGE_ROLE_LABELS = {
   user: "\uC0AC\uC6A9\uC790",
   assistant: "\uC5B4\uC2DC\uC2A4\uD134\uD2B8",
   system: "\uC2DC\uC2A4\uD15C"
 };
-var FEEDBACK_LABELS = {
+const FEEDBACK_LABELS = {
   like: "\uC88B\uC544\uC694",
   dislike: "\uC2EB\uC5B4\uC694",
   none: "\uD53C\uB4DC\uBC31 \uC5C6\uC74C"
 };
-var ATTACHMENT_TYPE_LABELS = {
+const ATTACHMENT_TYPE_LABELS = {
   image: "\uC774\uBBF8\uC9C0",
   document: "\uBB38\uC11C",
   code: "\uCF54\uB4DC",
   archive: "\uC555\uCD95 \uD30C\uC77C",
   other: "\uAE30\uD0C0 \uD30C\uC77C"
 };
-var DIFF_LABELS = {
+const DIFF_LABELS = {
   added: "\uCD94\uAC00\uB428",
   removed: "\uC0AD\uC81C\uB428",
   unchanged: "\uBCC0\uACBD \uC5C6\uC74C"
 };
-var PLAN_STATUS_LABELS = {
+const PLAN_STATUS_LABELS = {
   draft: "\uCD08\uC548",
   pending: "\uC2B9\uC778 \uB300\uAE30",
   approved: "\uC2B9\uC778\uB428",
@@ -54,15 +58,15 @@ var PLAN_STATUS_LABELS = {
   executing: "\uC2E4\uD589 \uC911",
   completed: "\uC644\uB8CC"
 };
-
 export {
-  STATUS_LABELS,
-  SEVERITY_LABELS,
   AGENT_STATUS_LABELS,
-  SOURCE_TYPE_LABELS,
-  MESSAGE_ROLE_LABELS,
-  FEEDBACK_LABELS,
+  AGENT_TYPE_LABELS,
   ATTACHMENT_TYPE_LABELS,
   DIFF_LABELS,
-  PLAN_STATUS_LABELS
+  FEEDBACK_LABELS,
+  MESSAGE_ROLE_LABELS,
+  PLAN_STATUS_LABELS,
+  SEVERITY_LABELS,
+  SOURCE_TYPE_LABELS,
+  STATUS_LABELS
 };

package/dist/context-panel/index.js

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
@@ -26,16 +27,14 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/context-panel/index.tsx
 var context_panel_exports = {};
 __export(context_panel_exports, {
   ContextPanel: () => ContextPanel
 });
 module.exports = __toCommonJS(context_panel_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var React = __toESM(require("react"));
 var import_ui_react = require("@axis-ds/ui-react");
-var import_jsx_runtime = require("react/jsx-runtime");
 function ContextPanel({
   modelInfo,
   systemPrompt,

package/dist/context-panel/index.mjs

@@ -1,6 +1,102 @@
-import {
-  ContextPanel
-} from "../chunk-KJVPVBET.mjs";
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "@axis-ds/ui-react";
+function ContextPanel({
+  modelInfo,
+  systemPrompt,
+  attachedFiles,
+  settings,
+  collapsible = true,
+  defaultExpanded = false,
+  className
+}) {
+  const [isExpanded, setIsExpanded] = React.useState(defaultExpanded);
+  const contentId = React.useId();
+  const hasContent = modelInfo || systemPrompt || attachedFiles && attachedFiles.length > 0 || settings && Object.keys(settings).length > 0;
+  if (!hasContent) return null;
+  const header = /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+    /* @__PURE__ */ jsxs("svg", { className: "w-4 h-4 text-[var(--axis-icon-secondary)]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: [
+      /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.066 2.573c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.573 1.066c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.066-2.573c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z" }),
+      /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 12a3 3 0 11-6 0 3 3 0 016 0z" })
+    ] }),
+    /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-[var(--axis-text-secondary)]", children: "\uCEE8\uD14D\uC2A4\uD2B8" })
+  ] });
+  const content = /* @__PURE__ */ jsxs("div", { id: contentId, className: "space-y-3 mt-2", children: [
+    modelInfo && /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("h5", { className: "text-xs font-medium text-[var(--axis-text-secondary)] mb-1", children: "\uBAA8\uB378" }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx("code", { className: "text-sm font-mono text-[var(--axis-text-primary)]", children: modelInfo.name }),
+        modelInfo.provider && /* @__PURE__ */ jsx("span", { className: "text-xs text-[var(--axis-text-tertiary)]", children: modelInfo.provider }),
+        modelInfo.version && /* @__PURE__ */ jsx("span", { className: "text-xs px-1.5 py-0.5 rounded bg-[var(--axis-surface-tertiary)] text-[var(--axis-text-tertiary)]", children: modelInfo.version })
+      ] })
+    ] }),
+    systemPrompt && /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("h5", { className: "text-xs font-medium text-[var(--axis-text-secondary)] mb-1", children: "\uC2DC\uC2A4\uD15C \uD504\uB86C\uD504\uD2B8" }),
+      /* @__PURE__ */ jsx("p", { className: "text-xs text-[var(--axis-text-primary)] p-2 rounded bg-[var(--axis-surface-secondary)] line-clamp-3 whitespace-pre-wrap", children: systemPrompt })
+    ] }),
+    attachedFiles && attachedFiles.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsxs("h5", { className: "text-xs font-medium text-[var(--axis-text-secondary)] mb-1", children: [
+        "\uCCA8\uBD80 \uD30C\uC77C (",
+        attachedFiles.length,
+        ")"
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "space-y-1", children: attachedFiles.map((file, i) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-xs text-[var(--axis-text-primary)]", children: [
+        /* @__PURE__ */ jsx("svg", { className: "w-3 h-3 text-[var(--axis-icon-secondary)]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13" }) }),
+        /* @__PURE__ */ jsx("span", { className: "truncate", children: file })
+      ] }, i)) })
+    ] }),
+    settings && Object.keys(settings).length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("h5", { className: "text-xs font-medium text-[var(--axis-text-secondary)] mb-1", children: "\uC124\uC815" }),
+      /* @__PURE__ */ jsx("div", { className: "space-y-1", children: Object.entries(settings).map(([key, value]) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-xs", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-[var(--axis-text-secondary)]", children: key }),
+        /* @__PURE__ */ jsx("code", { className: "font-mono text-[var(--axis-text-primary)]", children: value })
+      ] }, key)) })
+    ] })
+  ] });
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "rounded-lg border p-3",
+        "bg-[var(--axis-surface-secondary)] border-[var(--axis-border-default)]",
+        className
+      ),
+      children: collapsible ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: () => setIsExpanded(!isExpanded),
+            "aria-expanded": isExpanded,
+            "aria-controls": contentId,
+            className: "w-full flex items-center justify-between hover:opacity-80 transition-opacity",
+            children: [
+              header,
+              /* @__PURE__ */ jsx(
+                "svg",
+                {
+                  className: cn(
+                    "w-4 h-4 text-[var(--axis-text-secondary)] transition-transform",
+                    isExpanded && "rotate-180"
+                  ),
+                  fill: "none",
+                  stroke: "currentColor",
+                  viewBox: "0 0 24 24",
+                  "aria-hidden": "true",
+                  children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" })
+                }
+              )
+            ]
+          }
+        ),
+        isExpanded && content
+      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        header,
+        content
+      ] })
+    }
+  );
+}
 export {
   ContextPanel
 };

package/dist/diff-viewer/index.js

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
@@ -26,25 +27,15 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/diff-viewer/index.tsx
 var diff_viewer_exports = {};
 __export(diff_viewer_exports, {
   DiffViewer: () => DiffViewer
 });
 module.exports = __toCommonJS(diff_viewer_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var React = __toESM(require("react"));
 var import_ui_react = require("@axis-ds/ui-react");
-
-// src/constants/a11y-labels.ts
-var DIFF_LABELS = {
-  added: "\uCD94\uAC00\uB428",
-  removed: "\uC0AD\uC81C\uB428",
-  unchanged: "\uBCC0\uACBD \uC5C6\uC74C"
-};
-
-// src/diff-viewer/index.tsx
-var import_jsx_runtime = require("react/jsx-runtime");
+var import_a11y_labels = require("../constants/a11y-labels.js");
 function computeDiff(before, after) {
   const oldLines = before.split("\n");
   const newLines = after.split("\n");
@@ -78,17 +69,17 @@ function computeDiff(before, after) {
   }
   return result;
 }
-var lineTypeStyles = {
+const lineTypeStyles = {
   added: "bg-[color:color-mix(in_srgb,var(--axis-diff-added)_10%,transparent)]",
   removed: "bg-[color:color-mix(in_srgb,var(--axis-diff-removed)_10%,transparent)]",
   unchanged: ""
 };
-var lineTypeTextStyles = {
+const lineTypeTextStyles = {
   added: "text-[var(--axis-diff-added-text)]",
   removed: "text-[var(--axis-diff-removed-text)]",
   unchanged: "text-[var(--axis-text-primary)]"
 };
-var lineTypeSymbols = {
+const lineTypeSymbols = {
   added: "+",
   removed: "-",
   unchanged: " "
@@ -119,11 +110,11 @@ function DiffViewer({
           /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2 min-w-0", children: [
             /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className: "w-4 h-4 text-[var(--axis-icon-secondary)]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 6h16M4 12h16M4 18h7" }) }),
             filename && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("code", { className: "text-xs font-mono text-[var(--axis-text-primary)] truncate", children: filename }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-xs text-[var(--axis-diff-added)]", "aria-label": `${addedCount}\uC904 ${DIFF_LABELS.added}`, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-xs text-[var(--axis-diff-added)]", "aria-label": `${addedCount}\uC904 ${import_a11y_labels.DIFF_LABELS.added}`, children: [
               "+",
               addedCount
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-xs text-[var(--axis-diff-removed)]", "aria-label": `${removedCount}\uC904 ${DIFF_LABELS.removed}`, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-xs text-[var(--axis-diff-removed)]", "aria-label": `${removedCount}\uC904 ${import_a11y_labels.DIFF_LABELS.removed}`, children: [
               "-",
               removedCount
             ] })