@axis-ds/agentic-ui 1.2.1 → 1.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (32) hide show
  1. package/README.md +29 -0
  2. package/dist/agent-avatar/index.js +1 -1
  3. package/dist/agent-avatar/index.mjs +1 -1
  4. package/dist/attachment-card/index.js +1 -1
  5. package/dist/attachment-card/index.mjs +1 -1
  6. package/dist/{chunk-2A5QQFYL.mjs → chunk-42KEAZ2Y.mjs} +1 -1
  7. package/dist/{chunk-M325YRLE.mjs → chunk-4V4BWBRC.mjs} +1 -1
  8. package/dist/{chunk-ZFU34YYY.mjs → chunk-IOF4OET6.mjs} +2 -2
  9. package/dist/{chunk-KPRUFC34.mjs → chunk-J4FIMXXG.mjs} +1 -1
  10. package/dist/{chunk-RPW4Y5G2.mjs → chunk-JY7MTMMB.mjs} +1 -1
  11. package/dist/{chunk-WUA5Q76Y.mjs → chunk-OYQX3SL4.mjs} +8 -8
  12. package/dist/{chunk-YHCEJ2L5.mjs → chunk-R4CMHIRO.mjs} +2 -2
  13. package/dist/{chunk-WMQGJIAF.mjs → chunk-SCXUEQLI.mjs} +5 -5
  14. package/dist/{chunk-MVBXXDZB.mjs → chunk-ZW4Z27AB.mjs} +2 -1
  15. package/dist/diff-viewer/index.js +2 -2
  16. package/dist/diff-viewer/index.mjs +1 -1
  17. package/dist/feedback-buttons/index.js +2 -2
  18. package/dist/feedback-buttons/index.mjs +1 -1
  19. package/dist/index.js +23 -22
  20. package/dist/index.mjs +13 -13
  21. package/dist/message-bubble/index.js +1 -1
  22. package/dist/message-bubble/index.mjs +1 -1
  23. package/dist/plan-card/index.js +8 -8
  24. package/dist/plan-card/index.mjs +1 -1
  25. package/dist/run-progress/index.js +5 -5
  26. package/dist/run-progress/index.mjs +1 -1
  27. package/dist/step-timeline/index.js +1 -1
  28. package/dist/step-timeline/index.mjs +1 -1
  29. package/dist/surface-renderer/index.js +2 -1
  30. package/dist/surface-renderer/index.mjs +1 -1
  31. package/package.json +8 -5
  32. package/tailwind.css +10 -0
package/README.md CHANGED
@@ -10,6 +10,35 @@ npm install @axis-ds/agentic-ui
10
10
  pnpm add @axis-ds/agentic-ui
11
11
  ```
12
12
 
13
+ ## Tailwind 연동
14
+
15
+ ### Tailwind CSS 4
16
+
17
+ Tailwind CSS 4(`@import "tailwindcss"`, create-next-app 15.5 기본)에서는 `@import "tailwindcss"` 가 있는 전역 CSS 에 두 줄을 더합니다.
18
+
19
+ ```css
20
+ /* app/globals.css */
21
+ @import "tailwindcss";
22
+ @import "@axis-ds/tokens/css/tailwind4";
23
+ @import "@axis-ds/agentic-ui/tailwind.css";
24
+ ```
25
+
26
+ - `@axis-ds/agentic-ui/tailwind.css` 는 스타일 규칙 없이 `@source "./dist"` 한 줄만 담습니다. Tailwind 4 는 `node_modules` 를 스캔하지 않아서, 이 줄이 없으면 컴포넌트가 쓰는 `bg-[var(--axis-agent-avatar-assistant)]` 같은 클래스가 생성되지 않습니다. 경로는 파일 기준 상대 경로라 npm · pnpm 설치 모두 동작합니다.
27
+ - `@import "tailwindcss"` 가 있는 같은 파일에서 import 합니다. 다른 CSS 파일이나 JS/TSX 에서 import 하면 스캔 경로가 그 컴파일에 들어가지 않습니다.
28
+ - `@axis-ds/tokens/css/tailwind4` 는 `rounded-md` · `font-mono` 등을 AXIS 변수로 매핑하고 토큰 변수를 base 레이어로 함께 불러옵니다. pnpm 처럼 의존성을 끌어올리지 않는 설치에서는 `@axis-ds/tokens` 를 직접 설치해야 이 import 가 풀립니다. 브랜드 CSS · create-next-app 기본 `:root` 와의 충돌은 `@axis-ds/tokens` README 를 참고하세요.
29
+ - 이 패키지는 `@axis-ds/ui-react` 에서 유틸리티 함수만 가져옵니다. 앱에서 `@axis-ds/ui-react` 컴포넌트를 직접 쓸 때만 `@import "@axis-ds/ui-react/tailwind.css";` 를 함께 넣습니다.
30
+
31
+ ### Tailwind CSS 3
32
+
33
+ `tailwind.config` 에는 `@axis-ds/tokens/tailwind` preset 과 함께 컴포넌트 파일을 `content` 에 넣습니다.
34
+
35
+ ```js
36
+ content: [
37
+ "./src/**/*.{js,ts,jsx,tsx}",
38
+ "./node_modules/@axis-ds/agentic-ui/**/*.{js,jsx}",
39
+ ],
40
+ ```
41
+
13
42
  ## 사용법
14
43
 
15
44
  ```tsx
