@lunit/design-system 2.2.0 → 2.2.3

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 (351) hide show
  1. package/.babelrc.json +1 -1
  2. package/README.md +22 -21
  3. package/dist/cjs/components/Alert/index.js +1 -1
  4. package/dist/cjs/components/Alert/index.js.map +1 -1
  5. package/dist/cjs/components/Button/index.js +1 -1
  6. package/dist/cjs/components/Button/index.js.map +1 -1
  7. package/dist/cjs/components/Checkbox/index.js +1 -1
  8. package/dist/cjs/components/Checkbox/index.js.map +1 -1
  9. package/dist/cjs/components/Chip/index.js +1 -1
  10. package/dist/cjs/components/Chip/index.js.map +1 -1
  11. package/dist/cjs/components/DataTable/index.js.map +1 -1
  12. package/dist/cjs/components/DatePicker/index.js.map +1 -1
  13. package/dist/cjs/components/Dialog/index.js +1 -1
  14. package/dist/cjs/components/Dialog/index.js.map +1 -1
  15. package/dist/cjs/components/Dropdown/index.js +1 -1
  16. package/dist/cjs/components/Dropdown/index.js.map +1 -1
  17. package/dist/cjs/components/FormLabel/index.js.map +1 -1
  18. package/dist/cjs/components/Radio/index.js +1 -1
  19. package/dist/cjs/components/Radio/index.js.map +1 -1
  20. package/dist/cjs/components/RadioGroup/index.js.map +1 -1
  21. package/dist/cjs/components/TextField/index.js +1 -1
  22. package/dist/cjs/components/TextField/index.js.map +1 -1
  23. package/dist/cjs/components/Toggle/index.js +1 -1
  24. package/dist/cjs/components/Toggle/index.js.map +1 -1
  25. package/dist/cjs/components/ToggleButton/index.js +1 -1
  26. package/dist/cjs/components/ToggleButton/index.js.map +1 -1
  27. package/dist/cjs/components/Tooltip/index.js.map +1 -1
  28. package/dist/cjs/components/Typography/index.js.map +1 -1
  29. package/dist/cjs/index.js +1 -1
  30. package/dist/cjs/index.js.map +1 -1
  31. package/dist/components/Alert/Alert.js +8 -8
  32. package/dist/components/Alert/Alert.js.map +1 -1
  33. package/dist/components/Alert/Alert.styled.js +26 -26
  34. package/dist/components/Alert/Alert.styled.js.map +1 -1
  35. package/dist/components/Alert/Alert.utils.js +9 -9
  36. package/dist/components/Alert/Alert.utils.js.map +1 -1
  37. package/dist/components/Alert/index.js +1 -1
  38. package/dist/components/Button/Button.js +23 -17
  39. package/dist/components/Button/Button.js.map +1 -1
  40. package/dist/components/Button/Button.styled.js +88 -88
  41. package/dist/components/Button/Button.styled.js.map +1 -1
  42. package/dist/components/Button/index.js +1 -1
  43. package/dist/components/Button/utils/getButtonPaddingBySizeAndKind.js +9 -9
  44. package/dist/components/Button/utils/getButtonPaddingBySizeAndKind.js.map +1 -1
  45. package/dist/components/Button/utils/getHoverStyle.js +1 -1
  46. package/dist/components/Button/utils/getHoverStyle.js.map +1 -1
  47. package/dist/components/Button/utils/getIconButtonPaddingBySizeAndKind.js +6 -12
  48. package/dist/components/Button/utils/getIconButtonPaddingBySizeAndKind.js.map +1 -1
  49. package/dist/components/Checkbox/Checkbox.js +9 -9
  50. package/dist/components/Checkbox/Checkbox.js.map +1 -1
  51. package/dist/components/Checkbox/index.js +1 -1
  52. package/dist/components/Chip/Chip.js +29 -26
  53. package/dist/components/Chip/Chip.js.map +1 -1
  54. package/dist/components/Chip/Chip.styled.js +52 -52
  55. package/dist/components/Chip/Chip.styled.js.map +1 -1
  56. package/dist/components/Chip/consts.js +5 -5
  57. package/dist/components/Chip/index.js +1 -1
  58. package/dist/components/DataTable/DataTable.js +1 -1
  59. package/dist/components/DataTable/index.js +1 -1
  60. package/dist/components/DatePicker/DatePicker.js +1 -1
  61. package/dist/components/DatePicker/index.js +1 -1
  62. package/dist/components/Dialog/Dialog.js +18 -18
  63. package/dist/components/Dialog/Dialog.js.map +1 -1
  64. package/dist/components/Dialog/Dialog.styled.js +90 -90
  65. package/dist/components/Dialog/Dialog.styled.js.map +1 -1
  66. package/dist/components/Dialog/components/DialogAction.js +6 -6
  67. package/dist/components/Dialog/index.js +1 -1
  68. package/dist/components/Dropdown/Dropdown.js +23 -21
  69. package/dist/components/Dropdown/Dropdown.js.map +1 -1
  70. package/dist/components/Dropdown/Dropdown.styled.js +85 -86
  71. package/dist/components/Dropdown/Dropdown.styled.js.map +1 -1
  72. package/dist/components/Dropdown/DropdownItem.js +14 -14
  73. package/dist/components/Dropdown/DropdownItem.js.map +1 -1
  74. package/dist/components/Dropdown/index.js +2 -2
  75. package/dist/components/Dropdown/index.js.map +1 -1
  76. package/dist/components/FormLabel/FormLabel.js +1 -1
  77. package/dist/components/FormLabel/FormLabel.styled.js +2 -2
  78. package/dist/components/FormLabel/FormLabel.styled.js.map +1 -1
  79. package/dist/components/FormLabel/index.js +1 -1
  80. package/dist/components/Radio/Radio.js +8 -8
  81. package/dist/components/Radio/Radio.js.map +1 -1
  82. package/dist/components/Radio/index.js +1 -1
  83. package/dist/components/RadioGroup/index.js +1 -1
  84. package/dist/components/TextField/TextField.js +8 -8
  85. package/dist/components/TextField/TextField.js.map +1 -1
  86. package/dist/components/TextField/TextField.style.js +112 -112
  87. package/dist/components/TextField/TextField.style.js.map +1 -1
  88. package/dist/components/TextField/TextFieldIcon.js +2 -2
  89. package/dist/components/TextField/TextFieldIcon.js.map +1 -1
  90. package/dist/components/TextField/index.js +1 -1
  91. package/dist/components/Toast/Toast.js +13 -13
  92. package/dist/components/Toast/Toast.js.map +1 -1
  93. package/dist/components/Toast/Toast.styled.js +26 -26
  94. package/dist/components/Toast/Toast.utils.js +3 -3
  95. package/dist/components/Toast/Toast.utils.js.map +1 -1
  96. package/dist/components/Toast/index.js +1 -1
  97. package/dist/components/Toggle/Toggle.js +3 -4
  98. package/dist/components/Toggle/Toggle.js.map +1 -1
  99. package/dist/components/Toggle/Toggle.styled.js +30 -30
  100. package/dist/components/Toggle/Toggle.styled.js.map +1 -1
  101. package/dist/components/Toggle/index.js +1 -1
  102. package/dist/components/ToggleButton/ToggleButton.js +6 -6
  103. package/dist/components/ToggleButton/ToggleButton.js.map +1 -1
  104. package/dist/components/ToggleButton/ToggleButton.styled.js +20 -20
  105. package/dist/components/ToggleButton/ToggleButton.styled.js.map +1 -1
  106. package/dist/components/ToggleButton/index.js +1 -1
  107. package/dist/components/ToggleButtonGroup/ToggleButtonGroup.js +2 -2
  108. package/dist/components/ToggleButtonGroup/ToggleButtonGroup.js.map +1 -1
  109. package/dist/components/ToggleButtonGroup/index.js +1 -1
  110. package/dist/components/Tooltip/Tooltip.js +1 -1
  111. package/dist/components/Tooltip/index.js +1 -1
  112. package/dist/components/Typography/Typography.js +1 -1
  113. package/dist/components/Typography/Typography.js.map +1 -1
  114. package/dist/components/Typography/index.js +1 -1
  115. package/dist/foundation/Elevation/index.js +27 -27
  116. package/dist/foundation/Elevation/utils.js +1 -1
  117. package/dist/foundation/Elevation/utils.js.map +1 -1
  118. package/dist/foundation/Typography/index.js +35 -35
  119. package/dist/foundation/Typography/index.js.map +1 -1
  120. package/dist/foundation/Typography/tokens.js +136 -136
  121. package/dist/foundation/Typography/tokens.js.map +1 -1
  122. package/dist/foundation/colors/base/blue.js +12 -12
  123. package/dist/foundation/colors/base/green.js +12 -12
  124. package/dist/foundation/colors/base/grey.js +28 -28
  125. package/dist/foundation/colors/base/index.js +11 -11
  126. package/dist/foundation/colors/base/lunitGreen.js +11 -11
  127. package/dist/foundation/colors/base/lunitTeal.js +12 -12
  128. package/dist/foundation/colors/base/magenta.js +12 -12
  129. package/dist/foundation/colors/base/opacity.js +4 -4
  130. package/dist/foundation/colors/base/orange.js +12 -12
  131. package/dist/foundation/colors/base/purple.js +12 -12
  132. package/dist/foundation/colors/base/red.js +12 -12
  133. package/dist/foundation/colors/base/yellow.js +12 -12
  134. package/dist/foundation/colors/index.js +119 -121
  135. package/dist/foundation/colors/index.js.map +1 -1
  136. package/dist/foundation/colors/token/component.js +184 -212
  137. package/dist/foundation/colors/token/component.js.map +1 -1
  138. package/dist/foundation/colors/token/core.js +112 -133
  139. package/dist/foundation/colors/token/core.js.map +1 -1
  140. package/dist/foundation/colors/token/index.js +2 -2
  141. package/dist/foundation/index.js +5 -5
  142. package/dist/index.js +20 -20
  143. package/dist/theme.js +6 -6
  144. package/dist/types/components/Alert/Alert.d.ts +2 -2
  145. package/dist/types/components/Alert/Alert.styled.d.ts +1 -2
  146. package/dist/types/components/Alert/Alert.types.d.ts +2 -2
  147. package/dist/types/components/Alert/Alert.utils.d.ts +1 -1
  148. package/dist/types/components/Alert/index.d.ts +1 -1
  149. package/dist/types/components/Button/Button.d.ts +1 -1
  150. package/dist/types/components/Button/Button.styled.d.ts +226 -227
  151. package/dist/types/components/Button/Button.types.d.ts +16 -16
  152. package/dist/types/components/Button/index.d.ts +1 -1
  153. package/dist/types/components/Button/utils/getButtonPaddingBySizeAndKind.d.ts +4 -4
  154. package/dist/types/components/Button/utils/getHoverStyle.d.ts +2 -1
  155. package/dist/types/components/Button/utils/getIconButtonPaddingBySizeAndKind.d.ts +4 -4
  156. package/dist/types/components/Checkbox/Checkbox.d.ts +1 -1
  157. package/dist/types/components/Checkbox/index.d.ts +1 -1
  158. package/dist/types/components/Chip/Chip.d.ts +1 -1
  159. package/dist/types/components/Chip/Chip.styled.d.ts +6 -7
  160. package/dist/types/components/Chip/Chip.types.d.ts +15 -14
  161. package/dist/types/components/Chip/index.d.ts +1 -1
  162. package/dist/types/components/DataTable/index.d.ts +1 -1
  163. package/dist/types/components/DatePicker/index.d.ts +1 -1
  164. package/dist/types/components/Dialog/Dialog.d.ts +11 -11
  165. package/dist/types/components/Dialog/Dialog.styled.d.ts +3 -4
  166. package/dist/types/components/Dialog/components/DialogAction.d.ts +2 -2
  167. package/dist/types/components/Dialog/index.d.ts +2 -2
  168. package/dist/types/components/Dropdown/Dropdown.d.ts +2 -2
  169. package/dist/types/components/Dropdown/Dropdown.styled.d.ts +3 -4
  170. package/dist/types/components/Dropdown/Dropdown.types.d.ts +5 -5
  171. package/dist/types/components/Dropdown/DropdownItem.d.ts +3 -3
  172. package/dist/types/components/Dropdown/index.d.ts +3 -3
  173. package/dist/types/components/FormLabel/FormLabel.d.ts +1 -1
  174. package/dist/types/components/FormLabel/index.d.ts +1 -1
  175. package/dist/types/components/Radio/Radio.d.ts +1 -1
  176. package/dist/types/components/Radio/index.d.ts +1 -1
  177. package/dist/types/components/RadioGroup/index.d.ts +1 -1
  178. package/dist/types/components/TextField/TextField.d.ts +2 -2
  179. package/dist/types/components/TextField/TextField.style.d.ts +3 -4
  180. package/dist/types/components/TextField/TextField.types.d.ts +6 -6
  181. package/dist/types/components/TextField/TextFieldIcon.d.ts +2 -2
  182. package/dist/types/components/TextField/index.d.ts +2 -2
  183. package/dist/types/components/Toast/Toast.d.ts +2 -2
  184. package/dist/types/components/Toast/Toast.types.d.ts +3 -3
  185. package/dist/types/components/Toast/Toast.utils.d.ts +1 -1
  186. package/dist/types/components/Toast/index.d.ts +2 -2
  187. package/dist/types/components/Toggle/Toggle.d.ts +1 -1
  188. package/dist/types/components/Toggle/Toggle.styled.d.ts +2 -2
  189. package/dist/types/components/Toggle/Toggle.types.d.ts +3 -3
  190. package/dist/types/components/Toggle/index.d.ts +1 -1
  191. package/dist/types/components/ToggleButton/ToggleButton.d.ts +1 -1
  192. package/dist/types/components/ToggleButton/ToggleButton.styled.d.ts +2 -3
  193. package/dist/types/components/ToggleButton/ToggleButton.types.d.ts +10 -10
  194. package/dist/types/components/ToggleButton/index.d.ts +1 -1
  195. package/dist/types/components/ToggleButtonGroup/ToggleButtonGroup.d.ts +1 -1
  196. package/dist/types/components/ToggleButtonGroup/index.d.ts +1 -1
  197. package/dist/types/components/Tooltip/index.d.ts +1 -1
  198. package/dist/types/components/Typography/Typography.d.ts +6 -6
  199. package/dist/types/components/Typography/index.d.ts +1 -1
  200. package/dist/types/components/index.d.ts +2 -2
  201. package/dist/types/foundation/Elevation/index.d.ts +22 -22
  202. package/dist/types/foundation/Typography/index.d.ts +78 -78
  203. package/dist/types/foundation/Typography/tokens.d.ts +69 -69
  204. package/dist/types/foundation/colors/base/index.d.ts +11 -11
  205. package/dist/types/foundation/colors/index.d.ts +13 -20
  206. package/dist/types/foundation/colors/token/component.d.ts +1 -1
  207. package/dist/types/foundation/colors/token/core.d.ts +1 -1
  208. package/dist/types/foundation/colors/token/index.d.ts +2 -2
  209. package/dist/types/foundation/colors/types.d.ts +0 -7
  210. package/dist/types/foundation/index.d.ts +4 -11
  211. package/dist/types/foundation/spacing.d.ts +1 -1
  212. package/dist/types/index.d.ts +20 -20
  213. package/dist/types/theme.d.ts +1 -1
  214. package/package.json +9 -11
  215. package/src/components/Alert/Alert.styled.ts +39 -49
  216. package/src/components/Alert/Alert.tsx +10 -16
  217. package/src/components/Alert/Alert.types.ts +2 -2
  218. package/src/components/Alert/Alert.utils.ts +13 -22
  219. package/src/components/Alert/index.ts +1 -1
  220. package/src/components/Button/Button.styled.ts +98 -101
  221. package/src/components/Button/Button.tsx +71 -69
  222. package/src/components/Button/Button.types.ts +19 -21
  223. package/src/components/Button/index.ts +1 -1
  224. package/src/components/Button/utils/getButtonPaddingBySizeAndKind.ts +13 -13
  225. package/src/components/Button/utils/getHoverStyle.ts +4 -2
  226. package/src/components/Button/utils/getIconButtonPaddingBySizeAndKind.ts +10 -19
  227. package/src/components/Checkbox/Checkbox.tsx +13 -25
  228. package/src/components/Checkbox/index.ts +1 -1
  229. package/src/components/Chip/Chip.styled.ts +69 -72
  230. package/src/components/Chip/Chip.tsx +33 -55
  231. package/src/components/Chip/Chip.types.ts +17 -25
  232. package/src/components/Chip/consts.ts +5 -5
  233. package/src/components/Chip/index.ts +1 -1
  234. package/src/components/DataTable/DataTable.tsx +2 -2
  235. package/src/components/DataTable/index.ts +1 -1
  236. package/src/components/DatePicker/DatePicker.tsx +2 -2
  237. package/src/components/DatePicker/index.ts +1 -1
  238. package/src/components/Dialog/Dialog.styled.ts +112 -114
  239. package/src/components/Dialog/Dialog.tsx +41 -46
  240. package/src/components/Dialog/components/DialogAction.tsx +8 -8
  241. package/src/components/Dialog/index.ts +3 -3
  242. package/src/components/Dropdown/Dropdown.styled.tsx +88 -89
  243. package/src/components/Dropdown/Dropdown.tsx +29 -30
  244. package/src/components/Dropdown/Dropdown.types.ts +5 -6
  245. package/src/components/Dropdown/DropdownItem.tsx +18 -29
  246. package/src/components/Dropdown/index.ts +3 -7
  247. package/src/components/FormLabel/FormLabel.styled.ts +3 -3
  248. package/src/components/FormLabel/FormLabel.tsx +3 -3
  249. package/src/components/FormLabel/index.ts +1 -1
  250. package/src/components/Radio/Radio.tsx +12 -29
  251. package/src/components/Radio/index.ts +1 -1
  252. package/src/components/RadioGroup/index.ts +1 -1
  253. package/src/components/TextField/TextField.style.ts +123 -132
  254. package/src/components/TextField/TextField.tsx +50 -62
  255. package/src/components/TextField/TextField.types.ts +6 -9
  256. package/src/components/TextField/TextFieldIcon.tsx +4 -7
  257. package/src/components/TextField/index.ts +2 -2
  258. package/src/components/Toast/Toast.styled.ts +26 -26
  259. package/src/components/Toast/Toast.tsx +14 -28
  260. package/src/components/Toast/Toast.types.ts +3 -8
  261. package/src/components/Toast/Toast.utils.ts +5 -8
  262. package/src/components/Toast/index.tsx +2 -2
  263. package/src/components/Toggle/Toggle.styled.ts +31 -32
  264. package/src/components/Toggle/Toggle.tsx +5 -11
  265. package/src/components/Toggle/Toggle.types.ts +3 -3
  266. package/src/components/Toggle/index.ts +1 -1
  267. package/src/components/ToggleButton/ToggleButton.styled.ts +47 -49
  268. package/src/components/ToggleButton/ToggleButton.tsx +91 -97
  269. package/src/components/ToggleButton/ToggleButton.types.ts +10 -10
  270. package/src/components/ToggleButton/index.ts +1 -1
  271. package/src/components/ToggleButtonGroup/ToggleButtonGroup.tsx +3 -8
  272. package/src/components/ToggleButtonGroup/index.tsx +1 -1
  273. package/src/components/Tooltip/Tooltip.tsx +2 -2
  274. package/src/components/Tooltip/index.ts +1 -1
  275. package/src/components/Typography/Typography.tsx +7 -10
  276. package/src/components/Typography/index.ts +1 -1
  277. package/src/components/index.ts +2 -2
  278. package/src/foundation/Elevation/index.ts +27 -27
  279. package/src/foundation/Elevation/utils.ts +14 -8
  280. package/src/foundation/Typography/index.ts +58 -57
  281. package/src/foundation/Typography/tokens.ts +138 -138
  282. package/src/foundation/colors/base/blue.ts +12 -12
  283. package/src/foundation/colors/base/green.ts +12 -12
  284. package/src/foundation/colors/base/grey.ts +28 -28
  285. package/src/foundation/colors/base/index.ts +11 -11
  286. package/src/foundation/colors/base/lunitGreen.ts +11 -11
  287. package/src/foundation/colors/base/lunitTeal.ts +12 -12
  288. package/src/foundation/colors/base/magenta.ts +12 -12
  289. package/src/foundation/colors/base/opacity.ts +4 -4
  290. package/src/foundation/colors/base/orange.ts +12 -12
  291. package/src/foundation/colors/base/purple.ts +12 -12
  292. package/src/foundation/colors/base/red.ts +12 -12
  293. package/src/foundation/colors/base/yellow.ts +12 -12
  294. package/src/foundation/colors/index.ts +119 -120
  295. package/src/foundation/colors/token/component.ts +185 -213
  296. package/src/foundation/colors/token/core.ts +113 -134
  297. package/src/foundation/colors/token/index.ts +2 -2
  298. package/src/foundation/colors/types.ts +0 -7
  299. package/src/foundation/index.ts +8 -8
  300. package/src/foundation/spacing.ts +1 -1
  301. package/src/index.ts +20 -20
  302. package/src/stories/GettingStarted.mdx +6 -6
  303. package/src/stories/components/Alert/Alert.stories.tsx +38 -45
  304. package/src/stories/components/Button/BasicButton.stories.tsx +68 -59
  305. package/src/stories/components/Button/ButtonDocs.mdx +17 -41
  306. package/src/stories/components/Button/Color.stories.tsx +28 -51
  307. package/src/stories/components/Button/IconButton.stories.tsx +40 -47
  308. package/src/stories/components/Button/Kind.stories.tsx +100 -213
  309. package/src/stories/components/CheckBox/BasicCheckbox.stories.tsx +52 -71
  310. package/src/stories/components/CheckBox/CheckboxDocs.mdx +6 -6
  311. package/src/stories/components/Chip/Chip.stories.tsx +75 -75
  312. package/src/stories/components/Chip/ChipDocs.mdx +12 -13
  313. package/src/stories/components/DataTable/DataTable.stories.tsx +4 -4
  314. package/src/stories/components/DatePicker/DatePicker.stories.tsx +4 -4
  315. package/src/stories/components/Dialog/Dialog.stories.tsx +103 -135
  316. package/src/stories/components/Dialog/DialogDocs.mdx +7 -13
  317. package/src/stories/components/Dropdown/Dropdown.stories.tsx +96 -82
  318. package/src/stories/components/Dropdown/DropdownDocs.mdx +275 -0
  319. package/src/stories/components/Dropdown/DropdownExamples.stories.tsx +40 -47
  320. package/src/stories/components/Dropdown/DropdownItem.stories.tsx +113 -98
  321. package/src/stories/components/SelectControl/RadioGroup.stories.tsx +17 -30
  322. package/src/stories/components/SelectControl/RadioStatus.stories.tsx +16 -23
  323. package/src/stories/components/SelectControl/Toggle.stories.tsx +33 -78
  324. package/src/stories/components/TextField/BasicTextField.stories.tsx +44 -53
  325. package/src/stories/components/TextField/TextFieldDocs.mdx +8 -12
  326. package/src/stories/components/TextField/TextFieldMulti.stories.tsx +39 -55
  327. package/src/stories/components/TextField/TextFieldSingle.stories.tsx +74 -118
  328. package/src/stories/components/TextField/TextFieldSize.stories.tsx +35 -55
  329. package/src/stories/components/Toast/Toast.stories.tsx +35 -50
  330. package/src/stories/components/ToggleButton/Basic.stories.tsx +115 -152
  331. package/src/stories/components/ToggleButton/ToggleButtonDocs.mdx +10 -14
  332. package/src/stories/components/ToggleButton/ToggleButtonKind.stories.tsx +141 -200
  333. package/src/stories/components/ToggleButton/WithIcon.stories.tsx +87 -107
  334. package/src/stories/components/Tooltip/Tooltip.stories.tsx +4 -4
  335. package/src/stories/foundation/Elevation/Elevation.stories.tsx +48 -54
  336. package/src/stories/foundation/Elevation/styled.ts +3 -3
  337. package/src/stories/foundation/Typography/Typography.mdx +9 -13
  338. package/src/stories/foundation/Typography/Typography.stories.tsx +25 -41
  339. package/src/stories/foundation/Typography/TypographyGroup.tsx +14 -25
  340. package/src/stories/foundation/Typography/const.ts +13 -19
  341. package/src/stories/foundation/colors/ColorSystem.tsx +42 -40
  342. package/src/stories/foundation/colors/Colors.stories.tsx +40 -41
  343. package/src/stories/foundation/colors/Docs.mdx +73 -77
  344. package/src/stories/foundation/colors/Mui.stories.tsx +6 -8
  345. package/src/stories/foundation/colors/Token.inComponent.stories.tsx +81 -71
  346. package/src/stories/foundation/colors/TokenPaletteTable.stories.tsx +7 -7
  347. package/src/stories/foundation/colors/TokenPaletteTable.tsx +23 -49
  348. package/src/stories/foundation/colors/styled.ts +26 -26
  349. package/src/theme.ts +6 -6
  350. package/src/types.d.ts +1 -1
  351. package/tsconfig.build.json +1 -5
