article-content-renderer-vue2 0.3.1 → 0.5.0

package/dist/types/components/ArticleContentRenderer.vue.d.ts

@@ -1,5 +1,5 @@
 import Vue from 'vue';
-import type { CustomSlot, ResolveArticleButtonLink } from '../types.js';
+import type { CustomSlot, ResolveArticleButtonLink, ResolveCustomLink, OnAnchorNavigate } from '../types.js';
 interface ArticleContentRendererProps {
     document: unknown;
     protocolVersion: number;
@@ -7,6 +7,12 @@ interface ArticleContentRendererProps {
     customSlots: CustomSlot[];
     imageBaseUrl: string;
     resolveArticleButtonLink?: ResolveArticleButtonLink;
+    resolveCustomLink?: ResolveCustomLink;
+    revealedKeys: string[];
+    articleKey?: string | number;
+    scrollContainer?: HTMLElement | (() => HTMLElement | null);
+    scrollOffset: number;
+    onAnchorNavigate?: OnAnchorNavigate;
 }
 declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, any>, Record<string, any>, never, never, (event: string, ...args: any[]) => Vue>, {}, {}, {}, ArticleContentRendererProps, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin>;
 export default _default;

package/dist/types/core/resource-question.d.ts

@@ -0,0 +1,45 @@
+import { type VNode } from 'vue';
+import type { ArticleDocument, ArticleRendererRuntime, OnAnchorNavigate, RenderIssue, ResourceQuestionSelectEvent, TopLevelNode } from '../types.js';
+type RecordValue = Record<string, unknown>;
+export declare function isRecord(value: unknown): value is RecordValue;
+export declare function getVisibleContent(document: ArticleDocument, revealedKeys?: readonly string[]): TopLevelNode[];
+export interface NavigationSessionOptions {
+    document: unknown;
+    articleKey?: string | number;
+    revealedKeys: readonly string[];
+    scrollContainer?: HTMLElement | (() => HTMLElement | null);
+    scrollOffset: number;
+    onAnchorNavigate?: OnAnchorNavigate;
+    reportNavigationIssue(issue: RenderIssue): void;
+    emitSelect(event: ResourceQuestionSelectEvent): void;
+}
+/** A fresh render's registry; only its owning lifecycle component can activate it. */
+export declare class NavigationSession {
+    readonly options: NavigationSessionOptions;
+    readonly anchors: Map<string, HTMLElement>;
+    readonly allAnchors: Set<string>;
+    readonly selections: Map<string, Map<string, ResourceQuestionSelectEvent>>;
+    select: (event: ResourceQuestionSelectEvent) => void;
+    constructor(options: NavigationSessionOptions);
+    anchorHooks(id: string): {
+        insert: (vnode: VNode) => void;
+        postpatch: (_old: VNode, vnode: VNode) => void;
+        destroy: (vnode: VNode) => void;
+    };
+}
+/** Persistent state owned by the renderer's existing, DOM-free lifecycle component. */
+export declare class ResourceNavigation {
+    private session?;
+    private pending?;
+    private generation;
+    private frame?;
+    private disposed;
+    readonly api: ArticleRendererRuntime;
+    constructor();
+    update(session: NavigationSession): void;
+    cancelPendingNavigation(): void;
+    schedule(): void;
+    private navigate;
+    dispose(): void;
+}
+export {};

package/dist/types/index.d.ts

@@ -2,7 +2,8 @@ import type { PluginObject } from 'vue';
 import ArticleContentRenderer from './components/ArticleContentRenderer.vue';
 export { ArticleContentRenderer };
 export default ArticleContentRenderer;
+export { getVisibleContent } from './core/resource-question.js';
 export declare const ArticleContentRendererPlugin: PluginObject<never>;
 export { CURRENT_PROTOCOL_VERSION, SUPPORTED_PROTOCOL_VERSIONS, validateArticleDocument, } from './protocols/registry.js';
 export { ARTICLE_CONTENT_PROTOCOL_V1 } from './protocols/v1/metadata.js';
-export type { ArticleButtonAttrs, ArticleButtonActionAttrs, ArticleButtonActionNode, ArticleButtonClickPayload, ArticleButtonLink, ArticleButtonLinkAttrs, ArticleButtonLinkDescriptor, ArticleButtonLinkNode, ArticleButtonNode, ArticleButtonStyle, ArticleContentNode, ArticleDocument, ArticleMark, BlockNode, BlockquoteNode, BoldMark, BulletListNode, CodeBlockNode, CodeBlockTextNode, CodeMark, CustomSlot, HeadingNode, HorizontalRuleNode, ImageAlign, ImageNode, ItalicMark, LinkMark, LinkTarget, ListItemNode, OrderedListNode, ParagraphNode, ProtocolVersion, RenderIssue, RenderIssueCode, ResolveArticleButtonLink, StrikeMark, TableCellNode, TableNode, TableRowNode, TextAlign, TextNode, UnderlineMark, ValidationResult, } from './types.js';
+export type { ArticleButtonAttrs, ArticleButtonActionAttrs, ArticleButtonActionNode, ArticleButtonClickPayload, ArticleButtonLink, ArticleButtonLinkAttrs, ArticleButtonLinkDescriptor, ArticleButtonLinkNode, ArticleButtonNode, ArticleButtonStyle, ArticleContentNode, ArticleDocument, ArticleRendererRuntime, ArticleMark, BlockNode, BlockquoteNode, BoldMark, BulletListNode, CodeBlockNode, CodeBlockTextNode, CodeMark, CustomLink, CustomLinkDescriptor, CustomLinkMark, CustomLinkMarkAttrs, CustomSlot, HeadingNode, HighlightMark, HorizontalRuleNode, ImageAlign, ImageLayout, ImageNode, ItalicMark, HrefLinkMark, HrefLinkMarkAttrs, LinkMark, LinkTarget, ListItemNode, OrderedListNode, ParagraphNode, ProtocolVersion, RenderIssue, RenderIssueCode, ResolveArticleButtonLink, ResolveCustomLink, ResourceQuestionAttrs, ResourceQuestionNode, ResourceQuestionOption, ResourceQuestionSelectEvent, ResourceQuestionNavigationRequest, OnAnchorNavigate, StrikeMark, TableCellNode, TableNode, TableRowNode, TextAlign, TextNode, TextStyleMark, TopLevelNode, UnderlineMark, ValidationResult, } from './types.js';

package/dist/types/protocols/types.d.ts

@@ -1,12 +1,15 @@
 import type { CreateElement, VNode } from 'vue';
-import type { ArticleButtonClickPayload, RenderIssue, ResolveArticleButtonLink, ValidationResult } from '../types.js';
+import type { NavigationSession } from '../core/resource-question.js';
+import type { ArticleButtonClickPayload, RenderIssue, ResolveArticleButtonLink, ResolveCustomLink, ValidationResult } from '../types.js';
 export interface RenderContext {
     createElement: CreateElement;
     customSlots: readonly ResolvedCustomSlot[];
     imageBaseUrl: string;
     resolveArticleButtonLink?: ResolveArticleButtonLink;
+    resolveCustomLink?: ResolveCustomLink;
     emitArticleButtonClick: (payload: ArticleButtonClickPayload) => void;
     reportIssue: (issue: RenderIssue) => void;
+    navigation: NavigationSession;
 }
 export interface ResolvedCustomSlot {
     id: string;

package/dist/types/protocols/v1/metadata.d.ts

@@ -2,11 +2,12 @@ export declare const ARTICLE_CONTENT_PROTOCOL_V1: Readonly<{
     fileFormat: "article-content-protocol";
     fileFormatVersion: 1;
     mediaType: "application/vnd.article-content-protocol+json";
-    id: "article-content-v1";
+    id: "article-content-v1-with-extensions";
     version: 1;
-    name: "Article Content Protocol v1";
+    name: "Article Content Protocol v1 + Extensions";
     status: "draft";
     rootNode: "doc";
     nodeTypes: readonly string[];
     markTypes: readonly string[];
+    extensions: readonly string[];
 }>;

package/dist/types/protocols/v1/schema.d.ts

@@ -0,0 +1,2 @@
+import type { RenderIssue } from '../../types.js';
+export declare function validateDocumentSchema(document: unknown): RenderIssue[];

package/dist/types/types.d.ts

@@ -1,6 +1,7 @@
 export type ProtocolVersion = 1;
 export type TextAlign = 'left' | 'center' | 'right' | 'justify';
 export type ImageAlign = 'left' | 'center' | 'right';
+export type ImageLayout = 'two-column';
 export type ArticleButtonStyle = 'text' | 'button' | 'link';
 export type LinkTarget = '_blank' | '_self';
 export interface CustomSlot {
@@ -22,14 +23,42 @@ export interface UnderlineMark {
 export interface CodeMark {
     type: 'code';
 }
-export interface LinkMark {
+export interface HrefLinkMarkAttrs {
+    type?: 'href';
+    href: string;
+    id?: never;
+    title?: never;
+    target?: LinkTarget;
+}
+export interface CustomLinkMarkAttrs {
+    type: 'custom';
+    id: string;
+    title: string;
+    href?: never;
+    target?: LinkTarget;
+}
+export interface HrefLinkMark {
+    type: 'link';
+    attrs: HrefLinkMarkAttrs;
+}
+export interface CustomLinkMark {
     type: 'link';
+    attrs: CustomLinkMarkAttrs;
+}
+export type LinkMark = HrefLinkMark | CustomLinkMark;
+export interface TextStyleMark {
+    type: 'textStyle';
+    attrs: {
+        color: string;
+    };
+}
+export interface HighlightMark {
+    type: 'highlight';
     attrs: {
-        href: string;
-        target?: LinkTarget;
+        color: string;
     };
 }
-export type ArticleMark = BoldMark | ItalicMark | StrikeMark | UnderlineMark | CodeMark | LinkMark;
+export type ArticleMark = BoldMark | ItalicMark | StrikeMark | UnderlineMark | CodeMark | LinkMark | TextStyleMark | HighlightMark;
 export interface TextNode {
     type: 'text';
     text: string;
@@ -39,6 +68,8 @@ export interface ParagraphNode {
     type: 'paragraph';
     attrs?: {
         textAlign?: TextAlign;
+        anchorId?: string;
+        fontSize?: number;
     };
     content?: TextNode[];
 }
@@ -47,6 +78,7 @@ export interface HeadingNode {
     attrs: {
         level: 1 | 2 | 3 | 4 | 5 | 6;
         textAlign?: TextAlign;
+        anchorId?: string;
     };
     content?: TextNode[];
 }
@@ -92,6 +124,7 @@ export interface ImageNode {
         width?: number;
         height?: number;
         imageAlign?: ImageAlign;
+        imageLayout?: ImageLayout;
     };
 }
 interface ArticleButtonBaseAttrs {
@@ -118,6 +151,43 @@ export interface ArticleButtonLinkNode {
     attrs: ArticleButtonLinkAttrs;
 }
 export type ArticleButtonNode = ArticleButtonActionNode | ArticleButtonLinkNode;
+export interface ResourceQuestionOption {
+    id: string;
+    label: string;
+    targetAnchorId?: string;
+}
+export interface ResourceQuestionAttrs {
+    id: string;
+    resourceId: string;
+    title: string;
+    description: string;
+    options: ResourceQuestionOption[];
+    hideFollowing: boolean;
+    revealKey: string;
+}
+export interface ResourceQuestionNode {
+    type: 'resourceQuestion';
+    attrs: ResourceQuestionAttrs;
+}
+export interface ResourceQuestionSelectEvent {
+    questionId: string;
+    resourceId: string;
+    optionId: string;
+    revealKey: string;
+    targetAnchorId?: string;
+}
+/** One option click's navigation request. Methods become no-ops after cancellation or replacement. */
+export interface ResourceQuestionNavigationRequest extends ResourceQuestionSelectEvent {
+    targetAnchorId: string;
+    scrollToAnchor(): void;
+    cancel(): void;
+}
+/** Suppresses automatic navigation; call request.scrollToAnchor() when the host is ready. */
+export type OnAnchorNavigate = (request: Readonly<ResourceQuestionNavigationRequest>) => void | Promise<void>;
+/** Delivered through renderer-ready; keep one handle per renderer instance. */
+export interface ArticleRendererRuntime {
+    cancelPendingNavigation(): void;
+}
 export interface TableNode {
     type: 'table';
     content: TableRowNode[];
@@ -133,9 +203,10 @@ export interface TableCellNode {
 export type BlockNode = ParagraphNode | HeadingNode | BlockquoteNode | BulletListNode | OrderedListNode | CodeBlockNode | HorizontalRuleNode | ImageNode | ArticleButtonNode | TableNode;
 export interface ArticleDocument {
     type: 'doc';
-    content: BlockNode[];
+    content: TopLevelNode[];
 }
-export type ArticleContentNode = ArticleDocument | BlockNode | ListItemNode | TableRowNode | TableCellNode | TextNode;
+export type TopLevelNode = BlockNode | ResourceQuestionNode;
+export type ArticleContentNode = ArticleDocument | BlockNode | ResourceQuestionNode | ListItemNode | TableRowNode | TableCellNode | TextNode;
 export interface ArticleButtonLinkDescriptor {
     href: string;
     target?: LinkTarget;
@@ -143,12 +214,20 @@ export interface ArticleButtonLinkDescriptor {
 }
 export type ArticleButtonLink = string | ArticleButtonLinkDescriptor | null;
 export type ResolveArticleButtonLink = (attrs: Readonly<ArticleButtonActionAttrs>, node: Readonly<ArticleButtonActionNode>) => ArticleButtonLink;
-export type RenderIssueCode = 'INVALID_ROOT' | 'INVALID_TYPE' | 'INVALID_CONTENT' | 'INVALID_VALUE' | 'MISSING_PROPERTY' | 'UNKNOWN_PROPERTY' | 'UNKNOWN_NODE' | 'UNKNOWN_MARK' | 'TABLE_COLUMN_MISMATCH' | 'UNSAFE_URL' | 'LINK_RESOLUTION_FAILED' | 'UNSUPPORTED_PROTOCOL';
+export interface CustomLinkDescriptor {
+    href: string;
+    target?: LinkTarget;
+    rel?: string;
+}
+export type CustomLink = string | CustomLinkDescriptor | null;
+export type ResolveCustomLink = (attrs: Readonly<CustomLinkMarkAttrs>, mark: Readonly<CustomLinkMark>) => CustomLink;
+export type RenderIssueCode = 'INVALID_ROOT' | 'INVALID_TYPE' | 'INVALID_CONTENT' | 'INVALID_VALUE' | 'MISSING_PROPERTY' | 'UNKNOWN_PROPERTY' | 'UNKNOWN_NODE' | 'UNKNOWN_MARK' | 'TABLE_COLUMN_MISMATCH' | 'UNSAFE_URL' | 'LINK_RESOLUTION_FAILED' | 'UNSUPPORTED_PROTOCOL' | 'DUPLICATE_IDENTITY' | 'MISSING_ANCHOR' | 'NAVIGATION_CALLBACK_FAILED';
 export interface RenderIssue {
     code: RenderIssueCode;
     path: string;
     message: string;
     nodeType?: string;
+    severity?: 'error' | 'warning';
 }
 export interface ValidationResult {
     valid: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "article-content-renderer-vue2",
-  "version": "0.3.1",
+  "version": "0.5.0",
   "description": "A safe Vue 2.7 renderer for the Article Content Protocol ProseMirror JSON format.",
   "author": "NovaVoyager",
   "license": "MIT",
@@ -73,5 +73,8 @@
   },
   "engines": {
     "node": ">=18.0.0"
+  },
+  "dependencies": {
+    "ajv": "^8.20.0"
   }
 }