@pega/cosmos-react-work 2.0.0-dev.9.4 → 2.0.0-rc.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 (163) hide show
  1. package/lib/components/AppAnnouncement/AppAnnouncement.d.ts.map +1 -1
  2. package/lib/components/AppAnnouncement/AppAnnouncement.js +5 -7
  3. package/lib/components/AppAnnouncement/AppAnnouncement.js.map +1 -1
  4. package/lib/components/CaseHeader/CaseHeader.d.ts.map +1 -1
  5. package/lib/components/CaseHeader/CaseHeader.js +8 -8
  6. package/lib/components/CaseHeader/CaseHeader.js.map +1 -1
  7. package/lib/components/CasePreview/CasePreview.d.ts.map +1 -1
  8. package/lib/components/CasePreview/CasePreview.js +13 -10
  9. package/lib/components/CasePreview/CasePreview.js.map +1 -1
  10. package/lib/components/CaseSummary/CaseSummary.d.ts +18 -1
  11. package/lib/components/CaseSummary/CaseSummary.d.ts.map +1 -1
  12. package/lib/components/CaseSummary/CaseSummary.js +121 -9
  13. package/lib/components/CaseSummary/CaseSummary.js.map +1 -1
  14. package/lib/components/CaseSummaryFields/CaseSummaryFields.d.ts.map +1 -1
  15. package/lib/components/CaseSummaryFields/CaseSummaryFields.js +12 -10
  16. package/lib/components/CaseSummaryFields/CaseSummaryFields.js.map +1 -1
  17. package/lib/components/CaseView/CaseView.d.ts +6 -26
  18. package/lib/components/CaseView/CaseView.d.ts.map +1 -1
  19. package/lib/components/CaseView/CaseView.js +136 -183
  20. package/lib/components/CaseView/CaseView.js.map +1 -1
  21. package/lib/components/CaseView/CaseView.styles.d.ts +24 -0
  22. package/lib/components/CaseView/CaseView.styles.d.ts.map +1 -0
  23. package/lib/components/CaseView/CaseView.styles.js +111 -0
  24. package/lib/components/CaseView/CaseView.styles.js.map +1 -0
  25. package/lib/components/CaseView/MobileCaseView.js +1 -3
  26. package/lib/components/CaseView/MobileCaseView.js.map +1 -1
  27. package/lib/components/CaseView/UtilitiesSummary.js +4 -5
  28. package/lib/components/CaseView/UtilitiesSummary.js.map +1 -1
  29. package/lib/components/CaseView/index.d.ts +2 -1
  30. package/lib/components/CaseView/index.d.ts.map +1 -1
  31. package/lib/components/CaseView/index.js +1 -1
  32. package/lib/components/CaseView/index.js.map +1 -1
  33. package/lib/components/ConfigurableLayout/ConfigurableLayout.d.ts +4 -0
  34. package/lib/components/ConfigurableLayout/ConfigurableLayout.d.ts.map +1 -0
  35. package/lib/components/ConfigurableLayout/ConfigurableLayout.js +93 -0
  36. package/lib/components/ConfigurableLayout/ConfigurableLayout.js.map +1 -0
  37. package/lib/components/ConfigurableLayout/ConfigurableLayout.types.d.ts +43 -0
  38. package/lib/components/ConfigurableLayout/ConfigurableLayout.types.d.ts.map +1 -0
  39. package/lib/components/ConfigurableLayout/ConfigurableLayout.types.js +2 -0
  40. package/lib/components/ConfigurableLayout/ConfigurableLayout.types.js.map +1 -0
  41. package/lib/components/ConfigurableLayout/LayoutCell.d.ts +6 -0
  42. package/lib/components/ConfigurableLayout/LayoutCell.d.ts.map +1 -0
  43. package/lib/components/ConfigurableLayout/LayoutCell.js +64 -0
  44. package/lib/components/ConfigurableLayout/LayoutCell.js.map +1 -0
  45. package/lib/components/ConfigurableLayout/defaults.d.ts +4 -0
  46. package/lib/components/ConfigurableLayout/defaults.d.ts.map +1 -0
  47. package/lib/components/ConfigurableLayout/defaults.js +4 -0
  48. package/lib/components/ConfigurableLayout/defaults.js.map +1 -0
  49. package/lib/components/ConfigurableLayout/index.d.ts +3 -0
  50. package/lib/components/ConfigurableLayout/index.d.ts.map +1 -0
  51. package/lib/components/ConfigurableLayout/index.js +3 -0
  52. package/lib/components/ConfigurableLayout/index.js.map +1 -0
  53. package/lib/components/ConfigurableLayout/options.d.ts +10 -0
  54. package/lib/components/ConfigurableLayout/options.d.ts.map +1 -0
  55. package/lib/components/ConfigurableLayout/options.js +10 -0
  56. package/lib/components/ConfigurableLayout/options.js.map +1 -0
  57. package/lib/components/ConfigurableLayout/useTrackWrappedRegions.d.ts +7 -0
  58. package/lib/components/ConfigurableLayout/useTrackWrappedRegions.d.ts.map +1 -0
  59. package/lib/components/ConfigurableLayout/useTrackWrappedRegions.js +37 -0
  60. package/lib/components/ConfigurableLayout/useTrackWrappedRegions.js.map +1 -0
  61. package/lib/components/Confirmation/Confirmation.d.ts +19 -0
  62. package/lib/components/Confirmation/Confirmation.d.ts.map +1 -0
  63. package/lib/components/Confirmation/Confirmation.js +14 -0
  64. package/lib/components/Confirmation/Confirmation.js.map +1 -0
  65. package/lib/components/Confirmation/index.d.ts +3 -0
  66. package/lib/components/Confirmation/index.d.ts.map +1 -0
  67. package/lib/components/Confirmation/index.js +2 -0
  68. package/lib/components/Confirmation/index.js.map +1 -0
  69. package/lib/components/Details/Details.d.ts +13 -0
  70. package/lib/components/Details/Details.d.ts.map +1 -0
  71. package/lib/components/Details/Details.js +38 -0
  72. package/lib/components/Details/Details.js.map +1 -0
  73. package/lib/components/Details/index.d.ts +4 -0
  74. package/lib/components/Details/index.d.ts.map +1 -0
  75. package/lib/components/Details/index.js +3 -0
  76. package/lib/components/Details/index.js.map +1 -0
  77. package/lib/components/Glimpse/Glimpse.js +1 -2
  78. package/lib/components/Glimpse/Glimpse.js.map +1 -1
  79. package/lib/components/SearchResults/Filter.d.ts.map +1 -1
  80. package/lib/components/SearchResults/Filter.js +10 -42
  81. package/lib/components/SearchResults/Filter.js.map +1 -1
  82. package/lib/components/SearchResults/SearchResult.js +1 -4
  83. package/lib/components/SearchResults/SearchResult.js.map +1 -1
  84. package/lib/components/SearchResults/SearchResults.d.ts.map +1 -1
  85. package/lib/components/SearchResults/SearchResults.js +33 -69
  86. package/lib/components/SearchResults/SearchResults.js.map +1 -1
  87. package/lib/components/SearchResults/SearchResults.styles.d.ts +8 -0
  88. package/lib/components/SearchResults/SearchResults.styles.d.ts.map +1 -0
  89. package/lib/components/SearchResults/SearchResults.styles.js +67 -0
  90. package/lib/components/SearchResults/SearchResults.styles.js.map +1 -0
  91. package/lib/components/SearchResults/SearchResults.types.d.ts +14 -4
  92. package/lib/components/SearchResults/SearchResults.types.d.ts.map +1 -1
  93. package/lib/components/SearchResults/SearchResults.types.js.map +1 -1
  94. package/lib/components/Stages/Stages.d.ts.map +1 -1
  95. package/lib/components/Stages/Stages.js +13 -15
  96. package/lib/components/Stages/Stages.js.map +1 -1
  97. package/lib/components/Stages/Stages.styles.d.ts.map +1 -1
  98. package/lib/components/Stages/Stages.styles.js +2 -2
  99. package/lib/components/Stages/Stages.styles.js.map +1 -1
  100. package/lib/components/Stages/Steps.d.ts.map +1 -1
  101. package/lib/components/Stages/Steps.js +5 -3
  102. package/lib/components/Stages/Steps.js.map +1 -1
  103. package/lib/components/Stages/StepsContainer.d.ts.map +1 -1
  104. package/lib/components/Stages/StepsContainer.js +4 -6
  105. package/lib/components/Stages/StepsContainer.js.map +1 -1
  106. package/lib/components/Stakeholders/StakeholderForm.d.ts +7 -0
  107. package/lib/components/Stakeholders/StakeholderForm.d.ts.map +1 -0
  108. package/lib/components/Stakeholders/StakeholderForm.js +49 -0
  109. package/lib/components/Stakeholders/StakeholderForm.js.map +1 -0
  110. package/lib/components/Stakeholders/Stakeholders.d.ts +6 -0
  111. package/lib/components/Stakeholders/Stakeholders.d.ts.map +1 -0
  112. package/lib/components/Stakeholders/Stakeholders.js +215 -0
  113. package/lib/components/Stakeholders/Stakeholders.js.map +1 -0
  114. package/lib/components/Stakeholders/Stakeholders.types.d.ts +83 -0
  115. package/lib/components/Stakeholders/Stakeholders.types.d.ts.map +1 -0
  116. package/lib/components/Stakeholders/Stakeholders.types.js +2 -0
  117. package/lib/components/Stakeholders/Stakeholders.types.js.map +1 -0
  118. package/lib/components/Stakeholders/index.d.ts +3 -0
  119. package/lib/components/Stakeholders/index.d.ts.map +1 -0
  120. package/lib/components/Stakeholders/index.js +2 -0
  121. package/lib/components/Stakeholders/index.js.map +1 -0
  122. package/lib/components/Tags/Tags.d.ts +34 -0
  123. package/lib/components/Tags/Tags.d.ts.map +1 -0
  124. package/lib/components/Tags/Tags.js +227 -0
  125. package/lib/components/Tags/Tags.js.map +1 -0
  126. package/lib/components/Tags/index.d.ts +3 -0
  127. package/lib/components/Tags/index.d.ts.map +1 -0
  128. package/lib/components/Tags/index.js +2 -0
  129. package/lib/components/Tags/index.js.map +1 -0
  130. package/lib/components/Tasks/TaskList.d.ts +25 -0
  131. package/lib/components/Tasks/TaskList.d.ts.map +1 -0
  132. package/lib/components/Tasks/TaskList.js +25 -0
  133. package/lib/components/Tasks/TaskList.js.map +1 -0
  134. package/lib/components/Tasks/Tasks.d.ts +1 -13
  135. package/lib/components/Tasks/Tasks.d.ts.map +1 -1
  136. package/lib/components/Tasks/Tasks.js +9 -28
  137. package/lib/components/Tasks/Tasks.js.map +1 -1
  138. package/lib/components/Tasks/index.d.ts +3 -0
  139. package/lib/components/Tasks/index.d.ts.map +1 -1
  140. package/lib/components/Tasks/index.js +1 -0
  141. package/lib/components/Tasks/index.js.map +1 -1
  142. package/lib/components/Timeline/Timeline.d.ts.map +1 -1
  143. package/lib/components/Timeline/Timeline.js +10 -12
  144. package/lib/components/Timeline/Timeline.js.map +1 -1
  145. package/lib/components/Timeline/Timeline.styles.d.ts.map +1 -1
  146. package/lib/components/Timeline/Timeline.styles.js +8 -4
  147. package/lib/components/Timeline/Timeline.styles.js.map +1 -1
  148. package/lib/components/Timeline/Timeline.types.d.ts +17 -4
  149. package/lib/components/Timeline/Timeline.types.d.ts.map +1 -1
  150. package/lib/components/Timeline/Timeline.types.js.map +1 -1
  151. package/lib/components/Timeline/TimelineItem.d.ts +2 -1
  152. package/lib/components/Timeline/TimelineItem.d.ts.map +1 -1
  153. package/lib/components/Timeline/TimelineItem.js +4 -11
  154. package/lib/components/Timeline/TimelineItem.js.map +1 -1
  155. package/lib/components/Timeline/utils.d.ts +11 -3
  156. package/lib/components/Timeline/utils.d.ts.map +1 -1
  157. package/lib/components/Timeline/utils.js +48 -4
  158. package/lib/components/Timeline/utils.js.map +1 -1
  159. package/lib/index.d.ts +10 -0
  160. package/lib/index.d.ts.map +1 -1
  161. package/lib/index.js +10 -0
  162. package/lib/index.js.map +1 -1
  163. package/package.json +12 -12
