@lotte-innovate/ui-component-test 0.0.13 → 0.0.15
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/Typography/Header/{index.js → index.jsx} +5 -2
- package/dist/Typography/Text/{index.js → index.jsx} +6 -3
- package/dist/components/Accordion/{index.js → index.jsx} +17 -5
- package/dist/components/AlertDialog/{AlertDialogAction.js → AlertDialogAction.jsx} +4 -3
- package/dist/components/AlertDialog/{AlertDialogCancel.js → AlertDialogCancel.jsx} +4 -3
- package/dist/components/AlertDialog/{AlertDialogContent.js → AlertDialogContent.jsx} +7 -3
- package/dist/components/AlertDialog/{AlertDialogDescription.js → AlertDialogDescription.jsx} +4 -14
- package/dist/components/AlertDialog/{AlertDialogTitle.js → AlertDialogTitle.jsx} +4 -14
- package/dist/components/AlertDialog/{AlertDialogTrigger.js → AlertDialogTrigger.jsx} +4 -3
- package/dist/components/AlertDialog/{index.js → index.jsx} +4 -14
- package/dist/components/AspectRatio/{index.js → index.jsx} +4 -3
- package/dist/components/Avatar/{index.js → index.jsx} +7 -3
- package/dist/components/Badge/{index.js → index.jsx} +4 -3
- package/dist/components/BubbleChart/index.d.ts +2 -1
- package/dist/components/BubbleChart/{index.js → index.jsx} +2 -2
- package/dist/components/Button/{index.js → index.jsx} +4 -3
- package/dist/components/Callout/{CalloutIcon.js → CalloutIcon.jsx} +8 -3
- package/dist/components/Callout/{CalloutText.js → CalloutText.jsx} +4 -14
- package/dist/components/Callout/{index.js → index.jsx} +6 -3
- package/dist/components/Card/{index.js → index.jsx} +4 -3
- package/dist/components/Checkbox/{index.js → index.jsx} +11 -3
- package/dist/components/CheckboxCard/{index.js → index.jsx} +5 -3
- package/dist/components/CheckboxGroup/{CheckboxGroupItem.js → CheckboxGroupItem.jsx} +6 -14
- package/dist/components/CheckboxGroup/{index.js → index.jsx} +5 -2
- package/dist/components/ContextMenu/{ContextMenuCheckboxItem.js → ContextMenuCheckboxItem.jsx} +7 -14
- package/dist/components/ContextMenu/{ContextMenuContent.js → ContextMenuContent.jsx} +6 -3
- package/dist/components/ContextMenu/{ContextMenuGroup.js → ContextMenuGroup.jsx} +4 -14
- package/dist/components/ContextMenu/{ContextMenuItem.js → ContextMenuItem.jsx} +5 -3
- package/dist/components/ContextMenu/{ContextMenuItemIndicator.js → ContextMenuItemIndicator.jsx} +4 -3
- package/dist/components/ContextMenu/{ContextMenuLabel.js → ContextMenuLabel.jsx} +4 -3
- package/dist/components/ContextMenu/{ContextMenuRadioGroup.js → ContextMenuRadioGroup.jsx} +6 -14
- package/dist/components/ContextMenu/{ContextMenuRadioItem.js → ContextMenuRadioItem.jsx} +7 -14
- package/dist/components/ContextMenu/{ContextMenuSeparator.js → ContextMenuSeparator.jsx} +4 -14
- package/dist/components/ContextMenu/{ContextMenuSubContent.js → ContextMenuSubContent.jsx} +9 -6
- package/dist/components/ContextMenu/{ContextMenuSubTrigger.js → ContextMenuSubTrigger.jsx} +9 -14
- package/dist/components/ContextMenu/{ContextMenuTrigger.js → ContextMenuTrigger.jsx} +4 -14
- package/dist/components/ContextMenu/{index.js → index.jsx} +6 -14
- package/dist/components/DataList/{DataListItem.js → DataListItem.jsx} +4 -3
- package/dist/components/DataList/{DataListLabel.js → DataListLabel.jsx} +4 -3
- package/dist/components/DataList/{DataListValue.js → DataListValue.jsx} +4 -3
- package/dist/components/DataList/{index.js → index.jsx} +6 -14
- package/dist/components/Dialog/{DialogAction.js → DialogAction.jsx} +4 -14
- package/dist/components/Dialog/{DialogCancel.js → DialogCancel.jsx} +4 -14
- package/dist/components/Dialog/{DialogContent.js → DialogContent.jsx} +4 -3
- package/dist/components/Dialog/{DialogDescription.js → DialogDescription.jsx} +4 -14
- package/dist/components/Dialog/{DialogSlot.js → DialogSlot.jsx} +4 -14
- package/dist/components/Dialog/{DialogTitle.js → DialogTitle.jsx} +4 -14
- package/dist/components/Dialog/{DialogTrigger.js → DialogTrigger.jsx} +4 -14
- package/dist/components/Dialog/{index.js → index.jsx} +4 -14
- package/dist/components/DoughnutChart/index.d.ts +2 -1
- package/dist/components/DoughnutChart/{index.js → index.jsx} +2 -2
- package/dist/components/DropdownMenu/{DropdonMenuRadioGroup.js → DropdonMenuRadioGroup.jsx} +6 -14
- package/dist/components/DropdownMenu/{DropdonMenuSubContent.js → DropdonMenuSubContent.jsx} +10 -7
- package/dist/components/DropdownMenu/{DropdownMenuCheckboxItem.js → DropdownMenuCheckboxItem.jsx} +7 -14
- package/dist/components/DropdownMenu/{DropdownMenuContent.js → DropdownMenuContent.jsx} +6 -3
- package/dist/components/DropdownMenu/{DropdownMenuItem.js → DropdownMenuItem.jsx} +5 -3
- package/dist/components/DropdownMenu/{DropdownMenuItemIndicator.js → DropdownMenuItemIndicator.jsx} +4 -3
- package/dist/components/DropdownMenu/{DropdownMenuLable.js → DropdownMenuLable.jsx} +4 -3
- package/dist/components/DropdownMenu/{DropdownMenuRadioItem.js → DropdownMenuRadioItem.jsx} +7 -14
- package/dist/components/DropdownMenu/{DropdownMenuSeparator.js → DropdownMenuSeparator.jsx} +2 -14
- package/dist/components/DropdownMenu/{DropdownMenuSub.js → DropdownMenuSub.jsx} +2 -14
- package/dist/components/DropdownMenu/{DropdownMenuSubTrigger.js → DropdownMenuSubTrigger.jsx} +7 -14
- package/dist/components/DropdownMenu/{DropdownMenuTrigger.js → DropdownMenuTrigger.jsx} +4 -14
- package/dist/components/DropdownMenu/{index.js → index.jsx} +2 -14
- package/dist/components/HoverCard/{HoverCardContent.js → HoverCardContent.jsx} +4 -3
- package/dist/components/HoverCard/{HoverCardTrigger.js → HoverCardTrigger.jsx} +4 -14
- package/dist/components/HoverCard/{index.js → index.jsx} +4 -14
- package/dist/components/IconButton/{index.js → index.jsx} +3 -2
- package/dist/components/Inset/{index.js → index.jsx} +6 -3
- package/dist/components/Label/{index.js → index.jsx} +3 -2
- package/dist/components/Menubar/{MenubarCheckboxItem.js → MenubarCheckboxItem.jsx} +7 -14
- package/dist/components/Menubar/{MenubarContent.js → MenubarContent.jsx} +10 -7
- package/dist/components/Menubar/{MenubarItem.js → MenubarItem.jsx} +5 -3
- package/dist/components/Menubar/{MenubarItemIndicator.js → MenubarItemIndicator.jsx} +4 -3
- package/dist/components/Menubar/{MenubarMenu.js → MenubarMenu.jsx} +2 -14
- package/dist/components/Menubar/{MenubarRadioGroup.js → MenubarRadioGroup.jsx} +6 -14
- package/dist/components/Menubar/{MenubarRadioItem.js → MenubarRadioItem.jsx} +7 -14
- package/dist/components/Menubar/{MenubarSeparator.js → MenubarSeparator.jsx} +4 -14
- package/dist/components/Menubar/{MenubarSub.js → MenubarSub.jsx} +2 -14
- package/dist/components/Menubar/{MenubarSubContent.js → MenubarSubContent.jsx} +5 -4
- package/dist/components/Menubar/{MenubarSubTrigger.js → MenubarSubTrigger.jsx} +7 -14
- package/dist/components/Menubar/{MenubarTrigger.js → MenubarTrigger.jsx} +4 -3
- package/dist/components/Menubar/{index.js → index.jsx} +6 -3
- package/dist/components/NavigationMenu/{NavigationMenuContent.js → NavigationMenuContent.jsx} +4 -3
- package/dist/components/NavigationMenu/NavigationMenuIndicator.jsx +22 -0
- package/dist/components/NavigationMenu/{NavigationMenuItem.js → NavigationMenuItem.jsx} +4 -14
- package/dist/components/NavigationMenu/{NavigationMenuLink.js → NavigationMenuLink.jsx} +4 -3
- package/dist/components/NavigationMenu/{NavigationMenuList.js → NavigationMenuList.jsx} +5 -3
- package/dist/components/NavigationMenu/{NavigationMenuTrigger.js → NavigationMenuTrigger.jsx} +5 -3
- package/dist/components/NavigationMenu/{NavigationMenuViewport.js → NavigationMenuViewport.jsx} +4 -3
- package/dist/components/NavigationMenu/{index.js → index.jsx} +6 -14
- package/dist/components/PieChart/index.d.ts +2 -1
- package/dist/components/PieChart/{index.js → index.jsx} +2 -2
- package/dist/components/Popover/{PopoverClose.js → PopoverClose.jsx} +4 -14
- package/dist/components/Popover/{PopoverContent.js → PopoverContent.jsx} +4 -3
- package/dist/components/Popover/{PopoverTrigger.js → PopoverTrigger.jsx} +4 -14
- package/dist/components/Popover/{index.js → index.jsx} +4 -14
- package/dist/components/Progress/{index.js → index.jsx} +4 -3
- package/dist/components/RadarChart/index.d.ts +2 -1
- package/dist/components/RadarChart/{index.js → index.jsx} +2 -2
- package/dist/components/Radio/{index.js → index.jsx} +8 -13
- package/dist/components/RadioCards/{RadioCardsItem.js → RadioCardsItem.jsx} +4 -14
- package/dist/components/RadioCards/{index.js → index.jsx} +6 -3
- package/dist/components/RadioGroup/{RadioGroupItem.js → RadioGroupItem.jsx} +4 -14
- package/dist/components/RadioGroup/{index.js → index.jsx} +6 -14
- package/dist/components/ScrollArea/{index.js → index.jsx} +6 -14
- package/dist/components/SegmentedControl/{SegmentedControlItem.js → SegmentedControlItem.jsx} +4 -14
- package/dist/components/SegmentedControl/{index.js → index.jsx} +5 -2
- package/dist/components/Select/{index.js → index.jsx} +25 -8
- package/dist/components/Separator/{index.js → index.jsx} +5 -2
- package/dist/components/Skeleton/{index.js → index.jsx} +5 -2
- package/dist/components/Slider/{index.js → index.jsx} +3 -2
- package/dist/components/Spinner/{index.js → index.jsx} +5 -2
- package/dist/components/TabNav/{index.js → index.jsx} +8 -14
- package/dist/components/Table/{index.js → index.jsx} +23 -8
- package/dist/components/Tabs/{index.js → index.jsx} +14 -5
- package/dist/components/TextArea/{index.js → index.jsx} +3 -2
- package/dist/components/TextField/{index.js → index.jsx} +8 -3
- package/dist/components/Toast/{ToastActionButton.js → ToastActionButton.jsx} +4 -3
- package/dist/components/Toast/{ToastDescription.js → ToastDescription.jsx} +6 -14
- package/dist/components/Toast/{ToastTitle.js → ToastTitle.jsx} +4 -14
- package/dist/components/Toast/{index.js → index.jsx} +9 -3
- package/dist/components/Toggle/{ToggleWithText.js → ToggleWithText.jsx} +6 -4
- package/dist/components/Toggle/{index.js → index.jsx} +4 -3
- package/dist/components/ToggleGroup/{index.js → index.jsx} +6 -3
- package/dist/components/ToggleGroup/{toggleGroupItem.js → toggleGroupItem.jsx} +4 -14
- package/dist/components/ToggleSwitch/{index.js → index.jsx} +6 -2
- package/dist/components/Tooltip/{index.js → index.jsx} +11 -2
- package/package.json +11 -2
- package/dist/app/layout.d.ts +0 -7
- package/dist/app/layout.js +0 -12
- package/dist/app/page.d.ts +0 -1
- package/dist/app/page.js +0 -6
- package/dist/app/template/colorPicker.d.ts +0 -6
- package/dist/app/template/colorPicker.js +0 -14
- package/dist/app/template/theme.d.ts +0 -12
- package/dist/app/template/theme.js +0 -11
- package/dist/components/NavigationMenu/NavigationMenuIndicator.js +0 -31
- package/dist/stories/Welcome.d.ts +0 -2
- package/dist/stories/Welcome.js +0 -30
- package/dist/stories/accordion/Accordion.stories.d.ts +0 -71
- package/dist/stories/accordion/Accordion.stories.js +0 -61
- package/dist/stories/alert-dialog/AlertDialog.stories.d.ts +0 -107
- package/dist/stories/alert-dialog/AlertDialog.stories.js +0 -60
- package/dist/stories/aspect-ratio/AspectRatio.stories.d.ts +0 -68
- package/dist/stories/aspect-ratio/AspectRatio.stories.js +0 -78
- package/dist/stories/avatar/Avatar.stories.d.ts +0 -127
- package/dist/stories/avatar/Avatar.stories.js +0 -94
- package/dist/stories/badge/Badge.stories.d.ts +0 -133
- package/dist/stories/badge/Badge.stories.js +0 -86
- package/dist/stories/bubble-chart/BubbleChart.stories.d.ts +0 -102
- package/dist/stories/bubble-chart/BubbleChart.stories.js +0 -168
- package/dist/stories/button/Button.stories.d.ts +0 -148
- package/dist/stories/button/Button.stories.js +0 -65
- package/dist/stories/button/IconButton.stories.d.ts +0 -125
- package/dist/stories/button/IconButton.stories.js +0 -80
- package/dist/stories/callout/Callout.stories.d.ts +0 -129
- package/dist/stories/callout/Callout.stories.js +0 -104
- package/dist/stories/card/Card.stories.d.ts +0 -100
- package/dist/stories/card/Card.stories.js +0 -84
- package/dist/stories/checkbox/Checkbox.stories.d.ts +0 -147
- package/dist/stories/checkbox/Checkbox.stories.js +0 -110
- package/dist/stories/checkbox/CheckboxCard.stories.d.ts +0 -129
- package/dist/stories/checkbox/CheckboxCard.stories.js +0 -90
- package/dist/stories/checkbox/CheckboxGroup.stories.d.ts +0 -91
- package/dist/stories/checkbox/CheckboxGroup.stories.js +0 -72
- package/dist/stories/context-menu/ContextMenu.stories.d.ts +0 -113
- package/dist/stories/context-menu/ContextMenu.stories.js +0 -86
- package/dist/stories/data-list/DataList.stories.d.ts +0 -97
- package/dist/stories/data-list/DataList.stories.js +0 -87
- package/dist/stories/dialog/Dialog.stories.d.ts +0 -88
- package/dist/stories/dialog/Dialog.stories.js +0 -59
- package/dist/stories/doughnut-chart/DoughnutChart.stories.d.ts +0 -180
- package/dist/stories/doughnut-chart/DoughnutChart.stories.js +0 -228
- package/dist/stories/dropdown-menu/DropdownMenu.stories.d.ts +0 -112
- package/dist/stories/dropdown-menu/DropdownMenu.stories.js +0 -75
- package/dist/stories/header/Header.stories.d.ts +0 -112
- package/dist/stories/header/Header.stories.js +0 -97
- package/dist/stories/hover-card/HoverCard.stories.d.ts +0 -107
- package/dist/stories/hover-card/HoverCard.stories.js +0 -71
- package/dist/stories/inset/Inset.stories.d.ts +0 -58
- package/dist/stories/inset/Inset.stories.js +0 -64
- package/dist/stories/label/Label.stories.d.ts +0 -94
- package/dist/stories/label/Label.stories.js +0 -91
- package/dist/stories/menubar/Menubar.stories.d.ts +0 -119
- package/dist/stories/menubar/Menubar.stories.js +0 -98
- package/dist/stories/navigation-menu/NavigationMenu.stories.d.ts +0 -385
- package/dist/stories/navigation-menu/NavigationMenu.stories.js +0 -79
- package/dist/stories/pie-chart/PieChart.stories.d.ts +0 -185
- package/dist/stories/pie-chart/PieChart.stories.js +0 -281
- package/dist/stories/popover/Popover.stories.d.ts +0 -78
- package/dist/stories/popover/Popover.stories.js +0 -74
- package/dist/stories/progress/Progress.stories.d.ts +0 -113
- package/dist/stories/progress/Progress.stories.js +0 -77
- package/dist/stories/radar-chart/RadarChart.stories.d.ts +0 -110
- package/dist/stories/radar-chart/RadarChart.stories.js +0 -201
- package/dist/stories/radio/Radio.stories.d.ts +0 -108
- package/dist/stories/radio/Radio.stories.js +0 -84
- package/dist/stories/radio/RadioCards.stories.d.ts +0 -127
- package/dist/stories/radio/RadioCards.stories.js +0 -94
- package/dist/stories/radio/RadioGroup.stories.d.ts +0 -111
- package/dist/stories/radio/RadioGroup.stories.js +0 -88
- package/dist/stories/scroll-area/ScrollArea.stories.d.ts +0 -59
- package/dist/stories/scroll-area/ScrollArea.stories.js +0 -63
- package/dist/stories/segmented-control/SegmentedControl.stories.d.ts +0 -97
- package/dist/stories/segmented-control/SegmentedControl.stories.js +0 -80
- package/dist/stories/select/Select.stories.d.ts +0 -116
- package/dist/stories/select/Select.stories.js +0 -88
- package/dist/stories/separator/Separator.stories.d.ts +0 -93
- package/dist/stories/separator/Separator.stories.js +0 -82
- package/dist/stories/skeleton/Skeleton.stories.d.ts +0 -88
- package/dist/stories/skeleton/Skeleton.stories.js +0 -92
- package/dist/stories/slider/Slider.stories.d.ts +0 -114
- package/dist/stories/slider/Slider.stories.js +0 -83
- package/dist/stories/spinner/Spinner.stories.d.ts +0 -83
- package/dist/stories/spinner/Spinner.stories.js +0 -87
- package/dist/stories/switch/Switch.stories.d.ts +0 -146
- package/dist/stories/switch/Switch.stories.js +0 -108
- package/dist/stories/tab-nav/TabNav.stories.d.ts +0 -55
- package/dist/stories/tab-nav/TabNav.stories.js +0 -59
- package/dist/stories/table/Table.stories.d.ts +0 -87
- package/dist/stories/table/Table.stories.js +0 -79
- package/dist/stories/tabs/Tabs.stories.d.ts +0 -55
- package/dist/stories/tabs/Tabs.stories.js +0 -59
- package/dist/stories/text/Text.stories.d.ts +0 -74
- package/dist/stories/text/Text.stories.js +0 -76
- package/dist/stories/textArea/TextArea.stories.d.ts +0 -117
- package/dist/stories/textArea/TextArea.stories.js +0 -96
- package/dist/stories/textfield/TextField.stories.d.ts +0 -116
- package/dist/stories/textfield/TextField.stories.js +0 -88
- package/dist/stories/toast/Toast.stories.d.ts +0 -138
- package/dist/stories/toast/Toast.stories.js +0 -104
- package/dist/stories/toggle/Toggle.stories.d.ts +0 -115
- package/dist/stories/toggle/Toggle.stories.js +0 -89
- package/dist/stories/toggle/ToggleGroup.stories.d.ts +0 -103
- package/dist/stories/toggle/ToggleGroup.stories.js +0 -94
- package/dist/stories/tooltip/Tooltip.stories.d.ts +0 -93
- package/dist/stories/tooltip/Tooltip.stories.js +0 -78
- package/dist/tsconfig.tsbuildinfo +0 -1
@@ -1,80 +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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
24
|
-
import { SegmentedControl, SegmentedControlItem } from '../../components/SegmentedControl';
|
25
|
-
import { commonArgTypes, radiusOptions, sizeOptions } from '../../constants';
|
26
|
-
var meta = {
|
27
|
-
title: 'Component/SegmentedControl',
|
28
|
-
component: SegmentedControl,
|
29
|
-
parameters: {
|
30
|
-
layout: 'centered',
|
31
|
-
themes: {
|
32
|
-
themeOverride: 'dark',
|
33
|
-
},
|
34
|
-
docs: {
|
35
|
-
description: {
|
36
|
-
component: '다양한 옵션 중 하나를 컨트롤 할 수 있는 요소',
|
37
|
-
},
|
38
|
-
},
|
39
|
-
},
|
40
|
-
tags: ['autodocs'],
|
41
|
-
argTypes: {
|
42
|
-
size: __assign(__assign({}, commonArgTypes.size), { table: {
|
43
|
-
category: 'Props',
|
44
|
-
type: {
|
45
|
-
summary: sizeOptions
|
46
|
-
.filter(function (size) { return !['x-small', 'x-large'].includes(size); })
|
47
|
-
.join(' | '),
|
48
|
-
},
|
49
|
-
}, options: sizeOptions.filter(function (size) { return !['x-small', 'x-large'].includes(size); }), description: 'segmentedControl 크기' }),
|
50
|
-
radius: __assign(__assign({}, commonArgTypes.radius), { description: 'segmentedControl 둥글기' }),
|
51
|
-
scaling: __assign(__assign({}, commonArgTypes.scaling), { description: 'segmentedControl 비율' }),
|
52
|
-
appearance: {
|
53
|
-
description: 'segmentedControl 스타일',
|
54
|
-
table: {
|
55
|
-
category: 'Props',
|
56
|
-
type: { summary: ['surface', 'classic'].join(' | ') },
|
57
|
-
},
|
58
|
-
control: { type: 'select' },
|
59
|
-
options: ['surface', 'classic'],
|
60
|
-
defaultValue: { summary: 'surface' },
|
61
|
-
},
|
62
|
-
},
|
63
|
-
};
|
64
|
-
export default meta;
|
65
|
-
export var Default = function (_a) {
|
66
|
-
var args = __rest(_a, []);
|
67
|
-
return (_jsxs(SegmentedControl, __assign({}, args, { defaultValue: 'inbox', children: [_jsx(SegmentedControlItem, { value: 'inbox', children: "Inbox" }), _jsx(SegmentedControlItem, { value: 'drafts', children: "Drafts" }), _jsx(SegmentedControlItem, { value: 'sent', children: "Sent" })] })));
|
68
|
-
};
|
69
|
-
export var Size = function (_a) {
|
70
|
-
var args = __rest(_a, []);
|
71
|
-
return (_jsx("div", { className: "flex flex-col space-y-3", children: ['small', 'medium', 'large'].map(function (size) { return (_jsxs(SegmentedControl, __assign({ defaultValue: 'inbox' }, args, { size: size, children: [_jsx(SegmentedControlItem, { value: 'inbox', children: "Inbox" }), _jsx(SegmentedControlItem, { value: 'drafts', children: "Drafts" }), _jsx(SegmentedControlItem, { value: 'sent', children: "Sent" })] }), size)); }) }));
|
72
|
-
};
|
73
|
-
export var Radius = function (_a) {
|
74
|
-
var args = __rest(_a, []);
|
75
|
-
return (_jsx("div", { className: "flex flex-col space-y-3", children: radiusOptions.map(function (radius) { return (_jsxs(SegmentedControl, __assign({ defaultValue: 'inbox' }, args, { radius: radius, children: [_jsx(SegmentedControlItem, { value: 'inbox', children: "Inbox" }), _jsx(SegmentedControlItem, { value: 'drafts', children: "Drafts" }), _jsx(SegmentedControlItem, { value: 'sent', children: "Sent" })] }), radius)); }) }));
|
76
|
-
};
|
77
|
-
export var Variant = function (_a) {
|
78
|
-
var args = __rest(_a, []);
|
79
|
-
return (_jsx("div", { className: "flex flex-col space-y-3", children: ['surface', 'classic'].map(function (appearance) { return (_jsxs(SegmentedControl, __assign({ defaultValue: 'inbox' }, args, { appearance: appearance, children: [_jsx(SegmentedControlItem, { value: 'inbox', children: "Inbox" }), _jsx(SegmentedControlItem, { value: 'drafts', children: "Drafts" }), _jsx(SegmentedControlItem, { value: 'sent', children: "Sent" })] }), appearance)); }) }));
|
80
|
-
};
|
@@ -1,116 +0,0 @@
|
|
1
|
-
/// <reference types="react" />
|
2
|
-
import { IRadius } from 'types';
|
3
|
-
declare const meta: {
|
4
|
-
title: string;
|
5
|
-
component: import("react").ForwardRefExoticComponent<import("@radix-ui/themes/dist/cjs/components/select").RootProps & import("../../components/Select/index").SelectProps & import("react").RefAttributes<never>>;
|
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
|
-
scaling: {
|
20
|
-
description: string;
|
21
|
-
table: {
|
22
|
-
category: string;
|
23
|
-
type: {
|
24
|
-
summary: string;
|
25
|
-
};
|
26
|
-
};
|
27
|
-
control: {
|
28
|
-
type: string;
|
29
|
-
};
|
30
|
-
options: import("types").IScaling[];
|
31
|
-
defaultValue: {
|
32
|
-
summary: string;
|
33
|
-
};
|
34
|
-
};
|
35
|
-
radius: {
|
36
|
-
description: string;
|
37
|
-
table: {
|
38
|
-
category: string;
|
39
|
-
type: {
|
40
|
-
summary: string;
|
41
|
-
};
|
42
|
-
};
|
43
|
-
options: IRadius[];
|
44
|
-
control: {
|
45
|
-
type: string;
|
46
|
-
};
|
47
|
-
defaultValue: {
|
48
|
-
summary: string;
|
49
|
-
};
|
50
|
-
};
|
51
|
-
color: {
|
52
|
-
description: string;
|
53
|
-
table: {
|
54
|
-
category: string;
|
55
|
-
type: {
|
56
|
-
summary: string;
|
57
|
-
};
|
58
|
-
};
|
59
|
-
options: import("types").IColor[];
|
60
|
-
control: {
|
61
|
-
type: string;
|
62
|
-
};
|
63
|
-
defaultValue: {
|
64
|
-
summary: string;
|
65
|
-
};
|
66
|
-
};
|
67
|
-
size: {
|
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
|
-
description: string;
|
82
|
-
};
|
83
|
-
appearance: {
|
84
|
-
table: {
|
85
|
-
category: string;
|
86
|
-
type: {
|
87
|
-
summary: string;
|
88
|
-
};
|
89
|
-
};
|
90
|
-
control: {
|
91
|
-
type: string;
|
92
|
-
};
|
93
|
-
defaultValue: {
|
94
|
-
summary: string;
|
95
|
-
};
|
96
|
-
description: string;
|
97
|
-
options: string[];
|
98
|
-
};
|
99
|
-
};
|
100
|
-
};
|
101
|
-
export default meta;
|
102
|
-
export declare const Default: ({ ...args }: {
|
103
|
-
[x: string]: any;
|
104
|
-
}) => import("react/jsx-runtime").JSX.Element;
|
105
|
-
export declare const Size: ({ ...args }: {
|
106
|
-
[x: string]: any;
|
107
|
-
}) => import("react/jsx-runtime").JSX.Element;
|
108
|
-
export declare const Appearance: ({ ...args }: {
|
109
|
-
[x: string]: any;
|
110
|
-
}) => import("react/jsx-runtime").JSX.Element;
|
111
|
-
export declare const Radius: ({ ...args }: {
|
112
|
-
[x: string]: any;
|
113
|
-
}) => import("react/jsx-runtime").JSX.Element;
|
114
|
-
export declare const WithIcon: ({ ...args }: {
|
115
|
-
[x: string]: any;
|
116
|
-
}) => import("react/jsx-runtime").JSX.Element;
|
@@ -1,88 +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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
24
|
-
import { Select, SelectContent, SelectItem, SelectTrigger } from '../../components/Select/index';
|
25
|
-
import { commonArgTypes, radiusOptions } from '../../constants';
|
26
|
-
import { MoonIcon, SunIcon } from '@radix-ui/react-icons';
|
27
|
-
var meta = {
|
28
|
-
title: 'Component/Select',
|
29
|
-
component: Select,
|
30
|
-
parameters: {
|
31
|
-
layout: 'centered',
|
32
|
-
themes: {
|
33
|
-
themeOverride: 'dark',
|
34
|
-
},
|
35
|
-
docs: {
|
36
|
-
description: {
|
37
|
-
component: '제공된 목록에서 하나 이상의 목록을 선택할 수 있는 기능',
|
38
|
-
},
|
39
|
-
},
|
40
|
-
},
|
41
|
-
tags: ['autodocs'],
|
42
|
-
argTypes: {
|
43
|
-
scaling: __assign(__assign({}, commonArgTypes.scaling), { description: 'Select 크기' }),
|
44
|
-
radius: __assign(__assign({}, commonArgTypes.radius), { description: 'Select 둥글기' }),
|
45
|
-
color: __assign(__assign({}, commonArgTypes.color), { description: 'Select 색상' }),
|
46
|
-
size: {
|
47
|
-
table: {
|
48
|
-
category: 'Props',
|
49
|
-
type: { summary: ['small', 'medium', 'large'].join(' | ') },
|
50
|
-
},
|
51
|
-
control: { type: 'select' },
|
52
|
-
options: ['small', 'medium', 'large'],
|
53
|
-
defaultValue: { summary: 'medium' },
|
54
|
-
description: 'Select 크기',
|
55
|
-
},
|
56
|
-
appearance: {
|
57
|
-
table: {
|
58
|
-
category: 'Props',
|
59
|
-
type: { summary: ['classic', 'soft', 'surface', 'ghost'].join(' | ') },
|
60
|
-
},
|
61
|
-
control: { type: 'select' },
|
62
|
-
defaultValue: { summary: 'surface' },
|
63
|
-
description: 'Select 스타일',
|
64
|
-
options: ['classic', 'soft', 'surface', 'ghost'],
|
65
|
-
},
|
66
|
-
},
|
67
|
-
};
|
68
|
-
export default meta;
|
69
|
-
export var Default = function (_a) {
|
70
|
-
var args = __rest(_a, []);
|
71
|
-
return (_jsxs(Select, __assign({}, args, { children: [_jsx(SelectTrigger, __assign({}, args, { placeholder: "Select..." })), _jsxs(SelectContent, __assign({}, args, { children: [_jsx(SelectItem, __assign({ value: "apple" }, args, { children: "Apple" })), _jsx(SelectItem, __assign({ value: "orange" }, args, { children: "Orange" }))] }))] })));
|
72
|
-
};
|
73
|
-
export var Size = function (_a) {
|
74
|
-
var args = __rest(_a, []);
|
75
|
-
return (_jsx("div", { className: "flex gap-3", children: ['small', 'medium', 'large'].map(function (size) { return (_jsxs(Select, __assign({ size: size }, args, { children: [_jsx(SelectTrigger, __assign({}, args, { placeholder: "Select..." })), _jsxs(SelectContent, __assign({}, args, { children: [_jsx(SelectItem, __assign({ value: "apple" }, args, { children: "Apple" })), _jsx(SelectItem, __assign({ value: "orange" }, args, { children: "Orange" }))] }))] }), size)); }) }));
|
76
|
-
};
|
77
|
-
export var Appearance = function (_a) {
|
78
|
-
var args = __rest(_a, []);
|
79
|
-
return (_jsx("div", { className: "flex gap-3", children: ['classic', 'surface', 'soft', 'ghost'].map(function (appearance) { return (_jsxs(Select, __assign({}, args, { children: [_jsx(SelectTrigger, __assign({ appearance: appearance }, args, { placeholder: "Select..." })), _jsxs(SelectContent, __assign({}, args, { children: [_jsx(SelectItem, __assign({ value: "apple" }, args, { children: "Apple" })), _jsx(SelectItem, __assign({ value: "orange" }, args, { children: "Orange" }))] }))] }), appearance)); }) }));
|
80
|
-
};
|
81
|
-
export var Radius = function (_a) {
|
82
|
-
var args = __rest(_a, []);
|
83
|
-
return (_jsx("div", { className: "flex gap-3", children: radiusOptions.map(function (radius) { return (_jsxs(Select, __assign({}, args, { children: [_jsx(SelectTrigger, __assign({ radius: radius }, args, { placeholder: "Select..." })), _jsxs(SelectContent, __assign({}, args, { children: [_jsx(SelectItem, __assign({ value: "apple" }, args, { children: "Apple" })), _jsx(SelectItem, __assign({ value: "orange" }, args, { children: "Orange" }))] }))] }), radius)); }) }));
|
84
|
-
};
|
85
|
-
export var WithIcon = function (_a) {
|
86
|
-
var args = __rest(_a, []);
|
87
|
-
return (_jsxs(Select, __assign({ defaultValue: "dark" }, args, { children: [_jsx(SelectTrigger, __assign({}, args)), _jsxs(SelectContent, __assign({}, args, { children: [_jsx(SelectItem, __assign({ value: "dark" }, args, { children: _jsxs("div", { className: "flex gap-2 items-center", children: [_jsx(MoonIcon, {}), _jsx("label", { children: "Dark" })] }) })), _jsx(SelectItem, __assign({ value: "light" }, args, { children: _jsxs("div", { className: "flex gap-2 items-center", children: [_jsx(SunIcon, {}), _jsx("label", { children: "Light" })] }) }))] }))] })));
|
88
|
-
};
|
@@ -1,93 +0,0 @@
|
|
1
|
-
/// <reference types="react" />
|
2
|
-
declare const meta: {
|
3
|
-
title: string;
|
4
|
-
component: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/themes").SeparatorProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("../../components/Separator/index").SeparatorProps & import("react").RefAttributes<HTMLSpanElement>>;
|
5
|
-
parameters: {
|
6
|
-
layout: string;
|
7
|
-
themes: {
|
8
|
-
themeOverride: string;
|
9
|
-
};
|
10
|
-
docs: {
|
11
|
-
description: {
|
12
|
-
component: string;
|
13
|
-
};
|
14
|
-
};
|
15
|
-
};
|
16
|
-
tags: string[];
|
17
|
-
argTypes: {
|
18
|
-
scaling: {
|
19
|
-
description: string;
|
20
|
-
table: {
|
21
|
-
category: string;
|
22
|
-
type: {
|
23
|
-
summary: string;
|
24
|
-
};
|
25
|
-
};
|
26
|
-
control: {
|
27
|
-
type: string;
|
28
|
-
};
|
29
|
-
options: import("types").IScaling[];
|
30
|
-
defaultValue: {
|
31
|
-
summary: string;
|
32
|
-
};
|
33
|
-
};
|
34
|
-
color: {
|
35
|
-
defaultValue: {
|
36
|
-
summary: string;
|
37
|
-
};
|
38
|
-
description: string;
|
39
|
-
table: {
|
40
|
-
category: string;
|
41
|
-
type: {
|
42
|
-
summary: string;
|
43
|
-
};
|
44
|
-
};
|
45
|
-
options: import("types").IColor[];
|
46
|
-
control: {
|
47
|
-
type: string;
|
48
|
-
};
|
49
|
-
};
|
50
|
-
orientation: {
|
51
|
-
table: {
|
52
|
-
category: string;
|
53
|
-
type: {
|
54
|
-
summary: string;
|
55
|
-
};
|
56
|
-
};
|
57
|
-
options: string[];
|
58
|
-
description: string;
|
59
|
-
defaultValue: {
|
60
|
-
summary: string;
|
61
|
-
};
|
62
|
-
};
|
63
|
-
size: {
|
64
|
-
table: {
|
65
|
-
category: string;
|
66
|
-
type: {
|
67
|
-
summary: string;
|
68
|
-
};
|
69
|
-
};
|
70
|
-
control: {
|
71
|
-
type: string;
|
72
|
-
};
|
73
|
-
options: string[];
|
74
|
-
defaultValue: {
|
75
|
-
summary: string;
|
76
|
-
};
|
77
|
-
description: string;
|
78
|
-
};
|
79
|
-
};
|
80
|
-
};
|
81
|
-
export default meta;
|
82
|
-
export declare const Default: ({ ...args }: {
|
83
|
-
[x: string]: any;
|
84
|
-
}) => import("react/jsx-runtime").JSX.Element;
|
85
|
-
export declare const Orientation: ({ ...args }: {
|
86
|
-
[x: string]: any;
|
87
|
-
}) => import("react/jsx-runtime").JSX.Element;
|
88
|
-
export declare const HorizontalSize: ({ ...args }: {
|
89
|
-
[x: string]: any;
|
90
|
-
}) => import("react/jsx-runtime").JSX.Element;
|
91
|
-
export declare const VerticalSize: ({ ...args }: {
|
92
|
-
[x: string]: any;
|
93
|
-
}) => import("react/jsx-runtime").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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
24
|
-
import { Separator } from '../../components/Separator/index';
|
25
|
-
import { commonArgTypes } from '../../constants';
|
26
|
-
var meta = {
|
27
|
-
title: 'Component/Separator',
|
28
|
-
component: Separator,
|
29
|
-
parameters: {
|
30
|
-
layout: 'centered',
|
31
|
-
themes: {
|
32
|
-
themeOverride: 'dark',
|
33
|
-
},
|
34
|
-
docs: {
|
35
|
-
description: {
|
36
|
-
component: '시각적, 의미적으로 콘텐츠를 구분하는 선',
|
37
|
-
},
|
38
|
-
},
|
39
|
-
},
|
40
|
-
tags: ['autodocs'],
|
41
|
-
argTypes: {
|
42
|
-
scaling: __assign(__assign({}, commonArgTypes.scaling), { description: 'Separator component 크기' }),
|
43
|
-
color: __assign(__assign({}, commonArgTypes.color), { defaultValue: { summary: 'slate' }, description: 'Separator component 색상' }),
|
44
|
-
orientation: {
|
45
|
-
table: {
|
46
|
-
category: 'Props',
|
47
|
-
type: { summary: ['horizontal', 'vertical'].join(' | ') },
|
48
|
-
},
|
49
|
-
options: ['horizontal', 'vertical'],
|
50
|
-
description: 'Separator component 방향',
|
51
|
-
defaultValue: { summary: 'horizontal' },
|
52
|
-
// control: { type: 'select' },
|
53
|
-
},
|
54
|
-
size: {
|
55
|
-
table: {
|
56
|
-
category: 'Props',
|
57
|
-
type: { summary: ['small', 'medium', 'large', 'fill-large'].join(' | ') },
|
58
|
-
},
|
59
|
-
control: { type: 'select' },
|
60
|
-
options: ['small', 'medium', 'large', 'fill-large'],
|
61
|
-
defaultValue: { summary: 'medium' },
|
62
|
-
description: 'Separator component 크기',
|
63
|
-
},
|
64
|
-
},
|
65
|
-
};
|
66
|
-
export default meta;
|
67
|
-
export var Default = function (_a) {
|
68
|
-
var args = __rest(_a, []);
|
69
|
-
return (_jsxs("div", { className: "text-slate-12 dark:text-slate-1 w-full max-w-[300px] mx-[15px]", children: ["Tools for building high-quality, accessible UI.", _jsx(Separator, __assign({ my: "3", size: "fill-large" }, args)), _jsxs("div", { className: "flex gap-3 text-slate-12 dark:text-slate-1 ", children: ["Themes", _jsx(Separator, __assign({ orientation: "vertical" }, args)), "Primitives", _jsx(Separator, __assign({ orientation: "vertical" }, args)), "Icons", _jsx(Separator, __assign({ orientation: "vertical" }, args)), "Colors"] })] }));
|
70
|
-
};
|
71
|
-
export var Orientation = function (_a) {
|
72
|
-
var args = __rest(_a, []);
|
73
|
-
return (_jsxs("div", { className: "grid grid-cols-2 gap-2", children: [_jsx(Separator, __assign({ orientation: 'horizontal' }, args)), _jsx(Separator, __assign({ orientation: 'vertical' }, args))] }));
|
74
|
-
};
|
75
|
-
export var HorizontalSize = function (_a) {
|
76
|
-
var args = __rest(_a, []);
|
77
|
-
return (_jsxs("div", { className: "w-96 grid gap-4", children: [_jsx(Separator, __assign({ orientation: 'horizontal', size: 'small' }, args)), _jsx(Separator, __assign({ orientation: 'horizontal', size: 'medium' }, args)), _jsx(Separator, __assign({ orientation: 'horizontal', size: 'large' }, args)), _jsx(Separator, __assign({ orientation: 'horizontal', size: 'fill-large' }, args))] }));
|
78
|
-
};
|
79
|
-
export var VerticalSize = function (_a) {
|
80
|
-
var args = __rest(_a, []);
|
81
|
-
return (_jsxs("div", { className: "h-60 grid grid-cols-4 gap-4", children: [_jsx(Separator, __assign({ orientation: 'vertical', size: 'small' }, args)), _jsx(Separator, __assign({ orientation: 'vertical', size: 'medium' }, args)), _jsx(Separator, __assign({ orientation: 'vertical', size: 'large' }, args)), _jsx(Separator, __assign({ orientation: 'vertical', size: 'fill-large' }, args))] }));
|
82
|
-
};
|
@@ -1,88 +0,0 @@
|
|
1
|
-
/// <reference types="react" />
|
2
|
-
import { IRadius } from 'types';
|
3
|
-
declare const meta: {
|
4
|
-
title: string;
|
5
|
-
component: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("../../components/Skeleton/index").SkeletonProps & import("react").RefAttributes<HTMLSpanElement>>;
|
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
|
-
defaultValue: {
|
21
|
-
summary: string;
|
22
|
-
};
|
23
|
-
description: string;
|
24
|
-
table: {
|
25
|
-
category: string;
|
26
|
-
type: {
|
27
|
-
summary: string;
|
28
|
-
};
|
29
|
-
};
|
30
|
-
options: IRadius[];
|
31
|
-
control: {
|
32
|
-
type: string;
|
33
|
-
};
|
34
|
-
};
|
35
|
-
loading: {
|
36
|
-
table: {
|
37
|
-
category: string;
|
38
|
-
type: {
|
39
|
-
summary: string;
|
40
|
-
};
|
41
|
-
};
|
42
|
-
options: boolean[];
|
43
|
-
control: {
|
44
|
-
type: string;
|
45
|
-
};
|
46
|
-
description: string;
|
47
|
-
defaultValue: {
|
48
|
-
summary: string;
|
49
|
-
};
|
50
|
-
};
|
51
|
-
width: {
|
52
|
-
table: {
|
53
|
-
category: string;
|
54
|
-
};
|
55
|
-
control: {
|
56
|
-
type: string;
|
57
|
-
};
|
58
|
-
description: string;
|
59
|
-
defaultValue: {};
|
60
|
-
};
|
61
|
-
height: {
|
62
|
-
table: {
|
63
|
-
category: string;
|
64
|
-
};
|
65
|
-
control: {
|
66
|
-
type: string;
|
67
|
-
};
|
68
|
-
description: string;
|
69
|
-
defaultValue: {};
|
70
|
-
};
|
71
|
-
};
|
72
|
-
};
|
73
|
-
export default meta;
|
74
|
-
export declare const Default: ({ ...args }: {
|
75
|
-
[x: string]: any;
|
76
|
-
}) => import("react/jsx-runtime").JSX.Element;
|
77
|
-
export declare const Loading: ({ ...args }: {
|
78
|
-
[x: string]: any;
|
79
|
-
}) => import("react/jsx-runtime").JSX.Element;
|
80
|
-
export declare const WithChildren: ({ ...args }: {
|
81
|
-
[x: string]: any;
|
82
|
-
}) => import("react/jsx-runtime").JSX.Element;
|
83
|
-
export declare const Radius: ({ ...args }: {
|
84
|
-
[x: string]: any;
|
85
|
-
}) => import("react/jsx-runtime").JSX.Element;
|
86
|
-
export declare const Size: ({ ...args }: {
|
87
|
-
[x: string]: any;
|
88
|
-
}) => import("react/jsx-runtime").JSX.Element;
|
@@ -1,92 +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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
24
|
-
import { Skeleton } from '../../components/Skeleton/index';
|
25
|
-
import { commonArgTypes, radiusOptions } from '../../constants';
|
26
|
-
import { ToggleSwitch } from '../../components/ToggleSwitch';
|
27
|
-
var meta = {
|
28
|
-
title: 'Component/Skeleton',
|
29
|
-
component: Skeleton,
|
30
|
-
parameters: {
|
31
|
-
layout: 'centered',
|
32
|
-
themes: {
|
33
|
-
themeOverride: 'dark',
|
34
|
-
},
|
35
|
-
docs: {
|
36
|
-
description: {
|
37
|
-
component: '로딩상황 속에서 실제 데이터가 렌더링 될 화면의 윤각 노출',
|
38
|
-
},
|
39
|
-
},
|
40
|
-
},
|
41
|
-
tags: ['autodocs'],
|
42
|
-
argTypes: {
|
43
|
-
radius: __assign(__assign({}, commonArgTypes.radius), { defaultValue: { summary: '' }, description: 'Skeleton 컴포넌트 둥글기' }),
|
44
|
-
loading: {
|
45
|
-
table: {
|
46
|
-
category: 'Props',
|
47
|
-
type: { summary: [true, false].join(' | ') },
|
48
|
-
},
|
49
|
-
options: [true, false],
|
50
|
-
control: { type: 'select' },
|
51
|
-
description: 'Skeleton 컴포넌트 visible',
|
52
|
-
defaultValue: { summary: 'true' },
|
53
|
-
},
|
54
|
-
width: {
|
55
|
-
table: {
|
56
|
-
category: 'Props',
|
57
|
-
},
|
58
|
-
control: { type: 'text' },
|
59
|
-
description: 'Skeleton 컴포넌트 가로길이',
|
60
|
-
defaultValue: {},
|
61
|
-
},
|
62
|
-
height: {
|
63
|
-
table: {
|
64
|
-
category: 'Props',
|
65
|
-
},
|
66
|
-
control: { type: 'text' },
|
67
|
-
description: 'Skeleton 컴포넌트 세로길이',
|
68
|
-
defaultValue: {},
|
69
|
-
},
|
70
|
-
},
|
71
|
-
};
|
72
|
-
export default meta;
|
73
|
-
export var Default = function (_a) {
|
74
|
-
var args = __rest(_a, []);
|
75
|
-
return (_jsx(Skeleton, __assign({}, args, { children: _jsx("div", { children: "Component" }) })));
|
76
|
-
};
|
77
|
-
export var Loading = function (_a) {
|
78
|
-
var args = __rest(_a, []);
|
79
|
-
return (_jsxs("div", { className: "", children: [_jsx(Skeleton, __assign({ loading: true }, args, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque felis tellus, efficitur id convallis a, viverra eget libero. Nam magna erat, fringilla sed commodo sed, aliquet nec magna." })), _jsx(Skeleton, __assign({ loading: false }, args, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque felis tellus, efficitur id convallis a, viverra eget libero. Nam magna erat, fringilla sed commodo sed, aliquet nec magna." }))] }));
|
80
|
-
};
|
81
|
-
export var WithChildren = function (_a) {
|
82
|
-
var args = __rest(_a, []);
|
83
|
-
return (_jsxs("div", { className: "grid gap-4 grid-cols-2", children: [_jsx(Skeleton, { loading: true, children: _jsx(ToggleSwitch, {}) }), _jsx(Skeleton, { loading: false, children: _jsx(ToggleSwitch, {}) })] }));
|
84
|
-
};
|
85
|
-
export var Radius = function (_a) {
|
86
|
-
var args = __rest(_a, []);
|
87
|
-
return (_jsx("div", { className: "grid gap-5", children: radiusOptions.map(function (radius) { return (_jsx("div", { children: _jsx(Skeleton, __assign({ loading: true, radius: radius }, args, { children: _jsx("div", { children: "Component" }) })) }, radius)); }) }));
|
88
|
-
};
|
89
|
-
export var Size = function (_a) {
|
90
|
-
var args = __rest(_a, []);
|
91
|
-
return (_jsx("div", { className: "", children: _jsx(Skeleton, __assign({ loading: true, width: "48px", height: "48px" }, args)) }));
|
92
|
-
};
|