@lotte-innovate/ui-component-test 0.0.14 → 0.0.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (110) hide show
  1. package/package.json +11 -2
  2. package/dist/app/layout.d.ts +0 -7
  3. package/dist/app/layout.jsx +0 -13
  4. package/dist/app/page.d.ts +0 -2
  5. package/dist/app/page.jsx +0 -9
  6. package/dist/app/template/colorPicker.d.ts +0 -7
  7. package/dist/app/template/colorPicker.jsx +0 -19
  8. package/dist/app/template/theme.d.ts +0 -12
  9. package/dist/app/template/theme.jsx +0 -17
  10. package/dist/stories/Welcome.d.ts +0 -3
  11. package/dist/stories/Welcome.jsx +0 -48
  12. package/dist/stories/accordion/Accordion.stories.d.ts +0 -71
  13. package/dist/stories/accordion/Accordion.stories.jsx +0 -79
  14. package/dist/stories/alert-dialog/AlertDialog.stories.d.ts +0 -107
  15. package/dist/stories/alert-dialog/AlertDialog.stories.jsx +0 -73
  16. package/dist/stories/aspect-ratio/AspectRatio.stories.d.ts +0 -68
  17. package/dist/stories/aspect-ratio/AspectRatio.stories.jsx +0 -106
  18. package/dist/stories/avatar/Avatar.stories.d.ts +0 -127
  19. package/dist/stories/avatar/Avatar.stories.jsx +0 -105
  20. package/dist/stories/badge/Badge.stories.d.ts +0 -133
  21. package/dist/stories/badge/Badge.stories.jsx +0 -130
  22. package/dist/stories/bubble-chart/BubbleChart.stories.d.ts +0 -103
  23. package/dist/stories/bubble-chart/BubbleChart.stories.jsx +0 -176
  24. package/dist/stories/button/Button.stories.d.ts +0 -148
  25. package/dist/stories/button/Button.stories.jsx +0 -98
  26. package/dist/stories/button/IconButton.stories.d.ts +0 -125
  27. package/dist/stories/button/IconButton.stories.jsx +0 -93
  28. package/dist/stories/callout/Callout.stories.d.ts +0 -129
  29. package/dist/stories/callout/Callout.stories.jsx +0 -205
  30. package/dist/stories/card/Card.stories.d.ts +0 -100
  31. package/dist/stories/card/Card.stories.jsx +0 -134
  32. package/dist/stories/checkbox/Checkbox.stories.d.ts +0 -147
  33. package/dist/stories/checkbox/Checkbox.stories.jsx +0 -166
  34. package/dist/stories/checkbox/CheckboxCard.stories.d.ts +0 -129
  35. package/dist/stories/checkbox/CheckboxCard.stories.jsx +0 -125
  36. package/dist/stories/checkbox/CheckboxGroup.stories.d.ts +0 -91
  37. package/dist/stories/checkbox/CheckboxGroup.stories.jsx +0 -144
  38. package/dist/stories/context-menu/ContextMenu.stories.d.ts +0 -113
  39. package/dist/stories/context-menu/ContextMenu.stories.jsx +0 -155
  40. package/dist/stories/data-list/DataList.stories.d.ts +0 -97
  41. package/dist/stories/data-list/DataList.stories.jsx +0 -185
  42. package/dist/stories/dialog/Dialog.stories.d.ts +0 -88
  43. package/dist/stories/dialog/Dialog.stories.jsx +0 -82
  44. package/dist/stories/doughnut-chart/DoughnutChart.stories.d.ts +0 -181
  45. package/dist/stories/doughnut-chart/DoughnutChart.stories.jsx +0 -236
  46. package/dist/stories/dropdown-menu/DropdownMenu.stories.d.ts +0 -112
  47. package/dist/stories/dropdown-menu/DropdownMenu.stories.jsx +0 -170
  48. package/dist/stories/header/Header.stories.d.ts +0 -112
  49. package/dist/stories/header/Header.stories.jsx +0 -116
  50. package/dist/stories/hover-card/HoverCard.stories.d.ts +0 -107
  51. package/dist/stories/hover-card/HoverCard.stories.jsx +0 -98
  52. package/dist/stories/inset/Inset.stories.d.ts +0 -58
  53. package/dist/stories/inset/Inset.stories.jsx +0 -79
  54. package/dist/stories/label/Label.stories.d.ts +0 -94
  55. package/dist/stories/label/Label.stories.jsx +0 -112
  56. package/dist/stories/menubar/Menubar.stories.d.ts +0 -119
  57. package/dist/stories/menubar/Menubar.stories.jsx +0 -135
  58. package/dist/stories/navigation-menu/NavigationMenu.stories.d.ts +0 -385
  59. package/dist/stories/navigation-menu/NavigationMenu.stories.jsx +0 -144
  60. package/dist/stories/pie-chart/PieChart.stories.d.ts +0 -186
  61. package/dist/stories/pie-chart/PieChart.stories.jsx +0 -300
  62. package/dist/stories/popover/Popover.stories.d.ts +0 -78
  63. package/dist/stories/popover/Popover.stories.jsx +0 -107
  64. package/dist/stories/progress/Progress.stories.d.ts +0 -113
  65. package/dist/stories/progress/Progress.stories.jsx +0 -82
  66. package/dist/stories/radar-chart/RadarChart.stories.d.ts +0 -111
  67. package/dist/stories/radar-chart/RadarChart.stories.jsx +0 -200
  68. package/dist/stories/radio/Radio.stories.d.ts +0 -108
  69. package/dist/stories/radio/Radio.stories.jsx +0 -94
  70. package/dist/stories/radio/RadioCards.stories.d.ts +0 -127
  71. package/dist/stories/radio/RadioCards.stories.jsx +0 -153
  72. package/dist/stories/radio/RadioGroup.stories.d.ts +0 -111
  73. package/dist/stories/radio/RadioGroup.stories.jsx +0 -142
  74. package/dist/stories/scroll-area/ScrollArea.stories.d.ts +0 -59
  75. package/dist/stories/scroll-area/ScrollArea.stories.jsx +0 -123
  76. package/dist/stories/segmented-control/SegmentedControl.stories.d.ts +0 -97
  77. package/dist/stories/segmented-control/SegmentedControl.stories.jsx +0 -101
  78. package/dist/stories/select/Select.stories.d.ts +0 -116
  79. package/dist/stories/select/Select.stories.jsx +0 -149
  80. package/dist/stories/separator/Separator.stories.d.ts +0 -93
  81. package/dist/stories/separator/Separator.stories.jsx +0 -106
  82. package/dist/stories/skeleton/Skeleton.stories.d.ts +0 -88
  83. package/dist/stories/skeleton/Skeleton.stories.jsx +0 -119
  84. package/dist/stories/slider/Slider.stories.d.ts +0 -114
  85. package/dist/stories/slider/Slider.stories.jsx +0 -94
  86. package/dist/stories/spinner/Spinner.stories.d.ts +0 -83
  87. package/dist/stories/spinner/Spinner.stories.jsx +0 -112
  88. package/dist/stories/switch/Switch.stories.d.ts +0 -146
  89. package/dist/stories/switch/Switch.stories.jsx +0 -119
  90. package/dist/stories/tab-nav/TabNav.stories.d.ts +0 -55
  91. package/dist/stories/tab-nav/TabNav.stories.jsx +0 -68
  92. package/dist/stories/table/Table.stories.d.ts +0 -87
  93. package/dist/stories/table/Table.stories.jsx +0 -106
  94. package/dist/stories/tabs/Tabs.stories.d.ts +0 -55
  95. package/dist/stories/tabs/Tabs.stories.jsx +0 -76
  96. package/dist/stories/text/Text.stories.d.ts +0 -74
  97. package/dist/stories/text/Text.stories.jsx +0 -91
  98. package/dist/stories/textArea/TextArea.stories.d.ts +0 -117
  99. package/dist/stories/textArea/TextArea.stories.jsx +0 -112
  100. package/dist/stories/textfield/TextField.stories.d.ts +0 -116
  101. package/dist/stories/textfield/TextField.stories.jsx +0 -120
  102. package/dist/stories/toast/Toast.stories.d.ts +0 -138
  103. package/dist/stories/toast/Toast.stories.jsx +0 -122
  104. package/dist/stories/toggle/Toggle.stories.d.ts +0 -115
  105. package/dist/stories/toggle/Toggle.stories.jsx +0 -106
  106. package/dist/stories/toggle/ToggleGroup.stories.d.ts +0 -103
  107. package/dist/stories/toggle/ToggleGroup.stories.jsx +0 -127
  108. package/dist/stories/tooltip/Tooltip.stories.d.ts +0 -93
  109. package/dist/stories/tooltip/Tooltip.stories.jsx +0 -91
  110. package/dist/tsconfig.tsbuildinfo +0 -1