@@ -1 +1 @@
1
- {"version":3,"file":"CaseView.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.tsx"],"names":[],"mappings":";AAAA,OAAO,EAKL,UAAU,EACV,SAAS,EACT,QAAQ,EACR,WAAW,EACX,OAAO,EACP,MAAM,EAEN,eAAe,EAChB,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,MAAM,EACN,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,QAAQ,EACR,aAAa,EACb,cAAc,EACd,gBAAgB,EAEhB,IAAI,EACJ,MAAM,EACN,OAAO,EACP,YAAY,EACZ,IAAI,EACJ,kBAAkB,EACnB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,eAAe,MAAM,iEAAiE,CAAC;AAE9F,OAAO,WAAiC,MAAM,gBAAgB,CAAC;AAE/D,OAAO,gBAA2C,MAAM,oBAAoB,CAAC;AAwB7E,MAAM,CAAC,MAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,CAI5C,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,iBAAiB,EAAE,EAAE,EAAE;IAChE,OAAO,GAAG,CAAA;wBACY,KAAK,CAAC,IAAI,CAAC,OAAO;;MAEpC,iBAAiB;QACnB,eAAe;QACf,GAAG,CAAA;sCAC+B,KAAK,CAAC,IAAI,CAAC,OAAO;KACnD;;MAEC,CAAC,WAAW;QACd,eAAe;QACf,GAAG,CAAA;0BACmB,KAAK,CAAC,IAAI,CAAC,OAAO;KACvC;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAyB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;IAC5F,OAAO,GAAG,CAAA;qCACyB,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;MAChE,SAAS;QACX,GAAG,CAAA;4BACqB,KAAK,CAAC,IAAI,CAAC,OAAO;KACzC;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACnD,OAAO,GAAG,CAAA;;aAEC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC;;GAEhD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAC/C,CAAC,EAAE,cAAc,EAAE,KAAK,EAAE,EAAE,EAAE;IAC5B,OAAO,GAAG,CAAA;eACC,cAAc,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;;0BAEtB,KAAK,CAAC,IAAI,CAAC,OAAO,gBAAgB,KAAK,CAAC,IAAI,CAAC,OAAO;KACzE,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAExD,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAKrC,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,EAAE,EAAE,EAAE;IACrE,OAAO,GAAG,CAAA;iCACqB,MAAM;yBACd,cAAc;;;;wBAIf,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC;;;QAGpD,CAAC,WAAW;QACd,eAAe;QACf,GAAG,CAAA;sCAC6B,KAAK,CAAC,IAAI,CAAC,OAAO;OACjD;;GAEJ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/C,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAG1C,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,EAAE,EAAE;IACrC,OAAO,GAAG,CAAA;;;;wBAIY,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;;;MAG1D,CAAC,WAAW,IAAI,CAAC,OAAO,CAAC;QAC3B,GAAG,CAAA;iBACU,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,OAAO,GAAG,CAAC;KAC7C;;MAEC,CAAC,WAAW;QACd,OAAO;QACP,GAAG,CAAA;;KAEF;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACvD,OAAO,GAAG,CAAA;;;;wBAIY,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;;;eAGjD,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,MAAM,GAAG,CAAC;GAC5C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC9D,OAAO,GAAG,CAAA;wBACY,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC;wBACpC,KAAK,CAAC,IAAI,CAAC,OAAO;;;GAGvC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAExD,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAAC,GAAG,EAAE;IACrD,OAAO,GAAG,CAAA;;;;;;GAMT,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAExD,MAAM,CAAC,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAA;;;CAGpC,CAAC;AAEF,MAAM,QAAQ,GAAqC,CAAC,KAAoB,EAAE,EAAE;IAC1E,MAAM,EACJ,MAAM,EACN,WAAW,EACX,OAAO,EACP,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,gBAAgB,EAChB,OAAO,EACP,cAAc,EACd,IAAI,EAAE,EAAE,YAAY,EAAE,KAAK,EAAE,YAAY,EAAE,OAAO,EAAE,UAAU,EAAE,EAChE,MAAM,EACN,KAAK,EACL,UAAU,EAAE,cAAc,EAC1B,SAAS,EACT,qBAAqB,EACrB,OAAO,EACP,MAAM,EACN,OAAO,EACP,iBAAiB,EACjB,WAAW,EACX,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,WAAW,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACjD,MAAM,kBAAkB,GAAG,kBAAkB,CAAC,cAAc,CAAC,CAAC;IAC9D,IAAI,mBAAmB,GAAG,aAAa,CAAC,IAAI,EAAE,EAAE,aAAa,EAAE,WAAW,EAAE,CAAC,CAAC;IAC9E,IAAI,cAAc,GAAG,aAAa,CAAC,IAAI,EAAE,EAAE,aAAa,EAAE,WAAW,EAAE,CAAC,CAAC;IACzE,IAAI,eAAe,GAAG,aAAa,CAAC,IAAI,EAAE,EAAE,aAAa,EAAE,WAAW,EAAE,CAAC,CAAC;IAC1E,IAAI,WAAW,EAAE;QACf,mBAAmB,GAAG,KAAK,CAAC;QAC5B,cAAc,GAAG,KAAK,CAAC;QACvB,eAAe,GAAG,KAAK,CAAC;KACzB;IAED,MAAM,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAEjD,MAAM,UAAU,GAAG,GAAG,EAAE;;QACtB,MAAM,oBAAoB,GAAG,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,YAAY,KAAI,CAAC,CAAC;QAEzD,MAAM,aAAa,GACjB,CAAC,eAAe,IAAI,iBAAiB,CAAC,CAAC,CAAC,CAAA,MAAA,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,OAAO,0CAAE,YAAY,KAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAE7F,OAAO;YACL,MAAM,EAAE,oBAAoB,GAAG,aAAa;YAC5C,cAAc,EAAE,oBAAoB;YACpC,OAAO,EAAE,aAAa;SACvB,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,UAAU,CAAC,CAAC;IAEnD,MAAM,YAAY,GAAG,WAAW,MAAM,EAAE,CAAC;IACzC,MAAM,cAAc,GAAG,aAAa,MAAM,EAAE,CAAC;IAC7C,MAAM,sBAAsB,GAAG,sBAAsB,MAAM,EAAE,CAAC;IAC9D,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,cAAc,CAAC,CAAC;IACrE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,EAAkC,CAAC;IAErF,MAAM,oBAAoB,GAAG,eAAe,CAAC;IAC7C,MAAM,kBAAkB,GAAG,MAAM,CAAmD;QAClF,QAAQ,EAAE,EAAE;KACb,CAAC,CAAC;IAEH,cAAc,CACZ,oBAAoB,CAAC,CAAC,CAAC,EAAE,GAAG,kBAAkB,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,SAAS,CAC7F,CAAC;IAEF,MAAM,eAAe,GAAG,WAAW,CAAC,CAAC,CAA6B,EAAE,EAAE;QACpE,IAAI,CAAC,CAAC,IAAI,KAAK,SAAS,IAAK,CAAmB,CAAC,GAAG,KAAK,OAAO,EAAE;YAChE,OAAO;SACR;QAED,iBAAiB,CAAC,KAAK,CAAC,EAAE;YACxB,gBAAgB,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;YAC7C,OAAO,CAAC,KAAK,CAAC;QAChB,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,eAAe,CAAC,GAAG,EAAE;QACnB,UAAU,CAAC,UAAU,EAAE,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,mBAAmB,EAAE,cAAc,EAAE,eAAe,EAAE,QAAQ,CAAC,CAAC,CAAC;IAErE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,cAAc,EAAE;YAClB,iBAAiB,CAAC,aAAa,KAAK,QAAQ,CAAC,CAAC;SAC/C;aAAM;YACL,iBAAiB,CAAC,KAAK,CAAC,CAAC;SAC1B;IACH,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IAErB,SAAS,CAAC,GAAG,EAAE;;QACb,IAAI,eAAe,IAAI,CAAC,iBAAiB,EAAE;YACzC,IAAI,YAAY,KAAK,YAAY,IAAI,YAAY,KAAK,cAAc;gBAClE,UAAU,CAAC,MAAA,YAAY,CAAC,CAAC,CAAC,0CAAE,EAAE,CAAC,CAAC;SACnC;IACH,CAAC,EAAE,CAAC,eAAe,EAAE,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,cAAc,CAAC,CAAC,CAAC;IAE9E,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,eAAe,IAAI,CAAC,cAAc,IAAI,SAAS,CAAC,IAAI,iBAAiB;YACxE,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC7B,CAAC,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC,CAAC,CAAC;IAEjC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,iBAAiB,EAAE;YACrB,IAAI,YAAY,KAAK,sBAAsB;gBAAE,UAAU,CAAC,YAAY,CAAC,CAAC;SACvE;IACH,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAExB,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC5B,IAAI,eAAe;YACjB,OAAO,iBAAiB;gBACtB,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,YAAY,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,GAAG,YAAY,CAAC;gBAC1D,CAAC,CAAC,YAAY,CAAC;QACnB,MAAM,WAAW,GAAG,EAAE,CAAC;QAEvB,IAAI,SAAS;YAAE,WAAW,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,cAAc,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,CAAC;QAC3E,IAAI,iBAAiB,IAAI,CAAC,eAAe;YACvC,WAAW,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,sBAAsB,EAAE,IAAI,EAAE,iBAAiB,CAAC,KAAK,EAAE,CAAC,CAAC;QAElF,OAAO,CAAC,EAAE,EAAE,EAAE,YAAY,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,GAAG,YAAY,EAAE,GAAG,WAAW,CAAC,CAAC;IAClF,CAAC,EAAE;QACD,eAAe;QACf,YAAY;QACZ,cAAc;QACd,sBAAsB;QACtB,SAAS;QACT,iBAAiB;QACjB,YAAY;KACb,CAAC,CAAC;IAEH,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,EAAE;QAC9B,IAAI,YAAY,KAAK,YAAY;YAAE,OAAO,KAAC,IAAI,cAAE,OAAO,WAAQ,CAAC;QACjE,IAAI,YAAY,KAAK,cAAc,EAAE;YACnC,OAAO,KAAC,IAAI,kBAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,gBAAG,SAAS,YAAQ,CAAC;SAC7E;QACD,IAAI,YAAY,KAAK,sBAAsB;YAAE,OAAO,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,OAAO,CAAC;QAE/E,OAAO,cAAc,CAAC;IACxB,CAAC,EAAE,CAAC,YAAY,EAAE,cAAc,EAAE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAErF,MAAM,SAAS,GAAG,YAAY,EAAE,CAAC;IAEjC,MAAM,aAAa,GAAG,cAAc;QAClC,CAAC,CAAC,QAAQ,SAAS,CAAC,GAAG,QAAQ;QAC/B,CAAC,CAAC,QAAQ,SAAS,CAAC,KAAK,QAAQ,CAAC;IAEpC,IAAI,qBAAqB,GAAG;QAC1B,IAAI,EAAE,gBAAgB;QACtB,MAAM,EAAE,CAAC;QACT,IAAI,EAAE,6BAA6B;QACnC,KAAK,EAAE,sBAAsB;KAC9B,CAAC;IAEF,IAAI,CAAC,WAAW,IAAI,CAAC,iBAAiB,EAAE;QACtC,MAAM,KAAK,GAAG,8BAA8B,CAAC;QAC7C,IAAI,cAAc,EAAE;YAClB,qBAAqB,GAAG;gBACtB,IAAI,EAAE,6CAA6C;gBACnD,MAAM,EAAE,CAAC;gBACT,IAAI,EAAE,qBAAqB,CAAC,IAAI;gBAChC,KAAK;aACN,CAAC;SACH;aAAM,IAAI,eAAe,EAAE;YAC1B,qBAAqB,GAAG;gBACtB,IAAI,EAAE,6CAA6C;gBACnD,MAAM,EAAE,CAAC;gBACT,IAAI,EAAE,qBAAqB,CAAC,IAAI;gBAChC,KAAK;aACN,CAAC;SACH;KACF;SAAM,IAAI,iBAAiB,EAAE;QAC5B,IAAI,mBAAmB,EAAE;YACvB,qBAAqB,GAAG;gBACtB,IAAI,EAAE,wDAAwD;gBAC9D,MAAM,EAAE,CAAC;gBACT,IAAI,EAAE,qBAAqB,CAAC,IAAI;gBAChC,KAAK,EAAE,gDAAgD;aACxD,CAAC;SACH;aAAM,IAAI,cAAc,IAAI,eAAe,EAAE;YAC5C,qBAAqB,GAAG;gBACtB,IAAI,EAAE,kDAAkD;gBACxD,MAAM,EAAE,CAAC;gBACT,IAAI,EAAE,qBAAqB,CAAC,IAAI;gBAChC,KAAK,EAAE,oEAAoE;aAC5E,CAAC;SACH;KACF;IAED,OAAO,CACL,MAAC,IAAI,kBACH,EAAE,EAAE,cAAc,EAClB,cAAc,EAAE,OAAO,CAAC,cAAc,EACtC,MAAM,EAAE,iBAAiB,IAAI,mBAAmB,CAAC,CAAC,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAC1F,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,qBAAqB,EAChC,IAAI,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,EAC1B,WAAW,EAAE,WAAW,EACxB,eAAe,EAAE,eAAe,IAC5B,SAAS,eAEb,KAAC,IAAI,kBACH,EAAE,EAAE,mBAAmB,EACvB,IAAI,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,EAC1B,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,eAAe,IAAI,CAAC,CAAC,iBAAiB,IAAI,mBAAmB,CAAC,gBAEvE,KAAC,WAAW,IACV,GAAG,EAAE,kBAAkB,EACvB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,gBAAgB,EAAE,gBAAgB,EAClC,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,IAAI,EAAE;wBACJ,KAAK,EAAE,QAAQ;wBACf,OAAO,EAAE,UAAU;wBACnB,YAAY;qBACb,EACD,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,CAAC,eAAe,IAAI,CAAC,iBAAiB,CAAC,IAAI,mBAAmB,WACvE,YACG;YAEP,MAAC,IAAI,kBACH,SAAS,EAAE;oBACT,IAAI,EAAE,gBAAgB;oBACtB,YAAY,EAAE,OAAO;oBACrB,MAAM,EAAE,CAAC;iBACV,EACD,IAAI,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EACzB,EAAE,EAAE,qBAAqB,EACzB,WAAW,EAAE,WAAW,EACxB,eAAe,EAAE,eAAe,EAChC,iBAAiB,EAAE,OAAO,CAAC,iBAAiB,CAAC,iBAE5C,OAAO,IAAI,wBAAM,OAAO,WAAO;oBAC/B,MAAM,IAAI,wBAAM,MAAM,WAAO;oBAC7B,KAAK,IAAI,wBAAM,KAAK,WAAO;oBAC3B,CAAC,CAAC,eAAe,IAAI,iBAAiB,CAAC,IAAI,CAC1C,KAAC,gBAAgB,IACf,IAAI,EAAC,YAAY,EACjB,IAAI,EAAE,QAAQ,EACd,UAAU,EAAE,UAAU,EACtB,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,CAAC,eAAe,WAC3B,CACH;oBACA,YAAY,CAAC,CAAC,CAAC,KAAC,QAAQ,kBAAC,KAAK,EAAE,YAAY,gBAAG,UAAU,YAAY,CAAC,CAAC,CAAC,UAAU,aAC9E;YAEN,iBAAiB,IAAI,eAAe,IAAI,CACvC,KAAC,IAAI,kBAAC,EAAE,EAAE,uBAAuB,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,mBAAmB,EAAE,gBACnE,iBAAiB,CAAC,OAAO,YACrB,CACR;YACA,CAAC,cAAc,IAAI,CAClB,KAAC,MAAM,kBACL,EAAE,EAAE,gBAAgB,EACpB,IAAI,EAAE,cAAc,IAAI,eAAe,EACvC,QAAQ,EAAC,OAAO,EAChB,SAAS,EAAE,SAAS,CAAC,GAAG,EACxB,MAAM,QACN,cAAc,QACd,oBAAoB,EAAE,CAAC,CAAC,iBAAiB,gBAEzC,MAAC,IAAI,kBAAC,EAAE,EAAE,uBAAuB,EAAE,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,iBAC3E,KAAC,IAAI,kBAAC,SAAS,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,gBACjC,KAAC,MAAM,kBACL,OAAO,EAAC,QAAQ,EAChB,IAAI,QACJ,OAAO,EAAE,eAAe,EACxB,EAAE,EAAE,gBAAgB,gBACR,CAAC,CAAC,eAAe,EAAE,CAAC,CAAC,iBAAiB,CAAC,CAAC,gBAEpD,KAAC,IAAI,IAAC,IAAI,EAAE,QAAQ,SAAS,CAAC,GAAG,QAAQ,WAAI,YACtC,YACJ;wBACN,SAAS,aACL,YACA,CACV;YACA,SAAS,IAAI,eAAe,IAAI,CAC/B,MAAC,IAAI,kBACH,GAAG,EAAE,CAAC,EAAkB,EAAE,EAAE;;oBAC1B,IAAI,EAAE;wBAAE,CAAC,MAAA,kBAAkB,CAAC,OAAO,0CAAE,QAAQ,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;gBAC1D,CAAC,EACD,EAAE,EAAE,uBAAuB,EAC3B,SAAS,EAAE;oBACT,IAAI,EAAE,gBAAgB;oBACtB,MAAM,EAAE,CAAC;iBACV,EACD,IAAI,EAAE;oBACJ,IAAI,EAAE,WAAW;iBAClB,EACD,cAAc,EAAE,cAAc,IAAI,cAAc,iBAEhD,KAAC,IAAI,kBAAC,SAAS,EAAE,EAAE,OAAO,EAAE,cAAc,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,EAAE,gBAC7D,KAAC,MAAM,kBACL,OAAO,EAAC,QAAQ,EAChB,IAAI,QACJ,OAAO,EAAE,eAAe,EACxB,EAAE,EAAE,gBAAgB,EACpB,KAAK,EAAE,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,aAAa,EAAE,CAAC,CAAC,iBAAiB,CAAC,CAAC,gBAEhF,KAAC,IAAI,IAAC,IAAI,EAAE,aAAa,WAAI,YACtB,YACJ;oBACP,KAAC,IAAI,kBACH,SAAS,EAAE,cAAc,IAAI,cAAc,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,EACrF,MAAM,EAAE,CAAC,cAAc,IAAI,CAAC,cAAc,gBAEzC,SAAS,YACL;oBAEN,CAAC,CAAC,cAAc,IAAI,CAAC,eAAe,IAAI,CAAC,cAAc,CAAC,CAAC,IAAI,CAC5D,KAAC,gBAAgB,IACf,KAAK,EAAE,qBAAqB,IAAI,EAAE,EAClC,OAAO,EAAE,eAAe,EACxB,SAAS,EAAE,eAAe,WAC1B,CACH,aACI,CACR,aACI,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import {\n ReactNode,\n FC,\n MouseEvent,\n KeyboardEvent,\n useContext,\n useEffect,\n useState,\n useCallback,\n useMemo,\n useRef,\n Ref,\n useLayoutEffect\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n Flex,\n Grid,\n Icon,\n TabPanel,\n useBreakpoint,\n useScrollStick,\n defaultThemeProp,\n ForwardProps,\n Card,\n Drawer,\n useI18n,\n useDirection,\n Tabs,\n useConsolidatedRef\n} from '@pega/cosmos-react-core';\nimport { ScrollStickOptions } from '@pega/cosmos-react-core/lib/hooks/useScrollStick';\nimport AppShellContext from '@pega/cosmos-react-core/lib/components/AppShell/AppShellContext';\n\nimport CaseSummary, { CaseSummaryProps } from '../CaseSummary';\n\nimport UtilitiesSummary, { UtilitiesSummaryProps } from './UtilitiesSummary';\n\nexport interface CaseViewProps extends CaseSummaryProps {\n /** A region to hold a Stages component. */\n stages?: ReactNode;\n /** A region to hold a Tasks component. */\n tasks?: ReactNode;\n /** A region that is used to hold Utility components for example SummaryList. */\n utilities?: ReactNode;\n /** The utilities summary array will be used to render the minimized the utilities card. */\n utilitiesSummaryItems?: UtilitiesSummaryProps['items'];\n /** A region above the center column to display banners. */\n banners?: ReactNode;\n /** A region to the right reserved for persistent utilities. */\n persistentUtility?: { content: ReactNode; title: string };\n /** A region within the center column that is controlled by tabs in CaseSummary. */\n tabContent?: ReactNode;\n /**\n * A ref for the CaseSummary region.\n * @internal\n */\n caseSummaryRef?: Ref<HTMLDivElement>;\n}\n\nexport const StyledCaseViewContent = styled.div<{\n forceMobile?: boolean;\n isMediumOrAbove?: boolean;\n persistentUtility?: boolean;\n}>(({ theme, forceMobile, isMediumOrAbove, persistentUtility }) => {\n return css`\n padding: calc(2 * ${theme.base.spacing});\n\n ${persistentUtility &&\n isMediumOrAbove &&\n css`\n margin-inline-start: calc(2 * ${theme.base.spacing});\n `}\n\n ${!forceMobile &&\n isMediumOrAbove &&\n css`\n padding: calc(2 * ${theme.base.spacing}) 0;\n `}\n `;\n});\n\nexport const StyledMobileTabs = styled(Tabs)<{ fullWidth: boolean }>(({ theme, fullWidth }) => {\n return css`\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n ${fullWidth &&\n css`\n margin: 0 calc(-2 * ${theme.base.spacing});\n `}\n `;\n});\n\nStyledMobileTabs.defaultProps = defaultThemeProp;\n\nconst StyledUtilToggle = styled.button(({ theme }) => {\n return css`\n align-self: flex-end;\n color: ${theme.base.palette['foreground-color']};\n margin-inline-end: 0.375rem;\n `;\n});\n\nStyledUtilToggle.defaultProps = defaultThemeProp;\n\nexport const StyledCaseViewUtilities = styled.div<{ utilitiesShown: boolean }>(\n ({ utilitiesShown, theme }) => {\n return css`\n width: ${utilitiesShown ? '25rem' : 'auto'};\n height: max-content;\n padding: calc(2 * ${theme.base.spacing}) 0 calc(2 * ${theme.base.spacing});\n `;\n }\n);\n\nStyledCaseViewUtilities.defaultProps = defaultThemeProp;\n\nexport const StyledCaseView = styled.div<{\n forceMobile?: boolean;\n isMediumOrAbove?: boolean;\n appshellOffset: number;\n offset: number;\n}>(({ theme, forceMobile, isMediumOrAbove, appshellOffset, offset }) => {\n return css`\n --case-view-header-offset: ${offset}px;\n --appshell-offset: ${appshellOffset}px;\n --case-view-content-height: calc(100vh - var(--case-view-header-offset));\n min-height: calc(100vh - var(---appshell-offset));\n position: relative;\n background-color: ${theme.base.palette['app-background']};\n\n > :last-child {\n ${!forceMobile &&\n isMediumOrAbove &&\n css`\n margin-inline-end: calc(2 * ${theme.base.spacing});\n `}\n }\n `;\n});\n\nStyledCaseView.defaultProps = defaultThemeProp;\n\nexport const StyledSummaryRegion = styled.div<{\n forceMobile?: boolean;\n desktop?: boolean;\n}>(({ theme, forceMobile, desktop }) => {\n return css`\n position: sticky;\n top: var(--appshell-offset);\n width: 100%;\n background-color: ${theme.base.palette['primary-background']};\n overflow: auto;\n\n ${(forceMobile || !desktop) &&\n css`\n z-index: ${theme.base['z-index'].popover + 1};\n `}\n\n ${!forceMobile &&\n desktop &&\n css`\n height: var(--case-view-content-height);\n `}\n `;\n});\n\nStyledSummaryRegion.defaultProps = defaultThemeProp;\n\nexport const StyledCaseDrawer = styled.div(({ theme }) => {\n return css`\n min-width: 21.875rem;\n max-width: 31.25rem;\n width: calc((100vw - 31.25rem) / 10 + 21.875rem);\n background-color: ${theme.base.palette['primary-background']};\n height: var(--case-view-content-height);\n top: var(--case-view-header-offset);\n z-index: ${theme.base['z-index'].drawer - 1};\n `;\n});\n\nStyledCaseDrawer.defaultProps = defaultThemeProp;\n\nexport const StyledCaseDrawerContent = styled.div(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['app-background']};\n padding: calc(2 * ${theme.base.spacing});\n height: 100%;\n overflow: auto;\n `;\n});\n\nStyledCaseDrawerContent.defaultProps = defaultThemeProp;\n\nexport const StyledPersistentUtility = styled.div(() => {\n return css`\n height: var(--case-view-content-height);\n max-width: 60ch;\n overflow: auto;\n position: sticky;\n top: var(--case-view-header-offset);\n `;\n});\n\nStyledPersistentUtility.defaultProps = defaultThemeProp;\n\nexport const ScrollStick = styled.div`\n position: sticky;\n top: 0;\n`;\n\nconst CaseView: FC<CaseViewProps & ForwardProps> = (props: CaseViewProps) => {\n const {\n caseId,\n parentCases,\n heading,\n caseLink,\n icon,\n followed,\n onFollowedChange,\n summary,\n caseSummaryRef,\n tabs: { currentTabId, items: tabItemsProp, onClick: onTabClick },\n stages,\n tasks,\n tabContent: tabContentProp,\n utilities,\n utilitiesSummaryItems,\n actions,\n onEdit,\n banners,\n persistentUtility,\n forceMobile,\n ...restProps\n } = props;\n const t = useI18n();\n const caseViewRef = useRef<HTMLDivElement>(null);\n const caseViewSummaryRef = useConsolidatedRef(caseSummaryRef);\n let isExtraLargeOrAbove = useBreakpoint('xl', { breakpointRef: caseViewRef });\n let isLargeOrAbove = useBreakpoint('lg', { breakpointRef: caseViewRef });\n let isMediumOrAbove = useBreakpoint('md', { breakpointRef: caseViewRef });\n if (forceMobile) {\n isExtraLargeOrAbove = false;\n isLargeOrAbove = false;\n isMediumOrAbove = false;\n }\n\n const { headerEl } = useContext(AppShellContext);\n\n const getOffsets = () => {\n const appshellHeaderHeight = headerEl?.offsetHeight || 0;\n\n const summaryHeight =\n !isMediumOrAbove || persistentUtility ? caseViewSummaryRef?.current?.offsetHeight || 0 : 0;\n\n return {\n sticky: appshellHeaderHeight + summaryHeight,\n appshellHeader: appshellHeaderHeight,\n summary: summaryHeight\n };\n };\n\n const [offsets, setOffsets] = useState(getOffsets);\n\n const summaryTabId = `summary-${caseId}`;\n const utilitiesTabId = `utilities-${caseId}`;\n const persistentUtilityTabId = `persistent-utility-${caseId}`;\n const [utilitiesShown, setUtilitiesShown] = useState(isLargeOrAbove);\n const [userUtilState, setUserUtilState] = useState<undefined | 'shown' | 'hidden'>();\n\n const hasSideBySideColumns = isMediumOrAbove;\n const scrollStickOptions = useRef<ScrollStickOptions & { elements: HTMLElement[] }>({\n elements: []\n });\n\n useScrollStick(\n hasSideBySideColumns ? { ...scrollStickOptions.current, offset: offsets.sticky } : undefined\n );\n\n const toggleUtilities = useCallback((e: MouseEvent | KeyboardEvent) => {\n if (e.type === 'keydown' && (e as KeyboardEvent).key !== 'Enter') {\n return;\n }\n\n setUtilitiesShown(shown => {\n setUserUtilState(shown ? 'hidden' : 'shown');\n return !shown;\n });\n }, []);\n\n useLayoutEffect(() => {\n setOffsets(getOffsets());\n }, [isExtraLargeOrAbove, isLargeOrAbove, isMediumOrAbove, headerEl]);\n\n useEffect(() => {\n if (isLargeOrAbove) {\n setUtilitiesShown(userUtilState !== 'hidden');\n } else {\n setUtilitiesShown(false);\n }\n }, [isLargeOrAbove]);\n\n useEffect(() => {\n if (isMediumOrAbove && !persistentUtility) {\n if (currentTabId === summaryTabId || currentTabId === utilitiesTabId)\n onTabClick(tabItemsProp[0]?.id);\n }\n }, [isMediumOrAbove, onTabClick, currentTabId, summaryTabId, utilitiesTabId]);\n\n useEffect(() => {\n if ((isMediumOrAbove && !isLargeOrAbove && utilities) || persistentUtility)\n setUtilitiesShown(false);\n }, [isMediumOrAbove, utilities]);\n\n useEffect(() => {\n if (persistentUtility) {\n if (currentTabId === persistentUtilityTabId) onTabClick(summaryTabId);\n }\n }, [persistentUtility]);\n\n const tabItems = useMemo(() => {\n if (isMediumOrAbove)\n return persistentUtility\n ? [{ id: summaryTabId, name: 'Summary' }, ...tabItemsProp]\n : tabItemsProp;\n const utilityTabs = [];\n\n if (utilities) utilityTabs.push({ id: utilitiesTabId, name: 'Utilities' });\n if (persistentUtility && !isMediumOrAbove)\n utilityTabs.push({ id: persistentUtilityTabId, name: persistentUtility.title });\n\n return [{ id: summaryTabId, name: 'Summary' }, ...tabItemsProp, ...utilityTabs];\n }, [\n isMediumOrAbove,\n summaryTabId,\n utilitiesTabId,\n persistentUtilityTabId,\n utilities,\n persistentUtility,\n tabItemsProp\n ]);\n\n const tabContent = useMemo(() => {\n if (currentTabId === summaryTabId) return <Card>{summary}</Card>;\n if (currentTabId === utilitiesTabId) {\n return <Flex container={{ direction: 'column', gap: 2 }}>{utilities}</Flex>;\n }\n if (currentTabId === persistentUtilityTabId) return persistentUtility?.content;\n\n return tabContentProp;\n }, [currentTabId, tabContentProp, summary, summaryTabId, utilities, utilitiesTabId]);\n\n const direction = useDirection();\n\n const utilitiesIcon = utilitiesShown\n ? `move-${direction.end}-solid`\n : `move-${direction.start}-solid`;\n\n let caseViewGridContainer = {\n cols: 'minmax(0, 1fr)',\n colGap: 0,\n rows: 'minmax(0, max-content) auto',\n areas: '\"case-nav\" \"content\"'\n };\n\n if (!forceMobile && !persistentUtility) {\n const areas = `\"case-nav content utilities\"`;\n if (isLargeOrAbove) {\n caseViewGridContainer = {\n cols: '25rem minmax(0, 1fr) minmax(0, max-content)',\n colGap: 2,\n rows: caseViewGridContainer.rows,\n areas\n };\n } else if (isMediumOrAbove) {\n caseViewGridContainer = {\n cols: '22rem minmax(0, 1fr) minmax(0, max-content)',\n colGap: 2,\n rows: caseViewGridContainer.rows,\n areas\n };\n }\n } else if (persistentUtility) {\n if (isExtraLargeOrAbove) {\n caseViewGridContainer = {\n cols: '22rem minmax(0, 1fr) repeat(2, minmax(0, max-content))',\n colGap: 2,\n rows: caseViewGridContainer.rows,\n areas: '\"case-nav content persistentUtility utilities\"'\n };\n } else if (isLargeOrAbove || isMediumOrAbove) {\n caseViewGridContainer = {\n cols: 'minmax(0, 1fr) repeat(2, minmax(0, max-content))',\n colGap: 2,\n rows: caseViewGridContainer.rows,\n areas: '\"case-nav case-nav case-nav\" \"content persistentUtility utilities\"'\n };\n }\n }\n\n return (\n <Grid\n as={StyledCaseView}\n appshellOffset={offsets.appshellHeader}\n offset={persistentUtility && isExtraLargeOrAbove ? offsets.appshellHeader : offsets.sticky}\n ref={caseViewRef}\n container={caseViewGridContainer}\n item={{ area: 'caseView' }}\n forceMobile={forceMobile}\n isMediumOrAbove={isMediumOrAbove}\n {...restProps}\n >\n <Grid\n as={StyledSummaryRegion}\n item={{ area: 'case-nav' }}\n forceMobile={forceMobile}\n desktop={isMediumOrAbove && (!persistentUtility || isExtraLargeOrAbove)}\n >\n <CaseSummary\n ref={caseViewSummaryRef}\n caseId={caseId}\n heading={heading}\n caseLink={caseLink}\n icon={icon}\n followed={followed}\n onFollowedChange={onFollowedChange}\n parentCases={parentCases}\n summary={summary}\n actions={actions}\n onEdit={onEdit}\n tabs={{\n items: tabItems,\n onClick: onTabClick,\n currentTabId\n }}\n forceMobile={forceMobile}\n desktop={(isMediumOrAbove && !persistentUtility) || isExtraLargeOrAbove}\n />\n </Grid>\n\n <Grid\n container={{\n cols: 'minmax(0, 1fr)',\n alignContent: 'start',\n rowGap: 2\n }}\n item={{ area: 'content' }}\n as={StyledCaseViewContent}\n forceMobile={forceMobile}\n isMediumOrAbove={isMediumOrAbove}\n persistentUtility={Boolean(persistentUtility)}\n >\n {banners && <div>{banners}</div>}\n {stages && <div>{stages}</div>}\n {tasks && <div>{tasks}</div>}\n {(!isMediumOrAbove || persistentUtility) && (\n <StyledMobileTabs\n type='horizontal'\n tabs={tabItems}\n onTabClick={onTabClick}\n currentTabId={currentTabId}\n fullWidth={!isMediumOrAbove}\n />\n )}\n {currentTabId ? <TabPanel tabId={currentTabId}>{tabContent}</TabPanel> : tabContent}\n </Grid>\n\n {persistentUtility && isMediumOrAbove && (\n <Grid as={StyledPersistentUtility} item={{ area: 'persistentUtility' }}>\n {persistentUtility.content}\n </Grid>\n )}\n {!isLargeOrAbove && (\n <Drawer\n as={StyledCaseDrawer}\n open={utilitiesShown && isMediumOrAbove}\n position='fixed'\n placement={direction.end}\n shadow\n nullWhenClosed\n hasPersistentUtility={!!persistentUtility}\n >\n <Flex as={StyledCaseDrawerContent} container={{ direction: 'column', gap: 2 }}>\n <Flex container={{ justify: 'end' }}>\n <Button\n variant='simple'\n icon\n onClick={toggleUtilities}\n as={StyledUtilToggle}\n aria-label={t('collapse_noun', t('utilities_panel'))}\n >\n <Icon name={`move-${direction.end}-solid`} />\n </Button>\n </Flex>\n {utilities}\n </Flex>\n </Drawer>\n )}\n {utilities && isMediumOrAbove && (\n <Grid\n ref={(el: HTMLDivElement) => {\n if (el) (scrollStickOptions.current?.elements).push(el);\n }}\n as={StyledCaseViewUtilities}\n container={{\n cols: 'minmax(0, 1fr)',\n rowGap: 2\n }}\n item={{\n area: 'utilities'\n }}\n utilitiesShown={utilitiesShown && isLargeOrAbove}\n >\n <Flex container={{ justify: utilitiesShown ? 'end' : 'center' }}>\n <Button\n variant='simple'\n icon\n onClick={toggleUtilities}\n as={StyledUtilToggle}\n label={t(utilitiesShown ? 'collapse_noun' : 'expand_noun', t('utilities_panel'))}\n >\n <Icon name={utilitiesIcon} />\n </Button>\n </Flex>\n <Flex\n container={utilitiesShown && isLargeOrAbove ? { direction: 'column', gap: 2 } : false}\n hidden={!utilitiesShown || !isLargeOrAbove}\n >\n {utilities}\n </Flex>\n\n {(!utilitiesShown || (isMediumOrAbove && !isLargeOrAbove)) && (\n <UtilitiesSummary\n items={utilitiesSummaryItems || []}\n onClick={toggleUtilities}\n onKeyDown={toggleUtilities}\n />\n )}\n </Grid>\n )}\n </Grid>\n );\n};\n\nexport default CaseView;\n"]}
1
+ {"version":3,"file":"CaseView.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n ReactNode,\n FC,\n MouseEvent,\n KeyboardEvent,\n useContext,\n useEffect,\n useState,\n useCallback,\n useMemo,\n useRef,\n Ref,\n useLayoutEffect\n} from 'react';\n\nimport {\n Button,\n Flex,\n Grid,\n Icon,\n registerIcon,\n TabPanel,\n useBreakpoint,\n useScrollStick,\n useElement,\n ForwardProps,\n Card,\n Drawer,\n useI18n,\n useDirection,\n useConsolidatedRef,\n TabsProps\n} from '@pega/cosmos-react-core';\nimport { ScrollStickOptions } from '@pega/cosmos-react-core/lib/hooks/useScrollStick';\nimport AppShellContext from '@pega/cosmos-react-core/lib/components/AppShell/AppShellContext';\nimport * as moveRightSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/move-right-solid.icon';\nimport * as moveLeftSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/move-left-solid.icon';\n\nimport CaseSummary, { CaseSummaryProps } from '../CaseSummary';\n\nimport UtilitiesSummary, { UtilitiesSummaryProps } from './UtilitiesSummary';\nimport {\n StyledCaseDrawer,\n StyledCaseDrawerContent,\n StyledCaseView,\n StyledCaseViewContent,\n StyledPersistentUtility,\n StyledSummaryRegion,\n StyledCaseViewUtilities,\n StyledMobileTabs,\n StyledUtilToggle\n} from './CaseView.styles';\n\nregisterIcon(moveRightSolidIcon, moveLeftSolidIcon);\n\nexport interface CaseViewProps extends CaseSummaryProps {\n /** A region to hold a Stages component. */\n stages?: ReactNode;\n /** A region to hold a Tasks component. */\n tasks?: ReactNode;\n /** A region that is used to hold Utility components for example SummaryList. */\n utilities?: ReactNode;\n /** The utilities summary array will be used to render the minimized the utilities card. */\n utilitiesSummaryItems?: UtilitiesSummaryProps['items'];\n /** Collapses the utilities by default on load */\n defaultCollapsedUtilities?: boolean;\n /** A region above the center column to display banners. */\n banners?: ReactNode;\n /** A region to the right reserved for persistent utilities. */\n persistentUtility?: { content: ReactNode; title: string };\n /** A region within the center column that is controlled by tabs in CaseSummary. */\n tabContent?: { content: ReactNode; id: string }[];\n /**\n * A ref for the CaseSummary region.\n * @internal\n */\n caseSummaryRef?: Ref<HTMLDivElement>;\n}\n\nconst CaseView: FC<CaseViewProps & ForwardProps> = (props: CaseViewProps) => {\n const {\n caseId,\n parentCases,\n heading,\n caseLink,\n icon,\n followed,\n onFollowedChange,\n summary,\n caseSummaryRef,\n tabs: { currentTabId, items: tabItemsProp, onClick: onTabClick },\n stages,\n tasks,\n tabContent: tabContentProp = [],\n utilities,\n utilitiesSummaryItems,\n defaultCollapsedUtilities = false,\n actions,\n onEdit,\n banners,\n persistentUtility,\n forceMobile,\n ...restProps\n } = props;\n const t = useI18n();\n const caseViewRef = useRef<HTMLDivElement>(null);\n const caseViewSummaryRef = useConsolidatedRef(caseSummaryRef);\n const caseSummaryHeaderRef = useRef<HTMLDivElement>(null);\n const caseViewSummaryContainerRef = useRef<HTMLDivElement>(null);\n const [tabContentEl, setTabContentEl] = useElement<HTMLElement>(null);\n let isExtraLargeOrAbove = useBreakpoint('xl', { breakpointRef: caseViewRef });\n let isLargeOrAbove = useBreakpoint('lg', { breakpointRef: caseViewRef });\n let isMediumOrAbove = useBreakpoint('md', { breakpointRef: caseViewRef });\n if (forceMobile) {\n isExtraLargeOrAbove = false;\n isLargeOrAbove = false;\n isMediumOrAbove = false;\n }\n\n const { headerEl } = useContext(AppShellContext);\n\n const [summaryAnimationState, setSummaryAnimationState] = useState('expanded');\n\n const summaryTabId = `summary-${caseId}`;\n const utilitiesTabId = `utilities-${caseId}`;\n const persistentUtilityTabId = `persistent-utility-${caseId}`;\n const [utilitiesShown, setUtilitiesShown] = useState(\n isLargeOrAbove && !defaultCollapsedUtilities\n );\n const initialUserUtilState = defaultCollapsedUtilities ? 'hidden' : undefined;\n const [userUtilState, setUserUtilState] = useState<undefined | 'shown' | 'hidden'>(\n initialUserUtilState\n );\n const [summaryPanelCollapsed, setSummaryPanelCollapsed] = useState(false);\n\n const hasSideBySideColumns = isMediumOrAbove;\n const scrollStickOptions = useRef<ScrollStickOptions & { elements: HTMLElement[] }>({\n elements: []\n });\n\n const getOffsets = () => {\n const appshellHeaderHeight = headerEl?.offsetHeight || 0;\n\n const summaryHeight =\n !isMediumOrAbove || (persistentUtility && !isExtraLargeOrAbove) || summaryPanelCollapsed\n ? caseViewSummaryRef?.current?.offsetHeight || 0\n : 0;\n\n return {\n sticky: appshellHeaderHeight + summaryHeight,\n summary: summaryHeight\n };\n };\n\n const [offsets, setOffsets] = useState(getOffsets);\n\n useScrollStick(\n hasSideBySideColumns ? { ...scrollStickOptions.current, offset: offsets.sticky } : undefined\n );\n\n const toggleUtilities = useCallback((e: MouseEvent | KeyboardEvent) => {\n if (e.type === 'keydown' && (e as KeyboardEvent).key !== 'Enter') {\n return;\n }\n\n setUtilitiesShown(shown => {\n setUserUtilState(shown ? 'hidden' : 'shown');\n return !shown;\n });\n }, []);\n\n useLayoutEffect(() => {\n setOffsets(getOffsets());\n }, [isExtraLargeOrAbove, isLargeOrAbove, isMediumOrAbove, headerEl, summaryPanelCollapsed]);\n\n useEffect(() => {\n if (isLargeOrAbove) {\n setUtilitiesShown(userUtilState !== 'hidden');\n } else {\n setUtilitiesShown(false);\n }\n }, [isLargeOrAbove]);\n\n useEffect(() => {\n if (\n isMediumOrAbove &&\n !summaryPanelCollapsed &&\n !persistentUtility &&\n (currentTabId === summaryTabId || currentTabId === utilitiesTabId)\n ) {\n onTabClick(tabItemsProp[0]?.id);\n }\n }, [\n isMediumOrAbove,\n onTabClick,\n currentTabId,\n summaryTabId,\n utilitiesTabId,\n summaryPanelCollapsed\n ]);\n\n useEffect(() => {\n if ((isMediumOrAbove && !isLargeOrAbove && utilities) || persistentUtility)\n setUtilitiesShown(false);\n }, [isMediumOrAbove, utilities]);\n\n useEffect(() => {\n if (persistentUtility && currentTabId === persistentUtilityTabId) onTabClick(summaryTabId);\n }, [persistentUtility]);\n\n const tabItems: TabsProps['tabs'] = useMemo(() => {\n const summaryTab = { id: summaryTabId, name: 'Summary' };\n if (isMediumOrAbove)\n return summaryPanelCollapsed || (persistentUtility && !isExtraLargeOrAbove)\n ? [summaryTab, ...tabItemsProp]\n : tabItemsProp;\n\n const utilityTabs = [];\n\n if (utilities) utilityTabs.push({ id: utilitiesTabId, name: 'Utilities' });\n if (persistentUtility && !isMediumOrAbove)\n utilityTabs.push({ id: persistentUtilityTabId, name: persistentUtility.title });\n\n return [summaryTab, ...tabItemsProp, ...utilityTabs];\n }, [\n isMediumOrAbove,\n isExtraLargeOrAbove,\n summaryTabId,\n utilitiesTabId,\n persistentUtilityTabId,\n utilities,\n persistentUtility,\n tabItemsProp,\n summaryPanelCollapsed\n ]);\n\n useEffect(() => {\n if (!tabContentEl) return;\n const scrollPos = window.scrollY;\n const windowHeight = document.documentElement.clientHeight;\n const bottomPos = scrollPos + windowHeight * 0.8;\n const tabContentPos = tabContentEl.offsetTop;\n if (tabContentPos > bottomPos) {\n const top = tabContentPos - windowHeight * 0.2;\n window.scrollTo({ top, behavior: 'smooth' });\n }\n }, [currentTabId]);\n\n const tabContent = useMemo(() => {\n const summaryTabContent = { id: summaryTabId, content: <Card>{summary}</Card> };\n if (isMediumOrAbove)\n return summaryPanelCollapsed || (persistentUtility && !isExtraLargeOrAbove)\n ? [summaryTabContent, ...tabContentProp]\n : tabContentProp;\n\n const utilityTabs = [];\n if (utilities)\n utilityTabs.push({\n id: utilitiesTabId,\n content: <Flex container={{ direction: 'column', gap: 2 }}>{utilities}</Flex>\n });\n if (persistentUtility)\n utilityTabs.push({ id: persistentUtilityTabId, content: persistentUtility?.content });\n return [summaryTabContent, ...tabContentProp, ...utilityTabs];\n }, [\n currentTabId,\n tabContentProp,\n summary,\n summaryTabId,\n utilities,\n utilitiesTabId,\n isMediumOrAbove,\n isExtraLargeOrAbove\n ]);\n\n const direction = useDirection();\n\n const utilitiesIcon = utilitiesShown\n ? `move-${direction.end}-solid`\n : `move-${direction.start}-solid`;\n\n let caseViewGridContainer = {\n cols: 'minmax(0, 1fr)',\n colGap: 0,\n rows: 'minmax(0, max-content) auto',\n areas: '\"case-nav\" \"content\"'\n };\n let fixedSummaryWidth = '100%';\n\n if (!forceMobile && !persistentUtility && !summaryPanelCollapsed) {\n fixedSummaryWidth = isLargeOrAbove ? '25rem' : '22rem';\n if (isLargeOrAbove || isMediumOrAbove) {\n caseViewGridContainer = {\n cols: 'minmax(0, max-content) minmax(0, 1fr) minmax(0, max-content)',\n colGap: 2,\n rows: caseViewGridContainer.rows,\n areas: '\"case-nav content utilities\"'\n };\n }\n } else if (summaryPanelCollapsed) {\n if (isLargeOrAbove || isMediumOrAbove) {\n caseViewGridContainer = {\n cols: 'minmax(0, 1fr) minmax(0, max-content)',\n colGap: 2,\n rows: caseViewGridContainer.rows,\n areas: '\"case-nav case-nav\" \"content utilities\"'\n };\n }\n } else if (persistentUtility) {\n if (isExtraLargeOrAbove) {\n fixedSummaryWidth = '25rem';\n caseViewGridContainer = {\n cols: 'minmax(0, max-content) minmax(0, 1fr) repeat(2, minmax(0, max-content))',\n colGap: 2,\n rows: caseViewGridContainer.rows,\n areas: '\"case-nav content persistentUtility utilities\"'\n };\n } else if (isLargeOrAbove || isMediumOrAbove) {\n caseViewGridContainer = {\n cols: 'minmax(0, 1fr) repeat(2, minmax(0, max-content))',\n colGap: 2,\n rows: caseViewGridContainer.rows,\n areas: '\"case-nav case-nav case-nav\" \"content persistentUtility utilities\"'\n };\n }\n }\n\n const animateSummaryPanel = (type: 'open' | 'close') => {\n if (type === 'close') {\n const animation = [{ width: fixedSummaryWidth }, { width: 0 }];\n caseViewSummaryContainerRef.current?.animate(animation, 250);\n } else {\n const animation = [{ width: 0 }, { width: isLargeOrAbove ? '25rem' : '22rem' }];\n caseViewSummaryContainerRef.current?.animate(animation, 250);\n }\n };\n\n return (\n <Grid\n as={StyledCaseView}\n stickyOffset={offsets.sticky}\n ref={caseViewRef}\n container={caseViewGridContainer}\n item={{ area: 'caseView' }}\n forceMobile={forceMobile}\n isMediumOrAbove={isMediumOrAbove}\n {...restProps}\n >\n <Grid\n as={StyledSummaryRegion}\n item={{ area: 'case-nav' }}\n forceMobile={forceMobile}\n desktop={\n isMediumOrAbove && (!persistentUtility || isExtraLargeOrAbove) && !summaryPanelCollapsed\n }\n isLargeOrAbove={isLargeOrAbove}\n ref={caseViewSummaryContainerRef}\n style={\n ['collapsing', 'expanding'].includes(summaryAnimationState)\n ? {\n overflow: 'hidden'\n }\n : undefined\n }\n >\n <CaseSummary\n ref={caseViewSummaryRef}\n headerRef={caseSummaryHeaderRef}\n caseId={caseId}\n heading={heading}\n caseLink={caseLink}\n icon={icon}\n followed={followed}\n onFollowedChange={onFollowedChange}\n parentCases={parentCases}\n summary={summary}\n actions={actions}\n onEdit={onEdit}\n tabs={{\n items: tabItems,\n onClick: onTabClick,\n currentTabId\n }}\n forceMobile={forceMobile}\n desktop={\n ((isMediumOrAbove && !persistentUtility) || isExtraLargeOrAbove) &&\n !summaryPanelCollapsed\n }\n fixedWidth={isMediumOrAbove ? fixedSummaryWidth : undefined}\n collapsible={isMediumOrAbove && !persistentUtility}\n collapsed={summaryPanelCollapsed}\n onBeforeCollapse={() => {\n animateSummaryPanel('close');\n }}\n onAfterCollapse={() => setSummaryPanelCollapsed(true)}\n onBeforeExpand={() => {\n animateSummaryPanel('open');\n setSummaryPanelCollapsed(false);\n }}\n onAnimationStateChange={setSummaryAnimationState}\n />\n </Grid>\n\n <Grid\n container={{\n cols: 'minmax(0, 1fr)',\n alignContent: 'start',\n rowGap: 2\n }}\n item={{ area: 'content' }}\n as={StyledCaseViewContent}\n forceMobile={forceMobile}\n isMediumOrAbove={isMediumOrAbove}\n persistentUtility={Boolean(persistentUtility)}\n style={{\n transform: ['collapsing', 'expanding'].includes(summaryAnimationState)\n ? `translate(0, ${caseSummaryHeaderRef.current?.offsetHeight}px) `\n : undefined,\n marginInlineStart:\n (summaryPanelCollapsed && isMediumOrAbove) ||\n (persistentUtility && !isExtraLargeOrAbove)\n ? '1rem'\n : 0\n }}\n >\n {banners && <div>{banners}</div>}\n {stages && <div>{stages}</div>}\n {tasks && <div>{tasks}</div>}\n {(!isMediumOrAbove ||\n (persistentUtility && !isExtraLargeOrAbove) ||\n summaryPanelCollapsed) && (\n <StyledMobileTabs\n type='horizontal'\n tabs={tabItems}\n onTabClick={onTabClick}\n currentTabId={currentTabId}\n />\n )}\n <div ref={setTabContentEl}>\n {tabContent?.map(({ id, content }) => (\n <TabPanel currentTabId={currentTabId} tabId={id} key={id}>\n {content}\n </TabPanel>\n ))}\n </div>\n </Grid>\n\n {persistentUtility && isMediumOrAbove && (\n <Grid as={StyledPersistentUtility} item={{ area: 'persistentUtility' }}>\n {persistentUtility.content}\n </Grid>\n )}\n {!isLargeOrAbove && (\n <Drawer\n as={StyledCaseDrawer}\n open={utilitiesShown && isMediumOrAbove}\n position='fixed'\n placement={direction.end}\n shadow\n nullWhenClosed\n hasPersistentUtility={!!persistentUtility}\n >\n <Flex as={StyledCaseDrawerContent} container={{ direction: 'column', gap: 2 }}>\n <Flex container={{ justify: 'end' }}>\n <Button\n variant='simple'\n icon\n onClick={toggleUtilities}\n as={StyledUtilToggle}\n label={t('collapse_utilities_panel')}\n >\n <Icon name={`move-${direction.end}-solid`} />\n </Button>\n </Flex>\n {utilities}\n </Flex>\n </Drawer>\n )}\n {utilities && isMediumOrAbove && (\n <Grid\n ref={(el: HTMLDivElement) => {\n if (el) (scrollStickOptions.current?.elements).push(el);\n }}\n as={StyledCaseViewUtilities}\n container={{\n cols: 'minmax(0, 1fr)',\n rowGap: 2\n }}\n item={{\n area: 'utilities'\n }}\n utilitiesShown={utilitiesShown && isLargeOrAbove}\n style={\n ['collapsing', 'expanding'].includes(summaryAnimationState)\n ? {\n transform: `translate(0, ${caseSummaryHeaderRef.current?.offsetHeight}px) `\n }\n : undefined\n }\n >\n <Flex container={{ justify: utilitiesShown ? 'end' : 'center' }}>\n <Button\n variant='simple'\n icon\n onClick={toggleUtilities}\n as={StyledUtilToggle}\n label={t(utilitiesShown ? 'collapse_utilities_panel' : 'expand_utilities_panel')}\n >\n <Icon name={utilitiesIcon} />\n </Button>\n </Flex>\n <Flex\n container={\n utilitiesShown && isLargeOrAbove ? { direction: 'column', gap: 2 } : undefined\n }\n hidden={!utilitiesShown || !isLargeOrAbove}\n >\n {utilities}\n </Flex>\n\n {(!utilitiesShown || (isMediumOrAbove && !isLargeOrAbove)) && (\n <UtilitiesSummary\n items={utilitiesSummaryItems || []}\n onClick={toggleUtilities}\n onKeyDown={toggleUtilities}\n />\n )}\n </Grid>\n )}\n </Grid>\n );\n};\n\nexport default CaseView;\n"]}
@@ -0,0 +1,24 @@
1
+ export declare const StyledCaseViewContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
2
+ forceMobile?: boolean | undefined;
3
+ isMediumOrAbove?: boolean | undefined;
4
+ persistentUtility?: boolean | undefined;
5
+ }, never>;
6
+ export declare const StyledMobileTabs: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").TabsProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
7
+ export declare const StyledUtilToggle: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;
8
+ export declare const StyledCaseViewUtilities: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
9
+ utilitiesShown: boolean;
10
+ }, never>;
11
+ export declare const StyledCaseView: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
12
+ forceMobile?: boolean | undefined;
13
+ isMediumOrAbove?: boolean | undefined;
14
+ stickyOffset: number;
15
+ }, never>;
16
+ export declare const StyledSummaryRegion: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
17
+ forceMobile?: boolean | undefined;
18
+ desktop?: boolean | undefined;
19
+ }, never>;
20
+ export declare const StyledCaseDrawer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
21
+ export declare const StyledCaseDrawerContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
22
+ export declare const StyledPersistentUtility: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
23
+ export declare const ScrollStick: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
24
+ //# sourceMappingURL=CaseView.styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CaseView.styles.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,qBAAqB;;;;SAoBhC,CAAC;AAEH,eAAO,MAAM,gBAAgB,mOAI3B,CAAC;AAIH,eAAO,MAAM,gBAAgB,4GAM3B,CAAC;AAIH,eAAO,MAAM,uBAAuB;oBAAgC,OAAO;SAQ1E,CAAC;AAIF,eAAO,MAAM,cAAc;;;kBAGX,MAAM;SAiBpB,CAAC;AAIH,eAAO,MAAM,mBAAmB;;;SAiB9B,CAAC;AAIH,eAAO,MAAM,gBAAgB,yGAU3B,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAOlC,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAQlC,CAAC;AAIH,eAAO,MAAM,WAAW,yGAGvB,CAAC"}
@@ -0,0 +1,111 @@
1
+ import styled, { css } from 'styled-components';
2
+ import { defaultThemeProp, Tabs } from '@pega/cosmos-react-core';
3
+ export const StyledCaseViewContent = styled.div(({ theme, forceMobile, isMediumOrAbove, persistentUtility }) => {
4
+ return css `
5
+ padding: calc(2 * ${theme.base.spacing});
6
+
7
+ ${persistentUtility &&
8
+ isMediumOrAbove &&
9
+ css `
10
+ margin-inline-start: calc(2 * ${theme.base.spacing});
11
+ `}
12
+
13
+ ${!forceMobile &&
14
+ isMediumOrAbove &&
15
+ css `
16
+ padding: calc(2 * ${theme.base.spacing}) 0;
17
+ `}
18
+ `;
19
+ });
20
+ export const StyledMobileTabs = styled(Tabs)(({ theme }) => {
21
+ return css `
22
+ border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};
23
+ `;
24
+ });
25
+ StyledMobileTabs.defaultProps = defaultThemeProp;
26
+ export const StyledUtilToggle = styled.button(({ theme }) => {
27
+ return css `
28
+ align-self: flex-end;
29
+ color: ${theme.base.palette['foreground-color']};
30
+ margin-inline-end: 0.375rem;
31
+ `;
32
+ });
33
+ StyledUtilToggle.defaultProps = defaultThemeProp;
34
+ export const StyledCaseViewUtilities = styled.div(({ utilitiesShown, theme }) => {
35
+ return css `
36
+ width: ${utilitiesShown ? '25rem' : 'auto'};
37
+ height: max-content;
38
+ padding: calc(2 * ${theme.base.spacing}) 0 calc(2 * ${theme.base.spacing});
39
+ `;
40
+ });
41
+ StyledCaseViewUtilities.defaultProps = defaultThemeProp;
42
+ export const StyledCaseView = styled.div(({ theme, forceMobile, isMediumOrAbove, stickyOffset }) => {
43
+ return css `
44
+ --case-view-header-offset: ${stickyOffset}px;
45
+ --case-view-content-height: calc(100vh - var(--case-view-header-offset, 0rem));
46
+ min-height: calc(100vh - var(--appshell-offset, 0rem));
47
+ position: relative;
48
+ background-color: ${theme.base.palette['app-background']};
49
+
50
+ > :last-child {
51
+ ${!forceMobile &&
52
+ isMediumOrAbove &&
53
+ css `
54
+ margin-inline-end: calc(2 * ${theme.base.spacing});
55
+ `}
56
+ }
57
+ `;
58
+ });
59
+ StyledCaseView.defaultProps = defaultThemeProp;
60
+ export const StyledSummaryRegion = styled.div(({ theme, forceMobile, desktop }) => {
61
+ return css `
62
+ position: sticky;
63
+ top: var(--appshell-offset, 0);
64
+ width: 100%;
65
+ background-color: ${theme.base.palette['primary-background']};
66
+ z-index: ${theme.base['z-index'].popover};
67
+
68
+ ${!forceMobile &&
69
+ desktop &&
70
+ css `
71
+ height: var(--case-view-content-height);
72
+ `}
73
+ `;
74
+ });
75
+ StyledSummaryRegion.defaultProps = defaultThemeProp;
76
+ export const StyledCaseDrawer = styled.div(({ theme }) => {
77
+ return css `
78
+ min-width: 21.875rem;
79
+ max-width: 31.25rem;
80
+ width: calc((100vw - 31.25rem) / 10 + 21.875rem);
81
+ background-color: ${theme.base.palette['primary-background']};
82
+ height: var(--case-view-content-height);
83
+ top: var(--case-view-header-offset);
84
+ z-index: ${theme.base['z-index'].drawer - 1};
85
+ `;
86
+ });
87
+ StyledCaseDrawer.defaultProps = defaultThemeProp;
88
+ export const StyledCaseDrawerContent = styled.div(({ theme }) => {
89
+ return css `
90
+ background-color: ${theme.base.palette['app-background']};
91
+ padding: calc(2 * ${theme.base.spacing});
92
+ height: 100%;
93
+ overflow: auto;
94
+ `;
95
+ });
96
+ StyledCaseDrawerContent.defaultProps = defaultThemeProp;
97
+ export const StyledPersistentUtility = styled.div(() => {
98
+ return css `
99
+ max-width: 60ch;
100
+ overflow: auto;
101
+ position: sticky;
102
+ height: var(--case-view-content-height);
103
+ top: var(--case-view-header-offset);
104
+ `;
105
+ });
106
+ StyledPersistentUtility.defaultProps = defaultThemeProp;
107
+ export const ScrollStick = styled.div `
108
+ position: sticky;
109
+ top: 0;
110
+ `;
111
+ //# sourceMappingURL=CaseView.styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CaseView.styles.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp, Tabs } from '@pega/cosmos-react-core';\n\nexport const StyledCaseViewContent = styled.div<{\n forceMobile?: boolean;\n isMediumOrAbove?: boolean;\n persistentUtility?: boolean;\n}>(({ theme, forceMobile, isMediumOrAbove, persistentUtility }) => {\n return css`\n padding: calc(2 * ${theme.base.spacing});\n\n ${persistentUtility &&\n isMediumOrAbove &&\n css`\n margin-inline-start: calc(2 * ${theme.base.spacing});\n `}\n\n ${!forceMobile &&\n isMediumOrAbove &&\n css`\n padding: calc(2 * ${theme.base.spacing}) 0;\n `}\n `;\n});\n\nexport const StyledMobileTabs = styled(Tabs)(({ theme }) => {\n return css`\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n `;\n});\n\nStyledMobileTabs.defaultProps = defaultThemeProp;\n\nexport const StyledUtilToggle = styled.button(({ theme }) => {\n return css`\n align-self: flex-end;\n color: ${theme.base.palette['foreground-color']};\n margin-inline-end: 0.375rem;\n `;\n});\n\nStyledUtilToggle.defaultProps = defaultThemeProp;\n\nexport const StyledCaseViewUtilities = styled.div<{ utilitiesShown: boolean }>(\n ({ utilitiesShown, theme }) => {\n return css`\n width: ${utilitiesShown ? '25rem' : 'auto'};\n height: max-content;\n padding: calc(2 * ${theme.base.spacing}) 0 calc(2 * ${theme.base.spacing});\n `;\n }\n);\n\nStyledCaseViewUtilities.defaultProps = defaultThemeProp;\n\nexport const StyledCaseView = styled.div<{\n forceMobile?: boolean;\n isMediumOrAbove?: boolean;\n stickyOffset: number;\n}>(({ theme, forceMobile, isMediumOrAbove, stickyOffset }) => {\n return css`\n --case-view-header-offset: ${stickyOffset}px;\n --case-view-content-height: calc(100vh - var(--case-view-header-offset, 0rem));\n min-height: calc(100vh - var(--appshell-offset, 0rem));\n position: relative;\n background-color: ${theme.base.palette['app-background']};\n\n > :last-child {\n ${!forceMobile &&\n isMediumOrAbove &&\n css`\n margin-inline-end: calc(2 * ${theme.base.spacing});\n `}\n }\n `;\n});\n\nStyledCaseView.defaultProps = defaultThemeProp;\n\nexport const StyledSummaryRegion = styled.div<{\n forceMobile?: boolean;\n desktop?: boolean;\n}>(({ theme, forceMobile, desktop }) => {\n return css`\n position: sticky;\n top: var(--appshell-offset, 0);\n width: 100%;\n background-color: ${theme.base.palette['primary-background']};\n z-index: ${theme.base['z-index'].popover};\n\n ${!forceMobile &&\n desktop &&\n css`\n height: var(--case-view-content-height);\n `}\n `;\n});\n\nStyledSummaryRegion.defaultProps = defaultThemeProp;\n\nexport const StyledCaseDrawer = styled.div(({ theme }) => {\n return css`\n min-width: 21.875rem;\n max-width: 31.25rem;\n width: calc((100vw - 31.25rem) / 10 + 21.875rem);\n background-color: ${theme.base.palette['primary-background']};\n height: var(--case-view-content-height);\n top: var(--case-view-header-offset);\n z-index: ${theme.base['z-index'].drawer - 1};\n `;\n});\n\nStyledCaseDrawer.defaultProps = defaultThemeProp;\n\nexport const StyledCaseDrawerContent = styled.div(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['app-background']};\n padding: calc(2 * ${theme.base.spacing});\n height: 100%;\n overflow: auto;\n `;\n});\n\nStyledCaseDrawerContent.defaultProps = defaultThemeProp;\n\nexport const StyledPersistentUtility = styled.div(() => {\n return css`\n max-width: 60ch;\n overflow: auto;\n position: sticky;\n height: var(--case-view-content-height);\n top: var(--case-view-header-offset);\n `;\n});\n\nStyledPersistentUtility.defaultProps = defaultThemeProp;\n\nexport const ScrollStick = styled.div`\n position: sticky;\n top: 0;\n`;\n"]}
@@ -19,9 +19,7 @@ StyledMobileCaseViewHeader.defaultProps = defaultThemeProp;
19
19
  /** @deprecated */
