@pega/cosmos-react-demos 3.0.0-dev.2.0 → 3.0.0-dev.4.1

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 (325) hide show
  1. package/jsx/build/DynamicContentEditor/DynamicContentEditor.stories.d.ts +9 -0
  2. package/jsx/build/DynamicContentEditor/DynamicContentEditor.stories.d.ts.map +1 -0
  3. package/jsx/build/DynamicContentEditor/DynamicContentEditor.stories.jsx +79 -0
  4. package/jsx/build/DynamicContentEditor/DynamicContentEditor.stories.jsx.map +1 -0
  5. package/jsx/build/DynamicContentEditor/FieldSelector.d.ts +11 -0
  6. package/jsx/build/DynamicContentEditor/FieldSelector.d.ts.map +1 -0
  7. package/jsx/build/DynamicContentEditor/FieldSelector.jsx +80 -0
  8. package/jsx/build/DynamicContentEditor/FieldSelector.jsx.map +1 -0
  9. package/jsx/build/ObjectSelect/ObjectSelect.mocks.d.ts +16 -0
  10. package/jsx/build/ObjectSelect/ObjectSelect.mocks.d.ts.map +1 -0
  11. package/jsx/build/ObjectSelect/ObjectSelect.mocks.js +136 -0
  12. package/jsx/build/ObjectSelect/ObjectSelect.mocks.js.map +1 -0
  13. package/jsx/build/ObjectSelect/ObjectSelect.stories.d.ts +14 -0
  14. package/jsx/build/ObjectSelect/ObjectSelect.stories.d.ts.map +1 -0
  15. package/jsx/build/ObjectSelect/ObjectSelect.stories.jsx +312 -0
  16. package/jsx/build/ObjectSelect/ObjectSelect.stories.jsx.map +1 -0
  17. package/jsx/build/ObjectSelect/ObjectSelect.styles.d.ts +4 -0
  18. package/jsx/build/ObjectSelect/ObjectSelect.styles.d.ts.map +1 -0
  19. package/jsx/build/ObjectSelect/ObjectSelect.styles.js +27 -0
  20. package/jsx/build/ObjectSelect/ObjectSelect.styles.js.map +1 -0
  21. package/jsx/build/PageTemplates/PageTemplates.stories.d.ts.map +1 -1
  22. package/jsx/build/PageTemplates/PageTemplates.stories.jsx +4 -4
  23. package/jsx/build/PageTemplates/PageTemplates.stories.jsx.map +1 -1
  24. package/jsx/build/Workbench/Workbench.stories.d.ts.map +1 -1
  25. package/jsx/build/Workbench/Workbench.stories.jsx +3 -6
  26. package/jsx/build/Workbench/Workbench.stories.jsx.map +1 -1
  27. package/jsx/core/AppShell/AppShell.stories.d.ts +1 -0
  28. package/jsx/core/AppShell/AppShell.stories.d.ts.map +1 -1
  29. package/jsx/core/AppShell/AppShell.stories.jsx +4 -2
  30. package/jsx/core/AppShell/AppShell.stories.jsx.map +1 -1
  31. package/jsx/core/Banner/Banner.stories.d.ts.map +1 -1
  32. package/jsx/core/Banner/Banner.stories.jsx +2 -2
  33. package/jsx/core/Banner/Banner.stories.jsx.map +1 -1
  34. package/jsx/core/Card/Card.stories.jsx +1 -1
  35. package/jsx/core/Card/Card.stories.jsx.map +1 -1
  36. package/jsx/core/Checkbox/Checkbox.stories.jsx +1 -1
  37. package/jsx/core/Checkbox/Checkbox.stories.jsx.map +1 -1
  38. package/jsx/core/Configuration/Configuration.stories.d.ts.map +1 -1
  39. package/jsx/core/Configuration/Configuration.stories.jsx +1 -1
  40. package/jsx/core/Configuration/Configuration.stories.jsx.map +1 -1
  41. package/jsx/core/Currency/Currency.stories.d.ts +5 -2
  42. package/jsx/core/Currency/Currency.stories.d.ts.map +1 -1
  43. package/jsx/core/Currency/Currency.stories.jsx +30 -12
  44. package/jsx/core/Currency/Currency.stories.jsx.map +1 -1
  45. package/jsx/core/FieldGroup/FieldGroup.stories.d.ts +2 -0
  46. package/jsx/core/FieldGroup/FieldGroup.stories.d.ts.map +1 -1
  47. package/jsx/core/FieldGroup/FieldGroup.stories.jsx +8 -4
  48. package/jsx/core/FieldGroup/FieldGroup.stories.jsx.map +1 -1
  49. package/jsx/core/FieldGroup/FieldGroupList.mocks.jsx +1 -1
  50. package/jsx/core/FieldGroup/FieldGroupList.mocks.jsx.map +1 -1
  51. package/jsx/core/FieldGroup/FieldGroupList.stories.d.ts +9 -8
  52. package/jsx/core/FieldGroup/FieldGroupList.stories.d.ts.map +1 -1
  53. package/jsx/core/FieldGroup/FieldGroupList.stories.jsx +51 -20
  54. package/jsx/core/FieldGroup/FieldGroupList.stories.jsx.map +1 -1
  55. package/jsx/core/File/FileDisplay.stories.d.ts.map +1 -1
  56. package/jsx/core/File/FileDisplay.stories.jsx +16 -38
  57. package/jsx/core/File/FileDisplay.stories.jsx.map +1 -1
  58. package/jsx/core/File/FileInput.stories.d.ts.map +1 -1
  59. package/jsx/core/File/FileInput.stories.jsx +1 -1
  60. package/jsx/core/File/FileInput.stories.jsx.map +1 -1
  61. package/jsx/core/Form/Form.mocks.d.ts.map +1 -1
  62. package/jsx/core/Form/Form.mocks.jsx +2 -2
  63. package/jsx/core/Form/Form.mocks.jsx.map +1 -1
  64. package/jsx/core/Form/Form.stories.jsx +2 -2
  65. package/jsx/core/Form/Form.stories.jsx.map +1 -1
  66. package/jsx/core/HTML/HTML.stories.d.ts +6 -0
  67. package/jsx/core/HTML/HTML.stories.d.ts.map +1 -0
  68. package/jsx/core/HTML/HTML.stories.jsx +13 -0
  69. package/jsx/core/HTML/HTML.stories.jsx.map +1 -0
  70. package/jsx/core/ListToolbar/ListToolbar.mocks.d.ts +9 -0
  71. package/jsx/core/ListToolbar/ListToolbar.mocks.d.ts.map +1 -0
  72. package/jsx/core/ListToolbar/ListToolbar.mocks.jsx +71 -0
  73. package/jsx/core/ListToolbar/ListToolbar.mocks.jsx.map +1 -0
  74. package/jsx/core/ListToolbar/ListToolbar.stories.d.ts +7 -0
  75. package/jsx/core/ListToolbar/ListToolbar.stories.d.ts.map +1 -0
  76. package/jsx/core/ListToolbar/ListToolbar.stories.jsx +87 -0
  77. package/jsx/core/ListToolbar/ListToolbar.stories.jsx.map +1 -0
  78. package/jsx/core/Modal/Modal.mocks.d.ts.map +1 -1
  79. package/jsx/core/Modal/Modal.mocks.jsx +3 -3
  80. package/jsx/core/Modal/Modal.mocks.jsx.map +1 -1
  81. package/jsx/core/Modal/Modal.stories.d.ts.map +1 -1
  82. package/jsx/core/Modal/Modal.stories.jsx +29 -43
  83. package/jsx/core/Modal/Modal.stories.jsx.map +1 -1
  84. package/jsx/core/Number/Number.stories.d.ts +3 -3
  85. package/jsx/core/Number/Number.stories.d.ts.map +1 -1
  86. package/jsx/core/Number/Number.stories.jsx +14 -10
  87. package/jsx/core/Number/Number.stories.jsx.map +1 -1
  88. package/jsx/core/PageTemplates/PageTemplates.stories.d.ts +5 -3
  89. package/jsx/core/PageTemplates/PageTemplates.stories.d.ts.map +1 -1
  90. package/jsx/core/PageTemplates/PageTemplates.stories.jsx +106 -30
  91. package/jsx/core/PageTemplates/PageTemplates.stories.jsx.map +1 -1
  92. package/jsx/core/RadioButton/RadioButton.stories.jsx +1 -1
  93. package/jsx/core/RadioButton/RadioButton.stories.jsx.map +1 -1
  94. package/jsx/core/Rating/Rating.stories.jsx +1 -1
  95. package/jsx/core/Rating/Rating.stories.jsx.map +1 -1
  96. package/jsx/core/Sentiment/Sentiment.stories.jsx +4 -4
  97. package/jsx/core/Sentiment/Sentiment.stories.jsx.map +1 -1
  98. package/jsx/core/Table/Table.mocks.d.ts +6 -0
  99. package/jsx/core/Table/Table.mocks.d.ts.map +1 -1
  100. package/jsx/core/Table/Table.mocks.jsx +134 -0
  101. package/jsx/core/Table/Table.mocks.jsx.map +1 -1
  102. package/jsx/core/Table/Table.stories.jsx +2 -2
  103. package/jsx/core/Table/Table.stories.jsx.map +1 -1
  104. package/jsx/core/Toaster/Toaster.stories.jsx +17 -12
  105. package/jsx/core/Toaster/Toaster.stories.jsx.map +1 -1
  106. package/jsx/cs/ArticleList/ArticleList.stories.d.ts.map +1 -1
  107. package/jsx/cs/ArticleList/ArticleList.stories.jsx +2 -1
  108. package/jsx/cs/ArticleList/ArticleList.stories.jsx.map +1 -1
  109. package/jsx/cs/CSCaseView/CSAppShell.stories.d.ts +1 -1
  110. package/jsx/cs/CSCaseView/CSAppShell.stories.d.ts.map +1 -1
  111. package/jsx/cs/CSCaseView/CSAppShell.stories.jsx +10 -10
  112. package/jsx/cs/CSCaseView/CSAppShell.stories.jsx.map +1 -1
  113. package/jsx/cs/IntelligentGuidance/IntelligentGuidance.stories.d.ts.map +1 -1
  114. package/jsx/cs/IntelligentGuidance/IntelligentGuidance.stories.jsx +8 -8
  115. package/jsx/cs/IntelligentGuidance/IntelligentGuidance.stories.jsx.map +1 -1
  116. package/jsx/cs/TaskManager/TaskManager.stories.d.ts.map +1 -1
  117. package/jsx/cs/TaskManager/TaskManager.stories.jsx +1 -1
  118. package/jsx/cs/TaskManager/TaskManager.stories.jsx.map +1 -1
  119. package/jsx/rte/Editor/Editor.stories.jsx +2 -2
  120. package/jsx/rte/Editor/Editor.stories.jsx.map +1 -1
  121. package/jsx/social/Email/Email.mocks.d.ts +19 -2
  122. package/jsx/social/Email/Email.mocks.d.ts.map +1 -1
  123. package/jsx/social/Email/Email.mocks.js +48 -1
  124. package/jsx/social/Email/Email.mocks.js.map +1 -1
  125. package/jsx/social/Email/Email.stories.d.ts +1 -1
  126. package/jsx/social/Email/Email.stories.d.ts.map +1 -1
  127. package/jsx/social/Email/Email.stories.jsx +80 -15
  128. package/jsx/social/Email/Email.stories.jsx.map +1 -1
  129. package/jsx/social/Feed/Feed.stories.d.ts.map +1 -1
  130. package/jsx/social/Feed/Feed.stories.jsx +1 -1
  131. package/jsx/social/Feed/Feed.stories.jsx.map +1 -1
  132. package/jsx/work/CaseView/CaseView.mocks.d.ts.map +1 -1
  133. package/jsx/work/CaseView/CaseView.mocks.jsx +1 -1
  134. package/jsx/work/CaseView/CaseView.mocks.jsx.map +1 -1
  135. package/jsx/work/CaseView/CaseView.stories.d.ts.map +1 -1
  136. package/jsx/work/CaseView/CaseView.stories.jsx +7 -7
  137. package/jsx/work/CaseView/CaseView.stories.jsx.map +1 -1
  138. package/jsx/work/CaseView/Details.mocks.d.ts.map +1 -1
  139. package/jsx/work/CaseView/Details.mocks.jsx +1 -1
  140. package/jsx/work/CaseView/Details.mocks.jsx.map +1 -1
  141. package/jsx/work/CaseView/Pulse.mocks.d.ts.map +1 -1
  142. package/jsx/work/CaseView/Pulse.mocks.jsx +1 -1
  143. package/jsx/work/CaseView/Pulse.mocks.jsx.map +1 -1
  144. package/jsx/work/ConfigurableLayout/ConfigurableLayout.stories.d.ts.map +1 -1
  145. package/jsx/work/ConfigurableLayout/ConfigurableLayout.stories.jsx +1 -1
  146. package/jsx/work/ConfigurableLayout/ConfigurableLayout.stories.jsx.map +1 -1
  147. package/jsx/work/Confirmation/Confirmation.stories.d.ts.map +1 -1
  148. package/jsx/work/Confirmation/Confirmation.stories.jsx +2 -2
  149. package/jsx/work/Confirmation/Confirmation.stories.jsx.map +1 -1
  150. package/jsx/work/Details/Details.stories.d.ts.map +1 -1
  151. package/jsx/work/Details/Details.stories.jsx +21 -16
  152. package/jsx/work/Details/Details.stories.jsx.map +1 -1
  153. package/jsx/work/SearchResults/SearchResults.stories.d.ts.map +1 -1
  154. package/jsx/work/SearchResults/SearchResults.stories.jsx +1 -1
  155. package/jsx/work/SearchResults/SearchResults.stories.jsx.map +1 -1
  156. package/jsx/work/Stakeholders/Stakeholders.mocks.d.ts.map +1 -1
  157. package/jsx/work/Stakeholders/Stakeholders.mocks.jsx +2 -2
  158. package/jsx/work/Stakeholders/Stakeholders.mocks.jsx.map +1 -1
  159. package/jsx/work/Timeline/Timeline.stories.d.ts +2 -0
  160. package/jsx/work/Timeline/Timeline.stories.d.ts.map +1 -1
  161. package/jsx/work/Timeline/Timeline.stories.jsx +28 -1
  162. package/jsx/work/Timeline/Timeline.stories.jsx.map +1 -1
  163. package/lib/build/DynamicContentEditor/DynamicContentEditor.stories.d.ts +9 -0
  164. package/lib/build/DynamicContentEditor/DynamicContentEditor.stories.d.ts.map +1 -0
  165. package/lib/build/DynamicContentEditor/DynamicContentEditor.stories.js +63 -0
  166. package/lib/build/DynamicContentEditor/DynamicContentEditor.stories.js.map +1 -0
  167. package/lib/build/DynamicContentEditor/FieldSelector.d.ts +14 -0
  168. package/lib/build/DynamicContentEditor/FieldSelector.d.ts.map +1 -0
  169. package/lib/build/DynamicContentEditor/FieldSelector.js +81 -0
  170. package/lib/build/DynamicContentEditor/FieldSelector.js.map +1 -0
  171. package/lib/build/ObjectSelect/ObjectSelect.mocks.d.ts +16 -0
  172. package/lib/build/ObjectSelect/ObjectSelect.mocks.d.ts.map +1 -0
  173. package/lib/build/ObjectSelect/ObjectSelect.mocks.js +136 -0
  174. package/lib/build/ObjectSelect/ObjectSelect.mocks.js.map +1 -0
  175. package/lib/build/ObjectSelect/ObjectSelect.stories.d.ts +14 -0
  176. package/lib/build/ObjectSelect/ObjectSelect.stories.d.ts.map +1 -0
  177. package/lib/build/ObjectSelect/ObjectSelect.stories.js +247 -0
  178. package/lib/build/ObjectSelect/ObjectSelect.stories.js.map +1 -0
  179. package/lib/build/ObjectSelect/ObjectSelect.styles.d.ts +4 -0
  180. package/lib/build/ObjectSelect/ObjectSelect.styles.d.ts.map +1 -0
  181. package/lib/build/ObjectSelect/ObjectSelect.styles.js +27 -0
  182. package/lib/build/ObjectSelect/ObjectSelect.styles.js.map +1 -0
  183. package/lib/build/PageTemplates/PageTemplates.stories.d.ts.map +1 -1
  184. package/lib/build/PageTemplates/PageTemplates.stories.js +4 -4
  185. package/lib/build/PageTemplates/PageTemplates.stories.js.map +1 -1
  186. package/lib/build/Workbench/Workbench.stories.d.ts.map +1 -1
  187. package/lib/build/Workbench/Workbench.stories.js +3 -6
  188. package/lib/build/Workbench/Workbench.stories.js.map +1 -1
  189. package/lib/core/AppShell/AppShell.stories.d.ts +1 -0
  190. package/lib/core/AppShell/AppShell.stories.d.ts.map +1 -1
  191. package/lib/core/AppShell/AppShell.stories.js +4 -2
  192. package/lib/core/AppShell/AppShell.stories.js.map +1 -1
  193. package/lib/core/Banner/Banner.stories.d.ts.map +1 -1
  194. package/lib/core/Banner/Banner.stories.js +2 -2
  195. package/lib/core/Banner/Banner.stories.js.map +1 -1
  196. package/lib/core/Card/Card.stories.js +1 -1
  197. package/lib/core/Card/Card.stories.js.map +1 -1
  198. package/lib/core/Checkbox/Checkbox.stories.js +1 -1
  199. package/lib/core/Checkbox/Checkbox.stories.js.map +1 -1
  200. package/lib/core/Configuration/Configuration.stories.d.ts.map +1 -1
  201. package/lib/core/Configuration/Configuration.stories.js +1 -1
  202. package/lib/core/Configuration/Configuration.stories.js.map +1 -1
  203. package/lib/core/Currency/Currency.stories.d.ts +5 -2
  204. package/lib/core/Currency/Currency.stories.d.ts.map +1 -1
  205. package/lib/core/Currency/Currency.stories.js +30 -12
  206. package/lib/core/Currency/Currency.stories.js.map +1 -1
  207. package/lib/core/FieldGroup/FieldGroup.stories.d.ts +2 -0
  208. package/lib/core/FieldGroup/FieldGroup.stories.d.ts.map +1 -1
  209. package/lib/core/FieldGroup/FieldGroup.stories.js +7 -3
  210. package/lib/core/FieldGroup/FieldGroup.stories.js.map +1 -1
  211. package/lib/core/FieldGroup/FieldGroupList.mocks.js +1 -1
  212. package/lib/core/FieldGroup/FieldGroupList.mocks.js.map +1 -1
  213. package/lib/core/FieldGroup/FieldGroupList.stories.d.ts +9 -8
  214. package/lib/core/FieldGroup/FieldGroupList.stories.d.ts.map +1 -1
  215. package/lib/core/FieldGroup/FieldGroupList.stories.js +51 -20
  216. package/lib/core/FieldGroup/FieldGroupList.stories.js.map +1 -1
  217. package/lib/core/File/FileDisplay.stories.d.ts.map +1 -1
  218. package/lib/core/File/FileDisplay.stories.js +17 -29
  219. package/lib/core/File/FileDisplay.stories.js.map +1 -1
  220. package/lib/core/File/FileInput.stories.d.ts.map +1 -1
  221. package/lib/core/File/FileInput.stories.js +1 -1
  222. package/lib/core/File/FileInput.stories.js.map +1 -1
  223. package/lib/core/Form/Form.mocks.d.ts.map +1 -1
  224. package/lib/core/Form/Form.mocks.js +2 -2
  225. package/lib/core/Form/Form.mocks.js.map +1 -1
  226. package/lib/core/Form/Form.stories.js +2 -2
  227. package/lib/core/Form/Form.stories.js.map +1 -1
  228. package/lib/core/HTML/HTML.stories.d.ts +6 -0
  229. package/lib/core/HTML/HTML.stories.d.ts.map +1 -0
  230. package/lib/core/HTML/HTML.stories.js +14 -0
  231. package/lib/core/HTML/HTML.stories.js.map +1 -0
  232. package/lib/core/ListToolbar/ListToolbar.mocks.d.ts +9 -0
  233. package/lib/core/ListToolbar/ListToolbar.mocks.d.ts.map +1 -0
  234. package/lib/core/ListToolbar/ListToolbar.mocks.js +50 -0
  235. package/lib/core/ListToolbar/ListToolbar.mocks.js.map +1 -0
  236. package/lib/core/ListToolbar/ListToolbar.stories.d.ts +7 -0
  237. package/lib/core/ListToolbar/ListToolbar.stories.d.ts.map +1 -0
  238. package/lib/core/ListToolbar/ListToolbar.stories.js +79 -0
  239. package/lib/core/ListToolbar/ListToolbar.stories.js.map +1 -0
  240. package/lib/core/Modal/Modal.mocks.d.ts.map +1 -1
  241. package/lib/core/Modal/Modal.mocks.js +3 -3
  242. package/lib/core/Modal/Modal.mocks.js.map +1 -1
  243. package/lib/core/Modal/Modal.stories.d.ts.map +1 -1
  244. package/lib/core/Modal/Modal.stories.js +14 -14
  245. package/lib/core/Modal/Modal.stories.js.map +1 -1
  246. package/lib/core/Number/Number.stories.d.ts +3 -3
  247. package/lib/core/Number/Number.stories.d.ts.map +1 -1
  248. package/lib/core/Number/Number.stories.js +14 -10
  249. package/lib/core/Number/Number.stories.js.map +1 -1
  250. package/lib/core/PageTemplates/PageTemplates.stories.d.ts +5 -3
  251. package/lib/core/PageTemplates/PageTemplates.stories.d.ts.map +1 -1
  252. package/lib/core/PageTemplates/PageTemplates.stories.js +95 -27
  253. package/lib/core/PageTemplates/PageTemplates.stories.js.map +1 -1
  254. package/lib/core/RadioButton/RadioButton.stories.js +1 -1
  255. package/lib/core/RadioButton/RadioButton.stories.js.map +1 -1
  256. package/lib/core/Rating/Rating.stories.js +1 -1
  257. package/lib/core/Rating/Rating.stories.js.map +1 -1
  258. package/lib/core/Sentiment/Sentiment.stories.js +2 -2
  259. package/lib/core/Sentiment/Sentiment.stories.js.map +1 -1
  260. package/lib/core/Table/Table.mocks.d.ts +6 -0
  261. package/lib/core/Table/Table.mocks.d.ts.map +1 -1
  262. package/lib/core/Table/Table.mocks.js +134 -0
  263. package/lib/core/Table/Table.mocks.js.map +1 -1
  264. package/lib/core/Table/Table.stories.js +2 -2
  265. package/lib/core/Table/Table.stories.js.map +1 -1
  266. package/lib/core/Toaster/Toaster.stories.js +15 -19
  267. package/lib/core/Toaster/Toaster.stories.js.map +1 -1
  268. package/lib/cs/ArticleList/ArticleList.stories.d.ts.map +1 -1
  269. package/lib/cs/ArticleList/ArticleList.stories.js +2 -1
  270. package/lib/cs/ArticleList/ArticleList.stories.js.map +1 -1
  271. package/lib/cs/CSCaseView/CSAppShell.stories.d.ts +1 -1
  272. package/lib/cs/CSCaseView/CSAppShell.stories.d.ts.map +1 -1
  273. package/lib/cs/CSCaseView/CSAppShell.stories.js +10 -10
  274. package/lib/cs/CSCaseView/CSAppShell.stories.js.map +1 -1
  275. package/lib/cs/IntelligentGuidance/IntelligentGuidance.stories.d.ts.map +1 -1
  276. package/lib/cs/IntelligentGuidance/IntelligentGuidance.stories.js +8 -8
  277. package/lib/cs/IntelligentGuidance/IntelligentGuidance.stories.js.map +1 -1
  278. package/lib/cs/TaskManager/TaskManager.stories.d.ts.map +1 -1
  279. package/lib/cs/TaskManager/TaskManager.stories.js +1 -1
  280. package/lib/cs/TaskManager/TaskManager.stories.js.map +1 -1
  281. package/lib/rte/Editor/Editor.stories.js +2 -2
  282. package/lib/rte/Editor/Editor.stories.js.map +1 -1
  283. package/lib/social/Email/Email.mocks.d.ts +19 -2
  284. package/lib/social/Email/Email.mocks.d.ts.map +1 -1
  285. package/lib/social/Email/Email.mocks.js +48 -1
  286. package/lib/social/Email/Email.mocks.js.map +1 -1
  287. package/lib/social/Email/Email.stories.d.ts +1 -1
  288. package/lib/social/Email/Email.stories.d.ts.map +1 -1
  289. package/lib/social/Email/Email.stories.js +63 -15
  290. package/lib/social/Email/Email.stories.js.map +1 -1
  291. package/lib/social/Feed/Feed.stories.d.ts.map +1 -1
  292. package/lib/social/Feed/Feed.stories.js +1 -1
  293. package/lib/social/Feed/Feed.stories.js.map +1 -1
  294. package/lib/work/CaseView/CaseView.mocks.d.ts.map +1 -1
  295. package/lib/work/CaseView/CaseView.mocks.js +1 -1
  296. package/lib/work/CaseView/CaseView.mocks.js.map +1 -1
  297. package/lib/work/CaseView/CaseView.stories.d.ts.map +1 -1
  298. package/lib/work/CaseView/CaseView.stories.js +7 -7
  299. package/lib/work/CaseView/CaseView.stories.js.map +1 -1
  300. package/lib/work/CaseView/Details.mocks.d.ts.map +1 -1
  301. package/lib/work/CaseView/Details.mocks.js +1 -1
  302. package/lib/work/CaseView/Details.mocks.js.map +1 -1
  303. package/lib/work/CaseView/Pulse.mocks.d.ts.map +1 -1
  304. package/lib/work/CaseView/Pulse.mocks.js +1 -1
  305. package/lib/work/CaseView/Pulse.mocks.js.map +1 -1
  306. package/lib/work/ConfigurableLayout/ConfigurableLayout.stories.d.ts.map +1 -1
  307. package/lib/work/ConfigurableLayout/ConfigurableLayout.stories.js +1 -1
  308. package/lib/work/ConfigurableLayout/ConfigurableLayout.stories.js.map +1 -1
  309. package/lib/work/Confirmation/Confirmation.stories.d.ts.map +1 -1
  310. package/lib/work/Confirmation/Confirmation.stories.js +2 -2
  311. package/lib/work/Confirmation/Confirmation.stories.js.map +1 -1
  312. package/lib/work/Details/Details.stories.d.ts.map +1 -1
  313. package/lib/work/Details/Details.stories.js +56 -53
  314. package/lib/work/Details/Details.stories.js.map +1 -1
  315. package/lib/work/SearchResults/SearchResults.stories.d.ts.map +1 -1
  316. package/lib/work/SearchResults/SearchResults.stories.js +1 -1
  317. package/lib/work/SearchResults/SearchResults.stories.js.map +1 -1
  318. package/lib/work/Stakeholders/Stakeholders.mocks.d.ts.map +1 -1
  319. package/lib/work/Stakeholders/Stakeholders.mocks.js +2 -2
  320. package/lib/work/Stakeholders/Stakeholders.mocks.js.map +1 -1
  321. package/lib/work/Timeline/Timeline.stories.d.ts +2 -0
  322. package/lib/work/Timeline/Timeline.stories.d.ts.map +1 -1
  323. package/lib/work/Timeline/Timeline.stories.js +22 -2
  324. package/lib/work/Timeline/Timeline.stories.js.map +1 -1
  325. package/package.json +16 -16
