Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions .changeset/config.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,10 @@
"changelog": false,
"commit": false,
"fixed": [
["@devslab-kr/dds-tokens", "@devslab-kr/dds-css", "@devslab-kr/dds-icons", "@devslab-kr/dds-solid", "@devslab-kr/site-kit"]
["@devslab/dds-tokens", "@devslab/dds-css", "@devslab/dds-icons", "@devslab/dds-solid", "@devslab/site-kit"]
],
"linked": [],
"access": "restricted",
"access": "public",
"baseBranch": "main",
"updateInternalDependencies": "patch",
"ignore": ["@devslab/compatibility-canary"]
Expand Down
24 changes: 6 additions & 18 deletions .github/workflows/release.yml
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
name: Release restricted packages
name: Release public packages

on:
push:
Expand All @@ -7,7 +7,7 @@ on:

permissions:
contents: read
packages: write
id-token: write

jobs:
publish:
Expand All @@ -18,8 +18,8 @@ jobs:
- uses: actions/setup-node@v7
with:
node-version: 24
registry-url: https://npm.pkg.github.com
scope: "@devslab-kr"
registry-url: https://registry.npmjs.org
scope: "@devslab"
cache: pnpm
- run: pnpm install --frozen-lockfile
- run: pnpm exec playwright install --with-deps chromium
Expand All @@ -38,17 +38,5 @@ jobs:
- run: pnpm run verify:site-kit:release
- run: pnpm release
env:
NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
- name: Check package visibility
env:
GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
shell: bash
run: |
packages=(dds-tokens dds-css dds-icons dds-solid site-kit)
for package in "${packages[@]}"; do
visibility="$(gh api "orgs/devslab-kr/packages/npm/${package}" --jq '.visibility')"
if [[ "${visibility}" != "internal" ]]; then
echo "::warning title=Package visibility::@devslab-kr/${package} is ${visibility}; change it to Internal in package settings."
echo "- [ ] Set \`@devslab-kr/${package}\` visibility to **Internal**: https://github.com/orgs/devslab-kr/packages/npm/${package}/settings" >> "$GITHUB_STEP_SUMMARY"
fi
done
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
NPM_CONFIG_PROVENANCE: true
3 changes: 1 addition & 2 deletions .npmrc.example
Original file line number Diff line number Diff line change
@@ -1,2 +1 @@
@devslab-kr:registry=https://npm.pkg.github.com
//npm.pkg.github.com/:_authToken=${GITHUB_TOKEN}
@devslab:registry=https://registry.npmjs.org
74 changes: 74 additions & 0 deletions LICENSE
Original file line number Diff line number Diff line change
@@ -0,0 +1,74 @@
DevsLab Source-Available License 1.0

Copyright (c) 2026 DevsLab. All rights reserved.

This license governs the DDS software, design tokens, components, icons,
documentation, and other materials distributed with this license (the
"Software").

1. Permitted use

Subject to this license, DevsLab grants you a limited, worldwide,
non-exclusive, non-transferable, revocable, royalty-free right to:

- download and install unmodified copies of the Software;
- use and execute the Software for internal or commercial applications;
- compile, minify, tree-shake, and bundle unmodified Software solely as a
technical part of building an application; and
- distribute the resulting object code only as an inseparable part of that
application and not as a standalone library, design system, component kit,
template, or asset collection.

Normal application configuration through documented public APIs, design-token
overrides, CSS custom properties, and component properties is permitted and is
not considered modification of the Software.

2. Restrictions

Except where applicable law does not allow the restriction, you may not:

- modify, adapt, translate, reverse engineer, or create derivative works of the
Software itself;
- publish, republish, sublicense, sell, rent, host, or redistribute the
Software or any modified version as a standalone package or downloadable
collection;
- use the Software or a substantial portion of it to create or operate a
competing general-purpose design system, UI kit, component library, icon
library, token library, template marketplace, or hosted equivalent;
- remove or alter copyright, license, attribution, or provenance notices; or
- use DevsLab names, logos, product marks, or trade dress except to make a
truthful statement that an application uses the Software.

No patent, trademark, design, or branding rights are granted except the
copyright permissions stated in Section 1.

3. Ownership and feedback

The Software is licensed, not sold. DevsLab and its licensors retain all
right, title, and interest in the Software. You grant DevsLab a perpetual,
worldwide, irrevocable, royalty-free right to use feedback you voluntarily
provide about the Software.

4. Termination

This license terminates automatically if you breach it. Upon termination, you
must stop using and distributing the Software and delete all copies under your
control. Sections 2, 3, 5, and 6 survive termination.