@@ -1,113 +0,0 @@
1
- /// <reference types="react" />
2
- import { IRadius, ISize } from '../../types';
3
- declare const meta: {
4
- title: string;
5
- component: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-progress").ProgressProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("../../components/Progress").ProgressProps & import("react").RefAttributes<HTMLDivElement>>;
6
- parameters: {
7
- layout: string;
8
- themes: {
9
- themeOverride: string;
10
- };
11
- docs: {
12
- description: {
13
- component: string;
14
- };
15
- };
16
- };
17
- tags: string[];
18
- argTypes: {
19
- radius: {
20
- description: string;
21
- table: {
22
- category: string;
23
- type: {
24
- summary: string;
25
- };
26
- };
27
- options: IRadius[];
28
- control: {
29
- type: string;
30
- };
31
- defaultValue: {
32
- summary: string;
33
- };
34
- };
35
- size: {
36
- table: {
37
- category: string;
38
- type: {
39
- summary: string;
40
- };
41
- };
42
- options: ISize[];
43
- description: string;
44
- control: {
45
- type: string;
46
- };
47
- defaultValue: {
48
- summary: string;
49
- };
50
- };
51
- scaling: {
52
- description: string;
53
- table: {
54
- category: string;
55
- type: {
56
- summary: string;
57
- };
58
- };
59
- control: {
60
- type: string;
61
- };
62
- options: import("../../types").IScaling[];
63
- defaultValue: {
64
- summary: string;
65
- };
66
- };
67
- color: {
68
- description: string;
69
- table: {
70
- category: string;
71
- type: {
72
- summary: string;
73
- };
74
- };
75
- options: import("../../types").IColor[];
76
- control: {
77
- type: string;
78
- };
79
- defaultValue: {
80
- summary: string;
81
- };
82
- };
83
- appearance: {
84
- table: {
85
- category: string;
86
- type: {
87
- summary: string;
88
- };
89
- };
90
- description: string;
91
- options: string[];
92
- defaultValue: {
93
- summary: string;
94
- };
95
- control: {
96
- type: string;
97
- };
98
- };
99
- };
100
- };
101
- export default meta;
102
- export declare const Default: ({ ...args }: {
103
- [x: string]: any;
104
- }) => import("react").JSX.Element;
105
- export declare const Radius: ({ ...args }: {
106
- [x: string]: any;
107
- }) => import("react").JSX.Element;
108
- export declare const Size: ({ ...args }: {
109
- [x: string]: any;
110
- }) => import("react").JSX.Element;
111
- export declare const Variant: ({ ...args }: {
112
- [x: string]: any;
113
- }) => import("react").JSX.Element;
@@ -1,82 +0,0 @@
1
- var __assign = (this && this.__assign) || function () {
2
- __assign = Object.assign || function(t) {
3
- for (var s, i = 1, n = arguments.length; i < n; i++) {
4
- s = arguments[i];
5
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
- t[p] = s[p];
7
- }
8
- return t;
9
- };
10
- return __assign.apply(this, arguments);
11
- };
12
- var __rest = (this && this.__rest) || function (s, e) {
13
- var t = {};
14
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
- t[p] = s[p];
16
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
- t[p[i]] = s[p[i]];
20
- }
21
- return t;
22
- };
23
- import { commonArgTypes, radiusOptions, sizeOptions } from '../../constants';
24
- import { Progress } from '../../components/Progress';
25
- var meta = {
26
- title: 'Component/Progress',
27
- component: Progress,
28
- parameters: {
29
- layout: 'centered',
30
- themes: {
31
- themeOverride: 'dark',
32
- },
33
- docs: {
34
- description: {
35
- component: '작업의 진행 상황을 시각적으로 표시',
36
- },
37
- },
38
- },
39
- tags: ['autodocs'],
40
- argTypes: {
41
- radius: __assign(__assign({}, commonArgTypes.radius), { description: 'progress 둥글기' }),
42
- size: __assign(__assign({}, commonArgTypes.size), { table: {
43
- category: 'Props',
44
- type: {
45
- summary: sizeOptions
46
- .filter(function (value) { return value != 'x-small' && value != 'x-large'; })
47
- .join(' | '),
48
- },
49
- }, options: sizeOptions.filter(function (value) { return value != 'x-small' && value != 'x-large'; }), description: 'popover 크기' }),
50
- scaling: __assign(__assign({}, commonArgTypes.scaling), { description: 'progress 비율' }),
51
- color: __assign(__assign({}, commonArgTypes.color), { description: 'progress color' }),
52
- appearance: __assign(__assign({}, commonArgTypes.appearance), { table: {
53
- category: 'Props',
54
- type: { summary: ['classic', 'surface', 'soft'].join(' | ') },
55
- }, description: 'progress 스타일', options: ['classic', 'surface', 'soft'], defaultValue: { summary: 'surface' } }),
56
- },
57
- };
58
- export default meta;
59
- export var Default = function (_a) {
60
- var args = __rest(_a, []);
61
- return <Progress value={25} {...args}/>;
62
- };
63
- export var Radius = function (_a) {
64
- var args = __rest(_a, []);
65
- return (<div className="flex flex-col space-y-3">
66
- {radiusOptions.map(function (radius) { return (<Progress key={radius} value={25} {...args} radius={radius}/>); })}
67
- </div>);
68
- };
69
- export var Size = function (_a) {
70
- var args = __rest(_a, []);
71
- return (<div className="flex flex-col space-y-3">
72
- {sizeOptions
73
- .filter(function (value) { return value != 'x-small' && value != 'x-large'; })
74
- .map(function (size) { return (<Progress key={size} value={25} {...args} size={size}/>); })}
75
- </div>);
76
- };
77
- export var Variant = function (_a) {
78
- var args = __rest(_a, []);
79
- return (<div className="flex flex-col space-y-3">
80
- {['classic', 'surface', 'soft'].map(function (appearance) { return (<Default key={appearance} value={25} {...args} appearance={appearance}/>); })}
81
- </div>);
82
- };
@@ -1,111 +0,0 @@
1
- /// <reference types="react" />
2
- declare const meta: {
3
- title: string;
4
- component: {
5
- ({ className, labels, datasets, width, height, scaling, ...props }: import("components/RadarChart").RadarChartProps): import("react").JSX.Element;
6
- displayName: string;
7
- };
8
- parameters: {
9
- layout: string;
10
- themes: {
11
- themeOverride: string;
12
- };
13
- docs: {
14
- description: {
15
- component: string;
16
- };
17
- };
18
- };
19
- tags: string[];
20
- args: {
21
- labels: string[];
22
- datasets: {
23
- label: string;
24
- data: number[];
25
- backgroundColor: string;
26
- borderColor: string;
27
- pointStyle: boolean;
28
- }[];
29
- };
30
- argTypes: {
31
- scaling: {
32
- description: string;
33
- table: {
34
- category: string;
35
- type: {
36
- summary: string;
37
- };
38
- };
39
- control: {
40
- type: string;
41
- };
42
- options: import("types").IScaling[];
43
- defaultValue: {
44
- summary: string;
45
- };
46
- };
47
- labels: {
48
- name: string;
49
- description: string;
50
- table: {
51
- category: string;
52
- type: {
53
- summary: string;
54
- };
55
- };
56
- };
57
- datasets: {
58
- description: string;
59
- table: {
60
- category: string;
61
- type: {
62
- summary: string;
63
- };
64
- };
65
- };
66
- labelPosition: {
67
- description: string;
68
- table: {
69
- category: string;
70
- type: {
71
- summary: string;
72
- };
73
- };
74
- control: {
75
- type: string;
76
- };
77
- options: string[];
78
- defaultValue: {
79
- summary: string;
80
- };
81
- };
82
- className: {
83
- table: {
84
- disable: boolean;
85
- };
86
- };
87
- width: {
88
- table: {
89
- disable: boolean;
90
- };
91
- };
92
- height: {
93
- table: {
94
- disable: boolean;
95
- };
96
- };
97
- };
98
- };
99
- export default meta;
100
- export declare const Default: ({ ...args }: {
101
- [x: string]: any;
102
- }) => import("react").JSX.Element;
103
- export declare const DotsRadarChart: ({ ...args }: {
104
- [x: string]: any;
105
- }) => import("react").JSX.Element;
106
- export declare const MultiDatasets: ({ ...args }: {
107
- [x: string]: any;
108
- }) => import("react").JSX.Element;
109
- export declare const LinesOnly: ({ ...args }: {
110
- [x: string]: any;
111
- }) => import("react").JSX.Element;
@@ -1,200 +0,0 @@
1
- var __assign = (this && this.__assign) || function () {
2
- __assign = Object.assign || function(t) {
3
- for (var s, i = 1, n = arguments.length; i < n; i++) {
4
- s = arguments[i];
5
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
- t[p] = s[p];
7
- }
8
- return t;
9
- };
10
- return __assign.apply(this, arguments);
11
- };
12
- var __rest = (this && this.__rest) || function (s, e) {
13
- var t = {};
14
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
- t[p] = s[p];
16
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
- t[p[i]] = s[p[i]];
20
- }
21
- return t;
22
- };
23
- import { RadarChart } from 'components/RadarChart';
24
- import { commonArgTypes, labelPositionList } from '../../constants';
25
- import { red, blue } from 'color/light';
26
- import { redA, blueA } from 'color/alpha';
27
- var FILL_FALSE = false;
28
- var meta = {
29
- title: 'Chart/RadarChart',
30
- component: RadarChart,
31
- parameters: {
32
- layout: 'centered',
33
- themes: {
34
- themeOverride: 'dark',
35
- },
36
- docs: {
37
- description: {
38
- component: 'radar 차트 컴포넌트',
39
- },
40
- },
41
- },
42
- tags: ['autodocs'],
43
- args: {
44
- labels: ['January', 'Februar', 'March', 'April', 'May', 'June'],
45
- datasets: [
46
- {
47
- label: 'Desktop',
48
- data: [186, 205, 237, 213, 209, 214],
49
- backgroundColor: red[3],
50
- borderColor: red[6],
51
- pointStyle: false,
52
- },
53
- ],
54
- },
55
- argTypes: {
56
- scaling: __assign(__assign({}, commonArgTypes.scaling), { description: 'radarChart 비율' }),
57
- labels: {
58
- name: 'labels',
59
- description: '차트 위에 표시될 라벨들',
60
- table: {
61
- category: 'Props',
62
- type: { summary: 'string[]' },
63
- },
64
- },
65
- datasets: {
66
- description: '차트에 사용할 데이터 세트',
67
- table: {
68
- category: 'Props',
69
- type: { summary: 'object' },
70
- },
71
- },
72
- labelPosition: {
73
- description: '라벨 위치',
74
- table: {
75
- category: 'Props',
76
- type: { summary: labelPositionList.join(' | ') },
77
- },
78
- control: { type: 'select' },
79
- options: labelPositionList,
80
- defaultValue: { summary: 'top' },
81
- },
82
- className: {
83
- table: {
84
- disable: true,
85
- },
86
- },
87
- width: {
88
- table: {
89
- disable: true,
90
- },
91
- },
92
- height: {
93
- table: {
94
- disable: true,
95
- },
96
- },
97
- },
98
- };
99
- export default meta;
100
- export var Default = function (_a) {
101
- var args = __rest(_a, []);
102
- var options = {
103
- plugins: {
104
- legend: {
105
- position: args.labelPosition,
106
- },
107
- title: {
108
- display: true,
109
- text: 'Radar Chart',
110
- },
111
- },
112
- };
113
- return (<RadarChart width={400} height={300} labels={args.labels} datasets={args.datasets} options={options} {...args}/>);
114
- };
115
- export var DotsRadarChart = function (_a) {
116
- var args = __rest(_a, []);
117
- var datasets = [
118
- {
119
- label: 'Desktop',
120
- data: [186, 205, 237, 213, 209, 214],
121
- backgroundColor: red[3],
122
- borderColor: red[6],
123
- pointBackgroundColor: red[9],
124
- pointBorderColor: red[9],
125
- pointBorderWidth: 3,
126
- },
127
- ];
128
- var options = {
129
- plugins: {
130
- legend: {
131
- display: false,
132
- },
133
- title: {
134
- display: true,
135
- text: 'Radar Chart - Dots',
136
- },
137
- },
138
- };
139
- return (<RadarChart width={400} height={300} labels={args.labels} datasets={datasets} options={options}/>);
140
- };
141
- export var MultiDatasets = function (_a) {
142
- var args = __rest(_a, []);
143
- var datasets = [
144
- {
145
- label: 'Desktop',
146
- data: [186, 305, 237, 73, 209, 214],
147
- backgroundColor: redA[3],
148
- borderColor: red[6],
149
- pointStyle: FILL_FALSE,
150
- },
151
- {
152
- label: 'Mobile',
153
- data: [80, 200, 120, 190, 130, 140],
154
- backgroundColor: blueA[3],
155
- borderColor: blue[6],
156
- pointStyle: FILL_FALSE,
157
- },
158
- ];
159
- var options = {
160
- plugins: {
161
- legend: {
162
- display: false,
163
- },
164
- title: {
165
- display: true,
166
- text: 'Radar Chart - Multiple',
167
- },
168
- },
169
- };
170
- return (<RadarChart width={400} height={300} labels={args.labels} datasets={datasets} options={options}/>);
171
- };
172
- export var LinesOnly = function (_a) {
173
- var args = __rest(_a, []);
174
- var datasets = [
175
- {
176
- label: 'Desktop',
177
- data: [186, 305, 237, 73, 209, 214],
178
- fill: false,
179
- pointStyle: FILL_FALSE,
180
- },
181
- {
182
- label: 'Mobile',
183
- data: [80, 200, 120, 190, 130, 140],
184
- fill: false,
185
- pointStyle: FILL_FALSE,
186
- },
187
- ];
188
- var options = {
189
- plugins: {
190
- legend: {
191
- display: false,
192
- },
193
- title: {
194
- display: true,
195
- text: 'Radar Chart - Lines Only',
196
- },
197
- },
198
- };
199
- return (<RadarChart width={400} height={300} labels={args.labels} datasets={datasets} options={options}/>);
200
- };
@@ -1,108 +0,0 @@
1
- /// <reference types="react" />
2
- import { ISize } from '../../types';
3
- declare const meta: {
4
- title: string;
5
- component: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/themes").RadioProps & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("../../components/Radio/index").RadioProps & import("react").RefAttributes<HTMLInputElement>>;
6
- parameters: {
7
- layout: string;
8
- themes: {
9
- themeOverride: string;
10
- };
11
- docs: {
12
- description: {
13
- component: string;
14
- };
15
- };
16
- };
17
- tags: string[];
18
- argTypes: {
19
- disabled: {
20
- description: string;
21
- defaultValue: {
22
- summary: string;
23
- };
24
- table: {
25
- category: string;
26
- type: {
27
- summary: string;
28
- };
29
- };
30
- control: {
31
- type: string;
32
- };
33
- };
34
- size: {
35
- table: {
36
- category: string;
37
- type: {
38
- summary: string;
39
- };
40
- };
41
- options: ISize[];
42
- description: string;
43
- control: {
44
- type: string;
45
- };
46
- defaultValue: {
47
- summary: string;
48
- };
49
- };
50
- scaling: {
51
- description: string;
52
- table: {
53
- category: string;
54
- type: {
55
- summary: string;
56
- };
57
- };
58
- control: {
59
- type: string;
60
- };
61
- options: import("../../types").IScaling[];
62
- defaultValue: {
63
- summary: string;
64
- };
65
- };
66
- color: {
67
- description: string;
68
- defaultValue: {
69
- summary: string;
70
- };
71
- table: {
72
- category: string;
73
- type: {
74
- summary: string;
75
- };
76
- };
77
- options: import("../../types").IColor[];
78
- control: {
79
- type: string;
80
- };
81
- };
82
- appearance: {
83
- table: {
84
- category: string;
85
- type: {
86
- summary: string;
87
- };
88
- };
89
- control: {
90
- type: string;
91
- };
92
- options: string[];
93
- defaultValue: {
94
- summary: string;
95
- };
96
- };
97
- };
98
- };
99
- export default meta;
100
- export declare const Default: ({ ...args }: {
101
- [x: string]: any;
102
- }) => import("react").JSX.Element;
103
- export declare const Size: ({ ...args }: {
104
- [x: string]: any;
105
- }) => import("react").JSX.Element;
106
- export declare const Appearance: ({ ...args }: {
107
- [x: string]: any;
108
- }) => import("react").JSX.Element;
@@ -1,94 +0,0 @@
1
- var __assign = (this && this.__assign) || function () {
2
- __assign = Object.assign || function(t) {
3
- for (var s, i = 1, n = arguments.length; i < n; i++) {
4
- s = arguments[i];
5
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
- t[p] = s[p];
7
- }
8
- return t;
9
- };
10
- return __assign.apply(this, arguments);
11
- };
12
- var __rest = (this && this.__rest) || function (s, e) {
13
- var t = {};
14
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
- t[p] = s[p];
16
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
- t[p[i]] = s[p[i]];
20
- }
21
- return t;
22
- };
23
- import { commonArgTypes, sizeOptions } from '../../constants';
24
- import { Radio } from '../../components/Radio/index';
25
- var meta = {
26
- title: 'Component/Radio',
27
- component: Radio,
28
- parameters: {
29
- layout: 'centered',
30
- themes: {
31
- themeOverride: 'dark',
32
- },
33
- docs: {
34
- description: {
35
- component: '선택지 중 한가지만 선택할 수 있는 기능',
36
- },
37
- },
38
- },
39
- tags: ['autodocs'],
40
- argTypes: {
41
- disabled: {
42
- description: 'radio disabled',
43
- defaultValue: { summary: 'false' },
44
- table: {
45
- category: 'Props',
46
- type: { summary: 'boolean' },
47
- },
48
- control: { type: 'boolean' },
49
- },
50
- size: __assign(__assign({}, commonArgTypes.size), { table: {
51
- category: 'Props',
52
- type: {
53
- summary: sizeOptions
54
- .filter(function (size) { return !['x-small', 'x-large'].includes(size); })
55
- .join(' | '),
56
- },
57
- }, options: sizeOptions.filter(function (size) { return !['x-small', 'x-large'].includes(size); }), description: 'radio 크기' }),
58
- scaling: __assign(__assign({}, commonArgTypes.scaling), { description: 'radio scaling' }),
59
- color: __assign(__assign({}, commonArgTypes.color), { description: 'radio color', defaultValue: { summary: 'red' } }),
60
- appearance: {
61
- table: {
62
- category: 'Props',
63
- type: { summary: ['classic', 'soft', 'surface'].join(' | ') },
64
- },
65
- control: { type: 'select' },
66
- options: ['classic', 'soft', 'surface'],
67
- defaultValue: { summary: 'surface' },
68
- },
69
- },
70
- };
71
- export default meta;
72
- export var Default = function (_a) {
73
- var args = __rest(_a, []);
74
- return (<>
75
- <Radio value={'1'} name={'example'} {...args}>
76
- radio option1
77
- </Radio>
78
- <Radio value={'2'} name={'example'} {...args}>
79
- radio option2
80
- </Radio>
81
- </>);
82
- };
83
- export var Size = function (_a) {
84
- var args = __rest(_a, []);
85
- return (<div className="flex items-center space-x-4">
86
- {['small', 'medium', 'large'].map(function (size) { return (<Radio key={size} size={size} value={'1'} name={'size'} defaultChecked={size === 'small'} {...args}/>); })}
87
- </div>);
88
- };
89
- export var Appearance = function (_a) {
90
- var args = __rest(_a, []);
91
- return (<div className="flex items-center space-x-4">
92
- {['classic', 'soft', 'surface'].map(function (appearance) { return (<Radio key={appearance} value={appearance} appearance={appearance} name={'appearance'} defaultChecked={appearance === 'classic'} {...args}/>); })}
93
- </div>);
94
- };