20
20
  const MobileCaseView = (props) => {
21
21
  const { tabs, tabContent, title, ...restProps } = props;
22
- return (_jsxs(Flex, Object.assign({ container: { direction: 'column' }, as: StyledMobileCaseView }, restProps, { children: [_jsxs(Flex, Object.assign({ container: { direction: 'column' }, item: { shrink: 0 }, as: StyledMobileCaseViewHeader }, { children: [_jsx(Text, Object.assign({ as: 'h1' }, { children: title }), void 0),
23
- _jsx(Tabs, Object.assign({}, tabs, { type: 'horizontal', inverted: true }), void 0)] }), void 0),
24
- tabContent] }), void 0));
22
+ return (_jsxs(Flex, { container: { direction: 'column' }, as: StyledMobileCaseView, ...restProps, children: [_jsxs(Flex, { container: { direction: 'column' }, item: { shrink: 0 }, as: StyledMobileCaseViewHeader, children: [_jsx(Text, { as: 'h1', children: title }, void 0), _jsx(Tabs, { ...tabs, type: 'horizontal', inverted: true }, void 0)] }, void 0), tabContent] }, void 0));
25
23
  };
26
24
  export default MobileCaseView;
27
25
  //# sourceMappingURL=MobileCaseView.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"MobileCaseView.js","sourceRoot":"","sources":["../../../src/components/CaseView/MobileCaseView.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EACL,IAAI,EACJ,IAAI,EAEJ,IAAI,EACJ,gBAAgB,EAEjB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,kDAAkD,CAAC;AAQ9E,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAA;;;CAG7C,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG,MAAM,CAAC,MAAM,CAAA;WAC5C,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK;sBAC5B,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW;;IAE/D,UAAU;eACC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO;;CAE/C,CAAC;AAEF,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AACrD,0BAA0B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3D,kBAAkB;AAClB,MAAM,cAAc,GAA2C,CAAC,KAA0B,EAAE,EAAE;IAC5F,MAAM,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAExD,OAAO,CACL,MAAC,IAAI,kBAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,oBAAoB,IAAM,SAAS,eAC/E,MAAC,IAAI,kBACH,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAClC,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EACnB,EAAE,EAAE,0BAA0B,iBAE9B,KAAC,IAAI,kBAAC,EAAE,EAAC,IAAI,gBAAE,KAAK,YAAQ;oBAC5B,KAAC,IAAI,oBAAK,IAAI,IAAE,IAAI,EAAC,YAAY,EAAC,QAAQ,kBAAG,aACxC;YACN,UAAU,aACN,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { FC, ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport {\n Flex,\n Tabs,\n TabsProps,\n Text,\n defaultThemeProp,\n ForwardProps\n} from '@pega/cosmos-react-core';\nimport { StyledText } from '@pega/cosmos-react-core/lib/components/Text/Text';\n\nexport interface MobileCaseViewProps {\n title: string;\n tabs: TabsProps;\n tabContent: ReactNode;\n}\n\nexport const StyledMobileCaseView = styled.div`\n min-height: 100vh;\n background-color: #e9eef3;\n`;\n\nexport const StyledMobileCaseViewHeader = styled.header`\n color: ${props => props.theme.base.palette.light};\n background-color: ${props => props.theme.base.palette.interactive};\n\n ${StyledText} {\n padding: ${props => props.theme.base.spacing};\n }\n`;\n\nStyledMobileCaseView.defaultProps = defaultThemeProp;\nStyledMobileCaseViewHeader.defaultProps = defaultThemeProp;\n\n/** @deprecated */\nconst MobileCaseView: FC<ForwardProps & MobileCaseViewProps> = (props: MobileCaseViewProps) => {\n const { tabs, tabContent, title, ...restProps } = props;\n\n return (\n <Flex container={{ direction: 'column' }} as={StyledMobileCaseView} {...restProps}>\n <Flex\n container={{ direction: 'column' }}\n item={{ shrink: 0 }}\n as={StyledMobileCaseViewHeader}\n >\n <Text as='h1'>{title}</Text>\n <Tabs {...tabs} type='horizontal' inverted />\n </Flex>\n {tabContent}\n </Flex>\n );\n};\n\nexport default MobileCaseView;\n"]}
