npm - @pop-ui/foundation - Versions diffs - 0.0.22 - Mend

@pop-ui/foundation 0.0.22

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 (6) hide show

package/LICENSE.md ADDED Viewed

@@ -0,0 +1,21 @@
+MIT License
+Copyright (c) 2025 (주)텐핑거스
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md ADDED Viewed

@@ -0,0 +1,183 @@
+# @pop-ui/foundation
+Pop UI의 디자인 토큰, 아이콘, 이미지 등 기본 요소를 제공하는 패키지입니다.
+## 설치
+```bash
+npm install @pop-ui/foundation
+# or
+yarn add @pop-ui/foundation
+```
+## 구성 요소
+### 1. Design Tokens
+디자인 시스템의 색상, 타이포그래피 등의 토큰을 제공합니다.
+```tsx
+import { ColorGray900, ColorAqua500, ColorRed500 } from '@pop-ui/foundation';
+const MyComponent = () => {
+  return <div style={{ color: ColorGray900 }}>Hello</div>;
+};
+```
+#### 사용 가능한 색상 팔레트
+- **Gray**: Gray0 ~ Gray1000 (11단계)
+- **Aqua**: Aqua50 ~ Aqua900 (9단계)
+- **Red**: Red50 ~ Red900 (9단계)
+- **Orange**: Orange50 ~ Orange900 (9단계)
+- **Yellow**: Yellow50 ~ Yellow900 (9단계)
+- **Green**: Green50 ~ Green900 (9단계)
+- **Blue**: Blue50 ~ Blue900 (9단계)
+- **Purple**: Purple50 ~ Purple900 (9단계)
+- **Grape**: Grape50 ~ Grape900 (9단계)
+#### 시맨틱 색상
+```tsx
+import {
+  SemanticColorPrimary,
+  SemanticColorWarning,
+  BgColorButtonBgPrimaryDefault
+} from '@pop-ui/foundation';
+```
+### 2. 아이콘
+React 컴포넌트로 제공되는 아이콘들입니다.
+```tsx
+import { IcChevronDown, IcChevronUp } from '@pop-ui/foundation';
+function MyComponent() {
+  return (
+    <div>
+      <IcChevronDown size={24} color="#1971C2" />
+      <IcChevronUp size={20} />
+    </div>
+  );
+}
+```
+#### 아이콘 Props
+모든 아이콘은 다음 props를 지원합니다:
+- `size?: number` - 아이콘 크기 (기본값: 원본 크기)
+- `color?: string` - 아이콘 색상 (기본값: ColorGray900 = #333333)
+- `className?: string` - CSS 클래스
+- `style?: CSSProperties` - 인라인 스타일
+- 기타 표준 SVG 속성들
+#### 현재 제공되는 아이콘
+- `IcChevronDown` - 아래 화살표 (24x24)
+- `IcChevronUp` - 위 화살표 (24x24)
+- `IcChevronLeft` - 왼쪽 화살표 (8x14)
+- `IcChevronRight` - 오른쪽 화살표 (8x14)
+*더 많은 아이콘이 추가될 예정입니다.*
+#### 아이콘 사용 예시
+```tsx
+import { IcChevronDown, ColorGray900 } from '@pop-ui/foundation';
+// 기본 사용 (기본 색상: ColorGray900)
+<IcChevronDown />
+// 크기 조정
+<IcChevronDown size={32} />
+// 색상 변경
+<IcChevronDown color="#1971C2" />
+// CSS 클래스 사용
+<IcChevronDown className="my-icon" />
+// 스타일 조합
+<IcChevronDown
+  size={20}
+  color="#FF0000"
+  style={{ cursor: 'pointer' }}
+  onClick={() => console.log('clicked')}
+/>
+```
+### 3. Theme Utilities
+런타임에서 색상을 조회하거나 CSS Variables를 생성하는 유틸리티를 제공합니다.
+```tsx
+import {
+  colors,
+  getColorValue,
+  getCSSVariableRef,
+  colorNames
+} from '@pop-ui/foundation';
+// 색상 팔레트 객체
+console.log(colors.gray[900]); // "#333333"
+console.log(colors.aqua[500]); // "#0fd3d8"
+// 헬퍼 함수
+const grayValue = getColorValue('gray', '900'); // "#333333"
+const cssVar = getCSSVariableRef('gray', '900'); // "var(--color-gray-900)"
+// 사용 가능한 모든 색상 이름
+console.log(colorNames); // ['gray', 'aqua', 'red', ...]
+```
+## 개발
+### Token 생성
+디자인 토큰은 `token.json`에서 자동 생성됩니다:
+```bash
+# 1. token.json을 transformed-token.json으로 변환
+yarn token-transform
+# 2. style-dictionary로 TypeScript/SCSS 생성
+yarn token-build
+# 3. 패키지 빌드
+yarn build
+```
+**참고**: Token 파일을 수정한 후에는 반드시 위 과정을 거쳐 재생성해야 합니다.
+## 타입 정의
+### IconProps
+```typescript
+import type { IconProps } from '@pop-ui/foundation';
+interface IconProps extends SVGProps<SVGSVGElement> {
+  size?: number;
+  color?: string;
+}
+```
+### ColorPalette
+```typescript
+import type { ColorName, ColorShade, ColorPalette } from '@pop-ui/foundation';
+// ColorName: 'gray' | 'aqua' | 'red' | ...
+// ColorShade: '0' | '25' | '50' | '100' | ...
+// ColorPalette: { [colorName: string]: { [shade: string]: string } }
+```
+## 라이선스
+MIT
+## 관련 패키지
+- [@pop-ui/core](https://www.npmjs.com/package/@pop-ui/core) - Pop UI 컴포넌트 라이브러리

package/dist/foundation.js ADDED Viewed

@@ -0,0 +1,388 @@
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import { useState as b } from "react";
+import { Container as m, Stack as y, Box as g, Title as C, Text as d, Group as F, Badge as B, Grid as p, Tooltip as x, Paper as P } from "@mantine/core";
+const L = "#0fd3d8", G = "#11badd", R = "#07a3c6", k = "#11badd", O = "#ffffff", q = "#b0b0b0", Y = "#ffffff", j = "#e7e7e7", M = "#cdcdcd", I = "#e7e7e7", V = "#ffffff", $ = "#4a4a4a", U = "#b0b0b0", X = "#fa5252", J = "#e03131", N = "#c92a2a", K = "#e03131", Q = "#9b9b9b", Z = "#808080", _ = "#666666", oo = "#808080", eo = "#0fd3d8", to = "#11badd", ro = "#07a3c6", no = "#11badd", lo = "#b0b0b0", ao = "#ffffff", io = "#e7e7e7", so = "#cdcdcd", co = "#e7e7e7", fo = "#b0b0b0", uo = "#ffffff", po = "#e7e7e7", yo = "#cdcdcd", go = "#e7e7e7", Co = "#b0b0b0", Bo = "#fa5252", vo = "#e03131", ho = "#c92a2a", bo = "#e03131", mo = "#b0b0b0", Fo = "#9b9b9b", xo = "#808080", Po = "#666666", wo = "#808080", So = "#b0b0b0", zo = "#ffffff", Do = "#ffffff", To = "#ffffff", Wo = "#ffffff", Ho = "#ffffff", Eo = "#0fd3d8", Ao = "#11badd", Lo = "#07a3c6", Go = "#11badd", Ro = "#ffffff", ko = "#4a4a4a", Oo = "#4a4a4a", qo = "#4a4a4a", Yo = "#4a4a4a", jo = "#ffffff", Mo = "#ffffff", Io = "#ffffff", Vo = "#ffffff", $o = "#ffffff", Uo = "#ffffff", Xo = "#ffffff", Jo = "#ffffff", No = "#ffffff", Ko = "#ffffff", Qo = "#ffffff", Zo = "#0fd3d8", _o = "#11badd", oe = "#07a3c6", ee = "#11badd", te = "#b0b0b0", re = "#b0b0b0", ne = "#b0b0b0", le = "#b0b0b0", ae = "#0fd3d8", ie = "#11badd", se = "#07a3c6", ce = "#11badd", fe = "#b0b0b0", ue = "#b0b0b0", de = "#b0b0b0", pe = "#b0b0b0", ye = "#ffffff", ge = "#fbfbfb", Ce = "#f6f6f6", Be = "#e7e7e7", ve = "#d8d8d8", he = "#cdcdcd", be = "#b0b0b0", me = "#9b9b9b", Fe = "#808080", xe = "#666666", Pe = "#4a4a4a", c = "#333333", we = "#000000", Se = "#edfcff", ze = "#d5f8ff", De = "#c8fdff", Te = "#98f4f6", We = "#72eef1", He = "#49e5e9", Ee = "#0fd3d8", Ae = "#11badd", Le = "#07a3c6", Ge = "#00759a", Re = "#006180", ke = "#fef3f2", Oe = "#fee4e2", qe = "#fecdca", Ye = "#fda29b", je = "#ff8a8a", Me = "#fa5252", Ie = "#f03e3e", Ve = "#e03131", $e = "#c92a2a", Ue = "#ab1313", Xe = "#fff4e6", Je = "#ffe8cc", Ne = "#ffd8a8", Ke = "#ffc078", Qe = "#ffa94d", Ze = "#ff922b", _e = "#fd7e14", ot = "#f76707", et = "#e8590c", tt = "#d9480f", rt = "#fbffbf", nt = "#ffff9f", lt = "#fdff78", at = "#fffc33", it = "#fff200", st = "#ffe500", ct = "#fcc419", ft = "#f59f00", ut = "#f08c00", dt = "#e27500", pt = "#efffef", yt = "#d1fcd3", gt = "#a5f8a9", Ct = "#8bed90", Bt = "#6de372", vt = "#30cc37", ht = "#0f8c14", bt = "#027a48", mt = "#05603a", Ft = "#054f31", xt = "#eff8ff", Pt = "#d8f0ff", wt = "#b2ddff", St = "#84caff", zt = "#53b1fd", Dt = "#2e90fa", Tt = "#1570ef", Wt = "#175cd3", Ht = "#1849a9", Et = "#194185", At = "#f3f0ff", Lt = "#e5dbff", Gt = "#d0bfff", Rt = "#b197fc", kt = "#9775fa", Ot = "#845ef7", qt = "#7248ef", Yt = "#5f36da", jt = "#5730cc", Mt = "#4827ab", It = "#f8f0fc", Vt = "#f3d9fa", $t = "#eebefa", Ut = "#e599f7", Xt = "#da77f2", Jt = "#cc5de8", Nt = "#be4bdb", Kt = "#ae3ec9", Qt = "#9c36b5", Zt = "#862e9c", _t = "#0000000a", w = /* @__PURE__ */ JSON.parse('{"color":{"gray":{"0":{"value":"#fff","type":"color"},"25":{"value":"#FBFBFB","type":"color"},"50":{"value":"#F6F6F6","type":"color"},"100":{"value":"#E7E7E7","type":"color"},"200":{"value":"#D8D8D8","type":"color"},"300":{"value":"#CDCDCD","type":"color"},"400":{"value":"#B0B0B0","type":"color"},"500":{"value":"#9B9B9B","type":"color"},"600":{"value":"#808080","type":"color"},"700":{"value":"#666666","type":"color"},"800":{"value":"#4A4A4A","type":"color"},"900":{"value":"#333333","type":"color"},"1000":{"value":"#000","type":"color"}},"aqua":{"50":{"value":"#EDFCFF","type":"color"},"75":{"value":"#D5F8FF","type":"color"},"100":{"value":"#C8FDFF","type":"color"},"200":{"value":"#98F4F6","type":"color"},"300":{"value":"#72EEF1","type":"color"},"400":{"value":"#49E5E9","type":"color"},"500":{"value":"#0fd3d8","type":"color"},"600":{"value":"#11BADD","type":"color"},"700":{"value":"#07A3C6","type":"color"},"800":{"value":"#00759A","type":"color"},"900":{"value":"#006180","type":"color"}},"red":{"50":{"value":"#FEF3F2","type":"color"},"100":{"value":"#FEE4E2","type":"color"},"200":{"value":"#FECDCA","type":"color"},"300":{"value":"#FDA29B","type":"color"},"400":{"value":"#FF8A8A","type":"color"},"500":{"value":"#FA5252","type":"color"},"600":{"value":"#F03E3E","type":"color"},"700":{"value":"#E03131","type":"color"},"800":{"value":"#C92A2A","type":"color"},"900":{"value":"#AB1313","type":"color"}},"orange":{"50":{"value":"#FFF4E6","type":"color"},"100":{"value":"#FFE8CC","type":"color"},"200":{"value":"#FFD8A8","type":"color"},"300":{"value":"#FFC078","type":"color"},"400":{"value":"#FFA94D","type":"color"},"500":{"value":"#FF922B","type":"color"},"600":{"value":"#FD7E14","type":"color"},"700":{"value":"#F76707","type":"color"},"800":{"value":"#E8590C","type":"color"},"900":{"value":"#D9480F","type":"color"}},"yellow":{"50":{"value":"#FBFFBF","type":"color"},"100":{"value":"#FFFF9F","type":"color"},"200":{"value":"#FDFF78","type":"color"},"300":{"value":"#FFFC33","type":"color"},"400":{"value":"#FFF200","type":"color"},"500":{"value":"#FFE500","type":"color"},"600":{"value":"#FCC419","type":"color"},"700":{"value":"#F59F00","type":"color"},"800":{"value":"#F08C00","type":"color"},"900":{"value":"#E27500","type":"color"}},"green":{"50":{"value":"#EFFFEF","type":"color"},"100":{"value":"#D1FCD3","type":"color"},"200":{"value":"#A5F8A9","type":"color"},"300":{"value":"#8BED90","type":"color"},"400":{"value":"#6DE372","type":"color"},"500":{"value":"#30CC37","type":"color"},"600":{"value":"#0F8C14","type":"color"},"700":{"value":"#027A48","type":"color"},"800":{"value":"#05603A","type":"color"},"900":{"value":"#054F31","type":"color"}},"blue":{"50":{"value":"#EFF8FF","type":"color"},"100":{"value":"#D8F0FF","type":"color"},"200":{"value":"#B2DDFF","type":"color"},"300":{"value":"#84CAFF","type":"color"},"400":{"value":"#53B1FD","type":"color"},"500":{"value":"#2E90FA","type":"color"},"600":{"value":"#1570EF","type":"color"},"700":{"value":"#175CD3","type":"color"},"800":{"value":"#1849A9","type":"color"},"900":{"value":"#194185","type":"color"}},"purple":{"50":{"value":"#F3F0FF","type":"color"},"100":{"value":"#E5DBFF","type":"color"},"200":{"value":"#D0BFFF","type":"color"},"300":{"value":"#B197FC","type":"color"},"400":{"value":"#9775FA","type":"color"},"500":{"value":"#845EF7","type":"color"},"600":{"value":"#7248EF","type":"color"},"700":{"value":"#5F36DA","type":"color"},"800":{"value":"#5730CC","type":"color"},"900":{"value":"#4827AB","type":"color"}},"grape":{"50":{"value":"#F8F0FC","type":"color"},"100":{"value":"#F3D9FA","type":"color"},"200":{"value":"#EEBEFA","type":"color"},"300":{"value":"#E599F7","type":"color"},"400":{"value":"#DA77F2","type":"color"},"500":{"value":"#CC5DE8","type":"color"},"600":{"value":"#BE4BDB","type":"color"},"700":{"value":"#AE3EC9","type":"color"},"800":{"value":"#9C36B5","type":"color"},"900":{"value":"#862E9C","type":"color"}}},"web":{"H1-36-bold":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-bold}","lineHeight":"{Lh-300}","fontSize":"{font-size-1100}"},"type":"typography"},"H2-32-bold":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-bold}","lineHeight":"{Lh-300}","fontSize":"{font-size-900}"},"type":"typography"},"H3-28-bold":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-bold}","lineHeight":"{Lh-300}","fontSize":"{font-size-800}"},"type":"typography"},"H4-24-bold":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-bold}","lineHeight":"{Lh-400}","fontSize":"{font-size-700}"},"type":"typography"},"H5-20-bold":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-bold}","lineHeight":"{Lh-400}","fontSize":"{font-size-600}"},"type":"typography"},"T1-16-sb":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-semibold}","lineHeight":"{Lh-500}","fontSize":"{font-size-500}"},"type":"typography"},"T2-14-sb":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-semibold}","lineHeight":"{Lh-500}","fontSize":"{font-size-450}"},"type":"typography"},"T3-12-sb":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-semibold}","lineHeight":"{Lh-500}","fontSize":"{font-size-400}"},"type":"typography"},"B1-18-sb":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-semibold}","lineHeight":"{Lh-500}","fontSize":"{font-size-550}"},"type":"typography"},"B2-18-m":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-medium}","lineHeight":"{Lh-500}","fontSize":"{font-size-550}"},"type":"typography"},"B2-16-sb":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-semibold}","lineHeight":"{Lh-500}","fontSize":"{font-size-500}"},"type":"typography"},"B2-16-m":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-medium}","lineHeight":"{Lh-500}","fontSize":"{font-size-500}"},"type":"typography"},"B3-14-sb":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-semibold}","lineHeight":"{Lh-500}","fontSize":"{font-size-450}"},"type":"typography"},"B3-14-m":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-medium}","lineHeight":"{Lh-500}","fontSize":"{font-size-450}"},"type":"typography"},"C1-12-sb":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-semibold}","lineHeight":"{Lh-500}","fontSize":"{font-size-400}"},"type":"typography"},"C1-12-m":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-medium}","lineHeight":"{Lh-500}","fontSize":"{font-size-400}"},"type":"typography"},"C2-11-m":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-medium}","lineHeight":"{Lh-500}","fontSize":"{font-size-375}"},"type":"typography"}},"spacing-100":{"value":"4","type":"spacing"},"spacing-150":{"value":"6","type":"spacing"},"spacing-200":{"value":"8","type":"spacing"},"spacing-300":{"value":"12","type":"spacing"},"spacing-400":{"value":"16","type":"spacing"},"spacing-500":{"value":"20","type":"spacing"},"spacing-600":{"value":"24","type":"spacing"},"spacing-700":{"value":"28","type":"spacing"},"spacing-800":{"value":"32","type":"spacing"},"spacing-900":{"value":"36","type":"spacing"},"spacing-1000":{"value":"40","type":"spacing"},"spacing-1100":{"value":"44","type":"spacing"},"spacing-1200":{"value":"48","type":"spacing"},"spacing-1300":{"value":"52","type":"spacing"},"spacing-1400":{"value":"56","type":"spacing"},"spacing-1500":{"value":"60","type":"spacing"},"font-family-Pretendard":{"value":"Pretendard","type":"fontFamilies"},"font-weight-thin":{"value":"Thin","type":"fontWeights"},"font-weight-extralight":{"value":"ExtraLight","type":"fontWeights"},"font-weight-light":{"value":"Light","type":"fontWeights"},"font-weight-regular":{"value":"Regular","type":"fontWeights"},"font-weight-medium":{"value":"Medium","type":"fontWeights"},"font-weight-semibold":{"value":"SemiBold","type":"fontWeights"},"font-weight-extrabold":{"value":"ExtraBold","type":"fontWeights"},"font-weight-bold":{"value":"Bold","type":"fontWeights"},"font-weight-black":{"value":"Black","type":"fontWeights"},"Lh-500":{"value":"150%","type":"lineHeights"},"Lh-400":{"value":"140%","type":"lineHeights"},"Lh-300":{"value":"130%","type":"lineHeights"},"border-radius-0":{"value":"0px","type":"borderRadius"},"border-radius-50":{"value":"2px","type":"borderRadius"},"border-radius-100":{"value":"4px","type":"borderRadius"},"border-radius-150":{"value":"6px","type":"borderRadius"},"border-radius-200":{"value":"8px","type":"borderRadius"},"border-radius-300":{"value":"12px","type":"borderRadius"},"border-radius-400":{"value":"16px","type":"borderRadius"},"border-radius-500":{"value":"20px","type":"borderRadius"},"border-width-25":{"value":"1","type":"borderWidth"},"border-width-37":{"value":"1.5","type":"borderWidth"},"border-width-50":{"value":"2","type":"borderWidth"},"border-width-100":{"value":"4","type":"borderWidth"},"border-width-200":{"value":"8","type":"borderWidth"},"font-size-375":{"value":"11","type":"fontSizes"},"font-size-400":{"value":"12","type":"fontSizes"},"font-size-450":{"value":"14","type":"fontSizes"},"font-size-500":{"value":"16","type":"fontSizes"},"font-size-550":{"value":"18","type":"fontSizes"},"font-size-600":{"value":"20","type":"fontSizes"},"font-size-700":{"value":"24","type":"fontSizes"},"font-size-800":{"value":"28","type":"fontSizes"},"font-size-900":{"value":"32","type":"fontSizes"},"font-size-1000":{"value":"36","type":"fontSizes"},"font-size-1100":{"value":"40","type":"fontSizes"},"shadow-dashboard-card":{"value":{"x":"0","y":"8","blur":"32px","spread":"0","color":"rgba(0,0,0,0.04)","type":"dropShadow"},"type":"boxShadow"},"text-deco-underline":{"value":"underline","type":"textDecoration"},"text-deco-line-through":{"value":"line-through","type":"textDecoration"},"border-radius-1000":{"value":"9999px","type":"borderRadius"},"button":{"size-button-large":{"value":"50px","type":"sizing"},"size-button-medium":{"value":"40px","type":"sizing"},"size-button-small":{"value":"30px","type":"sizing"},"typo-button-large":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-bold}","lineHeight":"{Lh-300}","fontSize":"{font-size-550}"},"type":"typography","description":"large button 폰트 속성"},"typo-button-medium":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-semibold}","lineHeight":"{Lh-300}","fontSize":"{font-size-500}"},"type":"typography","description":"medium button 폰트 속성"},"typo-button-small":{"value":{"fontFamily":"{font-family-Pretendard}","fontWeight":"{font-weight-semibold}","lineHeight":"{Lh-300}","fontSize":"{font-size-450}"},"type":"typography","description":"small button 폰트 속성"},"border-radius-large":{"value":"{border-radius-150}","type":"borderRadius"},"border-radius-medium":{"value":"{border-radius-150}","type":"borderRadius"},"border-radius-small":{"value":"{border-radius-100}","type":"borderRadius"},"spacing-button-large":{"value":"{spacing-500}","type":"spacing"},"spacing-button-medium":{"value":"{spacing-400}","type":"spacing"},"spacing-button-small":{"value":"{spacing-300}","type":"spacing"},"spacing-button-large-icon":{"value":"{spacing-200}","type":"spacing"},"spacing-button-medium-icon":{"value":"{spacing-150}","type":"spacing"},"spacing-button-small-icon":{"value":"{spacing-100}","type":"spacing"},"spacing-button-large-icon-only":{"value":"{spacing-400}","type":"spacing"},"spacing-button-medium-icon-only":{"value":"{spacing-300}","type":"spacing"},"spacing-button-small-icon-only":{"value":"{spacing-200}","type":"spacing"}}}'), S = {
+  global: w
+}, z = S.global.color, f = Object.entries(z).reduce(
+  (o, [t, r]) => (o[t] = Object.entries(r).reduce(
+    (n, [l, u]) => (n[l] = u.value, n),
+    {}
+  ), o),
+  {}
+), D = Object.keys(f), or = (o) => f[o], er = (o, t) => f[o]?.[t], v = (o, t) => `--color-${o}-${t}`, tr = (o, t) => `var(${v(o, t)})`, T = ({ colorName: o, shade: t, value: r }) => {
+  const [n, l] = b(!1), u = v(o, t), h = async () => {
+    try {
+      await navigator.clipboard.writeText(r), l(!0), setTimeout(() => l(!1), 2e3);
+    } catch (a) {
+      console.error("Failed to copy:", a);
+    }
+  }, s = parseInt(r.replace("#", ""), 16) > 16777215 / 2;
+  return /* @__PURE__ */ e(
+    x,
+    {
+      label: n ? "Copied!" : "Click to copy HEX",
+      position: "top",
+      withArrow: !0,
+      children: /* @__PURE__ */ e(
+        P,
+        {
+          p: "md",
+          style: {
+            backgroundColor: r,
+            cursor: "pointer",
+            border: "1px solid #e0e0e0",
+            minHeight: "120px",
+            transition: "transform 0.2s, box-shadow 0.2s"
+          },
+          onClick: h,
+          onMouseEnter: (a) => {
+            a.currentTarget.style.transform = "translateY(-2px)", a.currentTarget.style.boxShadow = "0 4px 12px rgba(0,0,0,0.15)";
+          },
+          onMouseLeave: (a) => {
+            a.currentTarget.style.transform = "translateY(0)", a.currentTarget.style.boxShadow = "none";
+          },
+          children: /* @__PURE__ */ i(y, { gap: "xs", children: [
+            /* @__PURE__ */ e(
+              B,
+              {
+                size: "sm",
+                variant: "filled",
+                style: {
+                  backgroundColor: s ? "#333" : "#fff",
+                  color: s ? "#fff" : "#333"
+                },
+                children: t
+              }
+            ),
+            /* @__PURE__ */ e(
+              d,
+              {
+                size: "xs",
+                fw: 600,
+                style: { color: s ? "#333" : "#fff" },
+                children: r.toUpperCase()
+              }
+            ),
+            /* @__PURE__ */ e(
+              d,
+              {
+                size: "xs",
+                style: { color: s ? "#666" : "#ccc", fontFamily: "monospace" },
+                children: u
+              }
+            )
+          ] })
+        }
+      )
+    }
+  );
+}, W = ({ colorName: o }) => {
+  const t = f[o], r = Object.entries(t);
+  return /* @__PURE__ */ i(g, { mb: "xl", children: [
+    /* @__PURE__ */ i(F, { mb: "md", align: "center", children: [
+      /* @__PURE__ */ e(C, { order: 3, tt: "capitalize", children: o }),
+      /* @__PURE__ */ i(B, { variant: "light", children: [
+        r.length,
+        " shades"
+      ] })
+    ] }),
+    /* @__PURE__ */ e(p, { gutter: "md", children: r.map(([n, l]) => /* @__PURE__ */ e(p.Col, { span: { base: 12, xs: 6, sm: 4, md: 3, lg: 2 }, children: /* @__PURE__ */ e(T, { colorName: o, shade: n, value: l }) }, n)) })
+  ] });
+}, rr = () => /* @__PURE__ */ e(m, { size: "xl", py: "xl", children: /* @__PURE__ */ i(y, { gap: "xl", children: [
+  /* @__PURE__ */ i(g, { children: [
+    /* @__PURE__ */ e(C, { order: 1, mb: "xs", children: "Color Palette" }),
+    /* @__PURE__ */ e(d, { c: "dimmed", size: "sm", children: "Click on any color chip to copy its HEX code" })
+  ] }),
+  D.map((o) => /* @__PURE__ */ e(W, { colorName: o }, o))
+] }) }), nr = ({
+  size: o = 24,
+  color: t = c,
+  ...r
+}) => /* @__PURE__ */ e(
+  "svg",
+  {
+    width: o,
+    height: o,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...r,
+    children: /* @__PURE__ */ e(
+      "path",
+      {
+        d: "M18 9L12 15L6 9",
+        stroke: t,
+        strokeWidth: "1.5",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    )
+  }
+), lr = ({
+  size: o = 24,
+  color: t = c,
+  ...r
+}) => /* @__PURE__ */ e(
+  "svg",
+  {
+    width: o,
+    height: o,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...r,
+    children: /* @__PURE__ */ e(
+      "path",
+      {
+        d: "M18 15L12 9L6 15",
+        stroke: t,
+        strokeWidth: "1.5",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    )
+  }
+), ar = ({
+  size: o = 8,
+  color: t = c,
+  ...r
+}) => {
+  const n = o, l = o * 1.75;
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      width: n,
+      height: l,
+      viewBox: "0 0 8 14",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...r,
+      children: /* @__PURE__ */ e(
+        "path",
+        {
+          d: "M7 1L1 7L7 13",
+          stroke: t
+        }
+      )
+    }
+  );
+}, ir = ({
+  size: o = 8,
+  color: t = c,
+  ...r
+}) => {
+  const n = o, l = o * 1.75;
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      width: n,
+      height: l,
+      viewBox: "0 0 8 14",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...r,
+      children: /* @__PURE__ */ e(
+        "path",
+        {
+          d: "M1 1L7 7L1 13",
+          stroke: t
+        }
+      )
+    }
+  );
+};
+export {
+  uo as BgColorButtonBgBasicDefault,
+  Co as BgColorButtonBgBasicDisabled,
+  go as BgColorButtonBgBasicFocused,
+  po as BgColorButtonBgBasicHover,
+  yo as BgColorButtonBgBasicPreseed,
+  eo as BgColorButtonBgPrimaryDefault,
+  lo as BgColorButtonBgPrimaryDisabled,
+  no as BgColorButtonBgPrimaryFocused,
+  to as BgColorButtonBgPrimaryHover,
+  ro as BgColorButtonBgPrimaryPressed,
+  ao as BgColorButtonBgPrimarylineDefault,
+  fo as BgColorButtonBgPrimarylineDisabled,
+  co as BgColorButtonBgPrimarylineFocused,
+  io as BgColorButtonBgPrimarylineHover,
+  so as BgColorButtonBgPrimarylinePressed,
+  Fo as BgColorButtonBgSettingDefault,
+  So as BgColorButtonBgSettingDisabled,
+  wo as BgColorButtonBgSettingFocused,
+  xo as BgColorButtonBgSettingHover,
+  Po as BgColorButtonBgSettingPressed,
+  Bo as BgColorButtonBgWarningDefault,
+  mo as BgColorButtonBgWarningDisabled,
+  bo as BgColorButtonBgWarningFocused,
+  vo as BgColorButtonBgWarningHover,
+  ho as BgColorButtonBgWarningPressed,
+  te as BorderColorButtonBorderBasicDefault,
+  le as BorderColorButtonBorderBasicFocused,
+  re as BorderColorButtonBorderBasicHover,
+  ne as BorderColorButtonBorderBasicPressed,
+  Zo as BorderColorButtonBorderPrimarylineDefault,
+  ee as BorderColorButtonBorderPrimarylineFocused,
+  _o as BorderColorButtonBorderPrimarylineHover,
+  oe as BorderColorButtonBorderPrimarylinePressed,
+  fe as ButtonBorderButtonBasicDefaultColor,
+  pe as ButtonBorderButtonBasicFocusedColor,
+  ue as ButtonBorderButtonBasicHoverColor,
+  de as ButtonBorderButtonBasicPressedColor,
+  ae as ButtonBorderButtonPrimarylineDefaultColor,
+  ce as ButtonBorderButtonPrimarylineFocusedColor,
+  ie as ButtonBorderButtonPrimarylineHoverColor,
+  se as ButtonBorderButtonPrimarylinePressedColor,
+  De as ColorAqua100,
+  Te as ColorAqua200,
+  We as ColorAqua300,
+  He as ColorAqua400,
+  Se as ColorAqua50,
+  Ee as ColorAqua500,
+  Ae as ColorAqua600,
+  Le as ColorAqua700,
+  ze as ColorAqua75,
+  Ge as ColorAqua800,
+  Re as ColorAqua900,
+  Pt as ColorBlue100,
+  wt as ColorBlue200,
+  St as ColorBlue300,
+  zt as ColorBlue400,
+  xt as ColorBlue50,
+  Dt as ColorBlue500,
+  Tt as ColorBlue600,
+  Wt as ColorBlue700,
+  Ht as ColorBlue800,
+  Et as ColorBlue900,
+  Vt as ColorGrape100,
+  $t as ColorGrape200,
+  Ut as ColorGrape300,
+  Xt as ColorGrape400,
+  It as ColorGrape50,
+  Jt as ColorGrape500,
+  Nt as ColorGrape600,
+  Kt as ColorGrape700,
+  Qt as ColorGrape800,
+  Zt as ColorGrape900,
+  ye as ColorGray0,
+  Be as ColorGray100,
+  we as ColorGray1000,
+  ve as ColorGray200,
+  ge as ColorGray25,
+  he as ColorGray300,
+  be as ColorGray400,
+  Ce as ColorGray50,
+  me as ColorGray500,
+  Fe as ColorGray600,
+  xe as ColorGray700,
+  Pe as ColorGray800,
+  c as ColorGray900,
+  yt as ColorGreen100,
+  gt as ColorGreen200,
+  Ct as ColorGreen300,
+  Bt as ColorGreen400,
+  pt as ColorGreen50,
+  vt as ColorGreen500,
+  ht as ColorGreen600,
+  bt as ColorGreen700,
+  mt as ColorGreen800,
+  Ft as ColorGreen900,
+  Je as ColorOrange100,
+  Ne as ColorOrange200,
+  Ke as ColorOrange300,
+  Qe as ColorOrange400,
+  Xe as ColorOrange50,
+  Ze as ColorOrange500,
+  _e as ColorOrange600,
+  ot as ColorOrange700,
+  et as ColorOrange800,
+  tt as ColorOrange900,
+  rr as ColorPalette,
+  Lt as ColorPurple100,
+  Gt as ColorPurple200,
+  Rt as ColorPurple300,
+  kt as ColorPurple400,
+  At as ColorPurple50,
+  Ot as ColorPurple500,
+  qt as ColorPurple600,
+  Yt as ColorPurple700,
+  jt as ColorPurple800,
+  Mt as ColorPurple900,
+  Oe as ColorRed100,
+  qe as ColorRed200,
+  Ye as ColorRed300,
+  je as ColorRed400,
+  ke as ColorRed50,
+  Me as ColorRed500,
+  Ie as ColorRed600,
+  Ve as ColorRed700,
+  $e as ColorRed800,
+  Ue as ColorRed900,
+  nt as ColorYellow100,
+  lt as ColorYellow200,
+  at as ColorYellow300,
+  it as ColorYellow400,
+  rt as ColorYellow50,
+  st as ColorYellow500,
+  ct as ColorYellow600,
+  ft as ColorYellow700,
+  ut as ColorYellow800,
+  dt as ColorYellow900,
+  nr as IcChevronDown,
+  ar as IcChevronLeft,
+  ir as IcChevronRight,
+  lr as IcChevronUp,
+  q as SemanticColorBgDisabled,
+  Y as SemanticColorBgWhite,
+  I as SemanticColorBgWhiteFocused,
+  j as SemanticColorBgWhiteHover,
+  M as SemanticColorBgWhitePressed,
+  U as SemanticColorBorderLightgray01,
+  L as SemanticColorPrimary,
+  k as SemanticColorPrimaryFocused,
+  G as SemanticColorPrimaryHover,
+  R as SemanticColorPrimaryPressed,
+  Q as SemanticColorSetting,
+  oo as SemanticColorSettingFocused,
+  Z as SemanticColorSettingHover,
+  _ as SemanticColorSettingPressed,
+  $ as SemanticColorTextDarkgray03,
+  V as SemanticColorTextDisabled,
+  O as SemanticColorTextWhite,
+  X as SemanticColorWarning,
+  K as SemanticColorWarningFocused,
+  J as SemanticColorWarningHover,
+  N as SemanticColorWarningPressed,
+  _t as ShadowDashboardCardColor,
+  ko as TextColorButtonTextBasicDefault,
+  jo as TextColorButtonTextBasicDisabled,
+  Yo as TextColorButtonTextBasicFocused,
+  Oo as TextColorButtonTextBasicHover,
+  qo as TextColorButtonTextBasicPressed,
+  zo as TextColorButtonTextPrimaryDefault,
+  Ho as TextColorButtonTextPrimaryDisabled,
+  Wo as TextColorButtonTextPrimaryFocused,
+  Do as TextColorButtonTextPrimaryHover,
+  To as TextColorButtonTextPrimaryPressed,
+  Eo as TextColorButtonTextPrimarylineDefault,
+  Ro as TextColorButtonTextPrimarylineDisabled,
+  Go as TextColorButtonTextPrimarylineFocused,
+  Ao as TextColorButtonTextPrimarylineHover,
+  Lo as TextColorButtonTextPrimarylinePressed,
+  Xo as TextColorButtonTextSettingDefault,
+  Qo as TextColorButtonTextSettingDisabled,
+  Ko as TextColorButtonTextSettingFocused,
+  Jo as TextColorButtonTextSettingHover,
+  No as TextColorButtonTextSettingPressed,
+  Mo as TextColorButtonTextWarningDefault,
+  Uo as TextColorButtonTextWarningDisabled,
+  $o as TextColorButtonTextWarningFocused,
+  Io as TextColorButtonTextWarningHover,
+  Vo as TextColorButtonTextWarningPressed,
+  D as colorNames,
+  f as colors,
+  v as getCSSVariableName,
+  tr as getCSSVariableRef,
+  or as getColorShades,
+  er as getColorValue
+};

