@weavy/uikit-react 12.1.0 → 13.0.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 (86) hide show
  1. package/changelog.md +36 -0
  2. package/dist/cjs/index.js +28 -6
  3. package/dist/cjs/index.js.map +1 -1
  4. package/dist/cjs/types/client/WeavyClient.d.ts +8 -1
  5. package/dist/cjs/types/components/Attachment.d.ts +2 -1
  6. package/dist/cjs/types/components/Chat.d.ts +1 -1
  7. package/dist/cjs/types/components/PdfViewer.d.ts +3 -1
  8. package/dist/cjs/types/components/Preview.d.ts +8 -10
  9. package/dist/cjs/types/contexts/PreviewContext.d.ts +2 -1
  10. package/dist/cjs/types/contexts/WeavyContext.d.ts +2 -3
  11. package/dist/cjs/types/types/Chat.d.ts +1 -1
  12. package/dist/cjs/types/types/types.d.ts +16 -5
  13. package/dist/cjs/types/ui/Spinner.d.ts +9 -0
  14. package/dist/cjs/types/utils/fileUtilities.d.ts +1 -4
  15. package/dist/css/weavy-chat.css +270 -94
  16. package/dist/css/weavy-messenger.css +274 -96
  17. package/dist/css/weavy.css +274 -96
  18. package/dist/esm/index.js +28 -6
  19. package/dist/esm/index.js.map +1 -1
  20. package/dist/esm/types/client/WeavyClient.d.ts +8 -1
  21. package/dist/esm/types/components/Attachment.d.ts +2 -1
  22. package/dist/esm/types/components/Chat.d.ts +1 -1
  23. package/dist/esm/types/components/PdfViewer.d.ts +3 -1
  24. package/dist/esm/types/components/Preview.d.ts +8 -10
  25. package/dist/esm/types/contexts/PreviewContext.d.ts +2 -1
  26. package/dist/esm/types/contexts/WeavyContext.d.ts +2 -3
  27. package/dist/esm/types/types/Chat.d.ts +1 -1
  28. package/dist/esm/types/types/types.d.ts +16 -5
  29. package/dist/esm/types/ui/Spinner.d.ts +9 -0
  30. package/dist/esm/types/utils/fileUtilities.d.ts +1 -4
  31. package/dist/index.d.ts +14 -7
  32. package/package.json +2 -2
  33. package/rollup.config.js +3 -1
  34. package/src/client/WeavyClient.ts +105 -24
  35. package/src/components/Attachment.tsx +8 -7
  36. package/src/components/Chat.tsx +3 -3
  37. package/src/components/Conversation.tsx +3 -3
  38. package/src/components/Message.tsx +1 -1
  39. package/src/components/Messages.tsx +1 -1
  40. package/src/components/PdfViewer.tsx +88 -83
  41. package/src/components/Preview.tsx +115 -54
  42. package/src/components/SearchUsers.tsx +2 -2
  43. package/src/contexts/PreviewContext.tsx +90 -16
  44. package/src/contexts/WeavyContext.tsx +7 -4
  45. package/src/hooks/useBadge.ts +2 -6
  46. package/src/hooks/useChat.ts +3 -14
  47. package/src/hooks/useConversation.ts +1 -7
  48. package/src/hooks/useConversations.ts +1 -7
  49. package/src/hooks/useFileUploader.ts +6 -8
  50. package/src/hooks/useMembers.ts +1 -7
  51. package/src/hooks/useMessages.ts +1 -7
  52. package/src/hooks/useMutateChat.ts +6 -11
  53. package/src/hooks/useMutateConversation.ts +7 -10
  54. package/src/hooks/useMutateConversationName.ts +10 -12
  55. package/src/hooks/useMutateDeleteReaction.ts +3 -8
  56. package/src/hooks/useMutateExternalBlobs.ts +6 -11
  57. package/src/hooks/useMutateMeeting.ts +6 -11
  58. package/src/hooks/useMutateMembers.ts +8 -13
  59. package/src/hooks/useMutateMessage.ts +10 -15
  60. package/src/hooks/useMutatePinned.ts +3 -8
  61. package/src/hooks/useMutateReaction.ts +6 -12
  62. package/src/hooks/useMutateRead.ts +1 -10
  63. package/src/hooks/useMutateRemoveMembers.ts +7 -12
  64. package/src/hooks/useMutateTyping.ts +6 -11
  65. package/src/hooks/useSearchUsers.ts +1 -6
  66. package/src/hooks/useUser.ts +3 -14
  67. package/src/scss/theme/_appbar.scss +4 -2
  68. package/src/scss/theme/_cm-editor.scss +1 -1
  69. package/src/scss/theme/_code-vscode-dark.scss +184 -0
  70. package/src/scss/theme/_code-vscode-light.scss +179 -0
  71. package/src/scss/theme/_code.scss +9 -112
  72. package/src/scss/theme/_files.scss +1 -1
  73. package/src/scss/theme/_message-editor.scss +1 -1
  74. package/src/scss/theme/_overlays.scss +2 -2
  75. package/src/scss/theme/_panels.scss +11 -7
  76. package/src/scss/theme/_preview-code.scss +5 -0
  77. package/src/scss/theme/_preview-embed.scss +3 -3
  78. package/src/scss/theme/_preview-image.scss +1 -1
  79. package/src/scss/theme/_preview-text.scss +1 -1
  80. package/src/scss/theme/_preview.scss +7 -2
  81. package/src/scss/weavy-chat.scss +1 -0
  82. package/src/scss/weavy-messenger.scss +1 -0
  83. package/src/types/Chat.ts +1 -1
  84. package/src/types/types.ts +16 -5
  85. package/src/ui/Spinner.tsx +18 -0
  86. package/src/utils/fileUtilities.ts +11 -125
