@teamturing/react-kit 2.15.1 → 2.16.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/core/ActionList/ActionListItem.d.ts +15 -0
- package/dist/core/ActionList/ActionListSectionDivider.d.ts +5 -0
- package/dist/core/ActionList/ActionListSectionHeader.d.ts +6 -0
- package/dist/core/ActionList/index.d.ts +24 -0
- package/dist/core/Avatar/index.d.ts +1 -1
- package/dist/core/Button/index.d.ts +1 -1
- package/dist/core/GradientText/index.d.ts +7 -7
- package/dist/core/Grid/index.d.ts +2 -2
- package/dist/core/IconButton/index.d.ts +2 -2
- package/dist/core/Overlay/index.d.ts +2 -0
- package/dist/core/Pagination/index.d.ts +17 -17
- package/dist/core/Pill/index.d.ts +1 -1
- package/dist/core/Select/index.d.ts +6 -6
- package/dist/core/Spinner/index.d.ts +23 -23
- package/dist/core/Stack/index.d.ts +2 -2
- package/dist/hook/useSafeLayoutEffect.d.ts +2 -2
- package/dist/index.d.ts +2 -0
- package/dist/index.js +16166 -15808
- package/esm/core/ActionList/ActionListItem.js +292 -0
- package/esm/core/ActionList/ActionListSectionDivider.js +20 -0
- package/esm/core/ActionList/ActionListSectionHeader.js +37 -0
- package/esm/core/ActionList/index.js +36 -0
- package/esm/core/Overlay/index.js +9 -1
- package/esm/core/OverlayPopper/index.js +1 -0
- package/esm/index.js +1 -0
- package/package.json +2 -2
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { ElementType, PropsWithChildren, ReactNode, MouseEvent as ReactMouseEvent, KeyboardEvent as ReactKeyboardEvent } from 'react';
|
|
2
|
+
import { SxProp } from '../../utils/styled-system';
|
|
3
|
+
type Props = {
|
|
4
|
+
variant?: 'neutral' | 'danger';
|
|
5
|
+
leadingVisual?: ElementType | ReactNode;
|
|
6
|
+
trailingVisual?: ElementType | ReactNode;
|
|
7
|
+
description?: string;
|
|
8
|
+
descriptionLayout?: 'inline' | 'block';
|
|
9
|
+
disabled?: boolean;
|
|
10
|
+
selected?: boolean;
|
|
11
|
+
onSelect?: (event: ReactMouseEvent<HTMLLIElement> | ReactKeyboardEvent<HTMLLIElement>) => void;
|
|
12
|
+
} & SxProp;
|
|
13
|
+
declare const ActionListItem: ({ variant, leadingVisual: LeadingVisual, trailingVisual: TrailingVisual, description, descriptionLayout, disabled, selected, onSelect: propOnSelect, children, sx, }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
export default ActionListItem;
|
|
15
|
+
export type { Props as ActionListItemProps };
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { HorizontalDividerProps } from '../HorizontalDivider';
|
|
2
|
+
type Props = {} & HorizontalDividerProps;
|
|
3
|
+
declare const ActionListSectionDivider: ({ color, variant, width, sx }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export default ActionListSectionDivider;
|
|
5
|
+
export type { Props as ActionListSectionDividerProps };
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { PropsWithChildren } from 'react';
|
|
2
|
+
import { SxProp } from '../../utils/styled-system';
|
|
3
|
+
type Props = {} & SxProp;
|
|
4
|
+
declare const ActionListSectionHeader: ({ ...props }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export default ActionListSectionHeader;
|
|
6
|
+
export type { Props as ActionListSectionHeaderProps };
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { PropsWithChildren } from 'react';
|
|
2
|
+
import { SxProp } from '../../utils/styled-system';
|
|
3
|
+
import { ActionListItemProps } from './ActionListItem';
|
|
4
|
+
import { ActionListSectionDividerProps } from './ActionListSectionDivider';
|
|
5
|
+
import { ActionListSectionHeaderProps } from './ActionListSectionHeader';
|
|
6
|
+
type Props = {
|
|
7
|
+
/**
|
|
8
|
+
* ActionList의 아이템에 선택이 되어있다는 것을 표시할 때 사용하는 속성입니다.
|
|
9
|
+
* `undefine`: 선택에 대한 표시를 하지 않습니다.
|
|
10
|
+
* `single`: 하나의 선택된 아이템에 대해, CheckIcon을 보여줍니다.
|
|
11
|
+
* `multiple`: 모든 아이템에 Checkbox를 표시합니다.
|
|
12
|
+
*/
|
|
13
|
+
selectionVariant?: 'single' | 'multiple';
|
|
14
|
+
} & SxProp;
|
|
15
|
+
type ActionListContextValue = {} & Pick<Props, 'selectionVariant'>;
|
|
16
|
+
declare const ActionListContext: import("react").Context<Pick<Props, "selectionVariant">>;
|
|
17
|
+
declare const _default: (({ ...props }: PropsWithChildren<Props>) => import("react/jsx-runtime").JSX.Element) & {
|
|
18
|
+
Item: ({ variant, leadingVisual: LeadingVisual, trailingVisual: TrailingVisual, description, descriptionLayout, disabled, selected, onSelect: propOnSelect, children, sx, }: PropsWithChildren<ActionListItemProps>) => import("react/jsx-runtime").JSX.Element;
|
|
19
|
+
SectionDivider: ({ color, variant, width, sx }: ActionListSectionDividerProps) => import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
SectionHeader: ({ ...props }: PropsWithChildren<SxProp>) => import("react/jsx-runtime").JSX.Element;
|
|
21
|
+
};
|
|
22
|
+
export default _default;
|
|
23
|
+
export { ActionListContext };
|
|
24
|
+
export type { Props as ActionListProps, ActionListContextValue, ActionListItemProps, ActionListSectionDividerProps, ActionListSectionHeaderProps, };
|
|
@@ -8,6 +8,6 @@ type Props = {
|
|
|
8
8
|
} & Pick<ImageProps, 'src' | 'alt'> & SxProp;
|
|
9
9
|
declare const _default: import("react").ForwardRefExoticComponent<{
|
|
10
10
|
size?: ResponsiveValue<AvatarSizeType> | undefined;
|
|
11
|
-
} & Pick<ImageProps, "
|
|
11
|
+
} & Pick<ImageProps, "alt" | "src"> & SxProp & import("react").RefAttributes<HTMLImageElement>>;
|
|
12
12
|
export default _default;
|
|
13
13
|
export type { Props as AvatarProps };
|
|
@@ -43,7 +43,7 @@ declare const Button: import("react").ForwardRefExoticComponent<{
|
|
|
43
43
|
* 색을 정의합니다.
|
|
44
44
|
* hover, active, focused, disabled, loading 등의 모든 상황에 관여합니다.
|
|
45
45
|
*/
|
|
46
|
-
variant?: "
|
|
46
|
+
variant?: "neutral" | "danger" | "primary" | "secondary" | "outlined" | "plain" | undefined;
|
|
47
47
|
/**
|
|
48
48
|
* 감싸고 있는 컨테이너의 너비를 채웁니다.
|
|
49
49
|
*/
|
|
@@ -50,11 +50,11 @@ declare const GradientText: import("styled-components").IStyledComponent<"web",
|
|
|
50
50
|
results?: number | undefined;
|
|
51
51
|
security?: string | undefined;
|
|
52
52
|
unselectable?: "on" | "off" | undefined;
|
|
53
|
-
inputMode?: "none" | "
|
|
53
|
+
inputMode?: "none" | "search" | "text" | "email" | "tel" | "url" | "numeric" | "decimal" | undefined;
|
|
54
54
|
is?: string | undefined;
|
|
55
55
|
'aria-activedescendant'?: string | undefined;
|
|
56
56
|
'aria-atomic'?: (boolean | "false" | "true") | undefined;
|
|
57
|
-
'aria-autocomplete'?: "none" | "
|
|
57
|
+
'aria-autocomplete'?: "none" | "list" | "both" | "inline" | undefined;
|
|
58
58
|
'aria-braillelabel'?: string | undefined;
|
|
59
59
|
'aria-brailleroledescription'?: string | undefined;
|
|
60
60
|
'aria-busy'?: (boolean | "false" | "true") | undefined;
|
|
@@ -64,17 +64,17 @@ declare const GradientText: import("styled-components").IStyledComponent<"web",
|
|
|
64
64
|
'aria-colindextext'?: string | undefined;
|
|
65
65
|
'aria-colspan'?: number | undefined;
|
|
66
66
|
'aria-controls'?: string | undefined;
|
|
67
|
-
'aria-current'?: boolean | "page" | "
|
|
67
|
+
'aria-current'?: boolean | "page" | "step" | "time" | "date" | "false" | "true" | "location" | undefined;
|
|
68
68
|
'aria-describedby'?: string | undefined;
|
|
69
69
|
'aria-description'?: string | undefined;
|
|
70
70
|
'aria-details'?: string | undefined;
|
|
71
71
|
'aria-disabled'?: (boolean | "false" | "true") | undefined;
|
|
72
|
-
'aria-dropeffect'?: "none" | "
|
|
72
|
+
'aria-dropeffect'?: "none" | "link" | "copy" | "move" | "execute" | "popup" | undefined;
|
|
73
73
|
'aria-errormessage'?: string | undefined;
|
|
74
74
|
'aria-expanded'?: (boolean | "false" | "true") | undefined;
|
|
75
75
|
'aria-flowto'?: string | undefined;
|
|
76
76
|
'aria-grabbed'?: (boolean | "false" | "true") | undefined;
|
|
77
|
-
'aria-haspopup'?: boolean | "grid" | "
|
|
77
|
+
'aria-haspopup'?: boolean | "grid" | "dialog" | "menu" | "listbox" | "false" | "true" | "tree" | undefined;
|
|
78
78
|
'aria-hidden'?: (boolean | "false" | "true") | undefined;
|
|
79
79
|
'aria-invalid'?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
|
|
80
80
|
'aria-keyshortcuts'?: string | undefined;
|
|
@@ -272,8 +272,8 @@ declare const GradientText: import("styled-components").IStyledComponent<"web",
|
|
|
272
272
|
onTransitionEnd?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
|
|
273
273
|
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
|
|
274
274
|
} & {
|
|
275
|
-
typography?: import("styled-system").ResponsiveValue<"m" | "
|
|
276
|
-
} & import("../..").SxProp & import("../../utils/styled-system").WordBreakProps & import("../../utils/styled-system").WhiteSpaceProps & import("../../utils/styled-system").TextDecorationProps & import("styled-system").FontSizeProps<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>, "m" | "
|
|
275
|
+
typography?: import("styled-system").ResponsiveValue<"m" | "s" | "xxs" | "xs" | "l" | "xl" | "xxl" | "display1" | "display2" | "display3" | "display4" | "xxl/regular" | "xxl/bold" | "xl/regular" | "xl/bold" | "l/regular" | "l/bold" | "m/regular" | "m/bold" | "s/regular" | "s/bold" | "xs/regular" | "xs/bold" | "xxs/regular" | "xxs/bold"> | undefined;
|
|
276
|
+
} & import("../..").SxProp & import("../../utils/styled-system").WordBreakProps & import("../../utils/styled-system").WhiteSpaceProps & import("../../utils/styled-system").TextDecorationProps & import("styled-system").FontSizeProps<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>, "m" | "s" | "xxs" | "xs" | "l" | "xl" | "xxl" | "display1" | "display2" | "display3" | "display4"> & import("styled-system").FontWeightProps<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>, "medium" | "bold" | "regular"> & import("styled-system").LineHeightProps<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>, 1 | 2> & import("styled-system").TextAlignProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & import("styled-system").ColorProps<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>, "link" | "border/neutral" | "icon/inverse" | "bg/disabled" | "border/disabled" | "bg/primary" | "icon/disabled" | "border/focused" | "border/danger" | "scale/violet/0" | "scale/violet/1" | "scale/violet/2" | "scale/violet/3" | "scale/violet/4" | "scale/violet/5" | "scale/violet/6" | "scale/violet/7" | "scale/violet/8" | "scale/violet/9" | "dim" | "link/hovered" | "link/pressed" | "link/neutral" | "link/neutral/hovered" | "link/neutral/pressed" | "link/neutral/bold" | "link/neutral/bold/hovered" | "link/neutral/bold/pressed" | "link/disabled" | "icon/neutral" | "icon/neutral/bold" | "icon/neutral/bolder" | "icon/accent/gray" | "icon/accent/blue" | "icon/accent/blue/bold" | "icon/accent/green" | "icon/accent/yellow" | "icon/accent/red" | "icon/disabled/subtler" | "icon/selected/violet" | "icon/selected" | "icon/primary/subtle" | "icon/primary" | "icon/primary/bold" | "icon/success" | "icon/warning" | "icon/danger" | "border/neutral/subtle" | "border/neutral/bolder" | "border/input" | "border/inverse" | "border/selected" | "border/primary" | "border/hovered" | "border/success" | "bg/secondary" | "bg/secondary/hovered" | "bg/secondary/pressed" | "bg/primary/hovered" | "bg/primary/pressed" | "bg/neutral/subtler" | "bg/neutral/subtler/hovered" | "bg/neutral/subtler/pressed" | "bg/neutral/subtle" | "bg/neutral/subtle/hovered" | "bg/neutral/subtle/pressed" | "bg/neutral" | "bg/neutral/hovered" | "bg/neutral/pressed" | "bg/neutral/bold" | "bg/neutral/bold/hovered" | "bg/neutral/bold/pressed" | "bg/neutral/bolder" | "bg/neutral/bolder/hovered" | "bg/neutral/bolder/pressed" | "bg/disabled/subtlest" | "bg/input" | "bg/accent/blue/subtlest" | "bg/accent/green/subtlest" | "bg/accent/yellow/subtlest" | "bg/accent/red/subtlest" | "bg/accent/red/subtle" | "bg/accent/red" | "bg/accent/gray/subtlest" | "bg/selected/violet" | "bg/selected" | "bg/selected/subtle" | "bg/inverse" | "bg/inverse/subtlest" | "bg/success" | "bg/success/bold" | "bg/warning" | "bg/warning/bold" | "bg/danger" | "bg/danger/bold" | "bg/danger/bold/hovered" | "bg/danger/bold/pressed" | "text/primary" | "text/accent/blue" | "text/accent/green" | "text/accent/yellow" | "text/accent/red" | "text/neutral/subtlest" | "text/neutral/subtler" | "text/neutral/subtle" | "text/neutral" | "text/inverse" | "text/inverse/subtle" | "text/inverse/subtler" | "text/disabled" | "text/success" | "text/warning" | "text/danger" | "text/selected">, "ref"> & {
|
|
277
277
|
ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
|
|
278
278
|
}, Props>>;
|
|
279
279
|
export default GradientText;
|
|
@@ -13,8 +13,8 @@ type GridUnitProps = {
|
|
|
13
13
|
size: ResponsiveValue<UnitSizeType>;
|
|
14
14
|
} & Pick<ViewProps, 'order' | 'sx'> & AsProp;
|
|
15
15
|
declare const _default: import("react").ForwardRefExoticComponent<{
|
|
16
|
-
gapX?: ResponsiveValue<0 | 1 |
|
|
17
|
-
gapY?: ResponsiveValue<0 | 1 |
|
|
16
|
+
gapX?: ResponsiveValue<0 | 1 | 20 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 10 | 12 | 14 | 16 | 18 | "-80" | "-50" | "-48" | "-40" | "-32" | "-30" | "-28" | "-24" | "-20" | "-18" | "-16" | "-14" | "-12" | "-10" | "-8" | "-7" | "-6" | "-5" | "-4" | "-3" | "-2" | "-1" | "-0.5" | "-0.25" | 0.25 | 0.5 | 24 | 28 | 30 | 32 | 40 | 48 | 50 | 80> | undefined;
|
|
17
|
+
gapY?: ResponsiveValue<0 | 1 | 20 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 10 | 12 | 14 | 16 | 18 | "-80" | "-50" | "-48" | "-40" | "-32" | "-30" | "-28" | "-24" | "-20" | "-18" | "-16" | "-14" | "-12" | "-10" | "-8" | "-7" | "-6" | "-5" | "-4" | "-3" | "-2" | "-1" | "-0.5" | "-0.25" | 0.25 | 0.5 | 24 | 28 | 30 | 32 | 40 | 48 | 50 | 80> | undefined;
|
|
18
18
|
wrap?: ResponsiveValue<boolean> | undefined;
|
|
19
19
|
} & Pick<ViewProps, "alignItems" | "justifyContent" | "sx"> & AsProp & {
|
|
20
20
|
children?: import("react").ReactNode;
|
|
@@ -39,7 +39,7 @@ declare const IconButton: import("react").ForwardRefExoticComponent<{
|
|
|
39
39
|
* 색을 정의합니다.
|
|
40
40
|
* hover, active, focused, disabled, loading 등의 모든 상황에 관여합니다.
|
|
41
41
|
*/
|
|
42
|
-
variant?: "
|
|
42
|
+
variant?: "neutral" | "danger" | "primary" | "secondary" | "outlined" | "plain" | "plain-bold" | "plain-subtle" | undefined;
|
|
43
43
|
/**
|
|
44
44
|
* 비활성화 상태를 정의합니다.
|
|
45
45
|
*/
|
|
@@ -48,6 +48,6 @@ declare const IconButton: import("react").ForwardRefExoticComponent<{
|
|
|
48
48
|
* 로딩 상태를 정의합니다.
|
|
49
49
|
*/
|
|
50
50
|
loading?: boolean | undefined;
|
|
51
|
-
} & Pick<UnstyledButtonProps, "
|
|
51
|
+
} & Pick<UnstyledButtonProps, "type" | "onClick"> & import("react").RefAttributes<HTMLButtonElement>>;
|
|
52
52
|
export default IconButton;
|
|
53
53
|
export type { Props as IconButtonProps };
|
|
@@ -5,12 +5,14 @@ type Props = {
|
|
|
5
5
|
onDismiss?: () => void;
|
|
6
6
|
size?: ResponsiveValue<'m'>;
|
|
7
7
|
ignoreOutsideClickRefs?: RefObject<HTMLElement>[];
|
|
8
|
+
dismissFocusRef?: RefObject<HTMLElement>;
|
|
8
9
|
} & HTMLAttributes<HTMLElement>;
|
|
9
10
|
declare const _default: import("react").ForwardRefExoticComponent<{
|
|
10
11
|
isOpen?: boolean | undefined;
|
|
11
12
|
onDismiss?: (() => void) | undefined;
|
|
12
13
|
size?: ResponsiveValue<"m"> | undefined;
|
|
13
14
|
ignoreOutsideClickRefs?: RefObject<HTMLElement>[] | undefined;
|
|
15
|
+
dismissFocusRef?: RefObject<HTMLElement> | undefined;
|
|
14
16
|
} & HTMLAttributes<HTMLElement> & {
|
|
15
17
|
children?: import("react").ReactNode;
|
|
16
18
|
} & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -44,6 +44,18 @@ declare const _default: (<T extends {
|
|
|
44
44
|
translate?: "yes" | "no" | undefined;
|
|
45
45
|
hidden?: boolean | undefined;
|
|
46
46
|
property?: string | undefined;
|
|
47
|
+
type?: "button" | "reset" | "submit" | undefined;
|
|
48
|
+
disabled?: boolean | undefined;
|
|
49
|
+
form?: string | undefined;
|
|
50
|
+
formAction?: string | undefined;
|
|
51
|
+
formEncType?: string | undefined;
|
|
52
|
+
formMethod?: string | undefined;
|
|
53
|
+
formNoValidate?: boolean | undefined;
|
|
54
|
+
formTarget?: string | undefined;
|
|
55
|
+
name?: string | undefined;
|
|
56
|
+
placeholder?: string | undefined;
|
|
57
|
+
value?: string | number | readonly string[] | undefined;
|
|
58
|
+
onChange?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
|
|
47
59
|
defaultChecked?: boolean | undefined;
|
|
48
60
|
defaultValue?: string | number | readonly string[] | undefined;
|
|
49
61
|
suppressContentEditableWarning?: boolean | undefined;
|
|
@@ -58,7 +70,6 @@ declare const _default: (<T extends {
|
|
|
58
70
|
id?: string | undefined;
|
|
59
71
|
lang?: string | undefined;
|
|
60
72
|
nonce?: string | undefined;
|
|
61
|
-
placeholder?: string | undefined;
|
|
62
73
|
slot?: string | undefined;
|
|
63
74
|
spellCheck?: (boolean | "false" | "true") | undefined;
|
|
64
75
|
style?: import("react").CSSProperties | undefined;
|
|
@@ -86,11 +97,11 @@ declare const _default: (<T extends {
|
|
|
86
97
|
results?: number | undefined;
|
|
87
98
|
security?: string | undefined;
|
|
88
99
|
unselectable?: "on" | "off" | undefined;
|
|
89
|
-
inputMode?: "none" | "
|
|
100
|
+
inputMode?: "none" | "search" | "text" | "email" | "tel" | "url" | "numeric" | "decimal" | undefined;
|
|
90
101
|
is?: string | undefined;
|
|
91
102
|
'aria-activedescendant'?: string | undefined;
|
|
92
103
|
'aria-atomic'?: (boolean | "false" | "true") | undefined;
|
|
93
|
-
'aria-autocomplete'?: "none" | "
|
|
104
|
+
'aria-autocomplete'?: "none" | "list" | "both" | "inline" | undefined;
|
|
94
105
|
'aria-braillelabel'?: string | undefined;
|
|
95
106
|
'aria-brailleroledescription'?: string | undefined;
|
|
96
107
|
'aria-busy'?: (boolean | "false" | "true") | undefined;
|
|
@@ -100,17 +111,17 @@ declare const _default: (<T extends {
|
|
|
100
111
|
'aria-colindextext'?: string | undefined;
|
|
101
112
|
'aria-colspan'?: number | undefined;
|
|
102
113
|
'aria-controls'?: string | undefined;
|
|
103
|
-
'aria-current'?: boolean | "page" | "
|
|
114
|
+
'aria-current'?: boolean | "page" | "step" | "time" | "date" | "false" | "true" | "location" | undefined;
|
|
104
115
|
'aria-describedby'?: string | undefined;
|
|
105
116
|
'aria-description'?: string | undefined;
|
|
106
117
|
'aria-details'?: string | undefined;
|
|
107
118
|
'aria-disabled'?: (boolean | "false" | "true") | undefined;
|
|
108
|
-
'aria-dropeffect'?: "none" | "
|
|
119
|
+
'aria-dropeffect'?: "none" | "link" | "copy" | "move" | "execute" | "popup" | undefined;
|
|
109
120
|
'aria-errormessage'?: string | undefined;
|
|
110
121
|
'aria-expanded'?: (boolean | "false" | "true") | undefined;
|
|
111
122
|
'aria-flowto'?: string | undefined;
|
|
112
123
|
'aria-grabbed'?: (boolean | "false" | "true") | undefined;
|
|
113
|
-
'aria-haspopup'?: boolean | "grid" | "
|
|
124
|
+
'aria-haspopup'?: boolean | "grid" | "dialog" | "menu" | "listbox" | "false" | "true" | "tree" | undefined;
|
|
114
125
|
'aria-hidden'?: (boolean | "false" | "true") | undefined;
|
|
115
126
|
'aria-invalid'?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
|
|
116
127
|
'aria-keyshortcuts'?: string | undefined;
|
|
@@ -161,7 +172,6 @@ declare const _default: (<T extends {
|
|
|
161
172
|
onFocusCapture?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
|
|
162
173
|
onBlur?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
|
|
163
174
|
onBlurCapture?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
|
|
164
|
-
onChange?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
|
|
165
175
|
onChangeCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
|
|
166
176
|
onBeforeInput?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
|
|
167
177
|
onBeforeInputCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
|
|
@@ -309,16 +319,6 @@ declare const _default: (<T extends {
|
|
|
309
319
|
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
|
|
310
320
|
sx?: BetterSystemStyleObject | undefined;
|
|
311
321
|
key?: import("react").Key | null | undefined;
|
|
312
|
-
form?: string | undefined;
|
|
313
|
-
name?: string | undefined;
|
|
314
|
-
type?: "button" | "reset" | "submit" | undefined;
|
|
315
|
-
disabled?: boolean | undefined;
|
|
316
|
-
formAction?: string | undefined;
|
|
317
|
-
formEncType?: string | undefined;
|
|
318
|
-
formMethod?: string | undefined;
|
|
319
|
-
formNoValidate?: boolean | undefined;
|
|
320
|
-
formTarget?: string | undefined;
|
|
321
|
-
value?: string | number | readonly string[] | undefined;
|
|
322
322
|
ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
|
|
323
323
|
}>;
|
|
324
324
|
TruncationIndicator: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, SxProp>>;
|
|
@@ -41,7 +41,7 @@ declare const _default: import("react").ForwardRefExoticComponent<{
|
|
|
41
41
|
/**
|
|
42
42
|
* text 앞에 보여질 시각적 요소를 정의합니다. Icon, Image 등이 될 수 있습니다.
|
|
43
43
|
*/
|
|
44
|
-
leadingVisual?: string | number | boolean | import("react").
|
|
44
|
+
leadingVisual?: string | number | boolean | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | Iterable<ReactNode> | import("react").ReactPortal | null | undefined;
|
|
45
45
|
/**
|
|
46
46
|
* 없앨 수 있을 때 onRemove를 넘기면 삭제 버튼이 trailingVisual 자리에 생깁니다.
|
|
47
47
|
*/
|
|
@@ -17,7 +17,7 @@ declare const _default: import("react").ForwardRefExoticComponent<{
|
|
|
17
17
|
/**
|
|
18
18
|
* 입력 창 앞에 보여질 시각적 요소를 정의합니다. Icon, Text, Image 등이 될 수 있습니다.
|
|
19
19
|
*/
|
|
20
|
-
leadingVisual?: string | number | boolean | import("react").
|
|
20
|
+
leadingVisual?: string | number | boolean | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | Iterable<ReactNode> | import("react").ReactPortal | null | undefined;
|
|
21
21
|
} & SelectHTMLAttributes<HTMLSelectElement> & import("react").RefAttributes<HTMLSelectElement>> & {
|
|
22
22
|
Option: import("styled-components").IStyledComponent<"web", {
|
|
23
23
|
ref?: import("react").LegacyRef<HTMLOptionElement> | undefined;
|
|
@@ -73,11 +73,11 @@ declare const _default: import("react").ForwardRefExoticComponent<{
|
|
|
73
73
|
results?: number | undefined;
|
|
74
74
|
security?: string | undefined;
|
|
75
75
|
unselectable?: "on" | "off" | undefined;
|
|
76
|
-
inputMode?: "none" | "
|
|
76
|
+
inputMode?: "none" | "search" | "text" | "email" | "tel" | "url" | "numeric" | "decimal" | undefined;
|
|
77
77
|
is?: string | undefined;
|
|
78
78
|
'aria-activedescendant'?: string | undefined;
|
|
79
79
|
'aria-atomic'?: (boolean | "false" | "true") | undefined;
|
|
80
|
-
'aria-autocomplete'?: "none" | "
|
|
80
|
+
'aria-autocomplete'?: "none" | "list" | "both" | "inline" | undefined;
|
|
81
81
|
'aria-braillelabel'?: string | undefined;
|
|
82
82
|
'aria-brailleroledescription'?: string | undefined;
|
|
83
83
|
'aria-busy'?: (boolean | "false" | "true") | undefined;
|
|
@@ -87,17 +87,17 @@ declare const _default: import("react").ForwardRefExoticComponent<{
|
|
|
87
87
|
'aria-colindextext'?: string | undefined;
|
|
88
88
|
'aria-colspan'?: number | undefined;
|
|
89
89
|
'aria-controls'?: string | undefined;
|
|
90
|
-
'aria-current'?: boolean | "page" | "
|
|
90
|
+
'aria-current'?: boolean | "page" | "step" | "time" | "date" | "false" | "true" | "location" | undefined;
|
|
91
91
|
'aria-describedby'?: string | undefined;
|
|
92
92
|
'aria-description'?: string | undefined;
|
|
93
93
|
'aria-details'?: string | undefined;
|
|
94
94
|
'aria-disabled'?: (boolean | "false" | "true") | undefined;
|
|
95
|
-
'aria-dropeffect'?: "none" | "
|
|
95
|
+
'aria-dropeffect'?: "none" | "link" | "copy" | "move" | "execute" | "popup" | undefined;
|
|
96
96
|
'aria-errormessage'?: string | undefined;
|
|
97
97
|
'aria-expanded'?: (boolean | "false" | "true") | undefined;
|
|
98
98
|
'aria-flowto'?: string | undefined;
|
|
99
99
|
'aria-grabbed'?: (boolean | "false" | "true") | undefined;
|
|
100
|
-
'aria-haspopup'?: boolean | "grid" | "
|
|
100
|
+
'aria-haspopup'?: boolean | "grid" | "dialog" | "menu" | "listbox" | "false" | "true" | "tree" | undefined;
|
|
101
101
|
'aria-hidden'?: (boolean | "false" | "true") | undefined;
|
|
102
102
|
'aria-invalid'?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
|
|
103
103
|
'aria-keyshortcuts'?: string | undefined;
|
|
@@ -35,7 +35,7 @@ declare const Spinner: import("styled-components").IStyledComponent<"web", {
|
|
|
35
35
|
offset?: string | number | undefined;
|
|
36
36
|
overflow?: string | number | undefined;
|
|
37
37
|
textDecoration?: string | number | undefined;
|
|
38
|
-
alignmentBaseline?: "inherit" | "auto" | "
|
|
38
|
+
alignmentBaseline?: "inherit" | "auto" | "alphabetic" | "hanging" | "ideographic" | "mathematical" | "baseline" | "middle" | "after-edge" | "before-edge" | "central" | "text-after-edge" | "text-before-edge" | undefined;
|
|
39
39
|
baselineShift?: string | number | undefined;
|
|
40
40
|
clip?: string | number | undefined;
|
|
41
41
|
clipRule?: string | number | undefined;
|
|
@@ -66,7 +66,11 @@ declare const Spinner: import("styled-components").IStyledComponent<"web", {
|
|
|
66
66
|
textAnchor?: string | undefined;
|
|
67
67
|
vectorEffect?: string | number | undefined;
|
|
68
68
|
azimuth?: string | number | undefined;
|
|
69
|
-
|
|
69
|
+
type?: string | undefined;
|
|
70
|
+
max?: string | number | undefined;
|
|
71
|
+
min?: string | number | undefined;
|
|
72
|
+
name?: string | undefined;
|
|
73
|
+
onChange?: import("react").FormEventHandler<SVGSVGElement> | undefined;
|
|
70
74
|
suppressHydrationWarning?: boolean | undefined;
|
|
71
75
|
className?: string | undefined;
|
|
72
76
|
id?: string | undefined;
|
|
@@ -76,7 +80,7 @@ declare const Spinner: import("styled-components").IStyledComponent<"web", {
|
|
|
76
80
|
role?: import("react").AriaRole | undefined;
|
|
77
81
|
'aria-activedescendant'?: string | undefined;
|
|
78
82
|
'aria-atomic'?: (boolean | "false" | "true") | undefined;
|
|
79
|
-
'aria-autocomplete'?: "none" | "
|
|
83
|
+
'aria-autocomplete'?: "none" | "list" | "both" | "inline" | undefined;
|
|
80
84
|
'aria-braillelabel'?: string | undefined;
|
|
81
85
|
'aria-brailleroledescription'?: string | undefined;
|
|
82
86
|
'aria-busy'?: (boolean | "false" | "true") | undefined;
|
|
@@ -86,17 +90,17 @@ declare const Spinner: import("styled-components").IStyledComponent<"web", {
|
|
|
86
90
|
'aria-colindextext'?: string | undefined;
|
|
87
91
|
'aria-colspan'?: number | undefined;
|
|
88
92
|
'aria-controls'?: string | undefined;
|
|
89
|
-
'aria-current'?: boolean | "page" | "
|
|
93
|
+
'aria-current'?: boolean | "page" | "step" | "time" | "date" | "false" | "true" | "location" | undefined;
|
|
90
94
|
'aria-describedby'?: string | undefined;
|
|
91
95
|
'aria-description'?: string | undefined;
|
|
92
96
|
'aria-details'?: string | undefined;
|
|
93
97
|
'aria-disabled'?: (boolean | "false" | "true") | undefined;
|
|
94
|
-
'aria-dropeffect'?: "none" | "
|
|
98
|
+
'aria-dropeffect'?: "none" | "link" | "copy" | "move" | "execute" | "popup" | undefined;
|
|
95
99
|
'aria-errormessage'?: string | undefined;
|
|
96
100
|
'aria-expanded'?: (boolean | "false" | "true") | undefined;
|
|
97
101
|
'aria-flowto'?: string | undefined;
|
|
98
102
|
'aria-grabbed'?: (boolean | "false" | "true") | undefined;
|
|
99
|
-
'aria-haspopup'?: boolean | "grid" | "
|
|
103
|
+
'aria-haspopup'?: boolean | "grid" | "dialog" | "menu" | "listbox" | "false" | "true" | "tree" | undefined;
|
|
100
104
|
'aria-hidden'?: (boolean | "false" | "true") | undefined;
|
|
101
105
|
'aria-invalid'?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
|
|
102
106
|
'aria-keyshortcuts'?: string | undefined;
|
|
@@ -147,7 +151,6 @@ declare const Spinner: import("styled-components").IStyledComponent<"web", {
|
|
|
147
151
|
onFocusCapture?: import("react").FocusEventHandler<SVGSVGElement> | undefined;
|
|
148
152
|
onBlur?: import("react").FocusEventHandler<SVGSVGElement> | undefined;
|
|
149
153
|
onBlurCapture?: import("react").FocusEventHandler<SVGSVGElement> | undefined;
|
|
150
|
-
onChange?: import("react").FormEventHandler<SVGSVGElement> | undefined;
|
|
151
154
|
onChangeCapture?: import("react").FormEventHandler<SVGSVGElement> | undefined;
|
|
152
155
|
onBeforeInput?: import("react").FormEventHandler<SVGSVGElement> | undefined;
|
|
153
156
|
onBeforeInputCapture?: import("react").FormEventHandler<SVGSVGElement> | undefined;
|
|
@@ -293,29 +296,17 @@ declare const Spinner: import("styled-components").IStyledComponent<"web", {
|
|
|
293
296
|
onAnimationIterationCapture?: import("react").AnimationEventHandler<SVGSVGElement> | undefined;
|
|
294
297
|
onTransitionEnd?: import("react").TransitionEventHandler<SVGSVGElement> | undefined;
|
|
295
298
|
onTransitionEndCapture?: import("react").TransitionEventHandler<SVGSVGElement> | undefined;
|
|
296
|
-
values?: string | undefined;
|
|
297
|
-
key?: import("react").Key | null | undefined;
|
|
298
|
-
end?: string | number | undefined;
|
|
299
|
-
accumulate?: "none" | "sum" | undefined;
|
|
300
|
-
local?: string | number | undefined;
|
|
301
|
-
unicode?: string | number | undefined;
|
|
302
|
-
x?: string | number | undefined;
|
|
303
|
-
y?: string | number | undefined;
|
|
304
|
-
alphabetic?: string | number | undefined;
|
|
305
|
-
hanging?: string | number | undefined;
|
|
306
|
-
ideographic?: string | number | undefined;
|
|
307
|
-
mathematical?: string | number | undefined;
|
|
308
299
|
path?: string | undefined;
|
|
309
|
-
|
|
300
|
+
key?: import("react").Key | null | undefined;
|
|
310
301
|
media?: string | undefined;
|
|
311
302
|
method?: string | undefined;
|
|
312
|
-
min?: string | number | undefined;
|
|
313
|
-
name?: string | undefined;
|
|
314
303
|
target?: string | undefined;
|
|
315
|
-
|
|
304
|
+
crossOrigin?: "" | "anonymous" | "use-credentials" | undefined;
|
|
316
305
|
accentHeight?: string | number | undefined;
|
|
306
|
+
accumulate?: "none" | "sum" | undefined;
|
|
317
307
|
additive?: "replace" | "sum" | undefined;
|
|
318
308
|
allowReorder?: "yes" | "no" | undefined;
|
|
309
|
+
alphabetic?: string | number | undefined;
|
|
319
310
|
amplitude?: string | number | undefined;
|
|
320
311
|
arabicForm?: "initial" | "medial" | "terminal" | "isolated" | undefined;
|
|
321
312
|
ascent?: string | number | undefined;
|
|
@@ -348,6 +339,7 @@ declare const Spinner: import("styled-components").IStyledComponent<"web", {
|
|
|
348
339
|
edgeMode?: string | number | undefined;
|
|
349
340
|
elevation?: string | number | undefined;
|
|
350
341
|
enableBackground?: string | number | undefined;
|
|
342
|
+
end?: string | number | undefined;
|
|
351
343
|
exponent?: string | number | undefined;
|
|
352
344
|
externalResourcesRequired?: (boolean | "false" | "true") | undefined;
|
|
353
345
|
filterRes?: string | number | undefined;
|
|
@@ -365,9 +357,11 @@ declare const Spinner: import("styled-components").IStyledComponent<"web", {
|
|
|
365
357
|
glyphRef?: string | number | undefined;
|
|
366
358
|
gradientTransform?: string | undefined;
|
|
367
359
|
gradientUnits?: string | undefined;
|
|
360
|
+
hanging?: string | number | undefined;
|
|
368
361
|
horizAdvX?: string | number | undefined;
|
|
369
362
|
horizOriginX?: string | number | undefined;
|
|
370
363
|
href?: string | undefined;
|
|
364
|
+
ideographic?: string | number | undefined;
|
|
371
365
|
in2?: string | number | undefined;
|
|
372
366
|
in?: string | undefined;
|
|
373
367
|
intercept?: string | number | undefined;
|
|
@@ -384,11 +378,13 @@ declare const Spinner: import("styled-components").IStyledComponent<"web", {
|
|
|
384
378
|
keyTimes?: string | number | undefined;
|
|
385
379
|
lengthAdjust?: string | number | undefined;
|
|
386
380
|
limitingConeAngle?: string | number | undefined;
|
|
381
|
+
local?: string | number | undefined;
|
|
387
382
|
markerHeight?: string | number | undefined;
|
|
388
383
|
markerUnits?: string | number | undefined;
|
|
389
384
|
markerWidth?: string | number | undefined;
|
|
390
385
|
maskContentUnits?: string | number | undefined;
|
|
391
386
|
maskUnits?: string | number | undefined;
|
|
387
|
+
mathematical?: string | number | undefined;
|
|
392
388
|
mode?: string | number | undefined;
|
|
393
389
|
numOctaves?: string | number | undefined;
|
|
394
390
|
operator?: string | number | undefined;
|
|
@@ -447,9 +443,11 @@ declare const Spinner: import("styled-components").IStyledComponent<"web", {
|
|
|
447
443
|
u2?: string | number | undefined;
|
|
448
444
|
underlinePosition?: string | number | undefined;
|
|
449
445
|
underlineThickness?: string | number | undefined;
|
|
446
|
+
unicode?: string | number | undefined;
|
|
450
447
|
unicodeRange?: string | number | undefined;
|
|
451
448
|
unitsPerEm?: string | number | undefined;
|
|
452
449
|
vAlphabetic?: string | number | undefined;
|
|
450
|
+
values?: string | undefined;
|
|
453
451
|
version?: string | undefined;
|
|
454
452
|
vertAdvY?: string | number | undefined;
|
|
455
453
|
vertOriginX?: string | number | undefined;
|
|
@@ -462,6 +460,7 @@ declare const Spinner: import("styled-components").IStyledComponent<"web", {
|
|
|
462
460
|
widths?: string | number | undefined;
|
|
463
461
|
x1?: string | number | undefined;
|
|
464
462
|
x2?: string | number | undefined;
|
|
463
|
+
x?: string | number | undefined;
|
|
465
464
|
xChannelSelector?: string | undefined;
|
|
466
465
|
xHeight?: string | number | undefined;
|
|
467
466
|
xlinkActuate?: string | undefined;
|
|
@@ -478,6 +477,7 @@ declare const Spinner: import("styled-components").IStyledComponent<"web", {
|
|
|
478
477
|
xmlSpace?: string | undefined;
|
|
479
478
|
y1?: string | number | undefined;
|
|
480
479
|
y2?: string | number | undefined;
|
|
480
|
+
y?: string | number | undefined;
|
|
481
481
|
yChannelSelector?: string | undefined;
|
|
482
482
|
z?: string | number | undefined;
|
|
483
483
|
zoomAndPan?: string | undefined;
|
|
@@ -8,8 +8,8 @@ type Props = {
|
|
|
8
8
|
gapY?: ResponsiveValue<SpaceKey>;
|
|
9
9
|
} & Pick<ViewProps, 'alignItems' | 'justifyContent' | 'sx'> & AsProp;
|
|
10
10
|
declare const _default: import("react").ForwardRefExoticComponent<{
|
|
11
|
-
gapX?: ResponsiveValue<0 | 1 |
|
|
12
|
-
gapY?: ResponsiveValue<0 | 1 |
|
|
11
|
+
gapX?: ResponsiveValue<0 | 1 | 20 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 10 | 12 | 14 | 16 | 18 | "-80" | "-50" | "-48" | "-40" | "-32" | "-30" | "-28" | "-24" | "-20" | "-18" | "-16" | "-14" | "-12" | "-10" | "-8" | "-7" | "-6" | "-5" | "-4" | "-3" | "-2" | "-1" | "-0.5" | "-0.25" | 0.25 | 0.5 | 24 | 28 | 30 | 32 | 40 | 48 | 50 | 80> | undefined;
|
|
12
|
+
gapY?: ResponsiveValue<0 | 1 | 20 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 10 | 12 | 14 | 16 | 18 | "-80" | "-50" | "-48" | "-40" | "-32" | "-30" | "-28" | "-24" | "-20" | "-18" | "-16" | "-14" | "-12" | "-10" | "-8" | "-7" | "-6" | "-5" | "-4" | "-3" | "-2" | "-1" | "-0.5" | "-0.25" | 0.25 | 0.5 | 24 | 28 | 30 | 32 | 40 | 48 | 50 | 80> | undefined;
|
|
13
13
|
} & Pick<ViewProps, "alignItems" | "justifyContent" | "sx"> & AsProp & {
|
|
14
14
|
children?: import("react").ReactNode;
|
|
15
15
|
} & import("react").RefAttributes<HTMLDivElement>> & {
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import {
|
|
2
|
-
declare const useSafeLayoutEffect: typeof
|
|
1
|
+
import { useLayoutEffect } from 'react';
|
|
2
|
+
declare const useSafeLayoutEffect: typeof useLayoutEffect;
|
|
3
3
|
export default useSafeLayoutEffect;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* core components
|
|
3
3
|
*/
|
|
4
|
+
export { default as ActionList } from './core/ActionList';
|
|
5
|
+
export type { ActionListProps, ActionListItemProps, ActionListSectionDividerProps, ActionListSectionHeaderProps, } from './core/ActionList';
|
|
4
6
|
export { default as AnimatePresence } from './core/AnimatePresence';
|
|
5
7
|
export type { AnimatePresenceProps } from './core/AnimatePresence';
|
|
6
8
|
export { default as Avatar } from './core/Avatar';
|