@lotte-innovate/ui-component-test 0.0.8 → 0.0.10

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 (264) hide show
  1. package/dist/Typography/Header/index.d.ts +1 -1
  2. package/dist/Typography/Header/{index.jsx → index.js} +2 -5
  3. package/dist/Typography/Text/{index.jsx → index.js} +3 -6
  4. package/dist/app/layout.d.ts +1 -1
  5. package/dist/app/{layout.jsx → layout.js} +2 -3
  6. package/dist/app/page.d.ts +1 -2
  7. package/dist/app/{page.jsx → page.js} +2 -2
  8. package/dist/app/template/badgeTemplate.d.ts +1 -2
  9. package/dist/app/template/badgeTemplate.js +11 -0
  10. package/dist/app/template/buttonTemplate.d.ts +1 -2
  11. package/dist/app/template/buttonTemplate.js +11 -0
  12. package/dist/app/template/colorPicker.d.ts +1 -2
  13. package/dist/app/template/colorPicker.js +14 -0
  14. package/dist/app/template/textTemplate.d.ts +1 -2
  15. package/dist/app/template/textTemplate.js +23 -0
  16. package/dist/app/template/theme.d.ts +2 -2
  17. package/dist/app/template/theme.js +12 -0
  18. package/dist/components/Accordion/{index.jsx → index.js} +5 -17
  19. package/dist/components/AlertDialog/{AlertDialogAction.jsx → AlertDialogAction.js} +3 -4
  20. package/dist/components/AlertDialog/{AlertDialogCancel.jsx → AlertDialogCancel.js} +3 -4
  21. package/dist/components/AlertDialog/{AlertDialogContent.jsx → AlertDialogContent.js} +3 -7
  22. package/dist/components/AlertDialog/{AlertDialogDescription.jsx → AlertDialogDescription.js} +14 -4
  23. package/dist/components/AlertDialog/{AlertDialogTitle.jsx → AlertDialogTitle.js} +14 -4
  24. package/dist/components/AlertDialog/{AlertDialogTrigger.jsx → AlertDialogTrigger.js} +3 -4
  25. package/dist/components/AlertDialog/{index.jsx → index.js} +14 -2
  26. package/dist/components/AspectRatio/{index.jsx → index.js} +3 -4
  27. package/dist/components/Avatar/{index.jsx → index.js} +3 -7
  28. package/dist/components/Badge/{index.jsx → index.js} +3 -4
  29. package/dist/components/BubbleChart/index.d.ts +1 -2
  30. package/dist/components/BubbleChart/{index.jsx → index.js} +2 -2
  31. package/dist/components/Button/{index.jsx → index.js} +3 -4
  32. package/dist/components/Callout/{CalloutIcon.jsx → CalloutIcon.js} +3 -8
  33. package/dist/components/Callout/{CalloutText.jsx → CalloutText.js} +14 -4
  34. package/dist/components/Callout/{index.jsx → index.js} +3 -6
  35. package/dist/components/Card/{index.jsx → index.js} +3 -4
  36. package/dist/components/Checkbox/{index.jsx → index.js} +3 -11
  37. package/dist/components/CheckboxCard/{index.jsx → index.js} +3 -5
  38. package/dist/components/CheckboxGroup/{CheckboxGroupItem.jsx → CheckboxGroupItem.js} +14 -6
  39. package/dist/components/CheckboxGroup/{index.jsx → index.js} +2 -5
  40. package/dist/components/ContextMenu/{ContextMenuCheckboxItem.jsx → ContextMenuCheckboxItem.js} +14 -7
  41. package/dist/components/ContextMenu/{ContextMenuContent.jsx → ContextMenuContent.js} +3 -6
  42. package/dist/components/ContextMenu/{ContextMenuGroup.jsx → ContextMenuGroup.js} +14 -4
  43. package/dist/components/ContextMenu/{ContextMenuItem.jsx → ContextMenuItem.js} +3 -5
  44. package/dist/components/ContextMenu/{ContextMenuItemIndicator.jsx → ContextMenuItemIndicator.js} +3 -4
  45. package/dist/components/ContextMenu/{ContextMenuLabel.jsx → ContextMenuLabel.js} +3 -4
  46. package/dist/components/ContextMenu/{ContextMenuRadioGroup.jsx → ContextMenuRadioGroup.js} +14 -6
  47. package/dist/components/ContextMenu/{ContextMenuRadioItem.jsx → ContextMenuRadioItem.js} +14 -7
  48. package/dist/components/ContextMenu/{ContextMenuSeparator.jsx → ContextMenuSeparator.js} +14 -4
  49. package/dist/components/ContextMenu/{ContextMenuSubContent.jsx → ContextMenuSubContent.js} +6 -9
  50. package/dist/components/ContextMenu/{ContextMenuSubTrigger.jsx → ContextMenuSubTrigger.js} +14 -9
  51. package/dist/components/ContextMenu/{ContextMenuTrigger.jsx → ContextMenuTrigger.js} +14 -4
  52. package/dist/components/ContextMenu/{index.jsx → index.js} +14 -4
  53. package/dist/components/DataList/{DataListItem.jsx → DataListItem.js} +3 -4
  54. package/dist/components/DataList/{DataListLabel.jsx → DataListLabel.js} +3 -4
  55. package/dist/components/DataList/{DataListValue.jsx → DataListValue.js} +3 -4
  56. package/dist/components/DataList/{index.jsx → index.js} +14 -6
  57. package/dist/components/Dialog/{DialogAction.jsx → DialogAction.js} +14 -4
  58. package/dist/components/Dialog/{DialogCancel.jsx → DialogCancel.js} +14 -4
  59. package/dist/components/Dialog/{DialogContent.jsx → DialogContent.js} +3 -4
  60. package/dist/components/Dialog/{DialogDescription.jsx → DialogDescription.js} +14 -4
  61. package/dist/components/Dialog/{DialogSlot.jsx → DialogSlot.js} +14 -4
  62. package/dist/components/Dialog/{DialogTitle.jsx → DialogTitle.js} +14 -4
  63. package/dist/components/Dialog/{DialogTrigger.jsx → DialogTrigger.js} +14 -4
  64. package/dist/components/Dialog/{index.jsx → index.js} +14 -4
  65. package/dist/components/DoughnutChart/index.d.ts +1 -2
  66. package/dist/components/DoughnutChart/{index.jsx → index.js} +2 -2
  67. package/dist/components/DropdownMenu/{DropdonMenuRadioGroup.jsx → DropdonMenuRadioGroup.js} +14 -6
  68. package/dist/components/DropdownMenu/{DropdonMenuSubContent.jsx → DropdonMenuSubContent.js} +7 -10
  69. package/dist/components/DropdownMenu/{DropdownMenuCheckboxItem.jsx → DropdownMenuCheckboxItem.js} +14 -7
  70. package/dist/components/DropdownMenu/{DropdownMenuContent.jsx → DropdownMenuContent.js} +3 -6
  71. package/dist/components/DropdownMenu/{DropdownMenuItem.jsx → DropdownMenuItem.js} +3 -5
  72. package/dist/components/DropdownMenu/{DropdownMenuItemIndicator.jsx → DropdownMenuItemIndicator.js} +3 -4
  73. package/dist/components/DropdownMenu/{DropdownMenuLable.jsx → DropdownMenuLable.js} +3 -4
  74. package/dist/components/DropdownMenu/{DropdownMenuRadioItem.jsx → DropdownMenuRadioItem.js} +14 -7
  75. package/dist/components/DropdownMenu/{DropdownMenuSeparator.jsx → DropdownMenuSeparator.js} +14 -2
  76. package/dist/components/DropdownMenu/{DropdownMenuSub.jsx → DropdownMenuSub.js} +14 -2
  77. package/dist/components/DropdownMenu/{DropdownMenuSubTrigger.jsx → DropdownMenuSubTrigger.js} +14 -7
  78. package/dist/components/DropdownMenu/{DropdownMenuTrigger.jsx → DropdownMenuTrigger.js} +14 -4
  79. package/dist/components/DropdownMenu/{index.jsx → index.js} +14 -2
  80. package/dist/components/HoverCard/{HoverCardContent.jsx → HoverCardContent.js} +3 -4
  81. package/dist/components/HoverCard/{HoverCardTrigger.jsx → HoverCardTrigger.js} +14 -4
  82. package/dist/components/HoverCard/{index.jsx → index.js} +14 -4
  83. package/dist/components/IconButton/{index.jsx → index.js} +2 -3
  84. package/dist/components/Input/Input.stories.d.ts +4 -4
  85. package/dist/components/Input/{Input.stories.jsx → Input.stories.js} +15 -9
  86. package/dist/components/Input/index.d.ts +1 -1
  87. package/dist/components/Input/{index.jsx → index.js} +3 -3
  88. package/dist/components/Inset/{index.jsx → index.js} +3 -6
  89. package/dist/components/Label/{index.jsx → index.js} +2 -3
  90. package/dist/components/Menubar/{MenubarCheckboxItem.jsx → MenubarCheckboxItem.js} +14 -7
  91. package/dist/components/Menubar/{MenubarContent.jsx → MenubarContent.js} +7 -10
  92. package/dist/components/Menubar/{MenubarItem.jsx → MenubarItem.js} +3 -5
  93. package/dist/components/Menubar/{MenubarItemIndicator.jsx → MenubarItemIndicator.js} +3 -4
  94. package/dist/components/Menubar/{MenubarMenu.jsx → MenubarMenu.js} +14 -2
  95. package/dist/components/Menubar/{MenubarRadioGroup.jsx → MenubarRadioGroup.js} +14 -6
  96. package/dist/components/Menubar/{MenubarRadioItem.jsx → MenubarRadioItem.js} +14 -7
  97. package/dist/components/Menubar/{MenubarSeparator.jsx → MenubarSeparator.js} +14 -4
  98. package/dist/components/Menubar/{MenubarSub.jsx → MenubarSub.js} +14 -2
  99. package/dist/components/Menubar/{MenubarSubContent.jsx → MenubarSubContent.js} +4 -5
  100. package/dist/components/Menubar/{MenubarSubTrigger.jsx → MenubarSubTrigger.js} +14 -7
  101. package/dist/components/Menubar/{MenubarTrigger.jsx → MenubarTrigger.js} +3 -4
  102. package/dist/components/Menubar/{index.jsx → index.js} +3 -6
  103. package/dist/components/NavigationMenu/{NavigationMenuContent.jsx → NavigationMenuContent.js} +3 -4
  104. package/dist/components/NavigationMenu/NavigationMenuIndicator.js +31 -0
  105. package/dist/components/NavigationMenu/{NavigationMenuItem.jsx → NavigationMenuItem.js} +14 -4
  106. package/dist/components/NavigationMenu/{NavigationMenuLink.jsx → NavigationMenuLink.js} +3 -4
  107. package/dist/components/NavigationMenu/{NavigationMenuList.jsx → NavigationMenuList.js} +3 -5
  108. package/dist/components/NavigationMenu/{NavigationMenuTrigger.jsx → NavigationMenuTrigger.js} +3 -5
  109. package/dist/components/NavigationMenu/{NavigationMenuViewport.jsx → NavigationMenuViewport.js} +3 -4
  110. package/dist/components/NavigationMenu/{index.jsx → index.js} +14 -6
  111. package/dist/components/PieChart/index.d.ts +1 -2
  112. package/dist/components/PieChart/{index.jsx → index.js} +2 -2
  113. package/dist/components/Popover/{PopoverClose.jsx → PopoverClose.js} +14 -4
  114. package/dist/components/Popover/{PopoverContent.jsx → PopoverContent.js} +3 -4
  115. package/dist/components/Popover/{PopoverTrigger.jsx → PopoverTrigger.js} +14 -4
  116. package/dist/components/Popover/{index.jsx → index.js} +14 -4
  117. package/dist/components/Progress/{index.jsx → index.js} +3 -4
  118. package/dist/components/RadarChart/index.d.ts +1 -2
  119. package/dist/components/RadarChart/{index.jsx → index.js} +2 -2
  120. package/dist/components/Radio/{index.jsx → index.js} +13 -8
  121. package/dist/components/RadioCards/{RadioCardsItem.jsx → RadioCardsItem.js} +14 -4
  122. package/dist/components/RadioCards/{index.jsx → index.js} +3 -6
  123. package/dist/components/RadioGroup/{RadioGroupItem.jsx → RadioGroupItem.js} +14 -4
  124. package/dist/components/RadioGroup/{index.jsx → index.js} +14 -6
  125. package/dist/components/ScrollArea/{index.jsx → index.js} +14 -6
  126. package/dist/components/SegmentedControl/{SegmentedControlItem.jsx → SegmentedControlItem.js} +14 -4
  127. package/dist/components/SegmentedControl/{index.jsx → index.js} +2 -5
  128. package/dist/components/Select/{index.jsx → index.js} +8 -23
  129. package/dist/components/Separator/{index.jsx → index.js} +2 -5
  130. package/dist/components/Skeleton/{index.jsx → index.js} +2 -5
  131. package/dist/components/Slider/{index.jsx → index.js} +2 -3
  132. package/dist/components/Spinner/{index.jsx → index.js} +2 -5
  133. package/dist/components/TabNav/{index.jsx → index.js} +14 -8
  134. package/dist/components/Table/{index.jsx → index.js} +8 -23
  135. package/dist/components/Tabs/{index.jsx → index.js} +5 -14
  136. package/dist/components/TextArea/{index.jsx → index.js} +2 -3
  137. package/dist/components/TextField/{index.jsx → index.js} +3 -8
  138. package/dist/components/Toast/{ToastActionButton.jsx → ToastActionButton.js} +3 -4
  139. package/dist/components/Toast/{ToastDescription.jsx → ToastDescription.js} +14 -6
  140. package/dist/components/Toast/{ToastTitle.jsx → ToastTitle.js} +14 -4
  141. package/dist/components/Toast/{index.jsx → index.js} +3 -9
  142. package/dist/components/Toggle/{ToggleWithText.jsx → ToggleWithText.js} +4 -6
  143. package/dist/components/Toggle/{index.jsx → index.js} +3 -4
  144. package/dist/components/ToggleGroup/{index.jsx → index.js} +3 -6
  145. package/dist/components/ToggleGroup/{toggleGroupItem.jsx → toggleGroupItem.js} +14 -4
  146. package/dist/components/ToggleSwitch/{index.jsx → index.js} +2 -6
  147. package/dist/components/Tooltip/index.d.ts +1 -1
  148. package/dist/components/Tooltip/{index.jsx → index.js} +2 -11
  149. package/dist/index.d.ts +2 -0
  150. package/dist/index.js +2 -3
  151. package/dist/stories/Welcome.d.ts +1 -2
  152. package/dist/stories/Welcome.js +30 -0
  153. package/dist/stories/accordion/Accordion.stories.d.ts +1 -1
  154. package/dist/stories/accordion/{Accordion.stories.jsx → Accordion.stories.js} +2 -20
  155. package/dist/stories/alert-dialog/AlertDialog.stories.d.ts +1 -1
  156. package/dist/stories/alert-dialog/{AlertDialog.stories.jsx → AlertDialog.stories.js} +2 -15
  157. package/dist/stories/aspect-ratio/AspectRatio.stories.d.ts +3 -3
  158. package/dist/stories/aspect-ratio/AspectRatio.stories.js +78 -0
  159. package/dist/stories/avatar/Avatar.stories.d.ts +5 -5
  160. package/dist/stories/avatar/{Avatar.stories.jsx → Avatar.stories.js} +6 -17
  161. package/dist/stories/badge/Badge.stories.d.ts +6 -6
  162. package/dist/stories/badge/{Badge.stories.jsx → Badge.stories.js} +7 -51
  163. package/dist/stories/bubble-chart/BubbleChart.stories.d.ts +4 -5
  164. package/dist/stories/bubble-chart/{BubbleChart.stories.jsx → BubbleChart.stories.js} +4 -12
  165. package/dist/stories/button/Button.stories.d.ts +7 -7
  166. package/dist/stories/button/{Button.stories.jsx → Button.stories.js} +8 -41
  167. package/dist/stories/button/IconButton.stories.d.ts +4 -4
  168. package/dist/stories/button/{IconButton.stories.jsx → IconButton.stories.js} +5 -18
  169. package/dist/stories/callout/Callout.stories.d.ts +7 -7
  170. package/dist/stories/callout/Callout.stories.js +104 -0
  171. package/dist/stories/card/Card.stories.d.ts +5 -5
  172. package/dist/stories/card/{Card.stories.jsx → Card.stories.js} +6 -56
  173. package/dist/stories/checkbox/Checkbox.stories.d.ts +6 -6
  174. package/dist/stories/checkbox/{Checkbox.stories.jsx → Checkbox.stories.js} +7 -63
  175. package/dist/stories/checkbox/CheckboxCard.stories.d.ts +5 -5
  176. package/dist/stories/checkbox/{CheckboxCard.stories.jsx → CheckboxCard.stories.js} +6 -41
  177. package/dist/stories/checkbox/CheckboxGroup.stories.d.ts +3 -3
  178. package/dist/stories/checkbox/{CheckboxGroup.stories.jsx → CheckboxGroup.stories.js} +4 -76
  179. package/dist/stories/context-menu/ContextMenu.stories.d.ts +4 -4
  180. package/dist/stories/context-menu/{ContextMenu.stories.jsx → ContextMenu.stories.js} +5 -74
  181. package/dist/stories/data-list/DataList.stories.d.ts +4 -4
  182. package/dist/stories/data-list/DataList.stories.js +87 -0
  183. package/dist/stories/dialog/Dialog.stories.d.ts +1 -1
  184. package/dist/stories/dialog/{Dialog.stories.jsx → Dialog.stories.js} +2 -25
  185. package/dist/stories/doughnut-chart/DoughnutChart.stories.d.ts +4 -5
  186. package/dist/stories/doughnut-chart/{DoughnutChart.stories.jsx → DoughnutChart.stories.js} +4 -12
  187. package/dist/stories/dropdown-menu/DropdownMenu.stories.d.ts +4 -4
  188. package/dist/stories/dropdown-menu/DropdownMenu.stories.js +75 -0
  189. package/dist/stories/header/Header.stories.d.ts +6 -6
  190. package/dist/stories/header/{Header.stories.jsx → Header.stories.js} +7 -26
  191. package/dist/stories/hover-card/HoverCard.stories.d.ts +2 -2
  192. package/dist/stories/hover-card/{HoverCard.stories.jsx → HoverCard.stories.js} +3 -30
  193. package/dist/stories/inset/Inset.stories.d.ts +2 -2
  194. package/dist/stories/inset/{Inset.stories.jsx → Inset.stories.js} +12 -27
  195. package/dist/stories/label/Label.stories.d.ts +4 -4
  196. package/dist/stories/label/{Label.stories.jsx → Label.stories.js} +5 -26
  197. package/dist/stories/menubar/Menubar.stories.d.ts +1 -1
  198. package/dist/stories/menubar/{Menubar.stories.jsx → Menubar.stories.js} +8 -45
  199. package/dist/stories/navigation-menu/NavigationMenu.stories.d.ts +13 -13
  200. package/dist/stories/navigation-menu/{NavigationMenu.stories.jsx → NavigationMenu.stories.js} +3 -68
  201. package/dist/stories/pie-chart/PieChart.stories.d.ts +5 -6
  202. package/dist/stories/pie-chart/{PieChart.stories.jsx → PieChart.stories.js} +13 -32
  203. package/dist/stories/popover/Popover.stories.d.ts +2 -2
  204. package/dist/stories/popover/{Popover.stories.jsx → Popover.stories.js} +9 -42
  205. package/dist/stories/progress/Progress.stories.d.ts +4 -4
  206. package/dist/stories/progress/{Progress.stories.jsx → Progress.stories.js} +6 -11
  207. package/dist/stories/radar-chart/RadarChart.stories.d.ts +5 -6
  208. package/dist/stories/radar-chart/{RadarChart.stories.jsx → RadarChart.stories.js} +5 -4
  209. package/dist/stories/radio/Radio.stories.d.ts +3 -3
  210. package/dist/stories/radio/{Radio.stories.jsx → Radio.stories.js} +4 -14
  211. package/dist/stories/radio/RadioCards.stories.d.ts +4 -4
  212. package/dist/stories/radio/{RadioCards.stories.jsx → RadioCards.stories.js} +5 -64
  213. package/dist/stories/radio/RadioGroup.stories.d.ts +4 -4
  214. package/dist/stories/radio/{RadioGroup.stories.jsx → RadioGroup.stories.js} +5 -59
  215. package/dist/stories/scroll-area/ScrollArea.stories.d.ts +2 -2
  216. package/dist/stories/scroll-area/ScrollArea.stories.js +63 -0
  217. package/dist/stories/segmented-control/SegmentedControl.stories.d.ts +4 -4
  218. package/dist/stories/segmented-control/{SegmentedControl.stories.jsx → SegmentedControl.stories.js} +5 -26
  219. package/dist/stories/select/Select.stories.d.ts +5 -5
  220. package/dist/stories/select/{Select.stories.jsx → Select.stories.js} +6 -67
  221. package/dist/stories/separator/Separator.stories.d.ts +4 -4
  222. package/dist/stories/separator/{Separator.stories.jsx → Separator.stories.js} +5 -29
  223. package/dist/stories/skeleton/Skeleton.stories.d.ts +5 -5
  224. package/dist/stories/skeleton/{Skeleton.stories.jsx → Skeleton.stories.js} +6 -33
  225. package/dist/stories/slider/Slider.stories.d.ts +4 -4
  226. package/dist/stories/slider/{Slider.stories.jsx → Slider.stories.js} +5 -16
  227. package/dist/stories/spinner/Spinner.stories.d.ts +5 -5
  228. package/dist/stories/spinner/{Spinner.stories.jsx → Spinner.stories.js} +6 -31
  229. package/dist/stories/switch/Switch.stories.d.ts +4 -4
  230. package/dist/stories/switch/{Switch.stories.jsx → Switch.stories.js} +5 -16
  231. package/dist/stories/tab-nav/TabNav.stories.d.ts +1 -1
  232. package/dist/stories/tab-nav/{TabNav.stories.jsx → TabNav.stories.js} +2 -11
  233. package/dist/stories/table/Table.stories.d.ts +1 -1
  234. package/dist/stories/table/{Table.stories.jsx → Table.stories.js} +2 -29
  235. package/dist/stories/tabs/Tabs.stories.d.ts +1 -1
  236. package/dist/stories/tabs/{Tabs.stories.jsx → Tabs.stories.js} +2 -19
  237. package/dist/stories/text/Text.stories.d.ts +5 -5
  238. package/dist/stories/text/{Text.stories.jsx → Text.stories.js} +6 -21
  239. package/dist/stories/textArea/TextArea.stories.d.ts +5 -5
  240. package/dist/stories/textArea/{TextArea.stories.jsx → TextArea.stories.js} +6 -22
  241. package/dist/stories/textfield/TextField.stories.d.ts +5 -5
  242. package/dist/stories/textfield/{TextField.stories.jsx → TextField.stories.js} +6 -38
  243. package/dist/stories/toast/Toast.stories.d.ts +3 -3
  244. package/dist/stories/toast/{Toast.stories.jsx → Toast.stories.js} +4 -22
  245. package/dist/stories/toggle/Toggle.stories.d.ts +5 -5
  246. package/dist/stories/toggle/{Toggle.stories.jsx → Toggle.stories.js} +6 -23
  247. package/dist/stories/toggle/ToggleGroup.stories.d.ts +3 -3
  248. package/dist/stories/toggle/{ToggleGroup.stories.jsx → ToggleGroup.stories.js} +6 -39
  249. package/dist/stories/tooltip/Tooltip.stories.d.ts +3 -3
  250. package/dist/stories/tooltip/{Tooltip.stories.jsx → Tooltip.stories.js} +4 -17
  251. package/dist/tsconfig.tsbuildinfo +1 -1
  252. package/package.json +4 -3
  253. package/dist/app/template/badgeTemplate.jsx +0 -82
  254. package/dist/app/template/buttonTemplate.jsx +0 -82
  255. package/dist/app/template/colorPicker.jsx +0 -19
  256. package/dist/app/template/textTemplate.jsx +0 -72
  257. package/dist/app/template/theme.jsx +0 -44
  258. package/dist/components/NavigationMenu/NavigationMenuIndicator.jsx +0 -22
  259. package/dist/stories/Welcome.jsx +0 -48
  260. package/dist/stories/aspect-ratio/AspectRatio.stories.jsx +0 -106
  261. package/dist/stories/callout/Callout.stories.jsx +0 -205
  262. package/dist/stories/data-list/DataList.stories.jsx +0 -185
  263. package/dist/stories/dropdown-menu/DropdownMenu.stories.jsx +0 -170
  264. package/dist/stories/scroll-area/ScrollArea.stories.jsx +0 -123
