@lotte-innovate/ui-component-test 0.0.49 → 0.0.51

Sign up to get free protection for your applications and to get access to all the features.
Files changed (208) hide show
  1. package/README.md +78 -281
  2. package/dist/globals.css +4 -0
  3. package/dist/lib/Typography/Header/index.d.ts +1 -1
  4. package/dist/lib/Typography/Header/{index.jsx → index.js} +4 -7
  5. package/dist/lib/Typography/Text/index.d.ts +1 -1
  6. package/dist/lib/Typography/Text/{index.jsx → index.js} +5 -8
  7. package/dist/lib/components/Accordion/index.d.ts +1 -1
  8. package/dist/lib/components/Accordion/{index.jsx → index.js} +7 -19
  9. package/dist/lib/components/AlertDialog/AlertDialogAction.d.ts +1 -1
  10. package/dist/lib/components/AlertDialog/{AlertDialogAction.jsx → AlertDialogAction.js} +5 -6
  11. package/dist/lib/components/AlertDialog/AlertDialogCancel.d.ts +1 -1
  12. package/dist/lib/components/AlertDialog/{AlertDialogCancel.jsx → AlertDialogCancel.js} +5 -6
  13. package/dist/lib/components/AlertDialog/{AlertDialogContent.jsx → AlertDialogContent.js} +5 -9
  14. package/dist/lib/components/AlertDialog/{AlertDialogDescription.jsx → AlertDialogDescription.js} +15 -5
  15. package/dist/lib/components/AlertDialog/AlertDialogRoot.d.ts +1 -1
  16. package/dist/lib/components/AlertDialog/{AlertDialogRoot.jsx → AlertDialogRoot.js} +14 -6
  17. package/dist/lib/components/AlertDialog/{AlertDialogTitle.jsx → AlertDialogTitle.js} +15 -5
  18. package/dist/lib/components/AlertDialog/AlertDialogTrigger.d.ts +1 -1
  19. package/dist/lib/components/AlertDialog/{AlertDialogTrigger.jsx → AlertDialogTrigger.js} +5 -6
  20. package/dist/lib/components/AspectRatio/{index.jsx → index.js} +5 -6
  21. package/dist/lib/components/Avatar/{index.jsx → index.js} +5 -9
  22. package/dist/lib/components/Badge/index.d.ts +1 -1
  23. package/dist/lib/components/Badge/{index.jsx → index.js} +5 -6
  24. package/dist/lib/components/BarChart/index.d.ts +2 -3
  25. package/dist/lib/components/BarChart/{index.jsx → index.js} +7 -6
  26. package/dist/lib/components/BubbleChart/index.d.ts +2 -3
  27. package/dist/lib/components/BubbleChart/{index.jsx → index.js} +7 -7
  28. package/dist/lib/components/Button/index.d.ts +1 -1
  29. package/dist/lib/components/Button/{index.jsx → index.js} +5 -6
  30. package/dist/lib/components/Callout/{CalloutIcon.jsx → CalloutIcon.js} +5 -10
  31. package/dist/lib/components/Callout/CalloutRoot.d.ts +1 -1
  32. package/dist/lib/components/Callout/{CalloutRoot.jsx → CalloutRoot.js} +5 -8
  33. package/dist/lib/components/Callout/{CalloutText.jsx → CalloutText.js} +15 -5
  34. package/dist/lib/components/Card/index.d.ts +1 -1
  35. package/dist/lib/components/Card/{index.jsx → index.js} +5 -6
  36. package/dist/lib/components/Checkbox/index.d.ts +1 -1
  37. package/dist/lib/components/Checkbox/{index.jsx → index.js} +6 -14
  38. package/dist/lib/components/CheckboxCard/index.d.ts +2 -2
  39. package/dist/lib/components/CheckboxCard/{index.jsx → index.js} +7 -9
  40. package/dist/lib/components/CheckboxGroup/CheckboxGroupItem.d.ts +1 -1
  41. package/dist/lib/components/CheckboxGroup/{CheckboxGroupItem.jsx → CheckboxGroupItem.js} +15 -7
  42. package/dist/lib/components/CheckboxGroup/CheckboxGroupRoot.d.ts +2 -2
  43. package/dist/lib/components/CheckboxGroup/{CheckboxGroupRoot.jsx → CheckboxGroupRoot.js} +3 -6
  44. package/dist/lib/components/CheckboxGroup/index.d.ts +1 -1
  45. package/dist/lib/components/ContextMenu/{ContextMenuCheckboxItem.jsx → ContextMenuCheckboxItem.js} +16 -9
  46. package/dist/lib/components/ContextMenu/{ContextMenuContent.jsx → ContextMenuContent.js} +5 -8
  47. package/dist/lib/components/ContextMenu/{ContextMenuGroup.jsx → ContextMenuGroup.js} +14 -4
  48. package/dist/lib/components/ContextMenu/{ContextMenuItem.jsx → ContextMenuItem.js} +5 -7
  49. package/dist/lib/components/ContextMenu/{ContextMenuItemIndicator.jsx → ContextMenuItemIndicator.js} +5 -6
  50. package/dist/lib/components/ContextMenu/{ContextMenuLabel.jsx → ContextMenuLabel.js} +5 -6
  51. package/dist/lib/components/ContextMenu/{ContextMenuRadioGroup.jsx → ContextMenuRadioGroup.js} +14 -6
  52. package/dist/lib/components/ContextMenu/{ContextMenuRadioItem.jsx → ContextMenuRadioItem.js} +16 -9
  53. package/dist/lib/components/ContextMenu/ContextMenuRoot.d.ts +1 -1
  54. package/dist/lib/components/ContextMenu/{ContextMenuRoot.jsx → ContextMenuRoot.js} +14 -6
  55. package/dist/lib/components/ContextMenu/{ContextMenuSeparator.jsx → ContextMenuSeparator.js} +15 -5
  56. package/dist/lib/components/ContextMenu/{ContextMenuSubContent.jsx → ContextMenuSubContent.js} +9 -12
  57. package/dist/lib/components/ContextMenu/{ContextMenuSubTrigger.jsx → ContextMenuSubTrigger.js} +16 -11
  58. package/dist/lib/components/ContextMenu/{ContextMenuTrigger.jsx → ContextMenuTrigger.js} +15 -5
  59. package/dist/lib/components/DataList/{DataListItem.jsx → DataListItem.js} +5 -6
  60. package/dist/lib/components/DataList/{DataListLabel.jsx → DataListLabel.js} +5 -6
  61. package/dist/lib/components/DataList/{DataListRoot.jsx → DataListRoot.js} +15 -7
  62. package/dist/lib/components/DataList/{DataListValue.jsx → DataListValue.js} +5 -6
  63. package/dist/lib/components/Dialog/{DialogAction.jsx → DialogAction.js} +16 -6
  64. package/dist/lib/components/Dialog/{DialogCancel.jsx → DialogCancel.js} +15 -5
  65. package/dist/lib/components/Dialog/{DialogContent.jsx → DialogContent.js} +5 -6
  66. package/dist/lib/components/Dialog/{DialogDescription.jsx → DialogDescription.js} +15 -5
  67. package/dist/lib/components/Dialog/DialogRoot.d.ts +1 -1
  68. package/dist/lib/components/Dialog/{DialogRoot.jsx → DialogRoot.js} +14 -6
  69. package/dist/lib/components/Dialog/{DialogSlot.jsx → DialogSlot.js} +15 -5
  70. package/dist/lib/components/Dialog/{DialogTitle.jsx → DialogTitle.js} +15 -5
  71. package/dist/lib/components/Dialog/{DialogTrigger.jsx → DialogTrigger.js} +14 -4
  72. package/dist/lib/components/Dialog/index.d.ts +1 -1
  73. package/dist/lib/components/DoughnutChart/index.d.ts +2 -3
  74. package/dist/lib/components/DoughnutChart/{index.jsx → index.js} +6 -6
  75. package/dist/lib/components/DropdownMenu/{DropdonMenuRadioGroup.jsx → DropdonMenuRadioGroup.js} +13 -3
  76. package/dist/lib/components/DropdownMenu/{DropdonMenuSubContent.jsx → DropdonMenuSubContent.js} +9 -12
  77. package/dist/lib/components/DropdownMenu/{DropdownMenuCheckboxItem.jsx → DropdownMenuCheckboxItem.js} +16 -9
  78. package/dist/lib/components/DropdownMenu/{DropdownMenuContent.jsx → DropdownMenuContent.js} +5 -8
  79. package/dist/lib/components/DropdownMenu/DropdownMenuItem.d.ts +1 -1
  80. package/dist/lib/components/DropdownMenu/{DropdownMenuItem.jsx → DropdownMenuItem.js} +5 -7
  81. package/dist/lib/components/DropdownMenu/{DropdownMenuItemIndicator.jsx → DropdownMenuItemIndicator.js} +5 -6
  82. package/dist/lib/components/DropdownMenu/{DropdownMenuLable.jsx → DropdownMenuLable.js} +15 -5
  83. package/dist/lib/components/DropdownMenu/{DropdownMenuRadioItem.jsx → DropdownMenuRadioItem.js} +16 -9
  84. package/dist/lib/components/DropdownMenu/DropdownMenuRoot.d.ts +2 -2
  85. package/dist/lib/components/DropdownMenu/{DropdownMenuRoot.jsx → DropdownMenuRoot.js} +14 -4
  86. package/dist/lib/components/DropdownMenu/{DropdownMenuSeparator.jsx → DropdownMenuSeparator.js} +15 -3
  87. package/dist/lib/components/DropdownMenu/{DropdownMenuSub.jsx → DropdownMenuSub.js} +14 -2
  88. package/dist/lib/components/DropdownMenu/{DropdownMenuSubTrigger.jsx → DropdownMenuSubTrigger.js} +16 -9
  89. package/dist/lib/components/DropdownMenu/DropdownMenuTrigger.d.ts +1 -1
  90. package/dist/lib/components/DropdownMenu/{DropdownMenuTrigger.jsx → DropdownMenuTrigger.js} +15 -5
  91. package/dist/lib/components/DropdownMenu/index.d.ts +1 -1
  92. package/dist/lib/components/HoverCard/{HoverCardContent.jsx → HoverCardContent.js} +5 -6
  93. package/dist/lib/components/HoverCard/HoverCardRoot.d.ts +1 -1
  94. package/dist/lib/components/HoverCard/{HoverCardRoot.jsx → HoverCardRoot.js} +14 -6
  95. package/dist/lib/components/HoverCard/{HoverCardTrigger.jsx → HoverCardTrigger.js} +14 -4
  96. package/dist/lib/components/HoverCard/index.d.ts +1 -1
  97. package/dist/lib/components/IconButton/index.d.ts +1 -1
  98. package/dist/lib/components/IconButton/{index.jsx → index.js} +4 -5
  99. package/dist/lib/components/Inset/{index.jsx → index.js} +5 -8
  100. package/dist/lib/components/Label/index.d.ts +1 -1
  101. package/dist/lib/components/Label/{index.jsx → index.js} +4 -5
  102. package/dist/lib/components/LineChart/index.d.ts +2 -3
  103. package/dist/lib/components/LineChart/{index.jsx → index.js} +7 -6
  104. package/dist/lib/components/Menubar/{MenubarCheckboxItem.jsx → MenubarCheckboxItem.js} +16 -9
  105. package/dist/lib/components/Menubar/{MenubarContent.jsx → MenubarContent.js} +9 -12
  106. package/dist/lib/components/Menubar/{MenubarItem.jsx → MenubarItem.js} +5 -7
  107. package/dist/lib/components/Menubar/{MenubarItemIndicator.jsx → MenubarItemIndicator.js} +5 -6
  108. package/dist/lib/components/Menubar/{MenubarMenu.jsx → MenubarMenu.js} +14 -2
  109. package/dist/lib/components/Menubar/{MenubarRadioGroup.jsx → MenubarRadioGroup.js} +14 -6
  110. package/dist/lib/components/Menubar/{MenubarRadioItem.jsx → MenubarRadioItem.js} +16 -9
  111. package/dist/lib/components/Menubar/MenubarRoot.d.ts +1 -1
  112. package/dist/lib/components/Menubar/{MenubarRoot.jsx → MenubarRoot.js} +5 -8
  113. package/dist/lib/components/Menubar/{MenubarSeparator.jsx → MenubarSeparator.js} +15 -5
  114. package/dist/lib/components/Menubar/{MenubarSub.jsx → MenubarSub.js} +14 -2
  115. package/dist/lib/components/Menubar/{MenubarSubContent.jsx → MenubarSubContent.js} +6 -7
  116. package/dist/lib/components/Menubar/{MenubarSubTrigger.jsx → MenubarSubTrigger.js} +16 -9
  117. package/dist/lib/components/Menubar/{MenubarTrigger.jsx → MenubarTrigger.js} +5 -6
  118. package/dist/lib/components/NavigationMenu/{NavigationMenuContent.jsx → NavigationMenuContent.js} +5 -6
  119. package/dist/lib/components/NavigationMenu/NavigationMenuIndicator.js +31 -0
  120. package/dist/lib/components/NavigationMenu/{NavigationMenuItem.jsx → NavigationMenuItem.js} +14 -4
  121. package/dist/lib/components/NavigationMenu/{NavigationMenuLink.jsx → NavigationMenuLink.js} +5 -6
  122. package/dist/lib/components/NavigationMenu/{NavigationMenuList.jsx → NavigationMenuList.js} +5 -7
  123. package/dist/lib/components/NavigationMenu/NavigationMenuRoot.d.ts +1 -1
  124. package/dist/lib/components/NavigationMenu/{NavigationMenuRoot.jsx → NavigationMenuRoot.js} +15 -7
  125. package/dist/lib/components/NavigationMenu/{NavigationMenuTrigger.jsx → NavigationMenuTrigger.js} +5 -7
  126. package/dist/lib/components/NavigationMenu/{NavigationMenuViewport.jsx → NavigationMenuViewport.js} +5 -6
  127. package/dist/lib/components/PieChart/index.d.ts +2 -3
  128. package/dist/lib/components/PieChart/{index.jsx → index.js} +6 -6
  129. package/dist/lib/components/Popover/{PopoverClose.jsx → PopoverClose.js} +15 -5
  130. package/dist/lib/components/Popover/{PopoverContent.jsx → PopoverContent.js} +5 -6
  131. package/dist/lib/components/Popover/PopoverRoot.d.ts +1 -1
  132. package/dist/lib/components/Popover/{PopoverRoot.jsx → PopoverRoot.js} +14 -6
  133. package/dist/lib/components/Popover/{PopoverTrigger.jsx → PopoverTrigger.js} +14 -4
  134. package/dist/lib/components/Popover/index.d.ts +1 -1
  135. package/dist/lib/components/Progress/{index.jsx → index.js} +5 -6
  136. package/dist/lib/components/RadarChart/index.d.ts +2 -3
  137. package/dist/lib/components/RadarChart/{index.jsx → index.js} +7 -7
  138. package/dist/lib/components/Radio/index.d.ts +1 -1
  139. package/dist/lib/components/Radio/{index.jsx → index.js} +15 -10
  140. package/dist/lib/components/RadioCards/{RadioCardsItem.jsx → RadioCardsItem.js} +15 -5
  141. package/dist/lib/components/RadioCards/{RadioCardsRoot.jsx → RadioCardsRoot.js} +5 -10
  142. package/dist/lib/components/RadioGroup/{RadioGroupItem.jsx → RadioGroupItem.js} +15 -5
  143. package/dist/lib/components/RadioGroup/RadioGroupRoot.d.ts +1 -1
  144. package/dist/lib/components/RadioGroup/{RadioGroupRoot.jsx → RadioGroupRoot.js} +15 -9
  145. package/dist/lib/components/ScrollArea/{index.jsx → index.js} +14 -6
  146. package/dist/lib/components/SegmentedControl/{SegmentedControlItem.jsx → SegmentedControlItem.js} +15 -5
  147. package/dist/lib/components/SegmentedControl/SegmentedControlRoot.d.ts +1 -1
  148. package/dist/lib/components/SegmentedControl/{SegmentedControlRoot.jsx → SegmentedControlRoot.js} +4 -7
  149. package/dist/lib/components/SegmentedControl/index.d.ts +1 -1
  150. package/dist/lib/components/Select/index.d.ts +1 -1
  151. package/dist/lib/components/Select/{index.jsx → index.js} +10 -27
  152. package/dist/lib/components/Separator/{index.jsx → index.js} +4 -7
  153. package/dist/lib/components/Skeleton/index.d.ts +1 -1
  154. package/dist/lib/components/Skeleton/{index.jsx → index.js} +4 -7
  155. package/dist/lib/components/Slider/index.d.ts +1 -1
  156. package/dist/lib/components/Slider/{index.jsx → index.js} +4 -5
  157. package/dist/lib/components/Spinner/index.d.ts +1 -1
  158. package/dist/lib/components/Spinner/{index.jsx → index.js} +4 -7
  159. package/dist/lib/components/TabNav/{index.jsx → index.js} +15 -9
  160. package/dist/lib/components/Table/index.d.ts +1 -1
  161. package/dist/lib/components/Table/{index.jsx → index.js} +10 -25
  162. package/dist/lib/components/Tabs/{index.jsx → index.js} +7 -16
  163. package/dist/lib/components/TextArea/index.d.ts +1 -1
  164. package/dist/lib/components/TextArea/{index.jsx → index.js} +4 -5
  165. package/dist/lib/components/TextField/index.d.ts +1 -1
  166. package/dist/lib/components/TextField/{index.jsx → index.js} +5 -10
  167. package/dist/lib/components/Toast/ToastActionButton.d.ts +1 -1
  168. package/dist/lib/components/Toast/{ToastActionButton.jsx → ToastActionButton.js} +6 -7
  169. package/dist/lib/components/Toast/ToastDescription.d.ts +1 -1
  170. package/dist/lib/components/Toast/{ToastDescription.jsx → ToastDescription.js} +15 -7
  171. package/dist/lib/components/Toast/{ToastRoot.jsx → ToastRoot.js} +5 -11
  172. package/dist/lib/components/Toast/ToastTitle.d.ts +1 -1
  173. package/dist/lib/components/Toast/{ToastTitle.jsx → ToastTitle.js} +15 -5
  174. package/dist/lib/components/Toggle/ToggleWithText.d.ts +1 -1
  175. package/dist/lib/components/Toggle/{ToggleWithText.jsx → ToggleWithText.js} +7 -9
  176. package/dist/lib/components/Toggle/index.d.ts +1 -1
  177. package/dist/lib/components/Toggle/{index.jsx → index.js} +5 -6
  178. package/dist/lib/components/ToggleGroup/ToggleGroupItem.d.ts +1 -1
  179. package/dist/lib/components/ToggleGroup/{ToggleGroupItem.jsx → ToggleGroupItem.js} +16 -6
  180. package/dist/lib/components/ToggleGroup/ToggleGroupRoot.d.ts +1 -1
  181. package/dist/lib/components/ToggleGroup/{ToggleGroupRoot.jsx → ToggleGroupRoot.js} +5 -10
  182. package/dist/lib/components/ToggleSwitch/{index.jsx → index.js} +5 -9
  183. package/dist/lib/components/Tooltip/index.d.ts +1 -1
  184. package/dist/lib/components/Tooltip/{index.jsx → index.js} +4 -13
  185. package/dist/lib/constants.js +2 -2
  186. package/dist/lib/index.d.ts +2 -2
  187. package/dist/lib/index.js +2 -2
  188. package/dist/lib/utils/useDarkMode.js +1 -1
  189. package/dist/tailwind.config.d.ts +3 -0
  190. package/dist/tailwind.config.js +141 -0
  191. package/package.json +4 -2
  192. package/dist/lib/components/NavigationMenu/NavigationMenuIndicator.jsx +0 -22
  193. /package/dist/lib/components/AlertDialog/{index.jsx → index.js} +0 -0
  194. /package/dist/lib/components/Callout/{index.jsx → index.js} +0 -0
  195. /package/dist/lib/components/CheckboxGroup/{index.jsx → index.js} +0 -0
  196. /package/dist/lib/components/ContextMenu/{index.jsx → index.js} +0 -0
  197. /package/dist/lib/components/DataList/{index.jsx → index.js} +0 -0
  198. /package/dist/lib/components/Dialog/{index.jsx → index.js} +0 -0
  199. /package/dist/lib/components/DropdownMenu/{index.jsx → index.js} +0 -0
  200. /package/dist/lib/components/HoverCard/{index.jsx → index.js} +0 -0
  201. /package/dist/lib/components/Menubar/{index.jsx → index.js} +0 -0
  202. /package/dist/lib/components/NavigationMenu/{index.jsx → index.js} +0 -0
  203. /package/dist/lib/components/Popover/{index.jsx → index.js} +0 -0
  204. /package/dist/lib/components/RadioCards/{index.jsx → index.js} +0 -0
  205. /package/dist/lib/components/RadioGroup/{index.jsx → index.js} +0 -0
  206. /package/dist/lib/components/SegmentedControl/{index.jsx → index.js} +0 -0
  207. /package/dist/lib/components/Toast/{index.jsx → index.js} +0 -0
  208. /package/dist/lib/components/ToggleGroup/{index.jsx → index.js} +0 -0
