@trycourier/react-designer 0.0.0-canary-20251202152218 → 0.0.0-canary-20251205100831

package/dist/cjs/styles.css

@@ -259,15 +259,15 @@
     pointer-events: none;
     width: 100%;
   } */
-.ProseMirror>*:first-child:first-child,
-  .ProseMirror [data-type="column"]>*:first-child {
+.ProseMirror > *:first-child:first-child,
+  .ProseMirror [data-type="column"] > *:first-child {
   margin-top: 0px;
 }
-.ProseMirror>*:first-child:last-child,
-  .ProseMirror [data-type="column"]>*:last-child {
+.ProseMirror > *:first-child:last-child,
+  .ProseMirror [data-type="column"] > *:last-child {
   margin-bottom: 0px;
 }
-.ProseMirror>*+* {
+.ProseMirror > * + * {
     margin-top: 0.75em;
   }
 .ProseMirror .node-imageUpload {
@@ -375,9 +375,6 @@
 .ProseMirror .node-imageBlock img {
   overflow: hidden;
 }
-.ProseMirror .node-imageBlock img {
-  border-radius: 0.75rem;
-}
 .ProseMirror .node-imageBlock img {
   border-width: 2px;
 }
@@ -409,45 +406,45 @@
   --tw-border-opacity: 1;
   border-color: rgb(229 229 229 / var(--tw-border-opacity, 1));
 }
-.ProseMirror .node-aiWriter.has-focus [data-node-view-wrapper]>*, .ProseMirror .node-aiImage.has-focus [data-node-view-wrapper]>*, .ProseMirror .node-tableOfContentsNode.has-focus [data-node-view-wrapper]>* {
+.ProseMirror .node-aiWriter.has-focus [data-node-view-wrapper] > *, .ProseMirror .node-aiImage.has-focus [data-node-view-wrapper] > *, .ProseMirror .node-tableOfContentsNode.has-focus [data-node-view-wrapper] > * {
   border-radius: var(--radius);
 }
-.ProseMirror .node-aiWriter.has-focus [data-node-view-wrapper]>*, .ProseMirror .node-aiImage.has-focus [data-node-view-wrapper]>*, .ProseMirror .node-tableOfContentsNode.has-focus [data-node-view-wrapper]>* {
+.ProseMirror .node-aiWriter.has-focus [data-node-view-wrapper] > *, .ProseMirror .node-aiImage.has-focus [data-node-view-wrapper] > *, .ProseMirror .node-tableOfContentsNode.has-focus [data-node-view-wrapper] > * {
   --tw-shadow: 0 0 0 2px;
   --tw-shadow-colored: 0 0 0 2px var(--tw-shadow-color);
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
-.ProseMirror .node-aiWriter.has-focus [data-node-view-wrapper]>*, .ProseMirror .node-aiImage.has-focus [data-node-view-wrapper]>*, .ProseMirror .node-tableOfContentsNode.has-focus [data-node-view-wrapper]>* {
+.ProseMirror .node-aiWriter.has-focus [data-node-view-wrapper] > *, .ProseMirror .node-aiImage.has-focus [data-node-view-wrapper] > *, .ProseMirror .node-tableOfContentsNode.has-focus [data-node-view-wrapper] > * {
   --tw-shadow-color: rgb(0 0 0 / 0.3);
   --tw-shadow: var(--tw-shadow-colored);
 }
-.ProseMirror .node-aiWriter.has-focus [data-node-view-wrapper]>*, .ProseMirror .node-aiImage.has-focus [data-node-view-wrapper]>*, .ProseMirror .node-tableOfContentsNode.has-focus [data-node-view-wrapper]>* {
+.ProseMirror .node-aiWriter.has-focus [data-node-view-wrapper] > *, .ProseMirror .node-aiImage.has-focus [data-node-view-wrapper] > *, .ProseMirror .node-tableOfContentsNode.has-focus [data-node-view-wrapper] > * {
   transition-property: all;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }
-.ProseMirror .node-aiWriter.has-focus [data-node-view-wrapper]>*:is(.courier-dark *), .ProseMirror .node-aiImage.has-focus [data-node-view-wrapper]>*:is(.courier-dark *), .ProseMirror .node-tableOfContentsNode.has-focus [data-node-view-wrapper]>*:is(.courier-dark *) {
+.ProseMirror .node-aiWriter.has-focus [data-node-view-wrapper] > *:is(.courier-dark *), .ProseMirror .node-aiImage.has-focus [data-node-view-wrapper] > *:is(.courier-dark *), .ProseMirror .node-tableOfContentsNode.has-focus [data-node-view-wrapper] > *:is(.courier-dark *) {
   --tw-shadow-color: rgb(255 255 255 / 0.3);
   --tw-shadow: var(--tw-shadow-colored);
 }
-.ProseMirror .ProseMirror-gapcursor+.node-imageBlock,
-  .ProseMirror .ProseMirror-gapcursor+.node-imageUpload,
-  .ProseMirror .ProseMirror-gapcursor+.node-blockquote {
+.ProseMirror .ProseMirror-gapcursor + .node-imageBlock,
+  .ProseMirror .ProseMirror-gapcursor + .node-imageUpload,
+  .ProseMirror .ProseMirror-gapcursor + .node-blockquote {
   outline-color: #404040;
 }
-.ProseMirror .ProseMirror-gapcursor+.node-imageBlock:hover,
-  .ProseMirror .ProseMirror-gapcursor+.node-imageUpload:hover,
-  .ProseMirror .ProseMirror-gapcursor+.node-blockquote:hover {
+.ProseMirror .ProseMirror-gapcursor + .node-imageBlock:hover,
+  .ProseMirror .ProseMirror-gapcursor + .node-imageUpload:hover,
+  .ProseMirror .ProseMirror-gapcursor + .node-blockquote:hover {
   outline-color: #525252;
 }
-.ProseMirror .ProseMirror-gapcursor+.node-imageBlock:is(.courier-dark *),
-  .ProseMirror .ProseMirror-gapcursor+.node-imageUpload:is(.courier-dark *),
-  .ProseMirror .ProseMirror-gapcursor+.node-blockquote:is(.courier-dark *) {
+.ProseMirror .ProseMirror-gapcursor + .node-imageBlock:is(.courier-dark *),
+  .ProseMirror .ProseMirror-gapcursor + .node-imageUpload:is(.courier-dark *),
+  .ProseMirror .ProseMirror-gapcursor + .node-blockquote:is(.courier-dark *) {
   outline-color: #d4d4d4;
 }
-.ProseMirror .ProseMirror-gapcursor+.node-imageBlock:hover:is(.courier-dark *),
-  .ProseMirror .ProseMirror-gapcursor+.node-imageUpload:hover:is(.courier-dark *),
-  .ProseMirror .ProseMirror-gapcursor+.node-blockquote:hover:is(.courier-dark *) {
+.ProseMirror .ProseMirror-gapcursor + .node-imageBlock:hover:is(.courier-dark *),
+  .ProseMirror .ProseMirror-gapcursor + .node-imageUpload:hover:is(.courier-dark *),
+  .ProseMirror .ProseMirror-gapcursor + .node-blockquote:hover:is(.courier-dark *) {
   outline-color: #a3a3a3;
 }
 *, ::before, ::after {
@@ -1626,9 +1623,6 @@ body {
 .courier-rounded-sm {
   border-radius: calc(var(--radius) - 4px);
 }
-.courier-rounded-xl {
-  border-radius: 0.75rem;
-}
 .courier-rounded-b-none {
   border-bottom-right-radius: 0px;
   border-bottom-left-radius: 0px;
@@ -2193,6 +2187,9 @@ body {
 .courier-leading-relaxed {
   line-height: 1.625;
 }
+.courier-leading-tight {
+  line-height: 1.25;
+}
 .courier-tracking-\[0\.64px\] {
   letter-spacing: 0.64px;
 }
@@ -2711,6 +2708,10 @@ body {
 .courier-sms-editor .ProseMirror > .react-renderer .draggable-item > div {
   padding-left: 0px;
 }
+.courier-sms-editor .ProseMirror > .react-renderer.node-paragraph p {
+          overflow-wrap: break-word;
+          word-break: break-word;
+        }
 .courier-sms-editor .ProseMirror > .react-renderer.node-paragraph .selected-element .node-element::before {
   display: none;
 }

package/dist/components/extensions/Button/Button.types.d.ts

@@ -3,61 +3,55 @@ export declare const buttonSchema: z.ZodObject<{
     label: z.ZodString;
     link: z.ZodOptional<z.ZodString>;
     alignment: z.ZodEnum<["left", "center", "right"]>;
-    size: z.ZodEnum<["default", "full"]>;
     backgroundColor: z.ZodString;
-    textColor: z.ZodString;
-    borderWidth: z.ZodNumber;
     borderRadius: z.ZodNumber;
-    borderColor: z.ZodString;
     padding: z.ZodNumber;
     fontWeight: z.ZodEnum<["normal", "bold"]>;
     fontStyle: z.ZodEnum<["normal", "italic"]>;
     isUnderline: z.ZodBoolean;
     isStrike: z.ZodBoolean;
+    textColor: z.ZodOptional<z.ZodString>;
+    borderColor: z.ZodOptional<z.ZodString>;
 }, "strip", z.ZodTypeAny, {
     padding: number;
     label: string;
     backgroundColor: string;
-    textColor: string;
-    borderColor: string;
-    size: "full" | "default";
-    borderWidth: number;
-    borderRadius: number;
     alignment: "left" | "center" | "right";
+    borderRadius: number;
     fontStyle: "italic" | "normal";
     fontWeight: "bold" | "normal";
     isUnderline: boolean;
     isStrike: boolean;
     link?: string | undefined;
+    textColor?: string | undefined;
+    borderColor?: string | undefined;
 }, {
     padding: number;
     label: string;
     backgroundColor: string;
-    textColor: string;
-    borderColor: string;
-    size: "full" | "default";
-    borderWidth: number;
-    borderRadius: number;
     alignment: "left" | "center" | "right";
+    borderRadius: number;
     fontStyle: "italic" | "normal";
     fontWeight: "bold" | "normal";
     isUnderline: boolean;
     isStrike: boolean;
     link?: string | undefined;
+    textColor?: string | undefined;
+    borderColor?: string | undefined;
 }>;
 export interface ButtonProps {
     label: string;
     link?: string;
     alignment: "left" | "center" | "right";
-    size: "default" | "full";
     backgroundColor: string;
-    textColor: string;
-    borderWidth: number;
     borderRadius: number;
-    borderColor: string;
     padding: number;
     fontWeight: "normal" | "bold";
     fontStyle: "normal" | "italic";
     isUnderline: boolean;
     isStrike: boolean;
+    /** @deprecated Legacy property - not supported by Elemental */
+    textColor?: string;
+    /** @deprecated Legacy property - not supported by Elemental */
+    borderColor?: string;
 }

package/dist/components/extensions/Column/Column.types.d.ts

@@ -22,8 +22,8 @@ export declare const columnSchema: z.ZodObject<{
     backgroundColor: string;
     paddingVertical: number;
     paddingHorizontal: number;
-    borderColor: string;
     borderWidth: number;
+    borderColor: string;
     borderRadius: number;
     columnsCount: number;
     cells?: {
@@ -33,8 +33,8 @@ export declare const columnSchema: z.ZodObject<{
     backgroundColor?: string | undefined;
     paddingVertical?: number | undefined;
     paddingHorizontal?: number | undefined;
-    borderColor?: string | undefined;
     borderWidth?: number | undefined;
+    borderColor?: string | undefined;
     borderRadius?: number | undefined;
     columnsCount?: number | undefined;
     cells?: {

package/dist/components/extensions/Divider/Divider.types.d.ts

@@ -9,8 +9,8 @@ export declare const dividerSchema: z.ZodObject<{
     padding: number;
     color: string;
     size: number;
-    radius: number;
     variant: "divider" | "spacer";
+    radius: number;
 }, {
     padding: number;
     color: string;

package/dist/components/extensions/ImageBlock/ImageBlock.types.d.ts

@@ -6,15 +6,13 @@ export declare const imageBlockSchema: z.ZodObject<{
     alignment: z.ZodEnum<["left", "center", "right"]>;
     width: z.ZodNumber;
     borderWidth: z.ZodNumber;
-    borderRadius: z.ZodNumber;
     borderColor: z.ZodString;
     isUploading: z.ZodOptional<z.ZodBoolean>;
     imageNaturalWidth: z.ZodNumber;
 }, "strip", z.ZodTypeAny, {
     width: number;
-    borderColor: string;
     borderWidth: number;
-    borderRadius: number;
+    borderColor: string;
     alignment: "left" | "center" | "right";
     sourcePath: string;
     imageNaturalWidth: number;
@@ -23,9 +21,8 @@ export declare const imageBlockSchema: z.ZodObject<{
     isUploading?: boolean | undefined;
 }, {
     width: number;
-    borderColor: string;
     borderWidth: number;
-    borderRadius: number;
+    borderColor: string;
     alignment: "left" | "center" | "right";
     sourcePath: string;
     imageNaturalWidth: number;
@@ -40,7 +37,6 @@ export interface ImageBlockProps {
     alignment: "left" | "center" | "right";
     width: number;
     borderWidth: number;
-    borderRadius: number;
     borderColor: string;
     isUploading?: boolean;
     imageNaturalWidth: number;

package/dist/components/extensions/TextBlock/TextBlock.types.d.ts

@@ -4,31 +4,25 @@ export declare const textBlockSchema: z.ZodObject<{
     paddingHorizontal: z.ZodNumber;
     backgroundColor: z.ZodString;
     borderWidth: z.ZodNumber;
-    borderRadius: z.ZodNumber;
     borderColor: z.ZodString;
-    textColor: z.ZodString;
     textAlign: z.ZodDefault<z.ZodEnum<["left", "center", "right", "justify"]>>;
     selected: z.ZodDefault<z.ZodBoolean>;
     id: z.ZodOptional<z.ZodString>;
 }, "strip", z.ZodTypeAny, {
     backgroundColor: string;
-    textColor: string;
     paddingVertical: number;
     paddingHorizontal: number;
-    borderColor: string;
     borderWidth: number;
-    borderRadius: number;
+    borderColor: string;
     textAlign: "left" | "center" | "right" | "justify";
     selected: boolean;
     id?: string | undefined;
 }, {
     backgroundColor: string;
-    textColor: string;
     paddingVertical: number;
     paddingHorizontal: number;
-    borderColor: string;
     borderWidth: number;
-    borderRadius: number;
+    borderColor: string;
     id?: string | undefined;
     textAlign?: "left" | "center" | "right" | "justify" | undefined;
     selected?: boolean | undefined;
@@ -38,9 +32,7 @@ export interface TextBlockProps {
     paddingHorizontal: number;
     backgroundColor: string;
     borderWidth: number;
-    borderRadius: number;
     borderColor: string;
-    textColor: string;
     textAlign: "left" | "center" | "right" | "justify";
     selected: boolean;
     id?: string;

package/dist/components/ui/TextMenu/config.d.ts

@@ -2,6 +2,21 @@ export type TextMenuItemState = "enabled" | "disabled" | "hidden";
 export interface TextMenuItem {
     state: TextMenuItemState;
 }
+export interface ConditionalRule {
+    id: string;
+    trigger: {
+        type: "node";
+        name: string;
+        active: boolean;
+    };
+    conditions: {
+        activeItems: Array<keyof TextMenuConfig>;
+    };
+    action: {
+        type: "toggle_off";
+        targets: Array<keyof TextMenuConfig>;
+    };
+}
 export interface TextMenuConfig {
     contentType?: TextMenuItem;
     bold?: TextMenuItem;
@@ -15,6 +30,7 @@ export interface TextMenuConfig {
     quote?: TextMenuItem;
     link?: TextMenuItem;
     variable?: TextMenuItem;
+    conditionalRules?: ConditionalRule[];
 }
 export declare const defaultTextMenuConfig: TextMenuConfig;
 export declare const getTextMenuConfigForNode: (nodeName: string, hasTextSelection?: boolean) => TextMenuConfig;

package/dist/components/ui/TextMenu/hooks/useConditionalRules.d.ts

@@ -0,0 +1,18 @@
+import type { Editor } from "@tiptap/react";
+import type { TextMenuConfig } from "../config";
+interface TextMenuStates {
+    isBold: boolean;
+    isItalic: boolean;
+    isUnderline: boolean;
+    isStrike: boolean;
+    isQuote: boolean;
+    isAlignLeft: boolean;
+    isAlignCenter: boolean;
+    isAlignRight: boolean;
+    isAlignJustify: boolean;
+    isLink: boolean;
+}
+export declare const useConditionalRules: (config: TextMenuConfig | undefined, editor: Editor | null, states: TextMenuStates | undefined) => {
+    getRuleForItem: (itemKey: keyof TextMenuConfig) => import("../config").ConditionalRule | undefined;
+} | null;
+export {};

package/dist/components/ui/TextMenu/hooks/useTextmenuCommands.d.ts

@@ -1,5 +1,18 @@
 import type { Editor } from "@tiptap/react";
-export declare const useTextmenuCommands: (editor: Editor) => {
+import type { TextMenuConfig } from "../config";
+interface TextMenuStates {
+    isBold: boolean;
+    isItalic: boolean;
+    isUnderline: boolean;
+    isStrike: boolean;
+    isQuote: boolean;
+    isAlignLeft: boolean;
+    isAlignCenter: boolean;
+    isAlignRight: boolean;
+    isAlignJustify: boolean;
+    isLink: boolean;
+}
+export declare const useTextmenuCommands: (editor: Editor, config?: TextMenuConfig, states?: TextMenuStates) => {
     onBold: () => boolean;
     onItalic: () => boolean;
     onStrike: () => boolean;
@@ -12,3 +25,4 @@ export declare const useTextmenuCommands: (editor: Editor) => {
     onQuote: () => void;
     resetButtonFormatting: () => boolean;
 };
+export {};

package/dist/components/ui-kit/Toggle/Toggle.d.ts

@@ -2,11 +2,11 @@ import * as React from "react";
 import * as TogglePrimitive from "@radix-ui/react-toggle";
 import { type VariantProps } from "class-variance-authority";
 declare const toggleVariants: (props?: ({
-    variant?: "default" | "outline" | null | undefined;
+    variant?: "outline" | "default" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 declare const Toggle: React.ForwardRefExoticComponent<Omit<TogglePrimitive.ToggleProps & React.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
-    variant?: "default" | "outline" | null | undefined;
+    variant?: "outline" | "default" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
 export { Toggle, toggleVariants };

package/dist/components/ui-kit/ToggleGroup/ToggleGroup.d.ts

@@ -2,11 +2,11 @@ import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
 import { type VariantProps } from "class-variance-authority";
 import * as React from "react";
 declare const ToggleGroup: React.ForwardRefExoticComponent<((Omit<ToggleGroupPrimitive.ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement>, "ref"> | Omit<ToggleGroupPrimitive.ToggleGroupMultipleProps & React.RefAttributes<HTMLDivElement>, "ref">) & VariantProps<(props?: ({
-    variant?: "default" | "outline" | null | undefined;
+    variant?: "outline" | "default" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string>) & React.RefAttributes<HTMLDivElement>>;
 declare const ToggleGroupItem: React.ForwardRefExoticComponent<Omit<ToggleGroupPrimitive.ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
-    variant?: "default" | "outline" | null | undefined;
+    variant?: "outline" | "default" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
 export { ToggleGroup, ToggleGroupItem };