@kgalexander/mcreate 1.0.8 → 1.0.9

package/dist/{chunk-FJ4KXNNM.mjs → chunk-R3LRNUKL.mjs}

@@ -14702,6 +14702,16 @@ function validate_editor_onPreview(template, mergeFields) {
   const is_over_size_limit = templateSize > 50 * 1024;
   return { invalid_merge_fields, missing_links, is_over_size_limit, placeholder_property_images };
 }
+function validate_campaign_onCreate() {
+  return true;
+}
+function campaign_validation_warnings() {
+  return {
+    invalid_merge_fields: true,
+    missing_properties_attributes: true,
+    missing_links: true
+  };
+}
 
 // src/core/editor/components/preview.tsx
 import { jsx as jsx49, jsxs as jsxs30 } from "react/jsx-runtime";
@@ -16079,6 +16089,9 @@ export {
   SidebarProvider,
   useSidebarContext,
   Textarea,
+  validate_editor_onPreview,
+  validate_campaign_onCreate,
+  campaign_validation_warnings,
   Preview,
   History,
   MAILLOW_EMAIL_EDITOR_VERSION,

package/dist/{core-OW5KVXX7.mjs → core-HIQH4BAG.mjs}

@@ -5,7 +5,7 @@ import {
   MAILLOW_EMAIL_EDITOR_VERSION,
   Preview,
   useEditorStore
-} from "./chunk-FJ4KXNNM.mjs";
+} from "./chunk-R3LRNUKL.mjs";
 export {
   Editor,
   History,

package/dist/index.d.mts

@@ -320,6 +320,38 @@ declare function TemplatePage({ templateId, initialTemplate, onSave, onToast, on
 
 declare const MAX_TEMPLATE_SIZE: number;
 
+interface MergeFieldType {
+    label: string;
+    value: string;
+}
+interface MissingLinkType {
+    type: 'button' | 'social-item';
+    label: string;
+}
+interface PreviewValidationType {
+    invalid_merge_fields: string[];
+    missing_links: MissingLinkType[];
+    is_over_size_limit: boolean;
+    placeholder_property_images: number;
+}
+
+/**
+ * Validate a template when the user previews the template
+ */
+declare function validate_editor_onPreview(template: any, mergeFields: MergeFieldType[]): PreviewValidationType;
+/**
+ * Validate a campaign template when the user creates a new campaign
+ */
+declare function validate_campaign_onCreate(): boolean;
+/**
+ * Return validation warnings for a campaign template
+ */
+declare function campaign_validation_warnings(): {
+    invalid_merge_fields: boolean;
+    missing_properties_attributes: boolean;
+    missing_links: boolean;
+};
+
 /**
  * JSON to MJML Converter
  * Converts template JSON to MJML string for rendering
@@ -338,4 +370,4 @@ interface RenderOptions {
  */
 declare function json2mjml(template: TemplateJSON, mode?: RenderMode, options?: RenderOptions): string;
 
-export { Editor, type ImageData, MAX_TEMPLATE_SIZE, type MergeField, type OnDeleteCallback, type OnDuplicateCallback, type OnExitCallback, type OnImageUploadCallback, type OnSaveCallback, type OnToastCallback, type PaidLevel, type TemplateJSON, TemplatePage, type ToastOptions, type ToastType, json2mjml };
+export { Editor, type ImageData, MAX_TEMPLATE_SIZE, type MergeField, type MergeFieldType, type MissingLinkType, type OnDeleteCallback, type OnDuplicateCallback, type OnExitCallback, type OnImageUploadCallback, type OnSaveCallback, type OnToastCallback, type PaidLevel, type PreviewValidationType, type TemplateJSON, TemplatePage, type ToastOptions, type ToastType, campaign_validation_warnings, json2mjml, validate_campaign_onCreate, validate_editor_onPreview };

package/dist/index.d.ts

@@ -320,6 +320,38 @@ declare function TemplatePage({ templateId, initialTemplate, onSave, onToast, on
 
 declare const MAX_TEMPLATE_SIZE: number;
 
+interface MergeFieldType {
+    label: string;
+    value: string;
+}
+interface MissingLinkType {
+    type: 'button' | 'social-item';
+    label: string;
+}
+interface PreviewValidationType {
+    invalid_merge_fields: string[];
+    missing_links: MissingLinkType[];
+    is_over_size_limit: boolean;
+    placeholder_property_images: number;
+}
+
+/**
+ * Validate a template when the user previews the template
+ */
+declare function validate_editor_onPreview(template: any, mergeFields: MergeFieldType[]): PreviewValidationType;
+/**
+ * Validate a campaign template when the user creates a new campaign
+ */
+declare function validate_campaign_onCreate(): boolean;
+/**
+ * Return validation warnings for a campaign template
+ */
+declare function campaign_validation_warnings(): {
+    invalid_merge_fields: boolean;
+    missing_properties_attributes: boolean;
+    missing_links: boolean;
+};
+
 /**
  * JSON to MJML Converter
  * Converts template JSON to MJML string for rendering
@@ -338,4 +370,4 @@ interface RenderOptions {
  */
 declare function json2mjml(template: TemplateJSON, mode?: RenderMode, options?: RenderOptions): string;
 
-export { Editor, type ImageData, MAX_TEMPLATE_SIZE, type MergeField, type OnDeleteCallback, type OnDuplicateCallback, type OnExitCallback, type OnImageUploadCallback, type OnSaveCallback, type OnToastCallback, type PaidLevel, type TemplateJSON, TemplatePage, type ToastOptions, type ToastType, json2mjml };
+export { Editor, type ImageData, MAX_TEMPLATE_SIZE, type MergeField, type MergeFieldType, type MissingLinkType, type OnDeleteCallback, type OnDuplicateCallback, type OnExitCallback, type OnImageUploadCallback, type OnSaveCallback, type OnToastCallback, type PaidLevel, type PreviewValidationType, type TemplateJSON, TemplatePage, type ToastOptions, type ToastType, campaign_validation_warnings, json2mjml, validate_campaign_onCreate, validate_editor_onPreview };

package/dist/index.js

@@ -15409,6 +15409,16 @@ function validate_editor_onPreview(template, mergeFields) {
   const is_over_size_limit = templateSize > 50 * 1024;
   return { invalid_merge_fields, missing_links, is_over_size_limit, placeholder_property_images };
 }
+function validate_campaign_onCreate() {
+  return true;
+}
+function campaign_validation_warnings() {
+  return {
+    invalid_merge_fields: true,
+    missing_properties_attributes: true,
+    missing_links: true
+  };
+}
 var PROPERTY_CARD_TYPES;
 var init_validate = __esm({
   "src/validate/index.ts"() {
@@ -16804,7 +16814,10 @@ __export(index_exports, {
   Editor: () => Editor,
   MAX_TEMPLATE_SIZE: () => MAX_TEMPLATE_SIZE,
   TemplatePage: () => TemplatePage,
-  json2mjml: () => json2mjml
+  campaign_validation_warnings: () => campaign_validation_warnings,
+  json2mjml: () => json2mjml,
+  validate_campaign_onCreate: () => validate_campaign_onCreate,
+  validate_editor_onPreview: () => validate_editor_onPreview
 });
 module.exports = __toCommonJS(index_exports);
 init_core();
@@ -19583,7 +19596,7 @@ init_editor();
 init_label();
 init_popover();
 
-// node_modules/color-name/index.js
+// node_modules/color-string/node_modules/color-name/index.js
 var colors = {
   aliceblue: [240, 248, 255],
   antiquewhite: [250, 235, 215],
@@ -19905,10 +19918,164 @@ function hexDouble(number_) {
 }
 var color_string_default = cs;
 
-// node_modules/color-convert/conversions.js
+// node_modules/color/node_modules/color-name/index.js
+var colors2 = {
+  aliceblue: [240, 248, 255],
+  antiquewhite: [250, 235, 215],
+  aqua: [0, 255, 255],
+  aquamarine: [127, 255, 212],
+  azure: [240, 255, 255],
+  beige: [245, 245, 220],
+  bisque: [255, 228, 196],
+  black: [0, 0, 0],
+  blanchedalmond: [255, 235, 205],
+  blue: [0, 0, 255],
+  blueviolet: [138, 43, 226],
+  brown: [165, 42, 42],
+  burlywood: [222, 184, 135],
+  cadetblue: [95, 158, 160],
+  chartreuse: [127, 255, 0],
+  chocolate: [210, 105, 30],
+  coral: [255, 127, 80],
+  cornflowerblue: [100, 149, 237],
+  cornsilk: [255, 248, 220],
+  crimson: [220, 20, 60],
+  cyan: [0, 255, 255],
+  darkblue: [0, 0, 139],
+  darkcyan: [0, 139, 139],
+  darkgoldenrod: [184, 134, 11],
+  darkgray: [169, 169, 169],
+  darkgreen: [0, 100, 0],
+  darkgrey: [169, 169, 169],
+  darkkhaki: [189, 183, 107],
+  darkmagenta: [139, 0, 139],
+  darkolivegreen: [85, 107, 47],
+  darkorange: [255, 140, 0],
+  darkorchid: [153, 50, 204],
+  darkred: [139, 0, 0],
+  darksalmon: [233, 150, 122],
+  darkseagreen: [143, 188, 143],
+  darkslateblue: [72, 61, 139],
+  darkslategray: [47, 79, 79],
+  darkslategrey: [47, 79, 79],
+  darkturquoise: [0, 206, 209],
+  darkviolet: [148, 0, 211],
+  deeppink: [255, 20, 147],
+  deepskyblue: [0, 191, 255],
+  dimgray: [105, 105, 105],
+  dimgrey: [105, 105, 105],
+  dodgerblue: [30, 144, 255],
+  firebrick: [178, 34, 34],
+  floralwhite: [255, 250, 240],
+  forestgreen: [34, 139, 34],
+  fuchsia: [255, 0, 255],
+  gainsboro: [220, 220, 220],
+  ghostwhite: [248, 248, 255],
+  gold: [255, 215, 0],
+  goldenrod: [218, 165, 32],
+  gray: [128, 128, 128],
+  green: [0, 128, 0],
+  greenyellow: [173, 255, 47],
+  grey: [128, 128, 128],
+  honeydew: [240, 255, 240],
+  hotpink: [255, 105, 180],
+  indianred: [205, 92, 92],
+  indigo: [75, 0, 130],
+  ivory: [255, 255, 240],
+  khaki: [240, 230, 140],
+  lavender: [230, 230, 250],
+  lavenderblush: [255, 240, 245],
+  lawngreen: [124, 252, 0],
+  lemonchiffon: [255, 250, 205],
+  lightblue: [173, 216, 230],
+  lightcoral: [240, 128, 128],
+  lightcyan: [224, 255, 255],
+  lightgoldenrodyellow: [250, 250, 210],
+  lightgray: [211, 211, 211],
+  lightgreen: [144, 238, 144],
+  lightgrey: [211, 211, 211],
+  lightpink: [255, 182, 193],
+  lightsalmon: [255, 160, 122],
+  lightseagreen: [32, 178, 170],
+  lightskyblue: [135, 206, 250],
+  lightslategray: [119, 136, 153],
+  lightslategrey: [119, 136, 153],
+  lightsteelblue: [176, 196, 222],
+  lightyellow: [255, 255, 224],
+  lime: [0, 255, 0],
+  limegreen: [50, 205, 50],
+  linen: [250, 240, 230],
+  magenta: [255, 0, 255],
+  maroon: [128, 0, 0],
+  mediumaquamarine: [102, 205, 170],
+  mediumblue: [0, 0, 205],
+  mediumorchid: [186, 85, 211],
+  mediumpurple: [147, 112, 219],
+  mediumseagreen: [60, 179, 113],
+  mediumslateblue: [123, 104, 238],
+  mediumspringgreen: [0, 250, 154],
+  mediumturquoise: [72, 209, 204],
+  mediumvioletred: [199, 21, 133],
+  midnightblue: [25, 25, 112],
+  mintcream: [245, 255, 250],
+  mistyrose: [255, 228, 225],
+  moccasin: [255, 228, 181],
+  navajowhite: [255, 222, 173],
+  navy: [0, 0, 128],
+  oldlace: [253, 245, 230],
+  olive: [128, 128, 0],
+  olivedrab: [107, 142, 35],
+  orange: [255, 165, 0],
+  orangered: [255, 69, 0],
+  orchid: [218, 112, 214],
+  palegoldenrod: [238, 232, 170],
+  palegreen: [152, 251, 152],
+  paleturquoise: [175, 238, 238],
+  palevioletred: [219, 112, 147],
+  papayawhip: [255, 239, 213],
+  peachpuff: [255, 218, 185],
+  peru: [205, 133, 63],
+  pink: [255, 192, 203],
+  plum: [221, 160, 221],
+  powderblue: [176, 224, 230],
+  purple: [128, 0, 128],
+  rebeccapurple: [102, 51, 153],
+  red: [255, 0, 0],
+  rosybrown: [188, 143, 143],
+  royalblue: [65, 105, 225],
+  saddlebrown: [139, 69, 19],
+  salmon: [250, 128, 114],
+  sandybrown: [244, 164, 96],
+  seagreen: [46, 139, 87],
+  seashell: [255, 245, 238],
+  sienna: [160, 82, 45],
+  silver: [192, 192, 192],
+  skyblue: [135, 206, 235],
+  slateblue: [106, 90, 205],
+  slategray: [112, 128, 144],
+  slategrey: [112, 128, 144],
+  snow: [255, 250, 250],
+  springgreen: [0, 255, 127],
+  steelblue: [70, 130, 180],
+  tan: [210, 180, 140],
+  teal: [0, 128, 128],
+  thistle: [216, 191, 216],
+  tomato: [255, 99, 71],
+  turquoise: [64, 224, 208],
+  violet: [238, 130, 238],
+  wheat: [245, 222, 179],
+  white: [255, 255, 255],
+  whitesmoke: [245, 245, 245],
+  yellow: [255, 255, 0],
+  yellowgreen: [154, 205, 50]
+};
+for (const key in colors2) Object.freeze(colors2[key]);
+var color_name_default2 = Object.freeze(colors2);
+
+// node_modules/color/node_modules/color-convert/conversions.js
 var reverseKeywords = {};
-for (const key of Object.keys(color_name_default)) {
-  reverseKeywords[color_name_default[key]] = key;
+for (const key of Object.keys(color_name_default2)) {
+  reverseKeywords[color_name_default2[key]] = key;
 }
 var convert = {
   rgb: { channels: 3, labels: "rgb" },
@@ -20084,8 +20251,8 @@ convert.rgb.keyword = function(rgb) {
   }
   let currentClosestDistance = Number.POSITIVE_INFINITY;
   let currentClosestKeyword;
-  for (const keyword of Object.keys(color_name_default)) {
-    const value = color_name_default[keyword];
+  for (const keyword of Object.keys(color_name_default2)) {
+    const value = color_name_default2[keyword];
     const distance = comparativeDistance(rgb, value);
     if (distance < currentClosestDistance) {
       currentClosestDistance = distance;
@@ -20095,7 +20262,7 @@ convert.rgb.keyword = function(rgb) {
   return currentClosestKeyword;
 };
 convert.keyword.rgb = function(keyword) {
-  return [...color_name_default[keyword]];
+  return [...color_name_default2[keyword]];
 };
 convert.rgb.xyz = function(rgb) {
   const r = srgbNonlinearTransformInv(rgb[0] / 255);
@@ -20653,7 +20820,7 @@ convert.rgb.gray = function(rgb) {
   return [value / 255 * 100];
 };
 
-// node_modules/color-convert/route.js
+// node_modules/color/node_modules/color-convert/route.js
 function buildGraph() {
   const graph = {};
   const models2 = Object.keys(conversions_default);
@@ -20719,7 +20886,7 @@ function route(fromModel) {
 }
 var route_default = route;
 
-// node_modules/color-convert/index.js
+// node_modules/color/node_modules/color-convert/index.js
 var convert2 = {};
 var models = Object.keys(conversions_default);
 function wrapRaw(fn) {
@@ -21356,7 +21523,7 @@ var ColorPickerEyeDropper = ({ className, ...props }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
     Button,
     {
-      className: cn("shrink-0 text-muted-foreground", className),
+      className: cn("shrink-0 text-muted-foreground shadow-none", className),
       onClick: handleEyeDropper,
       size: "icon",
       type: "button",
@@ -21388,26 +21555,23 @@ var ColorPickerFormat = ({ className, ...props }) => {
   const color = color_default.hsl(hue, saturation, lightness, alpha2 / 100);
   if (mode === "hex") {
     const hex = color.hex();
-    return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
       "div",
       {
         className: cn(
-          "-space-x-px relative flex w-full items-center rounded-md shadow-sm",
+          "-space-x-px relative flex w-full items-center rounded-[12px] shadow-none",
           className
         ),
         ...props,
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
-            Input,
-            {
-              className: "h-8 rounded-r-none bg-secondary px-2 text-xs shadow-none",
-              readOnly: true,
-              type: "text",
-              value: hex
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(PercentageInput, { value: alpha2 })
-        ]
+        children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+          Input,
+          {
+            className: "h-[32px] py-0 pr-10 bg-accent dark:bg-accent border-border placeholder:text-muted-foreground rounded-[12px] shadow-none w-full",
+            readOnly: true,
+            type: "text",
+            value: hex
+          }
+        )
       }
     );
   }
@@ -21636,14 +21800,11 @@ function ColorSelection({ setActiveView, lastView, onColorSelect, colorType = "C
       ] }) })
     ] }),
     colorPalettes.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: "w-full mb-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: "flex flex-row items-center justify-between w-full mb-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: "flex flex-row items-center gap-2 h-[44px]", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_lucide_react49.Hexagon, { className: "w-4 h-4 text-muted-foreground" }),
-          /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("p", { className: "text-sm font-medium", children: "Brand colors" })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(Button, { variant: "link", className: "text-sm pr-0 cursor-pointer", children: "Edit" })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: "w-full flex flex-col gap-4", children: colorPalettes.map((palette) => /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: "flex flex-row items-center justify-between w-full mb-1", children: /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: "flex flex-row items-center gap-2 h-[44px]", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_lucide_react49.Hexagon, { className: "w-4 h-4 text-muted-foreground" }),
+        /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("p", { className: "text-sm font-medium", children: "Brand colors" })
+      ] }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: "w-full flex flex-col gap-4", children: colorPalettes.map((palette) => palette.colors.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: "flex flex-col gap-2", children: [
         /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(Label, { className: "text-xs font-medium text-muted-foreground", children: palette.name }),
         /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: "w-full grid grid-cols-7 gap-2", children: palette.colors.map((c) => /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(ColorButton, { colorName: c.name, color: c.hex, onColorSelect, currentColor }, c.color_id)) })
       ] }, palette.palette_id)) })
@@ -24134,6 +24295,15 @@ var parseFontSize = (value) => {
 // src/core/editor/components/element-gear/text/toolbar.tsx
 var import_jsx_runtime102 = require("react/jsx-runtime");
 var ALIGNMENTS = ["left", "center", "right", "justify"];
+var TEXT_TYPE_TO_BRAND_FONT = {
+  h1: "heading",
+  h2: "subheading",
+  h3: "subheading",
+  paragraph: "body",
+  list: "body",
+  "numbered-list": "body",
+  ordered: "body"
+};
 var HEADING_MULTIPLIERS = {
   paragraph: 1,
   h1: 2,
@@ -24153,7 +24323,16 @@ var TextToolbar = () => {
   const textEditingStyles = useEditorStore((s) => s.textEditing?.styles);
   const template = useEditorStore((s) => s.template);
   const mergeFields = useEditorStore((s) => s.mergeFields);
+  const userData = useEditorStore((s) => s.userData);
   const { activeView, colorTarget, setActiveView, setColorType, setColorTarget } = useSidebarContext();
+  const brandFonts = (0, import_react71.useMemo)(() => {
+    const fonts = userData?.brand_kits?.[0]?.fonts ?? [];
+    const map = {};
+    for (const f of fonts) {
+      map[f.type] = f;
+    }
+    return map;
+  }, [userData]);
   const [updateCounter, forceUpdate] = (0, import_react71.useState)(0);
   const [overflowOpen, setOverflowOpen] = (0, import_react71.useState)(false);
   const isInSectionColumn = (0, import_react71.useMemo)(() => {
@@ -24277,8 +24456,28 @@ var TextToolbar = () => {
     };
     const level = levelMap[type];
     tiptapEditor.chain().focus().setHeadingLevel(level).run();
+    const brandFontType = TEXT_TYPE_TO_BRAND_FONT[type];
+    const brandFont = brandFontType ? brandFonts[brandFontType] : null;
+    if (brandFont) {
+      const { from, to } = tiptapEditor.state.selection;
+      const $from = tiptapEditor.state.doc.resolve(from);
+      const paragraphStart = $from.start($from.depth);
+      const paragraphEnd = $from.end($from.depth);
+      let chain = tiptapEditor.chain().setTextSelection({ from: paragraphStart, to: paragraphEnd }).setFontFamily(brandFont.family).setFontSize(`${brandFont.size}px`);
+      if (level > 0 && !brandFont.isBold) {
+        chain = chain.unsetMark("bold");
+      } else if (level === 0 && brandFont.isBold) {
+        chain = chain.setMark("bold");
+      }
+      if (brandFont.isItalic) {
+        chain = chain.setMark("italic");
+      } else {
+        chain = chain.unsetMark("italic");
+      }
+      chain.setTextSelection({ from, to }).focus().run();
+    }
     forceUpdate((n) => n + 1);
-  }, [tiptapEditor]);
+  }, [tiptapEditor, brandFonts]);
   const handleDelete = () => {
     if (focusIdx) {
       deleteElement(focusIdx);
@@ -28812,11 +29011,15 @@ function TemplatePage({
 
 // src/index.tsx
 init_configuration();
+init_validate();
 init_json2mjml();
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Editor,
   MAX_TEMPLATE_SIZE,
   TemplatePage,
-  json2mjml
+  campaign_validation_warnings,
+  json2mjml,
+  validate_campaign_onCreate,
+  validate_editor_onPreview
 });

package/dist/index.mjs

@@ -48,6 +48,7 @@ import {
   Tooltip,
   TooltipContent,
   TooltipTrigger,
+  campaign_validation_warnings,
   cn,
   formatBorder,
   getElementDisplayName,
@@ -59,8 +60,10 @@ import {
   parsePrice,
   setupDragImage,
   useEditorStore,
-  useSidebarContext
-} from "./chunk-FJ4KXNNM.mjs";
+  useSidebarContext,
+  validate_campaign_onCreate,
+  validate_editor_onPreview
+} from "./chunk-R3LRNUKL.mjs";
 
 // src/core/editor/components/email-template-v2/header.tsx
 import { ArrowLeftIcon, CopyIcon, MegaphoneIcon, MoreHorizontalIcon, PencilIcon, SendIcon, TrashIcon } from "lucide-react";
@@ -2761,7 +2764,7 @@ function useTemplateColors() {
   return useMemo3(() => getTemplateColors(template), [template]);
 }
 
-// node_modules/color-name/index.js
+// node_modules/color-string/node_modules/color-name/index.js
 var colors = {
   aliceblue: [240, 248, 255],
   antiquewhite: [250, 235, 215],
@@ -3083,10 +3086,164 @@ function hexDouble(number_) {
 }
 var color_string_default = cs;
 
-// node_modules/color-convert/conversions.js
+// node_modules/color/node_modules/color-name/index.js
+var colors2 = {
+  aliceblue: [240, 248, 255],
+  antiquewhite: [250, 235, 215],
+  aqua: [0, 255, 255],
+  aquamarine: [127, 255, 212],
+  azure: [240, 255, 255],
+  beige: [245, 245, 220],
+  bisque: [255, 228, 196],
+  black: [0, 0, 0],
+  blanchedalmond: [255, 235, 205],
+  blue: [0, 0, 255],
+  blueviolet: [138, 43, 226],
+  brown: [165, 42, 42],
+  burlywood: [222, 184, 135],
+  cadetblue: [95, 158, 160],
+  chartreuse: [127, 255, 0],
+  chocolate: [210, 105, 30],
+  coral: [255, 127, 80],
+  cornflowerblue: [100, 149, 237],
+  cornsilk: [255, 248, 220],
+  crimson: [220, 20, 60],
+  cyan: [0, 255, 255],
+  darkblue: [0, 0, 139],
+  darkcyan: [0, 139, 139],
+  darkgoldenrod: [184, 134, 11],
+  darkgray: [169, 169, 169],
+  darkgreen: [0, 100, 0],
+  darkgrey: [169, 169, 169],
+  darkkhaki: [189, 183, 107],
+  darkmagenta: [139, 0, 139],
+  darkolivegreen: [85, 107, 47],
+  darkorange: [255, 140, 0],
+  darkorchid: [153, 50, 204],
+  darkred: [139, 0, 0],
+  darksalmon: [233, 150, 122],
+  darkseagreen: [143, 188, 143],
+  darkslateblue: [72, 61, 139],
+  darkslategray: [47, 79, 79],
+  darkslategrey: [47, 79, 79],
+  darkturquoise: [0, 206, 209],
+  darkviolet: [148, 0, 211],
+  deeppink: [255, 20, 147],
+  deepskyblue: [0, 191, 255],
+  dimgray: [105, 105, 105],
+  dimgrey: [105, 105, 105],
+  dodgerblue: [30, 144, 255],
+  firebrick: [178, 34, 34],
+  floralwhite: [255, 250, 240],
+  forestgreen: [34, 139, 34],
+  fuchsia: [255, 0, 255],
+  gainsboro: [220, 220, 220],
+  ghostwhite: [248, 248, 255],
+  gold: [255, 215, 0],
+  goldenrod: [218, 165, 32],
+  gray: [128, 128, 128],
+  green: [0, 128, 0],
+  greenyellow: [173, 255, 47],
+  grey: [128, 128, 128],
+  honeydew: [240, 255, 240],
+  hotpink: [255, 105, 180],
+  indianred: [205, 92, 92],
+  indigo: [75, 0, 130],
+  ivory: [255, 255, 240],
+  khaki: [240, 230, 140],
+  lavender: [230, 230, 250],
+  lavenderblush: [255, 240, 245],
+  lawngreen: [124, 252, 0],
+  lemonchiffon: [255, 250, 205],
+  lightblue: [173, 216, 230],
+  lightcoral: [240, 128, 128],
+  lightcyan: [224, 255, 255],
+  lightgoldenrodyellow: [250, 250, 210],
+  lightgray: [211, 211, 211],
+  lightgreen: [144, 238, 144],
+  lightgrey: [211, 211, 211],
+  lightpink: [255, 182, 193],
+  lightsalmon: [255, 160, 122],
+  lightseagreen: [32, 178, 170],
+  lightskyblue: [135, 206, 250],
+  lightslategray: [119, 136, 153],
+  lightslategrey: [119, 136, 153],
+  lightsteelblue: [176, 196, 222],
+  lightyellow: [255, 255, 224],
+  lime: [0, 255, 0],
+  limegreen: [50, 205, 50],
+  linen: [250, 240, 230],
+  magenta: [255, 0, 255],
+  maroon: [128, 0, 0],
+  mediumaquamarine: [102, 205, 170],
+  mediumblue: [0, 0, 205],
+  mediumorchid: [186, 85, 211],
+  mediumpurple: [147, 112, 219],
+  mediumseagreen: [60, 179, 113],
+  mediumslateblue: [123, 104, 238],
+  mediumspringgreen: [0, 250, 154],
+  mediumturquoise: [72, 209, 204],
+  mediumvioletred: [199, 21, 133],
+  midnightblue: [25, 25, 112],
+  mintcream: [245, 255, 250],
+  mistyrose: [255, 228, 225],
+  moccasin: [255, 228, 181],
+  navajowhite: [255, 222, 173],
+  navy: [0, 0, 128],
+  oldlace: [253, 245, 230],
+  olive: [128, 128, 0],
+  olivedrab: [107, 142, 35],
+  orange: [255, 165, 0],
+  orangered: [255, 69, 0],
+  orchid: [218, 112, 214],
+  palegoldenrod: [238, 232, 170],
+  palegreen: [152, 251, 152],
+  paleturquoise: [175, 238, 238],
+  palevioletred: [219, 112, 147],
+  papayawhip: [255, 239, 213],
+  peachpuff: [255, 218, 185],
+  peru: [205, 133, 63],
+  pink: [255, 192, 203],
+  plum: [221, 160, 221],
+  powderblue: [176, 224, 230],
+  purple: [128, 0, 128],
+  rebeccapurple: [102, 51, 153],
+  red: [255, 0, 0],
+  rosybrown: [188, 143, 143],
+  royalblue: [65, 105, 225],
+  saddlebrown: [139, 69, 19],
+  salmon: [250, 128, 114],
+  sandybrown: [244, 164, 96],
+  seagreen: [46, 139, 87],
+  seashell: [255, 245, 238],
+  sienna: [160, 82, 45],
+  silver: [192, 192, 192],
+  skyblue: [135, 206, 235],
+  slateblue: [106, 90, 205],
+  slategray: [112, 128, 144],
+  slategrey: [112, 128, 144],
+  snow: [255, 250, 250],
+  springgreen: [0, 255, 127],
+  steelblue: [70, 130, 180],
+  tan: [210, 180, 140],
+  teal: [0, 128, 128],
+  thistle: [216, 191, 216],
+  tomato: [255, 99, 71],
+  turquoise: [64, 224, 208],
+  violet: [238, 130, 238],
+  wheat: [245, 222, 179],
+  white: [255, 255, 255],
+  whitesmoke: [245, 245, 245],
+  yellow: [255, 255, 0],
+  yellowgreen: [154, 205, 50]
+};
+for (const key in colors2) Object.freeze(colors2[key]);
+var color_name_default2 = Object.freeze(colors2);
+
+// node_modules/color/node_modules/color-convert/conversions.js
 var reverseKeywords = {};
-for (const key of Object.keys(color_name_default)) {
-  reverseKeywords[color_name_default[key]] = key;
+for (const key of Object.keys(color_name_default2)) {
+  reverseKeywords[color_name_default2[key]] = key;
 }
 var convert = {
   rgb: { channels: 3, labels: "rgb" },
@@ -3262,8 +3419,8 @@ convert.rgb.keyword = function(rgb) {
   }
   let currentClosestDistance = Number.POSITIVE_INFINITY;
   let currentClosestKeyword;
-  for (const keyword of Object.keys(color_name_default)) {
-    const value = color_name_default[keyword];
+  for (const keyword of Object.keys(color_name_default2)) {
+    const value = color_name_default2[keyword];
     const distance = comparativeDistance(rgb, value);
     if (distance < currentClosestDistance) {
       currentClosestDistance = distance;
@@ -3273,7 +3430,7 @@ convert.rgb.keyword = function(rgb) {
   return currentClosestKeyword;
 };
 convert.keyword.rgb = function(keyword) {
-  return [...color_name_default[keyword]];
+  return [...color_name_default2[keyword]];
 };
 convert.rgb.xyz = function(rgb) {
   const r = srgbNonlinearTransformInv(rgb[0] / 255);
@@ -3831,7 +3988,7 @@ convert.rgb.gray = function(rgb) {
   return [value / 255 * 100];
 };
 
-// node_modules/color-convert/route.js
+// node_modules/color/node_modules/color-convert/route.js
 function buildGraph() {
   const graph = {};
   const models2 = Object.keys(conversions_default);
@@ -3897,7 +4054,7 @@ function route(fromModel) {
 }
 var route_default = route;
 
-// node_modules/color-convert/index.js
+// node_modules/color/node_modules/color-convert/index.js
 var convert2 = {};
 var models = Object.keys(conversions_default);
 function wrapRaw(fn) {
@@ -4540,7 +4697,7 @@ var ColorPickerEyeDropper = ({ className, ...props }) => {
   return /* @__PURE__ */ jsx25(
     Button,
     {
-      className: cn("shrink-0 text-muted-foreground", className),
+      className: cn("shrink-0 text-muted-foreground shadow-none", className),
       onClick: handleEyeDropper,
       size: "icon",
       type: "button",
@@ -4572,26 +4729,23 @@ var ColorPickerFormat = ({ className, ...props }) => {
   const color = color_default.hsl(hue, saturation, lightness, alpha / 100);
   if (mode === "hex") {
     const hex = color.hex();
-    return /* @__PURE__ */ jsxs23(
+    return /* @__PURE__ */ jsx25(
       "div",
       {
         className: cn(
-          "-space-x-px relative flex w-full items-center rounded-md shadow-sm",
+          "-space-x-px relative flex w-full items-center rounded-[12px] shadow-none",
           className
         ),
         ...props,
-        children: [
-          /* @__PURE__ */ jsx25(
-            Input,
-            {
-              className: "h-8 rounded-r-none bg-secondary px-2 text-xs shadow-none",
-              readOnly: true,
-              type: "text",
-              value: hex
-            }
-          ),
-          /* @__PURE__ */ jsx25(PercentageInput, { value: alpha })
-        ]
+        children: /* @__PURE__ */ jsx25(
+          Input,
+          {
+            className: "h-[32px] py-0 pr-10 bg-accent dark:bg-accent border-border placeholder:text-muted-foreground rounded-[12px] shadow-none w-full",
+            readOnly: true,
+            type: "text",
+            value: hex
+          }
+        )
       }
     );
   }
@@ -4820,14 +4974,11 @@ function ColorSelection({ setActiveView, lastView, onColorSelect, colorType = "C
       ] }) })
     ] }),
     colorPalettes.length > 0 && /* @__PURE__ */ jsxs24("div", { className: "w-full mb-4", children: [
-      /* @__PURE__ */ jsxs24("div", { className: "flex flex-row items-center justify-between w-full mb-1", children: [
-        /* @__PURE__ */ jsxs24("div", { className: "flex flex-row items-center gap-2 h-[44px]", children: [
-          /* @__PURE__ */ jsx26(Hexagon, { className: "w-4 h-4 text-muted-foreground" }),
-          /* @__PURE__ */ jsx26("p", { className: "text-sm font-medium", children: "Brand colors" })
-        ] }),
-        /* @__PURE__ */ jsx26(Button, { variant: "link", className: "text-sm pr-0 cursor-pointer", children: "Edit" })
-      ] }),
-      /* @__PURE__ */ jsx26("div", { className: "w-full flex flex-col gap-4", children: colorPalettes.map((palette) => /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsx26("div", { className: "flex flex-row items-center justify-between w-full mb-1", children: /* @__PURE__ */ jsxs24("div", { className: "flex flex-row items-center gap-2 h-[44px]", children: [
+        /* @__PURE__ */ jsx26(Hexagon, { className: "w-4 h-4 text-muted-foreground" }),
+        /* @__PURE__ */ jsx26("p", { className: "text-sm font-medium", children: "Brand colors" })
+      ] }) }),
+      /* @__PURE__ */ jsx26("div", { className: "w-full flex flex-col gap-4", children: colorPalettes.map((palette) => palette.colors.length > 0 && /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-2", children: [
         /* @__PURE__ */ jsx26(Label, { className: "text-xs font-medium text-muted-foreground", children: palette.name }),
         /* @__PURE__ */ jsx26("div", { className: "w-full grid grid-cols-7 gap-2", children: palette.colors.map((c) => /* @__PURE__ */ jsx26(ColorButton, { colorName: c.name, color: c.hex, onColorSelect, currentColor }, c.color_id)) })
       ] }, palette.palette_id)) })
@@ -7236,6 +7387,15 @@ var parseFontSize = (value) => {
 // src/core/editor/components/element-gear/text/toolbar.tsx
 import { Fragment as Fragment4, jsx as jsx50, jsxs as jsxs39 } from "react/jsx-runtime";
 var ALIGNMENTS = ["left", "center", "right", "justify"];
+var TEXT_TYPE_TO_BRAND_FONT = {
+  h1: "heading",
+  h2: "subheading",
+  h3: "subheading",
+  paragraph: "body",
+  list: "body",
+  "numbered-list": "body",
+  ordered: "body"
+};
 var HEADING_MULTIPLIERS = {
   paragraph: 1,
   h1: 2,
@@ -7255,7 +7415,16 @@ var TextToolbar = () => {
   const textEditingStyles = useEditorStore((s) => s.textEditing?.styles);
   const template = useEditorStore((s) => s.template);
   const mergeFields = useEditorStore((s) => s.mergeFields);
+  const userData = useEditorStore((s) => s.userData);
   const { activeView, colorTarget, setActiveView, setColorType, setColorTarget } = useSidebarContext();
+  const brandFonts = useMemo14(() => {
+    const fonts = userData?.brand_kits?.[0]?.fonts ?? [];
+    const map = {};
+    for (const f of fonts) {
+      map[f.type] = f;
+    }
+    return map;
+  }, [userData]);
   const [updateCounter, forceUpdate] = useState17(0);
   const [overflowOpen, setOverflowOpen] = useState17(false);
   const isInSectionColumn = useMemo14(() => {
@@ -7379,8 +7548,28 @@ var TextToolbar = () => {
     };
     const level = levelMap[type];
     tiptapEditor.chain().focus().setHeadingLevel(level).run();
+    const brandFontType = TEXT_TYPE_TO_BRAND_FONT[type];
+    const brandFont = brandFontType ? brandFonts[brandFontType] : null;
+    if (brandFont) {
+      const { from, to } = tiptapEditor.state.selection;
+      const $from = tiptapEditor.state.doc.resolve(from);
+      const paragraphStart = $from.start($from.depth);
+      const paragraphEnd = $from.end($from.depth);
+      let chain = tiptapEditor.chain().setTextSelection({ from: paragraphStart, to: paragraphEnd }).setFontFamily(brandFont.family).setFontSize(`${brandFont.size}px`);
+      if (level > 0 && !brandFont.isBold) {
+        chain = chain.unsetMark("bold");
+      } else if (level === 0 && brandFont.isBold) {
+        chain = chain.setMark("bold");
+      }
+      if (brandFont.isItalic) {
+        chain = chain.setMark("italic");
+      } else {
+        chain = chain.unsetMark("italic");
+      }
+      chain.setTextSelection({ from, to }).focus().run();
+    }
     forceUpdate((n) => n + 1);
-  }, [tiptapEditor]);
+  }, [tiptapEditor, brandFonts]);
   const handleDelete = () => {
     if (focusIdx) {
       deleteElement(focusIdx);
@@ -11709,7 +11898,7 @@ function useAutoSave() {
 // src/core/editor/components/email-template-v2/template-page.tsx
 import "react-json-view-lite/dist/index.css";
 import { jsx as jsx74, jsxs as jsxs59 } from "react/jsx-runtime";
-var Editor2 = lazy(() => import("./core-OW5KVXX7.mjs").then((module) => ({
+var Editor2 = lazy(() => import("./core-HIQH4BAG.mjs").then((module) => ({
   default: module.Editor
 })));
 function TemplatePage({
@@ -11792,5 +11981,8 @@ export {
   Editor,
   MAX_TEMPLATE_SIZE,
   TemplatePage,
-  json2mjml
+  campaign_validation_warnings,
+  json2mjml,
+  validate_campaign_onCreate,
+  validate_editor_onPreview
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kgalexander/mcreate",
-  "version": "1.0.8",
+  "version": "1.0.9",
   "description": "Maillow email template editor",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",