@pega/cosmos-react-build 2.1.3 → 2.1.6

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 (193) hide show
  1. package/package.json +3 -3
  2. package/lib/components/AppHeader/AppHeader.d.ts +0 -29
  3. package/lib/components/AppHeader/AppHeader.d.ts.map +0 -1
  4. package/lib/components/AppHeader/AppHeader.js +0 -32
  5. package/lib/components/AppHeader/AppHeader.js.map +0 -1
  6. package/lib/components/AppHeader/AppHeader.styles.d.ts +0 -12
  7. package/lib/components/AppHeader/AppHeader.styles.d.ts.map +0 -1
  8. package/lib/components/AppHeader/AppHeader.styles.js +0 -123
  9. package/lib/components/AppHeader/AppHeader.styles.js.map +0 -1
  10. package/lib/components/AppHeader/index.d.ts +0 -3
  11. package/lib/components/AppHeader/index.d.ts.map +0 -1
  12. package/lib/components/AppHeader/index.js +0 -2
  13. package/lib/components/AppHeader/index.js.map +0 -1
  14. package/lib/components/AppShell/AppShell.d.ts +0 -4
  15. package/lib/components/AppShell/AppShell.d.ts.map +0 -1
  16. package/lib/components/AppShell/AppShell.js +0 -84
  17. package/lib/components/AppShell/AppShell.js.map +0 -1
  18. package/lib/components/AppShell/AppShell.styles.d.ts +0 -20
  19. package/lib/components/AppShell/AppShell.styles.d.ts.map +0 -1
  20. package/lib/components/AppShell/AppShell.styles.js +0 -331
  21. package/lib/components/AppShell/AppShell.styles.js.map +0 -1
  22. package/lib/components/AppShell/AppShell.types.d.ts +0 -43
  23. package/lib/components/AppShell/AppShell.types.d.ts.map +0 -1
  24. package/lib/components/AppShell/AppShell.types.js +0 -2
  25. package/lib/components/AppShell/AppShell.types.js.map +0 -1
  26. package/lib/components/AppShell/AppShellContext.d.ts +0 -4
  27. package/lib/components/AppShell/AppShellContext.d.ts.map +0 -1
  28. package/lib/components/AppShell/AppShellContext.js +0 -10
  29. package/lib/components/AppShell/AppShellContext.js.map +0 -1
  30. package/lib/components/AppShell/index.d.ts +0 -3
  31. package/lib/components/AppShell/index.d.ts.map +0 -1
  32. package/lib/components/AppShell/index.js +0 -2
  33. package/lib/components/AppShell/index.js.map +0 -1
  34. package/lib/components/FlowModeller/AddNode.d.ts +0 -16
  35. package/lib/components/FlowModeller/AddNode.d.ts.map +0 -1
  36. package/lib/components/FlowModeller/AddNode.js +0 -62
  37. package/lib/components/FlowModeller/AddNode.js.map +0 -1
  38. package/lib/components/FlowModeller/FlowModeller.d.ts +0 -21
  39. package/lib/components/FlowModeller/FlowModeller.d.ts.map +0 -1
  40. package/lib/components/FlowModeller/FlowModeller.js +0 -190
  41. package/lib/components/FlowModeller/FlowModeller.js.map +0 -1
  42. package/lib/components/FlowModeller/Node/Node.types.d.ts +0 -54
  43. package/lib/components/FlowModeller/Node/Node.types.d.ts.map +0 -1
  44. package/lib/components/FlowModeller/Node/Node.types.js +0 -28
  45. package/lib/components/FlowModeller/Node/Node.types.js.map +0 -1
  46. package/lib/components/FlowModeller/Node/NodeTemplate.styles.d.ts +0 -15
  47. package/lib/components/FlowModeller/Node/NodeTemplate.styles.d.ts.map +0 -1
  48. package/lib/components/FlowModeller/Node/NodeTemplate.styles.js +0 -128
  49. package/lib/components/FlowModeller/Node/NodeTemplate.styles.js.map +0 -1
  50. package/lib/components/FlowModeller/Node/NodeTemplates.d.ts +0 -6
  51. package/lib/components/FlowModeller/Node/NodeTemplates.d.ts.map +0 -1
  52. package/lib/components/FlowModeller/Node/NodeTemplates.js +0 -64
  53. package/lib/components/FlowModeller/Node/NodeTemplates.js.map +0 -1
  54. package/lib/components/FlowModeller/NodeLibrary.d.ts +0 -13
  55. package/lib/components/FlowModeller/NodeLibrary.d.ts.map +0 -1
  56. package/lib/components/FlowModeller/NodeLibrary.js +0 -51
  57. package/lib/components/FlowModeller/NodeLibrary.js.map +0 -1
  58. package/lib/components/FlowModeller/Renderer/Connectors.d.ts +0 -13
  59. package/lib/components/FlowModeller/Renderer/Connectors.d.ts.map +0 -1
  60. package/lib/components/FlowModeller/Renderer/Connectors.js +0 -47
  61. package/lib/components/FlowModeller/Renderer/Connectors.js.map +0 -1
  62. package/lib/components/FlowModeller/Renderer/Nodes.d.ts +0 -9
  63. package/lib/components/FlowModeller/Renderer/Nodes.d.ts.map +0 -1
  64. package/lib/components/FlowModeller/Renderer/Nodes.js +0 -25
  65. package/lib/components/FlowModeller/Renderer/Nodes.js.map +0 -1
  66. package/lib/components/FlowModeller/Renderer/Renderer.d.ts +0 -5
  67. package/lib/components/FlowModeller/Renderer/Renderer.d.ts.map +0 -1
  68. package/lib/components/FlowModeller/Renderer/Renderer.js +0 -17
  69. package/lib/components/FlowModeller/Renderer/Renderer.js.map +0 -1
  70. package/lib/components/FlowModeller/Renderer/Renderer.types.d.ts +0 -18
  71. package/lib/components/FlowModeller/Renderer/Renderer.types.d.ts.map +0 -1
  72. package/lib/components/FlowModeller/Renderer/Renderer.types.js +0 -2
  73. package/lib/components/FlowModeller/Renderer/Renderer.types.js.map +0 -1
  74. package/lib/components/FlowModeller/Renderer/Utils/Graph.d.ts +0 -54
  75. package/lib/components/FlowModeller/Renderer/Utils/Graph.d.ts.map +0 -1
  76. package/lib/components/FlowModeller/Renderer/Utils/Graph.js +0 -302
  77. package/lib/components/FlowModeller/Renderer/Utils/Graph.js.map +0 -1
  78. package/lib/components/FlowModeller/Renderer/Utils/GraphLayout.d.ts +0 -35
  79. package/lib/components/FlowModeller/Renderer/Utils/GraphLayout.d.ts.map +0 -1
  80. package/lib/components/FlowModeller/Renderer/Utils/GraphLayout.js +0 -107
  81. package/lib/components/FlowModeller/Renderer/Utils/GraphLayout.js.map +0 -1
  82. package/lib/components/FlowModeller/Renderer/Utils/GraphTraversal.d.ts +0 -24
  83. package/lib/components/FlowModeller/Renderer/Utils/GraphTraversal.d.ts.map +0 -1
  84. package/lib/components/FlowModeller/Renderer/Utils/GraphTraversal.js +0 -152
  85. package/lib/components/FlowModeller/Renderer/Utils/GraphTraversal.js.map +0 -1
  86. package/lib/components/FlowModeller/Utils/AddNodeUtils.d.ts +0 -16
  87. package/lib/components/FlowModeller/Utils/AddNodeUtils.d.ts.map +0 -1
  88. package/lib/components/FlowModeller/Utils/AddNodeUtils.js +0 -118
  89. package/lib/components/FlowModeller/Utils/AddNodeUtils.js.map +0 -1
  90. package/lib/components/FlowModeller/helper.d.ts +0 -23
  91. package/lib/components/FlowModeller/helper.d.ts.map +0 -1
  92. package/lib/components/FlowModeller/helper.js +0 -128
  93. package/lib/components/FlowModeller/helper.js.map +0 -1
  94. package/lib/components/FlowModeller/index.d.ts +0 -10
  95. package/lib/components/FlowModeller/index.d.ts.map +0 -1
  96. package/lib/components/FlowModeller/index.js +0 -8
  97. package/lib/components/FlowModeller/index.js.map +0 -1
  98. package/lib/components/LifeCycle/Category.d.ts +0 -32
  99. package/lib/components/LifeCycle/Category.d.ts.map +0 -1
  100. package/lib/components/LifeCycle/Category.js +0 -98
  101. package/lib/components/LifeCycle/Category.js.map +0 -1
  102. package/lib/components/LifeCycle/LifeCycle.d.ts +0 -22
  103. package/lib/components/LifeCycle/LifeCycle.d.ts.map +0 -1
  104. package/lib/components/LifeCycle/LifeCycle.js +0 -73
  105. package/lib/components/LifeCycle/LifeCycle.js.map +0 -1
  106. package/lib/components/LifeCycle/LifeCycle.types.d.ts +0 -56
  107. package/lib/components/LifeCycle/LifeCycle.types.d.ts.map +0 -1
  108. package/lib/components/LifeCycle/LifeCycle.types.js +0 -2
  109. package/lib/components/LifeCycle/LifeCycle.types.js.map +0 -1
  110. package/lib/components/LifeCycle/LifeCycleList.d.ts +0 -22
  111. package/lib/components/LifeCycle/LifeCycleList.d.ts.map +0 -1
  112. package/lib/components/LifeCycle/LifeCycleList.js +0 -65
  113. package/lib/components/LifeCycle/LifeCycleList.js.map +0 -1
  114. package/lib/components/LifeCycle/Stage.d.ts +0 -49
  115. package/lib/components/LifeCycle/Stage.d.ts.map +0 -1
  116. package/lib/components/LifeCycle/Stage.js +0 -293
  117. package/lib/components/LifeCycle/Stage.js.map +0 -1
  118. package/lib/components/LifeCycle/Step.d.ts +0 -51
  119. package/lib/components/LifeCycle/Step.d.ts.map +0 -1
  120. package/lib/components/LifeCycle/Step.js +0 -241
  121. package/lib/components/LifeCycle/Step.js.map +0 -1
  122. package/lib/components/LifeCycle/Task.d.ts +0 -53
  123. package/lib/components/LifeCycle/Task.d.ts.map +0 -1
  124. package/lib/components/LifeCycle/Task.js +0 -188
  125. package/lib/components/LifeCycle/Task.js.map +0 -1
  126. package/lib/components/LifeCycle/index.d.ts +0 -4
  127. package/lib/components/LifeCycle/index.d.ts.map +0 -1
  128. package/lib/components/LifeCycle/index.js +0 -2
  129. package/lib/components/LifeCycle/index.js.map +0 -1
  130. package/lib/components/PageTemplates/GalleryPage.d.ts +0 -23
  131. package/lib/components/PageTemplates/GalleryPage.d.ts.map +0 -1
  132. package/lib/components/PageTemplates/GalleryPage.js +0 -23
  133. package/lib/components/PageTemplates/GalleryPage.js.map +0 -1
  134. package/lib/components/PageTemplates/GalleryPage.styles.d.ts +0 -9
  135. package/lib/components/PageTemplates/GalleryPage.styles.d.ts.map +0 -1
  136. package/lib/components/PageTemplates/GalleryPage.styles.js +0 -70
  137. package/lib/components/PageTemplates/GalleryPage.styles.js.map +0 -1
  138. package/lib/components/PageTemplates/PageTemplates.d.ts +0 -27
  139. package/lib/components/PageTemplates/PageTemplates.d.ts.map +0 -1
  140. package/lib/components/PageTemplates/PageTemplates.js +0 -105
  141. package/lib/components/PageTemplates/PageTemplates.js.map +0 -1
  142. package/lib/components/PageTemplates/index.d.ts +0 -5
  143. package/lib/components/PageTemplates/index.d.ts.map +0 -1
  144. package/lib/components/PageTemplates/index.js +0 -4
  145. package/lib/components/PageTemplates/index.js.map +0 -1
  146. package/lib/components/SummaryCard/SummaryCard.d.ts +0 -16
  147. package/lib/components/SummaryCard/SummaryCard.d.ts.map +0 -1
  148. package/lib/components/SummaryCard/SummaryCard.js +0 -31
  149. package/lib/components/SummaryCard/SummaryCard.js.map +0 -1
  150. package/lib/components/SummaryCard/index.d.ts +0 -3
  151. package/lib/components/SummaryCard/index.d.ts.map +0 -1
  152. package/lib/components/SummaryCard/index.js +0 -3
  153. package/lib/components/SummaryCard/index.js.map +0 -1
  154. package/lib/components/Visual/Visual.d.ts +0 -17
  155. package/lib/components/Visual/Visual.d.ts.map +0 -1
  156. package/lib/components/Visual/Visual.js +0 -28
  157. package/lib/components/Visual/Visual.js.map +0 -1
  158. package/lib/components/Visual/index.d.ts +0 -3
  159. package/lib/components/Visual/index.d.ts.map +0 -1
  160. package/lib/components/Visual/index.js +0 -3
  161. package/lib/components/Visual/index.js.map +0 -1
  162. package/lib/components/Workbench/ConfigurationPanel.d.ts +0 -5
  163. package/lib/components/Workbench/ConfigurationPanel.d.ts.map +0 -1
  164. package/lib/components/Workbench/ConfigurationPanel.js +0 -21
  165. package/lib/components/Workbench/ConfigurationPanel.js.map +0 -1
  166. package/lib/components/Workbench/Toolbar.d.ts +0 -14
  167. package/lib/components/Workbench/Toolbar.d.ts.map +0 -1
  168. package/lib/components/Workbench/Toolbar.js +0 -14
  169. package/lib/components/Workbench/Toolbar.js.map +0 -1
  170. package/lib/components/Workbench/UtilityPanel.d.ts +0 -7
  171. package/lib/components/Workbench/UtilityPanel.d.ts.map +0 -1
  172. package/lib/components/Workbench/UtilityPanel.js +0 -12
  173. package/lib/components/Workbench/UtilityPanel.js.map +0 -1
  174. package/lib/components/Workbench/Workbench.d.ts +0 -6
  175. package/lib/components/Workbench/Workbench.d.ts.map +0 -1
  176. package/lib/components/Workbench/Workbench.js +0 -24
  177. package/lib/components/Workbench/Workbench.js.map +0 -1
  178. package/lib/components/Workbench/Workbench.styles.d.ts +0 -10
  179. package/lib/components/Workbench/Workbench.styles.d.ts.map +0 -1
  180. package/lib/components/Workbench/Workbench.styles.js +0 -71
  181. package/lib/components/Workbench/Workbench.styles.js.map +0 -1
  182. package/lib/components/Workbench/Workbench.types.d.ts +0 -49
  183. package/lib/components/Workbench/Workbench.types.d.ts.map +0 -1
  184. package/lib/components/Workbench/Workbench.types.js +0 -2
  185. package/lib/components/Workbench/Workbench.types.js.map +0 -1
  186. package/lib/components/Workbench/index.d.ts +0 -2
  187. package/lib/components/Workbench/index.d.ts.map +0 -1
  188. package/lib/components/Workbench/index.js +0 -2
  189. package/lib/components/Workbench/index.js.map +0 -1
  190. package/lib/index.d.ts +0 -13
  191. package/lib/index.d.ts.map +0 -1
  192. package/lib/index.js +0 -14
  193. package/lib/index.js.map +0 -1
