[DEV-13006] Update model: callout block & highlighted text

packages/content-format/src/nodes/CalloutNode.ts

@@ -0,0 +1,24 @@
+import { ComposedElement } from '../ComposedElement';
+import type { Node } from '../Node';
+
+export interface CalloutNode<Inline extends Node> extends ComposedElement<typeof CalloutNode.TYPE, Inline> {}
+
+export namespace CalloutNode {
+    export const TYPE = 'callout';
+
+    export function isCalloutNode<T extends CalloutNode<Inline>, Inline extends Node>(value: any): value is T {
+        return ComposedElement.isComposedElement(value, CalloutNode.TYPE);
+    }
+
+    export function validateCalloutNode<Quote extends CalloutNode<Inline>, Inline extends Node>(
+        value: any,
+        validateInlineNode: (node: any) => Inline | null,
+    ): Quote | null {
+        const isValid =
+            ComposedElement.validateComposedElement(value, TYPE, validateInlineNode) &&
+            (typeof value.icon === 'string' || typeof value.icon === 'undefined') &&
+            (typeof value.align === 'string' || typeof value.align === 'undefined');
+
+        return isValid ? value : null;
+    }
+}

packages/content-format/src/nodes/index.ts

@@ -1,6 +1,7 @@
 export * from './AttachmentNode';
 export * from './BookmarkNode';
 export * from './ButtonBlockNode';
+export * from './CalloutNode';
 export * from './ContactNode';
 export * from './CoverageNode';
 export * from './DividerNode';

packages/content-format/src/traits/Stylable.ts

@@ -9,6 +9,7 @@ export namespace Stylable {
         UNDERLINED = 'underlined',
         SUBSCRIPT = 'subscript',
         SUPERSCRIPT = 'superscript',
+        HIGHLIGHTED = 'highlighted',
     }
 
     export function validateStylable<T extends Record<string, any>>(value: T): Stylable<T, Style>;

packages/email-content-format/src/index.ts

@@ -40,6 +40,7 @@ export type BlockNode =
     | AttachmentNode
     | BookmarkNode
     | ButtonBlockNode
+    | CalloutNode
     | ContactNode
     | CoverageNode
     | DividerNode