@@ -129,19 +129,19 @@ declare const meta: {
129
129
  export default meta;
130
130
  export declare const Default: ({ ...args }: {
131
131
  [x: string]: any;
132
- }) => import("react").JSX.Element;
132
+ }) => import("react/jsx-runtime").JSX.Element;
133
133
  export declare const Types: ({ ...args }: {
134
134
  [x: string]: any;
135
- }) => import("react").JSX.Element;
135
+ }) => import("react/jsx-runtime").JSX.Element;
136
136
  export declare const Size: ({ ...args }: {
137
137
  [x: string]: any;
138
- }) => import("react").JSX.Element;
138
+ }) => import("react/jsx-runtime").JSX.Element;
139
139
  export declare const Scaling: ({ ...args }: {
140
140
  [x: string]: any;
141
- }) => import("react").JSX.Element;
141
+ }) => import("react/jsx-runtime").JSX.Element;
142
142
  export declare const Radius: ({ ...args }: {
143
143
  [x: string]: any;
144
- }) => import("react").JSX.Element;
144
+ }) => import("react/jsx-runtime").JSX.Element;
145
145
  export declare const Appearance: ({ ...args }: {
146
146
  [x: string]: any;
147
- }) => import("react").JSX.Element;
147
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -20,6 +20,7 @@ var __rest = (this && this.__rest) || function (s, e) {
20
20
  }
