@spectrabrain/eds 0.2.2 → 0.3.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.
- package/AI.md +1 -1
- package/CHANGELOG.md +12 -0
- package/README.md +3 -5
- package/dist/components/Button/spec.json +1 -1
- package/dist/components.css +6 -6
- package/package.json +2 -2
package/AI.md
CHANGED
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
|
|
7
7
|
- light theme, `AI_CONTEXT.json`의 `components`에 있는 컴포넌트(현재 `Button`), 공개 semantic color·typography·spacing·radius token과 token runtime API(`@spectrabrain/eds/tokens`)를 제공합니다.
|
|
8
8
|
- 패키지는 Tailwind preset·plugin·utility를 export하지 않습니다. Tailwind class는 소비처의 `eds sync`가 `src/styles/eds-tokens.css`에 생성한 것만 씁니다.
|
|
9
|
-
- dark theme과 목록 밖 컴포넌트는 지원 범위 밖입니다. EDS component가 없거나 필요한 prop·variant·state·slot contract가 맞지 않으면 소비처에서 로컬 UI를 구현하고, 공개 token으로 색상·typography·spacing·radius를 지정합니다.
|
|
9
|
+
- dark theme과 목록 밖 컴포넌트는 지원 범위 밖입니다. EDS component가 없거나 필요한 prop·variant·state·slot contract가 맞지 않으면 소비처에서 로컬 UI를 구현하고, 공개 token으로 색상·typography·spacing·radius를 지정합니다.
|
|
10
10
|
- CSS 진입점 구성은 `CONSUMER_AGENT.md` 「font 정책」을 따릅니다.
|
|
11
11
|
|
|
12
12
|
## 사용 경계
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# @spectrabrain/eds
|
|
2
2
|
|
|
3
|
+
## 0.3.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 4d5cc59: 소비처 조치: 없습니다.
|
|
8
|
+
|
|
9
|
+
Button의 neutral/outline은 기본·비활성 상태에서 neutral primary 배경과 tertiary neutral 테두리를 사용하고, hover·loading 상태에서 neutral primary hover 배경을 사용합니다.
|
|
10
|
+
|
|
11
|
+
- 556fdca: 소비처 조치: 없습니다.
|
|
12
|
+
|
|
13
|
+
소비처 AI 공개 문서에서 내부 크기 제한, 반복 안내와 불필요한 패키지 구현 세부사항을 줄입니다.
|
|
14
|
+
|
|
3
15
|
## 0.2.2
|
|
4
16
|
|
|
5
17
|
### Patch Changes
|
package/README.md
CHANGED
|
@@ -11,7 +11,7 @@ npx @spectrabrain/eds init
|
|
|
11
11
|
|
|
12
12
|
`init`은 소비처 `package.json`에 `sync:eds`·`eds:doctor` script와 doctor hook을 등록하고 첫 동기화를 실행합니다. EDS를 업데이트한 뒤에는 `npm run sync:eds`로 Tailwind root CSS의 EDS import, Tailwind token alias, `AGENTS.md` managed block을 갱신하고, `npm run eds:doctor`로 동기화 상태를 읽기 전용으로 점검합니다. pnpm·yarn·bun의 명령과 동작은 [CONSUMER_AGENT.md](CONSUMER_AGENT.md) 「첫 setup 절차」에 있습니다. `npx`로 실행할 때는 항상 `@spectrabrain/eds`를 적습니다. npm registry의 `eds`는 다른 패키지입니다.
|
|
13
13
|
|
|
14
|
-
소비처 AI와 자동화 도구는
|
|
14
|
+
소비처 AI와 자동화 도구는 UI 작업 전에 [QUICKSTART.md](QUICKSTART.md)를 읽습니다. 나머지 문서는 [AI_CONTEXT.json](AI_CONTEXT.json)의 조건에 해당할 때만 읽습니다.
|
|
15
15
|
|
|
16
16
|
첫 sync 전에는 소비처 `AGENTS.md`에 EDS managed block이 없습니다. 이 기간에 AI가 설치된 계약을 먼저 읽게 하려면 `CLAUDE.md` 또는 `AGENTS.md` 상단에 다음 한 줄을 넣습니다. pnpm·yarn·bun 저장소에서는 `npm run`을 그 runner로 바꿉니다. sync가 block을 넣은 뒤에는 이 줄을 지웁니다.
|
|
17
17
|
|
|
@@ -61,11 +61,9 @@ const token: SemanticTokenName = "color-fg-brand-contrast";
|
|
|
61
61
|
const color = cssVar(token); // var(--eds-color-fg-brand-contrast)
|
|
62
62
|
~~~
|
|
63
63
|
|
|
64
|
-
`SemanticTokenName`을 사용하면 승인된 token 이름을 TypeScript 자동완성으로 선택할 수 있습니다. `var(--eds-...)`의 직접 자동완성은 에디터의 CSS import 색인 방식에 따라 달라질 수 있습니다.
|
|
65
|
-
|
|
66
64
|
`spacing-0.5`처럼 소수점이 있는 public 이름은 `cssVar("spacing-0.5")`로 전달합니다. 반환되는 CSS reference는 `var(--eds-spacing-0\.5)`처럼 점을 escape합니다. Tailwind에서는 `p-eds-spacing-0-5`, `rounded-eds-radius-1` 같은 CSS-safe alias를 사용합니다.
|
|
67
65
|
|
|
68
|
-
|
|
66
|
+
TypeScript의 `moduleResolution`이 `node`(node10), `node16` 또는 `bundler`인 소비처에서도 `@spectrabrain/eds/tokens`의 타입을 사용할 수 있습니다.
|
|
69
67
|
|
|
70
68
|
역할에 맞는 exact token이 없을 때 가까운 공개 token을 고르는 순서는 [TOKEN_CONTEXT.md](TOKEN_CONTEXT.md)에 있습니다. 그래도 없으면 임의 색상값을 만들지 않고 디자인 시스템 담당자에게 요청합니다.
|
|
71
69
|
|
|
@@ -107,7 +105,7 @@ AI 바이브코딩으로 만든 Vite + React 프로토타입은 EDS를 설치한
|
|
|
107
105
|
| `@spectrabrain/eds/fonts.css` | Pretendard font만 불러옵니다. EDS text style이 참조하는 family를 선언하므로 생략하지 않습니다. |
|
|
108
106
|
| `@spectrabrain/eds/base.css` | `:where(html)`에 body1 font family를 지정합니다. `styles.css`에 포함되며 개별 구성에서는 선택입니다. |
|
|
109
107
|
| `@spectrabrain/eds/tokens.json` | 도구 연동용 semantic token manifest입니다. |
|
|
110
|
-
| `@spectrabrain/eds/QUICKSTART.md` | 소비처 AI의
|
|
108
|
+
| `@spectrabrain/eds/QUICKSTART.md` | 소비처 AI의 필수 UI 작업 안내입니다. |
|
|
111
109
|
| `@spectrabrain/eds/CONSUMER_AGENT.md` | 소비처 AI의 setup·sync·doctor 계약과 managed block 템플릿입니다. |
|
|
112
110
|
| `@spectrabrain/eds/AI.md` | 소비처 AI의 공개 범위와 사용 경계입니다. |
|
|
113
111
|
| `@spectrabrain/eds/CHANGELOG.md` | 버전별 변경 내용과 소비처 조치입니다. |
|
package/dist/components.css
CHANGED
|
@@ -106,17 +106,17 @@
|
|
|
106
106
|
--eds-button-style-neutral-link-loading-progressCircle-trackColor: #6B7280;
|
|
107
107
|
--eds-button-style-neutral-link-loading-root-backgroundColor: var(--eds-color-bg-transparent-hover);
|
|
108
108
|
--eds-button-style-neutral-outline-disabled-label-color: var(--eds-color-fg-disabled);
|
|
109
|
-
--eds-button-style-neutral-outline-disabled-root-backgroundColor: var(--eds-color-bg-
|
|
110
|
-
--eds-button-style-neutral-outline-disabled-root-borderColor: var(--eds-color-stroke-neutral-
|
|
109
|
+
--eds-button-style-neutral-outline-disabled-root-backgroundColor: var(--eds-color-bg-neutral-primary);
|
|
110
|
+
--eds-button-style-neutral-outline-disabled-root-borderColor: var(--eds-color-stroke-neutral-tertiary);
|
|
111
111
|
--eds-button-style-neutral-outline-disabled-root-borderWidth: 1px;
|
|
112
112
|
--eds-button-style-neutral-outline-enabled-label-color: var(--eds-color-fg-neutral);
|
|
113
|
-
--eds-button-style-neutral-outline-enabled-root-backgroundColor: var(--eds-color-bg-
|
|
114
|
-
--eds-button-style-neutral-outline-enabled-root-borderColor: var(--eds-color-stroke-neutral-
|
|
113
|
+
--eds-button-style-neutral-outline-enabled-root-backgroundColor: var(--eds-color-bg-neutral-primary);
|
|
114
|
+
--eds-button-style-neutral-outline-enabled-root-borderColor: var(--eds-color-stroke-neutral-tertiary);
|
|
115
115
|
--eds-button-style-neutral-outline-enabled-root-borderWidth: 1px;
|
|
116
|
-
--eds-button-style-neutral-outline-hover-root-backgroundColor: var(--eds-color-bg-
|
|
116
|
+
--eds-button-style-neutral-outline-hover-root-backgroundColor: var(--eds-color-bg-neutral-primary-hover);
|
|
117
117
|
--eds-button-style-neutral-outline-loading-progressCircle-rangeColor: var(--eds-color-fg-neutral);
|
|
118
118
|
--eds-button-style-neutral-outline-loading-progressCircle-trackColor: #D1D5DB;
|
|
119
|
-
--eds-button-style-neutral-outline-loading-root-backgroundColor: var(--eds-color-bg-
|
|
119
|
+
--eds-button-style-neutral-outline-loading-root-backgroundColor: var(--eds-color-bg-neutral-primary-hover);
|
|
120
120
|
--eds-button-style-neutral-solid-disabled-label-color: var(--eds-color-fg-disabled);
|
|
121
121
|
--eds-button-style-neutral-solid-disabled-root-backgroundColor: var(--eds-color-bg-disabled);
|
|
122
122
|
--eds-button-style-neutral-solid-enabled-label-color: var(--eds-color-fg-neutral-inverted);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrabrain/eds",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.0",
|
|
4
4
|
"description": "EVA services' shared React design system",
|
|
5
5
|
"author": "SpectraBrain",
|
|
6
6
|
"license": "UNLICENSED",
|
|
@@ -87,7 +87,7 @@
|
|
|
87
87
|
"@vitest/browser-playwright": "4.1.6",
|
|
88
88
|
"axe-core": "^4.11.0",
|
|
89
89
|
"jsdom": "^26.1.0",
|
|
90
|
-
"playwright": "1.
|
|
90
|
+
"playwright": "1.61.1",
|
|
91
91
|
"postcss": "^8.5.6",
|
|
92
92
|
"postcss-modules": "^6.0.1",
|
|
93
93
|
"react": "^19.2.8",
|