@@ -1 +1 @@
1
- {"version":3,"file":"FileInput.stories.jsx","sourceRoot":"","sources":["../../../src/core/File/FileInput.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE3E,OAAO,EACL,SAAS,EAET,SAAS,EACT,qBAAqB,EACtB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,kBAAkB,EAAE,MAAM,6DAA6D,CAAC;AAEjG,eAAe;IACb,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,SAAS;CACb,CAAC;AAMV,MAAM,CAAC,MAAM,aAAa,GAA+B,CAAC,IAAyB,EAAE,EAAE;IACrF,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,GAAG,UAAU,CAAC,kBAAkB,CAAC,CAAC;IACrF,MAAM,SAAS,GAAG,MAAM,CAAC,EAAE,WAAW,EAAE,CAAC,EAAE,WAAW,EAAE,CAAC,EAAE,CAAC,CAAC;IAC7D,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEhD,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,IAAI,GAAG,CAAC;IAGxC,MAAM,YAAY,GAAG,WAAW,CAC9B,CAAC,UAAkB,EAAE,EAAE;QACrB,SAAS,CAAC,OAAO,GAAG,EAAE,WAAW,EAAE,CAAC,EAAE,WAAW,EAAE,CAAC,EAAE,CAAC;QAEvD,MAAM,QAAQ,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE;YACrC,IAAI,WAAW,GAAG,IAAI,CAAC;YAEvB,IAAI,CAAC,CAAC,IAAI,GAAG,OAAO,GAAG,SAAS,EAAE;gBAChC,SAAS,CAAC,OAAO,CAAC,WAAW,IAAI,CAAC,CAAC;gBACnC,WAAW,GAAG,KAAK,CAAC;aACrB;YAED,OAAO,WAAW,CAAC;QACrB,CAAC,CAAC,CAAC;QAEH,WAAW,CAAC,QAAQ,CAAC,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC;QAEjD,QAAQ,CAAC,OAAO,CAAC,CAAC,IAAU,EAAE,EAAE;YAC9B,MAAM,EAAE,GAAG,SAAS,EAAE,CAAC;YACvB,UAAU,CAAC;gBACT,EAAE;gBACF,SAAS,EAAE,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS;gBAChF,IAAI,EAAE,IAAI,CAAC,IAAI;gBACf,QAAQ,EAAE,EAAE;gBACZ,IAAI;gBACJ,QAAQ,EAAE,GAAG,EAAE;oBACb,UAAU,CAAC,EAAE,CAAC,CAAC;gBACjB,CAAC;aACF,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC,EACD,CAAC,UAAU,EAAE,UAAU,CAAC,CACzB,CAAC;IAEF,qBAAqB,CAAC,GAAG,EAAE;QACzB,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;YAAE,WAAW,CAAC,KAAK,CAAC,CAAC;IAC7C,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IAEnB,MAAM,IAAI,GAAG,OAAO,CAAC,GAAG,EAAE;QACxB,OAAO,QAAQ;YACb,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,WAAW,GAAG,CAAC,IAAI,CACnC,CAAC,GAAG,CAAC,CAAC,+BAA+B,SAAS,IAAI,CAAC,EAAE,GAAG,CAAC,CAC1D;YACH,CAAC,CAAC,IAAI,CAAC;IACX,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,OAAO,CACL,CAAC,SAAS,CACR,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAClB,WAAW,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAC9B,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACxB,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CACvC,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACxB,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACxB,YAAY,CAAC,CAAC,YAAY,CAAC,CAC3B,KAAK,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YACtB,OAAO;gBACL,GAAG,IAAI;gBACP,QAAQ,EAAE,SAAS;gBACnB,SAAS,EAAE,GAAG,EAAE,GAAE,CAAC;gBACnB,UAAU,EAAE,GAAG,EAAE,GAAE,CAAC;gBACpB,QAAQ,EAAE,GAAG,EAAE;oBACb,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;gBACtB,CAAC;aACF,CAAC;YAEF,OAAO,IAAI,CAAC;QACd,CAAC,CAAC,CAAC,EACH,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,aAAa,CAAC,IAAI,GAAG;IACnB,QAAQ,EAAE,IAAI;IACd,SAAS,EAAE,GAAG;IACd,KAAK,EAAE,kBAAkB;IACzB,WAAW,EAAE,KAAK;IAClB,QAAQ,EAAE,KAAK;IACf,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF,aAAa,CAAC,QAAQ,GAAG;IACvB,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC1C,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IAC1C,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACpC,WAAW,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC7C,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC1C,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;CAC3C,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState, useMemo, useCallback, useRef, useContext } from 'react';\n\nimport {\n FileInput,\n FileInputProps,\n createUID,\n useAfterInitialEffect\n} from '@pega/cosmos-react-core';\nimport { FileServiceContext } from '@pega/cosmos-react-demos/lib/work/CaseView/FileService.mock';\n\nexport default {\n title: 'Core/File/Input',\n component: FileInput\n} as Meta;\n\ninterface FileInputStoryProps extends FileInputProps {\n sizeLimit?: number;\n}\n\nexport const FileInputDemo: Story<FileInputStoryProps> = (args: FileInputStoryProps) => {\n const { files, attachFile, cancelFile, deleteFile } = useContext(FileServiceContext);\n const errCounts = useRef({ invalidType: 0, invalidSize: 0 });\n const [hasError, setHasError] = useState(false);\n\n const sizeLimit = args.sizeLimit || 100;\n\n // Fires anytime files are added to the input either through selection or drop\n const onFilesAdded = useCallback(\n (addedFiles: File[]) => {\n errCounts.current = { invalidType: 0, invalidSize: 0 };\n\n const newFiles = addedFiles.filter(f => {\n let isValidSize = true;\n\n if (f.size / 1000000 > sizeLimit) {\n errCounts.current.invalidSize += 1;\n isValidSize = false;\n }\n\n return isValidSize;\n });\n\n setHasError(newFiles.length < addedFiles.length);\n\n newFiles.forEach((File: File) => {\n const id = createUID();\n attachFile({\n id,\n thumbnail: File.type.startsWith('image') ? URL.createObjectURL(File) : undefined,\n name: File.name,\n category: '',\n File,\n onCancel: () => {\n cancelFile(id);\n }\n });\n });\n },\n [attachFile, deleteFile]\n );\n\n useAfterInitialEffect(() => {\n if (files.length === 0) setHasError(false);\n }, [files.length]);\n\n const info = useMemo(() => {\n return hasError\n ? errCounts.current.invalidSize > 0 && (\n <div>{`File size must be less than ${sizeLimit}MB`}</div>\n )\n : null;\n }, [hasError]);\n\n return (\n <FileInput\n label={args.label}\n labelHidden={args.labelHidden}\n multiple={args.multiple}\n status={hasError ? 'error' : undefined}\n info={info}\n required={args.required}\n disabled={args.disabled}\n onFilesAdded={onFilesAdded}\n files={files.map(file => {\n return {\n ...file,\n onCancel: undefined,\n onPreview: () => {},\n onDownload: () => {},\n onDelete: () => {\n deleteFile(file.id);\n }\n };\n\n return file;\n })}\n />\n );\n};\n\nFileInputDemo.args = {\n multiple: true,\n sizeLimit: 100,\n label: 'File input label',\n labelHidden: false,\n required: false,\n disabled: false\n};\n\nFileInputDemo.argTypes = {\n multiple: { control: { type: 'boolean' } },\n sizeLimit: { control: { type: 'number' } },\n label: { control: { type: 'text' } },\n labelHidden: { control: { type: 'boolean' } },\n required: { control: { type: 'boolean' } },\n disabled: { control: { type: 'boolean' } }\n};\n"]}
1
+ {"version":3,"file":"FileInput.stories.jsx","sourceRoot":"","sources":["../../../src/core/File/FileInput.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState, useMemo, useCallback, useRef, useContext } from 'react';\n\nimport {\n FileInput,\n FileInputProps,\n createUID,\n useAfterInitialEffect\n} from '@pega/cosmos-react-core';\n\nimport { FileServiceContext } from '../../work/CaseView/FileService.mock';\n\nexport default {\n title: 'Core/File/Input',\n component: FileInput\n} as Meta;\n\ninterface FileInputStoryProps extends FileInputProps {\n sizeLimit?: number;\n}\n\nexport const FileInputDemo: Story<FileInputStoryProps> = (args: FileInputStoryProps) => {\n const { files, attachFile, cancelFile, deleteFile } = useContext(FileServiceContext);\n const errCounts = useRef({ invalidType: 0, invalidSize: 0 });\n const [hasError, setHasError] = useState(false);\n\n const sizeLimit = args.sizeLimit || 100;\n\n // Fires anytime files are added to the input either through selection or drop\n const onFilesAdded = useCallback(\n (addedFiles: File[]) => {\n errCounts.current = { invalidType: 0, invalidSize: 0 };\n\n const newFiles = addedFiles.filter(f => {\n let isValidSize = true;\n\n if (f.size / 1000000 > sizeLimit) {\n errCounts.current.invalidSize += 1;\n isValidSize = false;\n }\n\n return isValidSize;\n });\n\n setHasError(newFiles.length < addedFiles.length);\n\n newFiles.forEach((File: File) => {\n const id = createUID();\n attachFile({\n id,\n thumbnail: File.type.startsWith('image') ? URL.createObjectURL(File) : undefined,\n name: File.name,\n category: '',\n File,\n onCancel: () => {\n cancelFile(id);\n }\n });\n });\n },\n [attachFile, deleteFile]\n );\n\n useAfterInitialEffect(() => {\n if (files.length === 0) setHasError(false);\n }, [files.length]);\n\n const info = useMemo(() => {\n return hasError\n ? errCounts.current.invalidSize > 0 && (\n <div>{`File size must be less than ${sizeLimit}MB`}</div>\n )\n : null;\n }, [hasError]);\n\n return (\n <FileInput\n label={args.label}\n labelHidden={args.labelHidden}\n multiple={args.multiple}\n status={hasError ? 'error' : undefined}\n info={info}\n required={args.required}\n disabled={args.disabled}\n onFilesAdded={onFilesAdded}\n files={files.map(file => {\n return {\n ...file,\n onCancel: undefined,\n onPreview: () => {},\n onDownload: () => {},\n onDelete: () => {\n deleteFile(file.id);\n }\n };\n\n return file;\n })}\n />\n );\n};\n\nFileInputDemo.args = {\n multiple: true,\n sizeLimit: 100,\n label: 'File input label',\n labelHidden: false,\n required: false,\n disabled: false\n};\n\nFileInputDemo.argTypes = {\n multiple: { control: { type: 'boolean' } },\n sizeLimit: { control: { type: 'number' } },\n label: { control: { type: 'text' } },\n labelHidden: { control: { type: 'boolean' } },\n required: { control: { type: 'boolean' } },\n disabled: { control: { type: 'boolean' } }\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"Form.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Form/Form.mocks.tsx"],"names":[],"mappings":";AA+FA,eAAO,MAAM,WAAW;UAMhB,MAAM;iBACC,OAAO;;;wBA8IrB,CAAC"}
1
+ {"version":3,"file":"Form.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Form/Form.mocks.tsx"],"names":[],"mappings":";AAgGA,eAAO,MAAM,WAAW;UAMhB,MAAM;iBACC,OAAO;;;wBA8IrB,CAAC"}
@@ -1,8 +1,8 @@
1
1
  import { useReducer, useRef, useContext } from 'react';
2
2
  import { Button, Checkbox, CheckboxGroup, Form, Grid, Input, RadioButton, RadioButtonGroup, Select, Option, TextArea, ToasterContext } from '@pega/cosmos-react-core';
3
3
  import { Editor as RichTextEditor } from '@pega/cosmos-react-rte';
4
- import { FileInputDemo } from '@pega/cosmos-react-demos/lib/core/File/FileInput.stories';
5
- import { FilterableSingleSelect as ComboboxFilterableStory } from '@pega/cosmos-react-demos/lib/core/ComboBox/ComboBox.stories';
4
+ import { FileInputDemo } from '../File/FileInput.stories';
5
+ import { FilterableSingleSelect as ComboboxFilterableStory } from '../ComboBox/ComboBox.stories';
6
6
  const initFields = () => {
7
7
  const common = { value: undefined, status: undefined };
8
8
  return [
@@ -1 +1 @@
1
- {"version":3,"file":"Form.mocks.jsx","sourceRoot":"","sources":["../../../src/core/Form/Form.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useReducer, ChangeEvent, FocusEvent, FormEvent, useRef, useContext } from 'react';\n\nimport {\n Button,\n Checkbox,\n CheckboxGroup,\n Form,\n FormControlProps,\n Grid,\n Input,\n RadioButton,\n RadioButtonGroup,\n Select,\n Option,\n TextArea,\n ToasterContext\n} from '@pega/cosmos-react-core';\nimport {\n Editor as RichTextEditor,\n EditorState as RichTextEditorState\n} from '@pega/cosmos-react-rte';\nimport { FileInputDemo } from '@pega/cosmos-react-demos/lib/core/File/FileInput.stories';\nimport { FilterableSingleSelect as ComboboxFilterableStory } from '@pega/cosmos-react-demos/lib/core/ComboBox/ComboBox.stories';\n\ninterface Field extends FormControlProps {\n help?: string;\n error?: string;\n validator: (this: Field) => boolean;\n}\n\n// Get initial field properties\nconst initFields = (): Field[] => {\n const common = { value: undefined, status: undefined };\n return [\n {\n ...common,\n name: 'name',\n required: true,\n error: 'Please enter first and last name',\n validator() {\n if (!this.value) return false;\n return /^[a-z]+\\s[a-z]+$/i.test(this.value);\n }\n },\n {\n ...common,\n name: 'email',\n required: true,\n error: 'Enter a @pega.com address',\n validator() {\n if (!this.value) return false;\n return /^\\S+@pega\\.com$/.test(this.value);\n }\n },\n {\n ...common,\n name: 'notes',\n required: true,\n help: 'See how fast you can type 20 characters…go',\n error: 'You need to tell us more than 20 characters',\n validator() {\n if (!this.value) return false;\n return this.value.length >= 20;\n }\n }\n ];\n};\n\n// Handles setting of state for all fields\nconst fieldReducer = (\n fields: Field[],\n {\n target,\n type\n }:\n | ChangeEvent<HTMLInputElement | HTMLTextAreaElement>\n | FocusEvent<HTMLInputElement | HTMLTextAreaElement>\n) => {\n return fields.map(field => {\n if (field.name === target.name) {\n field.value = target.value;\n if (type === 'blur' || field.status === 'error') {\n if ((field.required || field.value) && !field.validator()) {\n field.status = 'error';\n field.info = field.error;\n } else {\n field.status = undefined;\n field.info = field.help;\n }\n }\n }\n return field;\n });\n};\n\nexport const FormContent = ({\n cols,\n heading,\n description,\n showActions\n}: {\n cols: number;\n showActions: boolean;\n heading?: string;\n description?: string;\n}) => {\n const editorRef = useRef<RichTextEditorState>(null);\n const [fields, setField] = useReducer(fieldReducer, undefined, initFields);\n const { push } = useContext(ToasterContext);\n\n const name = fields.find(field => field.name === 'name');\n const email = fields.find(field => field.name === 'email');\n const notes = fields.find(field => field.name === 'notes');\n\n if (!name || !email || !notes) return null;\n\n const canSubmit = fields.every(field => field.value && field.validator());\n\n const actions = (\n <>\n <Button\n name='Cancel'\n variant='secondary'\n onClick={() => {\n push({ content: 'Form cancelled!' });\n }}\n >\n Cancel\n </Button>\n <Button name='Submit' type='submit' variant='primary' disabled={!canSubmit}>\n Submit\n </Button>\n </>\n );\n\n const onImageAdded = (image: File, id: string) => {\n const src = URL.createObjectURL(image);\n editorRef.current?.appendImage({ src, alt: image.name }, id);\n };\n return (\n <Form\n actions={showActions ? actions : undefined}\n description={description}\n heading={heading}\n onSubmit={(e: FormEvent) => {\n e.preventDefault();\n push({ content: 'Form submitted!' });\n }}\n style={{ margin: 'auto', maxWidth: '37.5rem' }}\n >\n <Grid container={{ gap: 1, cols: `repeat(${cols}, minmax(0, 1fr))` }}>\n <Input\n name='name'\n label='Name'\n value={name.value}\n required={name.required}\n status={name.status}\n info='some help text here'\n onChange={(e: ChangeEvent<HTMLInputElement>) => setField({ ...e })}\n onBlur={(e: FocusEvent<HTMLInputElement>) => setField({ ...e })}\n autoComplete='off'\n />\n\n <Input\n name='email'\n value={email.value}\n type='email'\n label='Email'\n required={email.required}\n status={email.status}\n info='some help text here'\n onChange={(e: ChangeEvent<HTMLInputElement>) => setField({ ...e })}\n onBlur={(e: FocusEvent<HTMLInputElement>) => setField({ ...e })}\n autoComplete='off'\n />\n\n <Grid item={{ colStartEnd: '1/-1' }}>\n <CheckboxGroup name='visited' label='Places you have worked'>\n {['Cambridge', 'Krakow', 'Hyderabad', 'Bangalore'].map(office => (\n <Checkbox\n key={office}\n label={office}\n onChange={(e: ChangeEvent<HTMLInputElement>) => setField({ ...e })}\n />\n ))}\n </CheckboxGroup>\n </Grid>\n\n <Grid item={{ colStartEnd: '1/-1' }}>\n <RadioButtonGroup name='meetings' label='Do you enjoy early morning meetings?'>\n {['Yes', \"No… no I don't\"].map(option => (\n <RadioButton\n key={option}\n label={option}\n onChange={(e: ChangeEvent<HTMLInputElement>) => setField({ ...e })}\n />\n ))}\n </RadioButtonGroup>\n </Grid>\n\n <Select label='What would you like to eat?' info='FYI: options are limited'>\n <Option>choose meal…</Option>\n <Option>Pizza</Option>\n <Option>Sandwich</Option>\n <Option>Salad</Option>\n </Select>\n\n <Grid item={{ colStartEnd: '1/-1' }}>\n <TextArea\n name='notes'\n required={notes.required}\n label='Meeting Notes'\n status={notes.status}\n info={notes.info || notes.help}\n onChange={(e: ChangeEvent<HTMLTextAreaElement>) => setField({ ...e })}\n onBlur={(e: FocusEvent<HTMLInputElement>) => setField({ ...e })}\n />\n </Grid>\n\n <Grid item={{ colStartEnd: '1/-1' }}>\n <RichTextEditor\n label='Detailed meeting notes'\n info='The rich text editor can be used in forms, comments, and documents'\n toolbar={[\n 'inline-styling',\n 'headers',\n 'tables',\n 'links',\n 'images',\n 'lists',\n 'cut-copy-paste',\n 'indentation'\n ]}\n onImageAdded={onImageAdded}\n ref={editorRef}\n />\n </Grid>\n <Grid item={{ colStartEnd: '1/-1' }}>\n <FileInputDemo />\n </Grid>\n <ComboboxFilterableStory />\n </Grid>\n </Form>\n );\n};\n"]}
1
+ {"version":3,"file":"Form.mocks.jsx","sourceRoot":"","sources":["../../../src/core/Form/Form.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useReducer, ChangeEvent, FocusEvent, FormEvent, useRef, useContext } from 'react';\n\nimport {\n Button,\n Checkbox,\n CheckboxGroup,\n Form,\n FormControlProps,\n Grid,\n Input,\n RadioButton,\n RadioButtonGroup,\n Select,\n Option,\n TextArea,\n ToasterContext\n} from '@pega/cosmos-react-core';\nimport {\n Editor as RichTextEditor,\n EditorState as RichTextEditorState\n} from '@pega/cosmos-react-rte';\n\nimport { FileInputDemo } from '../File/FileInput.stories';\nimport { FilterableSingleSelect as ComboboxFilterableStory } from '../ComboBox/ComboBox.stories';\n\ninterface Field extends FormControlProps {\n help?: string;\n error?: string;\n validator: (this: Field) => boolean;\n}\n\n// Get initial field properties\nconst initFields = (): Field[] => {\n const common = { value: undefined, status: undefined };\n return [\n {\n ...common,\n name: 'name',\n required: true,\n error: 'Please enter first and last name',\n validator() {\n if (!this.value) return false;\n return /^[a-z]+\\s[a-z]+$/i.test(this.value);\n }\n },\n {\n ...common,\n name: 'email',\n required: true,\n error: 'Enter a @pega.com address',\n validator() {\n if (!this.value) return false;\n return /^\\S+@pega\\.com$/.test(this.value);\n }\n },\n {\n ...common,\n name: 'notes',\n required: true,\n help: 'See how fast you can type 20 characters…go',\n error: 'You need to tell us more than 20 characters',\n validator() {\n if (!this.value) return false;\n return this.value.length >= 20;\n }\n }\n ];\n};\n\n// Handles setting of state for all fields\nconst fieldReducer = (\n fields: Field[],\n {\n target,\n type\n }:\n | ChangeEvent<HTMLInputElement | HTMLTextAreaElement>\n | FocusEvent<HTMLInputElement | HTMLTextAreaElement>\n) => {\n return fields.map(field => {\n if (field.name === target.name) {\n field.value = target.value;\n if (type === 'blur' || field.status === 'error') {\n if ((field.required || field.value) && !field.validator()) {\n field.status = 'error';\n field.info = field.error;\n } else {\n field.status = undefined;\n field.info = field.help;\n }\n }\n }\n return field;\n });\n};\n\nexport const FormContent = ({\n cols,\n heading,\n description,\n showActions\n}: {\n cols: number;\n showActions: boolean;\n heading?: string;\n description?: string;\n}) => {\n const editorRef = useRef<RichTextEditorState>(null);\n const [fields, setField] = useReducer(fieldReducer, undefined, initFields);\n const { push } = useContext(ToasterContext);\n\n const name = fields.find(field => field.name === 'name');\n const email = fields.find(field => field.name === 'email');\n const notes = fields.find(field => field.name === 'notes');\n\n if (!name || !email || !notes) return null;\n\n const canSubmit = fields.every(field => field.value && field.validator());\n\n const actions = (\n <>\n <Button\n name='Cancel'\n variant='secondary'\n onClick={() => {\n push({ content: 'Form cancelled!' });\n }}\n >\n Cancel\n </Button>\n <Button name='Submit' type='submit' variant='primary' disabled={!canSubmit}>\n Submit\n </Button>\n </>\n );\n\n const onImageAdded = (image: File, id: string) => {\n const src = URL.createObjectURL(image);\n editorRef.current?.appendImage({ src, alt: image.name }, id);\n };\n return (\n <Form\n actions={showActions ? actions : undefined}\n description={description}\n heading={heading}\n onSubmit={(e: FormEvent) => {\n e.preventDefault();\n push({ content: 'Form submitted!' });\n }}\n style={{ margin: 'auto', maxWidth: '37.5rem' }}\n >\n <Grid container={{ gap: 1, cols: `repeat(${cols}, minmax(0, 1fr))` }}>\n <Input\n name='name'\n label='Name'\n value={name.value}\n required={name.required}\n status={name.status}\n info='some help text here'\n onChange={(e: ChangeEvent<HTMLInputElement>) => setField({ ...e })}\n onBlur={(e: FocusEvent<HTMLInputElement>) => setField({ ...e })}\n autoComplete='off'\n />\n\n <Input\n name='email'\n value={email.value}\n type='email'\n label='Email'\n required={email.required}\n status={email.status}\n info='some help text here'\n onChange={(e: ChangeEvent<HTMLInputElement>) => setField({ ...e })}\n onBlur={(e: FocusEvent<HTMLInputElement>) => setField({ ...e })}\n autoComplete='off'\n />\n\n <Grid item={{ colStartEnd: '1/-1' }}>\n <CheckboxGroup name='visited' label='Places you have worked'>\n {['Cambridge', 'Krakow', 'Hyderabad', 'Bangalore'].map(office => (\n <Checkbox\n key={office}\n label={office}\n onChange={(e: ChangeEvent<HTMLInputElement>) => setField({ ...e })}\n />\n ))}\n </CheckboxGroup>\n </Grid>\n\n <Grid item={{ colStartEnd: '1/-1' }}>\n <RadioButtonGroup name='meetings' label='Do you enjoy early morning meetings?'>\n {['Yes', \"No… no I don't\"].map(option => (\n <RadioButton\n key={option}\n label={option}\n onChange={(e: ChangeEvent<HTMLInputElement>) => setField({ ...e })}\n />\n ))}\n </RadioButtonGroup>\n </Grid>\n\n <Select label='What would you like to eat?' info='FYI: options are limited'>\n <Option>choose meal…</Option>\n <Option>Pizza</Option>\n <Option>Sandwich</Option>\n <Option>Salad</Option>\n </Select>\n\n <Grid item={{ colStartEnd: '1/-1' }}>\n <TextArea\n name='notes'\n required={notes.required}\n label='Meeting Notes'\n status={notes.status}\n info={notes.info || notes.help}\n onChange={(e: ChangeEvent<HTMLTextAreaElement>) => setField({ ...e })}\n onBlur={(e: FocusEvent<HTMLInputElement>) => setField({ ...e })}\n />\n </Grid>\n\n <Grid item={{ colStartEnd: '1/-1' }}>\n <RichTextEditor\n label='Detailed meeting notes'\n info='The rich text editor can be used in forms, comments, and documents'\n toolbar={[\n 'inline-styling',\n 'headers',\n 'tables',\n 'links',\n 'images',\n 'lists',\n 'cut-copy-paste',\n 'indentation'\n ]}\n onImageAdded={onImageAdded}\n ref={editorRef}\n />\n </Grid>\n <Grid item={{ colStartEnd: '1/-1' }}>\n <FileInputDemo />\n </Grid>\n <ComboboxFilterableStory />\n </Grid>\n </Form>\n );\n};\n"]}
@@ -80,8 +80,8 @@ export const ConfigurableForm = (args) => {
80
80
  </Configuration>);
81
81
  };
82
82
  ConfigurableForm.args = {
83
- foregroundColor: '#000000',
84
- backgroundColor: '#ffffff',
83
+ foregroundColor: '#054a8a',
84
+ backgroundColor: '#e2f1ff',
85
85
  borderColor: '#939393',
86
86
  borderWidth: '0.0625rem',
87
87
  borderRadius: 0.5,
@@ -1 +1 @@
1
- {"version":3,"file":"Form.stories.jsx","sourceRoot":"","sources":["../../../src/core/Form/Form.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { ChangeEvent, FormEvent, useState } from 'react';\n\nimport {\n Banner,\n Button,\n Configuration,\n Flex,\n Form,\n FormField,\n Input\n} from '@pega/cosmos-react-core';\n\nimport { FormContent } from './Form.mocks';\n\nexport default {\n title: 'Core/Form',\n component: Form,\n subcomponents: {\n FormField\n },\n args: {\n heading: 'Form demo',\n description: ''\n },\n argTypes: {\n heading: { control: { type: 'text' } },\n description: { control: { type: 'text' } }\n }\n} as Meta;\ninterface FormStoryProps {\n heading?: string;\n description?: string;\n}\n\nexport const OneColumnForm: Story<FormStoryProps> = (args: FormStoryProps) => {\n return <FormContent cols={1} heading={args.heading} description={args.description} showActions />;\n};\n\nexport const TwoColumnForm: Story<FormStoryProps> = (args: FormStoryProps) => {\n return <FormContent cols={2} heading={args.heading} description={args.description} showActions />;\n};\n\nexport const ThreeColumnForm: Story<FormStoryProps> = (args: FormStoryProps) => {\n return <FormContent cols={3} heading={args.heading} description={args.description} showActions />;\n};\n\nexport const SimpleFormDemo: Story<FormStoryProps & { withBanners?: boolean }> = (\n args: FormStoryProps & { withBanners?: boolean }\n) => {\n const [inputValue, setInputValue] = useState('');\n const [success, setSuccess] = useState('');\n\n const actions = (\n <>\n <Button name='Cancel' variant='secondary' onClick={() => setInputValue('')}>\n Cancel\n </Button>\n <Button name='Submit' type='submit' variant='primary'>\n Submit\n </Button>\n </>\n );\n\n const successBanner = (\n <Banner\n id='success'\n variant='success'\n heading='Success'\n messages={['Form submitted', `Input value: ${success}`]}\n />\n );\n\n const errorBanner = (\n <Banner\n id='error'\n variant='urgent'\n heading='Error'\n messages={['All required fields in the form must be completed.']}\n />\n );\n\n const banner = success ? successBanner : errorBanner;\n\n return (\n <Form\n banners={args.withBanners ? banner : undefined}\n actions={actions}\n heading={args.heading}\n description={args.description}\n onSubmit={(e: FormEvent) => {\n e.preventDefault();\n setSuccess(inputValue);\n setInputValue('');\n }}\n >\n <Flex container={{ direction: 'column', itemGap: 2 }}>\n <Input\n label='Name'\n info='Enter your first name'\n required\n value={inputValue}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n setSuccess('');\n setInputValue(e.target.value);\n }}\n />\n </Flex>\n </Form>\n );\n};\n\nSimpleFormDemo.args = {\n withBanners: false\n};\n\nSimpleFormDemo.argTypes = {\n withBanners: { control: { type: 'boolean' } }\n};\n\ninterface ConfigurableFormProps extends FormStoryProps {\n foregroundColor?: string;\n backgroundColor?: string;\n borderColor?: string;\n borderWidth?: string;\n borderRadius?: number;\n hoverBorderColor?: string;\n focusBorderColor?: string;\n}\n\nexport const ConfigurableForm: Story<ConfigurableFormProps> = (args: ConfigurableFormProps) => {\n return (\n <Configuration\n theme={{\n components: {\n 'form-control': {\n 'foreground-color': args.foregroundColor,\n 'background-color': args.backgroundColor,\n 'border-color': args.borderColor,\n 'border-width': args.borderWidth,\n 'border-radius': args.borderRadius,\n ':hover': {\n 'border-color': args.hoverBorderColor\n },\n ':focus': {\n 'border-color': args.focusBorderColor\n }\n }\n }\n }}\n >\n <FormContent cols={2} showActions />\n </Configuration>\n );\n};\n\nConfigurableForm.args = {\n foregroundColor: '#000000',\n backgroundColor: '#ffffff',\n borderColor: '#939393',\n borderWidth: '0.0625rem',\n borderRadius: 0.5,\n hoverBorderColor: '#3f3f3f',\n focusBorderColor: 'transparent'\n};\n\nConfigurableForm.argTypes = {\n foregroundColor: { control: { type: 'color' } },\n backgroundColor: { control: { type: 'color' } },\n borderColor: { control: { type: 'color' } },\n borderWidth: { control: { type: 'text' } },\n borderRadius: { control: { type: 'number' } },\n hoverBorderColor: { control: { type: 'color' } },\n focusBorderColor: { control: { type: 'color' } },\n heading: { table: { disable: true } },\n description: { table: { disable: true } }\n};\n"]}
1
+ {"version":3,"file":"Form.stories.jsx","sourceRoot":"","sources":["../../../src/core/Form/Form.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { ChangeEvent, FormEvent, useState } from 'react';\n\nimport {\n Banner,\n Button,\n Configuration,\n Flex,\n Form,\n FormField,\n Input\n} from '@pega/cosmos-react-core';\n\nimport { FormContent } from './Form.mocks';\n\nexport default {\n title: 'Core/Form',\n component: Form,\n subcomponents: {\n FormField\n },\n args: {\n heading: 'Form demo',\n description: ''\n },\n argTypes: {\n heading: { control: { type: 'text' } },\n description: { control: { type: 'text' } }\n }\n} as Meta;\ninterface FormStoryProps {\n heading?: string;\n description?: string;\n}\n\nexport const OneColumnForm: Story<FormStoryProps> = (args: FormStoryProps) => {\n return <FormContent cols={1} heading={args.heading} description={args.description} showActions />;\n};\n\nexport const TwoColumnForm: Story<FormStoryProps> = (args: FormStoryProps) => {\n return <FormContent cols={2} heading={args.heading} description={args.description} showActions />;\n};\n\nexport const ThreeColumnForm: Story<FormStoryProps> = (args: FormStoryProps) => {\n return <FormContent cols={3} heading={args.heading} description={args.description} showActions />;\n};\n\nexport const SimpleFormDemo: Story<FormStoryProps & { withBanners?: boolean }> = (\n args: FormStoryProps & { withBanners?: boolean }\n) => {\n const [inputValue, setInputValue] = useState('');\n const [success, setSuccess] = useState('');\n\n const actions = (\n <>\n <Button name='Cancel' variant='secondary' onClick={() => setInputValue('')}>\n Cancel\n </Button>\n <Button name='Submit' type='submit' variant='primary'>\n Submit\n </Button>\n </>\n );\n\n const successBanner = (\n <Banner\n id='success'\n variant='success'\n heading='Success'\n messages={['Form submitted', `Input value: ${success}`]}\n />\n );\n\n const errorBanner = (\n <Banner\n id='error'\n variant='urgent'\n heading='Error'\n messages={['All required fields in the form must be completed.']}\n />\n );\n\n const banner = success ? successBanner : errorBanner;\n\n return (\n <Form\n banners={args.withBanners ? banner : undefined}\n actions={actions}\n heading={args.heading}\n description={args.description}\n onSubmit={(e: FormEvent) => {\n e.preventDefault();\n setSuccess(inputValue);\n setInputValue('');\n }}\n >\n <Flex container={{ direction: 'column', itemGap: 2 }}>\n <Input\n label='Name'\n info='Enter your first name'\n required\n value={inputValue}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n setSuccess('');\n setInputValue(e.target.value);\n }}\n />\n </Flex>\n </Form>\n );\n};\n\nSimpleFormDemo.args = {\n withBanners: false\n};\n\nSimpleFormDemo.argTypes = {\n withBanners: { control: { type: 'boolean' } }\n};\n\ninterface ConfigurableFormProps extends FormStoryProps {\n foregroundColor?: string;\n backgroundColor?: string;\n borderColor?: string;\n borderWidth?: string;\n borderRadius?: number;\n hoverBorderColor?: string;\n focusBorderColor?: string;\n}\n\nexport const ConfigurableForm: Story<ConfigurableFormProps> = (args: ConfigurableFormProps) => {\n return (\n <Configuration\n theme={{\n components: {\n 'form-control': {\n 'foreground-color': args.foregroundColor,\n 'background-color': args.backgroundColor,\n 'border-color': args.borderColor,\n 'border-width': args.borderWidth,\n 'border-radius': args.borderRadius,\n ':hover': {\n 'border-color': args.hoverBorderColor\n },\n ':focus': {\n 'border-color': args.focusBorderColor\n }\n }\n }\n }}\n >\n <FormContent cols={2} showActions />\n </Configuration>\n );\n};\n\nConfigurableForm.args = {\n foregroundColor: '#054a8a',\n backgroundColor: '#e2f1ff',\n borderColor: '#939393',\n borderWidth: '0.0625rem',\n borderRadius: 0.5,\n hoverBorderColor: '#3f3f3f',\n focusBorderColor: 'transparent'\n};\n\nConfigurableForm.argTypes = {\n foregroundColor: { control: { type: 'color' } },\n backgroundColor: { control: { type: 'color' } },\n borderColor: { control: { type: 'color' } },\n borderWidth: { control: { type: 'text' } },\n borderRadius: { control: { type: 'number' } },\n hoverBorderColor: { control: { type: 'color' } },\n focusBorderColor: { control: { type: 'color' } },\n heading: { table: { disable: true } },\n description: { table: { disable: true } }\n};\n"]}
@@ -0,0 +1,6 @@
1
+ import { Meta, Story } from '@storybook/react';
2
+ import { HTMLProps } from '@pega/cosmos-react-core';
3
+ declare const _default: Meta<import("@storybook/react").Args>;
4
+ export default _default;
5
+ export declare const HTMLDemo: Story<HTMLProps>;
6
+ //# sourceMappingURL=HTML.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"HTML.stories.d.ts","sourceRoot":"","sources":["../../../src/core/HTML/HTML.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAQ,SAAS,EAAE,MAAM,yBAAyB,CAAC;;AAE1D,wBAGU;AAEV,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,SAAS,CAA2C,CAAC"}
@@ -0,0 +1,13 @@
1
+ import { HTML } from '@pega/cosmos-react-core';
2
+ export default {
3
+ title: 'Core/HTML',
4
+ component: HTML
5
+ };
6
+ export const HTMLDemo = args => <HTML content={args.content}/>;
7
+ HTMLDemo.args = {
8
+ content: '<p>Hello, World!<p>'
9
+ };
10
+ HTMLDemo.argTypes = {
11
+ content: { control: { type: 'text' } }
12
+ };
13
+ //# sourceMappingURL=HTML.stories.jsx.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"HTML.stories.jsx","sourceRoot":"","sources":["../../../src/core/HTML/HTML.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAa,MAAM,yBAAyB,CAAC;AAE1D,eAAe;IACb,KAAK,EAAE,WAAW;IAClB,SAAS,EAAE,IAAI;CACR,CAAC;AAEV,MAAM,CAAC,MAAM,QAAQ,GAAqB,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,EAAG,CAAC;AAElF,QAAQ,CAAC,IAAI,GAAG;IACd,OAAO,EAAE,qBAAqB;CAC/B,CAAC;AAEF,QAAQ,CAAC,QAAQ,GAAG;IAClB,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;CACvC,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { HTML, HTMLProps } from '@pega/cosmos-react-core';\n\nexport default {\n title: 'Core/HTML',\n component: HTML\n} as Meta;\n\nexport const HTMLDemo: Story<HTMLProps> = args => <HTML content={args.content} />;\n\nHTMLDemo.args = {\n content: '<p>Hello, World!<p>'\n};\n\nHTMLDemo.argTypes = {\n content: { control: { type: 'text' } }\n};\n"]}
@@ -0,0 +1,9 @@
1
+ import { Dispatch } from 'react';
2
+ import { Action } from '@pega/cosmos-react-core';
3
+ import { ViewSelectorProps } from '@pega/cosmos-react-core/lib/components/ListToolbar/ListToolbar.types';
4
+ export declare const actions: Action[];
5
+ export declare const mockViews: ViewSelectorProps['views'];
6
+ export declare const StagedStateDispatchContext: import("react").Context<Dispatch<object>>;
7
+ export declare const FilterRenderer: () => JSX.Element;
8
+ export declare const GroupRenderer: () => JSX.Element;
9
+ //# sourceMappingURL=ListToolbar.mocks.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ListToolbar.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA8B,QAAQ,EAAwB,MAAM,OAAO,CAAC;AAEnF,OAAO,EAGL,MAAM,EAQP,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,sEAAsE,CAAC;AAEzG,eAAO,MAAM,OAAO,EAAE,MAAM,EAIzB,CAAC;AAEJ,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,OAAO,CAIhD,CAAC;AAEF,eAAO,MAAM,0BAA0B,2CAA4C,CAAC;AA6DpF,eAAO,MAAM,cAAc,mBAoB1B,CAAC;AAEF,eAAO,MAAM,aAAa,mBAEzB,CAAC"}
@@ -0,0 +1,71 @@
1
+ import { createContext, useContext, useState } from 'react';
2
+ import { useAfterInitialEffect, useUID, Input, Select, Option, Flex, Button, Icon, Grid } from '@pega/cosmos-react-core';
3
+ export const actions = ['Action 1', 'Action 2', 'Action 3'].map(text => ({
4
+ text,
5
+ id: text,
6
+ icon: 'filter'
7
+ }));
8
+ export const mockViews = [
9
+ { id: '1', text: 'Data view 1', selected: true },
10
+ { id: '2', text: 'Data view 2', selected: false },
11
+ { id: '3', text: 'Data view 3', selected: false }
12
+ ];
13
+ export const StagedStateDispatchContext = createContext(() => { });
14
+ const mockFields = Array.from({ length: 10 }, (_, i) => `Field ${i + 1}`);
15
+ const MockCondition = () => {
16
+ const setStagedState = useContext(StagedStateDispatchContext);
17
+ const conditionId = useUID();
18
+ const [localState, setLocalState] = useState({
19
+ lhs: 'Field 1',
20
+ comparator: 'Equals',
21
+ rhs: ''
22
+ });
23
+ useAfterInitialEffect(() => {
24
+ setStagedState({
25
+ [conditionId]: localState
26
+ });
27
+ }, [conditionId, localState, setStagedState]);
28
+ return (<Grid container={{ gap: 2, cols: 'repeat(3, minmax(0, 1fr))' }}>
29
+ <Select label='Field' onChange={(e) => {
30
+ setLocalState(cur => ({ ...cur, lhs: e.target.value }));
31
+ }}>
32
+ {mockFields.map(field => {
33
+ return (<Option value={field} key={field}>
34
+ {field}
35
+ </Option>);
36
+ })}
37
+ </Select>
38
+ <Select label='Comparator' onChange={(e) => {
39
+ setLocalState(cur => ({ ...cur, comparator: e.target.value }));
40
+ }}>
41
+ {['Equals', 'Contains', 'Starts with'].map(comparator => {
42
+ return (<Option value={comparator} key={comparator}>
43
+ {comparator}
44
+ </Option>);
45
+ })}
46
+ </Select>
47
+ <Input label='Value' value={localState.rhs} onChange={(e) => {
48
+ setLocalState(cur => ({ ...cur, rhs: e.target.value }));
49
+ }}/>
50
+ </Grid>);
51
+ };
52
+ export const FilterRenderer = () => {
53
+ const [conditions, setConditions] = useState(() => [<MockCondition key={1}/>]);
54
+ return (<Flex container={{ direction: 'column', gap: 2 }}>
55
+ {conditions}
56
+ <div>
57
+ <Button variant='link' onClick={() => {
58
+ setConditions(cur => [...cur, <MockCondition key={cur.length + 1}/>]);
59
+ }}>
60
+ <Flex container={{ inline: true, alignItems: 'start', gap: 1 }} as='span'>
61
+ <Icon name='plus'/>
62
+ <span>Add condition</span>
63
+ </Flex>
64
+ </Button>
65
+ </div>
66
+ </Flex>);
67
+ };
68
+ export const GroupRenderer = () => {
69
+ return <>GroupBy content goes here...</>;
70
+ };
71
+ //# sourceMappingURL=ListToolbar.mocks.jsx.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ListToolbar.mocks.jsx","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,aAAa,EAAY,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEnF,OAAO,EACL,qBAAqB,EACrB,MAAM,EAEN,KAAK,EACL,MAAM,EACN,MAAM,EACN,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,IAAI,EACL,MAAM,yBAAyB,CAAC;AAGjC,MAAM,CAAC,MAAM,OAAO,GAAa,CAAC,UAAU,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACjF,IAAI;IACJ,EAAE,EAAE,IAAI;IACR,IAAI,EAAE,QAAQ;CACf,CAAC,CAAC,CAAC;AAEJ,MAAM,CAAC,MAAM,SAAS,GAA+B;IACnD,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,aAAa,EAAE,QAAQ,EAAE,IAAI,EAAE;IAChD,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE;IACjD,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE;CAClD,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG,aAAa,CAAmB,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;AAEpF,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;AAE1E,MAAM,aAAa,GAAG,GAAG,EAAE;IACzB,MAAM,cAAc,GAAG,UAAU,CAAC,0BAA0B,CAAC,CAAC;IAC9D,MAAM,WAAW,GAAG,MAAM,EAAE,CAAC;IAE7B,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC;QAC3C,GAAG,EAAE,SAAS;QACd,UAAU,EAAE,QAAQ;QACpB,GAAG,EAAE,EAAE;KACR,CAAC,CAAC;IAEH,qBAAqB,CAAC,GAAG,EAAE;QACzB,cAAc,CAAC;YACb,CAAC,WAAW,CAAC,EAAE,UAAU;SAC1B,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,WAAW,EAAE,UAAU,EAAE,cAAc,CAAC,CAAC,CAAC;IAE9C,OAAO,CACL,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,2BAA2B,EAAE,CAAC,CAC7D;MAAA,CAAC,MAAM,CACL,KAAK,CAAC,OAAO,CACb,QAAQ,CAAC,CAAC,CAAC,CAAiC,EAAE,EAAE;YAC9C,aAAa,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QAC1D,CAAC,CAAC,CAEF;QAAA,CAAC,UAAU,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;YACtB,OAAO,CACL,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,CAC/B;cAAA,CAAC,KAAK,CACR;YAAA,EAAE,MAAM,CAAC,CACV,CAAC;QACJ,CAAC,CAAC,CACJ;MAAA,EAAE,MAAM,CACR;MAAA,CAAC,MAAM,CACL,KAAK,CAAC,YAAY,CAClB,QAAQ,CAAC,CAAC,CAAC,CAAiC,EAAE,EAAE;YAC9C,aAAa,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QACjE,CAAC,CAAC,CAEF;QAAA,CAAC,CAAC,QAAQ,EAAE,UAAU,EAAE,aAAa,CAAC,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE;YACtD,OAAO,CACL,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,UAAU,CAAC,CACzC;cAAA,CAAC,UAAU,CACb;YAAA,EAAE,MAAM,CAAC,CACV,CAAC;QACJ,CAAC,CAAC,CACJ;MAAA,EAAE,MAAM,CACR;MAAA,CAAC,KAAK,CACJ,KAAK,CAAC,OAAO,CACb,KAAK,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC,CACtB,QAAQ,CAAC,CAAC,CAAC,CAAgC,EAAE,EAAE;YAC7C,aAAa,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QAC1D,CAAC,CAAC,EAEN;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IACjC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAgB,GAAG,EAAE,CAAC,CAAC,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EAAG,CAAC,CAAC,CAAC;IAC/F,OAAO,CACL,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC,CAC/C;MAAA,CAAC,UAAU,CACX;MAAA,CAAC,GAAG,CACF;QAAA,CAAC,MAAM,CACL,OAAO,CAAC,MAAM,CACd,OAAO,CAAC,CAAC,GAAG,EAAE;YACZ,aAAa,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,GAAG,EAAE,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,MAAM,GAAG,CAAC,CAAC,EAAG,CAAC,CAAC,CAAC;QACzE,CAAC,CAAC,CAEF;UAAA,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,MAAM,CACvE;YAAA,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,EACjB;YAAA,CAAC,IAAI,CAAC,aAAa,EAAE,IAAI,CAC3B;UAAA,EAAE,IAAI,CACR;QAAA,EAAE,MAAM,CACV;MAAA,EAAE,GAAG,CACP;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE;IAChC,OAAO,EAAE,4BAA4B,GAAG,CAAC;AAC3C,CAAC,CAAC","sourcesContent":["import { ChangeEvent, createContext, Dispatch, useContext, useState } from 'react';\n\nimport {\n useAfterInitialEffect,\n useUID,\n Action,\n Input,\n Select,\n Option,\n Flex,\n Button,\n Icon,\n Grid\n} from '@pega/cosmos-react-core';\nimport { ViewSelectorProps } from '@pega/cosmos-react-core/lib/components/ListToolbar/ListToolbar.types';\n\nexport const actions: Action[] = ['Action 1', 'Action 2', 'Action 3'].map(text => ({\n text,\n id: text,\n icon: 'filter'\n}));\n\nexport const mockViews: ViewSelectorProps['views'] = [\n { id: '1', text: 'Data view 1', selected: true },\n { id: '2', text: 'Data view 2', selected: false },\n { id: '3', text: 'Data view 3', selected: false }\n];\n\nexport const StagedStateDispatchContext = createContext<Dispatch<object>>(() => {});\n\nconst mockFields = Array.from({ length: 10 }, (_, i) => `Field ${i + 1}`);\n\nconst MockCondition = () => {\n const setStagedState = useContext(StagedStateDispatchContext);\n const conditionId = useUID();\n\n const [localState, setLocalState] = useState({\n lhs: 'Field 1',\n comparator: 'Equals',\n rhs: ''\n });\n\n useAfterInitialEffect(() => {\n setStagedState({\n [conditionId]: localState\n });\n }, [conditionId, localState, setStagedState]);\n\n return (\n <Grid container={{ gap: 2, cols: 'repeat(3, minmax(0, 1fr))' }}>\n <Select\n label='Field'\n onChange={(e: ChangeEvent<HTMLSelectElement>) => {\n setLocalState(cur => ({ ...cur, lhs: e.target.value }));\n }}\n >\n {mockFields.map(field => {\n return (\n <Option value={field} key={field}>\n {field}\n </Option>\n );\n })}\n </Select>\n <Select\n label='Comparator'\n onChange={(e: ChangeEvent<HTMLSelectElement>) => {\n setLocalState(cur => ({ ...cur, comparator: e.target.value }));\n }}\n >\n {['Equals', 'Contains', 'Starts with'].map(comparator => {\n return (\n <Option value={comparator} key={comparator}>\n {comparator}\n </Option>\n );\n })}\n </Select>\n <Input\n label='Value'\n value={localState.rhs}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n setLocalState(cur => ({ ...cur, rhs: e.target.value }));\n }}\n />\n </Grid>\n );\n};\n\nexport const FilterRenderer = () => {\n const [conditions, setConditions] = useState<JSX.Element[]>(() => [<MockCondition key={1} />]);\n return (\n <Flex container={{ direction: 'column', gap: 2 }}>\n {conditions}\n <div>\n <Button\n variant='link'\n onClick={() => {\n setConditions(cur => [...cur, <MockCondition key={cur.length + 1} />]);\n }}\n >\n <Flex container={{ inline: true, alignItems: 'start', gap: 1 }} as='span'>\n <Icon name='plus' />\n <span>Add condition</span>\n </Flex>\n </Button>\n </div>\n </Flex>\n );\n};\n\nexport const GroupRenderer = () => {\n return <>GroupBy content goes here...</>;\n};\n"]}
@@ -0,0 +1,7 @@
1
+ /// <reference types="react" />
2
+ import { Meta } from '@storybook/react';
3
+ declare const _default: Meta<import("@storybook/react").Args>;
4
+ export default _default;
5
+ export declare const ListToolbarDemo: () => JSX.Element;
6
+ export declare const SimpleToolbarDemo: () => JSX.Element;
7
+ //# sourceMappingURL=ListToolbar.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ListToolbar.stories.d.ts","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;;AAexC,wBAGU;AAIV,eAAO,MAAM,eAAe,mBAsF3B,CAAC;AAEF,eAAO,MAAM,iBAAiB,mBAa7B,CAAC"}
@@ -0,0 +1,87 @@
1
+ import { useMemo, useState } from 'react';
2
+ import { action } from '@storybook/addon-actions';
3
+ import { Card, CardHeader, ListToolbar } from '@pega/cosmos-react-core';
4
+ import { mockViews, actions, FilterRenderer, StagedStateDispatchContext, GroupRenderer } from './ListToolbar.mocks';
5
+ export default {
6
+ title: 'Core/ListToolbar',
7
+ component: ListToolbar
8
+ };
9
+ export const ListToolbarDemo = () => {
10
+ const [stagedQueryOptionState, setStagedQueryOptionState] = useState(null);
11
+ const [views, setViews] = useState(mockViews);
12
+ const [currentSort, setCurrentSort] = useState(null);
13
+ const filterProp = useMemo(() => {
14
+ return {
15
+ value: stagedQueryOptionState,
16
+ count: undefined,
17
+ renderer: FilterRenderer,
18
+ onCancel: () => {
19
+ setStagedQueryOptionState(null);
20
+ },
21
+ onSubmit: () => {
22
+ setStagedQueryOptionState(cur => {
23
+ console.table(cur);
24
+ return null;
25
+ });
26
+ }
27
+ };
28
+ }, [stagedQueryOptionState]);
29
+ const sortProp = useMemo(() => {
30
+ return {
31
+ mode: 'single-select',
32
+ count: currentSort ? 1 : undefined,
33
+ items: [
34
+ {
35
+ id: 'asc',
36
+ text: 'Ascending',
37
+ icon: 'arrow-up',
38
+ selected: currentSort === 'asc'
39
+ },
40
+ {
41
+ id: 'desc',
42
+ text: 'Descending',
43
+ icon: 'arrow-down',
44
+ selected: currentSort === 'desc'
45
+ }
46
+ ],
47
+ onItemClick: id => {
48
+ setCurrentSort(cur => {
49
+ return cur === id ? null : id;
50
+ });
51
+ }
52
+ };
53
+ }, [currentSort]);
54
+ const groupProp = useMemo(() => {
55
+ return {
56
+ count: undefined,
57
+ renderer: GroupRenderer,
58
+ onCancel: () => { },
59
+ onSubmit: () => { }
60
+ };
61
+ }, []);
62
+ return (<Card>
63
+ <CardHeader>
64
+ <StagedStateDispatchContext.Provider value={setStagedQueryOptionState}>
65
+ <ListToolbar heading={{
66
+ views,
67
+ onViewSelect: id => {
68
+ setViews(cur => {
69
+ return cur.map(view => ({ ...view, selected: view.id === id }));
70
+ });
71
+ }
72
+ }} onCreateNew={action('Clicked Create New')} search={{ onSearchSubmit: action('Search submit') }} count={{
73
+ total: 32,
74
+ selected: 4
75
+ }} filter={filterProp} sort={sortProp} group={groupProp} actions={actions}/>
76
+ </StagedStateDispatchContext.Provider>
77
+ </CardHeader>
78
+ </Card>);
79
+ };
80
+ export const SimpleToolbarDemo = () => {
81
+ return (<Card>
82
+ <CardHeader>
83
+ <ListToolbar heading='Top accounts in California' search={{ onSearchSubmit: action('Search submit') }} count={{ total: 212 }} actions={actions}/>
84
+ </CardHeader>
85
+ </Card>);
86
+ };
87
+ //# sourceMappingURL=ListToolbar.stories.jsx.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ListToolbar.stories.jsx","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta } from '@storybook/react';\nimport { useMemo, useState } from 'react';\nimport { action } from '@storybook/addon-actions';\n\nimport { Card, CardHeader, ListToolbar } from '@pega/cosmos-react-core';\nimport { PresetMenuProps } from '@pega/cosmos-react-core/lib/components/ListToolbar/ListToolbar.types';\n\nimport {\n mockViews,\n actions,\n FilterRenderer,\n StagedStateDispatchContext,\n GroupRenderer\n} from './ListToolbar.mocks';\n\nexport default {\n title: 'Core/ListToolbar',\n component: ListToolbar\n} as Meta;\n\ntype SortString = 'asc' | 'desc';\n\nexport const ListToolbarDemo = () => {\n const [stagedQueryOptionState, setStagedQueryOptionState] = useState<object | null>(null);\n const [views, setViews] = useState(mockViews);\n const [currentSort, setCurrentSort] = useState<SortString | null>(null);\n\n const filterProp = useMemo(() => {\n return {\n value: stagedQueryOptionState,\n count: undefined,\n renderer: FilterRenderer,\n onCancel: () => {\n setStagedQueryOptionState(null);\n },\n onSubmit: () => {\n setStagedQueryOptionState(cur => {\n // eslint-disable-next-line no-console\n console.table(cur);\n return null;\n });\n }\n };\n }, [stagedQueryOptionState]);\n\n const sortProp: PresetMenuProps = useMemo(() => {\n return {\n mode: 'single-select',\n count: currentSort ? 1 : undefined,\n items: [\n {\n id: 'asc',\n text: 'Ascending',\n icon: 'arrow-up',\n selected: currentSort === 'asc'\n },\n {\n id: 'desc',\n text: 'Descending',\n icon: 'arrow-down',\n selected: currentSort === 'desc'\n }\n ],\n onItemClick: id => {\n setCurrentSort(cur => {\n return cur === id ? null : (id as SortString);\n });\n }\n };\n }, [currentSort]);\n\n const groupProp = useMemo(() => {\n return {\n count: undefined,\n renderer: GroupRenderer,\n onCancel: () => {},\n onSubmit: () => {}\n };\n }, []);\n\n return (\n <Card>\n <CardHeader>\n <StagedStateDispatchContext.Provider value={setStagedQueryOptionState}>\n <ListToolbar\n heading={{\n views,\n onViewSelect: id => {\n setViews(cur => {\n return cur.map(view => ({ ...view, selected: view.id === id }));\n });\n }\n }}\n onCreateNew={action('Clicked Create New')}\n search={{ onSearchSubmit: action('Search submit') }}\n count={{\n total: 32,\n selected: 4\n }}\n filter={filterProp}\n sort={sortProp}\n group={groupProp}\n actions={actions}\n />\n </StagedStateDispatchContext.Provider>\n </CardHeader>\n </Card>\n );\n};\n\nexport const SimpleToolbarDemo = () => {\n return (\n <Card>\n <CardHeader>\n <ListToolbar\n heading='Top accounts in California'\n search={{ onSearchSubmit: action('Search submit') }}\n count={{ total: 212 }}\n actions={actions}\n />\n </CardHeader>\n </Card>\n );\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Modal/Modal.mocks.tsx"],"names":[],"mappings":";AAOA,oBAAY,YAAY,GACpB,YAAY,GACZ,WAAW,GACX,OAAO,GACP,OAAO,GACP,iBAAiB,GACjB,iBAAiB,GACjB,iBAAiB,GACjB,QAAQ,CAAC;AAab,eAAO,MAAM,UAAU,gBAAiB,YAAY,wBAAwB,OAAO,gBAiClF,CAAC"}
1
+ {"version":3,"file":"Modal.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Modal/Modal.mocks.tsx"],"names":[],"mappings":";AAQA,oBAAY,YAAY,GACpB,YAAY,GACZ,WAAW,GACX,OAAO,GACP,OAAO,GACP,iBAAiB,GACjB,iBAAiB,GACjB,iBAAiB,GACjB,QAAQ,CAAC;AAab,eAAO,MAAM,UAAU,gBAAiB,YAAY,wBAAwB,OAAO,gBAiClF,CAAC"}
@@ -1,7 +1,7 @@
1
1
  import { Flex, Text } from '@pega/cosmos-react-core';
2
- import { ImageDemo } from '@pega/cosmos-react-demos/lib/core/Image/Image.stories';
3
- import { TableDemo } from '@pega/cosmos-react-demos/lib/core/Table/Table.stories';
4
- import { FormContent } from '@pega/cosmos-react-demos/lib/core/Form/Form.mocks';
2
+ import { ImageDemo } from '../Image/Image.stories';
3
+ import { TableDemo } from '../Table/Table.stories';
4
+ import { FormContent } from '../Form/Form.mocks';
5
5
  const getRandomContentType = (contentType) => {
6
6
  const contentMap = {
7
7
  text: ['short text', 'long text'],
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.mocks.jsx","sourceRoot":"","sources":["../../../src/core/Modal/Modal.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,uDAAuD,CAAC;AAClF,OAAO,EAAE,SAAS,EAAE,MAAM,uDAAuD,CAAC;AAClF,OAAO,EAAE,WAAW,EAAE,MAAM,mDAAmD,CAAC;AAchF,MAAM,oBAAoB,GAAG,CAAC,WAA4B,EAAgB,EAAE;IAC1E,MAAM,UAAU,GAA4C;QAC1D,IAAI,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC;QACjC,IAAI,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC;QACxB,IAAI,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,EAAE,iBAAiB,CAAC;KAChE,CAAC;IACF,MAAM,OAAO,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IAExC,OAAO,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;AAC7D,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,WAAyB,EAAE,oBAA6B,EAAE,EAAE;IACrF,QAAQ,WAAW,EAAE;QACnB,KAAK,QAAQ;YACX,OAAO,CACL,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC,CAC/C;UAAA,CAAC,UAAU,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,CAChD;UAAA,CAAC,UAAU,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,CAChD;UAAA,CAAC,UAAU,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,oBAAoB,CAAC,CACjE;QAAA,EAAE,IAAI,CAAC,CACR,CAAC;QACJ,KAAK,OAAO;YACV,OAAO,CAAC,SAAS,CAAC,AAAD,EAAG,CAAC;QACvB,KAAK,OAAO;YACV,OAAO,CAAC,SAAS,CAAC,AAAD,EAAG,CAAC;QACvB,KAAK,iBAAiB;YACpB,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,KAAK,CAAC,EAAG,CAAC;QACtD,KAAK,iBAAiB;YACpB,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,KAAK,CAAC,EAAG,CAAC;QACtD,KAAK,iBAAiB;YACpB,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,KAAK,CAAC,EAAG,CAAC;QACtD,KAAK,WAAW;YACd,OAAO,CACL,CAAC,IAAI,CACH;;;;;QAIF,EAAE,IAAI,CAAC,CACR,CAAC;QACJ,KAAK,YAAY,CAAC;QAClB;YACE,OAAO,CAAC,IAAI,CAAC,2BAA2B,EAAE,IAAI,CAAC,CAAC;KACnD;AACH,CAAC,CAAC","sourcesContent":["import { Flex, Text } from '@pega/cosmos-react-core';\nimport { ImageDemo } from '@pega/cosmos-react-demos/lib/core/Image/Image.stories';\nimport { TableDemo } from '@pega/cosmos-react-demos/lib/core/Table/Table.stories';\nimport { FormContent } from '@pega/cosmos-react-demos/lib/core/Form/Form.mocks';\n\ntype ContentSections = 'text' | 'meta' | 'form';\n\nexport type ContentTypes =\n | 'short text'\n | 'long text'\n | 'image'\n | 'table'\n | 'form (1 column)'\n | 'form (2 column)'\n | 'form (3 column)'\n | 'random';\n\nconst getRandomContentType = (contentType: ContentSections): ContentTypes => {\n const contentMap: Record<ContentSections, ContentTypes[]> = {\n text: ['short text', 'long text'],\n meta: ['image', 'table'],\n form: ['form (1 column)', 'form (2 column)', 'form (3 column)']\n };\n const options = contentMap[contentType];\n\n return options[Math.floor(Math.random() * options.length)];\n};\n\nexport const getContent = (contentType: ContentTypes, formColumnWidthFixed: boolean) => {\n switch (contentType) {\n case 'random':\n return (\n <Flex container={{ direction: 'column', gap: 4 }}>\n {getContent(getRandomContentType('text'), false)}\n {getContent(getRandomContentType('meta'), false)}\n {getContent(getRandomContentType('form'), formColumnWidthFixed)}\n </Flex>\n );\n case 'image':\n return <ImageDemo />;\n case 'table':\n return <TableDemo />;\n case 'form (1 column)':\n return <FormContent cols={1} showActions={false} />;\n case 'form (2 column)':\n return <FormContent cols={2} showActions={false} />;\n case 'form (3 column)':\n return <FormContent cols={3} showActions={false} />;\n case 'long text':\n return (\n <Text>\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fermentum ipsum ipsum, nec\n sodales risus finibus eget. Proin ornare, ante ac convallis sollicitudin, elit turpis\n venenatis lorem, vitae viverra eros magna non lectus. Duis ac auctor sapien. Donec\n malesuada eros ut libero sodales, malesuada ullamcorper lacus eleifend.\n </Text>\n );\n case 'short text':\n default:\n return <Text>Lorem ipsum dolor sit amet.</Text>;\n }\n};\n"]}
1
+ {"version":3,"file":"Modal.mocks.jsx","sourceRoot":"","sources":["../../../src/core/Modal/Modal.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAErD,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAcjD,MAAM,oBAAoB,GAAG,CAAC,WAA4B,EAAgB,EAAE;IAC1E,MAAM,UAAU,GAA4C;QAC1D,IAAI,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC;QACjC,IAAI,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC;QACxB,IAAI,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,EAAE,iBAAiB,CAAC;KAChE,CAAC;IACF,MAAM,OAAO,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IAExC,OAAO,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;AAC7D,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,WAAyB,EAAE,oBAA6B,EAAE,EAAE;IACrF,QAAQ,WAAW,EAAE;QACnB,KAAK,QAAQ;YACX,OAAO,CACL,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC,CAC/C;UAAA,CAAC,UAAU,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,CAChD;UAAA,CAAC,UAAU,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,CAChD;UAAA,CAAC,UAAU,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,oBAAoB,CAAC,CACjE;QAAA,EAAE,IAAI,CAAC,CACR,CAAC;QACJ,KAAK,OAAO;YACV,OAAO,CAAC,SAAS,CAAC,AAAD,EAAG,CAAC;QACvB,KAAK,OAAO;YACV,OAAO,CAAC,SAAS,CAAC,AAAD,EAAG,CAAC;QACvB,KAAK,iBAAiB;YACpB,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,KAAK,CAAC,EAAG,CAAC;QACtD,KAAK,iBAAiB;YACpB,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,KAAK,CAAC,EAAG,CAAC;QACtD,KAAK,iBAAiB;YACpB,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,KAAK,CAAC,EAAG,CAAC;QACtD,KAAK,WAAW;YACd,OAAO,CACL,CAAC,IAAI,CACH;;;;;QAIF,EAAE,IAAI,CAAC,CACR,CAAC;QACJ,KAAK,YAAY,CAAC;QAClB;YACE,OAAO,CAAC,IAAI,CAAC,2BAA2B,EAAE,IAAI,CAAC,CAAC;KACnD;AACH,CAAC,CAAC","sourcesContent":["import { Flex, Text } from '@pega/cosmos-react-core';\n\nimport { ImageDemo } from '../Image/Image.stories';\nimport { TableDemo } from '../Table/Table.stories';\nimport { FormContent } from '../Form/Form.mocks';\n\ntype ContentSections = 'text' | 'meta' | 'form';\n\nexport type ContentTypes =\n | 'short text'\n | 'long text'\n | 'image'\n | 'table'\n | 'form (1 column)'\n | 'form (2 column)'\n | 'form (3 column)'\n | 'random';\n\nconst getRandomContentType = (contentType: ContentSections): ContentTypes => {\n const contentMap: Record<ContentSections, ContentTypes[]> = {\n text: ['short text', 'long text'],\n meta: ['image', 'table'],\n form: ['form (1 column)', 'form (2 column)', 'form (3 column)']\n };\n const options = contentMap[contentType];\n\n return options[Math.floor(Math.random() * options.length)];\n};\n\nexport const getContent = (contentType: ContentTypes, formColumnWidthFixed: boolean) => {\n switch (contentType) {\n case 'random':\n return (\n <Flex container={{ direction: 'column', gap: 4 }}>\n {getContent(getRandomContentType('text'), false)}\n {getContent(getRandomContentType('meta'), false)}\n {getContent(getRandomContentType('form'), formColumnWidthFixed)}\n </Flex>\n );\n case 'image':\n return <ImageDemo />;\n case 'table':\n return <TableDemo />;\n case 'form (1 column)':\n return <FormContent cols={1} showActions={false} />;\n case 'form (2 column)':\n return <FormContent cols={2} showActions={false} />;\n case 'form (3 column)':\n return <FormContent cols={3} showActions={false} />;\n case 'long text':\n return (\n <Text>\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fermentum ipsum ipsum, nec\n sodales risus finibus eget. Proin ornare, ante ac convallis sollicitudin, elit turpis\n venenatis lorem, vitae viverra eros magna non lectus. Duis ac auctor sapien. Donec\n malesuada eros ut libero sodales, malesuada ullamcorper lacus eleifend.\n </Text>\n );\n case 'short text':\n default:\n return <Text>Lorem ipsum dolor sit amet.</Text>;\n }\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Modal/Modal.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAY/C,OAAO,EAQL,UAAU,EAKX,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,YAAY,EAAc,MAAM,eAAe,CAAC;;AAEzD,wBAgBU;AAEV,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,UAAU,CA+BvC,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,UAAU,CAkE1C,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,UAAU,CAgGxC,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,UAAU,CA2F3C,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,UAAU,CAkC9C,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAiCzB,CAAC;AAQF,UAAU,0BAA0B;IAClC,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,YAAY,CAAC;IACtB,oBAAoB,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;CAChB;AAED,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,0BAA0B,CAgEnE,CAAC"}
1
+ {"version":3,"file":"Modal.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Modal/Modal.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAY/C,OAAO,EAOL,UAAU,EAIX,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,YAAY,EAAc,MAAM,eAAe,CAAC;;AAEzD,wBAgBU;AAEV,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,UAAU,CA6BvC,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,UAAU,CAgE1C,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,UAAU,CA4FxC,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,UAAU,CA2F3C,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,UAAU,CAgC9C,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KA+BzB,CAAC;AAQF,UAAU,0BAA0B;IAClC,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,YAAY,CAAC;IACtB,oBAAoB,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;CAChB;AAED,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,0BAA0B,CA8DnE,CAAC"}