camunda-bpmn-js 0.13.0-drilldown.0 → 0.13.0

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 (94) hide show
  1. package/CHANGELOG.md +73 -0
  2. package/dist/assets/base-navigated-viewer.css +2 -0
  3. package/dist/assets/base-viewer.css +2 -0
  4. package/dist/assets/camunda-cloud-modeler.css +2 -1
  5. package/dist/assets/camunda-cloud-navigated-viewer.css +1 -0
  6. package/dist/assets/camunda-cloud-viewer.css +1 -0
  7. package/dist/assets/camunda-platform-navigated-viewer.css +1 -0
  8. package/dist/assets/camunda-platform-viewer.css +1 -0
  9. package/dist/base-modeler.development.js +1837 -3769
  10. package/dist/base-modeler.production.min.js +4 -4
  11. package/dist/base-navigated-viewer.development.js +22218 -0
  12. package/dist/base-navigated-viewer.production.min.js +2 -0
  13. package/dist/base-viewer.development.js +21227 -0
  14. package/dist/base-viewer.production.min.js +2 -0
  15. package/dist/camunda-cloud-modeler.development.js +8416 -5340
  16. package/dist/camunda-cloud-modeler.production.min.js +4 -4
  17. package/dist/camunda-cloud-navigated-viewer.development.js +23041 -0
  18. package/dist/camunda-cloud-navigated-viewer.production.min.js +2 -0
  19. package/dist/camunda-cloud-viewer.development.js +22050 -0
  20. package/dist/camunda-cloud-viewer.production.min.js +2 -0
  21. package/dist/camunda-platform-modeler.development.js +6616 -8556
  22. package/dist/camunda-platform-modeler.production.min.js +4 -4
  23. package/dist/camunda-platform-navigated-viewer.development.js +23413 -0
  24. package/dist/camunda-platform-navigated-viewer.production.min.js +2 -0
  25. package/dist/camunda-platform-viewer.development.js +22422 -0
  26. package/dist/camunda-platform-viewer.production.min.js +2 -0
  27. package/lib/base/NavigatedViewer.js +3 -0
  28. package/lib/base/Viewer.js +3 -0
  29. package/lib/camunda-cloud/ElementTemplatesValidator.js +1 -0
  30. package/lib/camunda-cloud/Modeler.js +8 -7
  31. package/lib/camunda-cloud/NavigatedViewer.js +34 -0
  32. package/lib/camunda-cloud/Viewer.js +34 -0
  33. package/lib/camunda-cloud/util/commonModules.js +14 -0
  34. package/lib/camunda-platform/Modeler.js +5 -5
  35. package/lib/camunda-platform/NavigatedViewer.js +25 -0
  36. package/lib/camunda-platform/Viewer.js +24 -0
  37. package/lib/camunda-platform/util/commonModules.js +7 -0
  38. package/lib/util/ExtensionElementsUtil.js +59 -0
  39. package/package.json +26 -14
  40. package/styles/base-navigated-viewer.css +2 -0
  41. package/styles/base-viewer.css +2 -0
  42. package/styles/camunda-cloud-modeler.css +2 -1
  43. package/styles/camunda-cloud-navigated-viewer.css +1 -0
  44. package/styles/camunda-cloud-viewer.css +1 -0
  45. package/styles/camunda-platform-navigated-viewer.css +1 -0
  46. package/styles/camunda-platform-viewer.css +1 -0
  47. package/util/index.js +39 -0
  48. package/dist/assets/bpmn-font/bpmn-codes.css +0 -108
  49. package/dist/assets/bpmn-font/bpmn-embedded.css +0 -161
  50. package/dist/assets/bpmn-font/bpmn.css +0 -164
  51. package/dist/assets/bpmn-font/bpmn.eot +0 -0
  52. package/dist/assets/bpmn-font/bpmn.svg +0 -224
  53. package/dist/assets/bpmn-font/bpmn.ttf +0 -0
  54. package/dist/assets/bpmn-font/bpmn.woff +0 -0
  55. package/dist/assets/bpmn-font/bpmn.woff2 +0 -0
  56. package/dist/assets/bpmn-font/css/bpmn-codes.css +0 -108
  57. package/dist/assets/bpmn-font/css/bpmn-embedded.css +0 -161
  58. package/dist/assets/bpmn-font/css/bpmn.css +0 -164
  59. package/dist/assets/bpmn-font/font/bpmn.eot +0 -0
  60. package/dist/assets/bpmn-font/font/bpmn.svg +0 -224
  61. package/dist/assets/bpmn-font/font/bpmn.ttf +0 -0
  62. package/dist/assets/bpmn-font/font/bpmn.woff +0 -0
  63. package/dist/assets/bpmn-font/font/bpmn.woff2 +0 -0
  64. package/dist/assets/bpmn-js-properties-panel.css +0 -778
  65. package/dist/assets/bpmn-js.css +0 -113
  66. package/dist/assets/diagram-js-minimap.css +0 -87
  67. package/dist/assets/diagram-js.css +0 -819
  68. package/dist/assets/element-templates.css +0 -75
  69. package/dist/assets/properties-panel.css +0 -877
  70. package/lib/camunda-cloud/features/modeling/behavior/CleanUpAssignmentDefinitionBehavior.js +0 -78
  71. package/lib/camunda-cloud/features/modeling/behavior/CleanUpBusinessRuleTaskBehavior.js +0 -112
  72. package/lib/camunda-cloud/features/modeling/behavior/CreateZeebeBoundaryEventBehavior.js +0 -76
  73. package/lib/camunda-cloud/features/modeling/behavior/CreateZeebeCallActivityBehavior.js +0 -74
  74. package/lib/camunda-cloud/features/modeling/behavior/FormDefinitionBehavior.js +0 -138
  75. package/lib/camunda-cloud/features/modeling/behavior/UpdatePropagateAllChildVariablesBehavior.js +0 -109
  76. package/lib/camunda-cloud/features/modeling/behavior/index.js +0 -24
  77. package/lib/camunda-cloud/features/modeling/index.js +0 -7
  78. package/lib/camunda-cloud/helper/CalledElementHelper.js +0 -72
  79. package/lib/camunda-cloud/helper/ElementHelper.js +0 -18
  80. package/lib/camunda-cloud/helper/ExtensionElementsHelper.js +0 -17
  81. package/lib/camunda-cloud/helper/FormsHelper.js +0 -84
  82. package/lib/camunda-cloud/helper/InputOutputHelper.js +0 -138
  83. package/lib/camunda-cloud/helper/Utils.js +0 -10
  84. package/lib/camunda-cloud/helper/ZeebeServiceTaskHelper.js +0 -41
  85. package/lib/camunda-platform/features/modeling/behavior/DeleteErrorEventDefinitionBehavior.js +0 -67
  86. package/lib/camunda-platform/features/modeling/behavior/DeleteRetryTimeCycleBehavior.js +0 -84
  87. package/lib/camunda-platform/features/modeling/behavior/UpdateCamundaExclusiveBehavior.js +0 -65
  88. package/lib/camunda-platform/features/modeling/behavior/UpdateInputOutputBehavior.js +0 -54
  89. package/lib/camunda-platform/features/modeling/behavior/UpdateResultVariableBehavior.js +0 -51
  90. package/lib/camunda-platform/features/modeling/behavior/UserTaskFormsBehavior.js +0 -70
  91. package/lib/camunda-platform/features/modeling/behavior/UserTaskGeneratedFormsBehavior.js +0 -117
  92. package/lib/camunda-platform/features/modeling/behavior/index.js +0 -26
  93. package/lib/camunda-platform/features/modeling/index.js +0 -7
  94. package/lib/camunda-platform/helper/InputOutputHelper.js +0 -29