package/dist/foundation.umd.cjs ADDED Viewed

@@ -0,0 +1 @@

package/dist/types/index.d.ts ADDED Viewed

@@ -0,0 +1,416 @@
+import { default as default_2 } from 'react';
+import { SVGProps } from 'react';
+export declare const BgColorButtonBgBasicDefault = "#ffffff";
+export declare const BgColorButtonBgBasicDisabled = "#b0b0b0";
+export declare const BgColorButtonBgBasicFocused = "#e7e7e7";
+export declare const BgColorButtonBgBasicHover = "#e7e7e7";
+export declare const BgColorButtonBgBasicPreseed = "#cdcdcd";
+export declare const BgColorButtonBgPrimaryDefault = "#0fd3d8";
+export declare const BgColorButtonBgPrimaryDisabled = "#b0b0b0";
+export declare const BgColorButtonBgPrimaryFocused = "#11badd";
+export declare const BgColorButtonBgPrimaryHover = "#11badd";
+export declare const BgColorButtonBgPrimarylineDefault = "#ffffff";
+export declare const BgColorButtonBgPrimarylineDisabled = "#b0b0b0";
+export declare const BgColorButtonBgPrimarylineFocused = "#e7e7e7";
+export declare const BgColorButtonBgPrimarylineHover = "#e7e7e7";
+export declare const BgColorButtonBgPrimarylinePressed = "#cdcdcd";
+export declare const BgColorButtonBgPrimaryPressed = "#07a3c6";
+export declare const BgColorButtonBgSettingDefault = "#9b9b9b";
+export declare const BgColorButtonBgSettingDisabled = "#b0b0b0";
+export declare const BgColorButtonBgSettingFocused = "#808080";
+export declare const BgColorButtonBgSettingHover = "#808080";
+export declare const BgColorButtonBgSettingPressed = "#666666";
+export declare const BgColorButtonBgWarningDefault = "#fa5252";
+export declare const BgColorButtonBgWarningDisabled = "#b0b0b0";
+export declare const BgColorButtonBgWarningFocused = "#e03131";
+export declare const BgColorButtonBgWarningHover = "#e03131";
+export declare const BgColorButtonBgWarningPressed = "#c92a2a";
+export declare const BorderColorButtonBorderBasicDefault = "#b0b0b0";
+export declare const BorderColorButtonBorderBasicFocused = "#b0b0b0";
+export declare const BorderColorButtonBorderBasicHover = "#b0b0b0";
+export declare const BorderColorButtonBorderBasicPressed = "#b0b0b0";
+export declare const BorderColorButtonBorderPrimarylineDefault = "#0fd3d8";
+export declare const BorderColorButtonBorderPrimarylineFocused = "#11badd";
+export declare const BorderColorButtonBorderPrimarylineHover = "#11badd";
+export declare const BorderColorButtonBorderPrimarylinePressed = "#07a3c6";
+export declare const ButtonBorderButtonBasicDefaultColor = "#b0b0b0";
+export declare const ButtonBorderButtonBasicFocusedColor = "#b0b0b0";
+export declare const ButtonBorderButtonBasicHoverColor = "#b0b0b0";
+export declare const ButtonBorderButtonBasicPressedColor = "#b0b0b0";
+export declare const ButtonBorderButtonPrimarylineDefaultColor = "#0fd3d8";
+export declare const ButtonBorderButtonPrimarylineFocusedColor = "#11badd";
+export declare const ButtonBorderButtonPrimarylineHoverColor = "#11badd";
+export declare const ButtonBorderButtonPrimarylinePressedColor = "#07a3c6";
+export declare const ColorAqua100 = "#c8fdff";
+export declare const ColorAqua200 = "#98f4f6";
+export declare const ColorAqua300 = "#72eef1";
+export declare const ColorAqua400 = "#49e5e9";
+export declare const ColorAqua50 = "#edfcff";
+export declare const ColorAqua500 = "#0fd3d8";
+export declare const ColorAqua600 = "#11badd";
+export declare const ColorAqua700 = "#07a3c6";
+export declare const ColorAqua75 = "#d5f8ff";
+export declare const ColorAqua800 = "#00759a";
+export declare const ColorAqua900 = "#006180";
+export declare const ColorBlue100 = "#d8f0ff";
+export declare const ColorBlue200 = "#b2ddff";
+export declare const ColorBlue300 = "#84caff";
+export declare const ColorBlue400 = "#53b1fd";
+export declare const ColorBlue50 = "#eff8ff";
+export declare const ColorBlue500 = "#2e90fa";
+export declare const ColorBlue600 = "#1570ef";
+export declare const ColorBlue700 = "#175cd3";
+export declare const ColorBlue800 = "#1849a9";
+export declare const ColorBlue900 = "#194185";
+export declare const ColorGrape100 = "#f3d9fa";
+export declare const ColorGrape200 = "#eebefa";
+export declare const ColorGrape300 = "#e599f7";
+export declare const ColorGrape400 = "#da77f2";
+export declare const ColorGrape50 = "#f8f0fc";
+export declare const ColorGrape500 = "#cc5de8";
+export declare const ColorGrape600 = "#be4bdb";
+export declare const ColorGrape700 = "#ae3ec9";
+export declare const ColorGrape800 = "#9c36b5";
+export declare const ColorGrape900 = "#862e9c";
+export declare const ColorGray0 = "#ffffff";
+export declare const ColorGray100 = "#e7e7e7";
+export declare const ColorGray1000 = "#000000";
+export declare const ColorGray200 = "#d8d8d8";
+export declare const ColorGray25 = "#fbfbfb";
+export declare const ColorGray300 = "#cdcdcd";
+export declare const ColorGray400 = "#b0b0b0";
+export declare const ColorGray50 = "#f6f6f6";
+export declare const ColorGray500 = "#9b9b9b";
+export declare const ColorGray600 = "#808080";
+export declare const ColorGray700 = "#666666";
+export declare const ColorGray800 = "#4a4a4a";
+export declare const ColorGray900 = "#333333";
+export declare const ColorGreen100 = "#d1fcd3";
+export declare const ColorGreen200 = "#a5f8a9";
+export declare const ColorGreen300 = "#8bed90";
+export declare const ColorGreen400 = "#6de372";
+export declare const ColorGreen50 = "#efffef";
+export declare const ColorGreen500 = "#30cc37";
+export declare const ColorGreen600 = "#0f8c14";
+export declare const ColorGreen700 = "#027a48";
+export declare const ColorGreen800 = "#05603a";
+export declare const ColorGreen900 = "#054f31";
+export declare type ColorName = keyof typeof colors;
+export declare const colorNames: ColorName[];
+export declare const ColorOrange100 = "#ffe8cc";
+export declare const ColorOrange200 = "#ffd8a8";
+export declare const ColorOrange300 = "#ffc078";
+export declare const ColorOrange400 = "#ffa94d";
+export declare const ColorOrange50 = "#fff4e6";
+export declare const ColorOrange500 = "#ff922b";
+export declare const ColorOrange600 = "#fd7e14";
+export declare const ColorOrange700 = "#f76707";
+export declare const ColorOrange800 = "#e8590c";
+export declare const ColorOrange900 = "#d9480f";
+export declare const ColorPalette: default_2.FC;
+export declare interface ColorPaletteType {
+    [colorName: string]: ColorShades;
+}
+export declare const ColorPurple100 = "#e5dbff";
+export declare const ColorPurple200 = "#d0bfff";
+export declare const ColorPurple300 = "#b197fc";
+export declare const ColorPurple400 = "#9775fa";
+export declare const ColorPurple50 = "#f3f0ff";
+export declare const ColorPurple500 = "#845ef7";
+export declare const ColorPurple600 = "#7248ef";
+export declare const ColorPurple700 = "#5f36da";
+export declare const ColorPurple800 = "#5730cc";
+export declare const ColorPurple900 = "#4827ab";
+export declare const ColorRed100 = "#fee4e2";
+export declare const ColorRed200 = "#fecdca";
+export declare const ColorRed300 = "#fda29b";
+export declare const ColorRed400 = "#ff8a8a";
+export declare const ColorRed50 = "#fef3f2";
+export declare const ColorRed500 = "#fa5252";
+export declare const ColorRed600 = "#f03e3e";
+export declare const ColorRed700 = "#e03131";
+export declare const ColorRed800 = "#c92a2a";
+export declare const ColorRed900 = "#ab1313";
+export declare const colors: ColorPaletteType;
+export declare type ColorShade<T extends ColorName> = keyof typeof colors[T];
+/**
+ * Design System Color Tokens
+ *
+ * token.json에서 추출된 색상 팔레트
+ * 모든 색상은 global.color에서 정의됩니다.
+ */
+export declare interface ColorShades {
+    [shade: string]: string;
+}
+export declare const ColorYellow100 = "#ffff9f";
+export declare const ColorYellow200 = "#fdff78";
+export declare const ColorYellow300 = "#fffc33";
+export declare const ColorYellow400 = "#fff200";
+export declare const ColorYellow50 = "#fbffbf";
+export declare const ColorYellow500 = "#ffe500";
+export declare const ColorYellow600 = "#fcc419";
+export declare const ColorYellow700 = "#f59f00";
+export declare const ColorYellow800 = "#f08c00";
+export declare const ColorYellow900 = "#e27500";
+export declare const getColorShades: (colorName: ColorName) => ColorShades;
+export declare const getColorValue: (colorName: ColorName, shade: string) => string | undefined;
+export declare const getCSSVariableName: (colorName: string, shade: string) => string;
+export declare const getCSSVariableRef: (colorName: string, shade: string) => string;
+export declare const IcChevronDown: default_2.FC<IconProps>;
+export declare const IcChevronLeft: default_2.FC<IconProps>;
+export declare const IcChevronRight: default_2.FC<IconProps>;
+export declare const IcChevronUp: default_2.FC<IconProps>;
+export declare interface IconProps extends SVGProps<SVGSVGElement> {
+    size?: number;
+    color?: string;
+}
+export declare const SemanticColorBgDisabled = "#b0b0b0";
+export declare const SemanticColorBgWhite = "#ffffff";
+export declare const SemanticColorBgWhiteFocused = "#e7e7e7";
+export declare const SemanticColorBgWhiteHover = "#e7e7e7";
+export declare const SemanticColorBgWhitePressed = "#cdcdcd";
+export declare const SemanticColorBorderLightgray01 = "#b0b0b0";
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+export declare const SemanticColorPrimary = "#0fd3d8";
+export declare const SemanticColorPrimaryFocused = "#11badd";
+export declare const SemanticColorPrimaryHover = "#11badd";
+export declare const SemanticColorPrimaryPressed = "#07a3c6";
+export declare const SemanticColorSetting = "#9b9b9b";
+export declare const SemanticColorSettingFocused = "#808080";
+export declare const SemanticColorSettingHover = "#808080";
+export declare const SemanticColorSettingPressed = "#666666";
+export declare const SemanticColorTextDarkgray03 = "#4a4a4a";
+export declare const SemanticColorTextDisabled = "#ffffff";
+export declare const SemanticColorTextWhite = "#ffffff";
+export declare const SemanticColorWarning = "#fa5252";
+export declare const SemanticColorWarningFocused = "#e03131";
+export declare const SemanticColorWarningHover = "#e03131";
+export declare const SemanticColorWarningPressed = "#c92a2a";
+export declare const ShadowDashboardCardColor = "#0000000a";
+export declare const TextColorButtonTextBasicDefault = "#4a4a4a";
+export declare const TextColorButtonTextBasicDisabled = "#ffffff";
+export declare const TextColorButtonTextBasicFocused = "#4a4a4a";
+export declare const TextColorButtonTextBasicHover = "#4a4a4a";
+export declare const TextColorButtonTextBasicPressed = "#4a4a4a";
+export declare const TextColorButtonTextPrimaryDefault = "#ffffff";
+export declare const TextColorButtonTextPrimaryDisabled = "#ffffff";
+export declare const TextColorButtonTextPrimaryFocused = "#ffffff";
+export declare const TextColorButtonTextPrimaryHover = "#ffffff";
+export declare const TextColorButtonTextPrimarylineDefault = "#0fd3d8";
+export declare const TextColorButtonTextPrimarylineDisabled = "#ffffff";
+export declare const TextColorButtonTextPrimarylineFocused = "#11badd";
+export declare const TextColorButtonTextPrimarylineHover = "#11badd";
+export declare const TextColorButtonTextPrimarylinePressed = "#07a3c6";
+export declare const TextColorButtonTextPrimaryPressed = "#ffffff";
+export declare const TextColorButtonTextSettingDefault = "#ffffff";
+export declare const TextColorButtonTextSettingDisabled = "#ffffff";
+export declare const TextColorButtonTextSettingFocused = "#ffffff";
+export declare const TextColorButtonTextSettingHover = "#ffffff";
+export declare const TextColorButtonTextSettingPressed = "#ffffff";
+export declare const TextColorButtonTextWarningDefault = "#ffffff";
+export declare const TextColorButtonTextWarningDisabled = "#ffffff";
+export declare const TextColorButtonTextWarningFocused = "#ffffff";
+export declare const TextColorButtonTextWarningHover = "#ffffff";
+export declare const TextColorButtonTextWarningPressed = "#ffffff";
+export { }

