@nurihaus/web-design-system 3.9.0 → 3.9.1
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/ai/components.md +1 -1
- package/dist/components/bottom-bar/bottom-bar.stories.d.ts +7 -7
- package/dist/components/empty-state/empty-state.stories.d.ts +9 -9
- package/dist/components/icon/icon.stories.d.ts +1 -1
- package/dist/components/list/list-row.stories.d.ts +12 -12
- package/dist/components/message/message.stories.d.ts +12 -12
- package/dist/components/notice/notice.stories.d.ts +9 -9
- package/dist/components/skeleton/skeleton.stories.d.ts +9 -9
- package/dist/components/toast/toast.stories.d.ts +14 -14
- package/dist/components.css +7 -0
- package/dist/styles.css +5 -0
- package/package.json +1 -1
package/dist/ai/components.md
CHANGED
|
@@ -194,7 +194,7 @@ import { IconButton } from '@nurihaus/web-design-system/icon-button'; // 이
|
|
|
194
194
|
import { IconButton } from '@nurihaus/web-design-system'; // 루트. 첫 로드 JS 가 커진다
|
|
195
195
|
```
|
|
196
196
|
|
|
197
|
-
**언제 쓴다.** 글자 없이 아이콘 하나로 뜻이 통하는 버튼에 쓴다(뒤로, 알림, 첨부, 떠 있는 추가 버튼). `icon` 은 Icon 이름, `label` 은 버튼의 이름(aria-label)이라 꼭 준다. `variant` 는 `ghost`(기본, 바탕 없이 회색 아이콘, 누르는 동안 회색 원)·`secondary`(연보라)·`primary`(진보라). `size` 는 `s`(36)·`m`(44, 기본)·`l`(56)이고 보이는 크기가 작아도 누르는 자리는 44 이상이다. 다른 화면으로 옮겨 가는 버튼은 `asChild` 를 주고 링크 요소 하나를 children 으로 준다 — 그 링크가 버튼 모양이 되고 아이콘은 링크 안에 들어간다. 떠 있는
|
|
197
|
+
**언제 쓴다.** 글자 없이 아이콘 하나로 뜻이 통하는 버튼에 쓴다(뒤로, 알림, 첨부, 떠 있는 추가 버튼). `icon` 은 Icon 이름, `label` 은 버튼의 이름(aria-label)이라 꼭 준다. `variant` 는 `ghost`(기본, 바탕 없이 회색 아이콘, 누르는 동안 회색 원)·`secondary`(연보라)·`primary`(진보라). `size` 는 `s`(36)·`m`(44, 기본)·`l`(56)이고 보이는 크기가 작아도 누르는 자리는 44 이상이다. 다른 화면으로 옮겨 가는 버튼은 `asChild` 를 주고 링크 요소 하나를 children 으로 준다 — 그 링크가 버튼 모양이 되고 아이콘은 링크 안에 들어간다. 떠 있는 버튼은 감싸는 요소에 자리(`position: fixed` 등)·모양(`border-radius`)·그림자(`--shadow-floating`)를 준다 — 버튼 자체의 `className` 으로 `position` 을 덮으면 CSS 가 실리는 순서에 따라 DS 의 `position: relative`(터치 영역 기준)가 이긴다. `className`·`style` 은 버튼(또는 링크)에 붙는다.
|
|
198
198
|
|
|
199
199
|
**쓰지 않는다.** 글자가 있는 버튼은 CTAButton 을 쓴다. 칩의 지우기는 Tag 의 `onRemove`, 대화 보내기는 MessageComposer 를 쓴다.
|
|
200
200
|
|
|
@@ -5,9 +5,15 @@ declare const meta: {
|
|
|
5
5
|
ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
6
6
|
}, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
7
7
|
decorators: ((Story: import("storybook/internal/csf").PartialStoryFn<import("@storybook/react-webpack5").ReactRenderer, {
|
|
8
|
+
title?: string | undefined | undefined;
|
|
9
|
+
children?: import("react").ReactNode;
|
|
8
10
|
className?: string | undefined | undefined;
|
|
9
11
|
style?: import("react").CSSProperties | undefined;
|
|
10
|
-
|
|
12
|
+
key?: import("react").Key | null | undefined;
|
|
13
|
+
color?: string | undefined | undefined;
|
|
14
|
+
content?: string | undefined | undefined;
|
|
15
|
+
translate?: "yes" | "no" | undefined | undefined;
|
|
16
|
+
slot?: string | undefined | undefined;
|
|
11
17
|
defaultChecked?: boolean | undefined | undefined;
|
|
12
18
|
defaultValue?: string | number | readonly string[] | undefined;
|
|
13
19
|
suppressContentEditableWarning?: boolean | undefined | undefined;
|
|
@@ -24,15 +30,11 @@ declare const meta: {
|
|
|
24
30
|
id?: string | undefined | undefined;
|
|
25
31
|
lang?: string | undefined | undefined;
|
|
26
32
|
nonce?: string | undefined | undefined;
|
|
27
|
-
slot?: string | undefined | undefined;
|
|
28
33
|
spellCheck?: (boolean | "true" | "false") | undefined;
|
|
29
34
|
tabIndex?: number | undefined | undefined;
|
|
30
|
-
title?: string | undefined | undefined;
|
|
31
|
-
translate?: "yes" | "no" | undefined | undefined;
|
|
32
35
|
radioGroup?: string | undefined | undefined;
|
|
33
36
|
role?: import("react").AriaRole | undefined;
|
|
34
37
|
about?: string | undefined | undefined;
|
|
35
|
-
content?: string | undefined | undefined;
|
|
36
38
|
datatype?: string | undefined | undefined;
|
|
37
39
|
inlist?: any;
|
|
38
40
|
prefix?: string | undefined | undefined;
|
|
@@ -44,7 +46,6 @@ declare const meta: {
|
|
|
44
46
|
vocab?: string | undefined | undefined;
|
|
45
47
|
autoCorrect?: string | undefined | undefined;
|
|
46
48
|
autoSave?: string | undefined | undefined;
|
|
47
|
-
color?: string | undefined | undefined;
|
|
48
49
|
itemProp?: string | undefined | undefined;
|
|
49
50
|
itemScope?: boolean | undefined | undefined;
|
|
50
51
|
itemType?: string | undefined | undefined;
|
|
@@ -271,7 +272,6 @@ declare const meta: {
|
|
|
271
272
|
onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
|
|
272
273
|
onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
273
274
|
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
274
|
-
key?: import("react").Key | null | undefined;
|
|
275
275
|
ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
|
|
276
276
|
}>) => import("react/jsx-runtime").JSX.Element)[];
|
|
277
277
|
};
|
|
@@ -17,8 +17,15 @@ declare const meta: {
|
|
|
17
17
|
description: string;
|
|
18
18
|
};
|
|
19
19
|
decorators: ((Story: import("storybook/internal/csf").PartialStoryFn<import("@storybook/react-webpack5").ReactRenderer, {
|
|
20
|
+
title: import("react").ReactNode;
|
|
21
|
+
description?: import("react").ReactNode;
|
|
20
22
|
className?: string | undefined | undefined;
|
|
21
23
|
style?: import("react").CSSProperties | undefined;
|
|
24
|
+
key?: import("react").Key | null | undefined;
|
|
25
|
+
color?: string | undefined | undefined;
|
|
26
|
+
content?: string | undefined | undefined;
|
|
27
|
+
translate?: "yes" | "no" | undefined | undefined;
|
|
28
|
+
slot?: string | undefined | undefined;
|
|
22
29
|
defaultChecked?: boolean | undefined | undefined;
|
|
23
30
|
defaultValue?: string | number | readonly string[] | undefined;
|
|
24
31
|
suppressContentEditableWarning?: boolean | undefined | undefined;
|
|
@@ -35,15 +42,11 @@ declare const meta: {
|
|
|
35
42
|
id?: string | undefined | undefined;
|
|
36
43
|
lang?: string | undefined | undefined;
|
|
37
44
|
nonce?: string | undefined | undefined;
|
|
38
|
-
slot?: string | undefined | undefined;
|
|
39
45
|
spellCheck?: (boolean | "true" | "false") | undefined;
|
|
40
46
|
tabIndex?: number | undefined | undefined;
|
|
41
|
-
title: import("react").ReactNode;
|
|
42
|
-
translate?: "yes" | "no" | undefined | undefined;
|
|
43
47
|
radioGroup?: string | undefined | undefined;
|
|
44
48
|
role?: import("react").AriaRole | undefined;
|
|
45
49
|
about?: string | undefined | undefined;
|
|
46
|
-
content?: string | undefined | undefined;
|
|
47
50
|
datatype?: string | undefined | undefined;
|
|
48
51
|
inlist?: any;
|
|
49
52
|
prefix?: string | undefined | undefined;
|
|
@@ -55,7 +58,6 @@ declare const meta: {
|
|
|
55
58
|
vocab?: string | undefined | undefined;
|
|
56
59
|
autoCorrect?: string | undefined | undefined;
|
|
57
60
|
autoSave?: string | undefined | undefined;
|
|
58
|
-
color?: string | undefined | undefined;
|
|
59
61
|
itemProp?: string | undefined | undefined;
|
|
60
62
|
itemScope?: boolean | undefined | undefined;
|
|
61
63
|
itemType?: string | undefined | undefined;
|
|
@@ -282,11 +284,9 @@ declare const meta: {
|
|
|
282
284
|
onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
|
|
283
285
|
onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
284
286
|
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
285
|
-
key?: import("react").Key | null | undefined;
|
|
286
|
-
variant?: (typeof variant)[number] | undefined;
|
|
287
|
-
icon: import("../..").IconName;
|
|
288
|
-
description?: import("react").ReactNode;
|
|
289
287
|
action?: import("react").ReactNode;
|
|
288
|
+
icon: import("../..").IconName;
|
|
289
|
+
variant?: (typeof variant)[number] | undefined;
|
|
290
290
|
ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
|
|
291
291
|
}>) => import("react/jsx-runtime").JSX.Element)[];
|
|
292
292
|
};
|
|
@@ -7,7 +7,7 @@ declare const meta: {
|
|
|
7
7
|
control: {
|
|
8
8
|
type: "select";
|
|
9
9
|
};
|
|
10
|
-
options: ("link" | "circle" | "image" | "
|
|
10
|
+
options: ("x" | "link" | "circle" | "image" | "copy" | "play" | "house" | "megaphone-simple" | "chats-circle" | "user-circle" | "bell" | "caret-left" | "magnifying-glass" | "dots-three" | "gear-six" | "chat-circle" | "paper-plane-tilt" | "plus" | "camera" | "video-camera" | "upload-simple" | "calendar-blank" | "clock" | "map-pin" | "truck" | "ticket" | "qr-code" | "sparkle" | "gift" | "wallet" | "bank" | "credit-card" | "check-circle" | "check" | "warning" | "info" | "question" | "lock" | "pencil-simple" | "trash" | "share-network" | "eye" | "sliders-horizontal" | "heart" | "star" | "globe" | "sign-out" | "caret-right" | "arrow-right" | "instagram-logo" | "tiktok-logo" | "youtube-logo")[];
|
|
11
11
|
};
|
|
12
12
|
weight: {
|
|
13
13
|
control: {
|
|
@@ -6,10 +6,19 @@ declare const meta: {
|
|
|
6
6
|
label: string;
|
|
7
7
|
};
|
|
8
8
|
decorators: ((Story: import("storybook/internal/csf").PartialStoryFn<import("@storybook/react-webpack5").ReactRenderer, {
|
|
9
|
-
|
|
9
|
+
title?: string | undefined | undefined;
|
|
10
|
+
description?: import("react").ReactNode;
|
|
11
|
+
children?: import("react").ReactNode;
|
|
10
12
|
className?: string | undefined | undefined;
|
|
11
13
|
style?: import("react").CSSProperties | undefined;
|
|
12
|
-
|
|
14
|
+
track?: string | undefined;
|
|
15
|
+
trackProps?: Record<string, string | number | boolean> | undefined;
|
|
16
|
+
key?: import("react").Key | null | undefined;
|
|
17
|
+
color?: string | undefined | undefined;
|
|
18
|
+
content?: string | undefined | undefined;
|
|
19
|
+
translate?: "yes" | "no" | undefined | undefined;
|
|
20
|
+
label: import("react").ReactNode;
|
|
21
|
+
slot?: string | undefined | undefined;
|
|
13
22
|
defaultChecked?: boolean | undefined | undefined;
|
|
14
23
|
defaultValue?: string | number | readonly string[] | undefined;
|
|
15
24
|
suppressContentEditableWarning?: boolean | undefined | undefined;
|
|
@@ -26,15 +35,11 @@ declare const meta: {
|
|
|
26
35
|
id?: string | undefined | undefined;
|
|
27
36
|
lang?: string | undefined | undefined;
|
|
28
37
|
nonce?: string | undefined | undefined;
|
|
29
|
-
slot?: string | undefined | undefined;
|
|
30
38
|
spellCheck?: (boolean | "true" | "false") | undefined;
|
|
31
39
|
tabIndex?: number | undefined | undefined;
|
|
32
|
-
title?: string | undefined | undefined;
|
|
33
|
-
translate?: "yes" | "no" | undefined | undefined;
|
|
34
40
|
radioGroup?: string | undefined | undefined;
|
|
35
41
|
role?: import("react").AriaRole | undefined;
|
|
36
42
|
about?: string | undefined | undefined;
|
|
37
|
-
content?: string | undefined | undefined;
|
|
38
43
|
datatype?: string | undefined | undefined;
|
|
39
44
|
inlist?: any;
|
|
40
45
|
prefix?: string | undefined | undefined;
|
|
@@ -46,7 +51,6 @@ declare const meta: {
|
|
|
46
51
|
vocab?: string | undefined | undefined;
|
|
47
52
|
autoCorrect?: string | undefined | undefined;
|
|
48
53
|
autoSave?: string | undefined | undefined;
|
|
49
|
-
color?: string | undefined | undefined;
|
|
50
54
|
itemProp?: string | undefined | undefined;
|
|
51
55
|
itemScope?: boolean | undefined | undefined;
|
|
52
56
|
itemType?: string | undefined | undefined;
|
|
@@ -273,11 +277,7 @@ declare const meta: {
|
|
|
273
277
|
onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
|
|
274
278
|
onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
275
279
|
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
276
|
-
|
|
277
|
-
track?: string | undefined;
|
|
278
|
-
key?: import("react").Key | null | undefined;
|
|
279
|
-
trackProps?: Record<string, string | number | boolean> | undefined;
|
|
280
|
-
description?: import("react").ReactNode;
|
|
280
|
+
asChild?: boolean | undefined;
|
|
281
281
|
chevron?: boolean | undefined;
|
|
282
282
|
leading?: import("react").ReactNode;
|
|
283
283
|
trailing?: import("react").ReactNode;
|
|
@@ -22,9 +22,20 @@ declare const meta: {
|
|
|
22
22
|
time: string;
|
|
23
23
|
};
|
|
24
24
|
decorators: ((Story: import("storybook/internal/csf").PartialStoryFn<import("@storybook/react-webpack5").ReactRenderer, {
|
|
25
|
+
title?: string | undefined | undefined;
|
|
26
|
+
children?: import("react").ReactNode;
|
|
27
|
+
side?: (typeof side)[number] | undefined;
|
|
25
28
|
className?: string | undefined | undefined;
|
|
26
29
|
style?: import("react").CSSProperties | undefined;
|
|
27
|
-
|
|
30
|
+
key?: import("react").Key | null | undefined;
|
|
31
|
+
color?: string | undefined | undefined;
|
|
32
|
+
content?: string | undefined | undefined;
|
|
33
|
+
translate?: "yes" | "no" | undefined | undefined;
|
|
34
|
+
motion?: (typeof motion)[number] | undefined;
|
|
35
|
+
slot?: string | undefined | undefined;
|
|
36
|
+
time?: import("react").ReactNode;
|
|
37
|
+
name?: import("react").ReactNode;
|
|
38
|
+
value?: string | number | readonly string[] | undefined;
|
|
28
39
|
defaultChecked?: boolean | undefined | undefined;
|
|
29
40
|
defaultValue?: string | number | readonly string[] | undefined;
|
|
30
41
|
suppressContentEditableWarning?: boolean | undefined | undefined;
|
|
@@ -41,15 +52,11 @@ declare const meta: {
|
|
|
41
52
|
id?: string | undefined | undefined;
|
|
42
53
|
lang?: string | undefined | undefined;
|
|
43
54
|
nonce?: string | undefined | undefined;
|
|
44
|
-
slot?: string | undefined | undefined;
|
|
45
55
|
spellCheck?: (boolean | "true" | "false") | undefined;
|
|
46
56
|
tabIndex?: number | undefined | undefined;
|
|
47
|
-
title?: string | undefined | undefined;
|
|
48
|
-
translate?: "yes" | "no" | undefined | undefined;
|
|
49
57
|
radioGroup?: string | undefined | undefined;
|
|
50
58
|
role?: import("react").AriaRole | undefined;
|
|
51
59
|
about?: string | undefined | undefined;
|
|
52
|
-
content?: string | undefined | undefined;
|
|
53
60
|
datatype?: string | undefined | undefined;
|
|
54
61
|
inlist?: any;
|
|
55
62
|
prefix?: string | undefined | undefined;
|
|
@@ -61,7 +68,6 @@ declare const meta: {
|
|
|
61
68
|
vocab?: string | undefined | undefined;
|
|
62
69
|
autoCorrect?: string | undefined | undefined;
|
|
63
70
|
autoSave?: string | undefined | undefined;
|
|
64
|
-
color?: string | undefined | undefined;
|
|
65
71
|
itemProp?: string | undefined | undefined;
|
|
66
72
|
itemScope?: boolean | undefined | undefined;
|
|
67
73
|
itemType?: string | undefined | undefined;
|
|
@@ -288,13 +294,7 @@ declare const meta: {
|
|
|
288
294
|
onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLLIElement> | undefined;
|
|
289
295
|
onTransitionEnd?: import("react").TransitionEventHandler<HTMLLIElement> | undefined;
|
|
290
296
|
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLLIElement> | undefined;
|
|
291
|
-
time?: import("react").ReactNode;
|
|
292
|
-
key?: import("react").Key | null | undefined;
|
|
293
|
-
name?: import("react").ReactNode;
|
|
294
|
-
value?: string | number | readonly string[] | undefined;
|
|
295
|
-
motion?: (typeof motion)[number] | undefined;
|
|
296
297
|
media?: import("react").ReactNode;
|
|
297
|
-
side?: (typeof side)[number] | undefined;
|
|
298
298
|
dateTime?: string | undefined;
|
|
299
299
|
ref?: import("react").LegacyRef<HTMLLIElement> | undefined;
|
|
300
300
|
}>) => import("react/jsx-runtime").JSX.Element)[];
|
|
@@ -21,9 +21,16 @@ declare const meta: {
|
|
|
21
21
|
children: string;
|
|
22
22
|
};
|
|
23
23
|
decorators: ((Story: import("storybook/internal/csf").PartialStoryFn<import("@storybook/react-webpack5").ReactRenderer, {
|
|
24
|
+
title?: import("react").ReactNode;
|
|
25
|
+
children: import("react").ReactNode;
|
|
24
26
|
className?: string | undefined | undefined;
|
|
25
27
|
style?: import("react").CSSProperties | undefined;
|
|
26
|
-
|
|
28
|
+
key?: import("react").Key | null | undefined;
|
|
29
|
+
color?: string | undefined | undefined;
|
|
30
|
+
content?: string | undefined | undefined;
|
|
31
|
+
translate?: "yes" | "no" | undefined | undefined;
|
|
32
|
+
motion?: (typeof motion)[number] | undefined;
|
|
33
|
+
slot?: string | undefined | undefined;
|
|
27
34
|
defaultChecked?: boolean | undefined | undefined;
|
|
28
35
|
defaultValue?: string | number | readonly string[] | undefined;
|
|
29
36
|
suppressContentEditableWarning?: boolean | undefined | undefined;
|
|
@@ -40,15 +47,11 @@ declare const meta: {
|
|
|
40
47
|
id?: string | undefined | undefined;
|
|
41
48
|
lang?: string | undefined | undefined;
|
|
42
49
|
nonce?: string | undefined | undefined;
|
|
43
|
-
slot?: string | undefined | undefined;
|
|
44
50
|
spellCheck?: (boolean | "true" | "false") | undefined;
|
|
45
51
|
tabIndex?: number | undefined | undefined;
|
|
46
|
-
title?: import("react").ReactNode;
|
|
47
|
-
translate?: "yes" | "no" | undefined | undefined;
|
|
48
52
|
radioGroup?: string | undefined | undefined;
|
|
49
53
|
role?: import("react").AriaRole | undefined;
|
|
50
54
|
about?: string | undefined | undefined;
|
|
51
|
-
content?: string | undefined | undefined;
|
|
52
55
|
datatype?: string | undefined | undefined;
|
|
53
56
|
inlist?: any;
|
|
54
57
|
prefix?: string | undefined | undefined;
|
|
@@ -60,7 +63,6 @@ declare const meta: {
|
|
|
60
63
|
vocab?: string | undefined | undefined;
|
|
61
64
|
autoCorrect?: string | undefined | undefined;
|
|
62
65
|
autoSave?: string | undefined | undefined;
|
|
63
|
-
color?: string | undefined | undefined;
|
|
64
66
|
itemProp?: string | undefined | undefined;
|
|
65
67
|
itemScope?: boolean | undefined | undefined;
|
|
66
68
|
itemType?: string | undefined | undefined;
|
|
@@ -287,10 +289,8 @@ declare const meta: {
|
|
|
287
289
|
onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
|
|
288
290
|
onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
289
291
|
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
|
|
290
|
-
key?: import("react").Key | null | undefined;
|
|
291
|
-
variant?: (typeof variant)[number] | undefined;
|
|
292
|
-
motion?: (typeof motion)[number] | undefined;
|
|
293
292
|
action?: import("./notice-type").NoticeAction | undefined;
|
|
293
|
+
variant?: (typeof variant)[number] | undefined;
|
|
294
294
|
ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
|
|
295
295
|
}>) => import("react/jsx-runtime").JSX.Element)[];
|
|
296
296
|
};
|
|
@@ -38,9 +38,17 @@ declare const meta: {
|
|
|
38
38
|
animated: true;
|
|
39
39
|
};
|
|
40
40
|
decorators: ((Story: import("storybook/internal/csf").PartialStoryFn<import("@storybook/react-webpack5").ReactRenderer, {
|
|
41
|
+
title?: string | undefined | undefined;
|
|
42
|
+
children?: import("react").ReactNode;
|
|
41
43
|
className?: string | undefined | undefined;
|
|
42
44
|
style?: import("react").CSSProperties | undefined;
|
|
43
|
-
|
|
45
|
+
key?: import("react").Key | null | undefined;
|
|
46
|
+
color?: string | undefined | undefined;
|
|
47
|
+
content?: string | undefined | undefined;
|
|
48
|
+
height?: number | string | undefined;
|
|
49
|
+
translate?: "yes" | "no" | undefined | undefined;
|
|
50
|
+
width?: number | string | undefined;
|
|
51
|
+
slot?: string | undefined | undefined;
|
|
44
52
|
defaultChecked?: boolean | undefined | undefined;
|
|
45
53
|
defaultValue?: string | number | readonly string[] | undefined;
|
|
46
54
|
suppressContentEditableWarning?: boolean | undefined | undefined;
|
|
@@ -57,15 +65,11 @@ declare const meta: {
|
|
|
57
65
|
id?: string | undefined | undefined;
|
|
58
66
|
lang?: string | undefined | undefined;
|
|
59
67
|
nonce?: string | undefined | undefined;
|
|
60
|
-
slot?: string | undefined | undefined;
|
|
61
68
|
spellCheck?: (boolean | "true" | "false") | undefined;
|
|
62
69
|
tabIndex?: number | undefined | undefined;
|
|
63
|
-
title?: string | undefined | undefined;
|
|
64
|
-
translate?: "yes" | "no" | undefined | undefined;
|
|
65
70
|
radioGroup?: string | undefined | undefined;
|
|
66
71
|
role?: import("react").AriaRole | undefined;
|
|
67
72
|
about?: string | undefined | undefined;
|
|
68
|
-
content?: string | undefined | undefined;
|
|
69
73
|
datatype?: string | undefined | undefined;
|
|
70
74
|
inlist?: any;
|
|
71
75
|
prefix?: string | undefined | undefined;
|
|
@@ -77,7 +81,6 @@ declare const meta: {
|
|
|
77
81
|
vocab?: string | undefined | undefined;
|
|
78
82
|
autoCorrect?: string | undefined | undefined;
|
|
79
83
|
autoSave?: string | undefined | undefined;
|
|
80
|
-
color?: string | undefined | undefined;
|
|
81
84
|
itemProp?: string | undefined | undefined;
|
|
82
85
|
itemScope?: boolean | undefined | undefined;
|
|
83
86
|
itemType?: string | undefined | undefined;
|
|
@@ -304,9 +307,6 @@ declare const meta: {
|
|
|
304
307
|
onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
|
|
305
308
|
onTransitionEnd?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
|
|
306
309
|
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
|
|
307
|
-
key?: import("react").Key | null | undefined;
|
|
308
|
-
height?: number | string | undefined;
|
|
309
|
-
width?: number | string | undefined;
|
|
310
310
|
shape?: (typeof shapes)[number] | undefined;
|
|
311
311
|
lines?: number | undefined;
|
|
312
312
|
animated?: boolean | undefined;
|
|
@@ -17,8 +17,21 @@ declare const meta: {
|
|
|
17
17
|
variant: "default";
|
|
18
18
|
};
|
|
19
19
|
decorators: ((Story: import("storybook/internal/csf").PartialStoryFn<import("@storybook/react-webpack5").ReactRenderer, {
|
|
20
|
+
title: import("react").ReactNode;
|
|
21
|
+
description?: import("react").ReactNode;
|
|
22
|
+
open?: boolean | undefined;
|
|
23
|
+
defaultOpen?: boolean | undefined;
|
|
24
|
+
onOpenChange?: ((open: boolean) => void) | undefined;
|
|
20
25
|
className?: string | undefined;
|
|
21
26
|
style?: import("react").CSSProperties | undefined;
|
|
27
|
+
track?: string | undefined;
|
|
28
|
+
trackProps?: Record<string, string | number | boolean> | undefined;
|
|
29
|
+
key?: import("react").Key | null | undefined;
|
|
30
|
+
color?: string | undefined | undefined;
|
|
31
|
+
content?: string | undefined | undefined;
|
|
32
|
+
translate?: "yes" | "no" | undefined | undefined;
|
|
33
|
+
slot?: string | undefined | undefined;
|
|
34
|
+
value?: string | number | readonly string[] | undefined;
|
|
22
35
|
defaultChecked?: boolean | undefined | undefined;
|
|
23
36
|
defaultValue?: string | number | readonly string[] | undefined;
|
|
24
37
|
suppressContentEditableWarning?: boolean | undefined | undefined;
|
|
@@ -35,15 +48,11 @@ declare const meta: {
|
|
|
35
48
|
id?: string | undefined | undefined;
|
|
36
49
|
lang?: string | undefined | undefined;
|
|
37
50
|
nonce?: string | undefined | undefined;
|
|
38
|
-
slot?: string | undefined | undefined;
|
|
39
51
|
spellCheck?: (boolean | "true" | "false") | undefined;
|
|
40
52
|
tabIndex?: number | undefined | undefined;
|
|
41
|
-
title: import("react").ReactNode;
|
|
42
|
-
translate?: "yes" | "no" | undefined | undefined;
|
|
43
53
|
radioGroup?: string | undefined | undefined;
|
|
44
54
|
role?: import("react").AriaRole | undefined;
|
|
45
55
|
about?: string | undefined | undefined;
|
|
46
|
-
content?: string | undefined | undefined;
|
|
47
56
|
datatype?: string | undefined | undefined;
|
|
48
57
|
inlist?: any;
|
|
49
58
|
prefix?: string | undefined | undefined;
|
|
@@ -55,7 +64,6 @@ declare const meta: {
|
|
|
55
64
|
vocab?: string | undefined | undefined;
|
|
56
65
|
autoCorrect?: string | undefined | undefined;
|
|
57
66
|
autoSave?: string | undefined | undefined;
|
|
58
|
-
color?: string | undefined | undefined;
|
|
59
67
|
itemProp?: string | undefined | undefined;
|
|
60
68
|
itemScope?: boolean | undefined | undefined;
|
|
61
69
|
itemType?: string | undefined | undefined;
|
|
@@ -282,18 +290,10 @@ declare const meta: {
|
|
|
282
290
|
onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLLIElement> | undefined;
|
|
283
291
|
onTransitionEnd?: import("react").TransitionEventHandler<HTMLLIElement> | undefined;
|
|
284
292
|
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLLIElement> | undefined;
|
|
285
|
-
|
|
286
|
-
key?: import("react").Key | null | undefined;
|
|
287
|
-
value?: string | number | readonly string[] | undefined;
|
|
293
|
+
action?: import("./toast-type").ToastAction | undefined;
|
|
288
294
|
variant?: (typeof variants)[number] | undefined;
|
|
289
|
-
trackProps?: Record<string, string | number | boolean> | undefined;
|
|
290
|
-
open?: boolean | undefined;
|
|
291
|
-
defaultOpen?: boolean | undefined;
|
|
292
|
-
onOpenChange?: ((open: boolean) => void) | undefined;
|
|
293
295
|
onResume?: (() => void) | undefined;
|
|
294
296
|
duration?: number | undefined;
|
|
295
|
-
description?: import("react").ReactNode;
|
|
296
|
-
action?: import("./toast-type").ToastAction | undefined;
|
|
297
297
|
showClose?: boolean | undefined;
|
|
298
298
|
ref?: import("react").LegacyRef<HTMLLIElement> | undefined;
|
|
299
299
|
}>) => import("react/jsx-runtime").JSX.Element)[];
|
package/dist/components.css
CHANGED
|
@@ -1645,6 +1645,13 @@
|
|
|
1645
1645
|
gap: var(--spacing-10);
|
|
1646
1646
|
}
|
|
1647
1647
|
|
|
1648
|
+
/* popper 는 높이를 정하지 않아 긴 목록(나라 221개)이 화면 밖으로 넘치고 스크롤도 안 된다.
|
|
1649
|
+
화면에 남은 높이까지만 쓰고 Viewport 가 스크롤한다 */
|
|
1650
|
+
|
|
1651
|
+
.base-drop-down.content {
|
|
1652
|
+
max-height: var(--radix-select-content-available-height);
|
|
1653
|
+
}
|
|
1654
|
+
|
|
1648
1655
|
/***************************************************************************************************
|
|
1649
1656
|
* *
|
|
1650
1657
|
* drop-down-single *
|
package/dist/styles.css
CHANGED
|
@@ -1959,6 +1959,11 @@ p {
|
|
|
1959
1959
|
justify-content: space-between;
|
|
1960
1960
|
gap: var(--spacing-10);
|
|
1961
1961
|
}
|
|
1962
|
+
/* popper 는 높이를 정하지 않아 긴 목록(나라 221개)이 화면 밖으로 넘치고 스크롤도 안 된다.
|
|
1963
|
+
화면에 남은 높이까지만 쓰고 Viewport 가 스크롤한다 */
|
|
1964
|
+
.base-drop-down.content {
|
|
1965
|
+
max-height: var(--radix-select-content-available-height);
|
|
1966
|
+
}
|
|
1962
1967
|
/***************************************************************************************************
|
|
1963
1968
|
* *
|
|
1964
1969
|
* drop-down-single *
|