@@ -1,877 +0,0 @@
1
- /**
2
- * Theming
3
- */
4
- .bio-properties-panel {
5
- --color-grey-225-10-15: hsl(225, 10%, 15%);
6
- --color-grey-225-10-35: hsl(225, 10%, 35%);
7
- --color-grey-225-10-55: hsl(225, 10%, 55%);
8
- --color-grey-225-10-75: hsl(225, 10%, 75%);
9
- --color-grey-225-10-80: hsl(225, 10%, 80%);
10
- --color-grey-225-10-85: hsl(225, 10%, 85%);
11
- --color-grey-225-10-90: hsl(225, 10%, 90%);
12
- --color-grey-225-10-95: hsl(225, 10%, 95%);
13
- --color-grey-225-10-97: hsl(225, 10%, 97%);
14
-
15
- --color-blue-205-100-45: hsl(205, 100%, 45%);
16
- --color-blue-205-100-50: hsl(205, 100%, 50%);
17
- --color-blue-205-100-95: hsl(205, 100%, 95%);
18
-
19
- --color-green-150-86-44: hsl(150, 86%, 44%);
20
-
21
- --color-red-360-100-40: hsl(360, 100%, 40%);
22
- --color-red-360-100-45: hsl(360, 100%, 45%);
23
- --color-red-360-100-92: hsl(360, 100%, 92%);
24
- --color-red-360-100-97: hsl(360, 100%, 97%);
25
-
26
- --color-white: white;
27
- --color-black: black;
28
- --color-transparent: transparent;
29
-
30
- --text-base-color: var(--color-grey-225-10-15);
31
- --text-error-color: var(--color-red-360-100-45);
32
- --link-color: var(--color-blue-205-100-50);
33
-
34
- --description-color: var(--color-grey-225-10-35);
35
- --description-code-background-color: var(--color-grey-225-10-97);
36
- --description-code-border-color: var(--color-grey-225-10-85);
37
- --description-list-item-color: var(--color-grey-225-10-35);
38
-
39
- --placeholder-color: var(--color-grey-225-10-75);
40
-
41
- --header-background-color: var(--color-grey-225-10-95);
42
- --header-icon-fill-color: var(--color-grey-225-10-15);
43
- --header-bottom-border-color: var(--color-grey-225-10-75);
44
-
45
- --group-background-color: var(--color-white);
46
- --group-bottom-border-color: var(--color-grey-225-10-75);
47
-
48
- --add-entry-fill-color: var(--color-grey-225-10-35);
49
- --add-entry-hover-fill-color: var(--color-white);
50
- --add-entry-hover-background-color: var(--color-blue-205-100-50);
51
- --add-entry-label-color: var(--color-white);
52
-
53
- --remove-entry-fill-color: var(--color-red-360-100-45);
54
- --remove-entry-hover-background-color: var(--color-red-360-100-92);
55
-
56
- --arrow-fill-color: var(--color-grey-225-10-35);
57
- --arrow-hover-background-color: var(--color-grey-225-10-95);
58
-
59
- --dot-color: var(--color-grey-225-10-35);
60
-
61
- --list-badge-color: var(--color-white);
62
- --list-badge-background-color: var(--color-grey-225-10-35);
63
-
64
- --input-background-color: var(--color-grey-225-10-97);
65
- --input-border-color: var(--color-grey-225-10-75);
66
-
67
- --input-focus-background-color: var(--color-blue-205-100-95);
68
- --input-focus-border-color: var(--color-blue-205-100-50);
69
-
70
- --input-error-background-color: var(--color-red-360-100-97);
71
- --input-error-border-color: var(--color-red-360-100-45);
72
- --input-error-focus-border-color: var(--color-red-360-100-45);
73
-
74
- --input-disabled-color: var(--color-grey-225-10-55);
75
- --input-disabled-background-color: var(--color-grey-225-10-97);
76
- --input-disabled-border-color: var(--color-grey-225-10-90);
77
-
78
- --toggle-switch-on-background-color: var(--color-blue-205-100-50);
79
- --toggle-switch-off-background-color: var(--color-grey-225-10-75);
80
- --toggle-switch-switcher-background-color: var(--color-white);
81
-
82
- --side-line-background-color: var(--color-grey-225-10-35);
83
- --side-line-extension-background-color: var(--color-grey-225-10-35);
84
-
85
- --list-entry-dot-background-color: var(--color-grey-225-10-35);
86
- --list-entry-header-button-fill-color: var(--color-grey-225-10-35);
87
- --list-entry-add-entry-empty-background-color: var(--color-blue-205-100-50);
88
- --list-entry-add-entry-empty-hover-background-color: var(--color-blue-205-100-45);
89
- --list-entry-add-entry-label-color: var(--color-white);
90
- --list-entry-add-entry-background-color: var(--color-blue-205-100-50);
91
- --list-entry-add-entry-fill-color: var(--color-white);
92
-
93
- --dropdown-item-background-color: var(--color-white);
94
- --dropdown-item-hover-background-color: var(--color-grey-225-10-95);
95
- --dropdown-separator-background-color: var(--color-grey-225-10-75);
96
-
97
- --text-size-base: 14px;
98
- --text-size-small: 13px;
99
- --text-size-smallest: 12px;
100
- --text-line-height: 21px;
101
- --line-height-condensed: 17px;
102
-
103
- --font-family: sans-serif;
104
- --font-family-monospace: monospace;
105
-
106
- display: none;
107
- position: relative;
108
- height: 100%;
109
- width: 100%;
110
- overflow: hidden;
111
- }
112
-
113
- .bio-properties-panel * {
114
- color: var(--text-base-color);
115
- font-size: var(--text-size-base);
116
- line-height: var(--text-line-height);
117
- font-weight: 400;
118
- box-sizing: border-box;
119
- }
120
-
121
- .bio-properties-panel {
122
- font-family: var(--font-family);
123
- }
124
-
125
- .bio-properties-panel.open {
126
- display: flex;
127
- flex-direction: column;
128
- flex: 1;
129
- }
130
-
131
- .bio-properties-panel-placeholder {
132
- padding: 10px;
133
- color: var(--placeholder-color);
134
- font-size: var(--text-size-base);
135
- text-align: center;
136
- }
137
-
138
- /**
139
- * Header
140
- */
141
- .bio-properties-panel-header {
142
- display: flex;
143
- flex-direction: row;
144
- align-items: center;
145
- font-size: var(--text-size-base);
146
- padding: 16px 10px;
147
- margin-bottom: 2px;
148
- background-color: var(--header-background-color);
149
- border-bottom: 1px solid var(--header-bottom-border-color);
150
- width: 100%;
151
- z-index: 1;
152
- max-height: 64px;
153
- overflow: hidden;
154
- }
155
-
156
- .bio-properties-panel-header-icon {
157
- fill: var(--header-icon-fill-color);
158
- display: flex;
159
- flex-direction: row;
160
- align-items: center;
161
- justify-content: center;
162
- width: 32px;
163
- height: 32px;
164
- }
165
-
166
- .bio-properties-panel-header-labels {
167
- overflow: hidden;
168
- margin-left: 12px;
169
- user-select: none;
170
- }
171
-
172
- .bio-properties-panel-header-type {
173
- font-size: var(--text-size-smallest);
174
- font-weight: 600;
175
- white-space: nowrap;
176
- text-overflow: ellipsis;
177
- overflow: hidden;
178
- text-transform: uppercase;
179
- }
180
-
181
- .bio-properties-panel-header-label {
182
- white-space: nowrap;
183
- text-overflow: ellipsis;
184
- overflow: hidden;
185
- margin-top: -6px;
186
- }
187
-
188
- /**
189
- * Scroll container
190
- */
191
- .bio-properties-panel-scroll-container {
192
- overflow-y: auto;
193
- overflow-x: hidden;
194
- flex: 1;
195
- padding-bottom: 70px;
196
- }
197
-
198
- /**
199
- * Groups
200
- */
201
- .bio-properties-panel-group {
202
- background-color: var(--group-background-color);
203
- border-bottom: 1px solid var(--group-bottom-border-color);
204
- }
205
-
206
- .bio-properties-panel-group-header {
207
- position: relative;
208
- display: flex;
209
- flex-direction: row;
210
- align-items: center;
211
- font-size: var(--text-size-base);
212
- height: 32px;
213
- user-select: none;
214
- justify-content: space-between;
215
- }
216
-
217
- .bio-properties-panel-group-header .bio-properties-panel-group-header-title {
218
- white-space: nowrap;
219
- overflow: hidden;
220
- text-overflow: ellipsis;
221
- margin: 1px 12px 0;
222
- }
223
-
224
- .bio-properties-panel-group-header.open .bio-properties-panel-group-header-title {
225
- font-weight: 500;
226
- }
227
-
228
- .bio-properties-panel-group-header-buttons {
229
- display: flex;
230
- }
231
-
232
- .bio-properties-panel-group-header-buttons .bio-properties-panel-group-header-button {
233
- display: inline-flex;
234
- justify-content: center;
235
- align-items: center;
236
- align-self: center;
237
- height: 22px;
238
- line-height: 22px;
239
- min-width: 22px;
240
- margin: 5px;
241
- padding: 0 3px;
242
- border: none;
243
- background: none;
244
- }
245
-
246
- .bio-properties-panel-group-header-buttons .bio-properties-panel-group-header-buttons:last-child {
247
- margin-right: 0;
248
- }
249
-
250
- .bio-properties-panel-add-entry {
251
- fill: var(--add-entry-fill-color);
252
- border-radius: 11px;
253
- }
254
-
255
- .bio-properties-panel-group-header.empty .bio-properties-panel-add-entry {
256
- margin-right: 69px;
257
- padding-left: 6px;
258
- }
259
-
260
- .bio-properties-panel-group-header.empty .bio-properties-panel-add-entry:hover {
261
- margin-right: 19px;
262
- }
263
-
264
- .bio-properties-panel-group-header.empty .bio-properties-panel-add-entry-label {
265
- display: none;
266
- color: var(--add-entry-label-color);
267
- padding: 4px 6px 3px 2px;
268
- }
269
-
270
- .bio-properties-panel-group-header-button.bio-properties-panel-add-entry:hover {
271
- background-color: var(--add-entry-hover-background-color);
272
- fill: var(--add-entry-hover-fill-color);
273
- }
274
-
275
- .bio-properties-panel-group-header-button.bio-properties-panel-add-entry:hover .bio-properties-panel-add-entry-label {
276
- display: block;
277
- }
278
-
279
- .bio-properties-panel-group-entries {
280
- display: none;
281
- }
282
-
283
- .bio-properties-panel-group-entries.open {
284
- display: block;
285
- }
286
-
287
- .bio-properties-panel-arrow {
288
- display: flex;
289
- justify-content: center;
290
- text-align: center;
291
- fill: var(--arrow-fill-color);
292
- min-width: 22px;
293
- border-radius: 11px;
294
- border: none;
295
- background: none;
296
- }
297
-
298
- .bio-properties-panel-arrow:hover {
299
- background-color: var(--arrow-hover-background-color);
300
- }
301
-
302
- .bio-properties-panel-arrow-down {
303
- transform: rotate(90deg);
304
- }
305
-
306
- .bio-properties-panel-dot {
307
- align-self: center;
308
- height: 8px;
309
- min-width: 8px;
310
- border-radius: 50%;
311
- margin: 12px;
312
- background-color: var(--dot-color);
313
- }
314
-
315
- /**
316
- * Lists
317
- */
318
- .bio-properties-panel-list {
319
- display: none;
320
- }
321
-
322
- .bio-properties-panel-list.open {
323
- display: block;
324
- margin-bottom: 6px;
325
- padding-bottom: 2px;
326
- }
327
-
328
- .bio-properties-panel-list-badge {
329
- height: 22px;
330
- min-width: 22px;
331
- color: var(--list-badge-color);
332
- border-radius: 11px;
333
- font-size: var(--text-size-small);
334
- line-height: 22px;
335
- text-align: center;
336
- user-select: none;
337
- padding: 0 5px;
338
- margin: 5px;
339
- background-color: var(--list-badge-background-color);
340
- }
341
-
342
- /**
343
- * Basic entries
344
- */
345
- .bio-properties-panel-entry {
346
- margin: 2px 32px 6px 12px;
347
- }
348
-
349
- .bio-properties-panel-entry:last-child {
350
- padding-bottom: 10px;
351
- }
352
-
353
- .bio-properties-panel-label {
354
- display: block;
355
- font-size: var(--text-size-small);
356
- margin: 2px 0 1px;
357
- }
358
-
359
- .bio-properties-panel-description,
360
- .bio-properties-panel-description p,
361
- .bio-properties-panel-description span,
362
- .bio-properties-panel-description div {
363
- color: var(--description-color);
364
- display: block;
365
- margin: 2px 0 4px;
366
- line-height: var(--line-height-condensed);
367
- font-weight: 400;
368
- font-size: var(--text-size-small);
369
- }
370
-
371
- .bio-properties-panel-description code {
372
- color: var(--description-color);
373
- font-family: var(--font-family);
374
- font-size: var(--text-size-small);
375
- line-height: var(--line-height-condensed);
376
- padding: 0 2px;
377
- background-color: var(--description-code-background-color);
378
- border: 1px solid var(--description-code-border-color);
379
- border-radius: 3px;
380
- }
381
-
382
- .bio-properties-panel-description ul {
383
- padding: 0;
384
- margin: 0 0 0 12px;
385
- list-style-type: disc;
386
- }
387
-
388
- .bio-properties-panel-description li {
389
- color: var(--description-list-item-color);
390
- margin: 0 0 0 12px;
391
- }
392
-
393
- .bio-properties-panel-description a {
394
- color: var(--link-color);
395
- font-size: var(--text-size-small);
396
- text-decoration: underline;
397
- }
398
-
399
- .bio-properties-panel-input {
400
- padding: 3px 6px 2px;
401
- border: 1px solid var(--input-border-color);
402
- border-radius: 2px;
403
- background-color: var(--input-background-color);
404
- font-size: var(--text-size-base);
405
- font-family: inherit;
406
- }
407
-
408
- .bio-properties-panel-input[type=number],
409
- select.bio-properties-panel-input,
410
- textarea.bio-properties-panel-input,
411
- .bio-properties-panel-input[type=text] {
412
- display: block;
413
- width: 100%;
414
- }
415
-
416
- .bio-properties-panel-input:focus {
417
- outline: none;
418
- background-color: var(--input-focus-background-color);
419
- border: 1px solid var(--input-focus-border-color);
420
- }
421
-
422
- .bio-properties-panel-input:disabled {
423
- border-color: var(--input-disabled-border-color);
424
- background-color: var(--input-disabled-background-color);
425
- color: var(--input-disabled-color);
426
- }
427
-
428
- select.bio-properties-panel-input {
429
- padding: 4px 6px;
430
- }
431
-
432
- .bio-properties-panel-input-monospace {
433
- font-family: var(--font-family-monospace);
434
- }
435
-
436
- .bio-properties-panel-input[type="checkbox"], .bio-properties-panel-input[type="radio"] {
437
- margin: 0;
438
- vertical-align: middle;
439
- }
440
-
441
- .bio-properties-panel-input[type="checkbox"]:focus {
442
- outline: 1px solid var(--input-focus-border-color);
443
- outline-offset: 0;
444
- }
445
-
446
- .bio-properties-panel-checkbox > .bio-properties-panel-label {
447
- display: inline-block;
448
- font-size: var(--text-size-base);
449
- margin-left: 6px;
450
- margin-top: auto;
451
- vertical-align: middle;
452
- }
453
-
454
- .bio-properties-panel-checkbox-entry + .bio-properties-panel-checkbox-entry {
455
- margin-top: -8px;
456
- }
457
-
458
- .bio-properties-panel-checkbox-entry > .bio-properties-panel-description {
459
- margin-left: 18px;
460
- }
461
-
462
- textarea.bio-properties-panel-input {
463
- resize: vertical;
464
- }
465
-
466
- .bio-properties-panel-entry.has-error .bio-properties-panel-input {
467
- border-color: var(--input-error-border-color);
468
- background-color: var(--input-error-background-color);
469
- }
470
-
471
- .bio-properties-panel-entry.has-error .bio-properties-panel-input:focus {
472
- border-color: var(--input-error-focus-border-color);
473
- }
474
-
475
- .bio-properties-panel-entry .bio-properties-panel-error {
476
- color: var(--text-error-color);
477
- margin: 4px 0;
478
- font-size: var(--text-size-small);
479
- }
480
-
481
- .bio-properties-panel-simple {
482
- width: 100%;
483
- margin-right: 8px;
484
- }
485
-
486
- .bio-properties-panel-simple + .bio-properties-panel-remove-entry {
487
- margin: auto;
488
- }
489
-
490
- /**
491
- * Toggle Switch
492
- */
493
- .bio-properties-panel-toggle-switch-entry + .bio-properties-panel-toggle-switch-entry {
494
- margin-top: -8px;
495
- }
496
-
497
- .bio-properties-panel-toggle-switch-entry > .bio-properties-panel-description {
498
- margin-left: 38px;
499
- }
500
-
501
- .bio-properties-panel-toggle-switch .bio-properties-panel-field-wrapper {
502
- display: flex;
503
- flex-direction: row;
504
- align-items: center;
505
- }
506
-
507
- .bio-properties-panel-toggle-switch > .bio-properties-panel-label {
508
- font-size: var(--text-size-base);
509
- }
510
-
511
- .bio-properties-panel-toggle-switch .bio-properties-panel-toggle-switch__label {
512
- margin: 0;
513
- margin-left: 6px;
514
- font-size: var(--text-size-base);
515
- }
516
-
517
- .bio-properties-panel-toggle-switch .bio-properties-panel-toggle-switch__switcher {
518
- position: relative;
519
- width: 32px;
520
- height: 16px;
521
- }
522
-
523
- .bio-properties-panel-toggle-switch .bio-properties-panel-toggle-switch__switcher input[type='checkbox'] {
524
- opacity: 0;
525
- width: 0;
526
- height: 0;
527
- }
528
-
529
- .bio-properties-panel-toggle-switch .bio-properties-panel-toggle-switch__switcher .bio-properties-panel-toggle-switch__slider {
530
- position: absolute;
531
- top: 0;
532
- left: 0;
533
- right: 0;
534
- bottom: 0;
535
- background-color: var(--toggle-switch-off-background-color);
536
- -webkit-transition: 0.4s;
537
- transition: 0.4s;
538
- border-radius: 34px;
539
- }
540
-
541
- .bio-properties-panel-toggle-switch .bio-properties-panel-toggle-switch__switcher .bio-properties-panel-toggle-switch__slider:before {
542
- position: absolute;
543
- content: "";
544
- height: 12px;
545
- width: 12px;
546
- left: 2px;
547
- bottom: 2px;
548
- background-color: var(--toggle-switch-switcher-background-color);
549
- -webkit-transition: 0.4s;
550
- transition: 0.4s;
551
- border-radius: 50%;
552
- }
553
-
554
- .bio-properties-panel-toggle-switch .bio-properties-panel-toggle-switch__switcher input[type='checkbox']:checked + .bio-properties-panel-toggle-switch__slider {
555
- background-color: var(--toggle-switch-on-background-color);
556
- box-shadow: 0 0 1px ;
557
- }
558
-
559
- .bio-properties-panel-toggle-switch .bio-properties-panel-toggle-switch__switcher input[type='checkbox']:checked + .bio-properties-panel-toggle-switch__slider:before {
560
- -webkit-transform: translateX(16px);
561
- -ms-transform: translateX(16px);
562
- transform: translateX(16px);
563
- }
564
-
565
- /**
566
- * Collapsible entries
567
- */
568
- .bio-properties-panel-collapsible-entry-entries {
569
- position: relative;
570
- display: none;
571
- }
572
-
573
- .bio-properties-panel-collapsible-entry-entries .bio-properties-panel-entry:last-child {
574
- padding-bottom: 0;
575
- }
576
-
577
- .bio-properties-panel-collapsible-entry-entries.open {
578
- display: block;
579
- }
580
-
581
- .bio-properties-panel-collapsible-entry-entries {
582
- padding-left: 20px;
583
- margin-bottom: 10px;
584
- position: relative;
585
- display: none;
586
- }
587
-
588
- .bio-properties-panel-collapsible-entry-header {
589
- position: relative;
590
- display: flex;
591
- justify-content: space-between;
592
- align-items: center;
593
- overflow: hidden;
594
- }
595
-
596
- .bio-properties-panel-collapsible-entry-header .bio-properties-panel-collapsible-entry-header-title {
597
- padding: 2px 24px 2px 32px;
598
- font-size: var(--text-size-base);
599
- white-space: nowrap;
600
- overflow: hidden;
601
- text-overflow: ellipsis;
602
- user-select: none;
603
- }
604
-
605
- .bio-properties-panel-collapsible-entry-arrow {
606
- position: absolute;
607
- top: 2px;
608
- left: 6px;
609
- padding: 0 3px;
610
- height: 22px;
611
- display: inline-flex;
612
- justify-content: center;
613
- align-items: center;
614
- align-self: center;
615
- }
616
-
617
- .bio-properties-panel-remove-entry {
618
- display: flex;
619
- align-items: center;
620
- justify-content: center;
621
- margin-right: 5px;
622
- padding: 0;
623
- width: 22px;
624
- height: 22px;
625
- fill: var(--remove-entry-fill-color);
626
- border-radius: 50%;
627
- border: none;
628
- background: none;
629
- visibility: hidden;
630
- }
631
-
632
- .bio-properties-panel-remove-entry:hover {
633
- background-color: var(--remove-entry-hover-background-color);
634
- }
635
-
636
- .bio-properties-panel-list-entry-item:hover .bio-properties-panel-remove-list-entry,
637
- .bio-properties-panel-collapsible-entry:hover > .bio-properties-panel-collapsible-entry-header .bio-properties-panel-remove-entry,
638
- .bio-properties-panel-collapsible-entry:focus-within > .bio-properties-panel-collapsible-entry-header .bio-properties-panel-remove-entry
639
- {
640
- visibility: visible;
641
- }
642
-
643
- /* Side line */
644
- .bio-properties-panel-collapsible-entry-entries::before {
645
- content: "";
646
- position: absolute;
647
- left: 16px;
648
- width: 2px;
649
- top: -6px;
650
- bottom: 12px;
651
- background-color: var(--side-line-background-color);
652
- border-radius: 1px;
653
- }
654
-
655
- /* Side line extension for non-list entry or open list entry positioned as the last one. */
656
- .bio-properties-panel-collapsible-entry-entries .bio-properties-panel-entry:not(.bio-properties-panel-list-entry):last-child,
657
- .bio-properties-panel-list-entry.open:last-child {
658
- position: relative;
659
- }
660
-
661
- .bio-properties-panel-collapsible-entry-entries .bio-properties-panel-entry:not(.bio-properties-panel-list-entry):last-child::after,
662
- .bio-properties-panel-list-entry.open:last-child::after {
663
- content: "";
664
- position: absolute;
665
- left: -16px;
666
- width: 2px;
667
- top: 0;
668
- bottom: -4px;
669
- background-color: var(--side-line-extension-background-color);
670
- border-radius: 1px;
671
- }
672
-
673
- .bio-properties-panel-list-entry-item .bio-properties-panel-collapsible-entry-entries .bio-properties-panel-entry:last-child::after {
674
- left: -18px;
675
- }
676
-
677
- /*
678
- * List entry
679
- */
680
- .bio-properties-panel-list-entry {
681
- position: relative;
682
- margin-right: 5px;
683
- margin-bottom: 0;
684
- }
685
-
686
- .bio-properties-panel-list-entry .bio-properties-panel-entry {
687
- margin-right: 0;
688
- }
689
-
690
- .bio-properties-panel-list-entry-header {
691
- position: relative;
692
- overflow: hidden;
693
- display: flex;
694
- justify-content: space-between;
695
- height: 32px;
696
- }
697
-
698
- /* Nested list dot */
699
- .bio-properties-panel-list-entry::before {
700
- content: "";
701
- width: 8px;
702
- height: 8px;
703
- position: absolute;
704
- left: -19px;
705
- top: 13px;
706
- border-radius: 50%;
707
- background-color: var(--list-entry-dot-background-color);
708
- }
709
-
710
- .bio-properties-panel-list-entry-header-title {
711
- display: block;
712
- margin: auto 0;
713
- padding: 2px 0;
714
- font-size: var(--text-size-base);
715
- white-space: nowrap;
716
- overflow: hidden;
717
- text-overflow: ellipsis;
718
- }
719
-
720
- .bio-properties-panel-list-entry-header-title.open {
721
- font-weight: 500;
722
- }
723
-
724
- .bio-properties-panel-list-entry-header-buttons {
725
- display: flex;
726
- align-items: center;
727
- }
728
-
729
- .bio-properties-panel-list-entry-header-buttons > button {
730
- display: inline-flex;
731
- justify-content: center;
732
- align-items: center;
733
- align-self: center;
734
- height: 22px;
735
- line-height: 22px;
736
- min-width: 22px;
737
- margin: 5px;
738
- padding: 0 3px;
739
- border: none;
740
- background: none;
741
- fill: var(--list-entry-header-button-fill-color);
742
- }
743
-
744
- .bio-properties-panel-list-entry-header-buttons > :last-child {
745
- margin-right: 0;
746
- }
747
-
748
- .bio-properties-panel-list-entry-items {
749
- padding: 0;
750
- margin: 0;
751
-
752
- list-style: none;
753
- }
754
-
755
- .bio-properties-panel-list-entry-items:not(.open) {
756
- display: none;
757
- }
758
-
759
- .bio-properties-panel-list-entry-item {
760
- display: flex;
761
- justify-content: space-between;
762
- }
763
-
764
- .bio-properties-panel-list-entry-item .bio-properties-panel-remove-entry {
765
- margin-right: 1px;
766
- }
767
-
768
- .bio-properties-panel-list-entry-item .bio-properties-panel-collapsible-entry {
769
- width: 100%;
770
- margin-right: 4px;
771
- }
772
-
773
- .bio-properties-panel-list-entry-item .bio-properties-panel-collapsible-entry-header {
774
- margin-left: -8px;
775
- }
776
-
777
- .bio-properties-panel-list-entry-item .bio-properties-panel-collapsible-entry-arrow {
778
- left: 2px;
779
- }
780
-
781
- .bio-properties-panel-list-entry-item .bio-properties-panel-collapsible-entry-header-title {
782
- padding-left: 30px;
783
- }
784
-
785
- .bio-properties-panel-list-entry-item .bio-properties-panel-collapsible-entry-entries {
786
- padding-left: 10px;
787
- }
788
-
789
- .bio-properties-panel-list-entry-item .bio-properties-panel-collapsible-entry-entries::before {
790
- left: 4px;
791
- }
792
-
793
- .bio-properties-panel-list-entry.empty .bio-properties-panel-add-entry {
794
- margin-right: 16px;
795
- padding-left: 6px;
796
- }
797
-
798
- .bio-properties-panel-list-entry.empty .bio-properties-panel-add-entry-label {
799
- color: var(--list-entry-add-entry-label-color);
800
- padding: 4px 6px 3px 2px;
801
- }
802
-
803
- .bio-properties-panel-list-entry-header-buttons .bio-properties-panel-add-entry:hover {
804
- background-color: var(--list-entry-add-entry-background-color);
805
- fill: var(--list-entry-add-entry-fill-color);
806
- }
807
-
808
- .bio-properties-panel-list-entry-item .bio-properties-panel-simple .bio-properties-panel-input {
809
- border-radius: 0;
810
- margin-bottom: -2px;
811
- }
812
-
813
- .bio-properties-panel-list-entry-item:first-child .bio-properties-panel-simple .bio-properties-panel-input {
814
- border-top-left-radius: 2px;
815
- border-top-right-radius: 2px;
816
- }
817
-
818
- .bio-properties-panel-list-entry-item:last-child .bio-properties-panel-simple .bio-properties-panel-input {
819
- border-bottom-left-radius: 2px;
820
- border-bottom-right-radius: 2px;
821
- }
822
-
823
- .bio-properties-panel-dropdown-button {
824
- position: relative;
825
-
826
- --dropdown-button-margin: 5px;
827
- }
828
-
829
- .bio-properties-panel-dropdown-button:not(.open) .bio-properties-panel-dropdown-button__menu {
830
- display: none;
831
- }
832
-
833
- .bio-properties-panel-dropdown-button__menu {
834
- min-width: calc(100% - var(--dropdown-button-margin) * 2);
835
- max-width: 240px;
836
-
837
- position: absolute;
838
- top: calc(100% - var(--dropdown-button-margin));
839
- right: var(--dropdown-button-margin);
840
- z-index: 101;
841
-
842
- background-color: var(--dropdown-item-background-color);
843
-
844
- padding: 8px 0;
845
-
846
- box-shadow: 0 1px 4px 0 var(--color-grey-225-10-85), 0 2px 16px 0 var(--color-grey-225-10-75)
847
- }
848
-
849
- .bio-properties-panel-dropdown-button__menu-item {
850
- display: block;
851
- width: 100%;
852
- padding: 4px 12px;
853
-
854
- font-size: var(--text-size-small);
855
- appearance: revert;
856
- border: unset;
857
- background: unset;
858
- text-align: unset;
859
- }
860
-
861
- .bio-properties-panel-dropdown-button__menu-item--separator {
862
- width: 100%;
863
- height: 1px;
864
-
865
- padding: 0;
866
- margin: 8px 0;
867
-
868
- background-color: var(--dropdown-separator-background-color);
869
- }
870
-
871
- .bio-properties-panel-dropdown-button__menu-item--actionable {
872
- font-size: var(--text-size-base);
873
- }
874
-
875
- .bio-properties-panel-dropdown-button__menu-item--actionable:hover {
876
- background-color: var(--dropdown-item-hover-background-color);
877
- }