@marlinjai/email-editor-core 0.2.0

package/dist/chunk-2ZL7A2I6.mjs

@@ -0,0 +1,1029 @@
+// src/schema/gradient.ts
+function buildGradientCSS(gradient) {
+  if (gradient.stops.length === 0) return void 0;
+  const stopList = gradient.stops.map((s) => `${s.color} ${s.position}%`).join(", ");
+  if (gradient.type === "radial") {
+    return `radial-gradient(circle, ${stopList})`;
+  }
+  return `linear-gradient(${gradient.angle}deg, ${stopList})`;
+}
+
+// src/schema/types.ts
+function isWrapper(item) {
+  return item.type === "wrapper";
+}
+function allSections(items) {
+  return items.flatMap((item) => isWrapper(item) ? item.sections : [item]);
+}
+
+// src/schema/validation.ts
+import { z } from "zod";
+var SpacingSchema = z.object({
+  top: z.string().optional(),
+  right: z.string().optional(),
+  bottom: z.string().optional(),
+  left: z.string().optional()
+});
+var GradientStopSchema = z.object({
+  color: z.string().min(1),
+  position: z.number().min(0).max(100)
+});
+var BackgroundGradientSchema = z.object({
+  type: z.enum(["linear", "radial"]),
+  angle: z.number().min(0).max(360),
+  stops: z.array(GradientStopSchema).min(1)
+});
+var ExtraAttributesSchema = z.record(z.string().regex(/^[a-z][a-z0-9-]*$/), z.string());
+var MjmlHeadSchema = z.object({
+  attributes: z.string().optional(),
+  bodyAttributes: ExtraAttributesSchema.optional(),
+  headRaw: z.string().optional()
+});
+var CustomFontSchema = z.object({
+  name: z.string(),
+  href: z.string()
+});
+var TemplateMetadataSchema = z.object({
+  name: z.string().optional(),
+  subject: z.string().optional(),
+  previewText: z.string().optional(),
+  title: z.string().optional(),
+  // Epoch milliseconds (what the editor's store emits) or an ISO 8601 string.
+  createdAt: z.union([z.string(), z.number()]).optional(),
+  updatedAt: z.union([z.string(), z.number()]).optional(),
+  // Head component settings
+  fonts: z.array(CustomFontSchema).optional(),
+  breakpoint: z.string().optional(),
+  customCSS: z.string().optional(),
+  inlineCSS: z.string().optional(),
+  mjmlHead: MjmlHeadSchema.optional()
+});
+var TextBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("text"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  content: z.string(),
+  align: z.enum(["left", "center", "right", "justify"]).optional(),
+  color: z.string().optional(),
+  fontSize: z.string().optional(),
+  fontFamily: z.string().optional(),
+  padding: SpacingSchema.optional(),
+  lineHeight: z.string().optional()
+});
+var ImageBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("image"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  src: z.string().min(1),
+  // Allow any non-empty string, not just URLs
+  alt: z.string().optional(),
+  width: z.string().optional(),
+  height: z.string().optional(),
+  align: z.enum(["left", "center", "right"]).optional(),
+  href: z.string().optional(),
+  // Allow any string for link
+  padding: SpacingSchema.optional(),
+  borderRadius: z.string().optional()
+  // Rounded corners
+});
+var ButtonBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("button"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  label: z.string().min(1),
+  href: z.string().min(1),
+  // Allow any non-empty string
+  align: z.enum(["left", "center", "right"]).optional(),
+  backgroundColor: z.string().optional(),
+  color: z.string().optional(),
+  borderRadius: z.string().optional(),
+  border: z.string().optional(),
+  // CSS border shorthand
+  padding: SpacingSchema.optional(),
+  innerPadding: z.string().optional()
+});
+var DividerBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("divider"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  borderColor: z.string().optional(),
+  borderWidth: z.string().optional(),
+  borderStyle: z.enum(["solid", "dashed", "dotted"]).optional(),
+  width: z.string().optional(),
+  // Width of the divider line
+  padding: SpacingSchema.optional()
+});
+var SpacerBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("spacer"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  height: z.string()
+});
+var HeaderBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("header"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  locked: z.literal(true)
+});
+var FooterBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("footer"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  locked: z.literal(true)
+});
+var SocialBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("social"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  mode: z.enum(["horizontal", "vertical"]).optional(),
+  align: z.enum(["left", "center", "right"]).optional(),
+  iconSize: z.string().optional(),
+  iconPadding: z.string().optional(),
+  borderRadius: z.string().optional(),
+  // For round icons
+  links: z.array(
+    z.object({
+      platform: z.enum(["facebook", "twitter", "instagram", "linkedin", "youtube", "pinterest", "github"]),
+      url: z.string(),
+      color: z.string().optional()
+      // Per-icon color override (uses platform default if not set)
+    })
+  )
+});
+var HeroBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("hero"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  backgroundImage: z.string().min(1),
+  backgroundHeight: z.string().optional(),
+  backgroundWidth: z.string().optional(),
+  backgroundColor: z.string().optional(),
+  verticalAlign: z.enum(["top", "middle", "bottom"]).optional(),
+  mode: z.enum(["fluid-height", "fixed-height"]).optional()
+});
+var AccordionBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("accordion"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  items: z.array(
+    z.object({
+      title: z.string(),
+      content: z.string()
+    })
+  ),
+  iconPosition: z.enum(["left", "right"]).optional(),
+  borderColor: z.string().optional(),
+  fontFamily: z.string().optional()
+});
+var RawBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("raw"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  html: z.string()
+});
+var NavbarBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("navbar"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  links: z.array(
+    z.object({
+      label: z.string(),
+      href: z.string(),
+      color: z.string().optional()
+    })
+  ),
+  hamburger: z.boolean().optional(),
+  baseUrl: z.string().optional(),
+  align: z.enum(["left", "center", "right"]).optional(),
+  icoColor: z.string().optional(),
+  padding: SpacingSchema.optional()
+});
+var CarouselBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("carousel"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  images: z.array(
+    z.object({
+      src: z.string(),
+      alt: z.string().optional(),
+      href: z.string().optional(),
+      thumbnailSrc: z.string().optional()
+    })
+  ),
+  thumbnails: z.enum(["visible", "hidden"]).optional(),
+  borderRadius: z.string().optional(),
+  iconWidth: z.string().optional(),
+  tbBorderRadius: z.string().optional(),
+  padding: SpacingSchema.optional()
+});
+var TableBlockSchema = z.object({
+  id: z.string(),
+  type: z.literal("table"),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  headers: z.array(z.string()),
+  rows: z.array(z.array(z.string())),
+  align: z.enum(["left", "center", "right"]).optional(),
+  color: z.string().optional(),
+  fontFamily: z.string().optional(),
+  fontSize: z.string().optional(),
+  cellpadding: z.string().optional(),
+  cellspacing: z.string().optional(),
+  border: z.string().optional(),
+  padding: SpacingSchema.optional()
+});
+var BlockSchema = z.discriminatedUnion("type", [
+  TextBlockSchema,
+  ImageBlockSchema,
+  ButtonBlockSchema,
+  DividerBlockSchema,
+  SpacerBlockSchema,
+  HeaderBlockSchema,
+  FooterBlockSchema,
+  SocialBlockSchema,
+  HeroBlockSchema,
+  AccordionBlockSchema,
+  RawBlockSchema,
+  NavbarBlockSchema,
+  CarouselBlockSchema,
+  TableBlockSchema
+]);
+var ColumnSchema = z.object({
+  id: z.string(),
+  width: z.number().min(0).max(100).optional(),
+  backgroundColor: z.string().optional(),
+  backgroundGradient: BackgroundGradientSchema.optional(),
+  padding: SpacingSchema.optional(),
+  verticalAlign: z.enum(["top", "middle", "bottom"]).optional(),
+  // Vertical content alignment
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  blocks: z.array(BlockSchema)
+});
+var sectionFields = {
+  id: z.string(),
+  type: z.literal("section"),
+  backgroundColor: z.string().optional(),
+  backgroundImage: z.string().optional(),
+  backgroundPosition: z.string().optional(),
+  backgroundRepeat: z.enum(["repeat", "no-repeat"]).optional(),
+  backgroundSize: z.string().optional(),
+  backgroundGradient: BackgroundGradientSchema.optional(),
+  padding: SpacingSchema.optional(),
+  noStack: z.boolean().optional(),
+  fullWidth: z.boolean().optional(),
+  hidden: z.boolean().optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  bodyRaw: z.boolean().optional(),
+  columns: z.array(ColumnSchema).min(1)
+};
+var SectionSchema = z.object({
+  ...sectionFields,
+  isWrapper: z.undefined({ invalid_type_error: "isWrapper is a schema 1.0 field; a 1.1 document holds a wrapper instead" }).optional()
+});
+var SectionSchemaV1_0 = z.object({
+  ...sectionFields,
+  isWrapper: z.boolean().optional()
+});
+var WrapperSchema = z.object({
+  id: z.string(),
+  type: z.literal("wrapper"),
+  hidden: z.boolean().optional(),
+  backgroundColor: z.string().optional(),
+  backgroundImage: z.string().optional(),
+  backgroundGradient: BackgroundGradientSchema.optional(),
+  backgroundPosition: z.string().optional(),
+  backgroundRepeat: z.enum(["repeat", "no-repeat"]).optional(),
+  backgroundSize: z.string().optional(),
+  border: z.string().optional(),
+  borderTop: z.string().optional(),
+  borderRight: z.string().optional(),
+  borderBottom: z.string().optional(),
+  borderLeft: z.string().optional(),
+  borderRadius: z.string().optional(),
+  padding: SpacingSchema.optional(),
+  fullWidth: z.boolean().optional(),
+  cssClass: z.string().optional(),
+  gap: z.string().regex(/^[0-9]+(\.[0-9]+)?px$/, "gap is a length in px, e.g. 16px").optional(),
+  textAlign: z.enum(["left", "center", "right"]).optional(),
+  extraAttributes: ExtraAttributesSchema.optional(),
+  sections: z.array(SectionSchema)
+});
+var TopLevelItemSchema = z.discriminatedUnion("type", [SectionSchema, WrapperSchema]);
+var EmailTemplateSchemaV1_0 = z.object({
+  id: z.string().optional(),
+  version: z.literal("1.0"),
+  metadata: TemplateMetadataSchema,
+  sections: z.array(SectionSchemaV1_0)
+});
+var EmailTemplateSchemaV1_1 = z.object({
+  id: z.string().optional(),
+  version: z.literal("1.1"),
+  metadata: TemplateMetadataSchema,
+  sections: z.array(TopLevelItemSchema)
+});
+var EmailTemplateSchema = z.discriminatedUnion("version", [EmailTemplateSchemaV1_0, EmailTemplateSchemaV1_1]);
+function validateTemplate(template) {
+  return EmailTemplateSchema.safeParse(template);
+}
+
+// src/schema/migrate.ts
+import { nanoid } from "nanoid";
+var CURRENT_TEMPLATE_VERSION = "1.1";
+var SUPPORTED_TEMPLATE_VERSIONS = ["1.0", CURRENT_TEMPLATE_VERSION];
+var TemplateMigrationError = class extends Error {
+  constructor(code, message, options = {}) {
+    super(message);
+    this.name = "TemplateMigrationError";
+    this.code = code;
+    this.version = options.version;
+    this.issues = options.issues ?? [];
+  }
+};
+function isTemplateMigrationError(error) {
+  return error instanceof TemplateMigrationError;
+}
+function parseVersion(version) {
+  const match = /^(\d+)\.(\d+)$/.exec(version);
+  if (!match) return null;
+  return [Number(match[1]), Number(match[2])];
+}
+function compareVersions(a, b) {
+  return a[0] !== b[0] ? a[0] - b[0] : a[1] - b[1];
+}
+function migrateTemplate(doc) {
+  if (typeof doc !== "object" || doc === null || Array.isArray(doc)) {
+    throw new TemplateMigrationError(
+      "INVALID_INPUT",
+      `Expected a template document object, received ${doc === null ? "null" : Array.isArray(doc) ? "an array" : typeof doc}.`
+    );
+  }
+  const version = doc.version;
+  if (typeof version !== "string" || version.length === 0) {
+    throw new TemplateMigrationError(
+      "MISSING_VERSION",
+      'The template document has no "version" field, so its schema cannot be determined.'
+    );
+  }
+  const parsed = parseVersion(version);
+  if (!parsed) {
+    throw new TemplateMigrationError(
+      "UNSUPPORTED_VERSION",
+      `Template schema version "${version}" is not of the form "major.minor".`,
+      { version }
+    );
+  }
+  const current = parseVersion(CURRENT_TEMPLATE_VERSION);
+  if (compareVersions(parsed, current) > 0) {
+    throw new TemplateMigrationError(
+      "NEWER_VERSION",
+      `Template schema version "${version}" is newer than this editor supports (${CURRENT_TEMPLATE_VERSION}). Upgrade the @marlinjai/email-editor packages to open it.`,
+      { version }
+    );
+  }
+  if (!SUPPORTED_TEMPLATE_VERSIONS.includes(version)) {
+    throw new TemplateMigrationError(
+      "UNSUPPORTED_VERSION",
+      `Template schema version "${version}" is not supported and has no migration to ${CURRENT_TEMPLATE_VERSION}.`,
+      { version }
+    );
+  }
+  let next = doc;
+  if (version === "1.0") {
+    assertValid(EmailTemplateSchemaV1_0, next, version);
+    next = migrateV1_0ToV1_1(next);
+  }
+  assertValid(EmailTemplateSchemaV1_1, next, version);
+  return next;
+}
+function assertValid(schema, doc, version) {
+  const result = schema.safeParse(doc);
+  if (result.success) return;
+  const issues = result.error.issues.map((issue) => ({ path: issue.path, message: issue.message }));
+  const first = issues[0];
+  throw new TemplateMigrationError(
+    "INVALID_DOCUMENT",
+    `Template document does not match schema version ${version}: ${first ? `${first.path.join(".") || "(root)"}: ${first.message}` : "unknown validation error"}${issues.length > 1 ? ` (and ${issues.length - 1} more)` : ""}.`,
+    { version, issues }
+  );
+}
+function migrateV1_0ToV1_1(doc) {
+  if (!doc.sections.some((s) => s.isWrapper === true && !s.bodyRaw)) {
+    return { ...doc, version: "1.1", sections: doc.sections.map(stripIsWrapper) };
+  }
+  const ids = /* @__PURE__ */ new Set();
+  for (const s of doc.sections) {
+    ids.add(s.id);
+    for (const c of s.columns ?? []) {
+      ids.add(c.id);
+      for (const b of c.blocks ?? []) ids.add(b.id);
+    }
+  }
+  const freshId = (base) => {
+    let candidate = `${base}-inner`;
+    for (let n = 2; ids.has(candidate); n++) candidate = `${base}-inner-${n}`;
+    ids.add(candidate);
+    return candidate;
+  };
+  const sections = doc.sections.map((s) => {
+    if (s.isWrapper !== true || s.bodyRaw) return stripIsWrapper(s);
+    const { isWrapper: _flag, noStack: _noStack, ...rest } = s;
+    const wrapper = { id: s.id, type: "wrapper", sections: [{ id: freshId(s.id), type: "section", columns: s.columns }] };
+    if (rest.hidden !== void 0) wrapper.hidden = rest.hidden;
+    if (rest.backgroundColor !== void 0) wrapper.backgroundColor = rest.backgroundColor;
+    if (rest.backgroundImage !== void 0) wrapper.backgroundImage = rest.backgroundImage;
+    if (rest.backgroundGradient !== void 0) wrapper.backgroundGradient = rest.backgroundGradient;
+    if (rest.backgroundPosition !== void 0) wrapper.backgroundPosition = rest.backgroundPosition;
+    if (rest.backgroundRepeat !== void 0) wrapper.backgroundRepeat = rest.backgroundRepeat;
+    if (rest.backgroundSize !== void 0) wrapper.backgroundSize = rest.backgroundSize;
+    if (rest.fullWidth !== void 0) wrapper.fullWidth = rest.fullWidth;
+    if (rest.padding !== void 0) wrapper.padding = rest.padding;
+    if (rest.extraAttributes !== void 0) wrapper.extraAttributes = rest.extraAttributes;
+    return wrapper;
+  });
+  return { ...doc, version: "1.1", sections };
+}
+function stripIsWrapper(s) {
+  if (!("isWrapper" in s)) return s;
+  const { isWrapper: _flag, ...rest } = s;
+  return rest;
+}
+function withTemplateId(doc) {
+  if (typeof doc.id === "string" && doc.id.length > 0) return doc;
+  return { ...doc, id: nanoid() };
+}
+
+// src/store/mst/models/BlockModel.ts
+import { types } from "mobx-state-tree";
+
+// src/store/mst/models/spacingSnapshot.ts
+var SIDES = [
+  ["top", "paddingTop"],
+  ["right", "paddingRight"],
+  ["bottom", "paddingBottom"],
+  ["left", "paddingLeft"]
+];
+function paddingIn(snapshot) {
+  if (!snapshot || typeof snapshot !== "object") return snapshot;
+  const { padding, ...rest } = snapshot;
+  if (padding === void 0) return snapshot;
+  const flat = rest;
+  if (padding && typeof padding === "object") {
+    for (const [side, field] of SIDES) {
+      const value = padding[side];
+      if (flat[field] === void 0 && typeof value === "string" && value !== "") flat[field] = value;
+    }
+  }
+  return flat;
+}
+function paddingOut(snapshot) {
+  if (!snapshot || typeof snapshot !== "object") return snapshot;
+  const { paddingTop, paddingRight, paddingBottom, paddingLeft, ...rest } = snapshot;
+  const values = {
+    top: paddingTop,
+    right: paddingRight,
+    bottom: paddingBottom,
+    left: paddingLeft
+  };
+  const padding = {};
+  for (const [side] of SIDES) {
+    const value = values[side];
+    if (typeof value === "string" && value !== "") padding[side] = value;
+  }
+  return Object.keys(padding).length > 0 ? { ...rest, padding } : rest;
+}
+
+// src/store/mst/models/filledDefaults.ts
+var same = (a, b) => JSON.stringify(a) === JSON.stringify(b);
+function fillDefaults(snapshot, defaults) {
+  if (!snapshot || typeof snapshot !== "object") return snapshot;
+  const s = { ...snapshot };
+  const filled = { ...s.filled ?? {} };
+  for (const [key, make] of Object.entries(defaults)) {
+    if (s[key] !== void 0) continue;
+    const value = make();
+    s[key] = value;
+    filled[key] = value;
+  }
+  if (Object.keys(filled).length > 0) s.filled = filled;
+  return s;
+}
+function dropFilled(snapshot) {
+  if (!snapshot || typeof snapshot !== "object") return snapshot;
+  const { filled, ...rest } = snapshot;
+  if (filled) {
+    for (const [key, value] of Object.entries(filled)) {
+      if (same(rest[key], value)) delete rest[key];
+    }
+  }
+  for (const key of Object.keys(rest)) if (rest[key] === void 0) delete rest[key];
+  return rest;
+}
+var empty = () => [];
+var no = () => false;
+var BLOCK_DEFAULTS = {
+  hidden: no,
+  content: () => "",
+  links: empty,
+  items: empty,
+  navLinks: empty,
+  hamburger: no,
+  images: empty,
+  headers: empty,
+  rows: empty,
+  locked: no
+};
+var COLUMN_DEFAULTS = {
+  width: () => 100,
+  hidden: no,
+  subColumns: empty
+};
+var SECTION_DEFAULTS = {
+  type: () => "section",
+  fullWidth: no,
+  noStack: no,
+  hidden: no
+};
+var WRAPPER_DEFAULTS = {
+  hidden: no,
+  fullWidth: no
+};
+function fillColumnWidths(section) {
+  if (!section || typeof section !== "object") return section;
+  const s = section;
+  if (!Array.isArray(s.columns) || s.columns.length === 0) return section;
+  if (s.columns.every((c) => c?.width !== void 0)) return section;
+  const share = 100 / s.columns.length;
+  return {
+    ...s,
+    columns: s.columns.map((c) => {
+      const col = c;
+      if (!col || typeof col !== "object" || col.width !== void 0) return c;
+      return { ...col, width: share, filled: { ...col.filled ?? {}, width: share } };
+    })
+  };
+}
+
+// src/store/mst/models/BlockModel.ts
+var BlockType = /* @__PURE__ */ ((BlockType2) => {
+  BlockType2["TEXT"] = "text";
+  BlockType2["IMAGE"] = "image";
+  BlockType2["BUTTON"] = "button";
+  BlockType2["DIVIDER"] = "divider";
+  BlockType2["SPACER"] = "spacer";
+  BlockType2["SOCIAL"] = "social";
+  BlockType2["HERO"] = "hero";
+  BlockType2["ACCORDION"] = "accordion";
+  BlockType2["RAW"] = "raw";
+  BlockType2["NAVBAR"] = "navbar";
+  BlockType2["CAROUSEL"] = "carousel";
+  BlockType2["TABLE"] = "table";
+  BlockType2["HEADER"] = "header";
+  BlockType2["FOOTER"] = "footer";
+  return BlockType2;
+})(BlockType || {});
+var SocialLinkModel = types.model("SocialLink", {
+  platform: types.string,
+  url: types.string,
+  color: types.maybe(types.string)
+});
+var NavbarLinkModel = types.model("NavbarLink", {
+  href: types.string,
+  label: types.string,
+  color: types.maybe(types.string)
+});
+var CarouselImageModel = types.model("CarouselImage", {
+  src: types.string,
+  alt: types.maybe(types.string),
+  href: types.maybe(types.string),
+  thumbnailSrc: types.maybe(types.string)
+});
+var AccordionItemModel = types.model("AccordionItem", {
+  title: types.string,
+  content: types.string
+});
+var SpacingModel = types.model("Spacing", {
+  top: types.maybe(types.string),
+  right: types.maybe(types.string),
+  bottom: types.maybe(types.string),
+  left: types.maybe(types.string)
+});
+var BlockModelBase = types.model("Block", {
+  id: types.identifier,
+  type: types.enumeration("BlockType", Object.values(BlockType)),
+  hidden: types.optional(types.boolean, false),
+  // === Common Text Properties ===
+  content: types.optional(types.string, ""),
+  color: types.maybe(types.string),
+  backgroundColor: types.maybe(types.string),
+  fontSize: types.maybe(types.string),
+  fontFamily: types.maybe(types.string),
+  align: types.maybe(types.enumeration(["left", "center", "right", "justify"])),
+  lineHeight: types.maybe(types.string),
+  // === Spacing ===
+  paddingTop: types.maybe(types.string),
+  paddingRight: types.maybe(types.string),
+  paddingBottom: types.maybe(types.string),
+  paddingLeft: types.maybe(types.string),
+  // === Image Properties ===
+  src: types.maybe(types.string),
+  alt: types.maybe(types.string),
+  width: types.maybe(types.string),
+  height: types.maybe(types.string),
+  // === Button Properties ===
+  href: types.maybe(types.string),
+  label: types.maybe(types.string),
+  borderRadius: types.maybe(types.string),
+  border: types.maybe(types.string),
+  innerPadding: types.maybe(types.string),
+  // === Divider Properties ===
+  borderColor: types.maybe(types.string),
+  borderWidth: types.maybe(types.string),
+  borderStyle: types.maybe(types.enumeration(["solid", "dashed", "dotted"])),
+  // === Spacer Properties ===
+  // (uses height from image properties)
+  // === Social Properties ===
+  links: types.optional(types.array(SocialLinkModel), []),
+  iconSize: types.maybe(types.string),
+  iconPadding: types.maybe(types.string),
+  mode: types.maybe(types.enumeration(["horizontal", "vertical", "fixed-height", "fluid-height"])),
+  // === Hero Properties ===
+  backgroundImage: types.maybe(types.string),
+  backgroundHeight: types.maybe(types.string),
+  backgroundWidth: types.maybe(types.string),
+  verticalAlign: types.maybe(types.enumeration(["top", "middle", "bottom"])),
+  // === Accordion Properties ===
+  items: types.optional(types.array(AccordionItemModel), []),
+  iconPosition: types.maybe(types.enumeration(["left", "right"])),
+  // === Raw Properties ===
+  html: types.maybe(types.string),
+  // === Navbar Properties ===
+  navLinks: types.optional(types.array(NavbarLinkModel), []),
+  hamburger: types.optional(types.boolean, false),
+  baseUrl: types.maybe(types.string),
+  icoColor: types.maybe(types.string),
+  // === Carousel Properties ===
+  images: types.optional(types.array(CarouselImageModel), []),
+  thumbnails: types.maybe(types.enumeration(["visible", "hidden"])),
+  iconWidth: types.maybe(types.string),
+  tbBorderRadius: types.maybe(types.string),
+  // === Table Properties ===
+  headers: types.optional(types.array(types.string), []),
+  rows: types.optional(types.array(types.array(types.string)), []),
+  cellpadding: types.maybe(types.string),
+  cellspacing: types.maybe(types.string),
+  // === Locked Blocks (Header/Footer) ===
+  locked: types.optional(types.boolean, false),
+  // === MJML attributes the inspector has no control for (kept from an import) ===
+  extraAttributes: types.maybe(types.frozen()),
+  /** Defaults the store filled when it opened the node; they go back out only if changed (see `filledDefaults.ts`). */
+  filled: types.maybe(types.frozen())
+}).actions((self) => ({
+  /**
+   * Update any style property by name
+   */
+  updateStyle(property, value) {
+    if (property in self) {
+      self[property] = value;
+    }
+  },
+  /**
+   * Update multiple properties at once
+   */
+  updateProperties(updates) {
+    Object.entries(updates).forEach(([key, value]) => {
+      if (key in self) {
+        self[key] = value;
+      }
+    });
+  },
+  /**
+   * Set block content (for text blocks)
+   */
+  setContent(content) {
+    self.content = content;
+  },
+  /**
+   * Toggle block visibility
+   */
+  toggleHidden() {
+    self.hidden = !self.hidden;
+  },
+  /**
+   * Set padding values
+   */
+  setPadding(padding) {
+    if (padding.top !== void 0) self.paddingTop = padding.top;
+    if (padding.right !== void 0) self.paddingRight = padding.right;
+    if (padding.bottom !== void 0) self.paddingBottom = padding.bottom;
+    if (padding.left !== void 0) self.paddingLeft = padding.left;
+  },
+  /**
+   * Add a social link
+   */
+  addSocialLink(platform, url, color) {
+    self.links.push(SocialLinkModel.create({ platform, url, color }));
+  },
+  /**
+   * Remove a social link by index
+   */
+  removeSocialLink(index) {
+    self.links.splice(index, 1);
+  },
+  /**
+   * Add a navbar link
+   */
+  addNavbarLink(href, label, color) {
+    self.navLinks.push(NavbarLinkModel.create({ href, label, color }));
+  },
+  /**
+   * Remove a navbar link by index
+   */
+  removeNavbarLink(index) {
+    self.navLinks.splice(index, 1);
+  },
+  /**
+   * Add a carousel image
+   */
+  addCarouselImage(src, alt, href, thumbnailSrc) {
+    self.images.push(CarouselImageModel.create({ src, alt, href, thumbnailSrc }));
+  },
+  /**
+   * Remove a carousel image by index
+   */
+  removeCarouselImage(index) {
+    self.images.splice(index, 1);
+  },
+  /**
+   * Add an accordion item
+   */
+  addAccordionItem(title, content) {
+    self.items.push(AccordionItemModel.create({ title, content }));
+  },
+  /**
+   * Remove an accordion item by index
+   */
+  removeAccordionItem(index) {
+    self.items.splice(index, 1);
+  },
+  /**
+   * Add a table row
+   */
+  addTableRow(cells) {
+    self.rows.push(cells);
+  },
+  /**
+   * Remove a table row by index
+   */
+  removeTableRow(index) {
+    self.rows.splice(index, 1);
+  }
+})).views((self) => ({
+  /**
+   * Computed style object for React rendering
+   */
+  get computedStyle() {
+    const style = {};
+    if (self.color) style.color = self.color;
+    if (self.backgroundColor) style.backgroundColor = self.backgroundColor;
+    if (self.fontSize) style.fontSize = self.fontSize;
+    if (self.fontFamily) style.fontFamily = self.fontFamily;
+    if (self.align) style.textAlign = self.align;
+    if (self.lineHeight) style.lineHeight = self.lineHeight;
+    if (self.paddingTop) style.paddingTop = self.paddingTop;
+    if (self.paddingRight) style.paddingRight = self.paddingRight;
+    if (self.paddingBottom) style.paddingBottom = self.paddingBottom;
+    if (self.paddingLeft) style.paddingLeft = self.paddingLeft;
+    if (self.borderRadius) style.borderRadius = self.borderRadius;
+    if (self.border) style.border = self.border;
+    return style;
+  },
+  /**
+   * Get padding as a single object
+   */
+  get padding() {
+    return {
+      top: self.paddingTop || void 0,
+      right: self.paddingRight || void 0,
+      bottom: self.paddingBottom || void 0,
+      left: self.paddingLeft || void 0
+    };
+  },
+  /**
+   * Get padding as a CSS string (e.g., "10px 20px 10px 20px")
+   */
+  get paddingString() {
+    const { paddingTop, paddingRight, paddingBottom, paddingLeft } = self;
+    if (!paddingTop && !paddingRight && !paddingBottom && !paddingLeft) {
+      return void 0;
+    }
+    return `${paddingTop || "0"} ${paddingRight || "0"} ${paddingBottom || "0"} ${paddingLeft || "0"}`;
+  },
+  /**
+   * MJML attributes for export
+   */
+  get mjmlAttributes() {
+    const attrs = {};
+    if (self.color) attrs.color = self.color;
+    if (self.backgroundColor) attrs["background-color"] = self.backgroundColor;
+    if (self.fontSize) attrs["font-size"] = self.fontSize;
+    if (self.fontFamily) attrs["font-family"] = self.fontFamily;
+    if (self.align) attrs.align = self.align;
+    if (self.lineHeight) attrs["line-height"] = self.lineHeight;
+    const paddingParts = [];
+    if (self.paddingTop) paddingParts.push(`top:${self.paddingTop}`);
+    if (self.paddingRight) paddingParts.push(`right:${self.paddingRight}`);
+    if (self.paddingBottom) paddingParts.push(`bottom:${self.paddingBottom}`);
+    if (self.paddingLeft) paddingParts.push(`left:${self.paddingLeft}`);
+    if (paddingParts.length > 0) {
+      const padding = `${self.paddingTop || "0"} ${self.paddingRight || "0"} ${self.paddingBottom || "0"} ${self.paddingLeft || "0"}`;
+      attrs.padding = padding;
+    }
+    if (self.src) attrs.src = self.src;
+    if (self.alt) attrs.alt = self.alt;
+    if (self.width) attrs.width = self.width;
+    if (self.height) attrs.height = self.height;
+    if (self.href) attrs.href = self.href;
+    if (self.borderRadius) attrs["border-radius"] = self.borderRadius;
+    if (self.border) attrs.border = self.border;
+    if (self.innerPadding) attrs["inner-padding"] = self.innerPadding;
+    if (self.borderColor) attrs["border-color"] = self.borderColor;
+    if (self.borderWidth) attrs["border-width"] = self.borderWidth;
+    if (self.borderStyle) attrs["border-style"] = self.borderStyle;
+    return attrs;
+  },
+  /**
+   * Check if this is a text-based block
+   */
+  get isTextBlock() {
+    return self.type === "text" /* TEXT */;
+  },
+  /**
+   * Check if this is an image block
+   */
+  get isImageBlock() {
+    return self.type === "image" /* IMAGE */;
+  },
+  /**
+   * Check if this is a button block
+   */
+  get isButtonBlock() {
+    return self.type === "button" /* BUTTON */;
+  },
+  /**
+   * Check if this block is locked (header/footer)
+   */
+  get isLocked() {
+    return self.locked || self.type === "header" /* HEADER */ || self.type === "footer" /* FOOTER */;
+  },
+  /**
+   * Get display name for layers panel
+   */
+  get displayName() {
+    switch (self.type) {
+      case "text" /* TEXT */:
+        const text = self.content.replace(/<[^>]*>/g, "").trim();
+        return text.length > 20 ? text.substring(0, 20) + "..." : text || "Text";
+      case "image" /* IMAGE */:
+        return self.alt || "Image";
+      case "button" /* BUTTON */:
+        return self.label || "Button";
+      case "divider" /* DIVIDER */:
+        return "Divider";
+      case "spacer" /* SPACER */:
+        return `Spacer (${self.height || "20px"})`;
+      case "social" /* SOCIAL */:
+        return "Social Links";
+      case "hero" /* HERO */:
+        return "Hero";
+      case "accordion" /* ACCORDION */:
+        return "Accordion";
+      case "raw" /* RAW */:
+        return "Custom HTML";
+      case "navbar" /* NAVBAR */:
+        return "Navigation";
+      case "carousel" /* CAROUSEL */:
+        return "Carousel";
+      case "table" /* TABLE */:
+        return "Table";
+      case "header" /* HEADER */:
+        return "Header";
+      case "footer" /* FOOTER */:
+        return "Footer";
+      default:
+        return "Block";
+    }
+  }
+}));
+var BlockModel = BlockModelBase.preProcessSnapshot((raw) => {
+  let snapshot = paddingIn(raw);
+  if (snapshot && snapshot.type === "navbar") {
+    const { links, navLinks, ...rest } = snapshot;
+    const stored = navLinks && navLinks.length > 0 ? navLinks : links ?? [];
+    snapshot = { ...rest, navLinks: stored };
+  }
+  return fillDefaults(snapshot, BLOCK_DEFAULTS);
+}).postProcessSnapshot((raw) => {
+  const snapshot = paddingOut(dropFilled(raw));
+  if (snapshot.type !== "navbar") return snapshot;
+  const { navLinks, links: _socialLinks, ...rest } = snapshot;
+  return { ...rest, links: navLinks ?? [] };
+});
+
+// src/registry/blockCategories.ts
+var LEAF_BLOCK_TYPES = [
+  "text" /* TEXT */,
+  "image" /* IMAGE */,
+  "button" /* BUTTON */,
+  "divider" /* DIVIDER */,
+  "spacer" /* SPACER */,
+  "social" /* SOCIAL */
+];
+var CONTAINER_BLOCK_TYPES = [
+  "hero" /* HERO */,
+  "accordion" /* ACCORDION */,
+  "raw" /* RAW */,
+  "navbar" /* NAVBAR */,
+  "carousel" /* CAROUSEL */,
+  "table" /* TABLE */,
+  "header" /* HEADER */,
+  "footer" /* FOOTER */
+];
+function isLeafBlockType(t) {
+  return LEAF_BLOCK_TYPES.includes(t);
+}
+
+export {
+  buildGradientCSS,
+  isWrapper,
+  allSections,
+  SpacingSchema,
+  GradientStopSchema,
+  BackgroundGradientSchema,
+  ExtraAttributesSchema,
+  MjmlHeadSchema,
+  CustomFontSchema,
+  TemplateMetadataSchema,
+  TextBlockSchema,
+  ImageBlockSchema,
+  ButtonBlockSchema,
+  DividerBlockSchema,
+  SpacerBlockSchema,
+  HeaderBlockSchema,
+  FooterBlockSchema,
+  SocialBlockSchema,
+  HeroBlockSchema,
+  AccordionBlockSchema,
+  RawBlockSchema,
+  NavbarBlockSchema,
+  CarouselBlockSchema,
+  TableBlockSchema,
+  BlockSchema,
+  ColumnSchema,
+  SectionSchema,
+  SectionSchemaV1_0,
+  WrapperSchema,
+  TopLevelItemSchema,
+  EmailTemplateSchemaV1_0,
+  EmailTemplateSchemaV1_1,
+  EmailTemplateSchema,
+  validateTemplate,
+  CURRENT_TEMPLATE_VERSION,
+  SUPPORTED_TEMPLATE_VERSIONS,
+  TemplateMigrationError,
+  isTemplateMigrationError,
+  migrateTemplate,
+  migrateV1_0ToV1_1,
+  withTemplateId,
+  paddingIn,
+  paddingOut,
+  fillDefaults,
+  dropFilled,
+  COLUMN_DEFAULTS,
+  SECTION_DEFAULTS,
+  WRAPPER_DEFAULTS,
+  fillColumnWidths,
+  BlockType,
+  SocialLinkModel,
+  NavbarLinkModel,
+  CarouselImageModel,
+  AccordionItemModel,
+  SpacingModel,
+  BlockModel,
+  LEAF_BLOCK_TYPES,
+  CONTAINER_BLOCK_TYPES,
+  isLeafBlockType
+};