21
21
  return t;
22
22
  };
23
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
23
24
  import Checkbox from 'components/Checkbox';
24
25
  import { radiusOptions, scalingOptions, commonArgTypes, appearanceOptions, sizeOptions, } from '../../../src/constants';
25
26
  import { Text } from 'Typography/Text';
@@ -85,82 +86,25 @@ var meta = {
85
86
  export default meta;
86
87
  export var Default = function (_a) {
87
88
  var args = __rest(_a, []);
88
- return (<Checkbox id="checkbox" {...args} defaultChecked>
89
- 체크박스
90
- </Checkbox>);
89
+ return (_jsx(Checkbox, __assign({ id: "checkbox" }, args, { defaultChecked: true, children: "\uCCB4\uD06C\uBC15\uC2A4" })));
91
90
  };
92
91
  export var Types = function (_a) {
93
92
  var args = __rest(_a, []);
94
- return (<div className="flex flex-col space-y-3">
95
- <Checkbox id="defaultCheckbox" {...args} defaultChecked>
96
- default
97
- </Checkbox>
98
- <Checkbox id="disabledCheckedCheckbox" {...args} disabled defaultChecked>
99
- disabled
100
- </Checkbox>
101
- <Checkbox id="indeterminate" {...args} indeterminate defaultChecked>
102
- indeterminate
103
- </Checkbox>
104
- </div>);
93
+ return (_jsxs("div", { className: "flex flex-col space-y-3", children: [_jsx(Checkbox, __assign({ id: "defaultCheckbox" }, args, { defaultChecked: true, children: "default" })), _jsx(Checkbox, __assign({ id: "disabledCheckedCheckbox" }, args, { disabled: true, defaultChecked: true, children: "disabled" })), _jsx(Checkbox, __assign({ id: "indeterminate" }, args, { indeterminate: true, defaultChecked: true, children: "indeterminate" }))] }));
105
94
  };
106
95
  export var Size = function (_a) {
107
96
  var args = __rest(_a, []);
108
- return (<div className="flex space-x-5">
109
- <Checkbox id="size-s" {...args} size="small" defaultChecked>
110
- small
111
- </Checkbox>
112
- <Checkbox id="size-m" {...args} size="medium" defaultChecked>
113
- medium
114
- </Checkbox>
115
- <Checkbox id="size-l" {...args} size="large" defaultChecked>
116
- large
117
- </Checkbox>
118
- </div>);
97
+ return (_jsxs("div", { className: "flex space-x-5", children: [_jsx(Checkbox, __assign({ id: "size-s" }, args, { size: "small", defaultChecked: true, children: "small" })), _jsx(Checkbox, __assign({ id: "size-m" }, args, { size: "medium", defaultChecked: true, children: "medium" })), _jsx(Checkbox, __assign({ id: "size-l" }, args, { size: "large", defaultChecked: true, children: "large" }))] }));
119
98
  };
120
99
  export var Scaling = function (_a) {
121
100
  var args = __rest(_a, []);
122
- return (<div className="flex space-x-5">
123
- {scalingOptions.map(function (scaling) { return (<Checkbox key={scaling} id={scaling} {...args} scaling={scaling} defaultChecked>
124
- {scaling}
125
- </Checkbox>); })}
126
- </div>);
101
+ return (_jsx("div", { className: "flex space-x-5", children: scalingOptions.map(function (scaling) { return (_jsx(Checkbox, __assign({ id: scaling }, args, { scaling: scaling, defaultChecked: true, children: scaling }), scaling)); }) }));
127
102
  };
128
103
  export var Radius = function (_a) {
129
104
  var args = __rest(_a, []);
130
- return (<div className="flex space-x-5">
131
- {radiusOptions.map(function (radius) { return (<Checkbox key={radius} id={radius} {...args} radius={radius} defaultChecked>
132
- {radius}
133
- </Checkbox>); })}
134
- </div>);
105
+ return (_jsx("div", { className: "flex space-x-5", children: radiusOptions.map(function (radius) { return (_jsx(Checkbox, __assign({ id: radius }, args, { radius: radius, defaultChecked: true, children: radius }), radius)); }) }));
135
106
  };
136
107
  export var Appearance = function (_a) {
137
108
  var args = __rest(_a, []);
138
- return (<div className="flex flex-col space-y-3">
139
- <div className="flex space-x-3">
140
- <div className="w-[60px]">
141
- <Text>Surface</Text>
142
- </div>
143
- <Checkbox id={'uncheckedSurface'} {...args} appearance={'surface'}/>
144
- <Checkbox id={'checkedSurface'} {...args} appearance={'surface'} defaultChecked/>
145
- <Checkbox id={'checkedIndeterminate'} {...args} appearance={'surface'} indeterminate defaultChecked/>
146
- </div>
147
-
148
- <div className="flex space-x-3">
149
- <div className="w-[60px]">
150
- <Text>Classic</Text>
151
- </div>
152
- <Checkbox id={'uncheckedClassic'} {...args} appearance={'classic'}/>
153
- <Checkbox id={'checkedClassic'} {...args} appearance={'classic'} defaultChecked/>
154
- <Checkbox id={'indeterminateClassic'} {...args} appearance={'classic'} indeterminate defaultChecked/>
155
- </div>
156
-
157
- <div className="flex space-x-3">
158
- <div className="w-[60px]">
159
- <Text>Soft</Text>
160
- </div>
161
- <Checkbox id={'uncheckedSoft'} {...args} appearance={'soft'}/>
162
- <Checkbox id={'checkedSoft'} {...args} appearance={'soft'} defaultChecked/>
163
- <Checkbox id={'indeterminateSoft'} {...args} appearance={'soft'} indeterminate defaultChecked/>
164
- </div>
165
- </div>);
109
+ return (_jsxs("div", { className: "flex flex-col space-y-3", children: [_jsxs("div", { className: "flex space-x-3", children: [_jsx("div", { className: "w-[60px]", children: _jsx(Text, { children: "Surface" }) }), _jsx(Checkbox, __assign({ id: 'uncheckedSurface' }, args, { appearance: 'surface' })), _jsx(Checkbox, __assign({ id: 'checkedSurface' }, args, { appearance: 'surface', defaultChecked: true })), _jsx(Checkbox, __assign({ id: 'checkedIndeterminate' }, args, { appearance: 'surface', indeterminate: true, defaultChecked: true }))] }), _jsxs("div", { className: "flex space-x-3", children: [_jsx("div", { className: "w-[60px]", children: _jsx(Text, { children: "Classic" }) }), _jsx(Checkbox, __assign({ id: 'uncheckedClassic' }, args, { appearance: 'classic' })), _jsx(Checkbox, __assign({ id: 'checkedClassic' }, args, { appearance: 'classic', defaultChecked: true })), _jsx(Checkbox, __assign({ id: 'indeterminateClassic' }, args, { appearance: 'classic', indeterminate: true, defaultChecked: true }))] }), _jsxs("div", { className: "flex space-x-3", children: [_jsx("div", { className: "w-[60px]", children: _jsx(Text, { children: "Soft" }) }), _jsx(Checkbox, __assign({ id: 'uncheckedSoft' }, args, { appearance: 'soft' })), _jsx(Checkbox, __assign({ id: 'checkedSoft' }, args, { appearance: 'soft', defaultChecked: true })), _jsx(Checkbox, __assign({ id: 'indeterminateSoft' }, args, { appearance: 'soft', indeterminate: true, defaultChecked: true }))] })] }));
166
110
  };
@@ -114,16 +114,16 @@ declare const meta: {
114
114
  export default meta;
115
115
  export declare const Default: ({ ...args }: {
116
116
  [x: string]: any;
117
- }) => import("react").JSX.Element;
117
+ }) => import("react/jsx-runtime").JSX.Element;
118
118
  export declare const Scaling: ({ ...args }: {
119
119
  [x: string]: any;
120
- }) => import("react").JSX.Element;
120
+ }) => import("react/jsx-runtime").JSX.Element;
121
121
  export declare const Size: ({ ...args }: {
122
122
  [x: string]: any;
123
- }) => import("react").JSX.Element;
123
+ }) => import("react/jsx-runtime").JSX.Element;
124
124
  export declare const Radius: ({ ...args }: {
125
125
  [x: string]: any;
126
- }) => import("react").JSX.Element;
126
+ }) => import("react/jsx-runtime").JSX.Element;
127
127
  export declare const Appearance: ({ ...args }: {
128
128
  [x: string]: any;
129
- }) => import("react").JSX.Element;
129
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -20,6 +20,7 @@ var __rest = (this && this.__rest) || function (s, e) {
20
20
  }