1
+ {"version":3,"file":"MobileCaseView.js","sourceRoot":"","sources":["../../../src/components/CaseView/MobileCaseView.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EACL,IAAI,EACJ,IAAI,EAEJ,IAAI,EACJ,gBAAgB,EAEjB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,kDAAkD,CAAC;AAQ9E,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAA;;;CAG7C,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG,MAAM,CAAC,MAAM,CAAA;WAC5C,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK;sBAC5B,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW;;IAE/D,UAAU;eACC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO;;CAE/C,CAAC;AAEF,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AACrD,0BAA0B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3D,kBAAkB;AAClB,MAAM,cAAc,GAA2C,CAAC,KAA0B,EAAE,EAAE;IAC5F,MAAM,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAExD,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,oBAAoB,KAAM,SAAS,aAC/E,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAClC,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EACnB,EAAE,EAAE,0BAA0B,aAE9B,KAAC,IAAI,IAAC,EAAE,EAAC,IAAI,YAAE,KAAK,WAAQ,EAC5B,KAAC,IAAI,OAAK,IAAI,EAAE,IAAI,EAAC,YAAY,EAAC,QAAQ,iBAAG,YACxC,EACN,UAAU,YACN,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { FC, ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport {\n Flex,\n Tabs,\n TabsProps,\n Text,\n defaultThemeProp,\n ForwardProps\n} from '@pega/cosmos-react-core';\nimport { StyledText } from '@pega/cosmos-react-core/lib/components/Text/Text';\n\nexport interface MobileCaseViewProps {\n title: string;\n tabs: TabsProps;\n tabContent: ReactNode;\n}\n\nexport const StyledMobileCaseView = styled.div`\n min-height: 100vh;\n background-color: #e9eef3;\n`;\n\nexport const StyledMobileCaseViewHeader = styled.header`\n color: ${props => props.theme.base.palette.light};\n background-color: ${props => props.theme.base.palette.interactive};\n\n ${StyledText} {\n padding: ${props => props.theme.base.spacing};\n }\n`;\n\nStyledMobileCaseView.defaultProps = defaultThemeProp;\nStyledMobileCaseViewHeader.defaultProps = defaultThemeProp;\n\n/** @deprecated */\nconst MobileCaseView: FC<ForwardProps & MobileCaseViewProps> = (props: MobileCaseViewProps) => {\n const { tabs, tabContent, title, ...restProps } = props;\n\n return (\n <Flex container={{ direction: 'column' }} as={StyledMobileCaseView} {...restProps}>\n <Flex\n container={{ direction: 'column' }}\n item={{ shrink: 0 }}\n as={StyledMobileCaseViewHeader}\n >\n <Text as='h1'>{title}</Text>\n <Tabs {...tabs} type='horizontal' inverted />\n </Flex>\n {tabContent}\n </Flex>\n );\n};\n\nexport default MobileCaseView;\n"]}
@@ -9,14 +9,13 @@ export const StyledUtilitiesSummary = styled.div(({ theme }) => {
9
9
  });
