Merge pull request #22 from prezly/feature/dev-7540-update-prezlycont…

…ent-renderer-react-js [DEV-7540] Implement type guards for Title/Subtitle headings
prezly · Jun 6, 2023 · a50b1d7 · a50b1d7
2 parents b5d7537 + e022bfa
commit a50b1d7
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 11 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/content-format/src/nodes/HeadingNode.ts b/packages/content-format/src/nodes/HeadingNode.ts
@@ -1,14 +1,21 @@
 import { ComposedElement } from '../ComposedElement';
 import type { Node } from '../Node';
 
-export interface HeadingNode<Child extends Node> extends ComposedElement<`${HeadingNode.Type}`, Child> {}
+export interface HeadingNode<Child extends Node> extends ComposedElement<`${HeadingNode.Type}`, Child> {
+    role?: `${HeadingNode.Role}`;
+}
 
 export namespace HeadingNode {
     export enum Type {
         HEADING_ONE = 'heading-one',
         HEADING_TWO = 'heading-two',
     }
 
+    export enum Role {
+        TITLE = 'title',
+        SUBTITLE = 'subtitle',
+    }
+
     export function isHeadingNode<Heading extends HeadingNode<Child>, Child extends Node>(value: any): value is Heading;
 
     export function isHeadingNode<Heading extends HeadingNode<Child>, Child extends Node>(
@@ -26,6 +33,22 @@ export namespace HeadingNode {
         return ComposedElement.isComposedElement(value, type);
     }
 
+    export function isTitleHeadingNode<Heading extends HeadingNode<Child>, Child extends Node>(
+        value: any,
+    ): value is Heading & { role: HeadingNode.Role.TITLE };
+
+    export function isTitleHeadingNode(value: any) {
+        return isHeadingNode(value) && value.role === HeadingNode.Role.TITLE;
+    }
+
+    export function isSubtitleHeadingNode<Heading extends HeadingNode<Child>, Child extends Node>(
+        value: any,
+    ): value is Heading & { role: HeadingNode.Role.SUBTITLE };
+
+    export function isSubtitleHeadingNode(value: any) {
+        return isHeadingNode(value) && value.role === HeadingNode.Role.SUBTITLE;
+    }
+
     export function validateHeadingNode<Heading extends HeadingNode<Child>, Child extends Node>(
         value: any,
         validateChildNode: (node: any) => Child | null,

diff --git a/packages/story-content-format/src/index.ts b/packages/story-content-format/src/index.ts
@@ -231,11 +231,20 @@ export type HeadingNode = Core.Alignable<Core.HeadingNode<InlineNode>, false>;
 export namespace HeadingNode {
     export import Type = Core.HeadingNode.Type;
     export import Alignment = Core.Alignable.Alignment;
+    export import Role = Core.HeadingNode.Role;
 
     export function isHeadingNode(value: any, type?: HeadingNode.Type): value is HeadingNode {
         return type ? Core.HeadingNode.isHeadingNode(value, type) : Core.HeadingNode.isHeadingNode(value);
     }
 
+    export function isTitleHeadingNode(value: any): value is HeadingNode & { role: HeadingNode.Role.TITLE } {
+        return Core.HeadingNode.isTitleHeadingNode(value);
+    }
+
+    export function isSubtitleHeadingNode(value: any): value is HeadingNode & { role: HeadingNode.Role.SUBTITLE } {
+        return Core.HeadingNode.isSubtitleHeadingNode(value);
+    }
+
     export function validateHeadingNode(value: any): HeadingNode | null {
         return Core.Alignable.validateAlignable(
             Core.HeadingNode.validateHeadingNode(value, InlineNode.validateInlineNode),