npm - @bestow-ui/tokens - Versions diffs - 1.0.0 → 1.3.0 - Mend

@bestow-ui/tokens 1.0.0 → 1.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.

Files changed (8) hide show

package/README.md CHANGED Viewed

@@ -3,20 +3,20 @@
 [![npm](https://img.shields.io/npm/v/@bestow-ui/tokens)](https://www.npmjs.com/package/@bestow-ui/tokens)
 [![license](https://img.shields.io/npm/l/@bestow-ui/tokens)](https://github.com/Dev-BestOW/BestOW-UI/blob/main/LICENSE)
-Design tokens for **BestOW UI** — colors, spacing, radius, typography, shadow, duration and z-index as plain JavaScript values.
-No dependencies, framework-agnostic.
+**BestOW UI** 의 디자인 토큰이에요. 색상·간격·모서리·글자·그림자·시간·쌓임 순서를 순수 JavaScript 값으로 제공해요.
+의존성이 없어서 어떤 프레임워크에서도 쓸 수 있어요.
-📖 **See every token:** [Storybook › Foundations › Design Tokens](https://dev-bestow.github.io/BestOW-UI/?path=/story/foundations-design-tokens--colors)
+> Design tokens for BestOW UI, a React design system for Korean services. Docs are in Korean.
-> 🇰🇷 한국어 안내는 [아래](#한국어)에 있어요.
+📖 **전체 토큰 보기:** [Storybook › Foundations › Design Tokens](https://dev-bestow.github.io/BestOW-UI/?path=/story/foundations-design-tokens--colors)
-## Install
+## 설치
 ```bash
 npm install @bestow-ui/tokens
 ```
-## Usage
+## 사용하기
 ```ts
 import { palette, space, radius, fontSize, lightColors, darkColors } from '@bestow-ui/tokens';
@@ -27,41 +27,25 @@ lightColors.primary.solid; // '#2554eb'
 darkColors.fg.default; // '#f8f9fa'
 ```
-| Export | Contents |
+| export | 내용 |
 |---|---|
-| `palette` | Raw color scales (`gray`, `blue`, `red`, `green`, `amber`, `white`, `black`) |
-| `lightColors`, `darkColors` | Semantic colors (`bg`, `fg`, `border`, `primary`, `neutral`, `danger`, `success`, `warning`) — same keys in both modes |
-| `space` | `0`–`16` (4px grid) |
+| `palette` | 원시 색 단계 (`gray`, `blue`, `red`, `green`, `amber`, `white`, `black`) |
+| `lightColors`, `darkColors` | 의미 색 (`bg`, `fg`, `border`, `primary`, `neutral`, `danger`, `success`, `warning`) — 두 모드의 키가 같아요 |
+| `space` | `0`–`16` (4px 단위) |
 | `radius` | `none`, `sm`, `md`, `lg`, `xl`, `full` |
-| `fontFamily`, `fontSize`, `fontWeight`, `lineHeight` | Typography |
-| `shadow`, `darkShadow` | Elevation for light / dark mode (same keys) |
-| `duration`, `zIndex` | Motion and stacking order |
+| `fontFamily`, `fontSize`, `fontWeight`, `lineHeight` | 글자 |
+| `shadow`, `darkShadow` | 라이트·다크 그림자 (키가 같아요) |
+| `duration`, `zIndex` | 움직임 시간과 쌓임 순서 (배경막 < 대화상자 < 목록 < 토스트 < 툴팁) |
-### Using with React
+### React 와 함께
-If you use [`@bestow-ui/react`](https://www.npmjs.com/package/@bestow-ui/react), reference tokens through its theme instead of raw values,
-so dark mode and brand themes apply automatically:
+[`@bestow-ui/react`](https://www.npmjs.com/package/@bestow-ui/react) 를 쓴다면 원시 값 대신 테마의 `vars`(CSS 변수)로 참조하세요.
+그래야 다크 모드와 브랜드 테마가 자동으로 적용돼요. 글자 크기는 react 테마에서 rem 으로 바뀌어 사용자의 기본 글꼴 크기 설정을 따라요.
 ```ts
 import { vars } from '@bestow-ui/react'; // vars.color.primary.solid → var(--bestow-color-primary-solid)
 ```
-## License
+## 라이선스
 [MIT](https://github.com/Dev-BestOW/BestOW-UI/blob/main/LICENSE) © Dev-BestOW
----
-## 한국어
-**BestOW UI** 의 디자인 토큰이에요. 색상·간격·모서리·타이포그래피·그림자·시간·z-index 를 순수 JavaScript 값으로 제공해요. 의존성이 없어서 어떤 프레임워크에서도 쓸 수 있어요.
-```ts
-import { space, lightColors } from '@bestow-ui/tokens';
-space[4]; // '16px'
-lightColors.primary.solid; // '#2554eb'
-```
-`@bestow-ui/react` 를 쓴다면 원시 값 대신 `vars`(CSS 변수)로 참조해야 다크 모드·브랜드 테마가 적용돼요.
-전체 토큰은 [Storybook 디자인 토큰 페이지](https://dev-bestow.github.io/BestOW-UI/?path=/story/foundations-design-tokens--colors) 에서 볼 수 있어요.

package/dist/index.cjs CHANGED Viewed

@@ -163,9 +163,9 @@ var duration = {
   slow: "320ms"
 };
 var zIndex = {
-  dropdown: "1000",
   overlay: "1300",
   modal: "1310",
+  dropdown: "1320",
   toast: "1400",
   tooltip: "1500"
 };

package/dist/index.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/index.ts"],"sourcesContent":["/*\n BestOW UI 디자인 토큰.\n * 플랫폼에 독립적인 원시 값만 정의한다. 컴포넌트는 @bestow-ui/react 의 테마(vars)를 통해 참조한다.\n /\n\nexport const palette = {\n white: '#ffffff',\n black: '#000000',\n gray: {\n 50: '#f8f9fa',\n 100: '#f1f3f5',\n 200: '#e9ecef',\n 300: '#dee2e6',\n 400: '#ced4da',\n 500: '#adb5bd',\n 600: '#666e76', // 흰색·gray50·gray100 배경에서 4.5:1 이상 (fg.subtle 로 쓰인다)\n 700: '#495057',\n 800: '#343a40',\n 900: '#212529',\n 950: '#16181b',\n },\n blue: {\n 50: '#eef4ff',\n 100: '#dbe6fe',\n 200: '#bfd3fe',\n 300: '#93b4fd',\n 400: '#6090fa',\n 500: '#3b6ff6',\n 600: '#2554eb',\n 700: '#1d42d8',\n 800: '#1e37af',\n 900: '#1e338a',\n },\n red: {\n 50: '#fef2f2',\n 100: '#fee2e2',\n 200: '#fecaca',\n 300: '#fca5a5',\n 400: '#f87171',\n 500: '#ef4444',\n 600: '#dc2626',\n 700: '#b91c1c',\n 800: '#991b1b',\n 900: '#7f1d1d',\n },\n green: {\n 50: '#f0fdf4',\n 100: '#dcfce7',\n 200: '#bbf7d0',\n 300: '#86efac',\n 400: '#4ade80',\n 500: '#22c55e',\n 600: '#16a34a',\n 700: '#15803d',\n 800: '#166534',\n 900: '#14532d',\n },\n amber: {\n 50: '#fffbeb',\n 100: '#fef3c7',\n 200: '#fde68a',\n 300: '#fcd34d',\n 400: '#fbbf24',\n 500: '#f59e0b',\n 600: '#d97706',\n 700: '#b45309',\n 800: '#92400e',\n 900: '#78350f',\n },\n} as const;\n\nexport const space = {\n 0: '0',\n 1: '4px',\n 2: '8px',\n 3: '12px',\n 4: '16px',\n 5: '20px',\n 6: '24px',\n 8: '32px',\n 10: '40px',\n 12: '48px',\n 16: '64px',\n} as const;\n\nexport const radius = {\n none: '0',\n sm: '4px',\n md: '8px',\n lg: '12px',\n xl: '16px',\n full: '9999px',\n} as const;\n\nexport const fontFamily = {\n sans: '\"Pretendard Variable\", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, \"Apple SD Gothic Neo\", \"Noto Sans KR\", sans-serif',\n mono: '\"JetBrains Mono\", ui-monospace, SFMono-Regular, Menlo, monospace',\n} as const;\n\nexport const fontSize = {\n xs: '12px',\n sm: '14px',\n md: '16px',\n lg: '18px',\n xl: '20px',\n '2xl': '24px',\n '3xl': '30px',\n '4xl': '36px',\n} as const;\n\nexport const fontWeight = {\n regular: '400',\n medium: '500',\n semibold: '600',\n bold: '700',\n} as const;\n\nexport const lineHeight = {\n tight: '1.25',\n normal: '1.5',\n relaxed: '1.75',\n} as const;\n\n/* 라이트 모드 그림자. 다크 모드는 darkShadow 를 쓴다 (같은 키). /\nexport const shadow = {\n sm: '0 1px 2px rgba(0, 0, 0, 0.06)',\n md: '0 4px 12px rgba(0, 0, 0, 0.08)',\n lg: '0 12px 32px rgba(0, 0, 0, 0.12)',\n} as const;\n\n/\n 다크 모드 그림자. 어두운 배경에서는 옅은 그림자가 보이지 않으므로 더 진하게 하고,\n * 떠 있는 면(md·lg)은 가장자리를 구분하는 옅은 밝은 테두리(ring)를 함께 둔다.\n /\nexport const darkShadow = {\n sm: '0 1px 2px rgba(0, 0, 0, 0.5)',\n md: '0 0 0 1px rgba(255, 255, 255, 0.08), 0 4px 12px rgba(0, 0, 0, 0.5)',\n lg: '0 0 0 1px rgba(255, 255, 255, 0.1), 0 12px 32px rgba(0, 0, 0, 0.6)',\n} as const satisfies Record<keyof typeof shadow, string>;\n\nexport const duration = {\n fast: '120ms',\n normal: '200ms',\n slow: '320ms',\n} as const;\n\nexport const zIndex = {\n dropdown: '1000',\n overlay: '1300',\n modal: '1310',\n toast: '1400',\n tooltip: '1500',\n} as const;\n\n/* 의미 기반(semantic) 색상. 라이트/다크 테마가 같은 키를 가져야 한다. /\n/* solid 배경 위 글자색은 각 그룹의 contrast 를 사용한다. */\nexport interface SemanticColors {\n bg: { default: string; subtle: string; muted: string; inverse: string; overlay: string };\n fg: { default: string; muted: string; subtle: string; inverse: string };\n border: { default: string; strong: string; focus: string };\n primary: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n neutral: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n danger: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n success: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n warning: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n}\n\nexport const lightColors: SemanticColors = {\n bg: {\n default: palette.white,\n subtle: palette.gray[50],\n muted: palette.gray[100],\n inverse: palette.gray[900],\n overlay: 'rgba(0, 0, 0, 0.45)',\n },\n fg: { default: palette.gray[900], muted: palette.gray[700], subtle: palette.gray[600], inverse: palette.white },\n border: { default: palette.gray[300], strong: palette.gray[500], focus: palette.blue[500] },\n primary: {\n solid: palette.blue[600],\n solidHover: palette.blue[700],\n contrast: palette.white,\n subtle: palette.blue[50],\n subtleHover: palette.blue[100],\n text: palette.blue[700],\n },\n neutral: {\n solid: palette.gray[800],\n solidHover: palette.gray[900],\n contrast: palette.white,\n subtle: palette.gray[100],\n subtleHover: palette.gray[200],\n text: palette.gray[800],\n },\n danger: {\n solid: palette.red[600],\n solidHover: palette.red[700],\n contrast: palette.white,\n subtle: palette.red[50],\n subtleHover: palette.red[100],\n text: palette.red[700],\n },\n success: {\n solid: palette.green[700],\n solidHover: palette.green[800],\n contrast: palette.white,\n subtle: palette.green[50],\n subtleHover: palette.green[100],\n text: palette.green[700],\n },\n // 노란색은 밝아서 solid 위 글자는 흰색이 아닌 어두운 색이다\n warning: {\n solid: palette.amber[500],\n solidHover: palette.amber[600],\n contrast: palette.gray[900],\n subtle: palette.amber[50],\n subtleHover: palette.amber[100],\n text: palette.amber[800],\n },\n};\n\nexport const darkColors: SemanticColors = {\n bg: {\n default: palette.gray[950],\n subtle: palette.gray[900],\n muted: palette.gray[800],\n inverse: palette.gray[50],\n overlay: 'rgba(0, 0, 0, 0.65)',\n },\n fg: { default: palette.gray[50], muted: palette.gray[300], subtle: palette.gray[500], inverse: palette.gray[900] },\n border: { default: palette.gray[700], strong: palette.gray[500], focus: palette.blue[400] },\n primary: {\n solid: palette.blue[600],\n solidHover: palette.blue[700], // 흰 글자 대비 유지를 위해 다크에서도 hover 는 어둡게 (blue500 은 4.38)\n contrast: palette.white,\n subtle: 'rgba(59, 111, 246, 0.16)',\n subtleHover: 'rgba(59, 111, 246, 0.26)',\n text: palette.blue[300],\n },\n neutral: {\n solid: palette.gray[200],\n solidHover: palette.gray[100],\n contrast: palette.gray[900],\n subtle: 'rgba(255, 255, 255, 0.08)',\n subtleHover: 'rgba(255, 255, 255, 0.14)',\n text: palette.gray[100],\n },\n danger: {\n solid: palette.red[600],\n solidHover: palette.red[700],\n contrast: palette.white,\n subtle: 'rgba(239, 68, 68, 0.16)',\n subtleHover: 'rgba(239, 68, 68, 0.26)',\n text: palette.red[300],\n },\n success: {\n solid: palette.green[700],\n solidHover: palette.green[800],\n contrast: palette.white,\n subtle: 'rgba(34, 197, 94, 0.16)',\n subtleHover: 'rgba(34, 197, 94, 0.26)',\n text: palette.green[300],\n },\n warning: {\n solid: palette.amber[500],\n solidHover: palette.amber[400],\n contrast: palette.gray[900],\n subtle: 'rgba(245, 158, 11, 0.16)',\n subtleHover: 'rgba(245, 158, 11, 0.26)',\n text: palette.amber[300],\n },\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKO,IAAM,UAAU;AAAA,EACrB,OAAO;AAAA,EACP,OAAO;AAAA,EACP,MAAM;AAAA,IACJ,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,EACP;AAAA,EACA,MAAM;AAAA,IACJ,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,EACP;AAAA,EACA,KAAK;AAAA,IACH,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,EACP;AAAA,EACA,OAAO;AAAA,IACL,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,EACP;AAAA,EACA,OAAO;AAAA,IACL,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,EACP;AACF;AAEO,IAAM,QAAQ;AAAA,EACnB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEO,IAAM,SAAS;AAAA,EACpB,MAAM;AAAA,EACN,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,MAAM;AACR;AAEO,IAAM,aAAa;AAAA,EACxB,MAAM;AAAA,EACN,MAAM;AACR;AAEO,IAAM,WAAW;AAAA,EACtB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AACT;AAEO,IAAM,aAAa;AAAA,EACxB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,MAAM;AACR;AAEO,IAAM,aAAa;AAAA,EACxB,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,SAAS;AACX;AAGO,IAAM,SAAS;AAAA,EACpB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAMO,IAAM,aAAa;AAAA,EACxB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEO,IAAM,WAAW;AAAA,EACtB,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,MAAM;AACR;AAEO,IAAM,SAAS;AAAA,EACpB,UAAU;AAAA,EACV,SAAS;AAAA,EACT,OAAO;AAAA,EACP,OAAO;AAAA,EACP,SAAS;AACX;AAeO,IAAM,cAA8B;AAAA,EACzC,IAAI;AAAA,IACF,SAAS,QAAQ;AAAA,IACjB,QAAQ,QAAQ,KAAK,EAAE;AAAA,IACvB,OAAO,QAAQ,KAAK,GAAG;AAAA,IACvB,SAAS,QAAQ,KAAK,GAAG;AAAA,IACzB,SAAS;AAAA,EACX;AAAA,EACA,IAAI,EAAE,SAAS,QAAQ,KAAK,GAAG,GAAG,OAAO,QAAQ,KAAK,GAAG,GAAG,QAAQ,QAAQ,KAAK,GAAG,GAAG,SAAS,QAAQ,MAAM;AAAA,EAC9G,QAAQ,EAAE,SAAS,QAAQ,KAAK,GAAG,GAAG,QAAQ,QAAQ,KAAK,GAAG,GAAG,OAAO,QAAQ,KAAK,GAAG,EAAE;AAAA,EAC1F,SAAS;AAAA,IACP,OAAO,QAAQ,KAAK,GAAG;AAAA,IACvB,YAAY,QAAQ,KAAK,GAAG;AAAA,IAC5B,UAAU,QAAQ;AAAA,IAClB,QAAQ,QAAQ,KAAK,EAAE;AAAA,IACvB,aAAa,QAAQ,KAAK,GAAG;AAAA,IAC7B,MAAM,QAAQ,KAAK,GAAG;AAAA,EACxB;AAAA,EACA,SAAS;AAAA,IACP,OAAO,QAAQ,KAAK,GAAG;AAAA,IACvB,YAAY,QAAQ,KAAK,GAAG;AAAA,IAC5B,UAAU,QAAQ;AAAA,IAClB,QAAQ,QAAQ,KAAK,GAAG;AAAA,IACxB,aAAa,QAAQ,KAAK,GAAG;AAAA,IAC7B,MAAM,QAAQ,KAAK,GAAG;AAAA,EACxB;AAAA,EACA,QAAQ;AAAA,IACN,OAAO,QAAQ,IAAI,GAAG;AAAA,IACtB,YAAY,QAAQ,IAAI,GAAG;AAAA,IAC3B,UAAU,QAAQ;AAAA,IAClB,QAAQ,QAAQ,IAAI,EAAE;AAAA,IACtB,aAAa,QAAQ,IAAI,GAAG;AAAA,IAC5B,MAAM,QAAQ,IAAI,GAAG;AAAA,EACvB;AAAA,EACA,SAAS;AAAA,IACP,OAAO,QAAQ,MAAM,GAAG;AAAA,IACxB,YAAY,QAAQ,MAAM,GAAG;AAAA,IAC7B,UAAU,QAAQ;AAAA,IAClB,QAAQ,QAAQ,MAAM,EAAE;AAAA,IACxB,aAAa,QAAQ,MAAM,GAAG;AAAA,IAC9B,MAAM,QAAQ,MAAM,GAAG;AAAA,EACzB;AAAA;AAAA,EAEA,SAAS;AAAA,IACP,OAAO,QAAQ,MAAM,GAAG;AAAA,IACxB,YAAY,QAAQ,MAAM,GAAG;AAAA,IAC7B,UAAU,QAAQ,KAAK,GAAG;AAAA,IAC1B,QAAQ,QAAQ,MAAM,EAAE;AAAA,IACxB,aAAa,QAAQ,MAAM,GAAG;AAAA,IAC9B,MAAM,QAAQ,MAAM,GAAG;AAAA,EACzB;AACF;AAEO,IAAM,aAA6B;AAAA,EACxC,IAAI;AAAA,IACF,SAAS,QAAQ,KAAK,GAAG;AAAA,IACzB,QAAQ,QAAQ,KAAK,GAAG;AAAA,IACxB,OAAO,QAAQ,KAAK,GAAG;AAAA,IACvB,SAAS,QAAQ,KAAK,EAAE;AAAA,IACxB,SAAS;AAAA,EACX;AAAA,EACA,IAAI,EAAE,SAAS,QAAQ,KAAK,EAAE,GAAG,OAAO,QAAQ,KAAK,GAAG,GAAG,QAAQ,QAAQ,KAAK,GAAG,GAAG,SAAS,QAAQ,KAAK,GAAG,EAAE;AAAA,EACjH,QAAQ,EAAE,SAAS,QAAQ,KAAK,GAAG,GAAG,QAAQ,QAAQ,KAAK,GAAG,GAAG,OAAO,QAAQ,KAAK,GAAG,EAAE;AAAA,EAC1F,SAAS;AAAA,IACP,OAAO,QAAQ,KAAK,GAAG;AAAA,IACvB,YAAY,QAAQ,KAAK,GAAG;AAAA;AAAA,IAC5B,UAAU,QAAQ;AAAA,IAClB,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,MAAM,QAAQ,KAAK,GAAG;AAAA,EACxB;AAAA,EACA,SAAS;AAAA,IACP,OAAO,QAAQ,KAAK,GAAG;AAAA,IACvB,YAAY,QAAQ,KAAK,GAAG;AAAA,IAC5B,UAAU,QAAQ,KAAK,GAAG;AAAA,IAC1B,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,MAAM,QAAQ,KAAK,GAAG;AAAA,EACxB;AAAA,EACA,QAAQ;AAAA,IACN,OAAO,QAAQ,IAAI,GAAG;AAAA,IACtB,YAAY,QAAQ,IAAI,GAAG;AAAA,IAC3B,UAAU,QAAQ;AAAA,IAClB,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,MAAM,QAAQ,IAAI,GAAG;AAAA,EACvB;AAAA,EACA,SAAS;AAAA,IACP,OAAO,QAAQ,MAAM,GAAG;AAAA,IACxB,YAAY,QAAQ,MAAM,GAAG;AAAA,IAC7B,UAAU,QAAQ;AAAA,IAClB,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,MAAM,QAAQ,MAAM,GAAG;AAAA,EACzB;AAAA,EACA,SAAS;AAAA,IACP,OAAO,QAAQ,MAAM,GAAG;AAAA,IACxB,YAAY,QAAQ,MAAM,GAAG;AAAA,IAC7B,UAAU,QAAQ,KAAK,GAAG;AAAA,IAC1B,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,MAAM,QAAQ,MAAM,GAAG;AAAA,EACzB;AACF;","names":[]}
1	+ {"version":3,"sources":["../src/index.ts"],"sourcesContent":["/*\n BestOW UI 디자인 토큰.\n * 플랫폼에 독립적인 원시 값만 정의한다. 컴포넌트는 @bestow-ui/react 의 테마(vars)를 통해 참조한다.\n /\n\nexport const palette = {\n white: '#ffffff',\n black: '#000000',\n gray: {\n 50: '#f8f9fa',\n 100: '#f1f3f5',\n 200: '#e9ecef',\n 300: '#dee2e6',\n 400: '#ced4da',\n 500: '#adb5bd',\n 600: '#666e76', // 흰색·gray50·gray100 배경에서 4.5:1 이상 (fg.subtle 로 쓰인다)\n 700: '#495057',\n 800: '#343a40',\n 900: '#212529',\n 950: '#16181b',\n },\n blue: {\n 50: '#eef4ff',\n 100: '#dbe6fe',\n 200: '#bfd3fe',\n 300: '#93b4fd',\n 400: '#6090fa',\n 500: '#3b6ff6',\n 600: '#2554eb',\n 700: '#1d42d8',\n 800: '#1e37af',\n 900: '#1e338a',\n },\n red: {\n 50: '#fef2f2',\n 100: '#fee2e2',\n 200: '#fecaca',\n 300: '#fca5a5',\n 400: '#f87171',\n 500: '#ef4444',\n 600: '#dc2626',\n 700: '#b91c1c',\n 800: '#991b1b',\n 900: '#7f1d1d',\n },\n green: {\n 50: '#f0fdf4',\n 100: '#dcfce7',\n 200: '#bbf7d0',\n 300: '#86efac',\n 400: '#4ade80',\n 500: '#22c55e',\n 600: '#16a34a',\n 700: '#15803d',\n 800: '#166534',\n 900: '#14532d',\n },\n amber: {\n 50: '#fffbeb',\n 100: '#fef3c7',\n 200: '#fde68a',\n 300: '#fcd34d',\n 400: '#fbbf24',\n 500: '#f59e0b',\n 600: '#d97706',\n 700: '#b45309',\n 800: '#92400e',\n 900: '#78350f',\n },\n} as const;\n\nexport const space = {\n 0: '0',\n 1: '4px',\n 2: '8px',\n 3: '12px',\n 4: '16px',\n 5: '20px',\n 6: '24px',\n 8: '32px',\n 10: '40px',\n 12: '48px',\n 16: '64px',\n} as const;\n\nexport const radius = {\n none: '0',\n sm: '4px',\n md: '8px',\n lg: '12px',\n xl: '16px',\n full: '9999px',\n} as const;\n\nexport const fontFamily = {\n sans: '\"Pretendard Variable\", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, \"Apple SD Gothic Neo\", \"Noto Sans KR\", sans-serif',\n mono: '\"JetBrains Mono\", ui-monospace, SFMono-Regular, Menlo, monospace',\n} as const;\n\nexport const fontSize = {\n xs: '12px',\n sm: '14px',\n md: '16px',\n lg: '18px',\n xl: '20px',\n '2xl': '24px',\n '3xl': '30px',\n '4xl': '36px',\n} as const;\n\nexport const fontWeight = {\n regular: '400',\n medium: '500',\n semibold: '600',\n bold: '700',\n} as const;\n\nexport const lineHeight = {\n tight: '1.25',\n normal: '1.5',\n relaxed: '1.75',\n} as const;\n\n/* 라이트 모드 그림자. 다크 모드는 darkShadow 를 쓴다 (같은 키). /\nexport const shadow = {\n sm: '0 1px 2px rgba(0, 0, 0, 0.06)',\n md: '0 4px 12px rgba(0, 0, 0, 0.08)',\n lg: '0 12px 32px rgba(0, 0, 0, 0.12)',\n} as const;\n\n/\n 다크 모드 그림자. 어두운 배경에서는 옅은 그림자가 보이지 않으므로 더 진하게 하고,\n * 떠 있는 면(md·lg)은 가장자리를 구분하는 옅은 밝은 테두리(ring)를 함께 둔다.\n /\nexport const darkShadow = {\n sm: '0 1px 2px rgba(0, 0, 0, 0.5)',\n md: '0 0 0 1px rgba(255, 255, 255, 0.08), 0 4px 12px rgba(0, 0, 0, 0.5)',\n lg: '0 0 0 1px rgba(255, 255, 255, 0.1), 0 12px 32px rgba(0, 0, 0, 0.6)',\n} as const satisfies Record<keyof typeof shadow, string>;\n\nexport const duration = {\n fast: '120ms',\n normal: '200ms',\n slow: '320ms',\n} as const;\n\n/\n 쌓임 순서. dropdown(Select·Combobox·DropdownMenu·Popover 목록)은 modal 보다 위 — 대화상자 안에서 연 목록이 배경막에 가리지 않게.\n * 대화상자가 열려 있으면 바깥 페이지의 목록은 열 수 없으므로(포커스가 갇힘) 이 순서로 충돌하지 않는다.\n * (1.x 초기에는 dropdown 1000 이라 Modal 안의 Select 목록이 배경막 아래에 그려졌다 — 파일럿 화면에서 발견)\n /\nexport const zIndex = {\n overlay: '1300',\n modal: '1310',\n dropdown: '1320',\n toast: '1400',\n tooltip: '1500',\n} as const;\n\n/* 의미 기반(semantic) 색상. 라이트/다크 테마가 같은 키를 가져야 한다. /\n/* solid 배경 위 글자색은 각 그룹의 contrast 를 사용한다. */\nexport interface SemanticColors {\n bg: { default: string; subtle: string; muted: string; inverse: string; overlay: string };\n fg: { default: string; muted: string; subtle: string; inverse: string };\n border: { default: string; strong: string; focus: string };\n primary: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n neutral: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n danger: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n success: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n warning: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n}\n\nexport const lightColors: SemanticColors = {\n bg: {\n default: palette.white,\n subtle: palette.gray[50],\n muted: palette.gray[100],\n inverse: palette.gray[900],\n overlay: 'rgba(0, 0, 0, 0.45)',\n },\n fg: { default: palette.gray[900], muted: palette.gray[700], subtle: palette.gray[600], inverse: palette.white },\n border: { default: palette.gray[300], strong: palette.gray[500], focus: palette.blue[500] },\n primary: {\n solid: palette.blue[600],\n solidHover: palette.blue[700],\n contrast: palette.white,\n subtle: palette.blue[50],\n subtleHover: palette.blue[100],\n text: palette.blue[700],\n },\n neutral: {\n solid: palette.gray[800],\n solidHover: palette.gray[900],\n contrast: palette.white,\n subtle: palette.gray[100],\n subtleHover: palette.gray[200],\n text: palette.gray[800],\n },\n danger: {\n solid: palette.red[600],\n solidHover: palette.red[700],\n contrast: palette.white,\n subtle: palette.red[50],\n subtleHover: palette.red[100],\n text: palette.red[700],\n },\n success: {\n solid: palette.green[700],\n solidHover: palette.green[800],\n contrast: palette.white,\n subtle: palette.green[50],\n subtleHover: palette.green[100],\n text: palette.green[700],\n },\n // 노란색은 밝아서 solid 위 글자는 흰색이 아닌 어두운 색이다\n warning: {\n solid: palette.amber[500],\n solidHover: palette.amber[600],\n contrast: palette.gray[900],\n subtle: palette.amber[50],\n subtleHover: palette.amber[100],\n text: palette.amber[800],\n },\n};\n\nexport const darkColors: SemanticColors = {\n bg: {\n default: palette.gray[950],\n subtle: palette.gray[900],\n muted: palette.gray[800],\n inverse: palette.gray[50],\n overlay: 'rgba(0, 0, 0, 0.65)',\n },\n fg: { default: palette.gray[50], muted: palette.gray[300], subtle: palette.gray[500], inverse: palette.gray[900] },\n border: { default: palette.gray[700], strong: palette.gray[500], focus: palette.blue[400] },\n primary: {\n solid: palette.blue[600],\n solidHover: palette.blue[700], // 흰 글자 대비 유지를 위해 다크에서도 hover 는 어둡게 (blue500 은 4.38)\n contrast: palette.white,\n subtle: 'rgba(59, 111, 246, 0.16)',\n subtleHover: 'rgba(59, 111, 246, 0.26)',\n text: palette.blue[300],\n },\n neutral: {\n solid: palette.gray[200],\n solidHover: palette.gray[100],\n contrast: palette.gray[900],\n subtle: 'rgba(255, 255, 255, 0.08)',\n subtleHover: 'rgba(255, 255, 255, 0.14)',\n text: palette.gray[100],\n },\n danger: {\n solid: palette.red[600],\n solidHover: palette.red[700],\n contrast: palette.white,\n subtle: 'rgba(239, 68, 68, 0.16)',\n subtleHover: 'rgba(239, 68, 68, 0.26)',\n text: palette.red[300],\n },\n success: {\n solid: palette.green[700],\n solidHover: palette.green[800],\n contrast: palette.white,\n subtle: 'rgba(34, 197, 94, 0.16)',\n subtleHover: 'rgba(34, 197, 94, 0.26)',\n text: palette.green[300],\n },\n warning: {\n solid: palette.amber[500],\n solidHover: palette.amber[400],\n contrast: palette.gray[900],\n subtle: 'rgba(245, 158, 11, 0.16)',\n subtleHover: 'rgba(245, 158, 11, 0.26)',\n text: palette.amber[300],\n },\n};\n"],"mappings":"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","names":[]}

package/dist/index.d.cts CHANGED Viewed

@@ -133,10 +133,15 @@ declare const duration: {
     readonly normal: "200ms";
     readonly slow: "320ms";
 };
+/**
+ * 쌓임 순서. dropdown(Select·Combobox·DropdownMenu·Popover 목록)은 modal 보다 위 — 대화상자 안에서 연 목록이 배경막에 가리지 않게.
+ * 대화상자가 열려 있으면 바깥 페이지의 목록은 열 수 없으므로(포커스가 갇힘) 이 순서로 충돌하지 않는다.
+ * (1.x 초기에는 dropdown 1000 이라 Modal 안의 Select 목록이 배경막 아래에 그려졌다 — 파일럿 화면에서 발견)
+ */
 declare const zIndex: {
-    readonly dropdown: "1000";
     readonly overlay: "1300";
     readonly modal: "1310";
+    readonly dropdown: "1320";
     readonly toast: "1400";
     readonly tooltip: "1500";
 };

package/dist/index.d.ts CHANGED Viewed

@@ -133,10 +133,15 @@ declare const duration: {
     readonly normal: "200ms";
     readonly slow: "320ms";
 };
+/**
+ * 쌓임 순서. dropdown(Select·Combobox·DropdownMenu·Popover 목록)은 modal 보다 위 — 대화상자 안에서 연 목록이 배경막에 가리지 않게.
+ * 대화상자가 열려 있으면 바깥 페이지의 목록은 열 수 없으므로(포커스가 갇힘) 이 순서로 충돌하지 않는다.
+ * (1.x 초기에는 dropdown 1000 이라 Modal 안의 Select 목록이 배경막 아래에 그려졌다 — 파일럿 화면에서 발견)
+ */
 declare const zIndex: {
-    readonly dropdown: "1000";
     readonly overlay: "1300";
     readonly modal: "1310";
+    readonly dropdown: "1320";
     readonly toast: "1400";
     readonly tooltip: "1500";
 };

package/dist/index.js CHANGED Viewed

@@ -127,9 +127,9 @@ var duration = {
   slow: "320ms"
 };
 var zIndex = {
-  dropdown: "1000",
   overlay: "1300",
   modal: "1310",
+  dropdown: "1320",
   toast: "1400",
   tooltip: "1500"
 };

package/dist/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/index.ts"],"sourcesContent":["/*\n BestOW UI 디자인 토큰.\n * 플랫폼에 독립적인 원시 값만 정의한다. 컴포넌트는 @bestow-ui/react 의 테마(vars)를 통해 참조한다.\n /\n\nexport const palette = {\n white: '#ffffff',\n black: '#000000',\n gray: {\n 50: '#f8f9fa',\n 100: '#f1f3f5',\n 200: '#e9ecef',\n 300: '#dee2e6',\n 400: '#ced4da',\n 500: '#adb5bd',\n 600: '#666e76', // 흰색·gray50·gray100 배경에서 4.5:1 이상 (fg.subtle 로 쓰인다)\n 700: '#495057',\n 800: '#343a40',\n 900: '#212529',\n 950: '#16181b',\n },\n blue: {\n 50: '#eef4ff',\n 100: '#dbe6fe',\n 200: '#bfd3fe',\n 300: '#93b4fd',\n 400: '#6090fa',\n 500: '#3b6ff6',\n 600: '#2554eb',\n 700: '#1d42d8',\n 800: '#1e37af',\n 900: '#1e338a',\n },\n red: {\n 50: '#fef2f2',\n 100: '#fee2e2',\n 200: '#fecaca',\n 300: '#fca5a5',\n 400: '#f87171',\n 500: '#ef4444',\n 600: '#dc2626',\n 700: '#b91c1c',\n 800: '#991b1b',\n 900: '#7f1d1d',\n },\n green: {\n 50: '#f0fdf4',\n 100: '#dcfce7',\n 200: '#bbf7d0',\n 300: '#86efac',\n 400: '#4ade80',\n 500: '#22c55e',\n 600: '#16a34a',\n 700: '#15803d',\n 800: '#166534',\n 900: '#14532d',\n },\n amber: {\n 50: '#fffbeb',\n 100: '#fef3c7',\n 200: '#fde68a',\n 300: '#fcd34d',\n 400: '#fbbf24',\n 500: '#f59e0b',\n 600: '#d97706',\n 700: '#b45309',\n 800: '#92400e',\n 900: '#78350f',\n },\n} as const;\n\nexport const space = {\n 0: '0',\n 1: '4px',\n 2: '8px',\n 3: '12px',\n 4: '16px',\n 5: '20px',\n 6: '24px',\n 8: '32px',\n 10: '40px',\n 12: '48px',\n 16: '64px',\n} as const;\n\nexport const radius = {\n none: '0',\n sm: '4px',\n md: '8px',\n lg: '12px',\n xl: '16px',\n full: '9999px',\n} as const;\n\nexport const fontFamily = {\n sans: '\"Pretendard Variable\", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, \"Apple SD Gothic Neo\", \"Noto Sans KR\", sans-serif',\n mono: '\"JetBrains Mono\", ui-monospace, SFMono-Regular, Menlo, monospace',\n} as const;\n\nexport const fontSize = {\n xs: '12px',\n sm: '14px',\n md: '16px',\n lg: '18px',\n xl: '20px',\n '2xl': '24px',\n '3xl': '30px',\n '4xl': '36px',\n} as const;\n\nexport const fontWeight = {\n regular: '400',\n medium: '500',\n semibold: '600',\n bold: '700',\n} as const;\n\nexport const lineHeight = {\n tight: '1.25',\n normal: '1.5',\n relaxed: '1.75',\n} as const;\n\n/* 라이트 모드 그림자. 다크 모드는 darkShadow 를 쓴다 (같은 키). /\nexport const shadow = {\n sm: '0 1px 2px rgba(0, 0, 0, 0.06)',\n md: '0 4px 12px rgba(0, 0, 0, 0.08)',\n lg: '0 12px 32px rgba(0, 0, 0, 0.12)',\n} as const;\n\n/\n 다크 모드 그림자. 어두운 배경에서는 옅은 그림자가 보이지 않으므로 더 진하게 하고,\n * 떠 있는 면(md·lg)은 가장자리를 구분하는 옅은 밝은 테두리(ring)를 함께 둔다.\n /\nexport const darkShadow = {\n sm: '0 1px 2px rgba(0, 0, 0, 0.5)',\n md: '0 0 0 1px rgba(255, 255, 255, 0.08), 0 4px 12px rgba(0, 0, 0, 0.5)',\n lg: '0 0 0 1px rgba(255, 255, 255, 0.1), 0 12px 32px rgba(0, 0, 0, 0.6)',\n} as const satisfies Record<keyof typeof shadow, string>;\n\nexport const duration = {\n fast: '120ms',\n normal: '200ms',\n slow: '320ms',\n} as const;\n\nexport const zIndex = {\n dropdown: '1000',\n overlay: '1300',\n modal: '1310',\n toast: '1400',\n tooltip: '1500',\n} as const;\n\n/* 의미 기반(semantic) 색상. 라이트/다크 테마가 같은 키를 가져야 한다. /\n/* solid 배경 위 글자색은 각 그룹의 contrast 를 사용한다. */\nexport interface SemanticColors {\n bg: { default: string; subtle: string; muted: string; inverse: string; overlay: string };\n fg: { default: string; muted: string; subtle: string; inverse: string };\n border: { default: string; strong: string; focus: string };\n primary: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n neutral: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n danger: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n success: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n warning: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n}\n\nexport const lightColors: SemanticColors = {\n bg: {\n default: palette.white,\n subtle: palette.gray[50],\n muted: palette.gray[100],\n inverse: palette.gray[900],\n overlay: 'rgba(0, 0, 0, 0.45)',\n },\n fg: { default: palette.gray[900], muted: palette.gray[700], subtle: palette.gray[600], inverse: palette.white },\n border: { default: palette.gray[300], strong: palette.gray[500], focus: palette.blue[500] },\n primary: {\n solid: palette.blue[600],\n solidHover: palette.blue[700],\n contrast: palette.white,\n subtle: palette.blue[50],\n subtleHover: palette.blue[100],\n text: palette.blue[700],\n },\n neutral: {\n solid: palette.gray[800],\n solidHover: palette.gray[900],\n contrast: palette.white,\n subtle: palette.gray[100],\n subtleHover: palette.gray[200],\n text: palette.gray[800],\n },\n danger: {\n solid: palette.red[600],\n solidHover: palette.red[700],\n contrast: palette.white,\n subtle: palette.red[50],\n subtleHover: palette.red[100],\n text: palette.red[700],\n },\n success: {\n solid: palette.green[700],\n solidHover: palette.green[800],\n contrast: palette.white,\n subtle: palette.green[50],\n subtleHover: palette.green[100],\n text: palette.green[700],\n },\n // 노란색은 밝아서 solid 위 글자는 흰색이 아닌 어두운 색이다\n warning: {\n solid: palette.amber[500],\n solidHover: palette.amber[600],\n contrast: palette.gray[900],\n subtle: palette.amber[50],\n subtleHover: palette.amber[100],\n text: palette.amber[800],\n },\n};\n\nexport const darkColors: SemanticColors = {\n bg: {\n default: palette.gray[950],\n subtle: palette.gray[900],\n muted: palette.gray[800],\n inverse: palette.gray[50],\n overlay: 'rgba(0, 0, 0, 0.65)',\n },\n fg: { default: palette.gray[50], muted: palette.gray[300], subtle: palette.gray[500], inverse: palette.gray[900] },\n border: { default: palette.gray[700], strong: palette.gray[500], focus: palette.blue[400] },\n primary: {\n solid: palette.blue[600],\n solidHover: palette.blue[700], // 흰 글자 대비 유지를 위해 다크에서도 hover 는 어둡게 (blue500 은 4.38)\n contrast: palette.white,\n subtle: 'rgba(59, 111, 246, 0.16)',\n subtleHover: 'rgba(59, 111, 246, 0.26)',\n text: palette.blue[300],\n },\n neutral: {\n solid: palette.gray[200],\n solidHover: palette.gray[100],\n contrast: palette.gray[900],\n subtle: 'rgba(255, 255, 255, 0.08)',\n subtleHover: 'rgba(255, 255, 255, 0.14)',\n text: palette.gray[100],\n },\n danger: {\n solid: palette.red[600],\n solidHover: palette.red[700],\n contrast: palette.white,\n subtle: 'rgba(239, 68, 68, 0.16)',\n subtleHover: 'rgba(239, 68, 68, 0.26)',\n text: palette.red[300],\n },\n success: {\n solid: palette.green[700],\n solidHover: palette.green[800],\n contrast: palette.white,\n subtle: 'rgba(34, 197, 94, 0.16)',\n subtleHover: 'rgba(34, 197, 94, 0.26)',\n text: palette.green[300],\n },\n warning: {\n solid: palette.amber[500],\n solidHover: palette.amber[400],\n contrast: palette.gray[900],\n subtle: 'rgba(245, 158, 11, 0.16)',\n subtleHover: 'rgba(245, 158, 11, 0.26)',\n text: palette.amber[300],\n },\n};\n"],"mappings":";AAKO,IAAM,UAAU;AAAA,EACrB,OAAO;AAAA,EACP,OAAO;AAAA,EACP,MAAM;AAAA,IACJ,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,EACP;AAAA,EACA,MAAM;AAAA,IACJ,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,EACP;AAAA,EACA,KAAK;AAAA,IACH,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,EACP;AAAA,EACA,OAAO;AAAA,IACL,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,EACP;AAAA,EACA,OAAO;AAAA,IACL,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,EACP;AACF;AAEO,IAAM,QAAQ;AAAA,EACnB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEO,IAAM,SAAS;AAAA,EACpB,MAAM;AAAA,EACN,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,MAAM;AACR;AAEO,IAAM,aAAa;AAAA,EACxB,MAAM;AAAA,EACN,MAAM;AACR;AAEO,IAAM,WAAW;AAAA,EACtB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AACT;AAEO,IAAM,aAAa;AAAA,EACxB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,MAAM;AACR;AAEO,IAAM,aAAa;AAAA,EACxB,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,SAAS;AACX;AAGO,IAAM,SAAS;AAAA,EACpB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAMO,IAAM,aAAa;AAAA,EACxB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEO,IAAM,WAAW;AAAA,EACtB,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,MAAM;AACR;AAEO,IAAM,SAAS;AAAA,EACpB,UAAU;AAAA,EACV,SAAS;AAAA,EACT,OAAO;AAAA,EACP,OAAO;AAAA,EACP,SAAS;AACX;AAeO,IAAM,cAA8B;AAAA,EACzC,IAAI;AAAA,IACF,SAAS,QAAQ;AAAA,IACjB,QAAQ,QAAQ,KAAK,EAAE;AAAA,IACvB,OAAO,QAAQ,KAAK,GAAG;AAAA,IACvB,SAAS,QAAQ,KAAK,GAAG;AAAA,IACzB,SAAS;AAAA,EACX;AAAA,EACA,IAAI,EAAE,SAAS,QAAQ,KAAK,GAAG,GAAG,OAAO,QAAQ,KAAK,GAAG,GAAG,QAAQ,QAAQ,KAAK,GAAG,GAAG,SAAS,QAAQ,MAAM;AAAA,EAC9G,QAAQ,EAAE,SAAS,QAAQ,KAAK,GAAG,GAAG,QAAQ,QAAQ,KAAK,GAAG,GAAG,OAAO,QAAQ,KAAK,GAAG,EAAE;AAAA,EAC1F,SAAS;AAAA,IACP,OAAO,QAAQ,KAAK,GAAG;AAAA,IACvB,YAAY,QAAQ,KAAK,GAAG;AAAA,IAC5B,UAAU,QAAQ;AAAA,IAClB,QAAQ,QAAQ,KAAK,EAAE;AAAA,IACvB,aAAa,QAAQ,KAAK,GAAG;AAAA,IAC7B,MAAM,QAAQ,KAAK,GAAG;AAAA,EACxB;AAAA,EACA,SAAS;AAAA,IACP,OAAO,QAAQ,KAAK,GAAG;AAAA,IACvB,YAAY,QAAQ,KAAK,GAAG;AAAA,IAC5B,UAAU,QAAQ;AAAA,IAClB,QAAQ,QAAQ,KAAK,GAAG;AAAA,IACxB,aAAa,QAAQ,KAAK,GAAG;AAAA,IAC7B,MAAM,QAAQ,KAAK,GAAG;AAAA,EACxB;AAAA,EACA,QAAQ;AAAA,IACN,OAAO,QAAQ,IAAI,GAAG;AAAA,IACtB,YAAY,QAAQ,IAAI,GAAG;AAAA,IAC3B,UAAU,QAAQ;AAAA,IAClB,QAAQ,QAAQ,IAAI,EAAE;AAAA,IACtB,aAAa,QAAQ,IAAI,GAAG;AAAA,IAC5B,MAAM,QAAQ,IAAI,GAAG;AAAA,EACvB;AAAA,EACA,SAAS;AAAA,IACP,OAAO,QAAQ,MAAM,GAAG;AAAA,IACxB,YAAY,QAAQ,MAAM,GAAG;AAAA,IAC7B,UAAU,QAAQ;AAAA,IAClB,QAAQ,QAAQ,MAAM,EAAE;AAAA,IACxB,aAAa,QAAQ,MAAM,GAAG;AAAA,IAC9B,MAAM,QAAQ,MAAM,GAAG;AAAA,EACzB;AAAA;AAAA,EAEA,SAAS;AAAA,IACP,OAAO,QAAQ,MAAM,GAAG;AAAA,IACxB,YAAY,QAAQ,MAAM,GAAG;AAAA,IAC7B,UAAU,QAAQ,KAAK,GAAG;AAAA,IAC1B,QAAQ,QAAQ,MAAM,EAAE;AAAA,IACxB,aAAa,QAAQ,MAAM,GAAG;AAAA,IAC9B,MAAM,QAAQ,MAAM,GAAG;AAAA,EACzB;AACF;AAEO,IAAM,aAA6B;AAAA,EACxC,IAAI;AAAA,IACF,SAAS,QAAQ,KAAK,GAAG;AAAA,IACzB,QAAQ,QAAQ,KAAK,GAAG;AAAA,IACxB,OAAO,QAAQ,KAAK,GAAG;AAAA,IACvB,SAAS,QAAQ,KAAK,EAAE;AAAA,IACxB,SAAS;AAAA,EACX;AAAA,EACA,IAAI,EAAE,SAAS,QAAQ,KAAK,EAAE,GAAG,OAAO,QAAQ,KAAK,GAAG,GAAG,QAAQ,QAAQ,KAAK,GAAG,GAAG,SAAS,QAAQ,KAAK,GAAG,EAAE;AAAA,EACjH,QAAQ,EAAE,SAAS,QAAQ,KAAK,GAAG,GAAG,QAAQ,QAAQ,KAAK,GAAG,GAAG,OAAO,QAAQ,KAAK,GAAG,EAAE;AAAA,EAC1F,SAAS;AAAA,IACP,OAAO,QAAQ,KAAK,GAAG;AAAA,IACvB,YAAY,QAAQ,KAAK,GAAG;AAAA;AAAA,IAC5B,UAAU,QAAQ;AAAA,IAClB,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,MAAM,QAAQ,KAAK,GAAG;AAAA,EACxB;AAAA,EACA,SAAS;AAAA,IACP,OAAO,QAAQ,KAAK,GAAG;AAAA,IACvB,YAAY,QAAQ,KAAK,GAAG;AAAA,IAC5B,UAAU,QAAQ,KAAK,GAAG;AAAA,IAC1B,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,MAAM,QAAQ,KAAK,GAAG;AAAA,EACxB;AAAA,EACA,QAAQ;AAAA,IACN,OAAO,QAAQ,IAAI,GAAG;AAAA,IACtB,YAAY,QAAQ,IAAI,GAAG;AAAA,IAC3B,UAAU,QAAQ;AAAA,IAClB,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,MAAM,QAAQ,IAAI,GAAG;AAAA,EACvB;AAAA,EACA,SAAS;AAAA,IACP,OAAO,QAAQ,MAAM,GAAG;AAAA,IACxB,YAAY,QAAQ,MAAM,GAAG;AAAA,IAC7B,UAAU,QAAQ;AAAA,IAClB,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,MAAM,QAAQ,MAAM,GAAG;AAAA,EACzB;AAAA,EACA,SAAS;AAAA,IACP,OAAO,QAAQ,MAAM,GAAG;AAAA,IACxB,YAAY,QAAQ,MAAM,GAAG;AAAA,IAC7B,UAAU,QAAQ,KAAK,GAAG;AAAA,IAC1B,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,MAAM,QAAQ,MAAM,GAAG;AAAA,EACzB;AACF;","names":[]}
1	+ {"version":3,"sources":["../src/index.ts"],"sourcesContent":["/*\n BestOW UI 디자인 토큰.\n * 플랫폼에 독립적인 원시 값만 정의한다. 컴포넌트는 @bestow-ui/react 의 테마(vars)를 통해 참조한다.\n /\n\nexport const palette = {\n white: '#ffffff',\n black: '#000000',\n gray: {\n 50: '#f8f9fa',\n 100: '#f1f3f5',\n 200: '#e9ecef',\n 300: '#dee2e6',\n 400: '#ced4da',\n 500: '#adb5bd',\n 600: '#666e76', // 흰색·gray50·gray100 배경에서 4.5:1 이상 (fg.subtle 로 쓰인다)\n 700: '#495057',\n 800: '#343a40',\n 900: '#212529',\n 950: '#16181b',\n },\n blue: {\n 50: '#eef4ff',\n 100: '#dbe6fe',\n 200: '#bfd3fe',\n 300: '#93b4fd',\n 400: '#6090fa',\n 500: '#3b6ff6',\n 600: '#2554eb',\n 700: '#1d42d8',\n 800: '#1e37af',\n 900: '#1e338a',\n },\n red: {\n 50: '#fef2f2',\n 100: '#fee2e2',\n 200: '#fecaca',\n 300: '#fca5a5',\n 400: '#f87171',\n 500: '#ef4444',\n 600: '#dc2626',\n 700: '#b91c1c',\n 800: '#991b1b',\n 900: '#7f1d1d',\n },\n green: {\n 50: '#f0fdf4',\n 100: '#dcfce7',\n 200: '#bbf7d0',\n 300: '#86efac',\n 400: '#4ade80',\n 500: '#22c55e',\n 600: '#16a34a',\n 700: '#15803d',\n 800: '#166534',\n 900: '#14532d',\n },\n amber: {\n 50: '#fffbeb',\n 100: '#fef3c7',\n 200: '#fde68a',\n 300: '#fcd34d',\n 400: '#fbbf24',\n 500: '#f59e0b',\n 600: '#d97706',\n 700: '#b45309',\n 800: '#92400e',\n 900: '#78350f',\n },\n} as const;\n\nexport const space = {\n 0: '0',\n 1: '4px',\n 2: '8px',\n 3: '12px',\n 4: '16px',\n 5: '20px',\n 6: '24px',\n 8: '32px',\n 10: '40px',\n 12: '48px',\n 16: '64px',\n} as const;\n\nexport const radius = {\n none: '0',\n sm: '4px',\n md: '8px',\n lg: '12px',\n xl: '16px',\n full: '9999px',\n} as const;\n\nexport const fontFamily = {\n sans: '\"Pretendard Variable\", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, \"Apple SD Gothic Neo\", \"Noto Sans KR\", sans-serif',\n mono: '\"JetBrains Mono\", ui-monospace, SFMono-Regular, Menlo, monospace',\n} as const;\n\nexport const fontSize = {\n xs: '12px',\n sm: '14px',\n md: '16px',\n lg: '18px',\n xl: '20px',\n '2xl': '24px',\n '3xl': '30px',\n '4xl': '36px',\n} as const;\n\nexport const fontWeight = {\n regular: '400',\n medium: '500',\n semibold: '600',\n bold: '700',\n} as const;\n\nexport const lineHeight = {\n tight: '1.25',\n normal: '1.5',\n relaxed: '1.75',\n} as const;\n\n/* 라이트 모드 그림자. 다크 모드는 darkShadow 를 쓴다 (같은 키). /\nexport const shadow = {\n sm: '0 1px 2px rgba(0, 0, 0, 0.06)',\n md: '0 4px 12px rgba(0, 0, 0, 0.08)',\n lg: '0 12px 32px rgba(0, 0, 0, 0.12)',\n} as const;\n\n/\n 다크 모드 그림자. 어두운 배경에서는 옅은 그림자가 보이지 않으므로 더 진하게 하고,\n * 떠 있는 면(md·lg)은 가장자리를 구분하는 옅은 밝은 테두리(ring)를 함께 둔다.\n /\nexport const darkShadow = {\n sm: '0 1px 2px rgba(0, 0, 0, 0.5)',\n md: '0 0 0 1px rgba(255, 255, 255, 0.08), 0 4px 12px rgba(0, 0, 0, 0.5)',\n lg: '0 0 0 1px rgba(255, 255, 255, 0.1), 0 12px 32px rgba(0, 0, 0, 0.6)',\n} as const satisfies Record<keyof typeof shadow, string>;\n\nexport const duration = {\n fast: '120ms',\n normal: '200ms',\n slow: '320ms',\n} as const;\n\n/\n 쌓임 순서. dropdown(Select·Combobox·DropdownMenu·Popover 목록)은 modal 보다 위 — 대화상자 안에서 연 목록이 배경막에 가리지 않게.\n * 대화상자가 열려 있으면 바깥 페이지의 목록은 열 수 없으므로(포커스가 갇힘) 이 순서로 충돌하지 않는다.\n * (1.x 초기에는 dropdown 1000 이라 Modal 안의 Select 목록이 배경막 아래에 그려졌다 — 파일럿 화면에서 발견)\n /\nexport const zIndex = {\n overlay: '1300',\n modal: '1310',\n dropdown: '1320',\n toast: '1400',\n tooltip: '1500',\n} as const;\n\n/* 의미 기반(semantic) 색상. 라이트/다크 테마가 같은 키를 가져야 한다. /\n/* solid 배경 위 글자색은 각 그룹의 contrast 를 사용한다. */\nexport interface SemanticColors {\n bg: { default: string; subtle: string; muted: string; inverse: string; overlay: string };\n fg: { default: string; muted: string; subtle: string; inverse: string };\n border: { default: string; strong: string; focus: string };\n primary: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n neutral: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n danger: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n success: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n warning: { solid: string; solidHover: string; contrast: string; subtle: string; subtleHover: string; text: string };\n}\n\nexport const lightColors: SemanticColors = {\n bg: {\n default: palette.white,\n subtle: palette.gray[50],\n muted: palette.gray[100],\n inverse: palette.gray[900],\n overlay: 'rgba(0, 0, 0, 0.45)',\n },\n fg: { default: palette.gray[900], muted: palette.gray[700], subtle: palette.gray[600], inverse: palette.white },\n border: { default: palette.gray[300], strong: palette.gray[500], focus: palette.blue[500] },\n primary: {\n solid: palette.blue[600],\n solidHover: palette.blue[700],\n contrast: palette.white,\n subtle: palette.blue[50],\n subtleHover: palette.blue[100],\n text: palette.blue[700],\n },\n neutral: {\n solid: palette.gray[800],\n solidHover: palette.gray[900],\n contrast: palette.white,\n subtle: palette.gray[100],\n subtleHover: palette.gray[200],\n text: palette.gray[800],\n },\n danger: {\n solid: palette.red[600],\n solidHover: palette.red[700],\n contrast: palette.white,\n subtle: palette.red[50],\n subtleHover: palette.red[100],\n text: palette.red[700],\n },\n success: {\n solid: palette.green[700],\n solidHover: palette.green[800],\n contrast: palette.white,\n subtle: palette.green[50],\n subtleHover: palette.green[100],\n text: palette.green[700],\n },\n // 노란색은 밝아서 solid 위 글자는 흰색이 아닌 어두운 색이다\n warning: {\n solid: palette.amber[500],\n solidHover: palette.amber[600],\n contrast: palette.gray[900],\n subtle: palette.amber[50],\n subtleHover: palette.amber[100],\n text: palette.amber[800],\n },\n};\n\nexport const darkColors: SemanticColors = {\n bg: {\n default: palette.gray[950],\n subtle: palette.gray[900],\n muted: palette.gray[800],\n inverse: palette.gray[50],\n overlay: 'rgba(0, 0, 0, 0.65)',\n },\n fg: { default: palette.gray[50], muted: palette.gray[300], subtle: palette.gray[500], inverse: palette.gray[900] },\n border: { default: palette.gray[700], strong: palette.gray[500], focus: palette.blue[400] },\n primary: {\n solid: palette.blue[600],\n solidHover: palette.blue[700], // 흰 글자 대비 유지를 위해 다크에서도 hover 는 어둡게 (blue500 은 4.38)\n contrast: palette.white,\n subtle: 'rgba(59, 111, 246, 0.16)',\n subtleHover: 'rgba(59, 111, 246, 0.26)',\n text: palette.blue[300],\n },\n neutral: {\n solid: palette.gray[200],\n solidHover: palette.gray[100],\n contrast: palette.gray[900],\n subtle: 'rgba(255, 255, 255, 0.08)',\n subtleHover: 'rgba(255, 255, 255, 0.14)',\n text: palette.gray[100],\n },\n danger: {\n solid: palette.red[600],\n solidHover: palette.red[700],\n contrast: palette.white,\n subtle: 'rgba(239, 68, 68, 0.16)',\n subtleHover: 'rgba(239, 68, 68, 0.26)',\n text: palette.red[300],\n },\n success: {\n solid: palette.green[700],\n solidHover: palette.green[800],\n contrast: palette.white,\n subtle: 'rgba(34, 197, 94, 0.16)',\n subtleHover: 'rgba(34, 197, 94, 0.26)',\n text: palette.green[300],\n },\n warning: {\n solid: palette.amber[500],\n solidHover: palette.amber[400],\n contrast: palette.gray[900],\n subtle: 'rgba(245, 158, 11, 0.16)',\n subtleHover: 'rgba(245, 158, 11, 0.26)',\n text: palette.amber[300],\n },\n};\n"],"mappings":"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","names":[]}

package/package.json CHANGED Viewed

@@ -1,14 +1,17 @@
 {
   "name": "@bestow-ui/tokens",
-  "version": "1.0.0",
-  "description": "Design tokens for BestOW UI — colors, spacing, radius, typography, shadow, motion",
+  "version": "1.3.0",
+  "description": "BestOW UI 디자인 토큰 — 색상·간격·모서리·글자·그림자·시간·쌓임 순서 (의존성 없음, 프레임워크 무관)",
   "keywords": [
-    "bestow-ui",
-    "design-system",
     "design-tokens",
     "tokens",
+    "design-system",
     "colors",
-    "theme"
+    "theme",
+    "dark-mode",
+    "korean",
+    "bestow-ui",
+    "디자인시스템"
   ],
   "license": "MIT",
   "author": "Dev-BestOW",