@@ -1,331 +0,0 @@
1
- import styled, { css } from 'styled-components';
2
- import { lighten, hideVisually } from 'polished';
3
- import { useContext } from 'react';
4
- import { Icon, Text, tryCatch, defaultThemeProp, Button, useDirection, StyledIcon } from '@pega/cosmos-react-core';
5
- import { StyledSwitch, SwitchLabel } from '@pega/cosmos-react-core/lib/components/Switch/Switch';
6
- import { StyledBareButton } from '@pega/cosmos-react-core/lib/components/Button/BareButton';
7
- import { StyledNodeIcon, StyledNodeText, StyledNodeInteraction, StyledStandardTree } from '@pega/cosmos-react-core/lib/components/Tree/StandardTree.styles';
8
- import AppShellContext from './AppShellContext';
9
- const hoverBg = 'rgba(0, 0, 0, 0.4)';
10
- export const StyledNavToggle = styled(Button)(({ theme }) => {
11
- const { ltr } = useDirection();
12
- return css `
13
- position: absolute;
14
- z-index: 1;
15
- inset-block-start: calc(2 * ${theme.base.spacing});
16
- inset-inline-end: 0;
17
- min-width: 1.5rem;
18
- min-height: 1.5rem;
19
- border: none;
20
- color: ${theme.base.palette['foreground-color']};
21
- box-shadow: ${theme.base.shadow.low};
22
- border-radius: 50%;
23
- transition-property: background-color;
24
- transform: translateX(${ltr ? '50%' : '-50%'});
25
-
26
- ${StyledIcon} {
27
- width: 1.5rem;
28
- height: 1.5rem;
29
- }
30
-
31
- &[aria-expanded='${ltr ? 'true' : 'false'}'] {
32
- ${StyledIcon} {
33
- transform: rotateY(180deg);
34
- }
35
- }
36
- `;
37
- });
38
- StyledNavToggle.defaultProps = defaultThemeProp;
39
- export const StyledHeader = styled.div(({ theme }) => {
40
- const borderColor = tryCatch(() => lighten(0.1, theme.components['app-shell'].nav['background-color']));
41
- return css `
42
- width: 100%;
43
- min-height: 4rem;
44
- border-bottom: 0.0625rem solid ${borderColor};
45
- `;
46
- });
47
- StyledHeader.defaultProps = defaultThemeProp;
48
- export const StyledDrawerHeader = styled(StyledHeader)(({ theme }) => {
49
- return css `
50
- padding-inline-start: ${theme.base.spacing};
51
- `;
52
- });
53
- StyledDrawerHeader.defaultProps = defaultThemeProp;
54
- export const StyledNavHeaderIcon = styled(Icon)(({ theme }) => {
55
- return css `
56
- color: ${theme.base.colors.white};
57
- `;
58
- });
59
- StyledNavHeaderIcon.defaultProps = defaultThemeProp;
60
- export const StyledNavTitle = styled(Text)(({ theme }) => {
61
- return css `
62
- color: ${theme.base.colors.white};
63
- text-overflow: ellipsis;
64
- white-space: nowrap;
65
- overflow-x: hidden;
66
- `;
67
- });
68
- StyledNavTitle.defaultProps = defaultThemeProp;
69
- export const StyledUtils = styled.div(({ theme, showDevMode }) => {
70
- const borderColor = tryCatch(() => lighten(0.1, theme.components['app-shell'].nav['background-color']));
71
- return css `
72
- padding-bottom: calc(${showDevMode ? 2 : 0} * ${theme.base.spacing});
73
- border-top: 0.0625rem solid ${borderColor};
74
- ${StyledSwitch} {
75
- &:hover {
76
- background-color: ${hoverBg};
77
- }
78
-
79
- ${SwitchLabel} {
80
- height: calc(2rem + 4 * ${theme.base.spacing});
81
- padding: calc(2 * ${theme.base.spacing});
82
- text-transform: capitalize;
83
- color: ${theme.base.colors.gray.light};
84
- font-weight: ${theme.base['font-weight'].bold};
85
-
86
- &::before,
87
- &::after {
88
- margin-inline-end: calc(2 * ${theme.base.spacing});
89
- }
90
- }
91
- }
92
- & > ul {
93
- list-style: none;
94
- }
95
- `;
96
- });
97
- StyledUtils.defaultProps = defaultThemeProp;
98
- export const StyledUtilItem = styled.li(({ theme }) => {
99
- return css `
100
- &[aria-current='true'] {
101
- background-color: rgba(0, 0, 0, 0.4);
102
-
103
- & > ${StyledBareButton} {
104
- color: ${theme.base.colors.blue.light};
105
- }
106
- }
107
-
108
- ${StyledBareButton} {
109
- font-weight: ${theme.base['font-weight']['semi-bold']};
110
- color: ${theme.base.colors.white};
111
- width: 100%;
112
- height: 100%;
113
- text-align: start;
114
- padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});
115
-
116
- &:hover {
117
- background-color: rgba(0, 0, 0, 0.4);
118
- }
119
-
120
- &:focus {
121
- box-shadow: inset ${theme.base.shadow['focus-inverted']};
122
- }
123
- }
124
- `;
125
- });
126
- StyledUtilItem.defaultProps = defaultThemeProp;
127
- export const StyledScrollWrap = styled.div(() => {
128
- const { drawerOpen } = useContext(AppShellContext);
129
- return css `
130
- height: ${drawerOpen ? 'calc(100% - 4rem)' : '100%'};
131
- overflow-y: auto;
132
- `;
133
- });
134
- StyledScrollWrap.defaultProps = defaultThemeProp;
135
- export const StyledNavContent = styled.div(({ theme }) => {
136
- const { navState } = useContext(AppShellContext);
137
- return css `
138
- width: 14rem;
139
- height: 100%;
140
- opacity: 0;
141
- transition: opacity ${theme.base.animation.speed} ${theme.base.animation.timing.ease};
142
-
143
- ${navState === 'collapsed' &&
144
- css `
145
- display: none;
146
- `}
147
-
148
- ${(navState === 'expanding' || navState === 'expanded') &&
149
- css `
150
- opacity: 1;
151
- `}
152
- `;
153
- });
154
- StyledNavContent.defaultProps = defaultThemeProp;
155
- export const StyledMain = styled.main(({ theme }) => {
156
- return css `
157
- position: relative;
158
- min-height: calc(100vh - 3rem);
159
- background-color: ${theme.base.palette['app-background']};
160
- transition: margin ${theme.base.animation.speed} ${theme.base.animation.timing.ease};
161
- `;
162
- });
163
- StyledMain.defaultProps = defaultThemeProp;
164
- export const StyledDrawerWrapper = styled.div(() => {
165
- const { drawerOpen } = useContext(AppShellContext);
166
- return css `
167
- position: relative;
168
- z-index: 1;
169
- height: ${drawerOpen ? '100%' : 'auto'};
170
- `;
171
- });
172
- StyledDrawerWrapper.defaultProps = defaultThemeProp;
173
- export const StyledNavHeaderVisual = styled.div(({ theme, bgColor }) => {
174
- return css `
175
- min-width: 2rem;
176
- min-height: 2rem;
177
- border-radius: 0.4rem;
178
- background-color: ${bgColor};
179
- margin-inline-end: ${theme.base.spacing};
180
- color: ${theme.base.colors.white};
181
- & svg {
182
- color: ${theme.base.colors.white};
183
- }
184
- `;
185
- });
186
- StyledNavHeaderVisual.defaultProps = defaultThemeProp;
187
- export const StyledDrawerCloseButton = styled(Button)(({ theme }) => {
188
- return css `
189
- margin-inline-end: ${theme.base.spacing};
190
- min-width: 1.5rem;
191
- min-height: 1.5rem;
192
- color: ${theme.base.colors.white};
193
-
194
- ${StyledIcon} {
195
- width: 1em;
196
- height: 1em;
197
- }
198
- `;
199
- });
200
- StyledDrawerCloseButton.defaultProps = defaultThemeProp;
201
- export const StyledInnerNav = styled.div(() => {
202
- const { navState } = useContext(AppShellContext);
203
- return css `
204
- height: 100%;
205
- ${(navState === 'collapsing' || navState === 'expanding') &&
206
- css `
207
- overflow: hidden;
208
- `}
209
- `;
210
- });
211
- StyledInnerNav.defaultProps = defaultThemeProp;
212
- export const StyledNav = styled.nav(({ theme }) => {
213
- const { navState } = useContext(AppShellContext);
214
- return css `
215
- position: fixed;
216
- z-index: 1;
217
- height: calc(100vh - 3rem);
218
- background: ${theme.components['app-shell'].nav['background-color']};
219
-
220
- &,
221
- ${StyledInnerNav} {
222
- width: ${navState === 'expanding' || navState === 'expanded' ? '14' : '1.5'}rem;
223
- transition: width ${theme.base.animation.speed} ${theme.base.animation.timing.ease};
224
- }
225
-
226
- ${theme.base['custom-scrollbar'] &&
227
- css `
228
- * {
229
- scrollbar-color: rgba(255, 255, 255, 0.6) rgba(0, 0, 0, 0.2);
230
- scrollbar-width: thin;
231
- }
232
-
233
- @supports not ((scrollbar-width: thin) or (scrollbar-color: black white)) {
234
- /* stylelint-disable unit-allowed-list */
235
-
236
- *::-webkit-scrollbar {
237
- width: 12px;
238
- height: 12px;
239
- }
240
-
241
- *::-webkit-scrollbar-track {
242
- background-color: rgba(0, 0, 0, 0.2);
243
- }
244
-
245
- *::-webkit-scrollbar-corner {
246
- background-color: rgba(0, 0, 0, 0.2);
247
- border-bottom-right-radius: inherit;
248
- }
249
-
250
- *::-webkit-scrollbar-thumb {
251
- background-color: transparent;
252
- border: 3px solid transparent;
253
- border-radius: calc(1.125 * ${theme.base['border-radius']});
254
- box-shadow: inset 0 0 2px 4px rgba(255, 255, 255, 0.6);
255
- }
256
-
257
- *::-webkit-scrollbar-thumb:hover {
258
- box-shadow: inset 0 0 2px 4px rgba(255, 255, 255, 0.7);
259
- }
260
-
261
- *::-webkit-scrollbar-track:horizontal {
262
- border-bottom-left-radius: inherit;
263
- }
264
-
265
- *::-webkit-scrollbar-track:vertical {
266
- border-top-right-radius: inherit;
267
- }
268
-
269
- /* stylelint-disable-next-line selector-pseudo-class-no-unknown */
270
- *::-webkit-scrollbar-track:not(:corner-present) {
271
- border-bottom-right-radius: inherit;
272
- }
273
-
274
- /* stylelint-enable unit-allowed-list */
275
- }
276
- `}
277
-
278
- &:not(:hover) {
279
- ${StyledNavToggle}[aria-expanded='true']:not(:focus) {
280
- ${hideVisually}
281
- }
282
- }
283
-
284
- /*
285
- * A hoverable area just outside the nav for easier mouse interaction with the collapse button.
286
- * As the collpase button straddles the nav boundary, so maybe too should the hoverable area.
287
- */
288
- &::after {
289
- content: '';
290
- display: block;
291
- position: absolute;
292
- inset-block-start: 0;
293
- inset-inline-start: 100%;
294
- width: calc(2 * ${theme.base.spacing});
295
- height: 100%;
296
- }
297
-
298
- ${StyledStandardTree} {
299
- color: ${theme.base.colors.white};
300
-
301
- ${StyledNodeText} {
302
- font-weight: ${theme.base['font-weight']['semi-bold']};
303
- }
304
-
305
- ${StyledNodeInteraction} {
306
- padding-block-start: calc(0.5 * ${theme.base.spacing});
307
- padding-block-end: calc(0.5 * ${theme.base.spacing});
308
- &:hover,
309
- &[aria-current='true'] {
310
- background-color: ${hoverBg};
311
- }
312
-
313
- &[aria-current='true'] {
314
- ${StyledNodeIcon},
315
- ${StyledNodeText} {
316
- color: ${theme.base.colors.blue.light};
317
- }
318
- }
319
- }
320
- }
321
-
322
- /* Style for main is here since nav(the "&") may be conditionally rendered. */
323
- & + ${StyledMain} {
324
- margin-inline-start: ${navState === 'expanding' || navState === 'expanded'
325
- ? '14rem'
326
- : '1.5rem'};
327
- }
328
- `;
329
- });
330
- StyledNav.defaultProps = defaultThemeProp;
331
- //# sourceMappingURL=AppShell.styles.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"AppShell.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { lighten, hideVisually } from 'polished';\nimport { useContext } from 'react';\n\nimport {\n Icon,\n Text,\n tryCatch,\n defaultThemeProp,\n Button,\n useDirection,\n StyledIcon\n} from '@pega/cosmos-react-core';\nimport { StyledSwitch, SwitchLabel } from '@pega/cosmos-react-core/lib/components/Switch/Switch';\nimport { StyledBareButton } from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport {\n StyledNodeIcon,\n StyledNodeText,\n StyledNodeInteraction,\n StyledStandardTree\n} from '@pega/cosmos-react-core/lib/components/Tree/StandardTree.styles';\n\nimport AppShellContext from './AppShellContext';\n\nconst hoverBg = 'rgba(0, 0, 0, 0.4)';\n\nexport const StyledNavToggle = styled(Button)(({ theme }) => {\n const { ltr } = useDirection();\n\n return css`\n position: absolute;\n z-index: 1;\n inset-block-start: calc(2 * ${theme.base.spacing});\n inset-inline-end: 0;\n min-width: 1.5rem;\n min-height: 1.5rem;\n border: none;\n color: ${theme.base.palette['foreground-color']};\n box-shadow: ${theme.base.shadow.low};\n border-radius: 50%;\n transition-property: background-color;\n transform: translateX(${ltr ? '50%' : '-50%'});\n\n ${StyledIcon} {\n width: 1.5rem;\n height: 1.5rem;\n }\n\n &[aria-expanded='${ltr ? 'true' : 'false'}'] {\n ${StyledIcon} {\n transform: rotateY(180deg);\n }\n }\n `;\n});\n\nStyledNavToggle.defaultProps = defaultThemeProp;\n\nexport const StyledHeader = styled.div(({ theme }) => {\n const borderColor = tryCatch(() =>\n lighten(0.1, theme.components['app-shell'].nav['background-color'])\n );\n\n return css`\n width: 100%;\n min-height: 4rem;\n border-bottom: 0.0625rem solid ${borderColor};\n `;\n});\n\nStyledHeader.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerHeader = styled(StyledHeader)(({ theme }) => {\n return css`\n padding-inline-start: ${theme.base.spacing};\n `;\n});\n\nStyledDrawerHeader.defaultProps = defaultThemeProp;\n\nexport const StyledNavHeaderIcon = styled(Icon)(({ theme }) => {\n return css`\n color: ${theme.base.colors.white};\n `;\n});\n\nStyledNavHeaderIcon.defaultProps = defaultThemeProp;\n\nexport const StyledNavTitle = styled(Text)(({ theme }) => {\n return css`\n color: ${theme.base.colors.white};\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow-x: hidden;\n `;\n});\n\nStyledNavTitle.defaultProps = defaultThemeProp;\n\nexport const StyledUtils = styled.div<{ showDevMode: boolean }>(({ theme, showDevMode }) => {\n const borderColor = tryCatch(() =>\n lighten(0.1, theme.components['app-shell'].nav['background-color'])\n );\n\n return css`\n padding-bottom: calc(${showDevMode ? 2 : 0} * ${theme.base.spacing});\n border-top: 0.0625rem solid ${borderColor};\n ${StyledSwitch} {\n &:hover {\n background-color: ${hoverBg};\n }\n\n ${SwitchLabel} {\n height: calc(2rem + 4 * ${theme.base.spacing});\n padding: calc(2 * ${theme.base.spacing});\n text-transform: capitalize;\n color: ${theme.base.colors.gray.light};\n font-weight: ${theme.base['font-weight'].bold};\n\n &::before,\n &::after {\n margin-inline-end: calc(2 * ${theme.base.spacing});\n }\n }\n }\n & > ul {\n list-style: none;\n }\n `;\n});\n\nStyledUtils.defaultProps = defaultThemeProp;\n\nexport const StyledUtilItem = styled.li(({ theme }) => {\n return css`\n &[aria-current='true'] {\n background-color: rgba(0, 0, 0, 0.4);\n\n & > ${StyledBareButton} {\n color: ${theme.base.colors.blue.light};\n }\n }\n\n ${StyledBareButton} {\n font-weight: ${theme.base['font-weight']['semi-bold']};\n color: ${theme.base.colors.white};\n width: 100%;\n height: 100%;\n text-align: start;\n padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});\n\n &:hover {\n background-color: rgba(0, 0, 0, 0.4);\n }\n\n &:focus {\n box-shadow: inset ${theme.base.shadow['focus-inverted']};\n }\n }\n `;\n});\n\nStyledUtilItem.defaultProps = defaultThemeProp;\n\nexport const StyledScrollWrap = styled.div(() => {\n const { drawerOpen } = useContext(AppShellContext);\n\n return css`\n height: ${drawerOpen ? 'calc(100% - 4rem)' : '100%'};\n overflow-y: auto;\n `;\n});\n\nStyledScrollWrap.defaultProps = defaultThemeProp;\n\nexport const StyledNavContent = styled.div(({ theme }) => {\n const { navState } = useContext(AppShellContext);\n\n return css`\n width: 14rem;\n height: 100%;\n opacity: 0;\n transition: opacity ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n\n ${navState === 'collapsed' &&\n css`\n display: none;\n `}\n\n ${(navState === 'expanding' || navState === 'expanded') &&\n css`\n opacity: 1;\n `}\n `;\n});\n\nStyledNavContent.defaultProps = defaultThemeProp;\n\nexport const StyledMain = styled.main(({ theme }) => {\n return css`\n position: relative;\n min-height: calc(100vh - 3rem);\n background-color: ${theme.base.palette['app-background']};\n transition: margin ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n `;\n});\n\nStyledMain.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerWrapper = styled.div(() => {\n const { drawerOpen } = useContext(AppShellContext);\n\n return css`\n position: relative;\n z-index: 1;\n height: ${drawerOpen ? '100%' : 'auto'};\n `;\n});\n\nStyledDrawerWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledNavHeaderVisual = styled.div<{ bgColor: string }>(({ theme, bgColor }) => {\n return css`\n min-width: 2rem;\n min-height: 2rem;\n border-radius: 0.4rem;\n background-color: ${bgColor};\n margin-inline-end: ${theme.base.spacing};\n color: ${theme.base.colors.white};\n & svg {\n color: ${theme.base.colors.white};\n }\n `;\n});\n\nStyledNavHeaderVisual.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerCloseButton = styled(Button)(({ theme }) => {\n return css`\n margin-inline-end: ${theme.base.spacing};\n min-width: 1.5rem;\n min-height: 1.5rem;\n color: ${theme.base.colors.white};\n\n ${StyledIcon} {\n width: 1em;\n height: 1em;\n }\n `;\n});\n\nStyledDrawerCloseButton.defaultProps = defaultThemeProp;\n\nexport const StyledInnerNav = styled.div(() => {\n const { navState } = useContext(AppShellContext);\n\n return css`\n height: 100%;\n ${(navState === 'collapsing' || navState === 'expanding') &&\n css`\n overflow: hidden;\n `}\n `;\n});\n\nStyledInnerNav.defaultProps = defaultThemeProp;\n\nexport const StyledNav = styled.nav(({ theme }) => {\n const { navState } = useContext(AppShellContext);\n\n return css`\n position: fixed;\n z-index: 1;\n height: calc(100vh - 3rem);\n background: ${theme.components['app-shell'].nav['background-color']};\n\n &,\n ${StyledInnerNav} {\n width: ${navState === 'expanding' || navState === 'expanded' ? '14' : '1.5'}rem;\n transition: width ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n }\n\n ${theme.base['custom-scrollbar'] &&\n css`\n * {\n scrollbar-color: rgba(255, 255, 255, 0.6) rgba(0, 0, 0, 0.2);\n scrollbar-width: thin;\n }\n\n @supports not ((scrollbar-width: thin) or (scrollbar-color: black white)) {\n /* stylelint-disable unit-allowed-list */\n\n *::-webkit-scrollbar {\n width: 12px;\n height: 12px;\n }\n\n *::-webkit-scrollbar-track {\n background-color: rgba(0, 0, 0, 0.2);\n }\n\n *::-webkit-scrollbar-corner {\n background-color: rgba(0, 0, 0, 0.2);\n border-bottom-right-radius: inherit;\n }\n\n *::-webkit-scrollbar-thumb {\n background-color: transparent;\n border: 3px solid transparent;\n border-radius: calc(1.125 * ${theme.base['border-radius']});\n box-shadow: inset 0 0 2px 4px rgba(255, 255, 255, 0.6);\n }\n\n *::-webkit-scrollbar-thumb:hover {\n box-shadow: inset 0 0 2px 4px rgba(255, 255, 255, 0.7);\n }\n\n *::-webkit-scrollbar-track:horizontal {\n border-bottom-left-radius: inherit;\n }\n\n *::-webkit-scrollbar-track:vertical {\n border-top-right-radius: inherit;\n }\n\n /* stylelint-disable-next-line selector-pseudo-class-no-unknown */\n *::-webkit-scrollbar-track:not(:corner-present) {\n border-bottom-right-radius: inherit;\n }\n\n /* stylelint-enable unit-allowed-list */\n }\n `}\n\n &:not(:hover) {\n ${StyledNavToggle}[aria-expanded='true']:not(:focus) {\n ${hideVisually}\n }\n }\n\n /*\n * A hoverable area just outside the nav for easier mouse interaction with the collapse button.\n * As the collpase button straddles the nav boundary, so maybe too should the hoverable area.\n */\n &::after {\n content: '';\n display: block;\n position: absolute;\n inset-block-start: 0;\n inset-inline-start: 100%;\n width: calc(2 * ${theme.base.spacing});\n height: 100%;\n }\n\n ${StyledStandardTree} {\n color: ${theme.base.colors.white};\n\n ${StyledNodeText} {\n font-weight: ${theme.base['font-weight']['semi-bold']};\n }\n\n ${StyledNodeInteraction} {\n padding-block-start: calc(0.5 * ${theme.base.spacing});\n padding-block-end: calc(0.5 * ${theme.base.spacing});\n &:hover,\n &[aria-current='true'] {\n background-color: ${hoverBg};\n }\n\n &[aria-current='true'] {\n ${StyledNodeIcon},\n ${StyledNodeText} {\n color: ${theme.base.colors.blue.light};\n }\n }\n }\n }\n\n /* Style for main is here since nav(the \"&\") may be conditionally rendered. */\n & + ${StyledMain} {\n margin-inline-start: ${navState === 'expanding' || navState === 'expanded'\n ? '14rem'\n : '1.5rem'};\n }\n `;\n});\n\nStyledNav.defaultProps = defaultThemeProp;\n"]}
@@ -1,43 +0,0 @@
1
- import { ReactNode, Ref } from 'react';
2
- import { StandardTreeProps, DrawerProps, NoChildrenProp } from '@pega/cosmos-react-core';
3
- import { expandCollapseStates } from '@pega/cosmos-react-core/lib/hooks/useTransitionState';
4
- import { AppBarProps } from '../AppHeader';
5
- import { VisualProps } from '../Visual';
6
- export interface AppShellProps extends NoChildrenProp {
7
- main: ReactNode;
8
- appInfo: AppInfoProps;
9
- appHeader: AppBarProps;
10
- navigation: StandardTreeProps;
11
- hideNav?: boolean;
12
- utils?: UtilsProps;
13
- ref?: Ref<HTMLElement>;
14
- }
15
- export interface UtilsProps {
16
- items: UtilItem[];
17
- currentItemId?: UtilItem['id'];
18
- onItemClick: (id: UtilItem['id']) => void;
19
- drawer?: Pick<DrawerProps, 'onBeforeOpen' | 'onAfterOpen' | 'onBeforeClose' | 'onAfterClose'>;
20
- devMode?: boolean;
21
- }
22
- export interface UtilItem {
23
- id: string;
24
- label: string;
25
- }
26
- export interface AppInfoProps {
27
- text: string;
28
- visual: VisualProps;
29
- }
30
- export interface AppShellContextValue {
31
- drawerOpen: boolean;
32
- setDrawerOpen: (open: boolean) => void;
33
- setDrawerData: (data: {
34
- label: string;
35
- id: string;
36
- }) => void;
37
- drawerData?: {
38
- label: string;
39
- id: string;
40
- };
41
- navState: typeof expandCollapseStates[keyof typeof expandCollapseStates];
42
- }
43
- //# sourceMappingURL=AppShell.types.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"AppShell.types.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzF,OAAO,EAAE,oBAAoB,EAAE,MAAM,sDAAsD,CAAC;AAE5F,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAExC,MAAM,WAAW,aAAc,SAAQ,cAAc;IACnD,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,EAAE,YAAY,CAAC;IACtB,SAAS,EAAE,WAAW,CAAC;IACvB,UAAU,EAAE,iBAAiB,CAAC;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAED,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,aAAa,CAAC,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC/B,WAAW,EAAE,CAAC,EAAE,EAAE,QAAQ,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC1C,MAAM,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,cAAc,GAAG,aAAa,GAAG,eAAe,GAAG,cAAc,CAAC,CAAC;IAC9F,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,WAAW,CAAC;CACrB;AAED,MAAM,WAAW,oBAAoB;IACnC,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,aAAa,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC7D,UAAU,CAAC,EAAE;QACX,KAAK,EAAE,MAAM,CAAC;QACd,EAAE,EAAE,MAAM,CAAC;KACZ,CAAC;IACF,QAAQ,EAAE,OAAO,oBAAoB,CAAC,MAAM,OAAO,oBAAoB,CAAC,CAAC;CAC1E"}
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=AppShell.types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"AppShell.types.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ReactNode, Ref } from 'react';\n\nimport { StandardTreeProps, DrawerProps, NoChildrenProp } from '@pega/cosmos-react-core';\nimport { expandCollapseStates } from '@pega/cosmos-react-core/lib/hooks/useTransitionState';\n\nimport { AppBarProps } from '../AppHeader';\nimport { VisualProps } from '../Visual';\n\nexport interface AppShellProps extends NoChildrenProp {\n main: ReactNode;\n appInfo: AppInfoProps;\n appHeader: AppBarProps;\n navigation: StandardTreeProps;\n hideNav?: boolean;\n utils?: UtilsProps;\n ref?: Ref<HTMLElement>;\n}\n\nexport interface UtilsProps {\n items: UtilItem[];\n currentItemId?: UtilItem['id'];\n onItemClick: (id: UtilItem['id']) => void;\n drawer?: Pick<DrawerProps, 'onBeforeOpen' | 'onAfterOpen' | 'onBeforeClose' | 'onAfterClose'>;\n devMode?: boolean;\n}\n\nexport interface UtilItem {\n id: string;\n label: string;\n}\n\nexport interface AppInfoProps {\n text: string;\n visual: VisualProps;\n}\n\nexport interface AppShellContextValue {\n drawerOpen: boolean;\n setDrawerOpen: (open: boolean) => void;\n setDrawerData: (data: { label: string; id: string }) => void;\n drawerData?: {\n label: string;\n id: string;\n };\n navState: typeof expandCollapseStates[keyof typeof expandCollapseStates];\n}\n"]}
@@ -1,4 +0,0 @@
1
- import { AppShellContextValue } from './AppShell.types';
2
- declare const AppShellContext: import("react").Context<AppShellContextValue>;
3
- export default AppShellContext;
4
- //# sourceMappingURL=AppShellContext.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"AppShellContext.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellContext.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAExD,QAAA,MAAM,eAAe,+CAMnB,CAAC;AAEH,eAAe,eAAe,CAAC"}
@@ -1,10 +0,0 @@
1
- import { createContext } from 'react';
2
- const AppShellContext = createContext({
3
- drawerOpen: false,
4
- setDrawerOpen: () => { },
5
- drawerData: undefined,
6
- setDrawerData: () => { },
7
- navState: 'expanded'
8
- });
9
- export default AppShellContext;
10
- //# sourceMappingURL=AppShellContext.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"AppShellContext.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAItC,MAAM,eAAe,GAAG,aAAa,CAAuB;IAC1D,UAAU,EAAE,KAAK;IACjB,aAAa,EAAE,GAAG,EAAE,GAAE,CAAC;IACvB,UAAU,EAAE,SAAS;IACrB,aAAa,EAAE,GAAG,EAAE,GAAE,CAAC;IACvB,QAAQ,EAAE,UAAU;CACrB,CAAC,CAAC;AAEH,eAAe,eAAe,CAAC","sourcesContent":["import { createContext } from 'react';\n\nimport { AppShellContextValue } from './AppShell.types';\n\nconst AppShellContext = createContext<AppShellContextValue>({\n drawerOpen: false,\n setDrawerOpen: () => {},\n drawerData: undefined,\n setDrawerData: () => {},\n navState: 'expanded'\n});\n\nexport default AppShellContext;\n"]}
@@ -1,3 +0,0 @@
1
- export { default } from './AppShell';
2
- export { AppShellProps } from './AppShell.types';
3
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC"}
@@ -1,2 +0,0 @@
1
- export { default } from './AppShell';
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/AppShell/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC","sourcesContent":["export { default } from './AppShell';\nexport { AppShellProps } from './AppShell.types';\n"]}
@@ -1,16 +0,0 @@
1
- import { FC, MouseEvent } from 'react';
2
- import { RendererNodeProps } from './Renderer/Renderer.types';
3
- export declare const StyledDot: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").IconProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
4
- export declare const StyledPlus: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").IconProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
5
- export declare const StyledWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
6
- export declare const StyledButton: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").ButtonProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
7
- interface AddBtnProps {
8
- addNodeHandler: (e: MouseEvent<HTMLButtonElement>) => void;
9
- }
10
- export interface AddNodeProps extends RendererNodeProps {
11
- onClick?: (ev: Event) => void;
12
- }
13
- export declare const StyledConnectorLabel: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").TextProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
14
- export declare const AddButton: FC<AddBtnProps>;
15
- export {};
16
- //# sourceMappingURL=AddNode.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"AddNode.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/AddNode.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAYvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAE9D,eAAO,MAAM,SAAS,mOAKpB,CAAC;AAIH,eAAO,MAAM,UAAU,mOAAiB,CAAC;AACzC,eAAO,MAAM,aAAa,yGAUxB,CAAC;AAIH,eAAO,MAAM,YAAY,qOAsBvB,CAAC;AAIH,UAAU,WAAW;IACnB,cAAc,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CAC5D;AAED,MAAM,WAAW,YAAa,SAAQ,iBAAiB;IACrD,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,KAAK,KAAK,IAAI,CAAC;CAC/B;AAED,eAAO,MAAM,oBAAoB,mOAQ/B,CAAC;AAIH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,WAAW,CAWrC,CAAC"}
@@ -1,62 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import styled, { css } from 'styled-components';
3
- import { Button, defaultThemeProp, Flex, Icon, useI18n, StyledTooltip, Text } from '@pega/cosmos-react-core';
4
- export const StyledDot = styled(Icon)(({ theme }) => {
5
- return css `
6
- position: absolute;
7
- color: ${theme.base.colors.slate.dark};
8
- `;
9
- });
10
- StyledDot.defaultProps = defaultThemeProp;
11
- export const StyledPlus = styled(Icon) ``;
12
- export const StyledWrapper = styled.div(({ theme }) => {
13
- return css `
14
- margin-block-start: ${theme.base.spacing};
15
- ${StyledTooltip} {
16
- ${css `
17
- min-width: 12ch;
18
- text-align: center;
19
- `}
20
- }
21
- `;
22
- });
23
- StyledWrapper.defaultProps = defaultThemeProp;
24
- export const StyledButton = styled(Button)(({ theme }) => {
25
- return css `
26
- top: -0.25rem;
27
- border: 0;
28
- background: transparent;
29
- color: ${theme.base.colors.black};
30
- ${StyledPlus} {
31
- opacity: 0;
32
- }
33
- &:hover,
34
- &:active,
35
- &:focus {
36
- opacity: 1;
37
- background: ${theme.base.colors.white};
38
- ${StyledDot} {
39
- opacity: 0;
40
- }
41
- ${StyledPlus} {
42
- opacity: 1;
43
- }
44
- }
45
- `;
46
- });
47
- StyledButton.defaultProps = defaultThemeProp;
48
- export const StyledConnectorLabel = styled(Text)(({ theme }) => {
49
- return css `
50
- border-radius: ${theme.base['border-radius']};
51
- background: ${theme.base.colors.slate.dark};
52
- color: ${theme.base.colors.white};
53
- text-align: center;
54
- padding: calc(0.5 * ${theme.base.spacing});
55
- `;
56
- });
57
- StyledConnectorLabel.defaultProps = defaultThemeProp;
58
- export const AddButton = ({ addNodeHandler }) => {
59
- const t = useI18n();
60
- return (_jsx(Flex, { container: { justify: 'center' }, as: StyledWrapper, children: _jsxs(StyledButton, { label: t('add_node'), icon: true, onClick: addNodeHandler, children: [_jsx(StyledDot, { name: 'circle-solid' }, void 0), _jsx(StyledPlus, { name: 'plus' }, void 0)] }, void 0) }, void 0));
61
- };
62
- //# sourceMappingURL=AddNode.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"AddNode.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/AddNode.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAGhD,OAAO,EACL,MAAM,EACN,gBAAgB,EAChB,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,aAAa,EACb,IAAI,EACL,MAAM,yBAAyB,CAAC;AAIjC,MAAM,CAAC,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAClD,OAAO,GAAG,CAAA;;aAEC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI;GACtC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,SAAS,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE1C,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA,EAAE,CAAC;AACzC,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACpD,OAAO,GAAG,CAAA;0BACc,KAAK,CAAC,IAAI,CAAC,OAAO;MACtC,aAAa;QACX,GAAG,CAAA;;;OAGJ;;GAEJ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,aAAa,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE9C,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACvD,OAAO,GAAG,CAAA;;;;aAIC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;MAC9B,UAAU;;;;;;;oBAOI,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;QACnC,SAAS;;;QAGT,UAAU;;;;GAIf,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAU7C,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC7D,OAAO,GAAG,CAAA;qBACS,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;kBAC9B,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI;aACjC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;;0BAEV,KAAK,CAAC,IAAI,CAAC,OAAO;GACzC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,CAAC,MAAM,SAAS,GAAoB,CAAC,EAAE,cAAc,EAAE,EAAE,EAAE;IAC/D,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,aAAa,YACvD,MAAC,YAAY,IAAC,KAAK,EAAE,CAAC,CAAC,UAAU,CAAC,EAAE,IAAI,QAAC,OAAO,EAAE,cAAc,aAC9D,KAAC,SAAS,IAAC,IAAI,EAAC,cAAc,WAAG,EACjC,KAAC,UAAU,IAAC,IAAI,EAAC,MAAM,WAAG,YACb,WACV,CACR,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\nimport { FC, MouseEvent } from 'react';\n\nimport {\n Button,\n defaultThemeProp,\n Flex,\n Icon,\n useI18n,\n StyledTooltip,\n Text\n} from '@pega/cosmos-react-core';\n\nimport { RendererNodeProps } from './Renderer/Renderer.types';\n\nexport const StyledDot = styled(Icon)(({ theme }) => {\n return css`\n position: absolute;\n color: ${theme.base.colors.slate.dark};\n `;\n});\n\nStyledDot.defaultProps = defaultThemeProp;\n\nexport const StyledPlus = styled(Icon)``;\nexport const StyledWrapper = styled.div(({ theme }) => {\n return css`\n margin-block-start: ${theme.base.spacing};\n ${StyledTooltip} {\n ${css`\n min-width: 12ch;\n text-align: center;\n `}\n }\n `;\n});\n\nStyledWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledButton = styled(Button)(({ theme }) => {\n return css`\n top: -0.25rem;\n border: 0;\n background: transparent;\n color: ${theme.base.colors.black};\n ${StyledPlus} {\n opacity: 0;\n }\n &:hover,\n &:active,\n &:focus {\n opacity: 1;\n background: ${theme.base.colors.white};\n ${StyledDot} {\n opacity: 0;\n }\n ${StyledPlus} {\n opacity: 1;\n }\n }\n `;\n});\n\nStyledButton.defaultProps = defaultThemeProp;\n\ninterface AddBtnProps {\n addNodeHandler: (e: MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport interface AddNodeProps extends RendererNodeProps {\n onClick?: (ev: Event) => void;\n}\n\nexport const StyledConnectorLabel = styled(Text)(({ theme }) => {\n return css`\n border-radius: ${theme.base['border-radius']};\n background: ${theme.base.colors.slate.dark};\n color: ${theme.base.colors.white};\n text-align: center;\n padding: calc(0.5 * ${theme.base.spacing});\n `;\n});\n\nStyledConnectorLabel.defaultProps = defaultThemeProp;\n\nexport const AddButton: FC<AddBtnProps> = ({ addNodeHandler }) => {\n const t = useI18n();\n\n return (\n <Flex container={{ justify: 'center' }} as={StyledWrapper}>\n <StyledButton label={t('add_node')} icon onClick={addNodeHandler}>\n <StyledDot name='circle-solid' />\n <StyledPlus name='plus' />\n </StyledButton>\n </Flex>\n );\n};\n"]}
@@ -1,21 +0,0 @@
1
- import { PropsWithoutRef, MouseEvent } from 'react';
2
- import { Action } from '@pega/cosmos-react-core';
3
- import { GraphData, ConnectorProps } from './Renderer/Utils/Graph';
4
- import { AddNodeHandlerParams } from './Renderer/Renderer.types';
5
- import { ActionParams, NodeProps, NodeLibraryItem, NodeType } from './Node/Node.types';
6
- export interface FlowModellerProps {
7
- graphData: GraphData<NodeProps, ConnectorProps>;
8
- /** Node actions */
9
- actions?: Action[];
10
- /** Callback to add node from connector */
11
- onNodeAdd: (nodeType: NodeType, params: AddNodeHandlerParams) => void;
12
- /** Callback for handling the click on the node */
13
- onNodeClick?: (nodeId: string) => void;
14
- /** Callback for actions on Node */
15
- onNodeActionClick?: (param: ActionParams, e: MouseEvent) => void;
16
- /** Types of nodes */
17
- nodeLibrary: NodeLibraryItem[];
18
- }
19
- declare const FlowModeller: ({ graphData, onNodeActionClick, onNodeClick, onNodeAdd, nodeLibrary, actions }: PropsWithoutRef<FlowModellerProps>) => JSX.Element;
20
- export default FlowModeller;
21
- //# sourceMappingURL=FlowModeller.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"FlowModeller.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EAEf,UAAU,EAMX,MAAM,OAAO,CAAC;AAGf,OAAO,EACL,MAAM,EAOP,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACnE,OAAO,EACL,oBAAoB,EAGrB,MAAM,2BAA2B,CAAC;AAGnC,OAAO,EACL,YAAY,EACZ,SAAS,EACT,eAAe,EAGf,QAAQ,EACT,MAAM,mBAAmB,CAAC;AAQ3B,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,SAAS,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;IAChD,mBAAmB;IACnB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,0CAA0C;IAC1C,SAAS,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,oBAAoB,KAAK,IAAI,CAAC;IACtE,kDAAkD;IAClD,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,mCAAmC;IACnC,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,EAAE,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IACjE,qBAAqB;IACrB,WAAW,EAAE,eAAe,EAAE,CAAC;CAChC;AAsED,QAAA,MAAM,YAAY,mFAOf,gBAAgB,iBAAiB,CAAC,gBAuMpC,CAAC;AAEF,eAAe,YAAY,CAAC"}