package/package.json ADDED Viewed

@@ -0,0 +1,54 @@
+{
+  "name": "@pop-ui/foundation",
+  "type": "module",
+  "version": "0.0.22",
+  "main": "./dist/foundation.umd.cjs",
+  "module": "./dist/foundation.js",
+  "types": "./dist/types/index.d.ts",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/types/index.d.ts",
+        "default": "./dist/foundation.js"
+      },
+      "require": {
+        "types": "./dist/types/index.d.ts",
+        "default": "./dist/foundation.umd.cjs"
+      }
+    }
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/datepop/pop-ui"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "typecheck": "tsc",
+    "token-transform": "token-transformer token.json transformed-token.json --expandTypography --expandShadow --expandCompotision --expandBorder",
+    "token-build": "style-dictionary build --config config.json"
+  },
+  "peerDependencies": {
+    "react": "^19.2.0"
+  },
+  "devDependencies": {
+    "@types/node": "^24.9.2",
+    "@types/react": "^19.2.2",
+    "@vitejs/plugin-react": "^5.1.0",
+    "react": "^19.2.0",
+    "style-dictionary": "^5.1.1",
+    "token-transformer": "^0.0.33",
+    "typescript": "^5.9.3",
+    "vite": "^7.1.12",
+    "vite-plugin-dts": "^4.5.4"
+  },
+  "gitHead": "99cfafa92cd9692fa808fe05c26510197013aa69"
+}