@eeennsu/web 0.2.0 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/button.d.ts.map +1 -1
- package/dist/button.js +8 -2
- package/dist/button.js.map +1 -1
- package/dist/chip.d.ts +13 -0
- package/dist/chip.d.ts.map +1 -0
- package/dist/chip.js +19 -0
- package/dist/chip.js.map +1 -0
- package/dist/dialog.js +2 -2
- package/dist/dialog.js.map +1 -1
- package/dist/drawer.js +2 -2
- package/dist/drawer.js.map +1 -1
- package/dist/icon.d.ts +12 -5
- package/dist/icon.d.ts.map +1 -1
- package/dist/icon.js +27 -6
- package/dist/icon.js.map +1 -1
- package/dist/index.d.ts +19 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +5 -1
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/button.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../src/button.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAwB,MAAM,iBAAiB,CAAC;AACvE,OAAO,KAAK,EAAE,EAAE,EAAO,MAAM,OAAO,CAAC;AAIrC,KAAK,WAAW,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../src/button.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAwB,MAAM,iBAAiB,CAAC;AACvE,OAAO,KAAK,EAAE,EAAE,EAAO,MAAM,OAAO,CAAC;AAIrC,KAAK,WAAW,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,CAAC;AAwB9C;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,MAAM,EAAE,EAAE,CAAC,WAAW,CAmClC,CAAC"}
|
package/dist/button.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { Button as BaseButton } from "@base-ui/react/button";
|
|
4
4
|
import { cn } from "./cn.js";
|
|
5
|
-
import {
|
|
5
|
+
import { Glyph } from "./icon.js";
|
|
6
6
|
/** variant → semantic 색 매핑(§4.2). ghost 만 배경이 없다. */
|
|
7
7
|
const variants = {
|
|
8
8
|
primary: "bg-brand text-fg-on-brand hover:bg-brand-hover",
|
|
@@ -10,6 +10,12 @@ const variants = {
|
|
|
10
10
|
ghost: "text-fg hover:bg-surface-hover",
|
|
11
11
|
danger: "bg-danger text-fg-on-danger hover:bg-danger-hover",
|
|
12
12
|
};
|
|
13
|
+
/**
|
|
14
|
+
* 누르는 동안의 표시(N-17). 색이 아니라 투명도라 소비자가 `bg-*` 로 배경을 바꿔도 따라간다 —
|
|
15
|
+
* `active:bg-brand-hover` 였다면 `className="bg-danger"` 버튼이 누를 때만 파래진다(알려진 동작 4).
|
|
16
|
+
* RN 에는 hover 가 없어 이것이 유일한 눌림 표시이고, 웹도 같은 클래스를 가져 어휘가 같다(AC-25).
|
|
17
|
+
*/
|
|
18
|
+
const pressed = "active:opacity-80";
|
|
13
19
|
/** 높이는 고정 `h-*` 없이 `py + text + 투명 테두리` 로 만든다 — 30 / 42 / 54 (plan D-6). */
|
|
14
20
|
const sizes = {
|
|
15
21
|
sm: "px-3 py-1 text-sm rounded-md gap-1",
|
|
@@ -34,6 +40,6 @@ export const Button = ({ label, variant = "primary", size = "md", icon, loading
|
|
|
34
40
|
return (_jsxs(BaseButton, { ref: ref, type: "button", disabled: inactive,
|
|
35
41
|
// 계약은 `() => void` 다. 그대로 넘기면 이벤트 객체가 새어 나가
|
|
36
42
|
// `onClick={setOpen}` 같은 코드가 이벤트를 상태로 넣는다.
|
|
37
|
-
onClick: onClick && (() => onClick()), className: cn("inline-flex items-center justify-center border border-transparent", "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-border-focus", variants[variant], sizes[size], inactive && "opacity-50 pointer-events-none", className), children: [loading ? _jsx(
|
|
43
|
+
onClick: onClick && (() => onClick()), className: cn("inline-flex items-center justify-center border border-transparent", "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-border-focus", variants[variant], pressed, sizes[size], inactive && "opacity-50 pointer-events-none", className), children: [loading ? _jsx(Glyph, { name: "loader", size: size, spin: true }) : icon ? _jsx(Glyph, { name: icon, size: size }) : null, label] }));
|
|
38
44
|
};
|
|
39
45
|
//# sourceMappingURL=button.js.map
|
package/dist/button.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","sourceRoot":"","sources":["../src/button.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAG7D,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAC7B,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"button.js","sourceRoot":"","sources":["../src/button.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAG7D,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAC7B,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAIlC,qDAAqD;AACrD,MAAM,QAAQ,GAA4B;IACxC,OAAO,EAAE,gDAAgD;IACzD,SAAS,EAAE,iDAAiD;IAC5D,KAAK,EAAE,gCAAgC;IACvC,MAAM,EAAE,mDAAmD;CAC5D,CAAC;AAEF;;;;GAIG;AACH,MAAM,OAAO,GAAG,mBAAmB,CAAC;AAEpC,4EAA4E;AAC5E,MAAM,KAAK,GAAgC;IACzC,EAAE,EAAE,oCAAoC;IACxC,EAAE,EAAE,oCAAoC;IACxC,EAAE,EAAE,oCAAoC;CACzC,CAAC;AAEF;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,MAAM,MAAM,GAAoB,CAAC,EACtC,KAAK,EACL,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,IAAI,EACX,IAAI,EACJ,OAAO,GAAG,KAAK,EACf,QAAQ,GAAG,KAAK,EAChB,OAAO,EACP,SAAS,EACT,GAAG,GACJ,EAAE,EAAE;IACH,MAAM,QAAQ,GAAG,QAAQ,IAAI,OAAO,CAAC;IAErC,OAAO,CACL,MAAC,UAAU,IACT,GAAG,EAAE,GAAuB,EAC5B,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,QAAQ;QAClB,4CAA4C;QAC5C,2CAA2C;QAC3C,OAAO,EAAE,OAAO,IAAI,CAAC,GAAG,EAAE,CAAC,OAAO,EAAE,CAAC,EACrC,SAAS,EAAE,EAAE,CACX,mEAAmE,EACnE,2FAA2F,EAC3F,QAAQ,CAAC,OAAO,CAAC,EACjB,OAAO,EACP,KAAK,CAAC,IAAI,CAAC,EACX,QAAQ,IAAI,gCAAgC,EAC5C,SAAS,CACV,aAEA,OAAO,CAAC,CAAC,CAAC,KAAC,KAAK,IAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAE,IAAI,EAAE,IAAI,SAAG,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAC,KAAK,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,GAAI,CAAC,CAAC,CAAC,IAAI,EACpG,KAAK,IACK,CACd,CAAC;AACJ,CAAC,CAAC"}
|
package/dist/chip.d.ts
ADDED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { Contracts } from "@eeennsu/tokens";
|
|
2
|
+
import type { FC } from "react";
|
|
3
|
+
type ChipProps = Contracts<"web">["Chip"];
|
|
4
|
+
/**
|
|
5
|
+
* 고르는 칩(구현 노트 N-17). 토글 버튼이라 고른 상태를 `aria-pressed` 로 알린다.
|
|
6
|
+
* `label` 이 가시 텍스트이자 접근성 이름이고(C-13), 상태를 바꾸는 것은 소비자의 `onClick` 이다.
|
|
7
|
+
*
|
|
8
|
+
* 고른 칩은 brand 로 채우고, 고르지 않은 칩은 surface 에 테두리다. 칩은 글자가 컨트롤을 식별하므로
|
|
9
|
+
* 테두리에 3:1 을 요구하지 않는다(WCAG 1.4.11). 고른 상태의 채움은 배경과 3:1 을 넘긴다(tokens 대비 테스트).
|
|
10
|
+
*/
|
|
11
|
+
export declare const Chip: FC<ChipProps>;
|
|
12
|
+
export {};
|
|
13
|
+
//# sourceMappingURL=chip.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chip.d.ts","sourceRoot":"","sources":["../src/chip.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,KAAK,EAAE,EAAE,EAAO,MAAM,OAAO,CAAC;AAGrC,KAAK,SAAS,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC;AAE1C;;;;;;GAMG;AACH,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAsB9B,CAAC"}
|
package/dist/chip.js
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { Button as BaseButton } from "@base-ui/react/button";
|
|
4
|
+
import { cn } from "./cn.js";
|
|
5
|
+
/**
|
|
6
|
+
* 고르는 칩(구현 노트 N-17). 토글 버튼이라 고른 상태를 `aria-pressed` 로 알린다.
|
|
7
|
+
* `label` 이 가시 텍스트이자 접근성 이름이고(C-13), 상태를 바꾸는 것은 소비자의 `onClick` 이다.
|
|
8
|
+
*
|
|
9
|
+
* 고른 칩은 brand 로 채우고, 고르지 않은 칩은 surface 에 테두리다. 칩은 글자가 컨트롤을 식별하므로
|
|
10
|
+
* 테두리에 3:1 을 요구하지 않는다(WCAG 1.4.11). 고른 상태의 채움은 배경과 3:1 을 넘긴다(tokens 대비 테스트).
|
|
11
|
+
*/
|
|
12
|
+
export const Chip = ({ label, selected = false, disabled = false, onClick, className, ref }) => (_jsx(BaseButton, { ref: ref, type: "button", "aria-pressed": selected, disabled: disabled,
|
|
13
|
+
// 계약은 `() => void` 다. 이벤트 객체를 넘기지 않는다(N-5).
|
|
14
|
+
onClick: onClick && (() => onClick()), className: cn("inline-flex items-center justify-center border px-4 py-2 text-sm rounded-full", "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-border-focus", selected
|
|
15
|
+
? "border-brand bg-brand text-fg-on-brand hover:border-brand-hover hover:bg-brand-hover"
|
|
16
|
+
: "border-border bg-surface text-fg hover:bg-surface-hover",
|
|
17
|
+
// 누르는 동안은 색이 아니라 투명도다 — 소비자가 배경을 바꿔도 따라간다(Button 과 같다)
|
|
18
|
+
"active:opacity-80", disabled && "opacity-50 pointer-events-none", className), children: label }));
|
|
19
|
+
//# sourceMappingURL=chip.js.map
|
package/dist/chip.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chip.js","sourceRoot":"","sources":["../src/chip.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAG7D,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAI7B;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,IAAI,GAAkB,CAAC,EAAE,KAAK,EAAE,QAAQ,GAAG,KAAK,EAAE,QAAQ,GAAG,KAAK,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC,CAC7G,KAAC,UAAU,IACT,GAAG,EAAE,GAAuB,EAC5B,IAAI,EAAC,QAAQ,kBACC,QAAQ,EACtB,QAAQ,EAAE,QAAQ;IAClB,4CAA4C;IAC5C,OAAO,EAAE,OAAO,IAAI,CAAC,GAAG,EAAE,CAAC,OAAO,EAAE,CAAC,EACrC,SAAS,EAAE,EAAE,CACX,+EAA+E,EAC/E,2FAA2F,EAC3F,QAAQ;QACN,CAAC,CAAC,sFAAsF;QACxF,CAAC,CAAC,yDAAyD;IAC7D,uDAAuD;IACvD,mBAAmB,EACnB,QAAQ,IAAI,gCAAgC,EAC5C,SAAS,CACV,YAEA,KAAK,GACK,CACd,CAAC"}
|
package/dist/dialog.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { Dialog as BaseDialog } from "@base-ui/react/dialog";
|
|
4
4
|
import { cn } from "./cn.js";
|
|
5
|
-
import {
|
|
5
|
+
import { Glyph } from "./icon.js";
|
|
6
6
|
/**
|
|
7
7
|
* 모달 대화상자. `label` 은 제목으로 렌더되고 Base UI 가 `aria-labelledby` 를 연결한다(plan D-10).
|
|
8
8
|
*
|
|
@@ -10,5 +10,5 @@ import { Icon } from "./icon.js";
|
|
|
10
10
|
* 소비자가 Button 누름 이벤트로 `open` 을 토글한다.
|
|
11
11
|
* Base UI `onOpenChange` 는 `(open, eventDetails)` 2인자라 DS 가 boolean 하나로 감싼다.
|
|
12
12
|
*/
|
|
13
|
-
export const Dialog = ({ label, children, open, defaultOpen, onOpenChange, className, }) => (_jsx(BaseDialog.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: (next) => onOpenChange?.(next), children: _jsxs(BaseDialog.Portal, { children: [_jsx(BaseDialog.Backdrop, { className: "fixed inset-0 bg-overlay transition-opacity" }), _jsxs(BaseDialog.Popup, { className: cn("fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2", "bg-surface text-fg max-w-md w-full p-6 rounded-lg shadow-lg", className), children: [_jsx(BaseDialog.Title, { className: "text-xl", children: label }), children, _jsx(BaseDialog.Close, { "aria-label": "\uB2EB\uAE30", className: "absolute top-4 right-4 text-fg-muted focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-border-focus", children: _jsx(
|
|
13
|
+
export const Dialog = ({ label, children, open, defaultOpen, onOpenChange, className, }) => (_jsx(BaseDialog.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: (next) => onOpenChange?.(next), children: _jsxs(BaseDialog.Portal, { children: [_jsx(BaseDialog.Backdrop, { className: "fixed inset-0 bg-overlay transition-opacity" }), _jsxs(BaseDialog.Popup, { className: cn("fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2", "bg-surface text-fg max-w-md w-full p-6 rounded-lg shadow-lg", className), children: [_jsx(BaseDialog.Title, { className: "text-xl", children: label }), children, _jsx(BaseDialog.Close, { "aria-label": "\uB2EB\uAE30", className: "absolute top-4 right-4 text-fg-muted focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-border-focus", children: _jsx(Glyph, { name: "x", size: "sm" }) })] })] }) }));
|
|
14
14
|
//# sourceMappingURL=dialog.js.map
|
package/dist/dialog.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog.js","sourceRoot":"","sources":["../src/dialog.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAG7D,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAC7B,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"dialog.js","sourceRoot":"","sources":["../src/dialog.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAG7D,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAC7B,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAElC;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,MAAM,GAAmC,CAAC,EACrD,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,YAAY,EACZ,SAAS,GACV,EAAE,EAAE,CAAC,CACJ,KAAC,UAAU,CAAC,IAAI,IACd,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,YAAY,EAAE,CAAC,IAAI,CAAC,YAE5C,MAAC,UAAU,CAAC,MAAM,eAChB,KAAC,UAAU,CAAC,QAAQ,IAAC,SAAS,EAAC,6CAA6C,GAAG,EAC/E,MAAC,UAAU,CAAC,KAAK,IACf,SAAS,EAAE,EAAE,CACX,0DAA0D,EAC1D,6DAA6D,EAC7D,SAAS,CACV,aAED,KAAC,UAAU,CAAC,KAAK,IAAC,SAAS,EAAC,SAAS,YAAE,KAAK,GAAoB,EAC/D,QAAQ,EAET,KAAC,UAAU,CAAC,KAAK,kBACJ,cAAI,EACf,SAAS,EAAC,gIAAgI,YAE1I,KAAC,KAAK,IAAC,IAAI,EAAC,GAAG,EAAC,IAAI,EAAC,IAAI,GAAG,GACX,IACF,IACD,GACJ,CACnB,CAAC"}
|
package/dist/drawer.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { Dialog as BaseDialog } from "@base-ui/react/dialog";
|
|
4
4
|
import { cn } from "./cn.js";
|
|
5
|
-
import {
|
|
5
|
+
import { Glyph } from "./icon.js";
|
|
6
6
|
/** 가장자리 고정 위치. 폭 토큰은 좌·우에만 적용된다(§3.8 drawer.width). */
|
|
7
7
|
const sides = {
|
|
8
8
|
left: "inset-y-0 left-0 max-w-sm w-full",
|
|
@@ -13,5 +13,5 @@ const sides = {
|
|
|
13
13
|
* 가장자리에서 열리는 패널. Base UI Dialog 파트를 그대로 쓰고 위치 클래스만 바꾼다 —
|
|
14
14
|
* 별도 라이브러리를 들이지 않는다(plan D-12). 스와이프 닫기는 없다.
|
|
15
15
|
*/
|
|
16
|
-
export const Drawer = ({ label, children, side = "right", open, defaultOpen, onOpenChange, className, }) => (_jsx(BaseDialog.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: (next) => onOpenChange?.(next), children: _jsxs(BaseDialog.Portal, { children: [_jsx(BaseDialog.Backdrop, { className: "fixed inset-0 bg-overlay transition-opacity" }), _jsxs(BaseDialog.Popup, { className: cn("fixed bg-surface text-fg p-6 shadow-lg", sides[side], className), children: [_jsx(BaseDialog.Title, { className: "text-xl", children: label }), children, _jsx(BaseDialog.Close, { "aria-label": "\uB2EB\uAE30", className: "absolute top-4 right-4 text-fg-muted focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-border-focus", children: _jsx(
|
|
16
|
+
export const Drawer = ({ label, children, side = "right", open, defaultOpen, onOpenChange, className, }) => (_jsx(BaseDialog.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: (next) => onOpenChange?.(next), children: _jsxs(BaseDialog.Portal, { children: [_jsx(BaseDialog.Backdrop, { className: "fixed inset-0 bg-overlay transition-opacity" }), _jsxs(BaseDialog.Popup, { className: cn("fixed bg-surface text-fg p-6 shadow-lg", sides[side], className), children: [_jsx(BaseDialog.Title, { className: "text-xl", children: label }), children, _jsx(BaseDialog.Close, { "aria-label": "\uB2EB\uAE30", className: "absolute top-4 right-4 text-fg-muted focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-border-focus", children: _jsx(Glyph, { name: "x", size: "sm" }) })] })] }) }));
|
|
17
17
|
//# sourceMappingURL=drawer.js.map
|
package/dist/drawer.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer.js","sourceRoot":"","sources":["../src/drawer.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAG7D,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAC7B,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"drawer.js","sourceRoot":"","sources":["../src/drawer.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAG7D,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAC7B,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAIlC,uDAAuD;AACvD,MAAM,KAAK,GAAqD;IAC9D,IAAI,EAAE,kCAAkC;IACxC,KAAK,EAAE,mCAAmC;IAC1C,MAAM,EAAE,2BAA2B;CACpC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,MAAM,GAAoB,CAAC,EACtC,KAAK,EACL,QAAQ,EACR,IAAI,GAAG,OAAO,EACd,IAAI,EACJ,WAAW,EACX,YAAY,EACZ,SAAS,GACV,EAAE,EAAE,CAAC,CACJ,KAAC,UAAU,CAAC,IAAI,IACd,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,YAAY,EAAE,CAAC,IAAI,CAAC,YAE5C,MAAC,UAAU,CAAC,MAAM,eAChB,KAAC,UAAU,CAAC,QAAQ,IAAC,SAAS,EAAC,6CAA6C,GAAG,EAC/E,MAAC,UAAU,CAAC,KAAK,IACf,SAAS,EAAE,EAAE,CAAC,wCAAwC,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,aAE/E,KAAC,UAAU,CAAC,KAAK,IAAC,SAAS,EAAC,SAAS,YAAE,KAAK,GAAoB,EAC/D,QAAQ,EACT,KAAC,UAAU,CAAC,KAAK,kBACJ,cAAI,EACf,SAAS,EAAC,gIAAgI,YAE1I,KAAC,KAAK,IAAC,IAAI,EAAC,GAAG,EAAC,IAAI,EAAC,IAAI,GAAG,GACX,IACF,IACD,GACJ,CACnB,CAAC"}
|
package/dist/icon.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import { type ControlSize, type IconName } from "@eeennsu/tokens";
|
|
1
|
+
import { type Contracts, type ControlSize, type IconName } from "@eeennsu/tokens";
|
|
2
|
+
import type { FC } from "react";
|
|
2
3
|
import { type LucideIcon } from "lucide-react";
|
|
3
4
|
/**
|
|
4
5
|
* `IconName` → lucide 컴포넌트. `Record<IconName, LucideIcon>` 이라 tokens 의 목록에
|
|
@@ -8,18 +9,24 @@ import { type LucideIcon } from "lucide-react";
|
|
|
8
9
|
* major 에서 사라질 수 있다(plan v2 F-6).
|
|
9
10
|
*/
|
|
10
11
|
declare const icons: Record<IconName, LucideIcon>;
|
|
11
|
-
type
|
|
12
|
+
type GlyphProps = {
|
|
12
13
|
name: IconName;
|
|
13
14
|
size?: ControlSize;
|
|
14
15
|
spin?: boolean;
|
|
15
16
|
className?: string;
|
|
16
17
|
};
|
|
17
18
|
/**
|
|
18
|
-
*
|
|
19
|
+
* 컴포넌트 안에 붙는 아이콘(Button 의 `icon` · `loading`). 공개 `Icon` 과 달리 `spin` 을 받고
|
|
20
|
+
* 색은 `currentColor` 로 부모 글자색을 상속한다(§9 S-17). 가시 텍스트 옆이라 늘 보조 기술에서 숨긴다.
|
|
19
21
|
* 크기는 클래스가 아니라 lucide `size` prop(JS 숫자)으로 준다 — 20px 는 spacing 열거
|
|
20
22
|
* 밖이라 `size-5` 클래스가 생성되지 않기 때문이다(plan v2 F-8).
|
|
21
|
-
* 색은 `currentColor` 상속이라 별도 prop 이 없다(§9 S-17).
|
|
22
23
|
*/
|
|
23
|
-
export declare function
|
|
24
|
+
export declare function Glyph({ name, size, spin, className }: GlyphProps): import("react").JSX.Element;
|
|
25
|
+
/**
|
|
26
|
+
* 단독 아이콘(구현 노트 N-17). 색을 상속하지 않고 `tone` 으로 정한다 — RN 에는 글자색 상속이
|
|
27
|
+
* 없으므로 두 플랫폼이 같은 결과를 내려면 색을 아이콘 자신이 가져야 한다(AC-25).
|
|
28
|
+
* `label` 이 있으면 `role="img"` 과 이름을 갖는 그림이고, 없거나 빈 문자열이면 꾸밈이라 `aria-hidden` 이다.
|
|
29
|
+
*/
|
|
30
|
+
export declare const Icon: FC<Contracts<"web">["Icon"]>;
|
|
24
31
|
export { icons };
|
|
25
32
|
//# sourceMappingURL=icon.d.ts.map
|
package/dist/icon.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../src/icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,WAAW,EAAE,KAAK,QAAQ,
|
|
1
|
+
{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../src/icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,SAAS,EAAE,KAAK,WAAW,EAAE,KAAK,QAAQ,EAAa,MAAM,iBAAiB,CAAC;AACxG,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,EAmBL,KAAK,UAAU,EAWhB,MAAM,cAAc,CAAC;AAEtB;;;;;;GAMG;AACH,QAAA,MAAM,KAAK,EAAE,MAAM,CAAC,QAAQ,EAAE,UAAU,CA6BvC,CAAC;AAEF,KAAK,UAAU,GAAG;IAChB,IAAI,EAAE,QAAQ,CAAC;IACf,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;;;;GAKG;AACH,wBAAgB,KAAK,CAAC,EAAE,IAAI,EAAE,IAAW,EAAE,IAAY,EAAE,SAAS,EAAE,EAAE,UAAU,+BAS/E;AASD;;;;GAIG;AACH,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAa7C,CAAC;AAEF,OAAO,EAAE,KAAK,EAAE,CAAC"}
|
package/dist/icon.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { component } from "@eeennsu/tokens";
|
|
3
3
|
import { cn } from "./cn.js";
|
|
4
|
-
import { ArrowLeft, ArrowRight, Check, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, CircleAlert, ExternalLink, Eye, EyeOff, Info, Loader, Lock, Mail, Menu, Minus, Pencil, Plus, Search, Settings, Trash, User, X, } from "lucide-react";
|
|
4
|
+
import { ArrowLeft, ArrowRight, Calendar, ChartPie, Check, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, CircleAlert, ExternalLink, Eye, EyeOff, House, Info, List, Loader, Lock, Mail, Menu, Minus, Pencil, Plus, Search, Settings, Trash, User, X, } from "lucide-react";
|
|
5
5
|
/**
|
|
6
6
|
* `IconName` → lucide 컴포넌트. `Record<IconName, LucideIcon>` 이라 tokens 의 목록에
|
|
7
7
|
* 이름을 추가하고 이 맵을 빠뜨리면 컴파일 에러가 난다(plan D-8).
|
|
@@ -34,16 +34,37 @@ const icons = {
|
|
|
34
34
|
"alert-circle": CircleAlert,
|
|
35
35
|
loader: Loader,
|
|
36
36
|
"external-link": ExternalLink,
|
|
37
|
+
home: House,
|
|
38
|
+
list: List,
|
|
39
|
+
"chart-pie": ChartPie,
|
|
40
|
+
calendar: Calendar,
|
|
37
41
|
};
|
|
38
42
|
/**
|
|
39
|
-
*
|
|
43
|
+
* 컴포넌트 안에 붙는 아이콘(Button 의 `icon` · `loading`). 공개 `Icon` 과 달리 `spin` 을 받고
|
|
44
|
+
* 색은 `currentColor` 로 부모 글자색을 상속한다(§9 S-17). 가시 텍스트 옆이라 늘 보조 기술에서 숨긴다.
|
|
40
45
|
* 크기는 클래스가 아니라 lucide `size` prop(JS 숫자)으로 준다 — 20px 는 spacing 열거
|
|
41
46
|
* 밖이라 `size-5` 클래스가 생성되지 않기 때문이다(plan v2 F-8).
|
|
42
|
-
* 색은 `currentColor` 상속이라 별도 prop 이 없다(§9 S-17).
|
|
43
47
|
*/
|
|
44
|
-
export function
|
|
45
|
-
const
|
|
46
|
-
return (_jsx(
|
|
48
|
+
export function Glyph({ name, size = "md", spin = false, className }) {
|
|
49
|
+
const Svg = icons[name];
|
|
50
|
+
return (_jsx(Svg, { size: component.icon.size[size], "aria-hidden": "true", className: spin ? cn("animate-spin", className) : className }));
|
|
47
51
|
}
|
|
52
|
+
/** `tone` 은 Text 와 같은 fg semantic 색이다(C-8). */
|
|
53
|
+
const tones = {
|
|
54
|
+
default: "text-fg",
|
|
55
|
+
muted: "text-fg-muted",
|
|
56
|
+
danger: "text-fg-danger",
|
|
57
|
+
};
|
|
58
|
+
/**
|
|
59
|
+
* 단독 아이콘(구현 노트 N-17). 색을 상속하지 않고 `tone` 으로 정한다 — RN 에는 글자색 상속이
|
|
60
|
+
* 없으므로 두 플랫폼이 같은 결과를 내려면 색을 아이콘 자신이 가져야 한다(AC-25).
|
|
61
|
+
* `label` 이 있으면 `role="img"` 과 이름을 갖는 그림이고, 없거나 빈 문자열이면 꾸밈이라 `aria-hidden` 이다.
|
|
62
|
+
*/
|
|
63
|
+
export const Icon = ({ name, size = "md", tone = "default", label, className }) => {
|
|
64
|
+
const Svg = icons[name];
|
|
65
|
+
// 빈 문자열도 꾸밈으로 본다 — 이름 없는 그림을 보조 기술에 내놓지 않는다.
|
|
66
|
+
const named = Boolean(label);
|
|
67
|
+
return (_jsx(Svg, { size: component.icon.size[size], role: named ? "img" : undefined, "aria-label": named ? label : undefined, "aria-hidden": named ? undefined : "true", className: cn("shrink-0", tones[tone], className) }));
|
|
68
|
+
};
|
|
48
69
|
export { icons };
|
|
49
70
|
//# sourceMappingURL=icon.js.map
|
package/dist/icon.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.js","sourceRoot":"","sources":["../src/icon.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,
|
|
1
|
+
{"version":3,"file":"icon.js","sourceRoot":"","sources":["../src/icon.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAA8D,MAAM,iBAAiB,CAAC;AAExG,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAC7B,OAAO,EACL,SAAS,EACT,UAAU,EACV,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,WAAW,EACX,WAAW,EACX,YAAY,EACZ,SAAS,EACT,WAAW,EACX,YAAY,EACZ,GAAG,EACH,MAAM,EACN,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,IAAI,EAEJ,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,MAAM,EACN,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,CAAC,GACF,MAAM,cAAc,CAAC;AAEtB;;;;;;GAMG;AACH,MAAM,KAAK,GAAiC;IAC1C,KAAK,EAAE,KAAK;IACZ,CAAC,EAAE,CAAC;IACJ,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,KAAK;IACZ,KAAK,EAAE,KAAK;IACZ,MAAM,EAAE,MAAM;IACd,MAAM,EAAE,MAAM;IACd,cAAc,EAAE,WAAW;IAC3B,YAAY,EAAE,SAAS;IACvB,cAAc,EAAE,WAAW;IAC3B,eAAe,EAAE,YAAY;IAC7B,YAAY,EAAE,SAAS;IACvB,aAAa,EAAE,UAAU;IACzB,IAAI,EAAE,IAAI;IACV,QAAQ,EAAE,QAAQ;IAClB,IAAI,EAAE,IAAI;IACV,IAAI,EAAE,IAAI;IACV,IAAI,EAAE,IAAI;IACV,GAAG,EAAE,GAAG;IACR,SAAS,EAAE,MAAM;IACjB,IAAI,EAAE,IAAI;IACV,cAAc,EAAE,WAAW;IAC3B,MAAM,EAAE,MAAM;IACd,eAAe,EAAE,YAAY;IAC7B,IAAI,EAAE,KAAK;IACX,IAAI,EAAE,IAAI;IACV,WAAW,EAAE,QAAQ;IACrB,QAAQ,EAAE,QAAQ;CACnB,CAAC;AASF;;;;;GAKG;AACH,MAAM,UAAU,KAAK,CAAC,EAAE,IAAI,EAAE,IAAI,GAAG,IAAI,EAAE,IAAI,GAAG,KAAK,EAAE,SAAS,EAAc;IAC9E,MAAM,GAAG,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC;IACxB,OAAO,CACL,KAAC,GAAG,IACF,IAAI,EAAE,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,iBACnB,MAAM,EAClB,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,GAC3D,CACH,CAAC;AACJ,CAAC;AAED,+CAA+C;AAC/C,MAAM,KAAK,GAAyB;IAClC,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,eAAe;IACtB,MAAM,EAAE,gBAAgB;CACzB,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,IAAI,GAAiC,CAAC,EAAE,IAAI,EAAE,IAAI,GAAG,IAAI,EAAE,IAAI,GAAG,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;IAC9G,MAAM,GAAG,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC;IACxB,6CAA6C;IAC7C,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;IAC7B,OAAO,CACL,KAAC,GAAG,IACF,IAAI,EAAE,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAC/B,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,gBACnB,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,iBACxB,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,EACvC,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,GACjD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAE,KAAK,EAAE,CAAC"}
|
package/dist/index.d.ts
CHANGED
|
@@ -3,16 +3,18 @@ import { Box } from "./box.js";
|
|
|
3
3
|
import { Button } from "./button.js";
|
|
4
4
|
import { ButtonGroup } from "./button-group.js";
|
|
5
5
|
import { Card } from "./card.js";
|
|
6
|
+
import { Chip } from "./chip.js";
|
|
6
7
|
import { Dialog } from "./dialog.js";
|
|
7
8
|
import { Drawer } from "./drawer.js";
|
|
8
9
|
import { Form } from "./form.js";
|
|
10
|
+
import { Icon } from "./icon.js";
|
|
9
11
|
import { Input } from "./input.js";
|
|
10
12
|
import { Label } from "./label.js";
|
|
11
13
|
import { Stack } from "./stack.js";
|
|
12
14
|
import { Text } from "./text.js";
|
|
13
15
|
import { Textarea } from "./textarea.js";
|
|
14
16
|
import { Tooltip } from "./tooltip.js";
|
|
15
|
-
export { Badge, Box, Button, ButtonGroup, Card, Dialog, Drawer, Form, Input, Label, Stack, Text, Textarea, Tooltip };
|
|
17
|
+
export { Badge, Box, Button, ButtonGroup, Card, Chip, Dialog, Drawer, Form, Icon, Input, Label, Stack, Text, Textarea, Tooltip };
|
|
16
18
|
export { cn } from "./cn.js";
|
|
17
19
|
/**
|
|
18
20
|
* 계약 맵 테스트(C-17)가 보는 객체. 키 집합이 `webComponents` 와 같고
|
|
@@ -78,6 +80,22 @@ export declare const components: {
|
|
|
78
80
|
size?: import("@eeennsu/tokens").BadgeSize;
|
|
79
81
|
className?: string;
|
|
80
82
|
}>;
|
|
83
|
+
Chip: import("react").FC<{
|
|
84
|
+
label: string;
|
|
85
|
+
selected?: boolean;
|
|
86
|
+
disabled?: boolean;
|
|
87
|
+
className?: string;
|
|
88
|
+
ref?: import("react").Ref<import("@eeennsu/tokens").FocusHandle>;
|
|
89
|
+
} & {
|
|
90
|
+
onClick?: () => void;
|
|
91
|
+
}>;
|
|
92
|
+
Icon: import("react").FC<{
|
|
93
|
+
name: import("@eeennsu/tokens").IconName;
|
|
94
|
+
size?: import("@eeennsu/tokens").ControlSize;
|
|
95
|
+
tone?: import("@eeennsu/tokens").Tone;
|
|
96
|
+
label?: string;
|
|
97
|
+
className?: string;
|
|
98
|
+
}>;
|
|
81
99
|
Text: import("react").FC<{
|
|
82
100
|
children: string | string[];
|
|
83
101
|
tone?: import("@eeennsu/tokens").Tone;
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC;AACjI,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAE7B;;;GAGG;AACH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiBtB,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -3,16 +3,18 @@ import { Box } from "./box.js";
|
|
|
3
3
|
import { Button } from "./button.js";
|
|
4
4
|
import { ButtonGroup } from "./button-group.js";
|
|
5
5
|
import { Card } from "./card.js";
|
|
6
|
+
import { Chip } from "./chip.js";
|
|
6
7
|
import { Dialog } from "./dialog.js";
|
|
7
8
|
import { Drawer } from "./drawer.js";
|
|
8
9
|
import { Form } from "./form.js";
|
|
10
|
+
import { Icon } from "./icon.js";
|
|
9
11
|
import { Input } from "./input.js";
|
|
10
12
|
import { Label } from "./label.js";
|
|
11
13
|
import { Stack } from "./stack.js";
|
|
12
14
|
import { Text } from "./text.js";
|
|
13
15
|
import { Textarea } from "./textarea.js";
|
|
14
16
|
import { Tooltip } from "./tooltip.js";
|
|
15
|
-
export { Badge, Box, Button, ButtonGroup, Card, Dialog, Drawer, Form, Input, Label, Stack, Text, Textarea, Tooltip };
|
|
17
|
+
export { Badge, Box, Button, ButtonGroup, Card, Chip, Dialog, Drawer, Form, Icon, Input, Label, Stack, Text, Textarea, Tooltip };
|
|
16
18
|
export { cn } from "./cn.js";
|
|
17
19
|
/**
|
|
18
20
|
* 계약 맵 테스트(C-17)가 보는 객체. 키 집합이 `webComponents` 와 같고
|
|
@@ -26,6 +28,8 @@ export const components = {
|
|
|
26
28
|
Label,
|
|
27
29
|
Card,
|
|
28
30
|
Badge,
|
|
31
|
+
Chip,
|
|
32
|
+
Icon,
|
|
29
33
|
Text,
|
|
30
34
|
Stack,
|
|
31
35
|
Box,
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC;AACjI,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAE7B;;;GAGG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,MAAM;IACN,WAAW;IACX,KAAK;IACL,QAAQ;IACR,KAAK;IACL,IAAI;IACJ,KAAK;IACL,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,KAAK;IACL,GAAG;IACH,OAAO;IACP,MAAM;IACN,MAAM;IACN,IAAI;CACL,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@eeennsu/web",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.0",
|
|
4
4
|
"description": "웹(React 19 + Tailwind v4) 디자인 시스템 컴포넌트",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
"@base-ui/react": "1.8.0",
|
|
23
23
|
"lucide-react": "1.41.0",
|
|
24
24
|
"tailwind-merge": "^3.6.0",
|
|
25
|
-
"@eeennsu/tokens": "0.
|
|
25
|
+
"@eeennsu/tokens": "0.3.0"
|
|
26
26
|
},
|
|
27
27
|
"peerDependencies": {
|
|
28
28
|
"react": ">=19",
|