package/dist/agent-avatar/index.js CHANGED
@@ -84,7 +84,7 @@ function AgentAvatar({
84
84
  {
85
85
  "aria-hidden": "true",
86
86
  className: (0, import_ui_react.cn)(
87
- "rounded-full flex items-center justify-center font-medium text-white",
87
+ "rounded-full flex items-center justify-center font-medium text-[var(--axis-agent-avatar-text)]",
88
88
  sizeStyles[size],
89
89
  typeColors[type]
90
90
  ),
package/dist/agent-avatar/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  AgentAvatar
3
- } from "../chunk-RPW4Y5G2.mjs";
3
+ } from "../chunk-JY7MTMMB.mjs";
4
4
  import "../chunk-SCZ4BQ2G.mjs";
5
5
  export {
6
6
  AgentAvatar
package/dist/attachment-card/index.js CHANGED
@@ -68,7 +68,7 @@ function AttachmentCard({
68
68
  className: (0, import_ui_react.cn)(
69
69
  "flex items-center gap-3 rounded-lg border p-3",
70
70
  "bg-[var(--axis-surface-default)] border-[var(--axis-border-default)]",
71
- status === "error" && "border-[var(--axis-status-error)]/30",
71
+ status === "error" && "border-[var(--axis-status-error-border)]",
72
72
  className
73
73
  ),
74
74
  children: [
package/dist/attachment-card/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  AttachmentCard
3
- } from "../chunk-2A5QQFYL.mjs";
3
+ } from "../chunk-42KEAZ2Y.mjs";
4
4
  import "../chunk-SCZ4BQ2G.mjs";
5
5
  export {
6
6
  AttachmentCard
package/dist/{chunk-2A5QQFYL.mjs → chunk-42KEAZ2Y.mjs} RENAMED
@@ -37,7 +37,7 @@ function AttachmentCard({
37
37
  className: cn(
38
38
  "flex items-center gap-3 rounded-lg border p-3",
39
39
  "bg-[var(--axis-surface-default)] border-[var(--axis-border-default)]",
40
- status === "error" && "border-[var(--axis-status-error)]/30",
40
+ status === "error" && "border-[var(--axis-status-error-border)]",
41
41
  className
42
42
  ),
43
43
  children: [
package/dist/{chunk-M325YRLE.mjs → chunk-4V4BWBRC.mjs} RENAMED
@@ -52,7 +52,7 @@ function StepTimeline({
52
52
  step.status === "skipped" && "bg-[var(--axis-status-neutral-muted)]",
53
53
  step.status === "pending" && "bg-[var(--axis-status-neutral-muted)]"
54
54
  ),
55
- children: step.status === "complete" && /* @__PURE__ */ jsx("svg", { className: "w-3 h-3 text-white", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 3, d: "M5 13l4 4L19 7" }) })
55
+ children: step.status === "complete" && /* @__PURE__ */ jsx("svg", { className: "w-3 h-3 text-[var(--axis-status-success-contrast)]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 3, d: "M5 13l4 4L19 7" }) })
56
56
  }
57
57
  ),
58
58
  /* @__PURE__ */ jsxs("div", { className: cn(isVertical ? "flex-1" : "text-center mt-2"), children: [
package/dist/{chunk-ZFU34YYY.mjs → chunk-IOF4OET6.mjs} RENAMED
@@ -40,8 +40,8 @@ function computeDiff(before, after) {
40
40
  return result;
41
41
  }
42
42
  var lineTypeStyles = {
43
- added: "bg-[var(--axis-diff-added)]/10",
44
- removed: "bg-[var(--axis-diff-removed)]/10",
43
+ added: "bg-[color:color-mix(in_srgb,var(--axis-diff-added)_10%,transparent)]",
44
+ removed: "bg-[color:color-mix(in_srgb,var(--axis-diff-removed)_10%,transparent)]",
45
45
  unchanged: ""
46
46
  };
47
47
  var lineTypeTextStyles = {
package/dist/{chunk-KPRUFC34.mjs → chunk-J4FIMXXG.mjs} RENAMED
@@ -8,7 +8,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
8
8
  var roleStyles = {
9
9
  user: {
10
10
  container: "flex-row-reverse",
11
- bubble: "bg-[var(--axis-agent-message-user-bg)] text-white rounded-br-sm"
11
+ bubble: "bg-[var(--axis-agent-message-user-bg)] text-[var(--axis-agent-message-user-text)] rounded-br-sm"
12
12
  },
13
13
  assistant: {
14
14
  container: "flex-row",
package/dist/{chunk-RPW4Y5G2.mjs → chunk-JY7MTMMB.mjs} RENAMED
@@ -55,7 +55,7 @@ function AgentAvatar({
55
55
  {
56
56
  "aria-hidden": "true",
57
57
  className: cn(
58
- "rounded-full flex items-center justify-center font-medium text-white",
58
+ "rounded-full flex items-center justify-center font-medium text-[var(--axis-agent-avatar-text)]",
59
59
  sizeStyles[size],
60
60
  typeColors[type]
61
61
  ),
package/dist/{chunk-WUA5Q76Y.mjs → chunk-OYQX3SL4.mjs} RENAMED
@@ -14,23 +14,23 @@ var planStatusStyles = {
14
14
  },
15
15
  pending: {
16
16
  border: "border-l-[var(--axis-status-warning)]",
17
- badge: "bg-[var(--axis-status-warning)]/10 text-[var(--axis-status-warning-strong)]"
17
+ badge: "bg-[var(--axis-badge-warning-bg)] text-[var(--axis-badge-warning-text)]"
18
18
  },
19
19
  approved: {
20
20
  border: "border-l-[var(--axis-status-success)]",
21
- badge: "bg-[var(--axis-status-success)]/10 text-[var(--axis-status-success-strong)]"
21
+ badge: "bg-[var(--axis-badge-success-bg)] text-[var(--axis-badge-success-text)]"
22
22
  },
23
23
  rejected: {
24
24
  border: "border-l-[var(--axis-status-error)]",
25
- badge: "bg-[var(--axis-status-error)]/10 text-[var(--axis-status-error-strong)]"
25
+ badge: "bg-[var(--axis-badge-error-bg)] text-[var(--axis-badge-error-text)]"
26
26
  },
27
27
  executing: {
28
28
  border: "border-l-[var(--axis-status-running)]",
29
- badge: "bg-[var(--axis-status-running)]/10 text-[var(--axis-status-running-strong)]"
29
+ badge: "bg-[var(--axis-badge-info-bg)] text-[var(--axis-badge-info-text)]"
30
30
  },
31
31
  completed: {
32
32
  border: "border-l-[var(--axis-status-success)]",
33
- badge: "bg-[var(--axis-status-success)]/10 text-[var(--axis-status-success-strong)]"
33
+ badge: "bg-[var(--axis-badge-success-bg)] text-[var(--axis-badge-success-text)]"
34
34
  }
35
35
  };
36
36
  var stepStatusIcons = {
@@ -62,7 +62,7 @@ function PlanCard({
62
62
  role: "region",
63
63
  "aria-labelledby": titleId,
64
64
  className: cn(
65
- "rounded-lg border border-l-4 overflow-hidden",
65
+ "rounded-lg border border-l-[length:var(--axis-plan-card-accent-width)] overflow-hidden",
66
66
  "bg-[var(--axis-surface-default)] border-[var(--axis-border-default)]",
67
67
  styles.border,
68
68
  className
@@ -121,7 +121,7 @@ function PlanCard({
121
121
  "button",
122
122
  {
123
123
  onClick: onApprove,
124
- className: "px-3 py-1.5 text-xs font-medium rounded-md bg-[var(--axis-status-success)] text-white hover:bg-[var(--axis-status-success-strong)] transition-colors",
124
+ className: "px-3 py-1.5 text-xs font-medium rounded-md bg-[var(--axis-status-success)] text-[var(--axis-status-success-contrast)] hover:bg-[var(--axis-status-success-strong)] transition-colors",
125
125
  children: "\uC2B9\uC778"
126
126
  }
127
127
  ),
@@ -137,7 +137,7 @@ function PlanCard({
137
137
  "button",
138
138
  {
139
139
  onClick: onReject,
140
- className: "px-3 py-1.5 text-xs font-medium rounded-md text-[var(--axis-status-error)] hover:bg-[var(--axis-status-error)]/10 transition-colors",
140
+ className: "px-3 py-1.5 text-xs font-medium rounded-md text-[var(--axis-status-error)] hover:text-[var(--axis-plan-card-reject-hover-text)] hover:bg-[color:color-mix(in_srgb,var(--axis-status-error)_10%,transparent)] transition-colors",
141
141
  children: "\uAC70\uC808"
142
142
  }
143
143
  )
package/dist/{chunk-YHCEJ2L5.mjs → chunk-R4CMHIRO.mjs} RENAMED
@@ -43,7 +43,7 @@ function FeedbackButtons({
43
43
  className: cn(
44
44
  "rounded-md transition-colors",
45
45
  sizeStyles[size],
46
- feedback === "like" ? "text-[var(--axis-status-success)] bg-[var(--axis-status-success)]/10" : "text-[var(--axis-text-tertiary)] hover:text-[var(--axis-text-secondary)] hover:bg-[var(--axis-surface-secondary)]"
46
+ feedback === "like" ? "text-[var(--axis-status-success)] bg-[color:color-mix(in_srgb,var(--axis-status-success)_10%,transparent)]" : "text-[var(--axis-text-tertiary)] hover:text-[var(--axis-text-secondary)] hover:bg-[var(--axis-surface-secondary)]"
47
47
  ),
48
48
  children: /* @__PURE__ */ jsx("svg", { className: iconSizes[size], fill: feedback === "like" ? "currentColor" : "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M14 9V5a3 3 0 00-3-3l-4 9v11h11.28a2 2 0 002-1.7l1.38-9a2 2 0 00-2-2.3H14zm-9 11H3a2 2 0 01-2-2v-7a2 2 0 012-2h2" }) })
49
49
  }
@@ -57,7 +57,7 @@ function FeedbackButtons({
57
57
  className: cn(
58
58
  "rounded-md transition-colors",
59
59
  sizeStyles[size],
60
- feedback === "dislike" ? "text-[var(--axis-status-error)] bg-[var(--axis-status-error)]/10" : "text-[var(--axis-text-tertiary)] hover:text-[var(--axis-text-secondary)] hover:bg-[var(--axis-surface-secondary)]"
60
+ feedback === "dislike" ? "text-[var(--axis-status-error)] bg-[color:color-mix(in_srgb,var(--axis-status-error)_10%,transparent)]" : "text-[var(--axis-text-tertiary)] hover:text-[var(--axis-text-secondary)] hover:bg-[var(--axis-surface-secondary)]"
61
61
  ),
62
62
  children: /* @__PURE__ */ jsx("svg", { className: iconSizes[size], fill: feedback === "dislike" ? "currentColor" : "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 15V19a3 3 0 003 3l4-9V2H5.72a2 2 0 00-2 1.7l-1.38 9a2 2 0 002 2.3H10zm9-13h2a2 2 0 012 2v7a2 2 0 01-2 2h-2" }) })
63
63
  }
package/dist/{chunk-WMQGJIAF.mjs → chunk-SCXUEQLI.mjs} RENAMED
@@ -7,10 +7,10 @@ import * as React from "react";
7
7
  import { cn } from "@axis-ds/ui-react";
8
8
  import { jsx, jsxs } from "react/jsx-runtime";
9
9
  var statusColors = {
10
- pending: "bg-[var(--axis-status-neutral-muted)]",
11
- running: "bg-[var(--axis-status-running)] animate-pulse",
12
- complete: "bg-[var(--axis-status-success)]",
13
- error: "bg-[var(--axis-status-error)]"
10
+ pending: "bg-[var(--axis-status-neutral-muted)] text-[var(--axis-status-neutral-muted-contrast)]",
11
+ running: "bg-[var(--axis-status-running)] text-[var(--axis-status-running-contrast)] animate-pulse",
12
+ complete: "bg-[var(--axis-status-success)] text-[var(--axis-status-success-contrast)]",
13
+ error: "bg-[var(--axis-status-error)] text-[var(--axis-status-error-contrast)]"
14
14
  };
15
15
  var statusIcons = {
16
16
  pending: null,
@@ -89,7 +89,7 @@ function RunProgress({
89
89
  "div",
90
90
  {
91
91
  className: cn(
92
- "w-5 h-5 rounded-full flex items-center justify-center text-white text-xs",
92
+ "w-5 h-5 rounded-full flex items-center justify-center text-xs",
93
93
  statusColors[step.status]
94
94
  ),
95
95
  "aria-hidden": "true",
package/dist/{chunk-MVBXXDZB.mjs → chunk-ZW4Z27AB.mjs} RENAMED
@@ -12,7 +12,7 @@ function SurfaceRenderer({
12
12
  return /* @__PURE__ */ jsx("div", { className: "prose prose-sm max-w-none text-[var(--axis-text-primary)]", children: String(surface.content) });
13
13
  case "code":
14
14
  return /* @__PURE__ */ jsx("pre", { className: "p-3 rounded-md bg-[var(--axis-surface-secondary)] overflow-x-auto", children: /* @__PURE__ */ jsx("code", { className: "text-sm font-mono text-[var(--axis-text-primary)]", children: String(surface.content) }) });
15
- case "table":
15
+ case "table": {
16
16
  const tableData = surface.content;
17
17
  return /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs("table", { role: "table", className: "w-full text-sm", children: [
18
18
  surface.title && /* @__PURE__ */ jsx("caption", { className: "sr-only", children: surface.title }),
@@ -41,6 +41,7 @@ function SurfaceRenderer({
41
41
  i
42
42
  )) })
43
43
  ] }) });
44
+ }
44
45
  case "chart":
45
46
  return /* @__PURE__ */ jsxs("div", { className: "p-4 text-center text-[var(--axis-text-secondary)]", children: [
46
47
  "[\uCC28\uD2B8: ",
package/dist/diff-viewer/index.js CHANGED
@@ -79,8 +79,8 @@ function computeDiff(before, after) {
79
79
  return result;
80
80
  }
81
81
  var lineTypeStyles = {
82
- added: "bg-[var(--axis-diff-added)]/10",
83
- removed: "bg-[var(--axis-diff-removed)]/10",
82
+ added: "bg-[color:color-mix(in_srgb,var(--axis-diff-added)_10%,transparent)]",
83
+ removed: "bg-[color:color-mix(in_srgb,var(--axis-diff-removed)_10%,transparent)]",
84
84
  unchanged: ""
85
85
  };
86
86
  var lineTypeTextStyles = {
package/dist/diff-viewer/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  DiffViewer
3
- } from "../chunk-ZFU34YYY.mjs";
3
+ } from "../chunk-IOF4OET6.mjs";
4
4
  import "../chunk-SCZ4BQ2G.mjs";
5
5
  export {
6
6
  DiffViewer
package/dist/feedback-buttons/index.js CHANGED
@@ -82,7 +82,7 @@ function FeedbackButtons({
82
82
  className: (0, import_ui_react.cn)(
83
83
  "rounded-md transition-colors",
84
84
  sizeStyles[size],
85
- feedback === "like" ? "text-[var(--axis-status-success)] bg-[var(--axis-status-success)]/10" : "text-[var(--axis-text-tertiary)] hover:text-[var(--axis-text-secondary)] hover:bg-[var(--axis-surface-secondary)]"
85
+ feedback === "like" ? "text-[var(--axis-status-success)] bg-[color:color-mix(in_srgb,var(--axis-status-success)_10%,transparent)]" : "text-[var(--axis-text-tertiary)] hover:text-[var(--axis-text-secondary)] hover:bg-[var(--axis-surface-secondary)]"
86
86
  ),
87
87
  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className: iconSizes[size], fill: feedback === "like" ? "currentColor" : "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M14 9V5a3 3 0 00-3-3l-4 9v11h11.28a2 2 0 002-1.7l1.38-9a2 2 0 00-2-2.3H14zm-9 11H3a2 2 0 01-2-2v-7a2 2 0 012-2h2" }) })
88
88
  }
@@ -96,7 +96,7 @@ function FeedbackButtons({
96
96
  className: (0, import_ui_react.cn)(
97
97
  "rounded-md transition-colors",
98
98
  sizeStyles[size],
99
- feedback === "dislike" ? "text-[var(--axis-status-error)] bg-[var(--axis-status-error)]/10" : "text-[var(--axis-text-tertiary)] hover:text-[var(--axis-text-secondary)] hover:bg-[var(--axis-surface-secondary)]"
99
+ feedback === "dislike" ? "text-[var(--axis-status-error)] bg-[color:color-mix(in_srgb,var(--axis-status-error)_10%,transparent)]" : "text-[var(--axis-text-tertiary)] hover:text-[var(--axis-text-secondary)] hover:bg-[var(--axis-surface-secondary)]"
100
100
  ),
101
101
  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className: iconSizes[size], fill: feedback === "dislike" ? "currentColor" : "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 15V19a3 3 0 003 3l4-9V2H5.72a2 2 0 00-2 1.7l-1.38 9a2 2 0 002 2.3H10zm9-13h2a2 2 0 012 2v7a2 2 0 01-2 2h-2" }) })
102
102
  }
package/dist/feedback-buttons/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  FeedbackButtons
3
- } from "../chunk-YHCEJ2L5.mjs";
3
+ } from "../chunk-R4CMHIRO.mjs";
4
4
  import "../chunk-SCZ4BQ2G.mjs";
5
5
  export {
6
6
  FeedbackButtons
package/dist/index.js CHANGED
@@ -115,10 +115,10 @@ var PLAN_STATUS_LABELS = {
115
115
  // src/run-progress/index.tsx
116
116
  var import_jsx_runtime = require("react/jsx-runtime");
117
117
  var statusColors = {
118
- pending: "bg-[var(--axis-status-neutral-muted)]",
119
- running: "bg-[var(--axis-status-running)] animate-pulse",
120
- complete: "bg-[var(--axis-status-success)]",
121
- error: "bg-[var(--axis-status-error)]"
118
+ pending: "bg-[var(--axis-status-neutral-muted)] text-[var(--axis-status-neutral-muted-contrast)]",
119
+ running: "bg-[var(--axis-status-running)] text-[var(--axis-status-running-contrast)] animate-pulse",
120
+ complete: "bg-[var(--axis-status-success)] text-[var(--axis-status-success-contrast)]",
121
+ error: "bg-[var(--axis-status-error)] text-[var(--axis-status-error-contrast)]"
122
122
  };
123
123
  var statusIcons = {
124
124
  pending: null,
@@ -197,7 +197,7 @@ function RunProgress({
197
197
  "div",
198
198
  {
199
199
  className: (0, import_ui_react.cn)(
200
- "w-5 h-5 rounded-full flex items-center justify-center text-white text-xs",
200
+ "w-5 h-5 rounded-full flex items-center justify-center text-xs",
201
201
  statusColors[step.status]
202
202
  ),
203
203
  "aria-hidden": "true",
@@ -289,7 +289,7 @@ function StepTimeline({
289
289
  step.status === "skipped" && "bg-[var(--axis-status-neutral-muted)]",
290
290
  step.status === "pending" && "bg-[var(--axis-status-neutral-muted)]"
291
291
  ),
292
- children: step.status === "complete" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { className: "w-3 h-3 text-white", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 3, d: "M5 13l4 4L19 7" }) })
292
+ children: step.status === "complete" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { className: "w-3 h-3 text-[var(--axis-status-success-contrast)]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 3, d: "M5 13l4 4L19 7" }) })
293
293
  }
294
294
  ),
295
295
  /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: (0, import_ui_react2.cn)(isVertical ? "flex-1" : "text-center mt-2"), children: [
@@ -713,7 +713,7 @@ function SurfaceRenderer({
713
713
  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "prose prose-sm max-w-none text-[var(--axis-text-primary)]", children: String(surface.content) });
714
714
  case "code":
715
715
  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("pre", { className: "p-3 rounded-md bg-[var(--axis-surface-secondary)] overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("code", { className: "text-sm font-mono text-[var(--axis-text-primary)]", children: String(surface.content) }) });
716
- case "table":
716
+ case "table": {
717
717
  const tableData = surface.content;
718
718
  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("table", { role: "table", className: "w-full text-sm", children: [
719
719
  surface.title && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("caption", { className: "sr-only", children: surface.title }),
@@ -742,6 +742,7 @@ function SurfaceRenderer({
742
742
  i
743
743
  )) })
744
744
  ] }) });
745
+ }
745
746
  case "chart":
746
747
  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "p-4 text-center text-[var(--axis-text-secondary)]", children: [
747
748
  "[\uCC28\uD2B8: ",
@@ -904,7 +905,7 @@ function AgentAvatar({
904
905
  {
905
906
  "aria-hidden": "true",
906
907
  className: (0, import_ui_react10.cn)(
907
- "rounded-full flex items-center justify-center font-medium text-white",
908
+ "rounded-full flex items-center justify-center font-medium text-[var(--axis-agent-avatar-text)]",
908
909
  sizeStyles2[size],
909
910
  typeColors[type]
910
911
  ),
@@ -933,7 +934,7 @@ var import_jsx_runtime11 = require("react/jsx-runtime");
933
934
  var roleStyles = {
934
935
  user: {
935
936
  container: "flex-row-reverse",
936
- bubble: "bg-[var(--axis-agent-message-user-bg)] text-white rounded-br-sm"
937
+ bubble: "bg-[var(--axis-agent-message-user-bg)] text-[var(--axis-agent-message-user-text)] rounded-br-sm"
937
938
  },
938
939
  assistant: {
939
940
  container: "flex-row",
@@ -1067,7 +1068,7 @@ function FeedbackButtons({
1067
1068
  className: (0, import_ui_react12.cn)(
1068
1069
  "rounded-md transition-colors",
1069
1070
  sizeStyles3[size],
1070
- feedback === "like" ? "text-[var(--axis-status-success)] bg-[var(--axis-status-success)]/10" : "text-[var(--axis-text-tertiary)] hover:text-[var(--axis-text-secondary)] hover:bg-[var(--axis-surface-secondary)]"
1071
+ feedback === "like" ? "text-[var(--axis-status-success)] bg-[color:color-mix(in_srgb,var(--axis-status-success)_10%,transparent)]" : "text-[var(--axis-text-tertiary)] hover:text-[var(--axis-text-secondary)] hover:bg-[var(--axis-surface-secondary)]"
1071
1072
  ),
1072
1073
  children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("svg", { className: iconSizes[size], fill: feedback === "like" ? "currentColor" : "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M14 9V5a3 3 0 00-3-3l-4 9v11h11.28a2 2 0 002-1.7l1.38-9a2 2 0 00-2-2.3H14zm-9 11H3a2 2 0 01-2-2v-7a2 2 0 012-2h2" }) })
1073
1074
  }
@@ -1081,7 +1082,7 @@ function FeedbackButtons({
1081
1082
  className: (0, import_ui_react12.cn)(
1082
1083
  "rounded-md transition-colors",
1083
1084
  sizeStyles3[size],
1084
- feedback === "dislike" ? "text-[var(--axis-status-error)] bg-[var(--axis-status-error)]/10" : "text-[var(--axis-text-tertiary)] hover:text-[var(--axis-text-secondary)] hover:bg-[var(--axis-surface-secondary)]"
1085
+ feedback === "dislike" ? "text-[var(--axis-status-error)] bg-[color:color-mix(in_srgb,var(--axis-status-error)_10%,transparent)]" : "text-[var(--axis-text-tertiary)] hover:text-[var(--axis-text-secondary)] hover:bg-[var(--axis-surface-secondary)]"
1085
1086
  ),
1086
1087
  children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("svg", { className: iconSizes[size], fill: feedback === "dislike" ? "currentColor" : "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 15V19a3 3 0 003 3l4-9V2H5.72a2 2 0 00-2 1.7l-1.38 9a2 2 0 002 2.3H10zm9-13h2a2 2 0 012 2v7a2 2 0 01-2 2h-2" }) })
1087
1088
  }
@@ -1206,8 +1207,8 @@ function computeDiff(before, after) {
1206
1207
  return result;
1207
1208
  }
1208
1209
  var lineTypeStyles = {
1209
- added: "bg-[var(--axis-diff-added)]/10",
1210
- removed: "bg-[var(--axis-diff-removed)]/10",
1210
+ added: "bg-[color:color-mix(in_srgb,var(--axis-diff-added)_10%,transparent)]",
1211
+ removed: "bg-[color:color-mix(in_srgb,var(--axis-diff-removed)_10%,transparent)]",
1211
1212
  unchanged: ""
1212
1213
  };
1213
1214
  var lineTypeTextStyles = {
@@ -1334,23 +1335,23 @@ var planStatusStyles = {
1334
1335
  },
1335
1336
  pending: {
1336
1337
  border: "border-l-[var(--axis-status-warning)]",
1337
- badge: "bg-[var(--axis-status-warning)]/10 text-[var(--axis-status-warning-strong)]"
1338
+ badge: "bg-[var(--axis-badge-warning-bg)] text-[var(--axis-badge-warning-text)]"
1338
1339
  },
1339
1340
  approved: {
1340
1341
  border: "border-l-[var(--axis-status-success)]",
1341
- badge: "bg-[var(--axis-status-success)]/10 text-[var(--axis-status-success-strong)]"
1342
+ badge: "bg-[var(--axis-badge-success-bg)] text-[var(--axis-badge-success-text)]"
1342
1343
  },
1343
1344
  rejected: {
1344
1345
  border: "border-l-[var(--axis-status-error)]",
1345
- badge: "bg-[var(--axis-status-error)]/10 text-[var(--axis-status-error-strong)]"
1346
+ badge: "bg-[var(--axis-badge-error-bg)] text-[var(--axis-badge-error-text)]"
1346
1347
  },
1347
1348
  executing: {
1348
1349
  border: "border-l-[var(--axis-status-running)]",
1349
- badge: "bg-[var(--axis-status-running)]/10 text-[var(--axis-status-running-strong)]"
1350
+ badge: "bg-[var(--axis-badge-info-bg)] text-[var(--axis-badge-info-text)]"
1350
1351
  },
1351
1352
  completed: {
1352
1353
  border: "border-l-[var(--axis-status-success)]",
1353
- badge: "bg-[var(--axis-status-success)]/10 text-[var(--axis-status-success-strong)]"
1354
+ badge: "bg-[var(--axis-badge-success-bg)] text-[var(--axis-badge-success-text)]"
1354
1355
  }
1355
1356
  };
1356
1357
  var stepStatusIcons = {
@@ -1382,7 +1383,7 @@ function PlanCard({
1382
1383
  role: "region",
1383
1384
  "aria-labelledby": titleId,
1384
1385
  className: (0, import_ui_react15.cn)(
1385
- "rounded-lg border border-l-4 overflow-hidden",
1386
+ "rounded-lg border border-l-[length:var(--axis-plan-card-accent-width)] overflow-hidden",
1386
1387
  "bg-[var(--axis-surface-default)] border-[var(--axis-border-default)]",
1387
1388
  styles.border,
1388
1389
  className
@@ -1441,7 +1442,7 @@ function PlanCard({
1441
1442
  "button",
1442
1443
  {
1443
1444
  onClick: onApprove,
1444
- className: "px-3 py-1.5 text-xs font-medium rounded-md bg-[var(--axis-status-success)] text-white hover:bg-[var(--axis-status-success-strong)] transition-colors",
1445
+ className: "px-3 py-1.5 text-xs font-medium rounded-md bg-[var(--axis-status-success)] text-[var(--axis-status-success-contrast)] hover:bg-[var(--axis-status-success-strong)] transition-colors",
1445
1446
  children: "\uC2B9\uC778"
1446
1447
  }
1447
1448
  ),
@@ -1457,7 +1458,7 @@ function PlanCard({
1457
1458
  "button",
1458
1459
  {
1459
1460
  onClick: onReject,
1460
- className: "px-3 py-1.5 text-xs font-medium rounded-md text-[var(--axis-status-error)] hover:bg-[var(--axis-status-error)]/10 transition-colors",
1461
+ className: "px-3 py-1.5 text-xs font-medium rounded-md text-[var(--axis-status-error)] hover:text-[var(--axis-plan-card-reject-hover-text)] hover:bg-[color:color-mix(in_srgb,var(--axis-status-error)_10%,transparent)] transition-colors",
1461
1462
  children: "\uAC70\uC808"
1462
1463
  }
1463
1464
  )
@@ -1685,7 +1686,7 @@ function AttachmentCard({
1685
1686
  className: (0, import_ui_react18.cn)(
1686
1687
  "flex items-center gap-3 rounded-lg border p-3",
1687
1688
  "bg-[var(--axis-surface-default)] border-[var(--axis-border-default)]",
1688
- status === "error" && "border-[var(--axis-status-error)]/30",
1689
+ status === "error" && "border-[var(--axis-status-error-border)]",
1689
1690
  className
1690
1691
  ),
1691
1692
  children: [
package/dist/index.mjs CHANGED
@@ -9,37 +9,37 @@ import {
9
9
  } from "./chunk-WFYQINWD.mjs";
10
10
  import {
11
11
  MessageBubble
12
- } from "./chunk-KPRUFC34.mjs";
12
+ } from "./chunk-J4FIMXXG.mjs";
13
13
  import {
14
14
  PlanCard
15
- } from "./chunk-WUA5Q76Y.mjs";
16
- import {
17
- RunProgress
18
- } from "./chunk-WMQGJIAF.mjs";
15
+ } from "./chunk-OYQX3SL4.mjs";
19
16
  import {
20
17
  RecoveryBanner
21
18
  } from "./chunk-UDL4M5RP.mjs";
19
+ import {
20
+ RunProgress
21
+ } from "./chunk-SCXUEQLI.mjs";
22
22
  import {
23
23
  SourcePanel
24
24
  } from "./chunk-DPLGRVNQ.mjs";
25
25
  import {
26
26
  StepTimeline
27
- } from "./chunk-M325YRLE.mjs";
27
+ } from "./chunk-4V4BWBRC.mjs";
28
28
  import {
29
29
  StreamingText
30
30
  } from "./chunk-GQYOOLDL.mjs";
31
31
  import {
32
32
  SurfaceRenderer
33
- } from "./chunk-MVBXXDZB.mjs";
33
+ } from "./chunk-ZW4Z27AB.mjs";
34
+ import {
35
+ AgentAvatar
36
+ } from "./chunk-JY7MTMMB.mjs";
34
37
  import {
35
38
  ApprovalCard
36
39
  } from "./chunk-7HTVJ6MK.mjs";
37
- import {
38
- AgentAvatar
39
- } from "./chunk-RPW4Y5G2.mjs";
40
40
  import {
41
41
  AttachmentCard
42
- } from "./chunk-2A5QQFYL.mjs";
42
+ } from "./chunk-42KEAZ2Y.mjs";
43
43
  import {
44
44
  CodeBlock
45
45
  } from "./chunk-4CMUEGLK.mjs";
@@ -48,10 +48,10 @@ import {
48
48
  } from "./chunk-KJVPVBET.mjs";
49
49
  import {
50
50
  DiffViewer
51
- } from "./chunk-ZFU34YYY.mjs";
51
+ } from "./chunk-IOF4OET6.mjs";
52
52
  import {
53
53
  FeedbackButtons
54
- } from "./chunk-YHCEJ2L5.mjs";
54
+ } from "./chunk-R4CMHIRO.mjs";
55
55
  import "./chunk-SCZ4BQ2G.mjs";
56
56
  export {
57
57
  AgentAvatar,
package/dist/message-bubble/index.js CHANGED
@@ -37,7 +37,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
37
37
  var roleStyles = {
38
38
  user: {
39
39
  container: "flex-row-reverse",
40
- bubble: "bg-[var(--axis-agent-message-user-bg)] text-white rounded-br-sm"
40
+ bubble: "bg-[var(--axis-agent-message-user-bg)] text-[var(--axis-agent-message-user-text)] rounded-br-sm"
41
41
  },
42
42
  assistant: {
43
43
  container: "flex-row",
package/dist/message-bubble/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  MessageBubble
3
- } from "../chunk-KPRUFC34.mjs";
3
+ } from "../chunk-J4FIMXXG.mjs";
4
4
  import "../chunk-SCZ4BQ2G.mjs";
5
5
  export {
6
6
  MessageBubble
package/dist/plan-card/index.js CHANGED
@@ -64,23 +64,23 @@ var planStatusStyles = {
64
64
  },
65
65
  pending: {
66
66
  border: "border-l-[var(--axis-status-warning)]",
67
- badge: "bg-[var(--axis-status-warning)]/10 text-[var(--axis-status-warning-strong)]"
67
+ badge: "bg-[var(--axis-badge-warning-bg)] text-[var(--axis-badge-warning-text)]"
68
68
  },
69
69
  approved: {
70
70
  border: "border-l-[var(--axis-status-success)]",
71
- badge: "bg-[var(--axis-status-success)]/10 text-[var(--axis-status-success-strong)]"
71
+ badge: "bg-[var(--axis-badge-success-bg)] text-[var(--axis-badge-success-text)]"
72
72
  },
73
73
  rejected: {
74
74
  border: "border-l-[var(--axis-status-error)]",
75
- badge: "bg-[var(--axis-status-error)]/10 text-[var(--axis-status-error-strong)]"
75
+ badge: "bg-[var(--axis-badge-error-bg)] text-[var(--axis-badge-error-text)]"
76
76
  },
77
77
  executing: {
78
78
  border: "border-l-[var(--axis-status-running)]",
79
- badge: "bg-[var(--axis-status-running)]/10 text-[var(--axis-status-running-strong)]"
79
+ badge: "bg-[var(--axis-badge-info-bg)] text-[var(--axis-badge-info-text)]"
80
80
  },
81
81
  completed: {
82
82
  border: "border-l-[var(--axis-status-success)]",
83
- badge: "bg-[var(--axis-status-success)]/10 text-[var(--axis-status-success-strong)]"
83
+ badge: "bg-[var(--axis-badge-success-bg)] text-[var(--axis-badge-success-text)]"
84
84
  }
85
85
  };
86
86
  var stepStatusIcons = {
@@ -112,7 +112,7 @@ function PlanCard({
112
112
  role: "region",
113
113
  "aria-labelledby": titleId,
114
114
  className: (0, import_ui_react.cn)(
115
- "rounded-lg border border-l-4 overflow-hidden",
115
+ "rounded-lg border border-l-[length:var(--axis-plan-card-accent-width)] overflow-hidden",
116
116
  "bg-[var(--axis-surface-default)] border-[var(--axis-border-default)]",
117
117
  styles.border,
118
118
  className
@@ -171,7 +171,7 @@ function PlanCard({
171
171
  "button",
172
172
  {
173
173
  onClick: onApprove,
174
- className: "px-3 py-1.5 text-xs font-medium rounded-md bg-[var(--axis-status-success)] text-white hover:bg-[var(--axis-status-success-strong)] transition-colors",
174
+ className: "px-3 py-1.5 text-xs font-medium rounded-md bg-[var(--axis-status-success)] text-[var(--axis-status-success-contrast)] hover:bg-[var(--axis-status-success-strong)] transition-colors",
175
175
  children: "\uC2B9\uC778"
176
176
  }
177
177
  ),
@@ -187,7 +187,7 @@ function PlanCard({
187
187
  "button",
188
188
  {
189
189
  onClick: onReject,
190
- className: "px-3 py-1.5 text-xs font-medium rounded-md text-[var(--axis-status-error)] hover:bg-[var(--axis-status-error)]/10 transition-colors",
190
+ className: "px-3 py-1.5 text-xs font-medium rounded-md text-[var(--axis-status-error)] hover:text-[var(--axis-plan-card-reject-hover-text)] hover:bg-[color:color-mix(in_srgb,var(--axis-status-error)_10%,transparent)] transition-colors",
191
191
  children: "\uAC70\uC808"
192
192
  }
193
193
  )
package/dist/plan-card/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  PlanCard
3
- } from "../chunk-WUA5Q76Y.mjs";
3
+ } from "../chunk-OYQX3SL4.mjs";
4
4
  import "../chunk-SCZ4BQ2G.mjs";
5
5
  export {
6
6
  PlanCard
package/dist/run-progress/index.js CHANGED
@@ -50,10 +50,10 @@ var STATUS_LABELS = {
50
50
  // src/run-progress/index.tsx
51
51
  var import_jsx_runtime = require("react/jsx-runtime");
52
52
  var statusColors = {
53
- pending: "bg-[var(--axis-status-neutral-muted)]",
54
- running: "bg-[var(--axis-status-running)] animate-pulse",
55
- complete: "bg-[var(--axis-status-success)]",
56
- error: "bg-[var(--axis-status-error)]"
53
+ pending: "bg-[var(--axis-status-neutral-muted)] text-[var(--axis-status-neutral-muted-contrast)]",
54
+ running: "bg-[var(--axis-status-running)] text-[var(--axis-status-running-contrast)] animate-pulse",
55
+ complete: "bg-[var(--axis-status-success)] text-[var(--axis-status-success-contrast)]",
56
+ error: "bg-[var(--axis-status-error)] text-[var(--axis-status-error-contrast)]"
57
57
  };
58
58
  var statusIcons = {
59
59
  pending: null,
@@ -132,7 +132,7 @@ function RunProgress({
132
132
  "div",
133
133
  {
134
134
  className: (0, import_ui_react.cn)(
135
- "w-5 h-5 rounded-full flex items-center justify-center text-white text-xs",
135
+ "w-5 h-5 rounded-full flex items-center justify-center text-xs",
136
136
  statusColors[step.status]
137
137
  ),
138
138
  "aria-hidden": "true",
package/dist/run-progress/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  RunProgress
3
- } from "../chunk-WMQGJIAF.mjs";
3
+ } from "../chunk-SCXUEQLI.mjs";
4
4
  import "../chunk-SCZ4BQ2G.mjs";
5
5
  export {
6
6
  RunProgress
package/dist/step-timeline/index.js CHANGED
@@ -85,7 +85,7 @@ function StepTimeline({
85
85
  step.status === "skipped" && "bg-[var(--axis-status-neutral-muted)]",
86
86
  step.status === "pending" && "bg-[var(--axis-status-neutral-muted)]"
87
87
  ),
88
- children: step.status === "complete" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className: "w-3 h-3 text-white", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 3, d: "M5 13l4 4L19 7" }) })
88
+ children: step.status === "complete" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className: "w-3 h-3 text-[var(--axis-status-success-contrast)]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 3, d: "M5 13l4 4L19 7" }) })
89
89
  }
90
90
  ),
91
91
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: (0, import_ui_react.cn)(isVertical ? "flex-1" : "text-center mt-2"), children: [
package/dist/step-timeline/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  StepTimeline
3
- } from "../chunk-M325YRLE.mjs";
3
+ } from "../chunk-4V4BWBRC.mjs";
4
4
  import "../chunk-SCZ4BQ2G.mjs";
5
5
  export {
6
6
  StepTimeline
package/dist/surface-renderer/index.js CHANGED
@@ -36,7 +36,7 @@ function SurfaceRenderer({
36
36
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "prose prose-sm max-w-none text-[var(--axis-text-primary)]", children: String(surface.content) });
37
37
  case "code":
38
38
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("pre", { className: "p-3 rounded-md bg-[var(--axis-surface-secondary)] overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("code", { className: "text-sm font-mono text-[var(--axis-text-primary)]", children: String(surface.content) }) });
39
- case "table":
39
+ case "table": {
40
40
  const tableData = surface.content;
41
41
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("table", { role: "table", className: "w-full text-sm", children: [
42
42
  surface.title && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("caption", { className: "sr-only", children: surface.title }),
@@ -65,6 +65,7 @@ function SurfaceRenderer({
65
65
  i
66
66
  )) })
67
67
  ] }) });
68
+ }
68
69
  case "chart":
69
70
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "p-4 text-center text-[var(--axis-text-secondary)]", children: [
70
71
  "[\uCC28\uD2B8: ",
package/dist/surface-renderer/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  SurfaceRenderer
3
- } from "../chunk-MVBXXDZB.mjs";
3
+ } from "../chunk-ZW4Z27AB.mjs";
4
4
  export {
5
5
  SurfaceRenderer
6
6
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@axis-ds/agentic-ui",
3
- "version": "1.2.1",
3
+ "version": "1.4.0",
4
4
  "description": "AXIS Design System - Agentic UI Components for AI/LLM Applications",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",
@@ -70,11 +70,13 @@
70
70
  "types": "./dist/attachment-card/index.d.ts",
71
71
  "import": "./dist/attachment-card/index.mjs",
72
72
  "require": "./dist/attachment-card/index.js"
73
- }
73
+ },
74
+ "./tailwind.css": "./tailwind.css"
74
75
  },
75
76
  "sideEffects": false,
76
77
  "files": [
77
- "dist"
78
+ "dist",
79
+ "tailwind.css"
78
80
  ],
79
81
  "publishConfig": {
80
82
  "access": "public"
@@ -88,8 +90,8 @@
88
90
  "clsx": "^2.1.0",
89
91
  "framer-motion": "^11.0.0",
90
92
  "tailwind-merge": "^2.5.0",
91
- "@axis-ds/tokens": "1.2.1",
92
- "@axis-ds/ui-react": "1.2.1"
93
+ "@axis-ds/tokens": "1.4.0",
94
+ "@axis-ds/ui-react": "1.4.0"
93
95
  },
94
96
  "devDependencies": {
95
97
  "@testing-library/jest-dom": "^6.9.1",
@@ -126,6 +128,7 @@
126
128
  "build": "tsup src/index.ts src/*/index.tsx --format cjs,esm --dts --external react",
127
129
  "dev": "tsup src/index.ts --format cjs,esm --dts --watch --external react",
128
130
  "clean": "rm -rf dist",
131
+ "lint": "eslint .",
129
132
  "test": "vitest run",
130
133
  "test:coverage": "vitest run --coverage",
131
134
  "test:watch": "vitest",
package/tailwind.css ADDED
@@ -0,0 +1,10 @@
1
+ /*
2
+ * @axis-ds/agentic-ui - Tailwind CSS 4 스캔 진입점
3
+ *
4
+ * Tailwind 4 는 node_modules 를 자동 스캔하지 않아서, 컴포넌트가 쓰는 클래스
5
+ * (예: bg-[var(--axis-button-bg-default)])가 생성되지 않습니다. 전역 CSS 에서
6
+ * @import "@axis-ds/agentic-ui/tailwind.css";
7
+ * 한 줄을 넣으면 아래 @source 가 이 패키지의 빌드 산출물을 스캔 대상에 더합니다.
8
+ * 경로는 이 파일 기준 상대 경로입니다. 스타일 규칙은 담지 않습니다.
9
+ */
10
+ @source "./dist";