@kylincloud/flamegraph 0.35.6 → 0.35.7

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.
@@ -1,792 +0,0 @@
1
- @charset "UTF-8";
2
-
3
- /* src/shims/NoData.module.scss */
4
- .noData {
5
- width: 100%;
6
- height: 100%;
7
- text-align: center;
8
- padding: 60px 0;
9
- }
10
-
11
- /* src/FlameGraph/FlameGraphComponent/canvas.module.css */
12
- .canvas_canvas {
13
- width: 100%;
14
- cursor: pointer;
15
- position: relative;
16
- z-index: 1;
17
- }
18
-
19
- /* src/FlameGraph/FlameGraphComponent/Highlight.module.css */
20
- .Highlight_highlight {
21
- position: absolute;
22
- pointer-events: none;
23
- background: #ffffff40;
24
- mix-blend-mode: overlay;
25
- z-index: 2;
26
- }
27
-
28
- /* src/FlameGraph/FlameGraphComponent/ContextMenuHighlight.module.css */
29
- .ContextMenuHighlight_highlightContextMenu {
30
- position: absolute;
31
- pointer-events: none;
32
- background: #ffffff8c;
33
- mix-blend-mode: overlay;
34
- z-index: 2;
35
- }
36
-
37
- /* src/Tooltip/Tooltip.module.scss */
38
- .tooltip {
39
- width: 420px;
40
- position: fixed;
41
- background: var(--ps-tooltip-bg);
42
- box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.3);
43
- border-radius: 4px;
44
- color: var(--ps-tooltip-text);
45
- font-size: 12px;
46
- visibility: hidden;
47
- z-index: 2;
48
- pointer-events: none;
49
- }
50
- .tooltip.flamegraphDiffTooltip {
51
- width: 450px;
52
- }
53
- .tooltip .tooltipName {
54
- color: var(--ps-tooltip-text);
55
- background-color: var(--ps-tooltip-header-bg);
56
- border-top-right-radius: 4px;
57
- border-top-left-radius: 4px;
58
- font-weight: bold;
59
- white-space: nowrap;
60
- overflow: hidden;
61
- text-overflow: ellipsis;
62
- padding: 8px 10px;
63
- font-family:
64
- SFMono-Regular,
65
- Consolas,
66
- Liberation Mono,
67
- Menlo,
68
- monospace;
69
- }
70
- .tooltip .functionName {
71
- padding: 8px 10px 0;
72
- font-family:
73
- SFMono-Regular,
74
- Consolas,
75
- Liberation Mono,
76
- Menlo,
77
- monospace;
78
- white-space: break-spaces;
79
- word-break: break-all;
80
- }
81
- .tooltip .tooltipTable {
82
- width: calc(100% - 20px);
83
- margin: 10px;
84
- display: table;
85
- }
86
- .tooltip .tooltipTable th,
87
- .tooltip .tooltipTable td {
88
- background-color: var(--ps-tooltip-bg);
89
- border: 1px solid var(--ps-tooltip-header-bg);
90
- padding: 5px;
91
- font-weight: normal;
92
- }
93
- .tooltip .clickInfo {
94
- margin-bottom: 10px;
95
- display: flex;
96
- justify-content: center;
97
- color: var(--ps-right-click-info);
98
- }
99
- .tooltip .clickInfo svg {
100
- color: initial;
101
- display: block;
102
- align-self: center;
103
- width: 22px;
104
- height: 22px;
105
- margin-right: 5px;
106
- }
107
- .tooltip .clickInfo span {
108
- font-size: 14px;
109
- }
110
-
111
- /* src/FlameGraph/FlameGraphComponent/ContextMenu.module.scss */
112
- .dummy {
113
- display: block;
114
- }
115
- .dummy svg {
116
- margin-right: 10px;
117
- }
118
-
119
- /* src/FlameGraph/FlameGraphComponent/LogoLink.module.scss */
120
- .logoLink {
121
- text-decoration: none;
122
- font-weight: 500;
123
- opacity: 0.5;
124
- color: var(--ps-neutral-2);
125
- position: absolute;
126
- right: 0;
127
- bottom: 0;
128
- z-index: 0;
129
- }
130
-
131
- /* src/FlameGraph/FlameGraphComponent/Header.module.css */
132
- .Header_flamegraphHeader {
133
- padding-bottom: 5px;
134
- display: flex;
135
- justify-content: space-between;
136
- align-items: flex-start;
137
- }
138
- .Header_flamegraphHeader > div:first-child {
139
- width: 100%;
140
- }
141
- .Header_flamegraphHeader button {
142
- }
143
- .Header_row {
144
- display: flex;
145
- justify-content: center;
146
- }
147
- .Header_flamegraphTitle {
148
- width: 100%;
149
- display: block;
150
- text-align: center;
151
- }
152
-
153
- /* src/FlameGraph/FlameGraphComponent/DiffLegend.module.css */
154
- .DiffLegend_flamegraph-legend {
155
- display: flex;
156
- align-items: center;
157
- font-size: 11px;
158
- justify-content: center;
159
- }
160
- .DiffLegend_flamegraph-legend-list {
161
- display: flex;
162
- justify-content: center;
163
- }
164
- .DiffLegend_flamegraph-legend-item {
165
- width: 37px;
166
- text-align: center;
167
- white-space: nowrap;
168
- overflow: hidden;
169
- }
170
-
171
- /* src/shims/Dropdown.module.scss */
172
- .dropdownMenu {
173
- padding: 0.25rem 0;
174
- box-shadow: 0px 2px 6px var(--ps-dropdown-shadow) !important;
175
- background-color: var(--ps-dropdown-background) !important;
176
- color: var(--ps-neutral-2) !important;
177
- }
178
- .dropdownMenu ul[class*=szh-menu] {
179
- color: var(--ps-neutral-2) !important;
180
- background-color: var(--ps-dropdown-background) !important;
181
- }
182
- .dropdownMenu li[class=szh-menu__header] {
183
- text-align: left;
184
- }
185
- .dropdownMenu li[class*=hover],
186
- .dropdownMenu div[class*=hover] {
187
- background-color: var(--ps-ui-element-bg-highlight);
188
- }
189
- .dropdownMenu [class*=szh-menu--open]:empty {
190
- display: none;
191
- }
192
- .dropdownMenu [class*="szh-menu__item active"] {
193
- background-color: var(--ps-ui-element-bg-highlight);
194
- color: var(--ps-selected-app);
195
- }
196
- .dropdownMenu [class*=szh-menu__item--focusable] {
197
- background-color: inherit !important;
198
- padding-top: 1rem;
199
- padding-bottom: 1rem;
200
- }
201
- .dropdownMenu [class*=szh-menu__item--focusable] input {
202
- width: 100%;
203
- }
204
- .dropdownMenuButton {
205
- outline: none;
206
- display: flex;
207
- flex-shrink: 0;
208
- position: relative;
209
- border-radius: 4px;
210
- background-color: var(--ps-ui-element-bg-primary);
211
- border: 1px solid var(--ps-ui-border);
212
- margin-right: 5px;
213
- padding-right: 20px;
214
- }
215
- .dropdownMenuButton::after {
216
- content: "\25be";
217
- position: absolute;
218
- top: 3px;
219
- right: 5px;
220
- }
221
- .dropdownMenuButton:hover {
222
- cursor: pointer;
223
- background-color: var(--ps-ui-element-bg-highlight);
224
- }
225
-
226
- /* src/FlameGraph/FlameGraphComponent/DiffLegendPaletteDropdown.module.css */
227
- .DiffLegendPaletteDropdown_diffPaletteDropdown {
228
- max-width: 510px;
229
- min-width: 292px;
230
- width: inherit;
231
- padding-right: 20px !important;
232
- }
233
- .DiffLegendPaletteDropdown_dropdownWrapper {
234
- display: flex;
235
- align-items: center;
236
- flex-direction: column;
237
- }
238
- .DiffLegendPaletteDropdown_diffPaletteDropdown > div {
239
- margin-bottom: 0px;
240
- display: flex;
241
- }
242
- .DiffLegendPaletteDropdown_diffPaletteDropdown::after {
243
- top: 0px;
244
- }
245
- .DiffLegendPaletteDropdown_dropdownItem {
246
- width: 100%;
247
- display: flex;
248
- }
249
- .DiffLegendPaletteDropdown_dropdownItem svg {
250
- margin-left: 1em;
251
- fill: var(--ps-neutral-2);
252
- }
253
- .DiffLegendPaletteDropdown_row {
254
- display: flex;
255
- justify-content: space-between;
256
- margin-left: auto;
257
- margin-right: auto;
258
- width: 300px;
259
- height: 45px;
260
- }
261
-
262
- /* src/FlameGraph/FlameGraphComponent/styles.module.scss */
263
- .flamegraphPane {
264
- flex: 1;
265
- position: relative;
266
- }
267
- .flamegraphPane .fitModeItem svg,
268
- .flamegraphPane .sandwichItem svg {
269
- width: 1em;
270
- margin-right: 10px;
271
- }
272
-
273
- /* src/shims/Table.module.scss */
274
- .table {
275
- width: 100%;
276
- table-layout: fixed;
277
- }
278
- .table thead th.sortable {
279
- cursor: pointer;
280
- user-select: none;
281
- }
282
- .table thead th .sortArrow {
283
- display: inline-block;
284
- border: 5px solid transparent;
285
- border-top-color: var(--ps-ui-foreground-text);
286
- top: 3px;
287
- position: relative;
288
- margin-left: 7px;
289
- }
290
- .table thead th .sortArrow.asc {
291
- border-top-color: transparent;
292
- border-bottom-color: var(--ps-button-switch-bg-highlight);
293
- top: -2px;
294
- }
295
- .table thead th .sortArrow.desc {
296
- border-top-color: var(--ps-button-switch-bg-highlight);
297
- top: 3px;
298
- }
299
- .table thead,
300
- .table tbody tr:nth-child(2n) {
301
- background-color: var(--ps-neutral-9);
302
- }
303
- .table tbody {
304
- cursor: pointer;
305
- }
306
- .table tbody td {
307
- font-weight: initial;
308
- text-align: center;
309
- }
310
- .table tbody tr.isRowSelected {
311
- cursor: pointer;
312
- background: var(--ps-table-highlight-row-bg) !important;
313
- color: var(--ps-table-highlight-row-text);
314
- }
315
- .table tbody tr.isRowDisabled td {
316
- text-decoration: line-through;
317
- }
318
- .table tbody tr:not(.isRowSelected):hover {
319
- cursor: pointer;
320
- color: var(--ps-neutral-2);
321
- background: var(--ps-ui-element-bg-highlight);
322
- }
323
- .table tbody td,
324
- .table tbody th {
325
- border: 1px solid var(--ps-ui-border);
326
- padding: 4px 10px;
327
- width: 10%;
328
- }
329
- .loadingSpinner {
330
- text-align: center;
331
- margin-top: 50px;
332
- }
333
- .pagination {
334
- display: flex;
335
- justify-content: flex-end;
336
- }
337
-
338
- /* src/shims/Button.module.scss */
339
- .button {
340
- white-space: nowrap;
341
- overflow: hidden;
342
- text-overflow: ellipsis;
343
- cursor: pointer;
344
- border: 1px solid var(--ps-ui-border);
345
- border-radius: 4px;
346
- }
347
- .button[type=button],
348
- .button[type=reset],
349
- .button[type=submit] {
350
- -webkit-appearance: button;
351
- }
352
- .noIcon {
353
- min-width: 48px;
354
- }
355
- .noBox {
356
- border: none;
357
- border-radius: none;
358
- background: inherit !important;
359
- }
360
- .customIcon svg {
361
- width: 1rem;
362
- margin-right: 5px;
363
- vertical-align: -0.125em;
364
- }
365
- .iconWithText {
366
- margin-right: 5px;
367
- }
368
- .default,
369
- .outline,
370
- .float {
371
- background: var(--ps-ui-element-bg-primary);
372
- }
373
- .default:hover:not(:disabled),
374
- .outline:hover:not(:disabled),
375
- .float:hover:not(:disabled) {
376
- background-color: var(--ps-ui-element-bg-highlight);
377
- }
378
- .default:disabled,
379
- .outline:disabled,
380
- .float:disabled {
381
- color: var(--ps-disabled-button-text);
382
- pointer-events: none;
383
- }
384
- .primary {
385
- border-color: transparent;
386
- color: var(--ps-button-switch-text) !important;
387
- background-color: var(--ps-button-switch-bg);
388
- }
389
- .primary:hover {
390
- background-color: var(--ps-button-switch-bg-highlight);
391
- }
392
- .primary:disabled {
393
- background-color: var(--ps-green-disabled);
394
- pointer-events: none;
395
- }
396
- .secondary {
397
- border-color: transparent;
398
- color: var(--ps-immutable-off-white);
399
- background-color: var(--ps-blue-primary);
400
- }
401
- .secondary:hover {
402
- background-color: var(--ps-blue-highlight);
403
- }
404
- .secondary:disabled {
405
- background-color: var(--ps-blue-disabled);
406
- pointer-events: none;
407
- }
408
- .float {
409
- border-color: transparent;
410
- background-color: transparent;
411
- }
412
- .danger {
413
- border-color: transparent;
414
- color: var(--ps-neutral-2);
415
- background-color: var(--ps-red-primary);
416
- }
417
- .danger:hover {
418
- background-color: var(--ps-red-highlight);
419
- }
420
- .danger:disabled {
421
- background-color: var(--ps-red-disabled);
422
- pointer-events: none;
423
- }
424
- .outline {
425
- background-color: transparent;
426
- }
427
- .outline:hover:not(:disabled) {
428
- background-color: rgba(144, 202, 249, 0.08);
429
- }
430
- .grouped {
431
- margin: 0;
432
- border-right: 0;
433
- border-radius: 0;
434
- padding-left: 12px;
435
- padding-right: 12px;
436
- }
437
- .grouped:first-child {
438
- border-left: 1px solid var(--ps-ui-border);
439
- border-radius: 4px 0 0 4px;
440
- }
441
- .grouped:last-child {
442
- border-right: 1px solid var(--ps-ui-border);
443
- border-radius: 0 4px 4px 0;
444
- }
445
-
446
- /* src/shims/Input.module.scss */
447
- .input {
448
- outline: none;
449
- }
450
- .input:focus {
451
- outline: none;
452
- }
453
- .input:focus:active {
454
- outline: none;
455
- }
456
- .input {
457
- display: inline-block;
458
- position: relative;
459
- border-radius: 4px;
460
- padding: 0.25em 0.375em;
461
- border: 1px solid var(--ps-ui-border);
462
- }
463
- .input[type=search] {
464
- -webkit-appearance: textfield;
465
- outline-offset: -2px;
466
- }
467
-
468
- /* src/SharedQueryInput.module.scss */
469
- .wrapper {
470
- display: flex;
471
- flex-direction: row;
472
- align-items: center;
473
- flex-grow: 1;
474
- }
475
- .search,
476
- .search-synced,
477
- .searchWithSync {
478
- background: var(--ps-immutable-off-white);
479
- transition: background-color ease-out 0.1s;
480
- font: inherit;
481
- margin-right: 1.5px;
482
- border: 1px solid var(--ps-ui-border);
483
- display: flex;
484
- flex-grow: 1;
485
- height: 37px;
486
- width: 100%;
487
- }
488
- .search,
489
- .search-synced,
490
- .searchWithSync,
491
- .search::placeholder,
492
- .search-synced::placeholder,
493
- .searchWithSync::placeholder {
494
- color: var(--ps-immutable-placeholder-text) !important;
495
- }
496
- .searchWithSync {
497
- border-top-right-radius: 0;
498
- border-bottom-right-radius: 0;
499
- border-right: 1px solid var(--ps-ui-border);
500
- margin-right: 0;
501
- }
502
- .search-synced {
503
- border-color: var(--ps-immutable-linked-border);
504
- }
505
- .search:focus,
506
- .searchWithSync:focus,
507
- .search-synced:focus {
508
- background: var(--ps-immutable-white);
509
- }
510
- .icon,
511
- .checked {
512
- cursor: pointer;
513
- }
514
- .icon path,
515
- .checked path {
516
- fill: var(--ps-grey-primary);
517
- }
518
- .checked path {
519
- fill: var(--ps-immutable-linked-border);
520
- }
521
- .sync,
522
- .syncSelected {
523
- border: none;
524
- background-color: var(--ps-immutable-off-white);
525
- cursor: pointer;
526
- width: 40px;
527
- border-top-right-radius: 4px;
528
- border-bottom-right-radius: 4px;
529
- border: 1px solid var(--ps-ui-border);
530
- position: relative;
531
- border-left: none;
532
- display: flex;
533
- align-self: stretch;
534
- align-items: center;
535
- justify-content: center;
536
- }
537
- .syncSelected {
538
- border-top-color: var(--ps-immutable-linked-border);
539
- border-right-color: var(--ps-immutable-linked-border);
540
- border-bottom-color: var(--ps-immutable-linked-border);
541
- }
542
-
543
- /* src/Toolbar.module.scss */
544
- .navbar {
545
- position: relative;
546
- display: flex;
547
- flex-direction: row;
548
- margin: 10px 0;
549
- justify-content: space-between;
550
- height: 47px;
551
- background-color: var(--ps-fl-toolbar-bg);
552
- border: 1px solid var(--ps-ui-border);
553
- padding: 4px;
554
- align-items: center;
555
- }
556
- .viewType {
557
- display: flex;
558
- flex-direction: row;
559
- flex-wrap: nowrap;
560
- }
561
- .navbar button {
562
- color: var(--ps-toolbar-icon-color);
563
- }
564
- .toggleViewButton,
565
- .fitModeButton {
566
- height: 37px;
567
- min-width: auto;
568
- width: 40px;
569
- margin: 0 2px;
570
- padding: 0;
571
- border-color: transparent;
572
- background-color: transparent;
573
- display: flex;
574
- justify-content: center;
575
- align-items: center;
576
- }
577
- .toggleViewButton svg,
578
- .fitModeButton svg {
579
- width: 22px;
580
- height: 22px;
581
- }
582
- .toggleViewButton.selected,
583
- .selected.fitModeButton {
584
- background-color: var(--ps-fl-toolbar-btn-bg);
585
- }
586
- .toggleViewButton.selected:hover,
587
- .selected.fitModeButton:hover {
588
- background-color: var(--ps-fl-toolbar-btn-bg);
589
- }
590
- .toggleViewButton.selected svg,
591
- .selected.fitModeButton svg {
592
- color: white;
593
- }
594
- .collapseNodeButton,
595
- .resetViewButton {
596
- min-width: initial;
597
- width: 40px;
598
- height: 37px;
599
- margin: 0 2px;
600
- padding: 0;
601
- background-color: transparent;
602
- border-color: transparent;
603
- }
604
- .resetViewButton {
605
- width: 40px;
606
- min-width: initial;
607
- margin: 0 2px;
608
- padding: 0;
609
- }
610
- .divider {
611
- width: 1px;
612
- margin: 0 2px;
613
- height: 37px;
614
- background-color: var(--ps-ui-border);
615
- }
616
- .itemsContainer,
617
- .item {
618
- display: flex;
619
- }
620
- .moreButton {
621
- border-radius: 4px;
622
- border: none;
623
- padding: 0 5px;
624
- height: 37px;
625
- }
626
- .moreButton.active,
627
- .moreButton.active:hover {
628
- background-color: var(--ps-fl-toolbar-btn-bg);
629
- }
630
- .moreButton:hover {
631
- background-color: var(--ps-ui-element-bg-highlight);
632
- cursor: pointer;
633
- }
634
- .navbarCollapsedItems {
635
- display: flex;
636
- position: absolute;
637
- right: 0;
638
- top: 50px;
639
- height: 47px;
640
- background-color: var(--ps-fl-toolbar-bg);
641
- border: 1px solid var(--ps-ui-border);
642
- padding: 4px;
643
- z-index: 1;
644
- }
645
-
646
- /* src/FlameGraph/FlamegraphRenderer.module.scss */
647
- .flamegraphContainer {
648
- width: 100%;
649
- }
650
- .flamegraphContainer > *:first-child {
651
- margin-right: 8px;
652
- }
653
- .flamegraphContainer > *:nth-child(2) {
654
- margin-left: 8px;
655
- }
656
- .createdBy {
657
- color: white;
658
- text-align: center;
659
- margin: 10px 0;
660
- }
661
- .createdBy a {
662
- color: #199bef !important;
663
- }
664
- .horizontal {
665
- flex-direction: row;
666
- }
667
- .vertical {
668
- flex-direction: column-reverse;
669
- }
670
- .panesWrapper {
671
- display: flex;
672
- }
673
- .tablePane,
674
- .sandwichPane {
675
- flex: 1;
676
- }
677
- .sandwichPane .sandwichPaneInfo {
678
- display: inline-block;
679
- position: relative;
680
- margin: 30px 0 0 10px;
681
- padding: 8px;
682
- border-radius: 5px;
683
- background-color: var(--ps-sandwich-pane-info-bg);
684
- color: var(--ps-neutral-1);
685
- }
686
- .sandwichPane .sandwichPaneInfo.vertical {
687
- margin: 30px 0;
688
- }
689
- .sandwichPane .sandwichPaneInfo.vertical .arrow {
690
- top: initial;
691
- bottom: -15px;
692
- left: 20px;
693
- transform: rotate(-90deg);
694
- }
695
- .sandwichPane .sandwichPaneInfo .arrow {
696
- position: absolute;
697
- top: 14px;
698
- left: -20px;
699
- width: 0;
700
- height: 0;
701
- border-style: solid;
702
- border-width: 8px 20px 8px 0;
703
- border-color: transparent var(--ps-sandwich-pane-info-bg) transparent transparent;
704
- }
705
- .sandwichPane .sandwichTop {
706
- margin-bottom: 10px;
707
- }
708
- .sandwichPane .sandwichTop,
709
- .sandwichPane .sandwichBottom {
710
- display: flex;
711
- }
712
- .sandwichPane .sandwichTop .name,
713
- .sandwichPane .sandwichBottom .name {
714
- writing-mode: vertical-rl;
715
- transform: rotate(-180deg);
716
- padding: 5px 0;
717
- }
718
- .sandwichPane .sandwichBottom span {
719
- text-align: right;
720
- }
721
-
722
- /* src/FlameGraph/FlameGraphComponent/GraphVizPanel.module.scss */
723
- .graphVizPane {
724
- display: flex;
725
- flex: 1;
726
- }
727
- .graphVizPane.graphVizPane {
728
- margin-right: 0;
729
- border: 1px solid var(--ps-ui-border);
730
- }
731
- .graphVizPane div[id^=graphviz] {
732
- width: 100%;
733
- overflow: hidden;
734
- }
735
- .graphVizPane div[id^=graphviz] :global .graph > polygon {
736
- fill: none;
737
- }
738
- .graphVizPane div[id^=graphviz] :global .edge text[text-anchor=middle] {
739
- fill: var(--ps-toolbar-icon-color);
740
- }
741
-
742
- /* src/shims/Box.module.scss */
743
- .box,
744
- .collapseBox {
745
- background-color: var(--ps-ui-foreground);
746
- border: 1px solid var(--ps-ui-border);
747
- border-radius: 4px;
748
- position: relative;
749
- }
750
- .padding {
751
- margin-bottom: 10px;
752
- padding: 10px;
753
- }
754
- .collapseBox {
755
- margin-bottom: 10px;
756
- }
757
- .collapseBox .box,
758
- .collapseBox .collapseBox {
759
- background-color: transparent;
760
- border: none;
761
- border-radius: 0;
762
- padding-bottom: 0;
763
- height: auto;
764
- }
765
- .collapseBox .box.collapsedContent,
766
- .collapseBox .collapsedContent.collapseBox {
767
- height: 0;
768
- margin: 0;
769
- padding: 0;
770
- overflow: hidden;
771
- }
772
- .collapseTitle {
773
- font-weight: 500;
774
- font-size: 18px;
775
- cursor: pointer;
776
- padding: 5px 10px;
777
- display: flex;
778
- justify-content: space-between;
779
- align-items: center;
780
- height: 40px;
781
- }
782
- .collapseTitle:hover {
783
- background-color: var(--ps-ui-border);
784
- }
785
- .collapseIcon {
786
- display: flex;
787
- transition: transform 0.1s;
788
- }
789
- .collapseIcon.collapsed {
790
- transform: rotate(90deg);
791
- display: flex;
792
- }