package/src/foundation/Typography/tokens.ts CHANGED
@@ -1,198 +1,198 @@
1
- import type { TypographyStyleOptions } from "@mui/material/styles/createTypography";
1
+ import type { TypographyStyle } from '@mui/material/styles';
2
2
 
3
3
  const fontWeights = {
4
- "--font-weight-bold": 700,
5
- "--font-weight-semibold": 600,
6
- "--font-weight-medium": 500,
7
- "--font-weight-regular": 400,
4
+ '--font-weight-bold': 700,
5
+ '--font-weight-semibold': 600,
6
+ '--font-weight-medium': 500,
7
+ '--font-weight-regular': 400,
8
8
  } as const;
9
9
 
10
10
  const headline = {
11
- "--headline1-font-weight": "var(--font-weight-semibold)",
12
- "--headline1-font-size": "52px",
13
- "--headline1-line-height": "68px",
14
- "--headline2-font-weight": "var(--font-weight-bold)",
15
- "--headline2-font-size": "38px",
16
- "--headline2-line-height": "65px",
17
- "--headline3-font-weight": "var(--font-weight-semibold)",
18
- "--headline3-font-size": "24px",
19
- "--headline3-line-height": "29px",
20
- "--headline4-font-weight": "var(--font-weight-semibold)",
21
- "--headline4-font-size": "20px",
22
- "--headline4-line-height": "28px",
23
- "--headline5-font-weight": "var(--font-weight-semibold)",
24
- "--headline5-font-size": "16px",
25
- "--headline5-line-height": "24px",
11
+ '--headline1-font-weight': 'var(--font-weight-semibold)',
12
+ '--headline1-font-size': '52px',
13
+ '--headline1-line-height': '68px',
14
+ '--headline2-font-weight': 'var(--font-weight-bold)',
15
+ '--headline2-font-size': '38px',
16
+ '--headline2-line-height': '65px',
17
+ '--headline3-font-weight': 'var(--font-weight-semibold)',
18
+ '--headline3-font-size': '24px',
19
+ '--headline3-line-height': '29px',
20
+ '--headline4-font-weight': 'var(--font-weight-semibold)',
21
+ '--headline4-font-size': '20px',
22
+ '--headline4-line-height': '28px',
23
+ '--headline5-font-weight': 'var(--font-weight-semibold)',
24
+ '--headline5-font-size': '16px',
25
+ '--headline5-line-height': '24px',
26
26
  } as const;