10
10
  const UtilitiesSummary = ({ items = [], ...restProps }) => {
11
11
  const t = useI18n();
12
- return items.length ? (_jsx(Card, Object.assign({}, restProps, { interactive: true, tabIndex: 0, role: 'button', container: { direction: 'column', alignItems: 'center', gap: 3 }, "aria-label": `${t('utilities_summary')} ${t('expand_noun', t('utilities_panel'))}`, as: StyledUtilitiesSummary }, { children: items.map(item => {
13
- return (_jsxs(Flex, Object.assign({ container: {
12
+ return items.length ? (_jsx(Card, { ...restProps, interactive: true, tabIndex: 0, role: 'button', container: { direction: 'column', alignItems: 'center', gap: 3 }, "aria-label": `${t('utilities_summary')}. ${t('expand_utilities_panel')}`, as: StyledUtilitiesSummary, children: items.map(item => {
13
+ return (_jsxs(Flex, { container: {
14
14
  direction: 'column',
15
15
  alignItems: 'center',
16
16
  gap: 0.5
17
- }, item: { grow: 1 } }, { children: [_jsx(Icon, { name: item.iconName }, void 0),
18
- item.count !== undefined && _jsx(Count, Object.assign({ variant: 'default' }, { children: item.count }), void 0)] }), item.iconName));
19
- }) }), void 0)) : null;
17
+ }, item: { grow: 1 }, children: [_jsx(Icon, { name: item.iconName }, void 0), item.count !== undefined && _jsx(Count, { variant: 'default', children: item.count }, void 0)] }, item.iconName));
18
+ }) }, void 0)) : null;
20
19
  };