@@ -20,11 +20,12 @@ var __rest = (this && this.__rest) || function (s, e) {
20
20
  }
21
21
  return t;
22
22
  };
23
+ import { jsx as _jsx } from "react/jsx-runtime";
23
24
  import React, { Children, forwardRef } from 'react';
24
25
  import { cva } from 'class-variance-authority';
25
26
  import * as TogglePrimitive from '@radix-ui/react-toggle';
26
- import { radiusVariants, scalingVariants, toggleAppearanceStyle } from 'lib/constants';
27
- import { cn } from 'lib/utils/utils';
27
+ import { radiusVariants, scalingVariants, toggleAppearanceStyle } from '../../../lib/constants';
28
+ import { cn } from '../../../lib/utils/utils';
28
29
  export * from './ToggleWithText';
29
30
  var toggleVariants = cva('grid place-content-center items-center justify-center box-border"', {
30
31
  variants: {
@@ -49,11 +50,9 @@ export var IconScaling = {
49
50
  };
50
51
  export var Toggle = forwardRef(function (_a, ref) {
51
52
  var className = _a.className, children = _a.children, radius = _a.radius, _b = _a.size, size = _b === void 0 ? 'medium' : _b, scaling = _a.scaling, _c = _a.color, color = _c === void 0 ? 'red' : _c, _d = _a.appearance, appearance = _d === void 0 ? 'surface' : _d, props = __rest(_a, ["className", "children", "radius", "size", "scaling", "color", "appearance"]);
52
- return (<TogglePrimitive.Root ref={ref} className={cn(toggleVariants({ radius: radius, size: size, scaling: scaling }), toggleAppearanceStyle(appearance, color, true, 'data-[state=on]:'), className)} {...props}>
53
- {Children.map(children, function (child) {
53
+ return (_jsx(TogglePrimitive.Root, __assign({ ref: ref, className: cn(toggleVariants({ radius: radius, size: size, scaling: scaling }), toggleAppearanceStyle(appearance, color, true, 'data-[state=on]:'), className) }, props, { children: Children.map(children, function (child) {
54
54
  return React.cloneElement(child, { className: IconScaling[size] });
55
- })}
56
- </TogglePrimitive.Root>);
55
+ }) })));
57
56
  });
58
57
  Toggle.displayName = 'Toggle';
59
58
  export default Toggle;
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
3
3
  import { VariantProps } from 'class-variance-authority';
4
- import { IAppearance } from 'lib/types';
4
+ import { IAppearance } from '../../../lib/types';
5
5
  export interface ToggleGroupItemProps extends VariantProps<typeof toggleGroupItemVariants> {
6
6
  appearance?: IAppearance;
7
7
  size?: 'small' | 'medium' | 'large';
@@ -1,3 +1,14 @@
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
+ };
1
12
  var __rest = (this && this.__rest) || function (s, e) {
2
13
  var t = {};
3
14
  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -9,12 +20,13 @@ var __rest = (this && this.__rest) || function (s, e) {
9
20
  }
10
21
  return t;
11
22
  };
23
+ import { jsx as _jsx } from "react/jsx-runtime";
12
24
  import React, { Children, forwardRef, useContext, } from 'react';
13
25
  import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
14
26
  import { cva } from 'class-variance-authority';
15
- import { toggleAppearanceStyle } from 'lib/constants';
27
+ import { toggleAppearanceStyle } from '../../../lib/constants';
16
28
  import { ToggleGroupContext } from './ToggleGroupRoot';
17
- import { cn } from 'lib/utils/utils';
29
+ import { cn } from '../../../lib/utils/utils';
18
30
  export var toggleGroupItemVariants = cva('grid place-content-center mr-[-1px] first:rounded-l last:rounded-r', {
19
31
  variants: {
20
32
  size: {
@@ -35,10 +47,8 @@ export var IconScaling = {
35
47
  export var ToggleGroupItem = forwardRef(function (_a, ref) {
36
48
  var className = _a.className, children = _a.children, value = _a.value, props = __rest(_a, ["className", "children", "value"]);
37
49
  var _b = useContext(ToggleGroupContext), size = _b.size, _c = _b.color, color = _c === void 0 ? 'red' : _c, _d = _b.appearance, appearance = _d === void 0 ? 'surface' : _d;
38
- return (<ToggleGroupPrimitive.Item ref={ref} value={value} className={cn(toggleGroupItemVariants({ size: size }), toggleAppearanceStyle(appearance, color, true, 'data-[state=on]:'), className)} {...props}>
39
- {Children.map(children, function (child) {
50
+ return (_jsx(ToggleGroupPrimitive.Item, __assign({ ref: ref, value: value, className: cn(toggleGroupItemVariants({ size: size }), toggleAppearanceStyle(appearance, color, true, 'data-[state=on]:'), className) }, props, { children: Children.map(children, function (child) {
40
51
  return React.cloneElement(child, { className: IconScaling[size !== null && size !== void 0 ? size : 'medium'] });
41
- })}
42
- </ToggleGroupPrimitive.Item>);
52
+ }) })));
43
53
  });
44
54
  ToggleGroupItem.displayName = 'ToggleGroup.Item';
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
3
3
  import { VariantProps } from 'class-variance-authority';
4
4
  import { toggleGroupItemVariants } from './ToggleGroupItem';
5
- import { IAppearance, IColor } from 'lib/types';
5
+ import { IAppearance, IColor } from '../../../lib/types';
6
6
  export interface ToggleGroupProps extends VariantProps<typeof toggleVariants>, VariantProps<typeof toggleGroupItemVariants> {
7
7
  appearance?: IAppearance;
8
8
  color?: IColor;
@@ -20,11 +20,12 @@ var __rest = (this && this.__rest) || function (s, e) {
20
20
  }
21
21
  return t;
22
22
  };
23
- import React, { createContext, forwardRef } from 'react';
23
+ import { jsx as _jsx } from "react/jsx-runtime";
24
+ import { createContext, forwardRef } from 'react';
24
25
  import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
25
26
  import { cva } from 'class-variance-authority';
26
- import { scalingVariants } from 'lib/constants';
27
- import { cn } from 'lib/utils/utils';
27
+ import { scalingVariants } from '../../../lib/constants';
28
+ import { cn } from '../../../lib/utils/utils';
28
29
  var toggleVariants = cva('inline-flex', {
29
30
  variants: {
30
31
  scaling: __assign({}, scalingVariants),
@@ -42,12 +43,6 @@ export var ToggleGroupRoot = forwardRef(function (_a, ref) {
42
43
  var className = _a.className, children = _a.children, scaling = _a.scaling, size = _a.size, color = _a.color, appearance = _a.appearance, props = __rest(_a, ["className", "children", "scaling", "size", "color", "appearance"]);
43
44
  var type = __assign({}, props).type;
44
45
  var contextValue = { size: size, color: color, appearance: appearance };
45
- return (<ToggleGroupContext.Provider value={contextValue}>
46
- {type === 'single' ? (<ToggleGroupPrimitive.Root className={cn(toggleVariants({ scaling: scaling }), className)} {...props} ref={ref}>
47
- {children}
48
- </ToggleGroupPrimitive.Root>) : (<ToggleGroupPrimitive.Root className={cn(toggleVariants({ scaling: scaling }), className)} {...props} ref={ref}>
49
- {children}
50
- </ToggleGroupPrimitive.Root>)}
51
- </ToggleGroupContext.Provider>);
46
+ return (_jsx(ToggleGroupContext.Provider, { value: contextValue, children: type === 'single' ? (_jsx(ToggleGroupPrimitive.Root, __assign({ className: cn(toggleVariants({ scaling: scaling }), className) }, props, { ref: ref, children: children }))) : (_jsx(ToggleGroupPrimitive.Root, __assign({ className: cn(toggleVariants({ scaling: scaling }), className) }, props, { ref: ref, children: children }))) }));
52
47
  });
53
48
  ToggleGroupRoot.displayName = 'ToggleGroup.Root';
@@ -20,12 +20,13 @@ 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 React from 'react';
24
25
  import { cva } from 'class-variance-authority';
25
- import { cn } from 'lib/utils/utils';
26
- import { radiusVariants, scalingVariants } from 'lib/constants';
26
+ import { cn } from '../../../lib/utils/utils';
27
+ import { radiusVariants, scalingVariants } from '../../../lib/constants';
27
28
  import { Switch as SwitchTheme, Theme } from '@radix-ui/themes';
28
- import { Text } from 'lib/Typography/Text';
29
+ import { Text } from '../../../lib/Typography/Text';
29
30
  var toggleSwitchVariants = cva('', {
30
31
  variants: {
31
32
  scaling: __assign({}, scalingVariants),
@@ -64,12 +65,7 @@ export var ToggleSwitch = React.forwardRef(function (_a, forwardedRef) {
64
65
  sizeTheme = '1';
65
66
  if (size === 'large')
66
67
  sizeTheme = '3';
67
- return (<Theme className="flex" accentColor={color} hasBackground={false}>
68
- <Text as="label" className={cn('flex items-center', SwitchLabelVariants({ size: size, scaling: scaling }))}>
69
- <SwitchTheme ref={forwardedRef} {...switchProps} variant={appearance} radius={radius} size={sizeTheme} color={color} className={cn(toggleSwitchVariants({ scaling: scaling, radius: radius, size: size }), className)} aria-label="Switch"></SwitchTheme>
70
- {children}
71
- </Text>
72
- </Theme>);
68
+ return (_jsx(Theme, { className: "flex", accentColor: color, hasBackground: false, children: _jsxs(Text, { as: "label", className: cn('flex items-center', SwitchLabelVariants({ size: size, scaling: scaling })), children: [_jsx(SwitchTheme, __assign({ ref: forwardedRef }, switchProps, { variant: appearance, radius: radius, size: sizeTheme, color: color, className: cn(toggleSwitchVariants({ scaling: scaling, radius: radius, size: size }), className), "aria-label": "Switch" })), children] }) }));
73
69
  });
74
70
  ToggleSwitch.displayName = 'ToggleSwitch';
75
71
  export default ToggleSwitch;
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import * as TooltipPrimitive from '@radix-ui/react-tooltip';
3
3
  import { VariantProps } from 'class-variance-authority';
4
- import { IColor } from 'lib/types';
4
+ import { IColor } from '../../../lib/types';
5
5
  export interface TooltipProps extends React.InputHTMLAttributes<HTMLInputElement>, VariantProps<typeof tooltipVariants> {
6
6
  label?: string;
7
7
  defaultValue?: string;
@@ -20,12 +20,13 @@ 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
  // your-tooltip.jsx
24
25
  import React from 'react';
25
26
  import * as TooltipPrimitive from '@radix-ui/react-tooltip';
26
27
  import { cva } from 'class-variance-authority';
27
- import { cn } from 'lib/utils/utils';
28
- import { primaryColorStyle, radiusVariants, weightVariants } from 'lib/constants';
28
+ import { cn } from '../../../lib/utils/utils';
29
+ import { primaryColorStyle, radiusVariants, weightVariants } from '../../../lib/constants';
29
30
  var tooltipVariants = cva('bg-slate-12 text-slate-1 dark:bg-slateDark-12 dark:text-slateDark-1 data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade select-none rounded-[4px] px-[9px] py-[6px] text-[12px] leading-none shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px] will-change-[transform,opacity]', {
30
31
  variants: {
31
32
  weight: __assign({}, weightVariants),
@@ -42,17 +43,7 @@ var Tooltip = React.forwardRef(function (_a, ref) {
42
43
  var arrowColor = color
43
44
  ? "fill-".concat(color, "-9 dark:fill-").concat(color, "Dark-9")
44
45
  : 'fill-slate-12 dark:fill-slateDark-12';
45
- return (<TooltipPrimitive.Provider>
46
- <TooltipPrimitive.Root open={open} defaultOpen={defaultOpen} onOpenChange={onOpenChange}>
47
- <TooltipPrimitive.Trigger className="cursor-pointer text-slate-12 dark:text-slateDark-12" asChild>
48
- {children}
49
- </TooltipPrimitive.Trigger>
50
- <TooltipPrimitive.Content align="center" {...props} side={side} className={cn('mr-2', tooltipVariants({ weight: weight, radius: radius, color: color }), className)} sideOffset={5}>
51
- {content}
52
- <TooltipPrimitive.Arrow width={11} height={5} className={arrowColor}/>
53
- </TooltipPrimitive.Content>
54
- </TooltipPrimitive.Root>
55
- </TooltipPrimitive.Provider>);
46
+ return (_jsx(TooltipPrimitive.Provider, { children: _jsxs(TooltipPrimitive.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: onOpenChange, children: [_jsx(TooltipPrimitive.Trigger, { className: "cursor-pointer text-slate-12 dark:text-slateDark-12", asChild: true, children: children }), _jsxs(TooltipPrimitive.Content, __assign({ align: "center" }, props, { side: side, className: cn('mr-2', tooltipVariants({ weight: weight, radius: radius, color: color }), className), sideOffset: 5, children: [content, _jsx(TooltipPrimitive.Arrow, { width: 11, height: 5, className: arrowColor })] }))] }) }));
56
47
  });
57
48
  Tooltip.displayName = 'Tooltip';
58
49
  export default Tooltip;
@@ -1,5 +1,5 @@
1
- import { ColorStyle, DarkColorStyle, colorOptions, chartColorOptions } from 'lib/color/constants';
2
- import * as lightColors from 'lib/color/light';
1
+ import { ColorStyle, DarkColorStyle, colorOptions, chartColorOptions } from '../lib/color/constants';
2
+ import * as lightColors from '../lib/color/light';
3
3
  export var radiusOptions = ['none', 'small', 'medium', 'large', 'full'];
4
4
  export var typoSizeOptions = ['1', '2', '3', '4', '5', '6', '7', '8', '9'];
5
5
  export var scalingOptions = ['90%', '95%', '100%', '105%', '110%'];
@@ -1,2 +1,2 @@
1
- export * from './components/index';
2
- export * from './Typography/index';
1
+ export * from './components';
2
+ export * from './Typography';
package/dist/lib/index.js CHANGED
@@ -1,2 +1,2 @@
1
- export * from './components/index';
2
- export * from './Typography/index';
1
+ export * from './components';
2
+ export * from './Typography';
@@ -1,4 +1,4 @@
1
- import { slateA, slateDarkA } from 'lib/color/alpha';
1
+ import { slateA, slateDarkA } from '../../lib/color/alpha';
2
2
  import { useEffect, useState } from 'react';
3
3
  export var useDarkMode = function (isRAxes) {
4
4
  if (isRAxes === void 0) { isRAxes = false; }
@@ -0,0 +1,3 @@
1
+ import type { Config } from 'tailwindcss';
2
+ declare const config: Config;
3
+ export default config;
@@ -0,0 +1,141 @@
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 __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
13
+ if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
14
+ if (ar || !(i in from)) {
15
+ if (!ar) ar = Array.prototype.slice.call(from, 0, i);
16
+ ar[i] = from[i];
17
+ }
18
+ }
19
+ return to.concat(ar || Array.prototype.slice.call(from));
20
+ };
21
+ import * as lightColors from './lib/color/light';
22
+ import * as darkColors from './lib/color/dark';
23
+ import * as alphaColors from './lib/color/alpha';
24
+ import { colorOptions, alphaColorOptions, darkColorOptions } from './lib/color/constants';
25
+ var classes = [];
26
+ var darkClasses = [];
27
+ var colorScale = Array.from({ length: 12 }, function (_, i) { return (i + 1).toString(); });
28
+ var allColorOptions = [colorOptions, alphaColorOptions];
29
+ var generateClasses = function (colorList, colorScale) {
30
+ var classPrefixes = ['fill', 'border', 'bg', 'text'];
31
+ return colorList.flatMap(function (color) {
32
+ return colorScale.flatMap(function (scale) { return classPrefixes.map(function (prefix) { return "".concat(prefix, "-").concat(color, "-").concat(scale); }); });
33
+ });
34
+ };
35
+ var generateDarkClasses = function (colorList, colorScale) {
36
+ var classPrefixes = [
37
+ 'dark:fill',
38
+ 'dark:border',
39
+ 'dark:bg',
40
+ 'dark:text',
41
+ 'dark:hover:bg',
42
+ 'dark:hover:border',
43
+ 'dark:hover:text',
44
+ 'dark:active:bg',
45
+ 'dark:active:border',
46
+ 'dark:active:text',
47
+ 'dark:data-[state=on]:bg',
48
+ 'dark:data-[state=open]:bg',
49
+ 'dark:data-[state=on]:text',
50
+ 'dark:data-[state=on]:hover:bg',
51
+ 'dark:data-[state=on]:hover:border',
52
+ 'dark:data-[state=on]:hover:text',
53
+ ];
54
+ return colorList.flatMap(function (color) {
55
+ return colorScale.flatMap(function (scale) { return classPrefixes.map(function (prefix) { return "".concat(prefix, "-").concat(color, "-").concat(scale); }); });
56
+ });
57
+ };
58
+ allColorOptions.forEach(function (options) {
59
+ classes = classes.concat(generateClasses(options, colorScale));
60
+ });
61
+ darkClasses.push.apply(darkClasses, generateDarkClasses(darkColorOptions, colorScale));
62
+ var config = {
63
+ content: [
64
+ './src/app/**/*.{js,ts,jsx,tsx,mdx,zip}',
65
+ './lib/**/*.{js,ts,jsx,tsx,mdx,zip}',
66
+ './src/stories/**/*.{js,ts,jsx,tsx,mdx,zip}',
67
+ './src/**/*.{js,ts,jsx,tsx,mdx,zip}',
68
+ ],
69
+ safelist: __spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray([], classes, true), classes.map(function (cls) { return "hover:".concat(cls); }), true), classes.map(function (cls) { return "active:".concat(cls); }), true), classes.map(function (cls) { return "before:".concat(cls); }), true), classes.map(function (cls) { return "data-[state=checked]:".concat(cls); }), true), classes.map(function (cls) { return "data-[state=unchecked]:".concat(cls); }), true), classes.map(function (cls) { return "data-[state=on]:".concat(cls); }), true), classes.map(function (cls) { return "data-[state=open]:".concat(cls); }), true), darkClasses, true),
70
+ theme: {
71
+ extend: {
72
+ fontFamily: {
73
+ sans: ['Noto Sans KR', 'sans-serif', 'Nunito Sans', 'Helvetica Neue', 'Helvetica', 'Arial'],
74
+ },
75
+ backgroundImage: {
76
+ 'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
77
+ 'gradient-conic': 'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
78
+ },
79
+ colors: __assign(__assign(__assign({ danger: '#C40006', warning: '#AB6400', success: '#00713F', information: '#00749E' }, formatColors(lightColors)), formatColors(darkColors)), formatColors(alphaColors)),
80
+ // radix tailwind
81
+ keyframes: {
82
+ overlayShow: {
83
+ from: { opacity: '0' },
84
+ to: { opacity: '1' },
85
+ },
86
+ contentShow: {
87
+ from: { opacity: '0', transform: 'translate(-50%, -48%) scale(0.96)' },
88
+ to: { opacity: '1', transform: 'translate(-50%, -50%) scale(1)' },
89
+ },
90
+ slideDown: {
91
+ from: { height: '0px' },
92
+ to: { height: 'var(--radix-accordion-content-height)' },
93
+ },
94
+ slideUp: {
95
+ from: { height: 'var(--radix-accordion-content-height)' },
96
+ to: { height: '0px' },
97
+ },
98
+ },
99
+ animation: {
100
+ overlayShow: 'overlayShow 150ms cubic-bezier(0.16, 1, 0.3, 1)',
101
+ contentShow: 'contentShow 150ms cubic-bezier(0.16, 1, 0.3, 1)',
102
+ slideDown: 'slideDown 300ms cubic-bezier(0.87, 0, 0.13, 1)',
103
+ slideUp: 'slideUp 300ms cubic-bezier(0.87, 0, 0.13, 1)',
104
+ },
105
+ boxShadow: {
106
+ 'button-classic': '0px 0px 0px 1px #00002D17 inset, 0px -2px 1px 0px #0000330F inset, 0px 4px 2px -2px #FFFFFFB2 inset, 0px 2px 1px -1px #FFFFFFB2 inset',
107
+ 'checkbox-classic': '0px 0px 0px 1px #00002D17 inset, 0px -2px 1px 0px #0000330F inset, 0px 4px 2px -2px #FFFFFF66 inset, 0px 2px 1px -1px #FFFFFF66 inset',
108
+ 'button-dark-classic': '0px 0px 0px 1px #414142 inset, 0px -2px 1px 0px #414142 inset, 0px 4px 2px -2px #414142 inset, 0px 2px 1px -1px #414142 inset',
109
+ 'card-classic': '0px 0px 0px 0.5px #0000000D, 0px 1px 4px 0px #00002D17, 0px 2px 1px -1px #0000000D, 0px 1px 3px 0px #0000000D',
110
+ 'card-dark-classic': '0px 0px 0px 0.5px #414142, 0px 1px 4px 0px #414142, 0px 2px 1px -1px #414142, 0px 1px 3px 0px #414142',
111
+ 'segmented-control-dark-classic': '0px 0px 0px 0.5px #0000000D, 0px 1px 4px 0px #363636, 0px 2px 1px -1px #0000000D, 0px 1px 3px 0px #0000000D',
112
+ },
113
+ },
114
+ },
115
+ plugins: [
116
+ function (_a) {
117
+ var addVariant = _a.addVariant;
118
+ addVariant('data-placeholder', '&:where([data-placeholder])');
119
+ },
120
+ ],
121
+ darkMode: 'class',
122
+ };
123
+ /**
124
+ * tailwind 방식으로 변경
125
+ * ex) bg-yellow-3
126
+ */
127
+ function formatColors(colors) {
128
+ var formatcolors = {};
129
+ for (var _i = 0, _a = Object.entries(colors); _i < _a.length; _i++) {
130
+ var _b = _a[_i], cn = _b[0], c = _b[1];
131
+ for (var _c = 0, _d = Object.entries(c); _c < _d.length; _c++) {
132
+ var _e = _d[_c], scale = _e[0], value = _e[1];
133
+ if (!scale) {
134
+ continue;
135
+ }
136
+ formatcolors["".concat(cn, "-").concat(scale)] = value;
137
+ }
138
+ }
139
+ return formatcolors;
140
+ }
141
+ export default config;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@lotte-innovate/ui-component-test",
3
3
  "description": "Lotte UI Library",
4
- "version": "0.0.49",
4
+ "version": "0.0.51",
5
5
  "private": false,
6
6
  "type": "module",
7
7
  "files": [
@@ -38,16 +38,18 @@
38
38
  "scripts": {
39
39
  "dev": "next dev",
40
40
  "lint": "next lint",
41
+ "prepare": "next build",
41
42
  "start": "next start",
42
43
  "storybook": "cross-env NODE_OPTIONS='--max-old-space-size=8192' storybook dev -p 6006",
43
44
  "chromatic": "cross-env npx chromatic --project-token=$CHROMATIC_PROJECT_TOKEN",
44
45
  "compile": "tsc --jsx react-jsx",
46
+ "build": "vite build && npm run compile",
45
47
  "build:css": "npx tailwindcss -i src/app/globals.css -o dist/globals.css --minify",
46
48
  "build-storybook": "storybook build",
47
49
  "clean": "rimraf dist && mkdir dist",
48
50
  "update-tailwind": "node update-tailwind-import.js",
49
51
  "build:all": "npm run clean && npm run compile && node src/utils/move.js && npm run build:css && tsc-alias && npm run update-tailwind",
50
- "publish:npm": "rm -rf dist && mkdir dist && tsc"
52
+ "publish:npm": "npm run build:all && npm publish && node src/utils/post-publish.js"
51
53
  },
52
54
  "dependencies": {
53
55
  "@babel/runtime": "^7.24.7",
@@ -1,22 +0,0 @@
1
- var __rest = (this && this.__rest) || function (s, e) {
2
- var t = {};
3
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
- t[p] = s[p];
5
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
- t[p[i]] = s[p[i]];
9
- }
10
- return t;
11
- };
12
- import React, { forwardRef } from 'react';
13
- import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
14
- import { cn } from 'lib/utils/utils';
15
- export var NavigationMenuIndicator = forwardRef(function (_a, ref) {
16
- var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]);
17
- return (<NavigationMenuPrimitive.Indicator ref={ref} className={"data-[state=visible]:animate-fadeIn data-[state=hidden]:animate-fadeOut top-full z-[1] flex h-[10px] items-end justify-center overflow-hidden transition-[width,transform_250ms_ease]"} {...props}>
18
- <div className={cn("relative top-[70%] h-[10px] w-[10px] rotate-[45deg] rounded-tl-[2px] bg-white shadow shadow-slate-4 dark:bg-slateDark-2 dark:shadow-slateDark-4", className)}/>
19
- {children}
20
- </NavigationMenuPrimitive.Indicator>);
21
- });
22
- NavigationMenuIndicator.displayName = 'NavigationMenu.Indicator';