27
27
 
28
28
  const body = {
29
- "--body1-16-semibold-font-weight": "var(--font-weight-semibold)",
30
- "--body1-16-semibold-font-size": "16px",
31
- "--body1-16-semibold-line-height": "24px",
32
- "--body1-16-regular-font-weight": "var(--font-weight-regular)",
33
- "--body1-16-regular-font-size": "16px",
34
- "--body1-16-regular-line-height": "24px",
35
- "--body2-14-bold-font-weight": "var(--font-weight-bold)",
36
- "--body2-14-bold-font-size": "14px",
37
- "--body2-14-bold-line-height": "20px",
38
- "--body2-14-medium-font-weight": "var(--font-weight-medium)",
39
- "--body2-14-medium-font-size": "14px",
40
- "--body2-14-medium-line-height": "20px",
41
- "--body2-14-regular-font-weight": "var(--font-weight-regular)",
42
- "--body2-14-regular-font-size": "14px",
43
- "--body2-14-regular-line-height": "20px",
44
- "--body3-12-semibold-font-weight": "var(--font-weight-semibold)",
45
- "--body3-12-semibold-font-size": "12.4px",
46
- "--body3-12-semibold-line-height": "16px",
47
- "--body3-12-regular-font-weight": "var(--font-weight-regular)",
48
- "--body3-12-regular-font-size": "12.4px",
49
- "--body3-12-regular-line-height": "16px",
50
- "--body_m2-font-weight": "var(--font-weight-medium)",
51
- "--body_m2-font-size": "13px",
52
- "--body_m2-line-height": "18px",
53
- "--body_reg6-font-weight": "var(--font-weight-regular)",
54
- "--body_reg6-font-size": "13px",
55
- "--body_reg6-line-height": "18px",
56
- "--body_reg8-font-weight": "var(--font-weight-regular)",
57
- "--body_reg8-font-size": "12px",
58
- "--body_reg8-line-height": "16px",
29
+ '--body1-16-semibold-font-weight': 'var(--font-weight-semibold)',
30
+ '--body1-16-semibold-font-size': '16px',
31
+ '--body1-16-semibold-line-height': '24px',
32
+ '--body1-16-regular-font-weight': 'var(--font-weight-regular)',
33
+ '--body1-16-regular-font-size': '16px',
34
+ '--body1-16-regular-line-height': '24px',
35
+ '--body2-14-bold-font-weight': 'var(--font-weight-bold)',
36
+ '--body2-14-bold-font-size': '14px',
37
+ '--body2-14-bold-line-height': '20px',
38
+ '--body2-14-medium-font-weight': 'var(--font-weight-medium)',
39
+ '--body2-14-medium-font-size': '14px',
40
+ '--body2-14-medium-line-height': '20px',
41
+ '--body2-14-regular-font-weight': 'var(--font-weight-regular)',
42
+ '--body2-14-regular-font-size': '14px',
43
+ '--body2-14-regular-line-height': '20px',
44
+ '--body3-12-semibold-font-weight': 'var(--font-weight-semibold)',
45
+ '--body3-12-semibold-font-size': '12.4px',
46
+ '--body3-12-semibold-line-height': '16px',
47
+ '--body3-12-regular-font-weight': 'var(--font-weight-regular)',
48
+ '--body3-12-regular-font-size': '12.4px',
49
+ '--body3-12-regular-line-height': '16px',
50
+ '--body_m2-font-weight': 'var(--font-weight-medium)',
51
+ '--body_m2-font-size': '13px',
52
+ '--body_m2-line-height': '18px',
53
+ '--body_reg6-font-weight': 'var(--font-weight-regular)',
54
+ '--body_reg6-font-size': '13px',
55
+ '--body_reg6-line-height': '18px',
56
+ '--body_reg8-font-weight': 'var(--font-weight-regular)',
57
+ '--body_reg8-font-size': '12px',
58
+ '--body_reg8-line-height': '16px',
59
59
  } as const;
