@trycourier/react-designer 0.0.0-canary-20251113174211 → 0.0.0-canary-20251118122155
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.
- package/dist/cjs/index.js +61 -22452
- package/dist/cjs/index.js.map +4 -4
- package/dist/cjs/styles.css +53 -22
- package/dist/components/TemplateEditor/Channels/Email/Email.d.ts +2 -4
- package/dist/components/TemplateEditor/Channels/Email/SideBar/SideBar.d.ts +5 -2
- package/dist/components/TemplateEditor/Channels/Email/SideBar/SideBarSortableItemWrapper/SideBarSortableItemWrapper.d.ts +4 -18
- package/dist/components/TemplateEditor/Channels/MSTeams/MSTeams.d.ts +2 -1
- package/dist/components/TemplateEditor/Channels/MSTeams/MSTeamsEditor.d.ts +1 -1
- package/dist/components/TemplateEditor/Channels/MSTeams/SideBar/SideBar.d.ts +5 -2
- package/dist/components/TemplateEditor/Channels/Slack/SideBar/SideBar.d.ts +5 -2
- package/dist/components/TemplateEditor/Channels/Slack/Slack.d.ts +2 -1
- package/dist/components/TemplateEditor/Channels/Slack/SlackEditor.d.ts +1 -1
- package/dist/components/TemplateEditor/hooks/useEditorDnd.d.ts +12 -16
- package/dist/components/TemplateEditor/hooks/usePragmaticDnd.d.ts +21 -0
- package/dist/components/TemplateEditor/hooks/useSyncEditorItems.d.ts +2 -2
- package/dist/components/TemplateEditor/index.d.ts +0 -1
- package/dist/components/ui/DraggableItem/DraggableItem.d.ts +16 -0
- package/dist/components/ui/DraggableItem/index.d.ts +1 -0
- package/dist/components/ui/DropIndicatorPlaceholder/DropIndicatorPlaceholder.d.ts +5 -0
- package/dist/components/ui/DropIndicatorPlaceholder/index.d.ts +1 -0
- package/dist/components/ui/SortableItemWrapper/SortableItemWrapper.d.ts +5 -6
- package/dist/components/utils/multipleContainersKeyboardCoordinates.d.ts +1 -2
- package/dist/esm/index.js +61 -22464
- package/dist/esm/index.js.map +4 -4
- package/dist/esm/styles.css +53 -22
- package/dist/styles.css +53 -22
- package/package.json +6 -14
package/dist/esm/styles.css
CHANGED
|
@@ -1063,6 +1063,12 @@ body {
|
|
|
1063
1063
|
margin-top: 2rem;
|
|
1064
1064
|
margin-bottom: 2rem;
|
|
1065
1065
|
}
|
|
1066
|
+
.\!-courier-ml-2 {
|
|
1067
|
+
margin-left: -0.5rem !important;
|
|
1068
|
+
}
|
|
1069
|
+
.\!-courier-ml-4 {
|
|
1070
|
+
margin-left: -1rem !important;
|
|
1071
|
+
}
|
|
1066
1072
|
.\!courier-mr-auto {
|
|
1067
1073
|
margin-right: auto !important;
|
|
1068
1074
|
}
|
|
@@ -1087,6 +1093,9 @@ body {
|
|
|
1087
1093
|
.courier-ml-1\.5 {
|
|
1088
1094
|
margin-left: 0.375rem;
|
|
1089
1095
|
}
|
|
1096
|
+
.courier-ml-10 {
|
|
1097
|
+
margin-left: 2.5rem;
|
|
1098
|
+
}
|
|
1090
1099
|
.courier-ml-2 {
|
|
1091
1100
|
margin-left: 0.5rem;
|
|
1092
1101
|
}
|
|
@@ -1147,6 +1156,9 @@ body {
|
|
|
1147
1156
|
.courier-grid {
|
|
1148
1157
|
display: grid;
|
|
1149
1158
|
}
|
|
1159
|
+
.\!courier-hidden {
|
|
1160
|
+
display: none !important;
|
|
1161
|
+
}
|
|
1150
1162
|
.courier-hidden {
|
|
1151
1163
|
display: none;
|
|
1152
1164
|
}
|
|
@@ -1431,11 +1443,6 @@ body {
|
|
|
1431
1443
|
--tw-translate-y: -50%;
|
|
1432
1444
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
1433
1445
|
}
|
|
1434
|
-
.courier-scale-105 {
|
|
1435
|
-
--tw-scale-x: 1.05;
|
|
1436
|
-
--tw-scale-y: 1.05;
|
|
1437
|
-
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
1438
|
-
}
|
|
1439
1446
|
@keyframes courier-spin {
|
|
1440
1447
|
|
|
1441
1448
|
to {
|
|
@@ -1454,6 +1461,9 @@ body {
|
|
|
1454
1461
|
.courier-cursor-grab {
|
|
1455
1462
|
cursor: grab;
|
|
1456
1463
|
}
|
|
1464
|
+
.courier-cursor-grabbing {
|
|
1465
|
+
cursor: grabbing;
|
|
1466
|
+
}
|
|
1457
1467
|
.courier-cursor-not-allowed {
|
|
1458
1468
|
cursor: not-allowed;
|
|
1459
1469
|
}
|
|
@@ -2278,9 +2288,6 @@ body {
|
|
|
2278
2288
|
.courier-opacity-60 {
|
|
2279
2289
|
opacity: 0.6;
|
|
2280
2290
|
}
|
|
2281
|
-
.courier-opacity-90 {
|
|
2282
|
-
opacity: 0.9;
|
|
2283
|
-
}
|
|
2284
2291
|
.courier-opacity-\[0\.999\] {
|
|
2285
2292
|
opacity: 0.999;
|
|
2286
2293
|
}
|
|
@@ -2343,6 +2350,15 @@ body {
|
|
|
2343
2350
|
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
2344
2351
|
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
2345
2352
|
}
|
|
2353
|
+
.courier-ring-2 {
|
|
2354
|
+
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
2355
|
+
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
2356
|
+
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
2357
|
+
}
|
|
2358
|
+
.courier-ring-blue-500 {
|
|
2359
|
+
--tw-ring-opacity: 1;
|
|
2360
|
+
--tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));
|
|
2361
|
+
}
|
|
2346
2362
|
.courier-ring-offset-background {
|
|
2347
2363
|
--tw-ring-offset-color: var(--background);
|
|
2348
2364
|
}
|
|
@@ -2674,6 +2690,9 @@ body {
|
|
|
2674
2690
|
padding-left: 1rem;
|
|
2675
2691
|
padding-right: 1rem;
|
|
2676
2692
|
}
|
|
2693
|
+
.courier-sms-editor .ProseMirror > .react-renderer .draggable-item > div {
|
|
2694
|
+
padding-left: 0px;
|
|
2695
|
+
}
|
|
2677
2696
|
.courier-sms-editor .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before {
|
|
2678
2697
|
display: none;
|
|
2679
2698
|
}
|
|
@@ -2746,6 +2765,9 @@ body {
|
|
|
2746
2765
|
padding-left: 1rem;
|
|
2747
2766
|
padding-right: 1rem;
|
|
2748
2767
|
}
|
|
2768
|
+
.courier-push-editor .ProseMirror > .react-renderer .draggable-item > div {
|
|
2769
|
+
padding-left: 0px;
|
|
2770
|
+
}
|
|
2749
2771
|
.courier-push-editor .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .courier-push-editor .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before {
|
|
2750
2772
|
display: none;
|
|
2751
2773
|
}
|
|
@@ -2844,6 +2866,9 @@ body {
|
|
|
2844
2866
|
.courier-inbox-editor .ProseMirror > .react-renderer .draggable-item {
|
|
2845
2867
|
padding: 0px;
|
|
2846
2868
|
}
|
|
2869
|
+
.courier-inbox-editor .ProseMirror > .react-renderer .draggable-item > div {
|
|
2870
|
+
padding-left: 0px;
|
|
2871
|
+
}
|
|
2847
2872
|
.courier-inbox-editor .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .courier-inbox-editor .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .courier-inbox-editor .ProseMirror > .react-renderer.node-buttonRow .selected-element .node-element::before {
|
|
2848
2873
|
display: none;
|
|
2849
2874
|
}
|
|
@@ -3452,48 +3477,48 @@ body {
|
|
|
3452
3477
|
.ProseMirror > .react-renderer.node-customCode .node-element:focus-visible {
|
|
3453
3478
|
outline: none;
|
|
3454
3479
|
}
|
|
3455
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3480
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element, .ProseMirror > .react-renderer.node-button .selected-element .node-element, .ProseMirror > .react-renderer.node-divider .selected-element .node-element, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element, .ProseMirror > .react-renderer.node-heading .selected-element .node-element, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element, .ProseMirror > .react-renderer.node-column .selected-element .node-element, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element {
|
|
3456
3481
|
position: relative;
|
|
3457
3482
|
}
|
|
3458
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3483
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element, .ProseMirror > .react-renderer.node-button .selected-element .node-element, .ProseMirror > .react-renderer.node-divider .selected-element .node-element, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element, .ProseMirror > .react-renderer.node-heading .selected-element .node-element, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element, .ProseMirror > .react-renderer.node-column .selected-element .node-element, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element {
|
|
3459
3484
|
z-index: 20;
|
|
3460
3485
|
}
|
|
3461
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3486
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3462
3487
|
position: absolute;
|
|
3463
3488
|
}
|
|
3464
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3489
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3465
3490
|
left: -12px;
|
|
3466
3491
|
}
|
|
3467
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3492
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3468
3493
|
right: -12px;
|
|
3469
3494
|
}
|
|
3470
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3495
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3471
3496
|
top: 0px;
|
|
3472
3497
|
}
|
|
3473
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3498
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3474
3499
|
bottom: 0px;
|
|
3475
3500
|
}
|
|
3476
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3501
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3477
3502
|
z-index: -10;
|
|
3478
3503
|
}
|
|
3479
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3504
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3480
3505
|
border-radius: calc(var(--radius) - 2px);
|
|
3481
3506
|
}
|
|
3482
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3507
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3483
3508
|
border-width: 1px;
|
|
3484
3509
|
}
|
|
3485
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3510
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3486
3511
|
--tw-border-opacity: 1;
|
|
3487
3512
|
border-color: rgb(0 133 255 / var(--tw-border-opacity, 1));
|
|
3488
3513
|
}
|
|
3489
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3514
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3490
3515
|
--tw-content: '';
|
|
3491
3516
|
content: var(--tw-content);
|
|
3492
3517
|
}
|
|
3493
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3518
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element .node-element::before {
|
|
3494
3519
|
display: none;
|
|
3495
3520
|
}
|
|
3496
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3521
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-button .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-divider .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-paragraph .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-heading .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-blockquote .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-column .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-customCode .selected-element .courier-actions-panel {
|
|
3497
3522
|
display: block;
|
|
3498
3523
|
}
|
|
3499
3524
|
.ProseMirror > .react-renderer.node-blockquote {
|
|
@@ -3633,6 +3658,9 @@ body {
|
|
|
3633
3658
|
margin-top: 0.5rem;
|
|
3634
3659
|
margin-bottom: 0.5rem;
|
|
3635
3660
|
}
|
|
3661
|
+
.courier-slack-editor .ProseMirror > .react-renderer {
|
|
3662
|
+
margin-left: -0.5rem !important;
|
|
3663
|
+
}
|
|
3636
3664
|
.courier-slack-editor .ProseMirror > .react-renderer:first-child {
|
|
3637
3665
|
margin-top: 0px;
|
|
3638
3666
|
}
|
|
@@ -3792,6 +3820,9 @@ body {
|
|
|
3792
3820
|
margin-top: 0.5rem;
|
|
3793
3821
|
margin-bottom: 0.5rem;
|
|
3794
3822
|
}
|
|
3823
|
+
.courier-msteams-editor .ProseMirror > .react-renderer {
|
|
3824
|
+
margin-left: -1rem !important;
|
|
3825
|
+
}
|
|
3795
3826
|
.courier-msteams-editor .ProseMirror > .react-renderer:first-child {
|
|
3796
3827
|
margin-top: 0px;
|
|
3797
3828
|
}
|
package/dist/styles.css
CHANGED
|
@@ -1063,6 +1063,12 @@ body {
|
|
|
1063
1063
|
margin-top: 2rem;
|
|
1064
1064
|
margin-bottom: 2rem;
|
|
1065
1065
|
}
|
|
1066
|
+
.\!-courier-ml-2 {
|
|
1067
|
+
margin-left: -0.5rem !important;
|
|
1068
|
+
}
|
|
1069
|
+
.\!-courier-ml-4 {
|
|
1070
|
+
margin-left: -1rem !important;
|
|
1071
|
+
}
|
|
1066
1072
|
.\!courier-mr-auto {
|
|
1067
1073
|
margin-right: auto !important;
|
|
1068
1074
|
}
|
|
@@ -1087,6 +1093,9 @@ body {
|
|
|
1087
1093
|
.courier-ml-1\.5 {
|
|
1088
1094
|
margin-left: 0.375rem;
|
|
1089
1095
|
}
|
|
1096
|
+
.courier-ml-10 {
|
|
1097
|
+
margin-left: 2.5rem;
|
|
1098
|
+
}
|
|
1090
1099
|
.courier-ml-2 {
|
|
1091
1100
|
margin-left: 0.5rem;
|
|
1092
1101
|
}
|
|
@@ -1147,6 +1156,9 @@ body {
|
|
|
1147
1156
|
.courier-grid {
|
|
1148
1157
|
display: grid;
|
|
1149
1158
|
}
|
|
1159
|
+
.\!courier-hidden {
|
|
1160
|
+
display: none !important;
|
|
1161
|
+
}
|
|
1150
1162
|
.courier-hidden {
|
|
1151
1163
|
display: none;
|
|
1152
1164
|
}
|
|
@@ -1431,11 +1443,6 @@ body {
|
|
|
1431
1443
|
--tw-translate-y: -50%;
|
|
1432
1444
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
1433
1445
|
}
|
|
1434
|
-
.courier-scale-105 {
|
|
1435
|
-
--tw-scale-x: 1.05;
|
|
1436
|
-
--tw-scale-y: 1.05;
|
|
1437
|
-
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
1438
|
-
}
|
|
1439
1446
|
@keyframes courier-spin {
|
|
1440
1447
|
|
|
1441
1448
|
to {
|
|
@@ -1454,6 +1461,9 @@ body {
|
|
|
1454
1461
|
.courier-cursor-grab {
|
|
1455
1462
|
cursor: grab;
|
|
1456
1463
|
}
|
|
1464
|
+
.courier-cursor-grabbing {
|
|
1465
|
+
cursor: grabbing;
|
|
1466
|
+
}
|
|
1457
1467
|
.courier-cursor-not-allowed {
|
|
1458
1468
|
cursor: not-allowed;
|
|
1459
1469
|
}
|
|
@@ -2278,9 +2288,6 @@ body {
|
|
|
2278
2288
|
.courier-opacity-60 {
|
|
2279
2289
|
opacity: 0.6;
|
|
2280
2290
|
}
|
|
2281
|
-
.courier-opacity-90 {
|
|
2282
|
-
opacity: 0.9;
|
|
2283
|
-
}
|
|
2284
2291
|
.courier-opacity-\[0\.999\] {
|
|
2285
2292
|
opacity: 0.999;
|
|
2286
2293
|
}
|
|
@@ -2343,6 +2350,15 @@ body {
|
|
|
2343
2350
|
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
2344
2351
|
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
2345
2352
|
}
|
|
2353
|
+
.courier-ring-2 {
|
|
2354
|
+
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
2355
|
+
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
2356
|
+
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
2357
|
+
}
|
|
2358
|
+
.courier-ring-blue-500 {
|
|
2359
|
+
--tw-ring-opacity: 1;
|
|
2360
|
+
--tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));
|
|
2361
|
+
}
|
|
2346
2362
|
.courier-ring-offset-background {
|
|
2347
2363
|
--tw-ring-offset-color: var(--background);
|
|
2348
2364
|
}
|
|
@@ -2674,6 +2690,9 @@ body {
|
|
|
2674
2690
|
padding-left: 1rem;
|
|
2675
2691
|
padding-right: 1rem;
|
|
2676
2692
|
}
|
|
2693
|
+
.courier-sms-editor .ProseMirror > .react-renderer .draggable-item > div {
|
|
2694
|
+
padding-left: 0px;
|
|
2695
|
+
}
|
|
2677
2696
|
.courier-sms-editor .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before {
|
|
2678
2697
|
display: none;
|
|
2679
2698
|
}
|
|
@@ -2746,6 +2765,9 @@ body {
|
|
|
2746
2765
|
padding-left: 1rem;
|
|
2747
2766
|
padding-right: 1rem;
|
|
2748
2767
|
}
|
|
2768
|
+
.courier-push-editor .ProseMirror > .react-renderer .draggable-item > div {
|
|
2769
|
+
padding-left: 0px;
|
|
2770
|
+
}
|
|
2749
2771
|
.courier-push-editor .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .courier-push-editor .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before {
|
|
2750
2772
|
display: none;
|
|
2751
2773
|
}
|
|
@@ -2844,6 +2866,9 @@ body {
|
|
|
2844
2866
|
.courier-inbox-editor .ProseMirror > .react-renderer .draggable-item {
|
|
2845
2867
|
padding: 0px;
|
|
2846
2868
|
}
|
|
2869
|
+
.courier-inbox-editor .ProseMirror > .react-renderer .draggable-item > div {
|
|
2870
|
+
padding-left: 0px;
|
|
2871
|
+
}
|
|
2847
2872
|
.courier-inbox-editor .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .courier-inbox-editor .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .courier-inbox-editor .ProseMirror > .react-renderer.node-buttonRow .selected-element .node-element::before {
|
|
2848
2873
|
display: none;
|
|
2849
2874
|
}
|
|
@@ -3452,48 +3477,48 @@ body {
|
|
|
3452
3477
|
.ProseMirror > .react-renderer.node-customCode .node-element:focus-visible {
|
|
3453
3478
|
outline: none;
|
|
3454
3479
|
}
|
|
3455
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3480
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element, .ProseMirror > .react-renderer.node-button .selected-element .node-element, .ProseMirror > .react-renderer.node-divider .selected-element .node-element, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element, .ProseMirror > .react-renderer.node-heading .selected-element .node-element, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element, .ProseMirror > .react-renderer.node-column .selected-element .node-element, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element {
|
|
3456
3481
|
position: relative;
|
|
3457
3482
|
}
|
|
3458
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3483
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element, .ProseMirror > .react-renderer.node-button .selected-element .node-element, .ProseMirror > .react-renderer.node-divider .selected-element .node-element, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element, .ProseMirror > .react-renderer.node-heading .selected-element .node-element, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element, .ProseMirror > .react-renderer.node-column .selected-element .node-element, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element {
|
|
3459
3484
|
z-index: 20;
|
|
3460
3485
|
}
|
|
3461
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3486
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3462
3487
|
position: absolute;
|
|
3463
3488
|
}
|
|
3464
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3489
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3465
3490
|
left: -12px;
|
|
3466
3491
|
}
|
|
3467
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3492
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3468
3493
|
right: -12px;
|
|
3469
3494
|
}
|
|
3470
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3495
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3471
3496
|
top: 0px;
|
|
3472
3497
|
}
|
|
3473
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3498
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3474
3499
|
bottom: 0px;
|
|
3475
3500
|
}
|
|
3476
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3501
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3477
3502
|
z-index: -10;
|
|
3478
3503
|
}
|
|
3479
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3504
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3480
3505
|
border-radius: calc(var(--radius) - 2px);
|
|
3481
3506
|
}
|
|
3482
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3507
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3483
3508
|
border-width: 1px;
|
|
3484
3509
|
}
|
|
3485
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3510
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3486
3511
|
--tw-border-opacity: 1;
|
|
3487
3512
|
border-color: rgb(0 133 255 / var(--tw-border-opacity, 1));
|
|
3488
3513
|
}
|
|
3489
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3514
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element::before {
|
|
3490
3515
|
--tw-content: '';
|
|
3491
3516
|
content: var(--tw-content);
|
|
3492
3517
|
}
|
|
3493
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3518
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-button .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-divider .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-heading .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-blockquote .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-column .selected-element .node-element .node-element::before, .ProseMirror > .react-renderer.node-customCode .selected-element .node-element .node-element::before {
|
|
3494
3519
|
display: none;
|
|
3495
3520
|
}
|
|
3496
|
-
.ProseMirror > .react-renderer.node-imageBlock .selected-element
|
|
3521
|
+
.ProseMirror > .react-renderer.node-imageBlock .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-button .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-divider .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-paragraph .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-heading .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-blockquote .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-column .selected-element .courier-actions-panel, .ProseMirror > .react-renderer.node-customCode .selected-element .courier-actions-panel {
|
|
3497
3522
|
display: block;
|
|
3498
3523
|
}
|
|
3499
3524
|
.ProseMirror > .react-renderer.node-blockquote {
|
|
@@ -3633,6 +3658,9 @@ body {
|
|
|
3633
3658
|
margin-top: 0.5rem;
|
|
3634
3659
|
margin-bottom: 0.5rem;
|
|
3635
3660
|
}
|
|
3661
|
+
.courier-slack-editor .ProseMirror > .react-renderer {
|
|
3662
|
+
margin-left: -0.5rem !important;
|
|
3663
|
+
}
|
|
3636
3664
|
.courier-slack-editor .ProseMirror > .react-renderer:first-child {
|
|
3637
3665
|
margin-top: 0px;
|
|
3638
3666
|
}
|
|
@@ -3792,6 +3820,9 @@ body {
|
|
|
3792
3820
|
margin-top: 0.5rem;
|
|
3793
3821
|
margin-bottom: 0.5rem;
|
|
3794
3822
|
}
|
|
3823
|
+
.courier-msteams-editor .ProseMirror > .react-renderer {
|
|
3824
|
+
margin-left: -1rem !important;
|
|
3825
|
+
}
|
|
3795
3826
|
.courier-msteams-editor .ProseMirror > .react-renderer:first-child {
|
|
3796
3827
|
margin-top: 0px;
|
|
3797
3828
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@trycourier/react-designer",
|
|
3
|
-
"version": "0.0.0-canary-
|
|
3
|
+
"version": "0.0.0-canary-20251118122155",
|
|
4
4
|
"description": "React-based rich text designer component",
|
|
5
5
|
"main": "./dist/cjs/index.js",
|
|
6
6
|
"module": "./dist/esm/index.js",
|
|
@@ -35,8 +35,10 @@
|
|
|
35
35
|
}
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@
|
|
39
|
-
"@
|
|
38
|
+
"@atlaskit/pragmatic-drag-and-drop": "^1.7.7",
|
|
39
|
+
"@atlaskit/pragmatic-drag-and-drop-hitbox": "^1.1.0",
|
|
40
|
+
"@atlaskit/pragmatic-drag-and-drop-react-beautiful-dnd-autoscroll": "^2.0.1",
|
|
41
|
+
"@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^3.2.9",
|
|
40
42
|
"@hookform/resolvers": "^3.9.1",
|
|
41
43
|
"@monaco-editor/react": ">=4.0.0 <6.0.0",
|
|
42
44
|
"@radix-ui/react-alert-dialog": "^1.1.14",
|
|
@@ -106,17 +108,7 @@
|
|
|
106
108
|
},
|
|
107
109
|
"peerDependencies": {
|
|
108
110
|
"react": "^18.2.0 || ^19.0.0",
|
|
109
|
-
"react-dom": "^18.2.0 || ^19.0.0"
|
|
110
|
-
"@dnd-kit/core": "^6.3.1",
|
|
111
|
-
"@dnd-kit/sortable": "^10.0.0"
|
|
112
|
-
},
|
|
113
|
-
"peerDependenciesMeta": {
|
|
114
|
-
"@dnd-kit/core": {
|
|
115
|
-
"optional": false
|
|
116
|
-
},
|
|
117
|
-
"@dnd-kit/sortable": {
|
|
118
|
-
"optional": false
|
|
119
|
-
}
|
|
111
|
+
"react-dom": "^18.2.0 || ^19.0.0"
|
|
120
112
|
},
|
|
121
113
|
"type": "module",
|
|
122
114
|
"files": [
|