{"_id":"@11c-kr/kds","_rev":"3-040bece7292fd85a518f6123b53ea2b0","name":"@11c-kr/kds","dist-tags":{"latest":"0.1.3"},"versions":{"0.1.1":{"name":"@11c-kr/kds","version":"0.1.1","license":"UNLICENSED","_id":"@11c-kr/kds@0.1.1","maintainers":[{"name":"11c-jeremy","email":"jeremy@11c.kr"},{"name":"11c-lily","email":"lily@11c.kr"}],"homepage":"https://kds-storybook.vercel.app/","dist":{"shasum":"8105e6ec7e4b02f72077743e6d77c548b28f4b7a","tarball":"https://registry.npmjs.org/@11c-kr/kds/-/kds-0.1.1.tgz","fileCount":80,"integrity":"sha512-qD+MgR3cE38HesWTaWWFNq4LQ0C6ZfYfz0xra79ZZ5lhjWKwwDQ3aSgBrcvQlNYF6SI9kWWXEz0wjOk72SWj2A==","signatures":[{"sig":"MEUCIHTlrUdyvq/fy9Jq7uKhr8L2MAlv+4WofswXHyjXgjEAAiEA/DOL0r9HdzZoWUzqEXe/rZUTHvKQe17uQOWTSuaXOVU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":418562},"main":"./dist/index.js","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","default":"./dist/index.js"},"./styles/*":"./styles/*","./date-locale":{"types":"./dist/lib/date-locale.d.ts","import":"./dist/lib/date-locale.js","default":"./dist/lib/date-locale.js"},"./package.json":"./package.json"},"gitHead":"be4ab2aa1b4f94302ca7a630d534400112594782","private":false,"scripts":{"lint":"eslint . --ignore-pattern dist","build":"vite build && tsc -p tsconfig.build.json && tsc-alias -p tsconfig.build.json","prepack":"pnpm run build","storybook":"storybook dev -p 6006","typecheck":"tsc --noEmit","build-storybook":"storybook build","generate:color-tokens":"node scripts/generate-color-tokens.mjs"},"_npmUser":{"name":"11c-lily","email":"lily@11c.kr"},"_npmVersion":"11.6.2","description":"11c 키퍼 디자인 시스템 React 컴포넌트 라이브러리","directories":{},"sideEffects":["./styles/*.css"],"_nodeVersion":"24.13.0","dependencies":{"clsx":"^2.1.1","shadcn":"^4.1.1","sonner":"^2.0.7","date-fns":"^4.1.0","radix-ui":"^1.6.7","lucide-react":"^1.24.0","@base-ui/react":"^1.6.0","tailwind-merge":"^3.3.0","tw-animate-css":"^1.4.0","react-day-picker":"^9.14.0","tailwind-variants":"^3.2.2"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^8.0.7","react":"^19.2.8","eslint":"^9","react-dom":"^19.2.8","storybook":"^10.3.3","tsc-alias":"^1.9.2","typescript":"^6.0.3","tailwindcss":"^4.3.3","@types/react":"^19.2.17","@types/react-dom":"^19.2.3","vite-plugin-svgr":"^5.2.0","@tailwindcss/vite":"^4.3.3","@tailwindcss/postcss":"^4.3.3","@storybook/addon-docs":"^10.3.3","@storybook/react-vite":"^10.3.3","@storybook/addon-designs":"^11.1.3","@material-symbols/svg-300":"^0.44.0"},"peerDependencies":{"react":"^19","react-dom":"^19","tailwindcss":"^4"},"_npmOperationalInternal":{"tmp":"tmp/kds_0.1.1_1787552474754_0.18364747805708337","host":"s3://npm-registry-packages-npm-production"}},"0.1.2":{"name":"@11c-kr/kds","version":"0.1.2","license":"UNLICENSED","_id":"@11c-kr/kds@0.1.2","maintainers":[{"name":"11c-jeremy","email":"jeremy@11c.kr"},{"name":"11c-lily","email":"lily@11c.kr"}],"homepage":"https://kds-storybook.vercel.app/","dist":{"shasum":"79913b78c50b38c38faa1bed6636d2b3dbc7b126","tarball":"https://registry.npmjs.org/@11c-kr/kds/-/kds-0.1.2.tgz","fileCount":81,"integrity":"sha512-cRFWhytrqmNOZYVC+GWe1n2TLUTo38tx1Dq1rmfWQ+x2QV6rle7hj1eLj+gg7Tf8jUH7Rjufj4vcrk2gYsXhzQ==","signatures":[{"sig":"MEYCIQDPl+5PVj7U+zCwGIavOoR1OY1qdiogaOTjUfDaMpyLOgIhAIigYyk44XF2jj93E7Ywwt8yCoHl4dln9QA+AjBjne/q","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":434600},"main":"./dist/index.js","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","default":"./dist/index.js"},"./styles/*":"./styles/*","./date-locale":{"types":"./dist/lib/date-locale.d.ts","import":"./dist/lib/date-locale.js","default":"./dist/lib/date-locale.js"},"./package.json":"./package.json"},"private":false,"scripts":{"lint":"eslint . --ignore-pattern dist","build":"vite build && tsc -p tsconfig.build.json && tsc-alias -p tsconfig.build.json","prepack":"pnpm run build","storybook":"storybook dev -p 6006","typecheck":"tsc --noEmit","build-storybook":"storybook build","generate:color-tokens":"node scripts/generate-color-tokens.mjs"},"_npmUser":{"name":"11c-lily","email":"lily@11c.kr"},"_npmVersion":"11.6.2","description":"11c 키퍼 디자인 시스템 React 컴포넌트 라이브러리","directories":{},"sideEffects":["./styles/*.css"],"_nodeVersion":"24.13.0","dependencies":{"clsx":"^2.1.1","shadcn":"^4.1.1","sonner":"^2.0.7","date-fns":"^4.1.0","radix-ui":"^1.6.7","lucide-react":"^1.24.0","@base-ui/react":"^1.6.0","tailwind-merge":"^3.3.0","tw-animate-css":"^1.4.0","react-day-picker":"^9.14.0","tailwind-variants":"^3.2.2"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^8.0.7","react":"^19.2.8","eslint":"^9","react-dom":"^19.2.8","storybook":"^10.3.3","tsc-alias":"^1.9.2","typescript":"^6.0.3","tailwindcss":"^4.3.3","@types/react":"^19.2.17","@types/react-dom":"^19.2.3","vite-plugin-svgr":"^5.2.0","@tailwindcss/vite":"^4.3.3","@tailwindcss/postcss":"^4.3.3","@storybook/addon-docs":"^10.3.3","@storybook/react-vite":"^10.3.3","@storybook/addon-designs":"^11.1.3","@material-symbols/svg-300":"^0.44.0"},"peerDependencies":{"react":"^19","react-dom":"^19","tailwindcss":"^4"},"_npmOperationalInternal":{"tmp":"tmp/kds_0.1.2_1788427125446_0.23796004471124133","host":"s3://npm-registry-packages-npm-production"}},"0.1.3":{"_id":"@11c-kr/kds@0.1.3","bin":{"kds":"bin/kds.mjs"},"dist":{"shasum":"ca4ecb6a78bdaa3e4333b2fe9700c075f7bcae4d","tarball":"https://registry.npmjs.org/@11c-kr/kds/-/kds-0.1.3.tgz","fileCount":115,"integrity":"sha512-+wzb55k9ZVCW9aU0UDmmfuZNBXo6jqnu2tTFsTUNBB8gIFQFtlKwvpfovj+sHy/bFNWgVmX39G57v+MnbltXRA==","signatures":[{"sig":"MEQCIFR8lXs53NBnAfxr1wRUSIKa5WJNeSUYnIfjR+5D+0OBAiB5RlFuTM4idlDkM1SWWbFUEVIR/Tqf0/0lX8yTVBFFNQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIC9KZVtEG52aiqd1/+4K2XeT7jDp7ai94Gq8FZTG6XaNAiAFlNUuBWIexOaJMVzGTKytJlXsJwwbm6iPjo2KLllVfw=="}],"unpackedSize":673185},"main":"./dist/index.js","name":"@11c-kr/kds","type":"module","_from":"file:/var/folders/8x/c17jnc_n6r5_5v5l5v_xdsyr0000gn/T/kds-release-0.1.3-i_kkm3h7/11c-kr-kds-0.1.3.tgz","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","default":"./dist/index.js"},"./styles/*":"./styles/*","./date-locale":{"types":"./dist/lib/date-locale.d.ts","import":"./dist/lib/date-locale.js","default":"./dist/lib/date-locale.js"},"./package.json":"./package.json"},"license":"UNLICENSED","private":false,"scripts":{"lint":"eslint . --ignore-pattern dist","build":"vite build && tsc -p tsconfig.build.json && tsc-alias -p tsconfig.build.json","prepack":"pnpm run build","storybook":"storybook dev -p 6006","typecheck":"tsc --noEmit && tsc --noEmit -p docs/tsconfig.json","build-storybook":"storybook build","generate:color-tokens":"node scripts/generate-color-tokens.mjs"},"version":"0.1.3","_npmUser":{"name":"11c-lily","email":"lily@11c.kr"},"homepage":"https://kds-storybook.vercel.app/","_resolved":"/var/folders/8x/c17jnc_n6r5_5v5l5v_xdsyr0000gn/T/kds-release-0.1.3-i_kkm3h7/11c-kr-kds-0.1.3.tgz","_integrity":"sha512-+wzb55k9ZVCW9aU0UDmmfuZNBXo6jqnu2tTFsTUNBB8gIFQFtlKwvpfovj+sHy/bFNWgVmX39G57v+MnbltXRA==","_npmVersion":"11.6.2","description":"11c 키퍼 디자인 시스템 React 컴포넌트 라이브러리","directories":{},"maintainers":[{"name":"11c-jeremy","email":"jeremy@11c.kr"},{"name":"11c-lily","email":"lily@11c.kr"}],"sideEffects":["./styles/*.css"],"_nodeVersion":"24.13.0","dependencies":{"clsx":"^2.1.1","shadcn":"^4.1.1","sonner":"^2.0.7","date-fns":"^4.1.0","radix-ui":"^1.6.7","lucide-react":"^1.24.0","@base-ui/react":"^1.6.0","tailwind-merge":"^3.3.0","tw-animate-css":"^1.4.0","react-day-picker":"^9.14.0","tailwind-variants":"^3.2.2"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^8.0.7","react":"^19.2.8","eslint":"^9","react-dom":"^19.2.8","storybook":"^10.3.3","tsc-alias":"^1.9.2","typescript":"^6.0.3","tailwindcss":"^4.3.3","@types/react":"^19.2.17","@types/react-dom":"^19.2.3","vite-plugin-svgr":"^5.2.0","@tailwindcss/vite":"^4.3.3","@tailwindcss/postcss":"^4.3.3","@storybook/addon-docs":"^10.3.3","@storybook/react-vite":"^10.3.3","@storybook/addon-designs":"^11.1.3","@material-symbols/svg-300":"^0.44.0"},"peerDependencies":{"react":"^19","react-dom":"^19","tailwindcss":"^4"},"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/kds_0.1.3_1790060315104_0.6035508817609008"}}},"time":{"created":"2026-08-24T06:21:14.499Z","modified":"2026-09-22T06:58:35.394Z","0.1.1":"2026-08-24T06:21:14.897Z","0.1.2":"2026-09-03T09:18:45.616Z","0.1.3":"2026-09-22T06:58:35.210Z"},"license":"UNLICENSED","homepage":"https://kds-storybook.vercel.app/","description":"11c 키퍼 디자인 시스템 React 컴포넌트 라이브러리","maintainers":[{"name":"11c-jeremy","email":"jeremy@11c.kr"},{"name":"11c-lily","email":"lily@11c.kr"}],"readme":"# @11c-kr/kds\n\n11c 키퍼 디자인 시스템(KDS) React 컴포넌트 라이브러리입니다.\n\n[Storybook에서 컴포넌트와 사용 예제 보기](https://kds-storybook.vercel.app/)\n\n## 설치\n\n```sh\n# pnpm\npnpm add @11c-kr/kds\n\n# npm\nnpm install @11c-kr/kds\n\n# Yarn\nyarn add @11c-kr/kds\n```\n\nReact 19, React DOM 19, Tailwind CSS 4를 peer dependency로 사용합니다.\n\n## 사용 문서\n\nFigma 없이 화면을 구성할 때도 [사용 가이드](./docs/README.md)에서 컴포넌트 선택과 조합을\n확인할 수 있습니다. [디자인 원칙](./DESIGN.md)은 외부 npm 소비자용 진입 문서입니다.\nFigma가 있으면 배치·토큰은 시안을 따르고, 불명확한 사용 계약만 관련 문서로 확인합니다.\n\n- [설치와 스타일 설정](./docs/getting-started.md)\n- [컴포넌트 선택과 개별 사용법](./docs/README.md)\n- [입력 필드의 공통 스타일과 API 차이](./docs/foundations/fields.md)\n- [Typography](./docs/foundations/typography.md), [색상](./docs/foundations/colors.md), [간격과 모서리](./docs/foundations/spacing-radius.md)\n- [검색·필터·목록](./docs/patterns/search-filter-list.md), [입력 폼](./docs/patterns/input-form.md), [확인 Dialog](./docs/patterns/confirmation-dialog.md)\n- [공개 타입과 JSDoc](./dist/index.d.ts), [LLM 문서 목차](./docs/llms.txt)\n\n문서와 공개 타입은 설치한 패키지를 기준으로 확인합니다. 버전은\n`@11c-kr/kds/package.json`의 `version`으로 확인하며, 온라인 Storybook은 설치 버전과 다를 수 있습니다.\n\n## AI 코딩 도구에 연결\n\n라이브러리 설치·업데이트 후 **문서를 사용할 프로젝트 루트**에서 실행합니다.\n\n```sh\n# npm\nnpx --no-install kds docs init\n# pnpm\npnpm exec kds docs init\n# Yarn\nyarn run kds docs init\n```\n\n별도 네트워크 요청 없이 설치된 패키지 버전의 `DESIGN.md`와 사용 문서를\n`.kds/DESIGN.md`·`.kds/docs/`로 복사하고,\n`AGENTS.md`·`CLAUDE.md`에 짧은 KDS 참조 블록을 추가합니다. 기존 지침과 루트 `DESIGN.md`는\n보존합니다. AI에는 `DESIGN.md`를 진입점으로 필요한 문서만 읽도록 안내합니다.\nFigma가 있으면 사용 계약이 불명확할 때만 관련 문서를 찾고, 없으면 목차에서 컴포넌트와\n조합 예제를 선택합니다. 전체 문서를 매번 읽도록 요구하지 않습니다.\n\n패키지 업데이트 후 같은 명령을 다시 실행합니다. 이전에 복사한 문서가 그대로면 새 버전으로\n갱신하고, 로컬 수정이나 기존 파일과 충돌하면 덮어쓰지 않고 알려줍니다. 복사한 버전은\n`.kds/manifest.json`에서 확인합니다. 팀에서도 같은 문서를 쓰려면 `.kds/`와 프로젝트 지침을\n함께 버전 관리합니다.\n\n**스킬도 설치하려면** 위 명령 뒤에 `--skill all`을 붙입니다.\n\n```sh\n# npm\nnpx --no-install kds docs init --skill all\n# pnpm\npnpm exec kds docs init --skill all\n# Yarn\nyarn run kds docs init --skill all\n```\n\nCodex용 `.agents/skills/kds-ui/SKILL.md`와 Claude Code용\n`.claude/skills/kds-ui/SKILL.md`가 추가됩니다. 한 도구만 사용하면 `all` 대신 `codex` 또는\n`claude`를 지정합니다. 스킬은 필요한 `.kds/` 문서만 찾아 읽도록 안내하며, 한 번 설치하면\n다음 `docs init`부터 옵션 없이도 함께 갱신됩니다. 호출·갱신 방법은\n[스킬 설치 안내](./docs/getting-started.md#외부-프로젝트에-스킬도-설치하기)를 참고합니다.\n\n## 스타일 적용\n\n애플리케이션의 전역 스타일 파일에서 한 번만 불러옵니다.\n\n```css\n@import '@11c-kr/kds/styles/globals.css';\n```\n\n## 사용법\n\n```tsx\nimport { Button, TextInput, type TextInputProps } from '@11c-kr/kds';\n\nconst SearchField = (props: TextInputProps) => (\n  <div className=\"flex items-center gap-(--space-150)\">\n    <TextInput {...props} />\n    <Button variant=\"brand-solid\">검색</Button>\n  </div>\n);\n```\n\n모든 컴포넌트는 Provider 없이 기본 한국어 설정으로 동작합니다. 다국어를 적용하거나 문구를\n변경해야 할 때만 애플리케이션 루트에 `UiConfigProvider`를 설정합니다.\n\nReact Server Component에서 날짜 locale만 필요한 경우 다음 하위 경로를 사용합니다.\n\n```ts\nimport { koDateLocale } from '@11c-kr/kds/date-locale';\n```\n\n## 개발 검증\n\n저장소 루트에서 `pnpm --filter ./packages/ui typecheck`를 실행하면 라이브러리 소스와\n`docs/examples/`의 TSX 예제·조합 story를 함께 검사합니다. 예제 전용 `docs/tsconfig.json`은\nnpm import를 소스로 연결하므로 패키지를 먼저 빌드할 필요가 없습니다.\n\nMarkdown의 설명·코드 블록·링크와 npm 패키징·문서 설치는 변경 시 별도로 확인합니다.\n\n## 라이선스\n\n`UNLICENSED`입니다. 회사가 허가한 프로젝트 외부에서의 사용, 수정 및 재배포를 허용하지\n않습니다.\n","readmeFilename":"README.md"}