60
60
 
61
61
  const smallBody = {
62
- "--small_body_sb1-font-weight": "var(--font-weight-semibold)",
63
- "--small_body_sb1-font-size": "12px",
64
- "--small_body_sb1-line-height": "16px",
65
- "--small_body_m2-font-weight": "var(--font-weight-medium)",
66
- "--small_body_m2-font-size": "12px",
67
- "--small_body_m2-line-height": "20px",
62
+ '--small_body_sb1-font-weight': 'var(--font-weight-semibold)',
63
+ '--small_body_sb1-font-size': '12px',
64
+ '--small_body_sb1-line-height': '16px',
65
+ '--small_body_m2-font-weight': 'var(--font-weight-medium)',
66
+ '--small_body_m2-font-size': '12px',
67
+ '--small_body_m2-line-height': '20px',
68
68
  } as const;
69
69
 
70
70
  const etc = {
71
- "--overline-font-weight": "var(--font-weight-medium)",
72
- "--overline-font-size": "14px",
73
- "--overline-line-height": "20px",
74
- "--button1-font-weight": "var(--font-weight-medium)",
75
- "--button1-font-size": "16px",
76
- "--button1-line-height": "22px",
77
- "--button2-font-weight": "var(--font-weight-medium)",
78
- "--button2-font-size": "14px",
79
- "--button2-line-height": "20px",
80
- "--caption-font-weight": "var(--font-weight-medium)",
81
- "--caption-font-size": "12px",
82
- "--caption-line-height": "16px",
71
+ '--overline-font-weight': 'var(--font-weight-medium)',
72
+ '--overline-font-size': '14px',
73
+ '--overline-line-height': '20px',
74
+ '--button1-font-weight': 'var(--font-weight-medium)',
75
+ '--button1-font-size': '16px',
76
+ '--button1-line-height': '22px',
77
+ '--button2-font-weight': 'var(--font-weight-medium)',
78
+ '--button2-font-size': '14px',
79
+ '--button2-line-height': '20px',
80
+ '--caption-font-weight': 'var(--font-weight-medium)',
81
+ '--caption-font-size': '12px',
82
+ '--caption-line-height': '16px',
83
83
  } as const;
