@openedx/paragon 23.0.0-alpha.2 → 23.0.0-alpha.4

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 (274) hide show
  1. package/bin/paragon-scripts.js +10 -0
  2. package/dist/Annotation/index.scss +16 -0
  3. package/dist/Button/index.d.ts +35 -0
  4. package/dist/Button/index.js +37 -15
  5. package/dist/Button/index.js.map +1 -1
  6. package/dist/Card/CardDeck.js +0 -2
  7. package/dist/Card/CardDeck.js.map +1 -1
  8. package/dist/Card/index.scss +6 -6
  9. package/dist/Carousel/index.scss +24 -1
  10. package/dist/Chip/ChipIcon.d.ts +13 -8
  11. package/dist/Chip/ChipIcon.js +0 -2
  12. package/dist/Chip/ChipIcon.js.map +1 -1
  13. package/dist/Chip/constants.d.ts +4 -0
  14. package/dist/Chip/constants.js +3 -2
  15. package/dist/Chip/constants.js.map +1 -0
  16. package/dist/Chip/index.d.ts +4 -3
  17. package/dist/Chip/index.js +2 -4
  18. package/dist/Chip/index.js.map +1 -1
  19. package/dist/ChipCarousel/index.js +0 -2
  20. package/dist/ChipCarousel/index.js.map +1 -1
  21. package/dist/CloseButton/index.scss +8 -0
  22. package/dist/ColorPicker/index.scss +1 -1
  23. package/dist/DataTable/index.scss +12 -0
  24. package/dist/Dropdown/dropdown-bootstrap.scss +6 -0
  25. package/dist/Dropzone/index.scss +34 -0
  26. package/dist/Form/_FormText.scss +1 -1
  27. package/dist/Form/_bootstrap-custom-forms.scss +40 -0
  28. package/dist/Form/_index.scss +9 -0
  29. package/dist/Form/_mixins.scss +22 -0
  30. package/dist/Hyperlink/index.d.ts +24 -0
  31. package/dist/Hyperlink/index.js +20 -32
  32. package/dist/Hyperlink/index.js.map +1 -1
  33. package/dist/Icon/index.d.ts +4 -2
  34. package/dist/Icon/index.js +1 -1
  35. package/dist/Icon/index.js.map +1 -1
  36. package/dist/IconButton/index.d.ts +342 -0
  37. package/dist/IconButton/index.js +18 -26
  38. package/dist/IconButton/index.js.map +1 -1
  39. package/dist/IconButton/index.scss +146 -0
  40. package/dist/Menu/index.scss +8 -0
  41. package/dist/Modal/ModalDialog.js +8 -4
  42. package/dist/Modal/ModalDialog.js.map +1 -1
  43. package/dist/Modal/ModalPopup.js +7 -1
  44. package/dist/Modal/ModalPopup.js.map +1 -1
  45. package/dist/Modal/_ModalDialog.scss +26 -2
  46. package/dist/Nav/index.scss +8 -0
  47. package/dist/Overlay/index.d.ts +128 -0
  48. package/dist/Overlay/index.js +8 -2
  49. package/dist/Overlay/index.js.map +1 -1
  50. package/dist/PageBanner/index.scss +2 -2
  51. package/dist/Pagination/pagination-bootstrap.scss +9 -0
  52. package/dist/Popover/index.scss +1 -1
  53. package/dist/ProductTour/Checkpoint.scss +1 -1
  54. package/dist/ProgressBar/bootstrap-progress.scss +20 -5
  55. package/dist/ProgressBar/index.scss +3 -3
  56. package/dist/Stepper/index.scss +1 -1
  57. package/dist/Sticky/index.scss +12 -0
  58. package/dist/Toast/index.scss +13 -1
  59. package/dist/Tooltip/index.d.ts +7 -0
  60. package/dist/Tooltip/index.js.map +1 -1
  61. package/dist/Tooltip/index.scss +16 -0
  62. package/dist/core.css +914 -470
  63. package/dist/core.css.map +1 -1
  64. package/dist/core.min.css +1 -1
  65. package/dist/index.d.ts +5 -5
  66. package/dist/index.js +7 -7
  67. package/dist/light.css +2035 -1315
  68. package/dist/light.css.map +1 -1
  69. package/dist/light.min.css +1 -1
  70. package/dist/setupTest.d.ts +2 -0
  71. package/dist/setupTest.js.map +1 -0
  72. package/dist/utils/types/bootstrap.d.ts +39 -0
  73. package/dist/utils/types/bootstrap.js +2 -0
  74. package/dist/utils/types/bootstrap.js.map +1 -0
  75. package/lib/build-tokens.js +67 -31
  76. package/package.json +11 -8
  77. package/src/Annotation/index.scss +16 -0
  78. package/src/Button/{Button.test.jsx → Button.test.tsx} +14 -2
  79. package/src/Button/__snapshots__/{Button.test.jsx.snap → Button.test.tsx.snap} +19 -2
  80. package/src/Button/{index.jsx → index.tsx} +58 -16
  81. package/src/Card/CardDeck.jsx +0 -3
  82. package/src/Card/README.md +0 -31
  83. package/src/Card/index.scss +6 -6
  84. package/src/Carousel/index.scss +24 -1
  85. package/src/Chip/{Chip.test.jsx → Chip.test.tsx} +5 -7
  86. package/src/Chip/ChipIcon.tsx +8 -8
  87. package/src/Chip/{constants.js → constants.ts} +1 -1
  88. package/src/Chip/index.tsx +6 -8
  89. package/src/ChipCarousel/index.tsx +0 -2
  90. package/src/CloseButton/index.scss +8 -0
  91. package/src/ColorPicker/index.scss +1 -1
  92. package/src/DataTable/index.scss +12 -0
  93. package/src/Dropdown/dropdown-bootstrap.scss +6 -0
  94. package/src/Dropzone/index.scss +34 -0
  95. package/src/Form/_FormText.scss +1 -1
  96. package/src/Form/_bootstrap-custom-forms.scss +40 -0
  97. package/src/Form/_index.scss +9 -0
  98. package/src/Form/_mixins.scss +22 -0
  99. package/src/Hyperlink/{Hyperlink.test.jsx → Hyperlink.test.tsx} +21 -10
  100. package/src/Hyperlink/{index.jsx → index.tsx} +41 -37
  101. package/src/Icon/index.d.ts +4 -2
  102. package/src/Icon/index.jsx +1 -1
  103. package/src/IconButton/{IconButton.test.jsx → IconButton.test.tsx} +24 -3
  104. package/src/IconButton/__snapshots__/IconButton.test.tsx.snap +90 -0
  105. package/src/IconButton/index.scss +146 -0
  106. package/src/IconButton/{index.jsx → index.tsx} +66 -26
  107. package/src/Menu/index.scss +8 -0
  108. package/src/Modal/ModalDialog.jsx +7 -3
  109. package/src/Modal/ModalPopup.jsx +9 -1
  110. package/src/Modal/_ModalDialog.scss +26 -2
  111. package/src/Modal/modal-dialog.mdx +95 -6
  112. package/src/Modal/tests/ModalDialog.test.jsx +2 -0
  113. package/src/Modal/tests/ModalPopupNoMock.test.jsx +29 -0
  114. package/src/Nav/index.scss +8 -0
  115. package/src/Overlay/{index.jsx → index.tsx} +13 -8
  116. package/src/PageBanner/index.scss +2 -2
  117. package/src/Pagination/pagination-bootstrap.scss +9 -0
  118. package/src/Popover/index.scss +1 -1
  119. package/src/ProductTour/Checkpoint.scss +1 -1
  120. package/src/ProgressBar/bootstrap-progress.scss +20 -5
  121. package/src/ProgressBar/index.scss +3 -3
  122. package/src/Stepper/index.scss +1 -1
  123. package/src/Sticky/index.scss +12 -0
  124. package/src/Toast/index.scss +13 -1
  125. package/src/Tooltip/index.scss +16 -0
  126. package/src/Tooltip/{index.jsx → index.tsx} +9 -3
  127. package/src/index.d.ts +5 -5
  128. package/src/index.js +7 -7
  129. package/src/{setupTest.js → setupTest.ts} +1 -0
  130. package/src/utils/types/bootstrap.test.tsx +86 -0
  131. package/src/utils/types/bootstrap.ts +43 -0
  132. package/styles/css/core/abstraction-variables.css +44 -0
  133. package/styles/css/core/custom-media-breakpoints.css +3 -4
  134. package/styles/css/core/index.css +2 -1
  135. package/styles/css/core/variables.css +494 -430
  136. package/styles/css/themes/light/abstraction-variables.css +304 -0
  137. package/styles/css/themes/light/index.css +1 -0
  138. package/styles/css/themes/light/utility-classes.css +2 -3
  139. package/styles/css/themes/light/variables.css +1753 -1334
  140. package/styles/scss/core/_typography.scss +16 -4
  141. package/styles/scss/core/_utilities.scss +7 -3
  142. package/styles/scss/core/_variables.scss +43 -30
  143. package/styles/scss/core/core.scss +1 -0
  144. package/tokens/src/core/alias/size.json +6 -5
  145. package/tokens/src/core/components/ActionRow.json +3 -2
  146. package/tokens/src/core/components/Alert.json +12 -10
  147. package/tokens/src/core/components/Annotation.json +9 -7
  148. package/tokens/src/core/components/Avatar.json +9 -9
  149. package/tokens/src/core/components/AvatarButton.json +4 -3
  150. package/tokens/src/core/components/Badge.json +12 -9
  151. package/tokens/src/core/components/Breadcrumb.json +7 -5
  152. package/tokens/src/core/components/Bubble.json +4 -3
  153. package/tokens/src/core/components/Button/core.json +35 -59
  154. package/tokens/src/core/components/Card.json +33 -44
  155. package/tokens/src/core/components/Carousel.json +39 -13
  156. package/tokens/src/core/components/Chip.json +13 -21
  157. package/tokens/src/core/components/ChipCarousel.json +4 -5
  158. package/tokens/src/core/components/CloseButton.json +2 -6
  159. package/tokens/src/core/components/Code.json +9 -8
  160. package/tokens/src/core/components/Collapsible.json +10 -13
  161. package/tokens/src/core/components/ColorPicker.json +3 -2
  162. package/tokens/src/core/components/Container.json +6 -5
  163. package/tokens/src/core/components/DataTable.json +17 -9
  164. package/tokens/src/core/components/Dropdown.json +24 -29
  165. package/tokens/src/core/components/Dropzone.json +5 -7
  166. package/tokens/src/core/components/Form/other.json +5 -4
  167. package/tokens/src/core/components/Form/size.json +72 -119
  168. package/tokens/src/core/components/Form/spacing.json +39 -83
  169. package/tokens/src/core/components/Form/transition.json +43 -7
  170. package/tokens/src/core/components/Form/typography.json +24 -88
  171. package/tokens/src/core/components/Icon.json +6 -5
  172. package/tokens/src/core/components/IconButton.json +4 -7
  173. package/tokens/src/core/components/Image.json +7 -6
  174. package/tokens/src/core/components/Menu.json +14 -12
  175. package/tokens/src/core/components/Modal.json +26 -21
  176. package/tokens/src/core/components/Nav.json +14 -16
  177. package/tokens/src/core/components/Navbar.json +15 -30
  178. package/tokens/src/core/components/Pagination.json +23 -24
  179. package/tokens/src/core/components/Popover.json +18 -14
  180. package/tokens/src/core/components/ProductTour.json +8 -14
  181. package/tokens/src/core/components/ProgressBar.json +29 -14
  182. package/tokens/src/core/components/SearchField.json +7 -9
  183. package/tokens/src/core/components/SelectableBox.json +4 -3
  184. package/tokens/src/core/components/Sheet.json +3 -2
  185. package/tokens/src/core/components/Spinner.json +9 -7
  186. package/tokens/src/core/components/Stack.json +2 -1
  187. package/tokens/src/core/components/Stepper.json +12 -14
  188. package/tokens/src/core/components/Sticky.json +2 -1
  189. package/tokens/src/core/components/Tab.json +8 -7
  190. package/tokens/src/core/components/Tabs.json +5 -5
  191. package/tokens/src/core/components/Toast.json +11 -8
  192. package/tokens/src/core/components/Tooltip.json +13 -11
  193. package/tokens/src/core/components/general/caret.json +5 -3
  194. package/tokens/src/core/components/general/headings.json +5 -4
  195. package/tokens/src/core/components/general/hr.json +3 -2
  196. package/tokens/src/core/components/general/input.json +19 -19
  197. package/tokens/src/core/components/general/link.json +13 -12
  198. package/tokens/src/core/components/general/list.json +9 -6
  199. package/tokens/src/core/components/general/text.json +6 -12
  200. package/tokens/src/core/global/breakpoints.json +25 -6
  201. package/tokens/src/core/global/elevation.json +55 -13
  202. package/tokens/src/core/global/other.json +5 -1
  203. package/tokens/src/core/global/spacing.json +70 -17
  204. package/tokens/src/core/global/transition.json +41 -4
  205. package/tokens/src/core/global/typography.json +248 -53
  206. package/tokens/src/core/utilities/color.json +35 -4
  207. package/tokens/src/themes/light/alias/color.json +276 -75
  208. package/tokens/src/themes/light/components/Alert.json +15 -26
  209. package/tokens/src/themes/light/components/Annotation.json +27 -13
  210. package/tokens/src/themes/light/components/Avatar.json +2 -1
  211. package/tokens/src/themes/light/components/Badge.json +57 -122
  212. package/tokens/src/themes/light/components/Breadcrumb.json +6 -5
  213. package/tokens/src/themes/light/components/Bubble.json +9 -8
  214. package/tokens/src/themes/light/components/Button/brand.json +171 -119
  215. package/tokens/src/themes/light/components/Button/core.json +8 -9
  216. package/tokens/src/themes/light/components/Button/danger.json +171 -112
  217. package/tokens/src/themes/light/components/Button/dark.json +188 -106
  218. package/tokens/src/themes/light/components/Button/info.json +186 -112
  219. package/tokens/src/themes/light/components/Button/light.json +186 -110
  220. package/tokens/src/themes/light/components/Button/primary.json +178 -116
  221. package/tokens/src/themes/light/components/Button/secondary.json +166 -132
  222. package/tokens/src/themes/light/components/Button/success.json +176 -117
  223. package/tokens/src/themes/light/components/Button/tertiary.json +34 -60
  224. package/tokens/src/themes/light/components/Button/warning.json +164 -128
  225. package/tokens/src/themes/light/components/Card.json +10 -21
  226. package/tokens/src/themes/light/components/Carousel.json +12 -11
  227. package/tokens/src/themes/light/components/Chip.json +14 -26
  228. package/tokens/src/themes/light/components/CloseButton.json +12 -2
  229. package/tokens/src/themes/light/components/Code.json +7 -9
  230. package/tokens/src/themes/light/components/DataTable.json +7 -11
  231. package/tokens/src/themes/light/components/Dropdown.json +17 -20
  232. package/tokens/src/themes/light/components/Dropzone.json +49 -11
  233. package/tokens/src/themes/light/components/Form/color.json +101 -155
  234. package/tokens/src/themes/light/components/Form/elevation.json +38 -42
  235. package/tokens/src/themes/light/components/Form/other.json +44 -41
  236. package/tokens/src/themes/light/components/IconButton.json +408 -256
  237. package/tokens/src/themes/light/components/Image.json +7 -4
  238. package/tokens/src/themes/light/components/Menu.json +12 -10
  239. package/tokens/src/themes/light/components/Modal.json +22 -12
  240. package/tokens/src/themes/light/components/Nav.json +82 -94
  241. package/tokens/src/themes/light/components/Navbar.json +32 -76
  242. package/tokens/src/themes/light/components/OverflowScroll.json +3 -1
  243. package/tokens/src/themes/light/components/PageBanner.json +11 -10
  244. package/tokens/src/themes/light/components/Pagination.json +19 -23
  245. package/tokens/src/themes/light/components/Popover.json +22 -27
  246. package/tokens/src/themes/light/components/ProductTour.json +9 -20
  247. package/tokens/src/themes/light/components/ProgressBar.json +12 -10
  248. package/tokens/src/themes/light/components/Scrollable.json +3 -3
  249. package/tokens/src/themes/light/components/SearchField.json +9 -9
  250. package/tokens/src/themes/light/components/Sheet.json +6 -7
  251. package/tokens/src/themes/light/components/Stepper.json +12 -17
  252. package/tokens/src/themes/light/components/Sticky.json +31 -6
  253. package/tokens/src/themes/light/components/Tab.json +47 -24
  254. package/tokens/src/themes/light/components/Toast.json +26 -14
  255. package/tokens/src/themes/light/components/Tooltip.json +25 -10
  256. package/tokens/src/themes/light/components/general/body.json +3 -2
  257. package/tokens/src/themes/light/components/general/headings.json +2 -1
  258. package/tokens/src/themes/light/components/general/hr.json +3 -6
  259. package/tokens/src/themes/light/components/general/input.json +11 -4
  260. package/tokens/src/themes/light/components/general/link.json +34 -43
  261. package/tokens/src/themes/light/components/general/list.json +15 -19
  262. package/tokens/src/themes/light/components/general/text.json +5 -6
  263. package/tokens/src/themes/light/global/color.json +1592 -867
  264. package/tokens/src/themes/light/global/elevation.json +481 -93
  265. package/tokens/style-dictionary.js +342 -144
  266. package/tokens/utils.js +176 -6
  267. package/src/IconButton/__snapshots__/IconButton.test.jsx.snap +0 -20
  268. package/tokens/src/core/global/display.json +0 -22
  269. /package/src/Button/{ButtonGroup.test.jsx → ButtonGroup.test.tsx} +0 -0
  270. /package/src/Button/{ButtonToolbar.test.jsx → ButtonToolbar.test.tsx} +0 -0
  271. /package/src/Button/__snapshots__/{ButtonGroup.test.jsx.snap → ButtonGroup.test.tsx.snap} +0 -0
  272. /package/src/Button/__snapshots__/{ButtonToolbar.test.jsx.snap → ButtonToolbar.test.tsx.snap} +0 -0
  273. /package/src/Chip/__snapshots__/{Chip.test.jsx.snap → Chip.test.tsx.snap} +0 -0
  274. /package/src/Tooltip/{Tooltip.test.jsx → Tooltip.test.tsx} +0 -0