5. Disclaimer and limitation of liability

THE SOFTWARE IS PROVIDED "AS IS" WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING MERCHANTABILITY, FITNESS FOR A PARTICULAR
PURPOSE, TITLE, AND NON-INFRINGEMENT. TO THE MAXIMUM EXTENT PERMITTED BY LAW,
DEVSLAB WILL NOT BE LIABLE FOR ANY INDIRECT, INCIDENTAL, SPECIAL,
CONSEQUENTIAL, EXEMPLARY, OR PUNITIVE DAMAGES, OR FOR LOSS OF DATA, PROFITS,
REVENUE, OR BUSINESS, ARISING FROM OR RELATED TO THE SOFTWARE.

6. Governing law

This license is governed by the laws of the Republic of Korea, excluding
conflict-of-law rules. The Seoul Central District Court has exclusive
jurisdiction over disputes arising from this license.

This is a source-available license, not an open-source license approved by the
Open Source Initiative.
32 changes: 14 additions & 18 deletions README.ko.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,8 @@
🌐 [English](README.md)

데브스랩 제품군 (devslab.kr, Linq 패밀리, 이후의 앱들) 을 위한 디자인 언어 —
웹과 모바일이 공유하는 하나의 토큰·규칙 세트.
구조는 [토스 디자인 시스템 (TDS)](https://tossmini-docs.toss.im/tds-react-native/)
를 참조 모델로 하되 프레임워크 중립적이다: 코어는 토큰 + CSS 이고
React · Vue · Ionic · React Native 는 소비자다.
웹과 모바일이 공유하는 프레임워크 중립적 토큰·컴포넌트·규칙 세트다.
코어는 토큰 + CSS 이고 React · Vue · Ionic · React Native 는 소비자다.

## 구성

Expand All @@ -15,11 +13,11 @@ React · Vue · Ionic · React Native 는 소비자다.
| [`docs/design-system.ko.md`](docs/design-system.ko.md) | 규칙 명세 (v0): 원칙, 아키텍처, 파운데이션, 컴포넌트 계약, 거버넌스 |
| [`docs/decisions.md`](docs/decisions.md) | 결정 로그 — 파운데이션·아키텍처 결정과 근거 |
| [`tokens/`](tokens/) | 디자인 토큰 소스 ([W3C 포맷](https://design-tokens.github.io/community-group/format/)): 원시 팔레트, 라이트/다크 시맨틱 매핑, 타이포·간격·라운드·그림자·모션 |
| [`packages/dds-tokens/`](packages/dds-tokens/) | `@devslab-kr/dds-tokens` — 토큰 빌드 파이프라인: `tokens.css`, Tailwind v4 `@theme` + v3 preset, `tokens.ts` (RN·런타임), `ionic.css` |
| [`packages/dds-css/`](packages/dds-css/) | `@devslab-kr/dds-css` — CSS 컴포넌트 레이어, 스펙 §4.3 v1 인벤토리 (Button, IconButton, TextField, Textarea, Select, Checkbox/Radio, Switch, Badge, Chip, Avatar, Spinner/Skeleton, Divider, Card, ListRow, Tabs, Dialog, Toast, Tooltip, EmptyState); 가이드는 [`docs/components.ko.md`](docs/components.ko.md) |
| [`packages/dds-icons/`](packages/dds-icons/) | `@devslab-kr/dds-icons` — 아이콘 세트: 코어 40종(24 그리드·1.6 스트로크) + devslab.kr `site-` 7종. SVG 파일·스프라이트·path 데이터 맵 3형태 출하 |
| [`packages/dds-solid/`](packages/dds-solid/) | `@devslab-kr/dds-solid` — controlled/uncontrolled 상태, SSR·hydration, 키보드, 포커스, 수명주기 계약을 갖춘 SolidJS 접근성 primitive |
| [`packages/site-kit/`](packages/site-kit/) | `@devslab-kr/site-kit` — 엄격한 14개 로케일 i18n, SEO/GEO 생성기, TanStack Start 메타데이터 어댑터, 접근 가능한 SolidJS 공통 셸을 담은 restricted 내부용 공개 사이트 인프라 |
| [`packages/dds-tokens/`](packages/dds-tokens/) | `@devslab/dds-tokens` — 토큰 빌드 파이프라인: `tokens.css`, Tailwind v4 `@theme` + v3 preset, `tokens.ts` (RN·런타임), `ionic.css` |
| [`packages/dds-css/`](packages/dds-css/) | `@devslab/dds-css` — CSS 컴포넌트 레이어, 스펙 §4.3 v1 인벤토리 (Button, IconButton, TextField, Textarea, Select, Checkbox/Radio, Switch, Badge, Chip, Avatar, Spinner/Skeleton, Divider, Card, ListRow, Tabs, Dialog, Toast, Tooltip, EmptyState); 가이드는 [`docs/components.ko.md`](docs/components.ko.md) |
| [`packages/dds-icons/`](packages/dds-icons/) | `@devslab/dds-icons` — 아이콘 세트: 코어 40종(24 그리드·1.6 스트로크) + devslab.kr `site-` 7종. SVG 파일·스프라이트·path 데이터 맵 3형태 출하 |
| [`packages/dds-solid/`](packages/dds-solid/) | `@devslab/dds-solid` — controlled/uncontrolled 상태, SSR·hydration, 키보드, 포커스, 수명주기 계약을 갖춘 SolidJS 접근성 primitive |
| [`packages/site-kit/`](packages/site-kit/) | `@devslab/site-kit` — 엄격한 14개 로케일 i18n, SEO/GEO 생성기, TanStack Start 메타데이터 어댑터, 접근 가능한 SolidJS 공통 셸을 담은 공개 제품 사이트 인프라 |
| [`preview/index.html`](preview/index.html) | 파운데이션·컴포넌트 미리보기 (단일 파일, 브라우저에서 바로 열림 — `components.html`, `icons.html`도 함께) |
| [`brand/index.html`](brand/index.html) | 브랜드 아이덴티티 가이드: 로고 규정, Electric Cyan, 모티프, 보이스 & 톤 |

Expand All @@ -39,7 +37,7 @@ pnpm 워크스페이스. `pnpm install` 후:
- `pnpm verify` — 빌드 + 토큰 검증 + 문서·preview↔토큰 불일치 검사 (CI와 동일)
- `pnpm storybook` — 컴포넌트·파운데이션 스토리 (:6006, 툴바에서 테마 전환);
정적 사이트는 `pnpm build-storybook` (CI에서도 빌드 검증)
- `pnpm verify:names` — 비공개 `@devslab-kr/*` 스코프에서 벗어난 패키지명을 거부
- `pnpm verify:names` — 패키지명·라이선스·공개 레지스트리 설정 드리프트를 거부
- `pnpm verify:foundation` — 코어 검사와 Storybook 빌드, CJK·RTL·키보드,
200% 확대, 고대비 모드, 모션 감소, 터치 타깃, axe 브라우저 검사
- `pnpm verify:release` — 패키지를 실제로 묶어 임시 신규 소비자에서 불러오고
Expand All @@ -50,20 +48,18 @@ pnpm 워크스페이스. `pnpm install` 후:
`verify:site-kit:release` — 정확한 로케일·카탈로그 계약, 공통 UI 동작,
다국어 검색 문서, 패키징·신규 소비자·publish dry-run 게이트

다섯 internal 패키지는 restricted이며 Changesets의 lockstep 그룹으로 릴리스한다. 방향성
다섯 공개 패키지는 Changesets의 lockstep 그룹으로 릴리스한다. 방향성
아이콘에는 `dds-icon--directional`을 사용하며 mirror/유지 목록은
`@devslab-kr/dds-icons/direction-policy.json`으로 함께 배포한다.
`@devslab/dds-icons/direction-policy.json`으로 함께 배포한다.

JavaScript 패키지 이름은 조직 공통 규칙을 따른다. 공개 패키지는 npmjs의
`@devslab/*`, restricted 내부 패키지는 GitHub Packages의 `@devslab-kr/*`를
사용한다. 로컬 설치는 `.npmrc.example`을 복사하고 `read:packages` 권한의
GitHub 토큰을 제공한다. 릴리스 워크플로는 저장소 `GITHUB_TOKEN`을 사용하며,
최초 배포 후 GitHub 설정에서 패키지 가시성을 Private에서 Internal로 바꾼다.
배포 가능한 DDS 패키지는 모두 공개 npm의 `@devslab/*`를 사용하며 DevsLab
Source-Available License 1.0을 따른다. compatibility canary는 비공개·미배포로
유지한다. 릴리스는 npm provenance와 저장소 `NPM_TOKEN` 시크릿을 사용한다.

## 로드맵

우선순위는 [`docs/backlog.md`](docs/backlog.md)에. 패키지는 소비자가 생길
때만 만든다 (명세 §8):
`@devslab-kr/dds-tokens` (✅ 2026-08-13) → `dds-css` v1 인벤토리 (Core 6종 ✅ 2026-08-13, +13종 ✅ 2026-08-15) →
`@devslab/dds-tokens` (✅ 2026-08-13) → `dds-css` v1 인벤토리 (Core 6종 ✅ 2026-08-13, +13종 ✅ 2026-08-15) →
AskLinq 적용 → `dds-icons` (✅ 2026-08-15) → `dds-solid` + `site-kit` → 모바일 방향에 따라 `dds-native` (RN) 또는 Ionic
테마 매핑.
31 changes: 14 additions & 17 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,8 @@
🌐 [한국어](README.ko.md)

The design language for DevsLab products (devslab.kr, the Linq family, and
future apps): one set of tokens and rules shared by web and mobile.
Structurally modeled on [Toss Design System (TDS)](https://tossmini-docs.toss.im/tds-react-native/),
but framework-neutral — the core is tokens + CSS; React, Vue, Ionic, and
future apps): one framework-neutral set of tokens, components, and rules
shared by web and mobile. The core is tokens + CSS; React, Vue, Ionic, and
React Native are consumers.

## What's here
Expand All @@ -15,11 +14,11 @@ React Native are consumers.
| [`docs/design-system.md`](docs/design-system.md) | The rules spec (v0): principles, architecture, foundations, component contract, governance |
| [`docs/decisions.md`](docs/decisions.md) | Decision log — foundation/architecture decisions with rationale |
| [`tokens/`](tokens/) | Design token source ([W3C format](https://design-tokens.github.io/community-group/format/)): raw palette, light/dark semantic mappings, typography/spacing/radius/elevation/motion |
| [`packages/dds-tokens/`](packages/dds-tokens/) | `@devslab-kr/dds-tokens` — token build pipeline: `tokens.css`, Tailwind v4 `@theme` + v3 preset, `tokens.ts` (RN/runtime), `ionic.css` |
| [`packages/dds-css/`](packages/dds-css/) | `@devslab-kr/dds-css` — CSS component layer, the spec §4.3 v1 inventory (Button, IconButton, TextField, Textarea, Select, Checkbox/Radio, Switch, Badge, Chip, Avatar, Spinner/Skeleton, Divider, Card, ListRow, Tabs, Dialog, Toast, Tooltip, EmptyState); guide in [`docs/components.md`](docs/components.md) |
| [`packages/dds-icons/`](packages/dds-icons/) | `@devslab-kr/dds-icons` — the icon set: 40 core (24 grid, 1.6 stroke) + 7 devslab.kr `site-` icons, shipped as SVG files, a sprite and a path-data map |
| [`packages/dds-solid/`](packages/dds-solid/) | `@devslab-kr/dds-solid` — SolidJS accessible primitives with controlled/uncontrolled state, SSR/hydration, keyboard, focus, and lifecycle contracts |
| [`packages/site-kit/`](packages/site-kit/) | `@devslab-kr/site-kit` — restricted internal infrastructure for public sites: strict 14-locale i18n, SEO/GEO builders, TanStack Start metadata adapter, and accessible SolidJS shared shells |
| [`packages/dds-tokens/`](packages/dds-tokens/) | `@devslab/dds-tokens` — token build pipeline: `tokens.css`, Tailwind v4 `@theme` + v3 preset, `tokens.ts` (RN/runtime), `ionic.css` |
| [`packages/dds-css/`](packages/dds-css/) | `@devslab/dds-css` — CSS component layer, the spec §4.3 v1 inventory (Button, IconButton, TextField, Textarea, Select, Checkbox/Radio, Switch, Badge, Chip, Avatar, Spinner/Skeleton, Divider, Card, ListRow, Tabs, Dialog, Toast, Tooltip, EmptyState); guide in [`docs/components.md`](docs/components.md) |
| [`packages/dds-icons/`](packages/dds-icons/) | `@devslab/dds-icons` — the icon set: 40 core (24 grid, 1.6 stroke) + 7 devslab.kr `site-` icons, shipped as SVG files, a sprite and a path-data map |
| [`packages/dds-solid/`](packages/dds-solid/) | `@devslab/dds-solid` — SolidJS accessible primitives with controlled/uncontrolled state, SSR/hydration, keyboard, focus, and lifecycle contracts |
| [`packages/site-kit/`](packages/site-kit/) | `@devslab/site-kit` — public infrastructure for product sites: strict 14-locale i18n, SEO/GEO builders, TanStack Start metadata adapter, and accessible SolidJS shared shells |
| [`preview/index.html`](preview/index.html) | Self-contained foundations & components preview — open in a browser (`components.html`, `icons.html` alongside) |
| [`brand/index.html`](brand/index.html) | Brand identity guide: logo rules, Electric Cyan, motifs, voice & tone |

Expand All @@ -40,7 +39,7 @@ pnpm workspace. `pnpm install`, then:
(what CI runs)
- `pnpm storybook` — component/foundation stories at :6006 (theme switch in
the toolbar); `pnpm build-storybook` for the static site (also CI-checked)
- `pnpm verify:names` — reject package-name drift from the private `@devslab-kr/*` scope
- `pnpm verify:names` — reject package-name, license, or public-registry drift
- `pnpm verify:foundation` — core checks, Storybook build, CJK/RTL/keyboard,
200% zoom, forced-colors, reduced-motion, touch-target, and axe browser checks
- `pnpm verify:release` — build artifacts are packed, exercised from a fresh
Expand All @@ -51,20 +50,18 @@ pnpm workspace. `pnpm install`, then:
`verify:site-kit:release` — exact locale/catalog contracts, shared UI behavior,
localized discovery documents, pack, fresh-consumer and publish dry-run gates

The five restricted internal packages release in lockstep through Changesets. Directional
The five public packages release in lockstep through Changesets. Directional
icons use `dds-icon--directional`; the authoritative mirror/keep lists ship as
`@devslab-kr/dds-icons/direction-policy.json`.
`@devslab/dds-icons/direction-policy.json`.

JavaScript package naming follows one organization-wide rule: public packages use
`@devslab/*` on npmjs, while restricted internal packages use `@devslab-kr/*` on
GitHub Packages. Copy `.npmrc.example` and provide a GitHub token with `read:packages`
for local installation. Release workflows use the repository `GITHUB_TOKEN`; after a
first publish, package visibility is changed from Private to Internal in GitHub settings.
All distributable DDS packages use `@devslab/*` on the public npm registry under the
DevsLab Source-Available License 1.0. The compatibility canary remains private and
unpublished. Releases use npm provenance and the repository `NPM_TOKEN` secret.

## Roadmap

Priorities live in [`docs/backlog.md`](docs/backlog.md). Packages are created
only when a consumer exists (spec §8):
`@devslab-kr/dds-tokens` (✅ 2026-08-13) → `dds-css` v1 inventory (Core 6 ✅ 2026-08-13, +13 ✅ 2026-08-15) →
`@devslab/dds-tokens` (✅ 2026-08-13) → `dds-css` v1 inventory (Core 6 ✅ 2026-08-13, +13 ✅ 2026-08-15) →
AskLinq adoption → `dds-icons` (✅ 2026-08-15) → `dds-solid` + `site-kit` → `dds-native` (RN) or an Ionic
theme mapping, depending on how mobile goes.
25 changes: 25 additions & 0 deletions brand/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -468,6 +468,31 @@ <h4>당신의 SaaS,<br>우리가 만듭니다.</h4>
</div>
</section>

<!-- ============ 07 open source identity ============ -->
<section>
<p class="idx mono">[07] open source</p>
<h2>Q-line은 공개 프로젝트의 공통 서명</h2>
<p class="lead">
DevsLab OSS는 어긋난 두 사각형의 Q 프레임을 공유하고, 프로젝트의 기능을
내부 한 줄로 구별합니다. 프레임의 비례와 선 굵기는 고정하며 제품별 경로를
임의로 다시 그리지 않습니다.
</p>
<div class="grid2">
<div class="card">
<p class="idx mono">canonical rules</p>
<h3>공식 OSS 브랜드 규칙</h3>
<p class="cap">접근성, 작은 아이콘, 라이트·다크, 금지 사례와 제품별 적용 규칙은 공식 페이지를 따릅니다.</p>
<p><a href="https://devslab.kr/brand/open-source/">devslab.kr/brand/open-source/</a></p>
</div>
<div class="card">
<p class="idx mono">asset source · v0.2.0</p>
<h3>버전이 고정된 원본 자산</h3>
<p class="cap">사이트와 README에는 중앙 생성물의 버전 URL을 사용합니다. DDS는 프로젝트별 경로를 복제하지 않습니다.</p>
<p><a href="https://github.com/devslab-kr/oss-brand/releases/tag/v0.2.0">oss-brand v0.2.0</a></p>
</div>
</div>
</section>

<footer class="site">
<span class="mono">© 2026 DevsLab</span>
<span>토큰 규격: DDS 규칙 명세 (devslab-kr/dds · docs/design-system.ko.md)</span>
Expand Down
Loading