21
21
  return t;
22
22
  };
23
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
23
24
  import { scalingOptions, commonArgTypes, appearanceOptions, radiusOptions, sizeOptions, } from '../../../src/constants';
24
25
  import CheckboxCard from 'components/CheckboxCard';
25
26
  var meta = {
@@ -69,57 +70,21 @@ var meta = {
69
70
  export default meta;
70
71
  export var Default = function (_a) {
71
72
  var args = __rest(_a, []);
72
- return (<div className="flex flex-col space-y-3">
73
- <CheckboxCard id="defaultCheckboxCard" {...args} defaultChecked>
74
- default
75
- </CheckboxCard>
76
- <CheckboxCard id="disabledCheckboxCard" {...args} disabled defaultChecked>
77
- disabled
78
- </CheckboxCard>
79
- </div>);
73
+ return (_jsxs("div", { className: "flex flex-col space-y-3", children: [_jsx(CheckboxCard, __assign({ id: "defaultCheckboxCard" }, args, { defaultChecked: true, children: "default" })), _jsx(CheckboxCard, __assign({ id: "disabledCheckboxCard" }, args, { disabled: true, defaultChecked: true, children: "disabled" }))] }));
80
74
  };
81
75
  export var Scaling = function (_a) {
82
76
  var args = __rest(_a, []);
83
- return (<div className="flex flex-col space-y-3">
84
- {scalingOptions.map(function (scaling) { return (<div key={scaling}>
85
- <CheckboxCard id={scaling} {...args} scaling={scaling}>
86
- {scaling}
87
- </CheckboxCard>
88
- </div>); })}
89
- </div>);
77
+ return (_jsx("div", { className: "flex flex-col space-y-3", children: scalingOptions.map(function (scaling) { return (_jsx("div", { children: _jsx(CheckboxCard, __assign({ id: scaling }, args, { scaling: scaling, children: scaling })) }, scaling)); }) }));
90
78
  };
91
79
  export var Size = function (_a) {
92
80
  var args = __rest(_a, []);
93
- return (<div className="flex flex-col space-y-3">
94
- <CheckboxCard id="size-s" {...args} size="small" defaultChecked>
95
- small
96
- </CheckboxCard>
97
- <CheckboxCard id="size-m" {...args} size="medium" defaultChecked>
98
- medium
99
- </CheckboxCard>
100
- <CheckboxCard id="size-l" {...args} size="large" defaultChecked>
101
- large
102
- </CheckboxCard>
103
- </div>);
81
+ return (_jsxs("div", { className: "flex flex-col space-y-3", children: [_jsx(CheckboxCard, __assign({ id: "size-s" }, args, { size: "small", defaultChecked: true, children: "small" })), _jsx(CheckboxCard, __assign({ id: "size-m" }, args, { size: "medium", defaultChecked: true, children: "medium" })), _jsx(CheckboxCard, __assign({ id: "size-l" }, args, { size: "large", defaultChecked: true, children: "large" }))] }));
104
82
  };
105
83
  export var Radius = function (_a) {
106
84
  var args = __rest(_a, []);
107
- return (<div className="flex flex-col space-y-3">
108
- {radiusOptions.map(function (radius) { return (<div key={radius}>
109
- <CheckboxCard id={radius} {...args} radius={radius}>
110
- {radius}
111
- </CheckboxCard>
112
- </div>); })}
113
- </div>);
85
+ return (_jsx("div", { className: "flex flex-col space-y-3", children: radiusOptions.map(function (radius) { return (_jsx("div", { children: _jsx(CheckboxCard, __assign({ id: radius }, args, { radius: radius, children: radius })) }, radius)); }) }));
114
86
  };
115
87
  export var Appearance = function (_a) {
116
88
  var args = __rest(_a, []);
117
- return (<div className="flex space-x-4">
118
- <CheckboxCard id={'classic'} {...args} appearance={'classic'}>
119
- classic
120
- </CheckboxCard>
121
- <CheckboxCard id={'surface'} {...args} appearance={'surface'}>
122
- surface
123
- </CheckboxCard>
124
- </div>);
89
+ return (_jsxs("div", { className: "flex space-x-4", children: [_jsx(CheckboxCard, __assign({ id: 'classic' }, args, { appearance: 'classic', children: "classic" })), _jsx(CheckboxCard, __assign({ id: 'surface' }, args, { appearance: 'surface', children: "surface" }))] }));
125
90
  };
@@ -82,10 +82,10 @@ declare const meta: {
82
82
  export default meta;
83
83
  export declare const Default: ({ ...args }: {
84
84
  [x: string]: any;
85
- }) => import("react").JSX.Element;
85
+ }) => import("react/jsx-runtime").JSX.Element;
86
86
  export declare const Size: ({ ...args }: {
87
87
  [x: string]: any;
88
- }) => import("react").JSX.Element;
88
+ }) => import("react/jsx-runtime").JSX.Element;
89
89
  export declare const Radius: ({ ...args }: {
90
90
  [x: string]: any;
91
- }) => import("react").JSX.Element;
91
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -20,6 +20,7 @@ var __rest = (this && this.__rest) || function (s, e) {
20
20
  }
