@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/cjs/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
|
}
|
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
import type { TiptapDoc } from "@/lib/utils";
|
|
2
2
|
import type { ChannelType } from "@/store";
|
|
3
3
|
import type { ElementalNode } from "@/types/elemental.types";
|
|
4
|
-
import type { UniqueIdentifier } from "@dnd-kit/core";
|
|
5
|
-
import type { SortingStrategy } from "@dnd-kit/sortable";
|
|
6
4
|
import type { Node } from "@tiptap/pm/model";
|
|
7
5
|
import type { Editor } from "@tiptap/react";
|
|
8
6
|
import type { HTMLAttributes } from "react";
|
|
@@ -29,7 +27,7 @@ export interface EmailProps extends Pick<TemplateEditorProps, "hidePublish" | "b
|
|
|
29
27
|
routing?: MessageRouting;
|
|
30
28
|
}) => React.ReactNode;
|
|
31
29
|
hidePreviewPanelExitButton?: boolean;
|
|
32
|
-
render?: ({ subject, handleSubjectChange, selectedNode, setSelectedNode, previewMode, templateEditor, ref, isBrandApply, brandSettings, items, content,
|
|
30
|
+
render?: ({ subject, handleSubjectChange, selectedNode, setSelectedNode, previewMode, templateEditor, ref, isBrandApply, brandSettings, items, content, syncEditorItems, brandEditorContent, templateData, togglePreviewMode, }: {
|
|
33
31
|
subject: string | null;
|
|
34
32
|
handleSubjectChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
35
33
|
selectedNode: Node | null;
|
|
@@ -41,7 +39,6 @@ export interface EmailProps extends Pick<TemplateEditorProps, "hidePublish" | "b
|
|
|
41
39
|
brandSettings: BrandSettingsData | null;
|
|
42
40
|
items: Items;
|
|
43
41
|
content: TiptapDoc | null;
|
|
44
|
-
strategy: SortingStrategy;
|
|
45
42
|
syncEditorItems: (editor: Editor) => void;
|
|
46
43
|
brandEditorContent: string | null;
|
|
47
44
|
templateData: TenantData | null;
|
|
@@ -49,6 +46,7 @@ export interface EmailProps extends Pick<TemplateEditorProps, "hidePublish" | "b
|
|
|
49
46
|
hidePreviewPanelExitButton?: boolean;
|
|
50
47
|
}) => React.ReactNode;
|
|
51
48
|
}
|
|
49
|
+
type UniqueIdentifier = string | number;
|
|
52
50
|
interface Items {
|
|
53
51
|
Editor: UniqueIdentifier[];
|
|
54
52
|
Sidebar: UniqueIdentifier[];
|
|
@@ -1,7 +1,10 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { Editor } from "@tiptap/react";
|
|
2
|
+
type UniqueIdentifier = string | number;
|
|
2
3
|
export interface SideBarProps {
|
|
3
4
|
items: UniqueIdentifier[];
|
|
4
5
|
brandEditor?: boolean;
|
|
5
6
|
label?: string;
|
|
7
|
+
editor?: Editor;
|
|
6
8
|
}
|
|
7
|
-
export declare const SideBar: ({ items, brandEditor, label }: SideBarProps) => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const SideBar: ({ items, brandEditor, label, editor }: SideBarProps) => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export {};
|
|
@@ -1,30 +1,16 @@
|
|
|
1
|
-
import type { DraggableSyntheticListeners } from "@dnd-kit/core";
|
|
2
|
-
import type { Transform } from "@dnd-kit/utilities";
|
|
3
1
|
import React from "react";
|
|
2
|
+
import type { Editor } from "@tiptap/react";
|
|
4
3
|
export interface SideBarSortableItemWrapperProps {
|
|
5
4
|
children: React.ReactNode;
|
|
6
5
|
id: string;
|
|
7
6
|
className?: string;
|
|
7
|
+
editor?: Editor;
|
|
8
8
|
}
|
|
9
|
-
export declare const SideBarSortableItemWrapper: ({ children, id, className, }: SideBarSortableItemWrapperProps) => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const SideBarSortableItemWrapper: ({ children, id, className, editor, }: SideBarSortableItemWrapperProps) => import("react/jsx-runtime").JSX.Element;
|
|
10
10
|
export interface SideBarSortableItemProps {
|
|
11
11
|
children: React.ReactNode;
|
|
12
12
|
id?: string;
|
|
13
|
-
dragOverlay?: boolean;
|
|
14
|
-
color?: string;
|
|
15
|
-
disabled?: boolean;
|
|
16
|
-
dragging?: boolean;
|
|
17
|
-
handle?: boolean;
|
|
18
|
-
handleProps?: Record<string, unknown>;
|
|
19
|
-
height?: number;
|
|
20
|
-
index?: number;
|
|
21
|
-
fadeIn?: boolean;
|
|
22
|
-
transform?: Transform | null;
|
|
23
|
-
listeners?: DraggableSyntheticListeners;
|
|
24
|
-
sorting?: boolean;
|
|
25
|
-
style?: React.CSSProperties;
|
|
26
|
-
transition?: string | null;
|
|
27
|
-
wrapperStyle?: React.CSSProperties;
|
|
28
13
|
className?: string;
|
|
14
|
+
editor?: Editor;
|
|
29
15
|
}
|
|
30
16
|
export declare const SideBarSortableItem: React.ForwardRefExoticComponent<SideBarSortableItemProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -3,11 +3,11 @@ import type { TextMenuConfig } from "@/components/ui/TextMenu/config";
|
|
|
3
3
|
import type { TiptapDoc } from "@/lib/utils";
|
|
4
4
|
import type { ChannelType } from "@/store";
|
|
5
5
|
import type { ElementalNode } from "@/types/elemental.types";
|
|
6
|
-
import { type UniqueIdentifier } from "@dnd-kit/core";
|
|
7
6
|
import type { Node } from "@tiptap/pm/model";
|
|
8
7
|
import type { AnyExtension, Editor } from "@tiptap/react";
|
|
9
8
|
import React, { type HTMLAttributes } from "react";
|
|
10
9
|
import type { TemplateEditorProps } from "../../TemplateEditor";
|
|
10
|
+
type UniqueIdentifier = string | number;
|
|
11
11
|
export declare const defaultMSTeamsContent: ElementalNode[];
|
|
12
12
|
export declare const MSTeamsEditorContent: ({ value }: {
|
|
13
13
|
value?: TiptapDoc;
|
|
@@ -38,3 +38,4 @@ export interface MSTeamsProps extends Pick<TemplateEditorProps, "hidePublish" |
|
|
|
38
38
|
}
|
|
39
39
|
export declare const MSTeamsConfig: TextMenuConfig;
|
|
40
40
|
export declare const MSTeams: React.MemoExoticComponent<React.ForwardRefExoticComponent<MSTeamsProps & React.RefAttributes<HTMLDivElement>>>;
|
|
41
|
+
export {};
|
|
@@ -2,4 +2,4 @@ import type { MSTeamsRenderProps } from "./MSTeams";
|
|
|
2
2
|
export interface MSTeamsEditorProps extends MSTeamsRenderProps {
|
|
3
3
|
readOnly?: boolean;
|
|
4
4
|
}
|
|
5
|
-
export declare const MSTeamsEditor: ({ content, extensions, editable, autofocus, onUpdate,
|
|
5
|
+
export declare const MSTeamsEditor: ({ content, extensions, editable, autofocus, onUpdate, readOnly, }: MSTeamsEditorProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
@@ -1,6 +1,9 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { Editor } from "@tiptap/react";
|
|
2
|
+
type UniqueIdentifier = string | number;
|
|
2
3
|
export interface MSTeamsSideBarProps {
|
|
3
4
|
items: UniqueIdentifier[];
|
|
4
5
|
label?: string;
|
|
6
|
+
editor?: Editor;
|
|
5
7
|
}
|
|
6
|
-
export declare const MSTeamsSideBar: ({ items, label }: MSTeamsSideBarProps) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export declare const MSTeamsSideBar: ({ items, label, editor }: MSTeamsSideBarProps) => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export {};
|
|
@@ -1,6 +1,9 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { Editor } from "@tiptap/react";
|
|
2
|
+
type UniqueIdentifier = string | number;
|
|
2
3
|
export interface SlackSideBarProps {
|
|
3
4
|
items: UniqueIdentifier[];
|
|
4
5
|
label?: string;
|
|
6
|
+
editor?: Editor;
|
|
5
7
|
}
|
|
6
|
-
export declare const SlackSideBar: ({ items, label }: SlackSideBarProps) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export declare const SlackSideBar: ({ items, label, editor }: SlackSideBarProps) => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export {};
|
|
@@ -3,11 +3,11 @@ import type { TextMenuConfig } from "@/components/ui/TextMenu/config";
|
|
|
3
3
|
import type { TiptapDoc } from "@/lib/utils";
|
|
4
4
|
import type { ChannelType } from "@/store";
|
|
5
5
|
import type { ElementalNode } from "@/types/elemental.types";
|
|
6
|
-
import { type UniqueIdentifier } from "@dnd-kit/core";
|
|
7
6
|
import type { Node } from "@tiptap/pm/model";
|
|
8
7
|
import type { AnyExtension, Editor } from "@tiptap/react";
|
|
9
8
|
import React, { type HTMLAttributes } from "react";
|
|
10
9
|
import type { TemplateEditorProps } from "../../TemplateEditor";
|
|
10
|
+
type UniqueIdentifier = string | number;
|
|
11
11
|
export declare const defaultSlackContent: ElementalNode[];
|
|
12
12
|
export declare const SlackEditorContent: ({ value }: {
|
|
13
13
|
value?: TiptapDoc;
|
|
@@ -38,3 +38,4 @@ export interface SlackProps extends Pick<TemplateEditorProps, "hidePublish" | "t
|
|
|
38
38
|
}
|
|
39
39
|
export declare const SlackConfig: TextMenuConfig;
|
|
40
40
|
export declare const Slack: React.MemoExoticComponent<React.ForwardRefExoticComponent<SlackProps & React.RefAttributes<HTMLDivElement>>>;
|
|
41
|
+
export {};
|
|
@@ -2,4 +2,4 @@ import type { SlackRenderProps } from "./Slack";
|
|
|
2
2
|
export interface SlackEditorProps extends SlackRenderProps {
|
|
3
3
|
readOnly?: boolean;
|
|
4
4
|
}
|
|
5
|
-
export declare const SlackEditor: ({ content, extensions, editable, autofocus, onUpdate,
|
|
5
|
+
export declare const SlackEditor: ({ content, extensions, editable, autofocus, onUpdate, readOnly, }: SlackEditorProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { MeasuringStrategy, type CollisionDetection, type DragEndEvent, type DragMoveEvent, type DragStartEvent, type UniqueIdentifier } from "@dnd-kit/core";
|
|
2
1
|
import type { Editor } from "@tiptap/react";
|
|
2
|
+
type UniqueIdentifier = string | number;
|
|
3
3
|
interface UseEditorDndProps {
|
|
4
4
|
items: {
|
|
5
5
|
Sidebar: string[];
|
|
@@ -11,21 +11,17 @@ interface UseEditorDndProps {
|
|
|
11
11
|
}>>;
|
|
12
12
|
editor?: Editor | null;
|
|
13
13
|
}
|
|
14
|
-
export declare const useEditorDnd: ({
|
|
15
|
-
dndProps: {
|
|
16
|
-
sensors: import("@dnd-kit/core").SensorDescriptor<import("@dnd-kit/core").SensorOptions>[];
|
|
17
|
-
collisionDetection: CollisionDetection;
|
|
18
|
-
measuring: {
|
|
19
|
-
droppable: {
|
|
20
|
-
strategy: MeasuringStrategy;
|
|
21
|
-
};
|
|
22
|
-
};
|
|
23
|
-
onDragStart: ({ active }: DragStartEvent) => void;
|
|
24
|
-
onDragMove: ({ active, over }: DragMoveEvent) => void;
|
|
25
|
-
onDragEnd: ({ active, over }: DragEndEvent) => void;
|
|
26
|
-
onDragCancel: () => void;
|
|
27
|
-
};
|
|
28
|
-
activeDragType: string | null;
|
|
14
|
+
export declare const useEditorDnd: ({ setItems, editor }: UseEditorDndProps) => {
|
|
29
15
|
activeId: UniqueIdentifier | null;
|
|
16
|
+
activeDragType: string | null;
|
|
17
|
+
onDragStartHandler: () => void;
|
|
18
|
+
onDragEndHandler: () => void;
|
|
19
|
+
onDragMoveHandler: () => void;
|
|
20
|
+
onDragCancelHandler: () => void;
|
|
21
|
+
lastPlaceholderIndex: number | null;
|
|
22
|
+
cleanupPlaceholder: () => void;
|
|
23
|
+
sensors: undefined;
|
|
24
|
+
measuringProps: undefined;
|
|
25
|
+
collisionDetectionStrategy: undefined;
|
|
30
26
|
};
|
|
31
27
|
export {};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { Editor } from "@tiptap/react";
|
|
2
|
+
type UniqueIdentifier = string | number;
|
|
3
|
+
interface UsePragmaticDndProps {
|
|
4
|
+
items: {
|
|
5
|
+
Sidebar: string[];
|
|
6
|
+
Editor: UniqueIdentifier[];
|
|
7
|
+
};
|
|
8
|
+
setItems: React.Dispatch<React.SetStateAction<{
|
|
9
|
+
Sidebar: string[];
|
|
10
|
+
Editor: UniqueIdentifier[];
|
|
11
|
+
}>>;
|
|
12
|
+
editor?: Editor | null;
|
|
13
|
+
}
|
|
14
|
+
export declare const usePragmaticDnd: ({ items, setItems, editor }: UsePragmaticDndProps) => {
|
|
15
|
+
activeId: UniqueIdentifier | null;
|
|
16
|
+
activeDragType: string | null;
|
|
17
|
+
dndMode: "outer" | "inner";
|
|
18
|
+
lastPlaceholderIndex: number | null;
|
|
19
|
+
cleanupPlaceholder: () => void;
|
|
20
|
+
};
|
|
21
|
+
export {};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import type { UniqueIdentifier } from "@dnd-kit/core";
|
|
2
1
|
import type { Editor } from "@tiptap/react";
|
|
2
|
+
type UniqueIdentifier = string | number;
|
|
3
3
|
interface UseSyncEditorItemsProps {
|
|
4
4
|
setItems: React.Dispatch<React.SetStateAction<{
|
|
5
5
|
Sidebar: string[];
|
|
@@ -9,6 +9,6 @@ interface UseSyncEditorItemsProps {
|
|
|
9
9
|
editor?: Editor | null;
|
|
10
10
|
}
|
|
11
11
|
export declare const useSyncEditorItems: ({ setItems, rafId, editor }: UseSyncEditorItemsProps) => {
|
|
12
|
-
syncEditorItems: (editor: Editor) =>
|
|
12
|
+
syncEditorItems: (editor: Editor) => () => void;
|
|
13
13
|
};
|
|
14
14
|
export {};
|
|
@@ -2,7 +2,6 @@ export { BrandFooter } from "@/components/BrandEditor/Editor/BrandFooter";
|
|
|
2
2
|
export { PreviewPanel } from "@/components/ui/PreviewPanel";
|
|
3
3
|
export { TextMenu } from "@/components/ui/TextMenu";
|
|
4
4
|
export { cn, convertElementalToTiptap, convertTiptapToElemental } from "@/lib/utils";
|
|
5
|
-
export { SortableContext } from "@dnd-kit/sortable";
|
|
6
5
|
export { useChannels } from "./Channels";
|
|
7
6
|
export { default as EmailEditor } from "./Channels/Email/EmailEditor";
|
|
8
7
|
export * from "./TemplateEditor";
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
type UniqueIdentifier = string | number;
|
|
3
|
+
interface DraggableItemProps {
|
|
4
|
+
id: UniqueIdentifier;
|
|
5
|
+
children: React.ReactNode;
|
|
6
|
+
dragType?: string;
|
|
7
|
+
type?: "sidebar" | "editor";
|
|
8
|
+
index?: number;
|
|
9
|
+
className?: string;
|
|
10
|
+
disabled?: boolean;
|
|
11
|
+
onDragStart?: () => void;
|
|
12
|
+
onDragEnd?: () => void;
|
|
13
|
+
renderDragPreview?: () => React.ReactElement;
|
|
14
|
+
}
|
|
15
|
+
export declare const DraggableItem: ({ id, children, dragType, type, index, className, disabled, onDragStart, onDragEnd, renderDragPreview, }: DraggableItemProps) => import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { DraggableItem } from "./DraggableItem";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { DropIndicatorPlaceholder } from "./DropIndicatorPlaceholder";
|
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import type { DraggableSyntheticListeners } from "@dnd-kit/core";
|
|
2
|
-
import type { Transform } from "@dnd-kit/utilities";
|
|
3
1
|
import type { Editor, NodeViewWrapperProps } from "@tiptap/react";
|
|
4
2
|
import React, { type HTMLAttributes } from "react";
|
|
3
|
+
import { type Edge } from "@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge";
|
|
5
4
|
export interface SortableItemWrapperProps extends NodeViewWrapperProps {
|
|
6
5
|
children: React.ReactNode;
|
|
7
6
|
id: string;
|
|
@@ -15,11 +14,11 @@ export interface SortableItemProps {
|
|
|
15
14
|
dragOverlay?: boolean;
|
|
16
15
|
disabled?: boolean;
|
|
17
16
|
dragging?: boolean;
|
|
18
|
-
|
|
17
|
+
closestEdge?: Edge | null;
|
|
18
|
+
dragType?: string | null;
|
|
19
|
+
handleRef?: React.RefObject<HTMLButtonElement>;
|
|
20
|
+
contentRef?: React.RefObject<HTMLDivElement>;
|
|
19
21
|
fadeIn?: boolean;
|
|
20
|
-
transform?: Transform | null;
|
|
21
|
-
listeners?: DraggableSyntheticListeners;
|
|
22
|
-
transition?: string | null;
|
|
23
22
|
className?: string;
|
|
24
23
|
editor: Editor;
|
|
25
24
|
}
|
|
@@ -1,2 +1 @@
|
|
|
1
|
-
|
|
2
|
-
export declare const coordinateGetter: KeyboardCoordinateGetter;
|
|
1
|
+
export declare const coordinateGetter: () => undefined;
|