@@ -495,105 +495,270 @@
495
495
  gap: 0.5rem;
496
496
  }
497
497
 
498
- code[class*=language-], pre[class*=language-] {
499
- font-family: var(--wy-font-monospace);
500
- font-size: 1em;
501
- direction: ltr;
498
+ :not(.wy-dark) .wy-code, .wy-code:not(.wy-dark) {
499
+ /*pre[class*="language-"]::-moz-selection,
500
+ pre[class*="language-"] ::-moz-selection,
501
+ code[class*="language-"]::-moz-selection,
502
+ code[class*="language-"] ::-moz-selection {
503
+ text-shadow: none;
504
+ background: #ffffff;
505
+ }
506
+
507
+ pre[class*="language-"]::selection,
508
+ pre[class*="language-"] ::selection,
509
+ code[class*="language-"]::selection,
510
+ code[class*="language-"] ::selection {
511
+ text-shadow: none;
512
+ background: #ffffff;
513
+ }*/
514
+ /* Code blocks */
515
+ }
516
+ :not(.wy-dark) .wy-code code[class*=language-],
517
+ :not(.wy-dark) .wy-code pre[class*=language-], .wy-code:not(.wy-dark) code[class*=language-],
518
+ .wy-code:not(.wy-dark) pre[class*=language-] {
519
+ color: #000000;
520
+ font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
502
521
  text-align: left;
503
522
  white-space: pre;
504
523
  word-spacing: normal;
505
524
  word-break: normal;
525
+ word-wrap: normal;
506
526
  line-height: 1.5;
527
+ -moz-tab-size: 4;
528
+ -o-tab-size: 4;
507
529
  tab-size: 4;
530
+ -webkit-hyphens: none;
531
+ -moz-hyphens: none;
532
+ -ms-hyphens: none;
508
533
  hyphens: none;
509
534
  }
510
-
511
- pre[class*=language-] {
512
- background: #fff;
513
- font-size: 0.875em;
514
- padding: 1rem;
515
- margin: 0.5rem 0;
535
+ @media print {
536
+ :not(.wy-dark) .wy-code code[class*=language-],
537
+ :not(.wy-dark) .wy-code pre[class*=language-], .wy-code:not(.wy-dark) code[class*=language-],
538
+ .wy-code:not(.wy-dark) pre[class*=language-] {
539
+ text-shadow: none;
540
+ }
541
+ }
542
+ :not(.wy-dark) .wy-code pre[class*=language-], .wy-code:not(.wy-dark) pre[class*=language-] {
543
+ padding: 1em;
544
+ margin: 0.5em 0;
516
545
  overflow: auto;
517
546
  }
518
-
519
- .token.comment,
520
- .token.prolog,
521
- .token.doctype,
522
- .token.cdata {
547
+ :not(.wy-dark) .wy-code :not(pre) > code[class*=language-],
548
+ :not(.wy-dark) .wy-code pre[class*=language-], .wy-code:not(.wy-dark) :not(pre) > code[class*=language-],
549
+ .wy-code:not(.wy-dark) pre[class*=language-] {
550
+ color: white;
551
+ background: #ffffff;
552
+ }
553
+ :not(.wy-dark) .wy-code :not(pre) > code[class*=language-], .wy-code:not(.wy-dark) :not(pre) > code[class*=language-] {
554
+ padding: 0.1em;
555
+ border-radius: 0.3em;
556
+ white-space: normal;
557
+ }
558
+ :not(.wy-dark) .wy-code .token.comment, .wy-code:not(.wy-dark) .token.comment {
523
559
  color: #008000;
524
- font-style: italic;
525
560
  }
526
-
527
- .token.namespace {
528
- opacity: 0.7;
561
+ :not(.wy-dark) .wy-code .token.builtin, .wy-code:not(.wy-dark) .token.builtin {
562
+ color: #0070C1;
529
563
  }
530
-
531
- .token.string {
564
+ :not(.wy-dark) .wy-code .token.number, .wy-code:not(.wy-dark) .token.number {
565
+ color: #098658;
566
+ }
567
+ :not(.wy-dark) .wy-code .token.variable, .wy-code:not(.wy-dark) .token.variable {
568
+ color: #098658;
569
+ }
570
+ :not(.wy-dark) .wy-code .token.inserted, .wy-code:not(.wy-dark) .token.inserted {
571
+ color: #098658;
572
+ }
573
+ :not(.wy-dark) .wy-code .token.operator, .wy-code:not(.wy-dark) .token.operator {
574
+ color: #000000;
575
+ }
576
+ :not(.wy-dark) .wy-code .token.constant, .wy-code:not(.wy-dark) .token.constant {
577
+ color: #811F3F;
578
+ }
579
+ :not(.wy-dark) .wy-code .token.hexcode, .wy-code:not(.wy-dark) .token.hexcode {
580
+ color: #811F3F;
581
+ }
582
+ :not(.wy-dark) .wy-code .token.regex, .wy-code:not(.wy-dark) .token.regex {
583
+ color: #811F3F;
584
+ }
585
+ :not(.wy-dark) .wy-code .token.char, .wy-code:not(.wy-dark) .token.char {
586
+ color: #811F3F;
587
+ }
588
+ :not(.wy-dark) .wy-code .token.tag, .wy-code:not(.wy-dark) .token.tag {
589
+ color: #800000;
590
+ }
591
+ :not(.wy-dark) .wy-code .token.attr-name, .wy-code:not(.wy-dark) .token.attr-name {
592
+ color: #FF0000;
593
+ }
594
+ :not(.wy-dark) .wy-code .token.selector, .wy-code:not(.wy-dark) .token.selector {
595
+ color: #FF0000;
596
+ }
597
+ :not(.wy-dark) .wy-code .token.property, .wy-code:not(.wy-dark) .token.property {
598
+ color: #FF0000;
599
+ }
600
+ :not(.wy-dark) .wy-code .token.deleted, .wy-code:not(.wy-dark) .token.deleted {
532
601
  color: #A31515;
533
602
  }
534
-
535
- .token.url,
536
- .token.symbol,
537
- .token.number,
538
- .token.boolean,
539
- .token.variable,
540
- .token.constant,
541
- .token.inserted {
542
- color: #36acaa;
603
+ :not(.wy-dark) .wy-code .token.string, .wy-code:not(.wy-dark) .token.string {
604
+ color: #A31515;
543
605
  }
544
-
545
- .token.atrule,
546
- .token.keyword,
547
- .token.attr-value,
548
- .language-autohotkey .token.selector,
549
- .language-json .token.boolean,
550
- .language-json .token.number,
551
- code[class*=language-css] {
552
- color: #0000ff;
606
+ :not(.wy-dark) .wy-code .token.changed, .wy-code:not(.wy-dark) .token.changed {
607
+ color: #0451A5;
553
608
  }
554
-
555
- .token.deleted,
556
- .language-autohotkey .token.tag {
557
- color: #9a050f;
609
+ :not(.wy-dark) .wy-code .token.punctuation, .wy-code:not(.wy-dark) .token.punctuation {
610
+ color: #0451A5;
558
611
  }
559
-
560
- .token.selector,
561
- .language-autohotkey .token.keyword {
562
- color: #00009f;
612
+ :not(.wy-dark) .wy-code .token.function, .wy-code:not(.wy-dark) .token.function {
613
+ color: #0000FF;
563
614
  }
564
-
565
- .token.important {
566
- color: #e90;
615
+ :not(.wy-dark) .wy-code .token.keyword, .wy-code:not(.wy-dark) .token.keyword {
616
+ color: #0000FF;
567
617
  }
568
-
569
- .token.important,
570
- .token.bold {
571
- font-weight: 700;
618
+ :not(.wy-dark) .wy-code .token.class-name, .wy-code:not(.wy-dark) .token.class-name {
619
+ color: #267F99;
572
620
  }
573
-
574
- .token.italic {
621
+ :not(.wy-dark) .wy-code .token.important,
622
+ :not(.wy-dark) .wy-code .token.bold, .wy-code:not(.wy-dark) .token.important,
623
+ .wy-code:not(.wy-dark) .token.bold {
624
+ font-weight: bold;
625
+ }
626
+ :not(.wy-dark) .wy-code .token.italic, .wy-code:not(.wy-dark) .token.italic {
575
627
  font-style: italic;
576
628
  }
629
+ .wy-dark .wy-code, .wy-code.wy-dark {
630
+ /*pre[class*="language-"]::-moz-selection,
631
+ pre[class*="language-"] ::-moz-selection,
632
+ code[class*="language-"]::-moz-selection,
633
+ code[class*="language-"] ::-moz-selection {
634
+ text-shadow: none;
635
+ background: #1e1e1e;
636
+ }
577
637
 
578
- .token.class-name,
579
- .language-json .token.property {
580
- color: #2B91AF;
638
+ pre[class*="language-"]::selection,
639
+ pre[class*="language-"] ::selection,
640
+ code[class*="language-"]::selection,
641
+ code[class*="language-"] ::selection {
642
+ text-shadow: none;
643
+ background: #1e1e1e;
644
+ }*/
645
+ /* Code blocks */
646
+ }
647
+ .wy-dark .wy-code code[class*=language-],
648
+ .wy-dark .wy-code pre[class*=language-], .wy-code.wy-dark code[class*=language-],
649
+ .wy-code.wy-dark pre[class*=language-] {
650
+ color: #d4d4d4;
651
+ font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
652
+ text-align: left;
653
+ white-space: pre;
654
+ word-spacing: normal;
655
+ word-break: normal;
656
+ word-wrap: normal;
657
+ line-height: 1.5;
658
+ -moz-tab-size: 4;
659
+ -o-tab-size: 4;
660
+ tab-size: 4;
661
+ -webkit-hyphens: none;
662
+ -moz-hyphens: none;
663
+ -ms-hyphens: none;
664
+ hyphens: none;
581
665
  }
582
-
583
- .token.tag,
584
- .token.selector {
585
- color: #800000;
666
+ @media print {
667
+ .wy-dark .wy-code code[class*=language-],
668
+ .wy-dark .wy-code pre[class*=language-], .wy-code.wy-dark code[class*=language-],
669
+ .wy-code.wy-dark pre[class*=language-] {
670
+ text-shadow: none;
671
+ }
586
672
  }
587
-
588
- .token.attr-name,
589
- .token.property,
590
- .token.regex,
591
- .token.entity {
592
- color: #ff0000;
673
+ .wy-dark .wy-code pre[class*=language-], .wy-code.wy-dark pre[class*=language-] {
674
+ padding: 1em;
675
+ margin: 0.5em 0;
676
+ overflow: auto;
593
677
  }
594
-
595
- .token.directive.tag .tag {
596
- background: #ffff00;
678
+ .wy-dark .wy-code :not(pre) > code[class*=language-],
679
+ .wy-dark .wy-code pre[class*=language-], .wy-code.wy-dark :not(pre) > code[class*=language-],
680
+ .wy-code.wy-dark pre[class*=language-] {
681
+ color: white;
682
+ background: #1e1e1e;
683
+ }
684
+ .wy-dark .wy-code :not(pre) > code[class*=language-], .wy-code.wy-dark :not(pre) > code[class*=language-] {
685
+ padding: 0.1em;
686
+ border-radius: 0.3em;
687
+ white-space: normal;
688
+ }
689
+ .wy-dark .wy-code .token.prolog, .wy-code.wy-dark .token.prolog {
690
+ color: #8080ff;
691
+ }
692
+ .wy-dark .wy-code .token.comment, .wy-code.wy-dark .token.comment {
693
+ color: #6A9955;
694
+ }
695
+ .wy-dark .wy-code .token.punctuation, .wy-code.wy-dark .token.punctuation {
696
+ color: #6A9955;
697
+ }
698
+ .wy-dark .wy-code .token.builtin, .wy-code.wy-dark .token.builtin {
699
+ color: #4FC1FF;
700
+ }
701
+ .wy-dark .wy-code .token.number, .wy-code.wy-dark .token.number {
702
+ color: #B5CEA8;
703
+ }
704
+ .wy-dark .wy-code .token.variable, .wy-code.wy-dark .token.variable {
705
+ color: #B5CEA8;
706
+ }
707
+ .wy-dark .wy-code .token.inserted, .wy-code.wy-dark .token.inserted {
708
+ color: #B5CEA8;
709
+ }
710
+ .wy-dark .wy-code .token.operator, .wy-code.wy-dark .token.operator {
711
+ color: #D4D4D4;
712
+ }
713
+ .wy-dark .wy-code .token.constant, .wy-code.wy-dark .token.constant {
714
+ color: #646695;
715
+ }
716
+ .wy-dark .wy-code .token.hexcode, .wy-code.wy-dark .token.hexcode {
717
+ color: #646695;
718
+ }
719
+ .wy-dark .wy-code .token.tag, .wy-code.wy-dark .token.tag {
720
+ color: #569CD6;
721
+ }
722
+ .wy-dark .wy-code .token.changed, .wy-code.wy-dark .token.changed {
723
+ color: #569CD6;
724
+ }
725
+ .wy-dark .wy-code .token.function, .wy-code.wy-dark .token.function {
726
+ color: #569CD6;
727
+ }
728
+ .wy-dark .wy-code .token.keyword, .wy-code.wy-dark .token.keyword {
729
+ color: #569CD6;
730
+ }
731
+ .wy-dark .wy-code .token.attr-name, .wy-code.wy-dark .token.attr-name {
732
+ color: #9CDCFE;
733
+ }
734
+ .wy-dark .wy-code .token.selector, .wy-code.wy-dark .token.selector {
735
+ color: #9CDCFE;
736
+ }
737
+ .wy-dark .wy-code .token.property, .wy-code.wy-dark .token.property {
738
+ color: #9CDCFE;
739
+ }
740
+ .wy-dark .wy-code .token.deleted, .wy-code.wy-dark .token.deleted {
741
+ color: #CE9178;
742
+ }
743
+ .wy-dark .wy-code .token.string, .wy-code.wy-dark .token.string {
744
+ color: #CE9178;
745
+ }
746
+ .wy-dark .wy-code .token.regex, .wy-code.wy-dark .token.regex {
747
+ color: #D16969;
748
+ }
749
+ .wy-dark .wy-code .token.char, .wy-code.wy-dark .token.char {
750
+ color: #D16969;
751
+ }
752
+ .wy-dark .wy-code .token.class-name, .wy-code.wy-dark .token.class-name {
753
+ color: #4EC9B0;
754
+ }
755
+ .wy-dark .wy-code .token.important,
756
+ .wy-dark .wy-code .token.bold, .wy-code.wy-dark .token.important,
757
+ .wy-code.wy-dark .token.bold {
758
+ font-weight: bold;
759
+ }
760
+ .wy-dark .wy-code .token.italic, .wy-code.wy-dark .token.italic {
761
+ font-style: italic;
597
762
  }
598
763
 
599
764
  .wy-hashtag {
@@ -1182,7 +1347,7 @@ code[class*=language-css] {
1182
1347
  .wy-message-form.wy-uploading .wy-spinner {
1183
1348
  display: block;
1184
1349
  }
1185
- .wy-message-form.wy-uploading .wy-icon-attachment {
1350
+ .wy-message-form.wy-uploading [data-icon=plus] {
1186
1351
  display: none;
1187
1352
  }
1188
1353
  .wy-message-form .wy-picker-list:not(:empty) {
@@ -1325,9 +1490,9 @@ code[class*=language-css] {
1325
1490
  color: #fff;
1326
1491
  }
1327
1492
  .wy-overlays .wy-panel.wy-dark.wy-open[data-title]::before {
1328
- background: rgba(41, 41, 41, 0.95);
1493
+ background-color: rgba(41, 41, 41, 0.95);
1329
1494
  color: rgba(255, 255, 255, 0.62);
1330
- border-bottom: 1px #000 solid;
1495
+ box-shadow: rgba(71, 71, 71, 0.95) 0px -1px 0px 0px inset;
1331
1496
  }
1332
1497
  @media (min-width: 768px) {
1333
1498
  .wy-overlays .wy-panel.wy-floating {
@@ -1429,8 +1594,8 @@ tr.wy-pager td .wy-spinner {
1429
1594
  flex-direction: column;
1430
1595
  }
1431
1596
  .wy-panel .wy-controls {
1432
- top: 0.5rem;
1433
- left: 0.5rem;
1597
+ top: 0.75rem;
1598
+ left: 0.75rem;
1434
1599
  min-width: 2rem;
1435
1600
  width: auto;
1436
1601
  display: flex;
@@ -1463,19 +1628,20 @@ tr.wy-pager td .wy-spinner {
1463
1628
  top: 0;
1464
1629
  left: 0;
1465
1630
  right: 0;
1466
- height: 2.9375rem;
1631
+ height: 3rem;
1632
+ padding: 0.5rem 0.5rem;
1467
1633
  opacity: 0;
1468
1634
  pointer-events: none;
1469
1635
  display: flex;
1470
1636
  align-items: center;
1471
1637
  justify-content: center;
1472
- background-color: rgba(242, 242, 242, 0.95);
1473
- color: rgba(0, 0, 0, 0.69);
1474
- border-bottom: 1px solid #cccccc;
1475
1638
  transition: opacity 0.1s 0.2s step-end;
1476
- font-family: var(--wy-font-sans-serif);
1639
+ font-family: var(--wy-font-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica Neue, Noto Sans, Liberation Sans, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji);
1477
1640
  line-height: 1.5;
1478
1641
  font-weight: 400;
1642
+ background-color: rgba(242, 242, 242, 0.95);
1643
+ color: rgba(0, 0, 0, 0.69);
1644
+ box-shadow: rgba(204, 204, 204, 0.95) 0px -1px 0px 0px inset;
1479
1645
  backface-visibility: hidden;
1480
1646
  }
1481
1647
  @supports (backdrop-filter: blur(0.5rem)) {
@@ -1565,6 +1731,10 @@ tr.wy-pager td .wy-spinner {
1565
1731
  justify-content: center;
1566
1732
  height: calc(100% - 3rem - 1px);
1567
1733
  position: relative;
1734
+ background-color: #fff;
1735
+ }
1736
+ .wy-dark .wy-preview, .wy-preview.wy-dark {
1737
+ background-color: #292929;
1568
1738
  }
1569
1739
 
1570
1740
  .wy-nav-prev, .wy-nav-next {
@@ -1599,7 +1769,7 @@ tr.wy-pager td .wy-spinner {
1599
1769
  .wy-document {
1600
1770
  padding: 3rem 4rem;
1601
1771
  margin: 2rem 3.5rem;
1602
- border-radius: 0.25rem;
1772
+ border-radius: 0.125rem;
1603
1773
  box-shadow: 0 0.25rem 0.3125rem 0 rgba(0, 0, 0, 0.14), 0 0.0625rem 0.625rem 0 rgba(0, 0, 0, 0.12), 0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.2);
1604
1774
  width: 120ch;
1605
1775
  min-height: 170ch;
@@ -1638,14 +1808,14 @@ tr.wy-pager td .wy-spinner {
1638
1808
  backdrop-filter: blur(0.5rem);
1639
1809
  }
1640
1810
  }
1641
- .wy-dark .wy-tools, .wy-tools.wy-dark {
1811
+ .wy-dark .wy-tools {
1642
1812
  background-color: rgba(41, 41, 41, 0.95);
1643
1813
  color: rgba(255, 255, 255, 0.62);
1644
1814
  }
1645
- .wy-dark .wy-tools .wy-icon, .wy-tools.wy-dark .wy-icon {
1815
+ .wy-dark .wy-tools .wy-icon {
1646
1816
  color: rgba(255, 255, 255, 0.62);
1647
1817
  }
1648
- .wy-dark .wy-tools .wy-input, .wy-tools.wy-dark .wy-input {
1818
+ .wy-dark .wy-tools .wy-input {
1649
1819
  background-color: rgba(0, 0, 0, 0.5);
1650
1820
  color: rgba(255, 255, 255, 0.62);
1651
1821
  }
@@ -1656,32 +1826,38 @@ tr.wy-pager td .wy-spinner {
1656
1826
  margin: 0 0.5rem;
1657
1827
  }
1658
1828
 
1659
- .wy-content-iframe, [data-controller~=embed] {
1829
+ .wy-content-code {
1830
+ align-self: flex-start;
1831
+ width: 100%;
1832
+ padding: 1rem 3rem;
1833
+ }
1834
+
1835
+ .wy-content-iframe {
1660
1836
  border: 0;
1661
1837
  display: block;
1662
1838
  width: 100%;
1663
1839
  height: 100%;
1664
1840
  flex: 1 1 100%;
1665
1841
  }
1666
- .wy-content-iframe:not(.wy-loading):not([data-controller~=embed]), .wy-content-iframe[data-controller~=embed].wy-loaded, [data-controller~=embed]:not(.wy-loading):not([data-controller~=embed]), [data-controller~=embed][data-controller~=embed].wy-loaded {
1842
+ .wy-content-iframe.wy-loaded {
1667
1843
  background: #fff;
1668
1844
  }
1669
- .wy-content-iframe:not(.wy-loading):not([data-controller~=embed]) ~ .wy-content-iframe-fallback, .wy-content-iframe:not(.wy-loading):not([data-controller~=embed]) ~ .wy-spinner, .wy-content-iframe[data-controller~=embed].wy-loaded ~ .wy-content-iframe-fallback, .wy-content-iframe[data-controller~=embed].wy-loaded ~ .wy-spinner, [data-controller~=embed]:not(.wy-loading):not([data-controller~=embed]) ~ .wy-content-iframe-fallback, [data-controller~=embed]:not(.wy-loading):not([data-controller~=embed]) ~ .wy-spinner, [data-controller~=embed][data-controller~=embed].wy-loaded ~ .wy-content-iframe-fallback, [data-controller~=embed][data-controller~=embed].wy-loaded ~ .wy-spinner {
1845
+ .wy-content-iframe.wy-loaded ~ .wy-content-iframe-fallback, .wy-content-iframe.wy-loaded ~ .wy-spinner {
1670
1846
  display: none;
1671
1847
  }
1672
- .wy-content-iframe.wy-loading:not(.wy-loaded), .wy-content-iframe[data-controller~=embed]:not(.wy-loaded), [data-controller~=embed].wy-loading:not(.wy-loaded), [data-controller~=embed][data-controller~=embed]:not(.wy-loaded) {
1848
+ .wy-content-iframe.wy-loading:not(.wy-loaded) {
1673
1849
  position: absolute;
1674
1850
  visibility: hidden;
1675
1851
  z-index: -1;
1676
1852
  pointer-events: none;
1677
1853
  }
1678
- .wy-content-iframe.wy-loading:not(.wy-loaded):not(.wy-fallback) ~ .wy-content-iframe-fallback, .wy-content-iframe[data-controller~=embed]:not(.wy-loaded):not(.wy-fallback) ~ .wy-content-iframe-fallback, [data-controller~=embed].wy-loading:not(.wy-loaded):not(.wy-fallback) ~ .wy-content-iframe-fallback, [data-controller~=embed][data-controller~=embed]:not(.wy-loaded):not(.wy-fallback) ~ .wy-content-iframe-fallback {
1854
+ .wy-content-iframe.wy-loading:not(.wy-loaded):not(.wy-fallback) ~ .wy-content-iframe-fallback {
1679
1855
  display: none;
1680
1856
  }
1681
- .wy-content-iframe.wy-loading:not(.wy-loaded).wy-fallback ~ .wy-spinner, .wy-content-iframe[data-controller~=embed]:not(.wy-loaded).wy-fallback ~ .wy-spinner, [data-controller~=embed].wy-loading:not(.wy-loaded).wy-fallback ~ .wy-spinner, [data-controller~=embed][data-controller~=embed]:not(.wy-loaded).wy-fallback ~ .wy-spinner {
1857
+ .wy-content-iframe.wy-loading:not(.wy-loaded).wy-fallback ~ .wy-spinner {
1682
1858
  display: none;
1683
1859
  }
1684
- .wy-content-iframe ~ .wy-spinner, [data-controller~=embed] ~ .wy-spinner {
1860
+ .wy-content-iframe ~ .wy-spinner {
1685
1861
  margin: auto;
1686
1862
  }
1687
1863
 
@@ -1733,7 +1909,7 @@ tr.wy-pager td .wy-spinner {
1733
1909
  .wy-content-image:not(.wy-intrinsic-image) {
1734
1910
  height: 100%;
1735
1911
  width: 100%;
1736
- --max-width: min(calc((100vh - 3rem - 1px) * (var(--width) / var(--height))), calc(var(--width) * 1px), 100%);
1912
+ --max-width: min(calc((100vh - 3rem) * (var(--width) / var(--height))), calc(var(--width) * 1px), 100%);
1737
1913
  --max-height: min(calc(100vw * (var(--height) / var(--width))), calc(var(--height) * 1px), 100%);
1738
1914
  /* // With sidebar
1739
1915
  body.controller-content & {
@@ -2715,6 +2891,8 @@ svg.wy-spinner.wy-spin circle {
2715
2891
  flex: 0 0 3rem;
2716
2892
  grid-template-columns: minmax(2rem, max-content) minmax(0, max-content) minmax(2rem, max-content);
2717
2893
  column-gap: 0.5rem;
2894
+ font-family: var(--wy-font-sans-serif);
2895
+ line-height: 1.5;
2718
2896
  backface-visibility: hidden;
2719
2897
  }
2720
2898
  @supports (backdrop-filter: blur(0.5rem)) {
@@ -2751,12 +2929,12 @@ svg.wy-spinner.wy-spin circle {
2751
2929
  .wy-appbar, .wy-light .wy-appbar, .wy-appbar.wy-light {
2752
2930
  background-color: rgba(242, 242, 242, 0.95);
2753
2931
  color: rgba(0, 0, 0, 0.69);
2754
- border-bottom: 1px solid rgba(204, 204, 204, 0.95);
2932
+ box-shadow: rgba(204, 204, 204, 0.95) 0px -1px 0px 0px inset;
2755
2933
  }
2756
2934
  .wy-dark .wy-appbar, .wy-appbar.wy-dark {
2757
2935
  background-color: rgba(41, 41, 41, 0.95);
2758
2936
  color: rgba(255, 255, 255, 0.62);
2759
- border-bottom: 1px solid rgba(71, 71, 71, 0.95);
2937
+ box-shadow: rgba(71, 71, 71, 0.95) 0px -1px 0px 0px inset;
2760
2938
  }
2761
2939
 
2762
2940
  .wy-footerbars {