21
21
  return t;
22
22
  };
23
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
23
24
  import { commonArgTypes, appearanceOptions, sizeOptions } from '../../../src/constants';
24
25
  import { CheckboxGroupItem, CheckboxGroup } from 'components/CheckboxGroup';
25
26
  var meta = {
@@ -59,86 +60,13 @@ var meta = {
59
60
  export default meta;
60
61
  export var Default = function (_a) {
61
62
  var args = __rest(_a, []);
62
- return (<CheckboxGroup defaultValue={['apple']}>
63
- <CheckboxGroupItem id={'apple'} {...args}>
64
- 사과🍎
65
- </CheckboxGroupItem>
66
- <CheckboxGroupItem id={'orange'} {...args}>
67
- 오렌지🍊
68
- </CheckboxGroupItem>
69
- <CheckboxGroupItem id={'banana'} {...args}>
70
- 바나나🍌
71
- </CheckboxGroupItem>
72
- </CheckboxGroup>);
63
+ return (_jsxs(CheckboxGroup, { defaultValue: ['apple'], children: [_jsx(CheckboxGroupItem, __assign({ id: 'apple' }, args, { children: "\uC0AC\uACFC\uD83C\uDF4E" })), _jsx(CheckboxGroupItem, __assign({ id: 'orange' }, args, { children: "\uC624\uB80C\uC9C0\uD83C\uDF4A" })), _jsx(CheckboxGroupItem, __assign({ id: 'banana' }, args, { children: "\uBC14\uB098\uB098\uD83C\uDF4C" }))] }));
73
64
  };
74
65
  export var Size = function (_a) {
75
66
  var args = __rest(_a, []);
76
- return (<div className="flex flex-col space-y-6">
77
- <CheckboxGroup size={'small'} defaultValue={['size-s1']}>
78
- <CheckboxGroupItem id="size-s1" {...args}>
79
- Agree to Terms and Conditions
80
- </CheckboxGroupItem>
81
- <CheckboxGroupItem id="size-s2" {...args}>
82
- Agree to Privacy Policy
83
- </CheckboxGroupItem>
84
- </CheckboxGroup>
85
-
86
- <CheckboxGroup size={'medium'} defaultValue={['size-m1']}>
87
- <CheckboxGroupItem id="size-m1" {...args}>
88
- Agree to Terms and Conditions
89
- </CheckboxGroupItem>
90
- <CheckboxGroupItem id="size-m2" {...args}>
91
- Agree to Privacy Policy
92
- </CheckboxGroupItem>
93
- </CheckboxGroup>
94
-
95
- <CheckboxGroup size={'large'} defaultValue={['size-l1']}>
96
- <CheckboxGroupItem id="size-l1" {...args}>
97
- Agree to Terms and Conditions
98
- </CheckboxGroupItem>
99
- <CheckboxGroupItem id="size-l2" {...args}>
100
- Agree to Privacy Policy
101
- </CheckboxGroupItem>
102
- </CheckboxGroup>
103
- </div>);
67
+ return (_jsxs("div", { className: "flex flex-col space-y-6", children: [_jsxs(CheckboxGroup, { size: 'small', defaultValue: ['size-s1'], children: [_jsx(CheckboxGroupItem, __assign({ id: "size-s1" }, args, { children: "Agree to Terms and Conditions" })), _jsx(CheckboxGroupItem, __assign({ id: "size-s2" }, args, { children: "Agree to Privacy Policy" }))] }), _jsxs(CheckboxGroup, { size: 'medium', defaultValue: ['size-m1'], children: [_jsx(CheckboxGroupItem, __assign({ id: "size-m1" }, args, { children: "Agree to Terms and Conditions" })), _jsx(CheckboxGroupItem, __assign({ id: "size-m2" }, args, { children: "Agree to Privacy Policy" }))] }), _jsxs(CheckboxGroup, { size: 'large', defaultValue: ['size-l1'], children: [_jsx(CheckboxGroupItem, __assign({ id: "size-l1" }, args, { children: "Agree to Terms and Conditions" })), _jsx(CheckboxGroupItem, __assign({ id: "size-l2" }, args, { children: "Agree to Privacy Policy" }))] })] }));
104
68
  };
105
69
  export var Radius = function (_a) {
106
70
  var args = __rest(_a, []);
107
- return (<div className="flex flex-col space-y-6">
108
- <CheckboxGroup defaultValue={['radius-none-1']} radius={'none'}>
109
- <CheckboxGroupItem id="radius-none-1" {...args}>
110
- 체크박스1
111
- </CheckboxGroupItem>
112
- <CheckboxGroupItem id="radius-none-2" {...args}>
113
- 체크박스2
114
- </CheckboxGroupItem>
115
- </CheckboxGroup>
116
-
117
- <CheckboxGroup defaultValue={['radius-small-1']} radius={'small'}>
118
- <CheckboxGroupItem id="radius-small-1" {...args}>
119
- 체크박스1
120
- </CheckboxGroupItem>
121
- <CheckboxGroupItem id="radius-small-2" {...args}>
122
- 체크박스2
123
- </CheckboxGroupItem>
124
- </CheckboxGroup>
125
-
126
- <CheckboxGroup defaultValue={['radius-medium-1']} radius={'medium'}>
127
- <CheckboxGroupItem id="radius-medium-1" {...args}>
128
- 체크박스1
129
- </CheckboxGroupItem>
130
- <CheckboxGroupItem id="radius-medium-2" {...args}>
131
- 체크박스2
132
- </CheckboxGroupItem>
133
- </CheckboxGroup>
134
-
135
- <CheckboxGroup defaultValue={['radius-large-1']} radius={'large'}>
136
- <CheckboxGroupItem id="radius-large-1" {...args}>
137
- 체크박스1
138
- </CheckboxGroupItem>
139
- <CheckboxGroupItem id="radius-large-2" {...args}>
140
- 체크박스2
141
- </CheckboxGroupItem>
142
- </CheckboxGroup>
143
- </div>);
71
+ return (_jsxs("div", { className: "flex flex-col space-y-6", children: [_jsxs(CheckboxGroup, { defaultValue: ['radius-none-1'], radius: 'none', children: [_jsx(CheckboxGroupItem, __assign({ id: "radius-none-1" }, args, { children: "\uCCB4\uD06C\uBC15\uC2A41" })), _jsx(CheckboxGroupItem, __assign({ id: "radius-none-2" }, args, { children: "\uCCB4\uD06C\uBC15\uC2A42" }))] }), _jsxs(CheckboxGroup, { defaultValue: ['radius-small-1'], radius: 'small', children: [_jsx(CheckboxGroupItem, __assign({ id: "radius-small-1" }, args, { children: "\uCCB4\uD06C\uBC15\uC2A41" })), _jsx(CheckboxGroupItem, __assign({ id: "radius-small-2" }, args, { children: "\uCCB4\uD06C\uBC15\uC2A42" }))] }), _jsxs(CheckboxGroup, { defaultValue: ['radius-medium-1'], radius: 'medium', children: [_jsx(CheckboxGroupItem, __assign({ id: "radius-medium-1" }, args, { children: "\uCCB4\uD06C\uBC15\uC2A41" })), _jsx(CheckboxGroupItem, __assign({ id: "radius-medium-2" }, args, { children: "\uCCB4\uD06C\uBC15\uC2A42" }))] }), _jsxs(CheckboxGroup, { defaultValue: ['radius-large-1'], radius: 'large', children: [_jsx(CheckboxGroupItem, __assign({ id: "radius-large-1" }, args, { children: "\uCCB4\uD06C\uBC15\uC2A41" })), _jsx(CheckboxGroupItem, __assign({ id: "radius-large-2" }, args, { children: "\uCCB4\uD06C\uBC15\uC2A42" }))] })] }));
144
72
  };
@@ -101,13 +101,13 @@ declare const meta: {
101
101
  export default meta;
102
102
  export declare const Default: ({ ...args }: {
103
103
  [x: string]: any;
104
- }) => import("react").JSX.Element;
104
+ }) => import("react/jsx-runtime").JSX.Element;
105
105
  export declare const Radius: ({ ...args }: {
106
106
  [x: string]: any;
107
- }) => import("react").JSX.Element;
107
+ }) => import("react/jsx-runtime").JSX.Element;
108
108
  export declare const Size: ({ ...args }: {
109
109
  [x: string]: any;
110
- }) => import("react").JSX.Element;
110
+ }) => import("react/jsx-runtime").JSX.Element;
111
111
  export declare const Appearance: ({ ...args }: {
112
112
  [x: string]: any;
113
- }) => import("react").JSX.Element;
113
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -20,6 +20,7 @@ var __rest = (this && this.__rest) || function (s, e) {
20
20
  }