21
20
  export default UtilitiesSummary;
22
21
  //# sourceMappingURL=UtilitiesSummary.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"UtilitiesSummary.js","sourceRoot":"","sources":["../../../src/components/CaseView/UtilitiesSummary.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAgB,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAMzF,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC7D,OAAO,GAAG,CAAA;;eAEG,KAAK,CAAC,IAAI,CAAC,OAAO;GAC9B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,gBAAgB,GAA4D,CAAC,EACjF,KAAK,GAAG,EAAE,EACV,GAAG,SAAS,EACU,EAAE,EAAE;IAC1B,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CACpB,KAAC,IAAI,oBACC,SAAS,IACb,WAAW,QACX,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,gBACpD,GAAG,CAAC,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC,aAAa,EAAE,CAAC,CAAC,iBAAiB,CAAC,CAAC,EAAE,EACjF,EAAE,EAAE,sBAAsB,gBAEzB,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YAChB,OAAO,CACL,MAAC,IAAI,kBACH,SAAS,EAAE;oBACT,SAAS,EAAE,QAAQ;oBACnB,UAAU,EAAE,QAAQ;oBACpB,GAAG,EAAE,GAAG;iBACT,EACD,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,iBAGjB,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,WAAI;oBAC5B,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,KAAC,KAAK,kBAAC,OAAO,EAAC,SAAS,gBAAE,IAAI,CAAC,KAAK,YAAS,MAHrE,IAAI,CAAC,QAAQ,CAIb,CACR,CAAC;QACJ,CAAC,CAAC,YACG,CACR,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Card, Count, Flex, Icon, ForwardProps, useI18n } from '@pega/cosmos-react-core';\n\nexport interface UtilitiesSummaryProps {\n items: { iconName: string; count?: number }[];\n}\n\nexport const StyledUtilitiesSummary = styled.div(({ theme }) => {\n return css`\n width: 2.75rem;\n padding: ${theme.base.spacing} 0;\n `;\n});\n\nconst UtilitiesSummary: FunctionComponent<UtilitiesSummaryProps & ForwardProps> = ({\n items = [],\n ...restProps\n}: UtilitiesSummaryProps) => {\n const t = useI18n();\n return items.length ? (\n <Card\n {...restProps}\n interactive\n tabIndex={0}\n role='button'\n container={{ direction: 'column', alignItems: 'center', gap: 3 }}\n aria-label={`${t('utilities_summary')} ${t('expand_noun', t('utilities_panel'))}`}\n as={StyledUtilitiesSummary}\n >\n {items.map(item => {\n return (\n <Flex\n container={{\n direction: 'column',\n alignItems: 'center',\n gap: 0.5\n }}\n item={{ grow: 1 }}\n key={item.iconName}\n >\n <Icon name={item.iconName} />\n {item.count !== undefined && <Count variant='default'>{item.count}</Count>}\n </Flex>\n );\n })}\n </Card>\n ) : null;\n};\n\nexport default UtilitiesSummary;\n"]}