84
84
 
85
- const fontVariants: Record<string, TypographyStyleOptions> = {
85
+ const fontVariants: Record<string, TypographyStyle> = {
86
86
  headline1: {
87
- fontWeight: "var(--headline1-font-weight)",
88
- fontSize: "var(--headline1-font-size)",
89
- lineHeight: "var(--headline1-line-height)",
87
+ fontWeight: 'var(--headline1-font-weight)',
88
+ fontSize: 'var(--headline1-font-size)',
89
+ lineHeight: 'var(--headline1-line-height)',
90
90
  },
91
91
  headline2: {
92
- fontWeight: "var(--headline2-font-weight)",
93
- fontSize: "var(--headline2-font-size)",
94
- lineHeight: "var(--headline2-line-height)",
92
+ fontWeight: 'var(--headline2-font-weight)',
93
+ fontSize: 'var(--headline2-font-size)',
94
+ lineHeight: 'var(--headline2-line-height)',
95
95
  },
96
96
  headline3: {
97
- fontWeight: "var(--headline3-font-weight)",
98
- fontSize: "var(--headline3-font-size)",
99
- lineHeight: "var(--headline3-line-height)",
97
+ fontWeight: 'var(--headline3-font-weight)',
98
+ fontSize: 'var(--headline3-font-size)',
99
+ lineHeight: 'var(--headline3-line-height)',
100
100
  },
101
101
  headline4: {
102
- fontWeight: "var(--headline4-font-weight)",
103
- fontSize: "var(--headline4-font-size)",
104
- lineHeight: "var(--headline4-line-height)",
102
+ fontWeight: 'var(--headline4-font-weight)',
103
+ fontSize: 'var(--headline4-font-size)',
104
+ lineHeight: 'var(--headline4-line-height)',
105
105
  },
106
106
  headline5: {
107
- fontWeight: "var(--headline5-font-weight)",
108
- fontSize: "var(--headline5-font-size)",
109
- lineHeight: "var(--headline5-line-height)",
107
+ fontWeight: 'var(--headline5-font-weight)',
108
+ fontSize: 'var(--headline5-font-size)',
109
+ lineHeight: 'var(--headline5-line-height)',
110
110
  },
111
111
  body1_16_semibold: {
112
- fontWeight: "var(--body1-16-semibold-font-weight)",
113
- fontSize: "var(--body1-16-semibold-font-size)",
114
- lineHeight: "var(--body1-16-semibold-line-height)",
112
+ fontWeight: 'var(--body1-16-semibold-font-weight)',
113
+ fontSize: 'var(--body1-16-semibold-font-size)',
114
+ lineHeight: 'var(--body1-16-semibold-line-height)',
115
115
  },
116
116
  body1_16_regular: {
117
- fontWeight: "var(--body1-16-regular-font-weight)",
118
- fontSize: "var(--body1-16-regular-font-size)",
119
- lineHeight: "var(--body1-16-regular-line-height)",
117
+ fontWeight: 'var(--body1-16-regular-font-weight)',
118
+ fontSize: 'var(--body1-16-regular-font-size)',
119
+ lineHeight: 'var(--body1-16-regular-line-height)',
120
120
  },
121
121
  body2_14_bold: {
122
- fontWeight: "var(--body2-14-bold-font-weight)",
123
- fontSize: "var(--body2-14-bold-font-size)",
124
- lineHeight: "var(--body2-14-bold-line-height)",
122
+ fontWeight: 'var(--body2-14-bold-font-weight)',
123
+ fontSize: 'var(--body2-14-bold-font-size)',
124
+ lineHeight: 'var(--body2-14-bold-line-height)',
125
125
  },
126
126
  body2_14_medium: {
127
- fontWeight: "var(--body2-14-medium-font-weight)",
128
- fontSize: "var(--body2-14-medium-font-size)",
129
- lineHeight: "var(--body2-14-medium-line-height)",
127
+ fontWeight: 'var(--body2-14-medium-font-weight)',
128
+ fontSize: 'var(--body2-14-medium-font-size)',
129
+ lineHeight: 'var(--body2-14-medium-line-height)',
130
130
  },
131
131
  body2_14_regular: {
132
- fontWeight: "var(--body2-14-regular-font-weight)",
133
- fontSize: "var(--body2-14-regular-font-size)",
134
- lineHeight: "var(--body2-14-regular-line-height)",
132
+ fontWeight: 'var(--body2-14-regular-font-weight)',
133
+ fontSize: 'var(--body2-14-regular-font-size)',
134
+ lineHeight: 'var(--body2-14-regular-line-height)',
135
135
  },
136
136
  body3_12_semibold: {
137
- fontWeight: "var(--body3-12-semibold-font-weight)",
138
- fontSize: "var(--body3-12-semibold-font-size)",
139
- lineHeight: "var(--body3-12-semibold-line-height)",
137
+ fontWeight: 'var(--body3-12-semibold-font-weight)',
138
+ fontSize: 'var(--body3-12-semibold-font-size)',
139
+ lineHeight: 'var(--body3-12-semibold-line-height)',
140
140
  },
141
141
  body3_12_regular: {
142
- fontWeight: "var(--body3-12-regular-font-weight)",
143
- fontSize: "var(--body3-12-regular-font-size)",
144
- lineHeight: "var(--body3-12-regular-line-height)",
142
+ fontWeight: 'var(--body3-12-regular-font-weight)',
143
+ fontSize: 'var(--body3-12-regular-font-size)',
144
+ lineHeight: 'var(--body3-12-regular-line-height)',
145
145
  },
146
146
  body_m2: {
147
- fontWeight: "var(--body_m2-font-weight)",
148
- fontSize: "var(--body_m2-font-size)",
149
- lineHeight: "var(--body_m2-line-height)",
150
- letterSpacing: "0.2px",
147
+ fontWeight: 'var(--body_m2-font-weight)',
148
+ fontSize: 'var(--body_m2-font-size)',
149
+ lineHeight: 'var(--body_m2-line-height)',
150
+ letterSpacing: '0.2px',
151
151
  },
152
152
  body_reg6: {
153
- fontWeight: "var(--body_reg6-font-weight)",
154
- fontSize: "var(--body_reg6-font-size)",
155
- lineHeight: "var(--body_reg6-line-height)",
153
+ fontWeight: 'var(--body_reg6-font-weight)',
154
+ fontSize: 'var(--body_reg6-font-size)',
155
+ lineHeight: 'var(--body_reg6-line-height)',
156
156
  },
157
157
  body_reg8: {
158
- fontWeight: "var(--body_reg8-font-weight)",
159
- fontSize: "var(--body_reg8-font-size)",
160
- lineHeight: "var(--body_reg8-line-height)",
158
+ fontWeight: 'var(--body_reg8-font-weight)',
159
+ fontSize: 'var(--body_reg8-font-size)',
160
+ lineHeight: 'var(--body_reg8-line-height)',
161
161
  },
162
162
  small_body_sb1: {
163
- fontWeight: "var(--small_body_sb1-font-weight)",
164
- fontSize: "var(--small_body_sb1-font-size)",
165
- lineHeight: "var(--small_body_sb1-line-height)",
163
+ fontWeight: 'var(--small_body_sb1-font-weight)',
164
+ fontSize: 'var(--small_body_sb1-font-size)',
165
+ lineHeight: 'var(--small_body_sb1-line-height)',
166
166
  },
167
167
  small_body_m2: {
168
- fontWeight: "var(--small_body_m2-font-weight)",
169
- fontSize: "var(--small_body_m2-font-size)",
170
- lineHeight: "var(--small_body_m2-line-height)",
168
+ fontWeight: 'var(--small_body_m2-font-weight)',
169
+ fontSize: 'var(--small_body_m2-font-size)',
170
+ lineHeight: 'var(--small_body_m2-line-height)',
171
171
  },
172
172
  overline: {
173
- fontWeight: "var(--overline-font-weight)",
174
- fontSize: "var(--overline-font-size)",
175
- lineHeight: "var(--overline-line-height)",
176
- letterSpacing: "1px",
177
- textTransform: "uppercase",
173
+ fontWeight: 'var(--overline-font-weight)',
174
+ fontSize: 'var(--overline-font-size)',
175
+ lineHeight: 'var(--overline-line-height)',
176
+ letterSpacing: '1px',
177
+ textTransform: 'uppercase',
178
178
  },
179
179
  button1: {
180
- fontWeight: "var(--button1-font-weight)",
181
- fontSize: "var(--button1-font-size)",
182
- lineHeight: "var(--button1-line-height)",
183
- textTransform: "capitalize",
180
+ fontWeight: 'var(--button1-font-weight)',
181
+ fontSize: 'var(--button1-font-size)',
182
+ lineHeight: 'var(--button1-line-height)',
183
+ textTransform: 'capitalize',
184
184
  },
185
185
  button2: {
186
- fontWeight: "var(--button2-font-weight)",
187
- fontSize: "var(--button2-font-size)",
188
- lineHeight: "var(--button2-line-height)",
189
- letterSpacing: "0.2px",
190
- textTransform: "capitalize",
186
+ fontWeight: 'var(--button2-font-weight)',
187
+ fontSize: 'var(--button2-font-size)',
188
+ lineHeight: 'var(--button2-line-height)',
189
+ letterSpacing: '0.2px',
190
+ textTransform: 'capitalize',
191
191
  },
192
192
  caption: {
193
- fontWeight: "var(--caption-font-weight)",
194
- fontSize: "var(--caption-font-size)",
195
- lineHeight: "var(--caption-line-height)",
193
+ fontWeight: 'var(--caption-font-weight)',
194
+ fontSize: 'var(--caption-font-size)',
195
+ lineHeight: 'var(--caption-line-height)',
196
196
  },
197
197
  };
198
198
 
package/src/foundation/colors/base/blue.ts CHANGED
@@ -1,17 +1,17 @@
1
- import { grey } from "./grey";
1
+ import { grey } from './grey';
2
2
 
3
3
  export const blue = {
4
- 5: "#EDF6FE",
5
- 10: "#D9E9FD",
6
- 15: "#BFD9FC",
7
- 20: "#A5C8FC",
8
- 30: "#71A9FA",
9
- 40: "#3D88FA",
10
- 50: "#0D68F2",
11
- 60: "#0E51BA",
12
- 70: "#0C3F8F",
13
- 80: "#032765",
14
- 90: "#03183F",
4
+ 5: '#EDF6FE',
5
+ 10: '#D9E9FD',
6
+ 15: '#BFD9FC',
7
+ 20: '#A5C8FC',
8
+ 30: '#71A9FA',
9
+ 40: '#3D88FA',
10
+ 50: '#0D68F2',
11
+ 60: '#0E51BA',
12
+ 70: '#0C3F8F',
13
+ 80: '#032765',
14
+ 90: '#03183F',
15
15
  };
16
16
 
17
17
  export const blueText = {
package/src/foundation/colors/base/green.ts CHANGED
@@ -1,17 +1,17 @@
1
- import { grey } from "./grey";
1
+ import { grey } from './grey';
2
2
 
3
3
  export const green = {
4
- 5: "#E6FDEB",
5
- 10: "#C4F5D1",
6
- 15: "#A0E5B3",
7
- 20: "#6FDC8C",
8
- 30: "#44BE67",
9
- 40: "#1A9F3F",
10
- 50: "#138231",
11
- 60: "#0D6222",
12
- 70: "#0B4F1A",
13
- 80: "#01380F",
14
- 90: "#082209",
4
+ 5: '#E6FDEB',
5
+ 10: '#C4F5D1',
6
+ 15: '#A0E5B3',
7
+ 20: '#6FDC8C',
8
+ 30: '#44BE67',
9
+ 40: '#1A9F3F',
10
+ 50: '#138231',
11
+ 60: '#0D6222',
12
+ 70: '#0B4F1A',
13
+ 80: '#01380F',
14
+ 90: '#082209',
15
15
  };
16
16
 
17
17
  export const greenText = {
package/src/foundation/colors/base/grey.ts CHANGED
@@ -1,28 +1,28 @@
1
1
  export const grey = {
2
- 0: "#FFFFFF",
3
- 5: "#F5F5F6",
4
- 10: "#EAEAEC",
5
- 15: "#DFDFE1",
6
- 20: "#D5D5D7",
7
- 25: "#C8C8CA",
8
- 30: "#BCBCBE",
9
- 35: "#B1B1B4",
10
- 40: "#A4A4A8",
11
- 45: "#9A9A9D",
12
- 50: "#8D8D90",
13
- 55: "#808084",
14
- 60: "#747479",
15
- 65: "#68686C",
16
- 70: "#59595D",
17
- 75: "#4A4A4E",
18
- 80: "#3B3B3F",
19
- 82: "#343438",
20
- 85: "#2E2E32",
21
- 88: "#27272B",
22
- 90: "#1F1F23",
23
- 93: "#16161A",
24
- 95: "#0F0F12",
25
- 100: "#000000",
2
+ 0: '#FFFFFF',
3
+ 5: '#F5F5F6',
4
+ 10: '#EAEAEC',
5
+ 15: '#DFDFE1',
6
+ 20: '#D5D5D7',
7
+ 25: '#C8C8CA',
8
+ 30: '#BCBCBE',
9
+ 35: '#B1B1B4',
10
+ 40: '#A4A4A8',
11
+ 45: '#9A9A9D',
12
+ 50: '#8D8D90',
13
+ 55: '#808084',
14
+ 60: '#747479',
15
+ 65: '#68686C',
16
+ 70: '#59595D',
17
+ 75: '#4A4A4E',
18
+ 80: '#3B3B3F',
19
+ 82: '#343438',
20
+ 85: '#2E2E32',
21
+ 88: '#27272B',
22
+ 90: '#1F1F23',
23
+ 93: '#16161A',
24
+ 95: '#0F0F12',
25
+ 100: '#000000',
26
26
  };
27
27
 
28
28
  export const greyText = {
@@ -63,8 +63,8 @@ export const greyForMUI = {
63
63
  700: grey[70],
64
64
  800: grey[80],
65
65
  900: grey[90],
66
- A100: "#F3F3F3",
67
- A200: "#C7C7C7",
68
- A400: "#9A9A9A",
69
- A700: "#4F4F4F",
66
+ A100: '#F3F3F3',
67
+ A200: '#C7C7C7',
68
+ A400: '#9A9A9A',
69
+ A700: '#4F4F4F',
70
70
  };
package/src/foundation/colors/base/index.ts CHANGED
@@ -1,11 +1,11 @@
1
- export * from "./blue";
2
- export * from "./green";
3
- export * from "./grey";
4
- export * from "./lunitGreen";
5
- export * from "./lunitTeal";
6
- export * from "./magenta";
7
- export * from "./orange";
8
- export * from "./red";
9
- export * from "./yellow";
10
- export * from "./purple";
11
- export * from "./opacity";
1
+ export * from './blue';
2
+ export * from './green';
3
+ export * from './grey';
4
+ export * from './lunitGreen';
5
+ export * from './lunitTeal';
6
+ export * from './magenta';
7
+ export * from './orange';
8
+ export * from './red';
9
+ export * from './yellow';
10
+ export * from './purple';
11
+ export * from './opacity';
package/src/foundation/colors/base/lunitGreen.ts CHANGED
@@ -1,16 +1,16 @@
1
- import { grey } from "./grey";
1
+ import { grey } from './grey';
2
2
 
3
3
  export const lunit_green = {
4
- 5: "#F5FBE7",
5
- 10: "#EFF8BC",
6
- 20: "#E5F39E",
7
- 30: "#E1EE91",
8
- 40: "#DCEB7A",
9
- 50: "#D2EA60",
10
- 60: "#CEE559",
11
- 70: "#CADE5C",
12
- 80: "#BED358",
13
- 90: "#B1C953",
4
+ 5: '#F5FBE7',
5
+ 10: '#EFF8BC',
6
+ 20: '#E5F39E',
7
+ 30: '#E1EE91',
8
+ 40: '#DCEB7A',
9
+ 50: '#D2EA60',
10
+ 60: '#CEE559',
11
+ 70: '#CADE5C',
12
+ 80: '#BED358',
13
+ 90: '#B1C953',
14
14
  };
15
15
 
16
16
  export const lunit_greenText = {
package/src/foundation/colors/base/lunitTeal.ts CHANGED
@@ -1,17 +1,17 @@
1
- import { grey } from "./grey";
1
+ import { grey } from './grey';
2
2
 
3
3
  export const lunit_teal = {
4
- 5: "#EAFAFF",
5
- 10: "#D1F7FF",
6
- 15: "#BDF4FF",
7
- 20: "#96EDFF",
8
- 30: "#30DFFC",
9
- 40: "#00C9EA",
10
- 50: "#01AED4",
11
- 60: "#048AB4",
12
- 70: "#016D8F",
13
- 80: "#05495F",
14
- 90: "#002930",
4
+ 5: '#EAFAFF',
5
+ 10: '#D1F7FF',
6
+ 15: '#BDF4FF',
7
+ 20: '#96EDFF',
8
+ 30: '#30DFFC',
9
+ 40: '#00C9EA',
10
+ 50: '#01AED4',
11
+ 60: '#048AB4',
12
+ 70: '#016D8F',
13
+ 80: '#05495F',
14
+ 90: '#002930',
15
15
  };
16
16
 
17
17
  export const lunit_tealText = {
package/src/foundation/colors/base/magenta.ts CHANGED
@@ -1,17 +1,17 @@
1
- import { grey } from "./grey";
1
+ import { grey } from './grey';
2
2
 
3
3
  export const magenta = {
4
- 5: "#FFF0F7",
5
- 10: "#FFE3F0",
6
- 15: "#FDCDE3",
7
- 20: "#FAB2D3",
8
- 30: "#F681B7",
9
- 40: "#FF50A0",
10
- 50: "#E41976",
11
- 60: "#9F1853",
12
- 70: "#740937",
13
- 80: "#57042A",
14
- 90: "#2A0A18",
4
+ 5: '#FFF0F7',
5
+ 10: '#FFE3F0',
6
+ 15: '#FDCDE3',
7
+ 20: '#FAB2D3',
8
+ 30: '#F681B7',
9
+ 40: '#FF50A0',
10
+ 50: '#E41976',
11
+ 60: '#9F1853',
12
+ 70: '#740937',
13
+ 80: '#57042A',
14
+ 90: '#2A0A18',
15
15
  };
16
16
 
17
17
  export const magentaText = {
package/src/foundation/colors/base/opacity.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  export const opacity = {
2
- 1: "rgba(0, 0, 0, 0.12)",
3
- 2: "rgba(0, 0, 0, 0.65)",
4
- 3: "rgba(255, 255, 255, 0.12)",
5
- 4: "rgba(255, 255, 255, 0.65)",
2
+ 1: 'rgba(0, 0, 0, 0.12)',
3
+ 2: 'rgba(0, 0, 0, 0.65)',
4
+ 3: 'rgba(255, 255, 255, 0.12)',
5
+ 4: 'rgba(255, 255, 255, 0.65)',
6
6
  };
package/src/foundation/colors/base/orange.ts CHANGED
@@ -1,17 +1,17 @@
1
- import { grey } from "./grey";
1
+ import { grey } from './grey';
2
2
 
3
3
  export const orange = {
4
- 5: "#FFF2E8",
5
- 10: "#FFE4CD",
6
- 15: "#FFCEA6",
7
- 20: "#FFB375",
8
- 30: "#FF9945",
9
- 40: "#FF811A",
10
- 50: "#D35F00",
11
- 60: "#AB4D00",
12
- 70: "#733400",
13
- 80: "#472000",
14
- 90: "#2B1400",
4
+ 5: '#FFF2E8',
5
+ 10: '#FFE4CD',
6
+ 15: '#FFCEA6',
7
+ 20: '#FFB375',
8
+ 30: '#FF9945',
9
+ 40: '#FF811A',
10
+ 50: '#D35F00',
11
+ 60: '#AB4D00',
12
+ 70: '#733400',
13
+ 80: '#472000',
14
+ 90: '#2B1400',
15
15
  };
16
16
 
17
17
  export const orangeText = {