@trycourier/react-designer 0.0.0-canary-20251111195505 → 0.0.0-canary-20251113161110

package/dist/cjs/styles.css

@@ -931,8 +931,8 @@ body {
 .courier-left-\[-12px\] {
   left: -12px;
 }
-.courier-left-\[-20px\] {
-  left: -20px;
+.courier-left-\[-8px\] {
+  left: -8px;
 }
 .courier-left-\[50\%\] {
   left: 50%;
@@ -1090,9 +1090,15 @@ body {
 .courier-ml-2 {
   margin-left: 0.5rem;
 }
+.courier-ml-4 {
+  margin-left: 1rem;
+}
 .courier-ml-auto {
   margin-left: auto;
 }
+.courier-mr-10 {
+  margin-right: 2.5rem;
+}
 .courier-mr-14 {
   margin-right: 3.5rem;
 }
@@ -2043,9 +2049,15 @@ body {
 .courier-pb-6 {
   padding-bottom: 1.5rem;
 }
+.courier-pl-0 {
+  padding-left: 0px;
+}
 .courier-pl-1 {
   padding-left: 0.25rem;
 }
+.courier-pl-10 {
+  padding-left: 2.5rem;
+}
 .courier-pl-2 {
   padding-left: 0.5rem;
 }
@@ -2851,7 +2863,7 @@ body {
   padding-top: 2.5rem;
   padding-bottom: 2.5rem;
   padding-right: 2.5rem;
-  padding-left: 1rem;
+  padding-left: 0px;
   caret-color: #000;
   outline-width: 0px;
 }
@@ -2861,7 +2873,7 @@ body {
 @media (min-width: 1024px) {
 
   .ProseMirror {
-    padding-left: 0.5rem;
+    padding-left: 0px;
     padding-right: 2.5rem;
   }
 }
@@ -3051,6 +3063,9 @@ body {
 
       /* Global rule: Show drag handles for elements inside columns on hover */
     }
+/* .draggable-item {
+        @apply courier-mr-10 courier-ml-4 lg:courier-ml-2 lg:courier-mr-10 courier-w-full;
+      } */
 .ProseMirror > .react-renderer.node-imageBlock [data-cypress="draggable-handle"], .ProseMirror > .react-renderer.node-button [data-cypress="draggable-handle"], .ProseMirror > .react-renderer.node-divider [data-cypress="draggable-handle"], .ProseMirror > .react-renderer.node-paragraph [data-cypress="draggable-handle"], .ProseMirror > .react-renderer.node-heading [data-cypress="draggable-handle"], .ProseMirror > .react-renderer.node-blockquote [data-cypress="draggable-handle"], .ProseMirror > .react-renderer.node-column [data-cypress="draggable-handle"], .ProseMirror > .react-renderer.node-customCode [data-cypress="draggable-handle"] {
   visibility: hidden;
 }
@@ -4462,8 +4477,16 @@ body {
 }
 @media (min-width: 1024px) {
 
-  .lg\:courier-pl-2 {
-    padding-left: 0.5rem;
+  .lg\:courier-ml-2 {
+    margin-left: 0.5rem;
+  }
+
+  .lg\:courier-mr-10 {
+    margin-right: 2.5rem;
+  }
+
+  .lg\:courier-pl-0 {
+    padding-left: 0px;
   }
 
   .lg\:courier-pr-10 {

package/dist/components/TemplateEditor/hooks/useDndRef.d.ts

@@ -0,0 +1,18 @@
+/**
+ * React 19 compatibility wrapper for DnD Kit refs
+ *
+ * React 19 made refs regular props instead of special properties,
+ * which breaks DnD Kit's setNodeRef callback pattern.
+ * This hook converts DnD Kit's setNodeRef into a React 19-compatible callback ref.
+ *
+ * @param setNodeRef - The setNodeRef function from useSortable or useDroppable
+ * @returns A callback ref compatible with React 19
+ *
+ * @example
+ * ```tsx
+ * const { setNodeRef } = useSortable({ id: 'item-1' });
+ * const ref = useDndRef(setNodeRef);
+ * return <div ref={ref}>Content</div>;
+ * ```
+ */
+export declare function useDndRef<T extends HTMLElement>(setNodeRef: ((node: T | null) => void) | undefined): (element: T | null) => void;

package/dist/components/TemplateEditor/index.d.ts

@@ -17,6 +17,7 @@ export declare const InboxChannel: import("react").MemoExoticComponent<import("r
 export declare const MSTeamsChannel: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<import("./Channels").MSTeamsProps & import("react").RefAttributes<HTMLDivElement>>>;
 export declare const SlackChannel: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<import("./Channels").SlackProps & import("react").RefAttributes<HTMLDivElement>>>;
 export { EmailEditorContainer, EmailEditorMain, type EmailEditorProps, type InboxEditorProps, type MSTeamsEditorProps, type PushEditorProps, type SlackEditorProps, type SMSEditorProps, } from "./Channels";
+export { CHANNELS } from "@/channels";
 export type { ChannelType } from "@/store";
 export type { ElementalContent } from "@/types";
 export { ChannelRootContainer, EditorSidebar } from "./Layout";

package/dist/components/ui-kit/Icon/EmailIcon.d.ts

@@ -0,0 +1,3 @@
+import type { IconProps } from "./Icon";
+export declare const EmailIcon: ({ color, width, height, viewBox, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default EmailIcon;

package/dist/components/ui-kit/Icon/MSTeamsIcon.d.ts

@@ -1,3 +1,3 @@
 import type { IconProps } from "./Icon";
-export declare const MSTeamsIcon: ({ color, width, height, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MSTeamsIcon: ({ color, width, height, viewBox, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
 export default MSTeamsIcon;

package/dist/components/ui-kit/Icon/PushIcon.d.ts

@@ -1,3 +1,3 @@
 import type { IconProps } from "./Icon";
-export declare const PushIcon: ({ color, width, height, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
+export declare const PushIcon: ({ color, width, height, viewBox, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
 export default PushIcon;

package/dist/components/ui-kit/Icon/index.d.ts

@@ -13,6 +13,7 @@ export { DesktopIcon } from "./DesktopIcon";
 export { DistributeIcon } from "./DistributeIcon";
 export { DownIcon } from "./DownIcon";
 export { DuplicateIcon } from "./DuplicateIcon";
+export { EmailIcon } from "./EmailIcon";
 export { ExpandIcon } from "./ExpandIcon";
 export { FacebookIcon } from "./FacebookIcon";
 export { FontSizeIcon } from "./FontSizeIcon";