1
+ {"version":3,"file":"UtilitiesSummary.js","sourceRoot":"","sources":["../../../src/components/CaseView/UtilitiesSummary.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAgB,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAMzF,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC7D,OAAO,GAAG,CAAA;;eAEG,KAAK,CAAC,IAAI,CAAC,OAAO;GAC9B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,gBAAgB,GAA4D,CAAC,EACjF,KAAK,GAAG,EAAE,EACV,GAAG,SAAS,EACU,EAAE,EAAE;IAC1B,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CACpB,KAAC,IAAI,OACC,SAAS,EACb,WAAW,QACX,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,gBACpD,GAAG,CAAC,CAAC,mBAAmB,CAAC,KAAK,CAAC,CAAC,wBAAwB,CAAC,EAAE,EACvE,EAAE,EAAE,sBAAsB,YAEzB,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YAChB,OAAO,CACL,MAAC,IAAI,IACH,SAAS,EAAE;oBACT,SAAS,EAAE,QAAQ;oBACnB,UAAU,EAAE,QAAQ;oBACpB,GAAG,EAAE,GAAG;iBACT,EACD,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,aAGjB,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,WAAI,EAC5B,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,KAAC,KAAK,IAAC,OAAO,EAAC,SAAS,YAAE,IAAI,CAAC,KAAK,WAAS,KAHrE,IAAI,CAAC,QAAQ,CAIb,CACR,CAAC;QACJ,CAAC,CAAC,WACG,CACR,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Card, Count, Flex, Icon, ForwardProps, useI18n } from '@pega/cosmos-react-core';\n\nexport interface UtilitiesSummaryProps {\n items: { iconName: string; count?: number }[];\n}\n\nexport const StyledUtilitiesSummary = styled.div(({ theme }) => {\n return css`\n width: 2.75rem;\n padding: ${theme.base.spacing} 0;\n `;\n});\n\nconst UtilitiesSummary: FunctionComponent<UtilitiesSummaryProps & ForwardProps> = ({\n items = [],\n ...restProps\n}: UtilitiesSummaryProps) => {\n const t = useI18n();\n return items.length ? (\n <Card\n {...restProps}\n interactive\n tabIndex={0}\n role='button'\n container={{ direction: 'column', alignItems: 'center', gap: 3 }}\n aria-label={`${t('utilities_summary')}. ${t('expand_utilities_panel')}`}\n as={StyledUtilitiesSummary}\n >\n {items.map(item => {\n return (\n <Flex\n container={{\n direction: 'column',\n alignItems: 'center',\n gap: 0.5\n }}\n item={{ grow: 1 }}\n key={item.iconName}\n >\n <Icon name={item.iconName} />\n {item.count !== undefined && <Count variant='default'>{item.count}</Count>}\n </Flex>\n );\n })}\n </Card>\n ) : null;\n};\n\nexport default UtilitiesSummary;\n"]}
@@ -1,5 +1,6 @@
1
1
  export { default } from './CaseView';
2
- export { CaseViewProps, StyledCaseView, StyledCaseViewContent, StyledCaseDrawer, StyledCaseDrawerContent, StyledSummaryRegion } from './CaseView';
2
+ export { CaseViewProps } from './CaseView';
3
+ export { StyledCaseView, StyledCaseViewContent, StyledCaseDrawer, StyledCaseDrawerContent, StyledSummaryRegion } from './CaseView.styles';
3
4
  export { default as MobileCaseView } from './MobileCaseView';
4
5
  export { MobileCaseViewProps } from './MobileCaseView';
5
6
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EACL,aAAa,EACb,cAAc,EACd,qBAAqB,EACrB,gBAAgB,EAChB,uBAAuB,EACvB,mBAAmB,EACpB,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EACL,cAAc,EACd,qBAAqB,EACrB,gBAAgB,EAChB,uBAAuB,EACvB,mBAAmB,EACpB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC"}
@@ -1,4 +1,4 @@
1
1
  export { default } from './CaseView';
2
- export { StyledCaseView, StyledCaseViewContent, StyledCaseDrawer, StyledCaseDrawerContent, StyledSummaryRegion } from './CaseView';
2
+ export { StyledCaseView, StyledCaseViewContent, StyledCaseDrawer, StyledCaseDrawerContent, StyledSummaryRegion } from './CaseView.styles';
3
3
  export { default as MobileCaseView } from './MobileCaseView';