21
21
  return t;
22
22
  };
23
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
23
24
  import { radiusOptions, commonArgTypes, sizeOptions, appearanceOptions } from '../../constants';
24
25
  import { ContextMenuContent, ContextMenu, ContextMenuTrigger, ContextMenuLabel, ContextMenuItem, ContextMenuCheckboxItem, ContextMenuGroup, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuSubTrigger, ContextMenuSubContent, } from 'components/ContextMenu';
25
26
  import { Text } from 'Typography/Text';
@@ -69,87 +70,17 @@ var meta = {
69
70
  export default meta;
70
71
  export var Default = function (_a) {
71
72
  var args = __rest(_a, []);
72
- return (<ContextMenu {...args}>
73
- <ContextMenuTrigger>
74
- <Text>Right-click here.</Text>
75
- </ContextMenuTrigger>
76
- <ContextMenuContent>
77
- <ContextMenuLabel>라벨</ContextMenuLabel>
78
- <ContextMenuItem shortcut="⌘ T">기본 아이템</ContextMenuItem>
79
- <ContextMenuItem disabled>사용불가 아이템</ContextMenuItem>
80
- <ContextMenuSeparator />
81
- <ContextMenuGroup>
82
- <ContextMenuItem>그룹 아이템1</ContextMenuItem>
83
- <ContextMenuItem>그룹 아이템2</ContextMenuItem>
84
- </ContextMenuGroup>
85
- <ContextMenuSeparator />
86
- <ContextMenuCheckboxItem checked>checked 아이템</ContextMenuCheckboxItem>
87
- <ContextMenuCheckboxItem checked={false}>unchecked 아이템</ContextMenuCheckboxItem>
88
- <ContextMenuSeparator />
89
- <ContextMenuRadioGroup value={'apple'}>
90
- <ContextMenuRadioItem value={'apple'}>라디오 아이템1</ContextMenuRadioItem>
91
- <ContextMenuRadioItem value={'banana'}>라디오 아이템2</ContextMenuRadioItem>
92
- </ContextMenuRadioGroup>
93
- <ContextMenuSeparator />
94
- <ContextMenuSubTrigger>
95
- More Menu{' '}
96
- <ContextMenuSubContent>
97
- <ContextMenuItem>서브 아이템1</ContextMenuItem>
98
- <ContextMenuItem>서브 아이템2</ContextMenuItem>
99
- </ContextMenuSubContent>
100
- </ContextMenuSubTrigger>
101
- </ContextMenuContent>
102
- </ContextMenu>);
73
+ return (_jsxs(ContextMenu, __assign({}, args, { children: [_jsx(ContextMenuTrigger, { children: _jsx(Text, { children: "Right-click here." }) }), _jsxs(ContextMenuContent, { children: [_jsx(ContextMenuLabel, { children: "\uB77C\uBCA8" }), _jsx(ContextMenuItem, { shortcut: "\u2318 T", children: "\uAE30\uBCF8 \uC544\uC774\uD15C" }), _jsx(ContextMenuItem, { disabled: true, children: "\uC0AC\uC6A9\uBD88\uAC00 \uC544\uC774\uD15C" }), _jsx(ContextMenuSeparator, {}), _jsxs(ContextMenuGroup, { children: [_jsx(ContextMenuItem, { children: "\uADF8\uB8F9 \uC544\uC774\uD15C1" }), _jsx(ContextMenuItem, { children: "\uADF8\uB8F9 \uC544\uC774\uD15C2" })] }), _jsx(ContextMenuSeparator, {}), _jsx(ContextMenuCheckboxItem, { checked: true, children: "checked \uC544\uC774\uD15C" }), _jsx(ContextMenuCheckboxItem, { checked: false, children: "unchecked \uC544\uC774\uD15C" }), _jsx(ContextMenuSeparator, {}), _jsxs(ContextMenuRadioGroup, { value: 'apple', children: [_jsx(ContextMenuRadioItem, { value: 'apple', children: "\uB77C\uB514\uC624 \uC544\uC774\uD15C1" }), _jsx(ContextMenuRadioItem, { value: 'banana', children: "\uB77C\uB514\uC624 \uC544\uC774\uD15C2" })] }), _jsx(ContextMenuSeparator, {}), _jsxs(ContextMenuSubTrigger, { children: ["More Menu", ' ', _jsxs(ContextMenuSubContent, { children: [_jsx(ContextMenuItem, { children: "\uC11C\uBE0C \uC544\uC774\uD15C1" }), _jsx(ContextMenuItem, { children: "\uC11C\uBE0C \uC544\uC774\uD15C2" })] })] })] })] })));
103
74
  };
104
75
  export var Radius = function (_a) {
105
76
  var args = __rest(_a, []);
106
- return (<div className="flex space-x-2">
107
- {radiusOptions.map(function (radius) { return (<ContextMenu key={radius} radius={radius} {...args}>
108
- <ContextMenuTrigger className="w-[100px]">{radius}</ContextMenuTrigger>
109
- <ContextMenuContent>
110
- <ContextMenuItem>메뉴1</ContextMenuItem>
111
- <ContextMenuItem>메뉴2</ContextMenuItem>
112
- </ContextMenuContent>
113
- </ContextMenu>); })}
114
- </div>);
77
+ return (_jsx("div", { className: "flex space-x-2", children: radiusOptions.map(function (radius) { return (_jsxs(ContextMenu, __assign({ radius: radius }, args, { children: [_jsx(ContextMenuTrigger, { className: "w-[100px]", children: radius }), _jsxs(ContextMenuContent, { children: [_jsx(ContextMenuItem, { children: "\uBA54\uB2741" }), _jsx(ContextMenuItem, { children: "\uBA54\uB2742" })] })] }), radius)); }) }));
115
78
  };
116
79
  export var Size = function (_a) {
117
80
  var args = __rest(_a, []);
118
- return (<div className="flex space-x-2">
119
- <ContextMenu size={'small'} {...args}>
120
- <ContextMenuTrigger className="w-[100px]">small</ContextMenuTrigger>
121
- <ContextMenuContent>
122
- <ContextMenuItem>메뉴1</ContextMenuItem>
123
- <ContextMenuItem>메뉴2</ContextMenuItem>
124
- </ContextMenuContent>
125
- </ContextMenu>
126
-
127
- <ContextMenu size={'medium'} {...args}>
128
- <ContextMenuTrigger className="w-[100px]">medium</ContextMenuTrigger>
129
- <ContextMenuContent>
130
- <ContextMenuItem>메뉴1</ContextMenuItem>
131
- <ContextMenuItem>메뉴2</ContextMenuItem>
132
- </ContextMenuContent>
133
- </ContextMenu>
134
- </div>);
81
+ return (_jsxs("div", { className: "flex space-x-2", children: [_jsxs(ContextMenu, __assign({ size: 'small' }, args, { children: [_jsx(ContextMenuTrigger, { className: "w-[100px]", children: "small" }), _jsxs(ContextMenuContent, { children: [_jsx(ContextMenuItem, { children: "\uBA54\uB2741" }), _jsx(ContextMenuItem, { children: "\uBA54\uB2742" })] })] })), _jsxs(ContextMenu, __assign({ size: 'medium' }, args, { children: [_jsx(ContextMenuTrigger, { className: "w-[100px]", children: "medium" }), _jsxs(ContextMenuContent, { children: [_jsx(ContextMenuItem, { children: "\uBA54\uB2741" }), _jsx(ContextMenuItem, { children: "\uBA54\uB2742" })] })] }))] }));
135
82
  };
136
83
  export var Appearance = function (_a) {
137
84
  var args = __rest(_a, []);
138
- return (<div className="flex space-x-2">
139
- <ContextMenu appearance={'solid'} {...args}>
140
- <ContextMenuTrigger className="w-[100px]">solid</ContextMenuTrigger>
141
- <ContextMenuContent>
142
- <ContextMenuItem>메뉴1</ContextMenuItem>
143
- <ContextMenuItem>메뉴2</ContextMenuItem>
144
- </ContextMenuContent>
145
- </ContextMenu>
146
-
147
- <ContextMenu appearance={'soft'} {...args}>
148
- <ContextMenuTrigger className="w-[100px]">soft</ContextMenuTrigger>
149
- <ContextMenuContent>
150
- <ContextMenuItem>메뉴1</ContextMenuItem>
151
- <ContextMenuItem>메뉴2</ContextMenuItem>
152
- </ContextMenuContent>
153
- </ContextMenu>
154
- </div>);
85
+ return (_jsxs("div", { className: "flex space-x-2", children: [_jsxs(ContextMenu, __assign({ appearance: 'solid' }, args, { children: [_jsx(ContextMenuTrigger, { className: "w-[100px]", children: "solid" }), _jsxs(ContextMenuContent, { children: [_jsx(ContextMenuItem, { children: "\uBA54\uB2741" }), _jsx(ContextMenuItem, { children: "\uBA54\uB2742" })] })] })), _jsxs(ContextMenu, __assign({ appearance: 'soft' }, args, { children: [_jsx(ContextMenuTrigger, { className: "w-[100px]", children: "soft" }), _jsxs(ContextMenuContent, { children: [_jsx(ContextMenuItem, { children: "\uBA54\uB2741" }), _jsx(ContextMenuItem, { children: "\uBA54\uB2742" })] })] }))] }));
155
86
  };
@@ -85,13 +85,13 @@ declare const meta: {
85
85
  export default meta;
86
86
  export declare const Default: ({ ...args }: {
87
87
  [x: string]: any;
88
- }) => import("react").JSX.Element;
88
+ }) => import("react/jsx-runtime").JSX.Element;
89
89
  export declare const Orientation: ({ ...args }: {
90
90
  [x: string]: any;
91
- }) => import("react").JSX.Element;
91
+ }) => import("react/jsx-runtime").JSX.Element;
92
92
  export declare const Scaling: ({ ...args }: {
93
93
  [x: string]: any;
94
- }) => import("react").JSX.Element;
94
+ }) => import("react/jsx-runtime").JSX.Element;
95
95
  export declare const Size: ({ ...args }: {
96
96
  [x: string]: any;
97
- }) => import("react").JSX.Element;
97
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,87 @@
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 { createElement as _createElement } from "react";
24
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
25
+ import { DataList, DataListItem, DataListLabel, DataListValue } from 'components/DataList';
26
+ import Badge from 'components/Badge';
27
+ import { scalingOptions, commonArgTypes, sizeOptions } from '../../constants';
28
+ import Button from 'components/Button';
29
+ var meta = {
30
+ title: 'Component/DataList',
31
+ component: DataList,
32
+ parameters: {
33
+ layout: 'centered',
34
+ themes: {
35
+ themeOverride: 'dark',
36
+ },
37
+ docs: {
38
+ description: {
39
+ component: '목록 형태로 메타 데이터 표시하는 컴포넌트',
40
+ },
41
+ },
42
+ },
43
+ tags: ['autodocs'],
44
+ argTypes: {
45
+ scaling: __assign(__assign({}, commonArgTypes.scaling), { description: 'DataList 비율' }),
46
+ size: __assign(__assign({}, commonArgTypes.size), { table: {
47
+ category: 'Props',
48
+ type: {
49
+ summary: sizeOptions
50
+ .filter(function (option) { return option !== 'x-small' && option !== 'x-large'; })
51
+ .join(' | '),
52
+ },
53
+ }, options: sizeOptions.filter(function (option) { return option !== 'x-small' && option !== 'x-large'; }), description: 'DataList 크기' }),
54
+ color: __assign(__assign({}, commonArgTypes.color), { description: 'DataList 값 매인색', defaultValue: { summary: 'black' } }),
55
+ orientation: {
56
+ table: {
57
+ category: 'Props',
58
+ type: {
59
+ summary: ['horizontal', 'vertical'].join(' | '),
60
+ },
61
+ },
62
+ options: ['horizontal', 'vertical'],
63
+ control: { type: 'select' },
64
+ defaultValue: { summary: 'horizontal' },
65
+ description: 'DataList 방향',
66
+ },
67
+ },
68
+ };
69
+ export default meta;
70
+ export var Default = function (_a) {
71
+ var args = __rest(_a, []);
72
+ return (_jsxs(DataList, __assign({}, args, { children: [_jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: "\uC0C1\uD0DC" })), _jsx(DataListValue, __assign({}, args, { children: _jsx(Badge, __assign({ appearance: "soft" }, args, { children: "\uBC30\uC9C0" })) }))] })), _jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: "\uB77C\uBCA8" })), _jsx(DataListValue, __assign({}, args, { children: "\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4.\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4." }))] })), _jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: "\uB77C\uBCA8" })), _jsx(DataListValue, __assign({}, args, { children: _jsx(Button, __assign({}, args, { children: "\uBC84\uD2BC" })) }))] }))] })));
73
+ };
74
+ export var Orientation = function (_a) {
75
+ var args = __rest(_a, []);
76
+ return (_jsxs(DataList, __assign({}, args, { orientation: 'vertical', children: [_jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: "\uC0C1\uD0DC" })), _jsx(DataListValue, __assign({}, args, { children: _jsx(Badge, __assign({ appearance: "soft" }, args, { children: "\uBC30\uC9C0" })) }))] })), _jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: "\uB77C\uBCA8" })), _jsx(DataListValue, __assign({}, args, { children: "\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4.\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4." }))] })), _jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: "\uB77C\uBCA8" })), _jsx(DataListValue, __assign({}, args, { children: _jsx(Button, __assign({}, args, { children: "\uBC84\uD2BC" })) }))] }))] })));
77
+ };
78
+ export var Scaling = function (_a) {
79
+ var args = __rest(_a, []);
80
+ return (_jsx("div", { className: "flex flex-col space-y-7", children: scalingOptions.map(function (scaling) { return (_createElement(DataList, __assign({}, args, { key: scaling, scaling: scaling }),
81
+ _jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: scaling })), _jsx(DataListValue, __assign({}, args, { children: "\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4.\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4." }))] })),
82
+ _jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: scaling })), _jsx(DataListValue, __assign({}, args, { children: "\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4.\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4." }))] })))); }) }));
83
+ };
84
+ export var Size = function (_a) {
85
+ var args = __rest(_a, []);
86
+ return (_jsxs("div", { className: "flex flex-col space-y-7", children: [_jsxs(DataList, { size: 'small', children: [_jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: "small" })), _jsx(DataListValue, __assign({}, args, { children: "\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4.\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4." }))] })), _jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: "small" })), _jsx(DataListValue, __assign({}, args, { children: "\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4.\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4." }))] }))] }), _jsxs(DataList, { size: 'medium', children: [_jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: "medium" })), _jsx(DataListValue, __assign({}, args, { children: "\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4.\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4." }))] })), _jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: "medium" })), _jsx(DataListValue, __assign({}, args, { children: "\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4.\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4." }))] }))] }), _jsxs(DataList, { size: 'large', children: [_jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: "large" })), _jsx(DataListValue, __assign({}, args, { children: "\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4.\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4." }))] })), _jsxs(DataListItem, __assign({}, args, { children: [_jsx(DataListLabel, __assign({}, args, { children: "large" })), _jsx(DataListValue, __assign({}, args, { children: "\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4.\uD14D\uC2A4\uD2B8\uAC00 \uAE38\uC5B4\uC9C8 \uACBD\uC6B0 \uC904\uBC14\uAFC8\uC73C\uB85C \uCC98\uB9AC\uB429\uB2C8\uB2E4." }))] }))] })] }));
87
+ };
@@ -85,4 +85,4 @@ declare const meta: {
85
85
  export default meta;
86
86
  export declare const Default: ({ ...args }: {
87
87
  [x: string]: any;
88
- }) => import("react").JSX.Element;
88
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -20,6 +20,7 @@ var __rest = (this && this.__rest) || function (s, e) {
20
20
  }
21
21
  return t;
22
22
  };
