@openedx/paragon 23.0.0-alpha.3 → 23.0.0-alpha.5

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 (258) hide show
  1. package/bin/paragon-scripts.js +10 -0
  2. package/dist/Annotation/index.scss +16 -0
  3. package/dist/Card/CardDeck.js +0 -2
  4. package/dist/Card/CardDeck.js.map +1 -1
  5. package/dist/Card/index.scss +8 -6
  6. package/dist/Carousel/index.scss +24 -1
  7. package/dist/Chip/ChipIcon.d.ts +1 -1
  8. package/dist/CloseButton/index.scss +8 -0
  9. package/dist/ColorPicker/index.scss +1 -1
  10. package/dist/Container/index.d.ts +16 -0
  11. package/dist/Container/index.js +15 -13
  12. package/dist/Container/index.js.map +1 -1
  13. package/dist/DataTable/index.scss +12 -0
  14. package/dist/Dropdown/dropdown-bootstrap.scss +6 -0
  15. package/dist/Dropzone/index.scss +34 -0
  16. package/dist/Form/_FormText.scss +1 -1
  17. package/dist/Form/_bootstrap-custom-forms.scss +40 -0
  18. package/dist/Form/_index.scss +9 -0
  19. package/dist/Form/_mixins.scss +22 -0
  20. package/dist/IconButton/index.d.ts +1 -1
  21. package/dist/IconButton/index.js +1 -1
  22. package/dist/IconButton/index.js.map +1 -1
  23. package/dist/IconButton/index.scss +146 -0
  24. package/dist/Menu/SelectMenu.js +9 -4
  25. package/dist/Menu/SelectMenu.js.map +1 -1
  26. package/dist/Menu/index.scss +8 -0
  27. package/dist/Modal/ModalContext.d.ts +15 -0
  28. package/dist/Modal/ModalContext.js +7 -14
  29. package/dist/Modal/ModalContext.js.map +1 -1
  30. package/dist/Modal/ModalDialog.d.ts +110 -0
  31. package/dist/Modal/ModalDialog.js +30 -24
  32. package/dist/Modal/ModalDialog.js.map +1 -1
  33. package/dist/Modal/ModalDialogHeader.d.ts +10 -0
  34. package/dist/Modal/ModalDialogHeader.js +6 -7
  35. package/dist/Modal/ModalDialogHeader.js.map +1 -1
  36. package/dist/Modal/ModalLayer.d.ts +53 -0
  37. package/dist/Modal/ModalLayer.js +5 -14
  38. package/dist/Modal/ModalLayer.js.map +1 -1
  39. package/dist/Modal/Portal.d.ts +11 -0
  40. package/dist/Modal/Portal.js +5 -6
  41. package/dist/Modal/Portal.js.map +1 -1
  42. package/dist/Modal/_ModalDialog.scss +22 -2
  43. package/dist/Nav/index.scss +8 -0
  44. package/dist/Overlay/index.d.ts +2 -2
  45. package/dist/PageBanner/index.scss +2 -2
  46. package/dist/Pagination/pagination-bootstrap.scss +9 -0
  47. package/dist/Popover/index.scss +1 -1
  48. package/dist/ProductTour/Checkpoint.scss +1 -1
  49. package/dist/ProgressBar/bootstrap-progress.scss +20 -5
  50. package/dist/ProgressBar/index.scss +3 -3
  51. package/dist/Stepper/index.scss +1 -1
  52. package/dist/Sticky/index.scss +12 -0
  53. package/dist/Toast/index.scss +13 -1
  54. package/dist/Tooltip/index.scss +16 -0
  55. package/dist/core.css +913 -470
  56. package/dist/core.css.map +1 -1
  57. package/dist/core.min.css +1 -1
  58. package/dist/hooks/useArrowKeyNavigation.js +2 -3
  59. package/dist/hooks/useArrowKeyNavigation.js.map +1 -1
  60. package/dist/index.d.ts +19 -5
  61. package/dist/index.js +5 -5
  62. package/dist/light.css +2035 -1315
  63. package/dist/light.css.map +1 -1
  64. package/dist/light.min.css +1 -1
  65. package/icons/es5/Newsstand.js +15 -0
  66. package/icons/es5/index.js +1 -0
  67. package/icons/es5/index.ts +1 -0
  68. package/icons/jsx/Newsstand.jsx +17 -0
  69. package/icons/jsx/index.jsx +1 -0
  70. package/icons/svg/newsstand.svg +1 -0
  71. package/lib/build-tokens.js +67 -31
  72. package/package.json +8 -5
  73. package/src/Annotation/index.scss +16 -0
  74. package/src/Card/CardDeck.jsx +0 -3
  75. package/src/Card/README.md +0 -31
  76. package/src/Card/index.scss +8 -6
  77. package/src/Carousel/index.scss +24 -1
  78. package/src/CloseButton/index.scss +8 -0
  79. package/src/ColorPicker/index.scss +1 -1
  80. package/src/Container/{Container.test.jsx → Container.test.tsx} +14 -8
  81. package/src/Container/README.md +4 -0
  82. package/src/Container/index.tsx +64 -0
  83. package/src/DataTable/index.scss +12 -0
  84. package/src/DataTable/selection/tests/ControlledSelectHeader.test.jsx +7 -7
  85. package/src/Dropdown/dropdown-bootstrap.scss +6 -0
  86. package/src/Dropzone/index.scss +34 -0
  87. package/src/Form/_FormText.scss +1 -1
  88. package/src/Form/_bootstrap-custom-forms.scss +40 -0
  89. package/src/Form/_index.scss +9 -0
  90. package/src/Form/_mixins.scss +22 -0
  91. package/src/IconButton/index.scss +146 -0
  92. package/src/IconButton/index.tsx +1 -1
  93. package/src/Menu/SelectMenu.jsx +5 -0
  94. package/src/Menu/SelectMenu.test.jsx +6 -0
  95. package/src/Menu/index.scss +8 -0
  96. package/src/Menu/select-menu.md +8 -0
  97. package/src/Modal/{ModalContext.jsx → ModalContext.tsx} +19 -16
  98. package/src/Modal/{ModalDialog.jsx → ModalDialog.tsx} +57 -26
  99. package/src/Modal/{ModalDialogHeader.jsx → ModalDialogHeader.tsx} +17 -11
  100. package/src/Modal/{ModalLayer.jsx → ModalLayer.tsx} +17 -17
  101. package/src/Modal/{Portal.jsx → Portal.tsx} +10 -7
  102. package/src/Modal/_ModalDialog.scss +22 -2
  103. package/src/Modal/modal-dialog.mdx +95 -6
  104. package/src/Modal/tests/{ModalDialog.test.jsx → ModalDialog.test.tsx} +18 -10
  105. package/src/Modal/tests/{ModalLayer.test.jsx → ModalLayer.test.tsx} +5 -5
  106. package/src/Modal/tests/{Portal.test.jsx → Portal.test.tsx} +3 -3
  107. package/src/Nav/index.scss +8 -0
  108. package/src/PageBanner/index.scss +2 -2
  109. package/src/Pagination/pagination-bootstrap.scss +9 -0
  110. package/src/Popover/index.scss +1 -1
  111. package/src/ProductTour/Checkpoint.scss +1 -1
  112. package/src/ProgressBar/bootstrap-progress.scss +20 -5
  113. package/src/ProgressBar/index.scss +3 -3
  114. package/src/Stepper/index.scss +1 -1
  115. package/src/Sticky/index.scss +12 -0
  116. package/src/Toast/index.scss +13 -1
  117. package/src/Tooltip/index.scss +16 -0
  118. package/src/hooks/useArrowKeyNavigation.jsx +1 -2
  119. package/src/index.d.ts +19 -5
  120. package/src/index.js +5 -5
  121. package/styles/css/core/abstraction-variables.css +44 -0
  122. package/styles/css/core/custom-media-breakpoints.css +3 -4
  123. package/styles/css/core/index.css +2 -1
  124. package/styles/css/core/variables.css +494 -430
  125. package/styles/css/themes/light/abstraction-variables.css +304 -0
  126. package/styles/css/themes/light/index.css +1 -0
  127. package/styles/css/themes/light/utility-classes.css +2 -3
  128. package/styles/css/themes/light/variables.css +1753 -1334
  129. package/styles/scss/core/_typography.scss +16 -4
  130. package/styles/scss/core/_utilities.scss +7 -3
  131. package/styles/scss/core/_variables.scss +43 -30
  132. package/styles/scss/core/core.scss +1 -0
  133. package/tokens/src/core/alias/size.json +6 -5
  134. package/tokens/src/core/components/ActionRow.json +3 -2
  135. package/tokens/src/core/components/Alert.json +12 -10
  136. package/tokens/src/core/components/Annotation.json +9 -7
  137. package/tokens/src/core/components/Avatar.json +9 -9
  138. package/tokens/src/core/components/AvatarButton.json +4 -3
  139. package/tokens/src/core/components/Badge.json +12 -9
  140. package/tokens/src/core/components/Breadcrumb.json +7 -5
  141. package/tokens/src/core/components/Bubble.json +4 -3
  142. package/tokens/src/core/components/Button/core.json +35 -59
  143. package/tokens/src/core/components/Card.json +33 -44
  144. package/tokens/src/core/components/Carousel.json +39 -13
  145. package/tokens/src/core/components/Chip.json +13 -21
  146. package/tokens/src/core/components/ChipCarousel.json +4 -5
  147. package/tokens/src/core/components/CloseButton.json +2 -6
  148. package/tokens/src/core/components/Code.json +9 -8
  149. package/tokens/src/core/components/Collapsible.json +10 -13
  150. package/tokens/src/core/components/ColorPicker.json +3 -2
  151. package/tokens/src/core/components/Container.json +6 -5
  152. package/tokens/src/core/components/DataTable.json +17 -9
  153. package/tokens/src/core/components/Dropdown.json +24 -29
  154. package/tokens/src/core/components/Dropzone.json +5 -7
  155. package/tokens/src/core/components/Form/other.json +5 -4
  156. package/tokens/src/core/components/Form/size.json +72 -119
  157. package/tokens/src/core/components/Form/spacing.json +39 -83
  158. package/tokens/src/core/components/Form/transition.json +43 -7
  159. package/tokens/src/core/components/Form/typography.json +24 -88
  160. package/tokens/src/core/components/Icon.json +6 -5
  161. package/tokens/src/core/components/IconButton.json +4 -7
  162. package/tokens/src/core/components/Image.json +7 -6
  163. package/tokens/src/core/components/Menu.json +14 -12
  164. package/tokens/src/core/components/Modal.json +26 -21
  165. package/tokens/src/core/components/Nav.json +14 -16
  166. package/tokens/src/core/components/Navbar.json +15 -30
  167. package/tokens/src/core/components/Pagination.json +23 -24
  168. package/tokens/src/core/components/Popover.json +18 -14
  169. package/tokens/src/core/components/ProductTour.json +8 -14
  170. package/tokens/src/core/components/ProgressBar.json +29 -14
  171. package/tokens/src/core/components/SearchField.json +7 -9
  172. package/tokens/src/core/components/SelectableBox.json +4 -3
  173. package/tokens/src/core/components/Sheet.json +3 -2
  174. package/tokens/src/core/components/Spinner.json +9 -7
  175. package/tokens/src/core/components/Stack.json +2 -1
  176. package/tokens/src/core/components/Stepper.json +12 -14
  177. package/tokens/src/core/components/Sticky.json +2 -1
  178. package/tokens/src/core/components/Tab.json +8 -7
  179. package/tokens/src/core/components/Tabs.json +5 -5
  180. package/tokens/src/core/components/Toast.json +11 -8
  181. package/tokens/src/core/components/Tooltip.json +13 -11
  182. package/tokens/src/core/components/general/caret.json +5 -3
  183. package/tokens/src/core/components/general/headings.json +5 -4
  184. package/tokens/src/core/components/general/hr.json +3 -2
  185. package/tokens/src/core/components/general/input.json +19 -19
  186. package/tokens/src/core/components/general/link.json +13 -12
  187. package/tokens/src/core/components/general/list.json +9 -6
  188. package/tokens/src/core/components/general/text.json +6 -12
  189. package/tokens/src/core/global/breakpoints.json +25 -6
  190. package/tokens/src/core/global/elevation.json +55 -13
  191. package/tokens/src/core/global/other.json +5 -1
  192. package/tokens/src/core/global/spacing.json +70 -17
  193. package/tokens/src/core/global/transition.json +41 -4
  194. package/tokens/src/core/global/typography.json +248 -53
  195. package/tokens/src/core/utilities/color.json +35 -4
  196. package/tokens/src/themes/light/alias/color.json +276 -75
  197. package/tokens/src/themes/light/components/Alert.json +15 -26
  198. package/tokens/src/themes/light/components/Annotation.json +27 -13
  199. package/tokens/src/themes/light/components/Avatar.json +2 -1
  200. package/tokens/src/themes/light/components/Badge.json +57 -122
  201. package/tokens/src/themes/light/components/Breadcrumb.json +6 -5
  202. package/tokens/src/themes/light/components/Bubble.json +9 -8
  203. package/tokens/src/themes/light/components/Button/brand.json +171 -119
  204. package/tokens/src/themes/light/components/Button/core.json +8 -9
  205. package/tokens/src/themes/light/components/Button/danger.json +171 -112
  206. package/tokens/src/themes/light/components/Button/dark.json +188 -106
  207. package/tokens/src/themes/light/components/Button/info.json +186 -112
  208. package/tokens/src/themes/light/components/Button/light.json +186 -110
  209. package/tokens/src/themes/light/components/Button/primary.json +178 -116
  210. package/tokens/src/themes/light/components/Button/secondary.json +166 -132
  211. package/tokens/src/themes/light/components/Button/success.json +176 -117
  212. package/tokens/src/themes/light/components/Button/tertiary.json +34 -60
  213. package/tokens/src/themes/light/components/Button/warning.json +164 -128
  214. package/tokens/src/themes/light/components/Card.json +10 -21
  215. package/tokens/src/themes/light/components/Carousel.json +12 -11
  216. package/tokens/src/themes/light/components/Chip.json +14 -26
  217. package/tokens/src/themes/light/components/CloseButton.json +12 -2
  218. package/tokens/src/themes/light/components/Code.json +7 -9
  219. package/tokens/src/themes/light/components/DataTable.json +7 -11
  220. package/tokens/src/themes/light/components/Dropdown.json +17 -20
  221. package/tokens/src/themes/light/components/Dropzone.json +49 -11
  222. package/tokens/src/themes/light/components/Form/color.json +101 -155
  223. package/tokens/src/themes/light/components/Form/elevation.json +38 -42
  224. package/tokens/src/themes/light/components/Form/other.json +44 -41
  225. package/tokens/src/themes/light/components/IconButton.json +408 -256
  226. package/tokens/src/themes/light/components/Image.json +7 -4
  227. package/tokens/src/themes/light/components/Menu.json +12 -10
  228. package/tokens/src/themes/light/components/Modal.json +22 -12
  229. package/tokens/src/themes/light/components/Nav.json +82 -94
  230. package/tokens/src/themes/light/components/Navbar.json +32 -76
  231. package/tokens/src/themes/light/components/OverflowScroll.json +3 -1
  232. package/tokens/src/themes/light/components/PageBanner.json +11 -10
  233. package/tokens/src/themes/light/components/Pagination.json +19 -23
  234. package/tokens/src/themes/light/components/Popover.json +22 -27
  235. package/tokens/src/themes/light/components/ProductTour.json +9 -20
  236. package/tokens/src/themes/light/components/ProgressBar.json +12 -10
  237. package/tokens/src/themes/light/components/Scrollable.json +3 -3
  238. package/tokens/src/themes/light/components/SearchField.json +9 -9
  239. package/tokens/src/themes/light/components/Sheet.json +6 -7
  240. package/tokens/src/themes/light/components/Stepper.json +12 -17
  241. package/tokens/src/themes/light/components/Sticky.json +31 -6
  242. package/tokens/src/themes/light/components/Tab.json +47 -24
  243. package/tokens/src/themes/light/components/Toast.json +26 -14
  244. package/tokens/src/themes/light/components/Tooltip.json +25 -10
  245. package/tokens/src/themes/light/components/general/body.json +3 -2
  246. package/tokens/src/themes/light/components/general/headings.json +2 -1
  247. package/tokens/src/themes/light/components/general/hr.json +3 -6
  248. package/tokens/src/themes/light/components/general/input.json +11 -4
  249. package/tokens/src/themes/light/components/general/link.json +34 -43
  250. package/tokens/src/themes/light/components/general/list.json +15 -19
  251. package/tokens/src/themes/light/components/general/text.json +5 -6
  252. package/tokens/src/themes/light/global/color.json +1592 -867
  253. package/tokens/src/themes/light/global/elevation.json +481 -93
  254. package/tokens/style-dictionary.js +342 -144
  255. package/tokens/utils.js +176 -6
  256. package/src/Container/index.jsx +0 -49
  257. package/tokens/src/core/global/display.json +0 -22
  258. /package/src/Truncate/{Truncate.test.js → utils.test.js} +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 {