4
4
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/CaseView/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAEL,cAAc,EACd,qBAAqB,EACrB,gBAAgB,EAChB,uBAAuB,EACvB,mBAAmB,EACpB,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC","sourcesContent":["export { default } from './CaseView';\nexport {\n CaseViewProps,\n StyledCaseView,\n StyledCaseViewContent,\n StyledCaseDrawer,\n StyledCaseDrawerContent,\n StyledSummaryRegion\n} from './CaseView';\nexport { default as MobileCaseView } from './MobileCaseView';\nexport { MobileCaseViewProps } from './MobileCaseView';\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/CaseView/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAErC,OAAO,EACL,cAAc,EACd,qBAAqB,EACrB,gBAAgB,EAChB,uBAAuB,EACvB,mBAAmB,EACpB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC","sourcesContent":["export { default } from './CaseView';\nexport { CaseViewProps } from './CaseView';\nexport {\n StyledCaseView,\n StyledCaseViewContent,\n StyledCaseDrawer,\n StyledCaseDrawerContent,\n StyledSummaryRegion\n} from './CaseView.styles';\nexport { default as MobileCaseView } from './MobileCaseView';\nexport { MobileCaseViewProps } from './MobileCaseView';\n"]}
@@ -0,0 +1,4 @@
1
+ import type { ConfigurableLayoutProps } from './ConfigurableLayout.types';
2
+ declare const ConfigurableLayout: import("react").ForwardRefExoticComponent<ConfigurableLayoutProps & import("react").RefAttributes<HTMLElement>>;
3
+ export default ConfigurableLayout;
4
+ //# sourceMappingURL=ConfigurableLayout.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ConfigurableLayout.d.ts","sourceRoot":"","sources":["../../../src/components/ConfigurableLayout/ConfigurableLayout.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,4BAA4B,CAAC;AA+B1E,QAAA,MAAM,kBAAkB,iHAsFvB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
@@ -0,0 +1,93 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { forwardRef, useState, useEffect, useRef, useMemo } from 'react';
3
+ import styled, { css } from 'styled-components';
4
+ import { Flex, defaultThemeProp } from '@pega/cosmos-react-core';
5
+ import { containerMinWidth, cellGap } from './defaults';
6
+ import LayoutCell from './LayoutCell';
7
+ const StyledConfigurableLayout = styled.div(() => {
8
+ return css `
9
+ overflow: hidden;
10
+ `;
11
+ });
12
+ const StyledCellGrid = styled.div(({ theme }) => {
13
+ return css `
14
+ /* Note: inset position used to negate "column" inline margin on items */
15
+ position: relative;
16
+ width: calc(100% + ${cellGap * 2} * ${theme.base.spacing});
17
+ max-width: calc(100% + ${cellGap * 2} * ${theme.base.spacing});
18
+ inset-inline: calc(-${cellGap} * ${theme.base.spacing});
19
+ margin-block-end: calc(-2 * ${cellGap} * ${theme.base.spacing});
20
+ `;
21
+ });
22
+ StyledCellGrid.defaultProps = defaultThemeProp;
23
+ const StyledContainerRuler = styled.div(({ theme }) => {
24
+ return css `
25
+ margin-inline: calc(${cellGap} * ${theme.base.spacing});
26
+ width: calc(100% - ${cellGap * 2} * ${theme.base.spacing});
27
+ `;
28
+ });
29
+ StyledContainerRuler.defaultProps = defaultThemeProp;
30
+ const ConfigurableLayout = forwardRef(({ items, arrangement }, ref) => {
31
+ const [renderMode, setRenderMode] = useState('direct');
32
+ const containerRulerRef = useRef(null);
33
+ // Update render mode when arrangement wraps
34
+ useEffect(() => {
35
+ const activeArrangement = arrangement?.hasWrapped !== undefined && !arrangement.hasWrapped;
36
+ if (activeArrangement) {
37
+ switch (arrangement.size) {
38
+ case 'main':
39
+ setRenderMode('direct');
40
+ break;
41
+ case 'half':
42
+ setRenderMode('double');
43
+ break;
44
+ case 'narrow':
45
+ setRenderMode('full');
46
+ break;
47
+ default:
48
+ setRenderMode('direct');
49
+ break;
50
+ }
51
+ return;
52
+ }
53
+ // Use direct by default
54
+ setRenderMode('direct');
55
+ }, [arrangement?.hasWrapped]);
56
+ const content = useMemo(() => {
57
+ if (items && !!items.length) {
58
+ return items.map(itemConfig => {
59
+ const config = {
60
+ ...itemConfig,
61
+ layoutConfig: { ...itemConfig.layoutConfig }
62
+ };
63
+ if (renderMode !== 'direct') {
64
+ switch (renderMode) {
65
+ case 'double': {
66
+ const doubleWidth = {
67
+ '1/4': '1/2',
68
+ '1/3': '2/3',
69
+ '1/2': 'full',
70
+ '2/3': 'full',
71
+ '3/4': 'full',
72
+ full: 'full'
73
+ };
74
+ config.layoutConfig.width = doubleWidth[config.layoutConfig.width];
75
+ break;
76
+ }
77
+ case 'full':
78
+ config.layoutConfig.width = 'full';
79
+ break;
80
+ default:
81
+ config.layoutConfig.width = 'full';
82
+ break;
83
+ }
84
+ }
85
+ return _jsx(LayoutCell, { config: config }, `${itemConfig.id}--${renderMode}`);
86
+ });
87
+ }
88
+ return null;
89
+ }, [items, renderMode]);
90
+ return (_jsx(StyledConfigurableLayout, { children: _jsxs(Flex, { as: StyledCellGrid, container: { wrap: 'wrap', justify: 'stretch', alignItems: 'stretch' }, item: { basis: containerMinWidth, grow: 1 }, ref: ref, children: [_jsx(StyledContainerRuler, { ref: containerRulerRef }, void 0), content] }, void 0) }, void 0));
91
+ });
92
+ export default ConfigurableLayout;
93
+ //# sourceMappingURL=ConfigurableLayout.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ConfigurableLayout.js","sourceRoot":"","sources":["../../../src/components/ConfigurableLayout/ConfigurableLayout.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, PropsWithoutRef, Ref, useState, useEffect, useRef, useMemo } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Flex, defaultThemeProp } from '@pega/cosmos-react-core';\n\nimport type { ConfigurableLayoutProps } from './ConfigurableLayout.types';\nimport { containerMinWidth, cellGap } from './defaults';\nimport widthConfigOptions from './options';\nimport LayoutCell from './LayoutCell';\n\nconst StyledConfigurableLayout = styled.div(() => {\n return css`\n overflow: hidden;\n `;\n});\n\nconst StyledCellGrid = styled.div(({ theme }) => {\n return css`\n /* Note: inset position used to negate \"column\" inline margin on items */\n position: relative;\n width: calc(100% + ${cellGap * 2} * ${theme.base.spacing});\n max-width: calc(100% + ${cellGap * 2} * ${theme.base.spacing});\n inset-inline: calc(-${cellGap} * ${theme.base.spacing});\n margin-block-end: calc(-2 * ${cellGap} * ${theme.base.spacing});\n `;\n});\nStyledCellGrid.defaultProps = defaultThemeProp;\n\nconst StyledContainerRuler = styled.div(({ theme }) => {\n return css`\n margin-inline: calc(${cellGap} * ${theme.base.spacing});\n width: calc(100% - ${cellGap * 2} * ${theme.base.spacing});\n `;\n});\nStyledContainerRuler.defaultProps = defaultThemeProp;\n\nconst ConfigurableLayout = forwardRef(\n ({ items, arrangement }: PropsWithoutRef<ConfigurableLayoutProps>, ref: Ref<HTMLElement>) => {\n const [renderMode, setRenderMode] = useState<'direct' | 'double' | 'full'>('direct');\n const containerRulerRef = useRef<HTMLDivElement>(null);\n\n // Update render mode when arrangement wraps\n useEffect(() => {\n const activeArrangement = arrangement?.hasWrapped !== undefined && !arrangement.hasWrapped;\n\n if (activeArrangement) {\n switch (arrangement.size) {\n case 'main':\n setRenderMode('direct');\n break;\n case 'half':\n setRenderMode('double');\n break;\n case 'narrow':\n setRenderMode('full');\n break;\n default:\n setRenderMode('direct');\n break;\n }\n\n return;\n }\n\n // Use direct by default\n setRenderMode('direct');\n }, [arrangement?.hasWrapped]);\n\n const content = useMemo(() => {\n if (items && !!items.length) {\n return items.map(itemConfig => {\n const config = {\n ...itemConfig,\n layoutConfig: { ...itemConfig.layoutConfig }\n };\n\n if (renderMode !== 'direct') {\n switch (renderMode) {\n case 'double': {\n const doubleWidth: { [key: string]: keyof typeof widthConfigOptions } = {\n '1/4': '1/2',\n '1/3': '2/3',\n '1/2': 'full',\n '2/3': 'full',\n '3/4': 'full',\n full: 'full'\n };\n\n config.layoutConfig.width = doubleWidth[config.layoutConfig.width];\n\n break;\n }\n case 'full':\n config.layoutConfig.width = 'full';\n break;\n default:\n config.layoutConfig.width = 'full';\n break;\n }\n }\n\n return <LayoutCell key={`${itemConfig.id}--${renderMode}`} config={config} />;\n });\n }\n\n return null;\n }, [items, renderMode]);\n\n return (\n <StyledConfigurableLayout>\n <Flex\n as={StyledCellGrid}\n container={{ wrap: 'wrap', justify: 'stretch', alignItems: 'stretch' }}\n item={{ basis: containerMinWidth, grow: 1 }}\n ref={ref}\n >\n <StyledContainerRuler ref={containerRulerRef} />\n {content}\n </Flex>\n </StyledConfigurableLayout>\n );\n }\n);\n\nexport default ConfigurableLayout;\n"]}
@@ -0,0 +1,43 @@
1
+ import type widthConfigOptions from './options';
2
+ /**
3
+ * Type for config of a single ConfigurableLayout item.
4
+ */
5
+ export interface Config {
6
+ /** Unique identifier in render region */
7
+ id: string;
8
+ /** Element to render */
9
+ content: JSX.Element;
10
+ /** Config for element */
11
+ layoutConfig: {
12
+ /** Responsive width option */
13
+ width: keyof typeof widthConfigOptions;
14
+ /**
15
+ * Fills remaining space if true, else does not grow beyond `width` value.
16
+ * @default true
17
+ */
18
+ fillAvailable?: boolean;
19
+ /** Flex basis (minimum fixed width) of element as:
20
+ * - a numeric value to be applied in __pixels__
21
+ * - a tuple of a numeric value and string unit
22
+ */
23
+ minWidth?: number | [number, 'px' | 'ch' | 'rem' | 'em'];
24
+ };
25
+ }
26
+ export interface ConfigurableLayoutProps {
27
+ /** Array of configs for individual layout cells */
28
+ items: Config[];
29
+ /** Arrangement properties */
30
+ arrangement?: {
31
+ /** Defines the arrangement size of the given ConfigurableLayout.
32
+ * Used to determine what width to apply to the given item when the arrangement is applied,
33
+ * with the following mapping:
34
+ * - 'narrow' --> applies 'full' width
35
+ * - 'main' --> applies configured width
36
+ * - 'half' --> applies double the configured width, or 'full' width (whichever is smaller)
37
+ */
38
+ size: 'narrow' | 'main' | 'half';
39
+ /** Indicates when the ConfigurableLayout has wrapped to the full width of it's container */
40
+ hasWrapped: boolean;
41
+ };
42
+ }
43
+ //# sourceMappingURL=ConfigurableLayout.types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ConfigurableLayout.types.d.ts","sourceRoot":"","sources":["../../../src/components/ConfigurableLayout/ConfigurableLayout.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,kBAAkB,MAAM,WAAW,CAAC;AAEhD;;GAEG;AACH,MAAM,WAAW,MAAM;IACrB,yCAAyC;IACzC,EAAE,EAAE,MAAM,CAAC;IACX,wBAAwB;IACxB,OAAO,EAAE,GAAG,CAAC,OAAO,CAAC;IACrB,yBAAyB;IACzB,YAAY,EAAE;QACZ,8BAA8B;QAC9B,KAAK,EAAE,MAAM,OAAO,kBAAkB,CAAC;QACvC;;;WAGG;QACH,aAAa,CAAC,EAAE,OAAO,CAAC;QACxB;;;WAGG;QACH,QAAQ,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,IAAI,CAAC,CAAC;KAC1D,CAAC;CACH;AAED,MAAM,WAAW,uBAAuB;IACtC,mDAAmD;IACnD,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,6BAA6B;IAC7B,WAAW,CAAC,EAAE;QACZ;;;;;;WAMG;QACH,IAAI,EAAE,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;QACjC,4FAA4F;QAC5F,UAAU,EAAE,OAAO,CAAC;KACrB,CAAC;CACH"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=ConfigurableLayout.types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ConfigurableLayout.types.js","sourceRoot":"","sources":["../../../src/components/ConfigurableLayout/ConfigurableLayout.types.ts"],"names":[],"mappings":"","sourcesContent":["import type widthConfigOptions from './options';\n\n/**\n * Type for config of a single ConfigurableLayout item.\n */\nexport interface Config {\n /** Unique identifier in render region */\n id: string;\n /** Element to render */\n content: JSX.Element;\n /** Config for element */\n layoutConfig: {\n /** Responsive width option */\n width: keyof typeof widthConfigOptions;\n /**\n * Fills remaining space if true, else does not grow beyond `width` value.\n * @default true\n */\n fillAvailable?: boolean;\n /** Flex basis (minimum fixed width) of element as:\n * - a numeric value to be applied in __pixels__\n * - a tuple of a numeric value and string unit\n */\n minWidth?: number | [number, 'px' | 'ch' | 'rem' | 'em'];\n };\n}\n\nexport interface ConfigurableLayoutProps {\n /** Array of configs for individual layout cells */\n items: Config[];\n /** Arrangement properties */\n arrangement?: {\n /** Defines the arrangement size of the given ConfigurableLayout.\n * Used to determine what width to apply to the given item when the arrangement is applied,\n * with the following mapping:\n * - 'narrow' --> applies 'full' width\n * - 'main' --> applies configured width\n * - 'half' --> applies double the configured width, or 'full' width (whichever is smaller)\n */\n size: 'narrow' | 'main' | 'half';\n /** Indicates when the ConfigurableLayout has wrapped to the full width of it's container */\n hasWrapped: boolean;\n };\n}\n"]}
@@ -0,0 +1,6 @@
1
+ import type { Config } from './ConfigurableLayout.types';
2
+ declare const LayoutCell: ({ config }: {
3
+ config: Config;
4
+ }) => JSX.Element | null;
5
+ export default LayoutCell;
6
+ //# sourceMappingURL=LayoutCell.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"LayoutCell.d.ts","sourceRoot":"","sources":["../../../src/components/ConfigurableLayout/LayoutCell.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAoDzD,QAAA,MAAM,UAAU;YAA0B,MAAM;wBAoC/C,CAAC;AAEF,eAAe,UAAU,CAAC"}