package/styles/css/themes/light/abstraction-variables.css ADDED
@@ -0,0 +1,304 @@
1
+ :root {
2
+ /**
3
+ * ELEVATION
4
+ */
5
+ --pgn-elevation-box-shadow-level-1:
6
+ var(--pgn-elevation-box-shadow-level-1-1-offset-x)
7
+ var(--pgn-elevation-box-shadow-level-1-1-offset-y)
8
+ var(--pgn-elevation-box-shadow-level-1-1-blur)
9
+ var(--pgn-elevation-box-shadow-level-1-1-color),
10
+ var(--pgn-elevation-box-shadow-level-1-2-offset-x)
11
+ var(--pgn-elevation-box-shadow-level-1-2-offset-y)
12
+ var(--pgn-elevation-box-shadow-level-1-2-blur)
13
+ var(--pgn-elevation-box-shadow-level-1-2-color);
14
+
15
+ --pgn-elevation-box-shadow-level-2:
16
+ var(--pgn-elevation-box-shadow-level-2-1-offset-x)
17
+ var(--pgn-elevation-box-shadow-level-2-1-offset-y)
18
+ var(--pgn-elevation-box-shadow-level-2-1-blur)
19
+ var(--pgn-elevation-box-shadow-level-2-1-color),
20
+ var(--pgn-elevation-box-shadow-level-2-2-offset-x)
21
+ var(--pgn-elevation-box-shadow-level-2-2-offset-y)
22
+ var(--pgn-elevation-box-shadow-level-2-2-blur)
23
+ var(--pgn-elevation-box-shadow-level-2-2-color);
24
+
25
+ --pgn-elevation-box-shadow-level-3:
26
+ var(--pgn-elevation-box-shadow-level-3-1-offset-x)
27
+ var(--pgn-elevation-box-shadow-level-3-1-offset-y)
28
+ var(--pgn-elevation-box-shadow-level-3-1-blur)
29
+ var(--pgn-elevation-box-shadow-level-3-1-color),
30
+ var(--pgn-elevation-box-shadow-level-3-2-offset-x)
31
+ var(--pgn-elevation-box-shadow-level-3-2-offset-y)
32
+ var(--pgn-elevation-box-shadow-level-3-2-blur)
33
+ var(--pgn-elevation-box-shadow-level-3-2-color);
34
+
35
+ --pgn-elevation-box-shadow-level-4:
36
+ var(--pgn-elevation-box-shadow-level-4-1-offset-x)
37
+ var(--pgn-elevation-box-shadow-level-4-1-offset-y)
38
+ var(--pgn-elevation-box-shadow-level-4-1-blur)
39
+ var(--pgn-elevation-box-shadow-level-4-1-color),
40
+ var(--pgn-elevation-box-shadow-level-4-2-offset-x)
41
+ var(--pgn-elevation-box-shadow-level-4-2-offset-y)
42
+ var(--pgn-elevation-box-shadow-level-4-2-blur)
43
+ var(--pgn-elevation-box-shadow-level-4-2-color);
44
+
45
+ --pgn-elevation-box-shadow-level-5:
46
+ var(--pgn-elevation-box-shadow-level-5-1-offset-x)
47
+ var(--pgn-elevation-box-shadow-level-5-1-offset-y)
48
+ var(--pgn-elevation-box-shadow-level-5-1-blur)
49
+ var(--pgn-elevation-box-shadow-level-5-1-color),
50
+ var(--pgn-elevation-box-shadow-level-5-2-offset-x)
51
+ var(--pgn-elevation-box-shadow-level-5-2-offset-y)
52
+ var(--pgn-elevation-box-shadow-level-5-2-blur)
53
+ var(--pgn-elevation-box-shadow-level-5-2-color);
54
+
55
+ --pgn-elevation-box-shadow-down-1:
56
+ var(--pgn-elevation-box-shadow-down-1-1-offset-x)
57
+ var(--pgn-elevation-box-shadow-down-1-1-offset-y)
58
+ var(--pgn-elevation-box-shadow-down-1-1-blur)
59
+ var(--pgn-elevation-box-shadow-down-1-1-color),
60
+ var(--pgn-elevation-box-shadow-down-1-2-offset-x)
61
+ var(--pgn-elevation-box-shadow-down-1-2-offset-y)
62
+ var(--pgn-elevation-box-shadow-down-1-2-blur)
63
+ var(--pgn-elevation-box-shadow-down-1-2-color);
64
+
65
+ --pgn-elevation-box-shadow-down-2:
66
+ var(--pgn-elevation-box-shadow-down-2-1-offset-x)
67
+ var(--pgn-elevation-box-shadow-down-2-1-offset-y)
68
+ var(--pgn-elevation-box-shadow-down-2-1-blur)
69
+ var(--pgn-elevation-box-shadow-down-2-1-color),
70
+ var(--pgn-elevation-box-shadow-down-2-2-offset-x)
71
+ var(--pgn-elevation-box-shadow-down-2-2-offset-y)
72
+ var(--pgn-elevation-box-shadow-down-2-2-blur)
73
+ var(--pgn-elevation-box-shadow-down-2-2-color);
74
+
75
+ --pgn-elevation-box-shadow-down-3:
76
+ var(--pgn-elevation-box-shadow-down-3-1-offset-x)
77
+ var(--pgn-elevation-box-shadow-down-3-1-offset-y)
78
+ var(--pgn-elevation-box-shadow-down-3-1-blur)
79
+ var(--pgn-elevation-box-shadow-down-3-1-color),
80
+ var(--pgn-elevation-box-shadow-down-3-2-offset-x)
81
+ var(--pgn-elevation-box-shadow-down-3-2-offset-y)
82
+ var(--pgn-elevation-box-shadow-down-3-2-blur)
83
+ var(--pgn-elevation-box-shadow-down-3-2-color);
84
+
85
+ --pgn-elevation-box-shadow-down-4:
86
+ var(--pgn-elevation-box-shadow-down-4-1-offset-x)
87
+ var(--pgn-elevation-box-shadow-down-4-1-offset-y)
88
+ var(--pgn-elevation-box-shadow-down-4-1-blur)
89
+ var(--pgn-elevation-box-shadow-down-4-1-color),
90
+ var(--pgn-elevation-box-shadow-down-4-2-offset-x)
91
+ var(--pgn-elevation-box-shadow-down-4-2-offset-y)
92
+ var(--pgn-elevation-box-shadow-down-4-2-blur)
93
+ var(--pgn-elevation-box-shadow-down-4-2-color);
94
+
95
+ --pgn-elevation-box-shadow-down-5:
96
+ var(--pgn-elevation-box-shadow-down-5-1-offset-x)
97
+ var(--pgn-elevation-box-shadow-down-5-1-offset-y)
98
+ var(--pgn-elevation-box-shadow-down-5-1-blur)
99
+ var(--pgn-elevation-box-shadow-down-5-1-color),
100
+ var(--pgn-elevation-box-shadow-down-5-2-offset-x)
101
+ var(--pgn-elevation-box-shadow-down-5-2-offset-y)
102
+ var(--pgn-elevation-box-shadow-down-5-2-blur)
103
+ var(--pgn-elevation-box-shadow-down-5-2-color);
104
+
105
+ --pgn-elevation-box-shadow-left-1:
106
+ var(--pgn-elevation-box-shadow-left-1-1-offset-x)
107
+ var(--pgn-elevation-box-shadow-left-1-1-offset-y)
108
+ var(--pgn-elevation-box-shadow-left-1-1-blur)
109
+ var(--pgn-elevation-box-shadow-left-1-1-color),
110
+ var(--pgn-elevation-box-shadow-left-1-2-offset-x)
111
+ var(--pgn-elevation-box-shadow-left-1-2-offset-y)
112
+ var(--pgn-elevation-box-shadow-left-1-2-blur)
113
+ var(--pgn-elevation-box-shadow-left-1-2-color);
114
+
115
+ --pgn-elevation-box-shadow-left-2:
116
+ var(--pgn-elevation-box-shadow-left-2-1-offset-x)
117
+ var(--pgn-elevation-box-shadow-left-2-1-offset-y)
118
+ var(--pgn-elevation-box-shadow-left-2-1-blur)
119
+ var(--pgn-elevation-box-shadow-left-2-1-color),
120
+ var(--pgn-elevation-box-shadow-left-2-2-offset-x)
121
+ var(--pgn-elevation-box-shadow-left-2-2-offset-y)
122
+ var(--pgn-elevation-box-shadow-left-2-2-blur)
123
+ var(--pgn-elevation-box-shadow-left-2-2-color);
124
+
125
+ --pgn-elevation-box-shadow-left-3:
126
+ var(--pgn-elevation-box-shadow-left-3-1-offset-x)
127
+ var(--pgn-elevation-box-shadow-left-3-1-offset-y)
128
+ var(--pgn-elevation-box-shadow-left-3-1-blur)
129
+ var(--pgn-elevation-box-shadow-left-3-1-color),
130
+ var(--pgn-elevation-box-shadow-left-3-2-offset-x)
131
+ var(--pgn-elevation-box-shadow-left-3-2-offset-y)
132
+ var(--pgn-elevation-box-shadow-left-3-2-blur)
133
+ var(--pgn-elevation-box-shadow-left-3-2-color);
134
+
135
+ --pgn-elevation-box-shadow-left-4:
136
+ var(--pgn-elevation-box-shadow-left-4-1-offset-x)
137
+ var(--pgn-elevation-box-shadow-left-4-1-offset-y)
138
+ var(--pgn-elevation-box-shadow-left-4-1-blur)
139
+ var(--pgn-elevation-box-shadow-left-4-1-color),
140
+ var(--pgn-elevation-box-shadow-left-4-2-offset-x)
141
+ var(--pgn-elevation-box-shadow-left-4-2-offset-y)
142
+ var(--pgn-elevation-box-shadow-left-4-2-blur)
143
+ var(--pgn-elevation-box-shadow-left-4-2-color);
144
+
145
+ --pgn-elevation-box-shadow-left-5:
146
+ var(--pgn-elevation-box-shadow-left-5-1-offset-x)
147
+ var(--pgn-elevation-box-shadow-left-5-1-offset-y)
148
+ var(--pgn-elevation-box-shadow-left-5-1-blur)
149
+ var(--pgn-elevation-box-shadow-left-5-1-color),
150
+ var(--pgn-elevation-box-shadow-left-5-2-offset-x)
151
+ var(--pgn-elevation-box-shadow-left-5-2-offset-y)
152
+ var(--pgn-elevation-box-shadow-left-5-2-blur)
153
+ var(--pgn-elevation-box-shadow-left-5-2-color);
154
+
155
+ --pgn-elevation-box-shadow-up-1:
156
+ var(--pgn-elevation-box-shadow-up-1-1-offset-x)
157
+ var(--pgn-elevation-box-shadow-up-1-1-offset-y)
158
+ var(--pgn-elevation-box-shadow-up-1-1-blur)
159
+ var(--pgn-elevation-box-shadow-up-1-1-color),
160
+ var(--pgn-elevation-box-shadow-up-1-2-offset-x)
161
+ var(--pgn-elevation-box-shadow-up-1-2-offset-y)
162
+ var(--pgn-elevation-box-shadow-up-1-2-blur)
163
+ var(--pgn-elevation-box-shadow-up-1-2-color);
164
+
165
+ --pgn-elevation-box-shadow-up-2:
166
+ var(--pgn-elevation-box-shadow-up-2-1-offset-x)
167
+ var(--pgn-elevation-box-shadow-up-2-1-offset-y)
168
+ var(--pgn-elevation-box-shadow-up-2-1-blur)
169
+ var(--pgn-elevation-box-shadow-up-2-1-color),
170
+ var(--pgn-elevation-box-shadow-up-2-2-offset-x)
171
+ var(--pgn-elevation-box-shadow-up-2-2-offset-y)
172
+ var(--pgn-elevation-box-shadow-up-2-2-blur)
173
+ var(--pgn-elevation-box-shadow-up-2-2-color);
174
+
175
+ --pgn-elevation-box-shadow-up-3:
176
+ var(--pgn-elevation-box-shadow-up-3-1-offset-x)
177
+ var(--pgn-elevation-box-shadow-up-3-1-offset-y)
178
+ var(--pgn-elevation-box-shadow-up-3-1-blur)
179
+ var(--pgn-elevation-box-shadow-up-3-1-color),
180
+ var(--pgn-elevation-box-shadow-up-3-2-offset-x)
181
+ var(--pgn-elevation-box-shadow-up-3-2-offset-y)
182
+ var(--pgn-elevation-box-shadow-up-3-2-blur)
183
+ var(--pgn-elevation-box-shadow-up-3-2-color);
184
+
185
+ --pgn-elevation-box-shadow-up-4:
186
+ var(--pgn-elevation-box-shadow-up-3-1-offset-x)
187
+ var(--pgn-elevation-box-shadow-up-3-1-offset-y)
188
+ var(--pgn-elevation-box-shadow-up-3-1-blur)
189
+ var(--pgn-elevation-box-shadow-up-3-1-color),
190
+ var(--pgn-elevation-box-shadow-up-3-2-offset-x)
191
+ var(--pgn-elevation-box-shadow-up-3-2-offset-y)
192
+ var(--pgn-elevation-box-shadow-up-3-2-blur)
193
+ var(--pgn-elevation-box-shadow-up-3-2-color);
194
+
195
+ --pgn-elevation-box-shadow-up-5:
196
+ var(--pgn-elevation-box-shadow-up-5-1-offset-x)
197
+ var(--pgn-elevation-box-shadow-up-5-1-offset-y)
198
+ var(--pgn-elevation-box-shadow-up-5-1-blur)
199
+ var(--pgn-elevation-box-shadow-up-5-1-color),
200
+ var(--pgn-elevation-box-shadow-up-5-2-offset-x)
201
+ var(--pgn-elevation-box-shadow-up-5-2-offset-y)
202
+ var(--pgn-elevation-box-shadow-up-5-2-blur)
203
+ var(--pgn-elevation-box-shadow-up-5-2-color);
204
+
205
+ --pgn-elevation-box-shadow-right-1:
206
+ var(--pgn-elevation-box-shadow-right-1-1-offset-x)
207
+ var(--pgn-elevation-box-shadow-right-1-1-offset-y)
208
+ var(--pgn-elevation-box-shadow-right-1-1-blur)
209
+ var(--pgn-elevation-box-shadow-right-1-1-color),
210
+ var(--pgn-elevation-box-shadow-right-1-2-offset-x)
211
+ var(--pgn-elevation-box-shadow-right-1-2-offset-y)
212
+ var(--pgn-elevation-box-shadow-right-1-2-blur)
213
+ var(--pgn-elevation-box-shadow-right-1-2-color);
214
+
215
+ --pgn-elevation-box-shadow-right-2:
216
+ var(--pgn-elevation-box-shadow-right-2-1-offset-x)
217
+ var(--pgn-elevation-box-shadow-right-2-1-offset-y)
218
+ var(--pgn-elevation-box-shadow-right-2-1-blur)
219
+ var(--pgn-elevation-box-shadow-right-2-1-color),
220
+ var(--pgn-elevation-box-shadow-right-2-2-offset-x)
221
+ var(--pgn-elevation-box-shadow-right-2-2-offset-y)
222
+ var(--pgn-elevation-box-shadow-right-2-2-blur)
223
+ var(--pgn-elevation-box-shadow-right-2-2-color);
224
+
225
+ --pgn-elevation-box-shadow-right-3:
226
+ var(--pgn-elevation-box-shadow-right-3-1-offset-x)
227
+ var(--pgn-elevation-box-shadow-right-3-1-offset-y)
228
+ var(--pgn-elevation-box-shadow-right-3-1-blur)
229
+ var(--pgn-elevation-box-shadow-right-3-1-color),
230
+ var(--pgn-elevation-box-shadow-right-3-2-offset-x)
231
+ var(--pgn-elevation-box-shadow-right-3-2-offset-y)
232
+ var(--pgn-elevation-box-shadow-right-3-2-blur)
233
+ var(--pgn-elevation-box-shadow-right-3-2-color);
234
+
235
+ --pgn-elevation-box-shadow-right-4:
236
+ var(--pgn-elevation-box-shadow-right-4-1-offset-x)
237
+ var(--pgn-elevation-box-shadow-right-4-1-offset-y)
238
+ var(--pgn-elevation-box-shadow-right-4-1-blur)
239
+ var(--pgn-elevation-box-shadow-right-4-1-color),
240
+ var(--pgn-elevation-box-shadow-right-4-2-offset-x)
241
+ var(--pgn-elevation-box-shadow-right-4-2-offset-y)
242
+ var(--pgn-elevation-box-shadow-right-4-2-blur)
243
+ var(--pgn-elevation-box-shadow-right-4-2-color);
244
+
245
+ --pgn-elevation-box-shadow-right-5:
246
+ var(--pgn-elevation-box-shadow-right-5-1-offset-x)
247
+ var(--pgn-elevation-box-shadow-right-5-1-offset-y)
248
+ var(--pgn-elevation-box-shadow-right-5-1-blur)
249
+ var(--pgn-elevation-box-shadow-right-5-1-color),
250
+ var(--pgn-elevation-box-shadow-right-5-2-offset-x)
251
+ var(--pgn-elevation-box-shadow-right-5-2-offset-y)
252
+ var(--pgn-elevation-box-shadow-right-5-2-blur)
253
+ var(--pgn-elevation-box-shadow-right-5-2-color);
254
+
255
+ --pgn-elevation-box-shadow-centered-1:
256
+ var(--pgn-elevation-box-shadow-centered-1-1-offset-x)
257
+ var(--pgn-elevation-box-shadow-centered-1-1-offset-y)
258
+ var(--pgn-elevation-box-shadow-centered-1-1-blur)
259
+ var(--pgn-elevation-box-shadow-centered-1-1-color),
260
+ var(--pgn-elevation-box-shadow-centered-1-2-offset-x)
261
+ var(--pgn-elevation-box-shadow-centered-1-2-offset-y)
262
+ var(--pgn-elevation-box-shadow-centered-1-2-blur)
263
+ var(--pgn-elevation-box-shadow-centered-1-2-color);
264
+
265
+ --pgn-elevation-box-shadow-centered-2:
266
+ var(--pgn-elevation-box-shadow-centered-2-1-offset-x)
267
+ var(--pgn-elevation-box-shadow-centered-2-1-offset-y)
268
+ var(--pgn-elevation-box-shadow-centered-2-1-blur)
269
+ var(--pgn-elevation-box-shadow-centered-2-1-color),
270
+ var(--pgn-elevation-box-shadow-centered-2-2-offset-x)
271
+ var(--pgn-elevation-box-shadow-centered-2-2-offset-y)
272
+ var(--pgn-elevation-box-shadow-centered-2-2-blur)
273
+ var(--pgn-elevation-box-shadow-centered-2-2-color);
274
+
275
+ --pgn-elevation-box-shadow-centered-3:
276
+ var(--pgn-elevation-box-shadow-centered-3-1-offset-x)
277
+ var(--pgn-elevation-box-shadow-centered-3-1-offset-y)
278
+ var(--pgn-elevation-box-shadow-centered-3-1-blur)
279
+ var(--pgn-elevation-box-shadow-centered-3-1-color),
280
+ var(--pgn-elevation-box-shadow-centered-3-2-offset-x)
281
+ var(--pgn-elevation-box-shadow-centered-3-2-offset-y)
282
+ var(--pgn-elevation-box-shadow-centered-3-2-blur)
283
+ var(--pgn-elevation-box-shadow-centered-3-2-color);
284
+
285
+ --pgn-elevation-box-shadow-centered-4:
286
+ var(--pgn-elevation-box-shadow-centered-4-1-offset-x)
287
+ var(--pgn-elevation-box-shadow-centered-4-1-offset-y)
288
+ var(--pgn-elevation-box-shadow-centered-4-1-blur)
289
+ var(--pgn-elevation-box-shadow-centered-4-1-color),
290
+ var(--pgn-elevation-box-shadow-centered-4-2-offset-x)
291
+ var(--pgn-elevation-box-shadow-centered-4-2-offset-y)
292
+ var(--pgn-elevation-box-shadow-centered-4-2-blur)
293
+ var(--pgn-elevation-box-shadow-centered-4-2-color);
294
+
295
+ --pgn-elevation-box-shadow-centered-5:
296
+ var(--pgn-elevation-box-shadow-centered-5-1-offset-x)
297
+ var(--pgn-elevation-box-shadow-centered-5-1-offset-y)
298
+ var(--pgn-elevation-box-shadow-centered-5-1-blur)
299
+ var(--pgn-elevation-box-shadow-centered-5-1-color),
300
+ var(--pgn-elevation-box-shadow-centered-5-2-offset-x)
301
+ var(--pgn-elevation-box-shadow-centered-5-2-offset-y)
302
+ var(--pgn-elevation-box-shadow-centered-5-2-blur)
303
+ var(--pgn-elevation-box-shadow-centered-5-2-color);
304
+ }
package/styles/css/themes/light/index.css CHANGED
@@ -1,2 +1,3 @@
1
1
  @import "variables.css";
2
+ @import "abstraction-variables.css";
2
3
  @import "utility-classes.css";
package/styles/css/themes/light/utility-classes.css CHANGED
@@ -1,7 +1,6 @@
1
1
  /**
2
- * IMPORTANT: This file is the result of assembling design tokens
3
- * Do not edit directly
4
- * Generated on Fri, 22 Sep 2023 08:20:17 GMT
2
+ * Do not edit directly, this file was auto-generated. while transforming design tokens.
3
+ * See <root>/tokens/README.md for more details.
5
4
  */
6
5
 
7
6
  .bg-accent-a {