@@ -62,6 +63,7 @@ export namespace BlockNode {
         return (
             AttachmentNode.isAttachmentNode(value) ||
             ButtonBlockNode.isButtonBlockNode(value) ||
+            CalloutNode.isCalloutNode(value) ||
             ContactNode.isContactNode(value) ||
             CoverageNode.isCoverageNode(value) ||
             DividerNode.isDividerNode(value) ||
@@ -85,6 +87,7 @@ export namespace BlockNode {
         return (
             AttachmentNode.validateAttachmentNode(value) ??
             ButtonBlockNode.validateButtonBlockNode(value) ??
+            CalloutNode.validateCalloutNode(value) ??
             ContactNode.validateContactNode(value) ??
             CoverageNode.validateCoverageNode(value) ??
             DividerNode.validateDividerNode(value) ??
@@ -110,6 +113,7 @@ export type ComposedElement =
     | LinkNode
     | HeadingNode
     | ParagraphNode
+    | CalloutNode
     | QuoteNode
     | ListNode
     | ListItemNode
@@ -125,6 +129,7 @@ export namespace ComposedElement {
             LinkNode.isLinkNode(value) ||
             HeadingNode.isHeadingNode(value) ||
             ParagraphNode.isParagraphNode(value) ||
+            CalloutNode.isCalloutNode(value) ||
             QuoteNode.isQuoteNode(value) ||
             ListNode.isListNode(value) ||
             ListItemNode.isListItemNode(value) ||
@@ -141,6 +146,7 @@ export namespace ComposedElement {
             LinkNode.validateLinkNode(value) ??
             HeadingNode.validateHeadingNode(value) ??
             ParagraphNode.validateParagraphNode(value) ??
+            CalloutNode.validateCalloutNode(value) ??
             QuoteNode.validateQuoteNode(value) ??
             ListNode.validateListNode(value) ??
             ListItemNode.validateListItemNode(value) ??
@@ -226,6 +232,24 @@ export namespace AttachmentNode {
 
 export import BookmarkNode = Core.BookmarkNode;
 export import ButtonBlockNode = Core.ButtonBlockNode;
+
+export type CalloutNode = Core.Alignable<Core.CalloutNode<InlineNode>, false>;
+export namespace CalloutNode {
+    export import TYPE = Core.CalloutNode.TYPE;
+    export import Alignment = Core.Alignable.Alignment;
+
+    export function isCalloutNode(value: any): value is CalloutNode {
+        return Core.CalloutNode.isCalloutNode(value);
+    }
+
+    export function validateCalloutNode(value: any): CalloutNode | null {
+        return Core.Alignable.validateAlignable<CalloutNode, false>(
+            Core.CalloutNode.validateCalloutNode(value, InlineNode.validateInlineNode),
+            false,
+        );
+    }
+}
+
 export import ContactNode = Core.ContactNode;
 export import CoverageNode = Core.CoverageNode;
 export import DividerNode = Core.DividerNode;

packages/story-content-format/src/index.ts

@@ -40,6 +40,7 @@ export type BlockNode =
     | AttachmentNode
     | BookmarkNode
     | ButtonBlockNode
+    | CalloutNode
     | ContactNode
     | DividerNode
     | EmbedNode
@@ -64,6 +65,7 @@ export namespace BlockNode {
         return (
             AttachmentNode.isAttachmentNode(value) ||
             ButtonBlockNode.isButtonBlockNode(value) ||
+            CalloutNode.isCalloutNode(value) ||
             ContactNode.isContactNode(value) ||
             DividerNode.isDividerNode(value) ||
             EmbedNode.isEmbedNode(value) ||
@@ -87,6 +89,7 @@ export namespace BlockNode {
         return (
             AttachmentNode.validateAttachmentNode(value) ??
             ButtonBlockNode.validateButtonBlockNode(value) ??
+            CalloutNode.validateCalloutNode(value) ??
             ContactNode.validateContactNode(value) ??
             DividerNode.validateDividerNode(value) ??
             EmbedNode.validateEmbedNode(value) ??
@@ -113,6 +116,7 @@ export type ComposedElement =
     | HeadingNode
     | ImageNode
     | ParagraphNode
+    | CalloutNode
     | QuoteNode
     | ListNode
     | ListItemNode
@@ -129,6 +133,7 @@ export namespace ComposedElement {
             HeadingNode.isHeadingNode(value) ||
             ImageNode.isImageNode(value) ||
             ParagraphNode.isParagraphNode(value) ||
+            CalloutNode.isCalloutNode(value) ||
             QuoteNode.isQuoteNode(value) ||
             ListNode.isListNode(value) ||
             ListItemNode.isListItemNode(value) ||
@@ -145,6 +150,7 @@ export namespace ComposedElement {
             LinkNode.validateLinkNode(value) ??
             HeadingNode.validateHeadingNode(value) ??
             ParagraphNode.validateParagraphNode(value) ??
+            CalloutNode.validateCalloutNode(value) ??
             QuoteNode.validateQuoteNode(value) ??
             ListNode.validateListNode(value) ??
             ListItemNode.validateListItemNode(value) ??
@@ -226,6 +232,24 @@ export namespace AttachmentNode {
 
 export import BookmarkNode = Core.BookmarkNode;
 export import ButtonBlockNode = Core.ButtonBlockNode;
+
+export type CalloutNode = Core.Alignable<Core.CalloutNode<InlineNode>, false>;
+export namespace CalloutNode {
+    export import TYPE = Core.CalloutNode.TYPE;
+    export import Alignment = Core.Alignable.Alignment;
+
+    export function isCalloutNode(value: any): value is CalloutNode {
+        return Core.CalloutNode.isCalloutNode(value);
+    }
+
+    export function validateCalloutNode(value: any): CalloutNode | null {
+        return Core.Alignable.validateAlignable<CalloutNode, false>(
+            Core.CalloutNode.validateCalloutNode(value, InlineNode.validateInlineNode),
+            false,
+        );
+    }
+}
+
 export import ContactNode = Core.ContactNode;
 export import DividerNode = Core.DividerNode;
 export import EmbedNode = Core.EmbedNode;