23
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
23
24
  import { commonArgTypes, sizeOptions } from '../../constants';
24
25
  import { Dialog, DialogTrigger, DialogContent, DialogCancel, DialogTitle, DialogDescription, DialogSlot, DialogAction, } from '../../components/Dialog/index';
25
26
  import Button from 'components/Button';
@@ -54,29 +55,5 @@ var meta = {
54
55
  export default meta;
55
56
  export var Default = function (_a) {
56
57
  var args = __rest(_a, []);
57
- return (<Dialog {...args}>
58
- <DialogTrigger>
59
- <Button>Edit profile</Button>
60
- </DialogTrigger>
61
- <DialogContent {...args}>
62
- <DialogTitle {...args}>Edit profile</DialogTitle>
63
- <DialogDescription {...args}>Make changes to your profile.</DialogDescription>
64
-
65
- <DialogSlot {...args}>
66
- <span>Name</span>
67
- <TextField {...args} placeholder="Enter your full name"/>
68
- <span>Email</span>
69
- <TextField {...args} placeholder="Enter your email"/>
70
- </DialogSlot>
71
-
72
- <div className="flex justify-end">
73
- <DialogCancel {...args}>
74
- <span>Cancel</span>
75
- </DialogCancel>
76
- <DialogAction {...args}>
77
- <span>Save</span>
78
- </DialogAction>
79
- </div>
80
- </DialogContent>
81
- </Dialog>);
58
+ return (_jsxs(Dialog, __assign({}, args, { children: [_jsx(DialogTrigger, { children: _jsx(Button, { children: "Edit profile" }) }), _jsxs(DialogContent, __assign({}, args, { children: [_jsx(DialogTitle, __assign({}, args, { children: "Edit profile" })), _jsx(DialogDescription, __assign({}, args, { children: "Make changes to your profile." })), _jsxs(DialogSlot, __assign({}, args, { children: [_jsx("span", { children: "Name" }), _jsx(TextField, __assign({}, args, { placeholder: "Enter your full name" })), _jsx("span", { children: "Email" }), _jsx(TextField, __assign({}, args, { placeholder: "Enter your email" }))] })), _jsxs("div", { className: "flex justify-end", children: [_jsx(DialogCancel, __assign({}, args, { children: _jsx("span", { children: "Cancel" }) })), _jsx(DialogAction, __assign({}, args, { children: _jsx("span", { children: "Save" }) }))] })] }))] })));
82
59
  };