@dosgato/templating 0.0.86 → 0.0.87

package/dist/component.d.ts

@@ -11,7 +11,7 @@ import { APIClient } from './render.js';
  * During rendering, it will be "hydrated" - placed into a full page structure with its
  * parent and child components linked.
  */
-export declare abstract class Component<DataType extends ComponentData = any, FetchedType = any, RenderContextType extends ContextBase = any> extends ResourceProvider {
+export declare abstract class Component<DataType extends ComponentData = any, FetchedType = any, RenderContextType extends ContextBase = ContextBase> extends ResourceProvider {
     /**
      * Provide this when you create a template to identify what you are defining.
      */
@@ -156,10 +156,19 @@ export declare abstract class Component<DataType extends ComponentData = any, Fe
      * if the user skipped a header level (a WCAG violation) that situation will be repaired as well
      * as possible.
      *
-     * If you do not provide a headerLevel, the one from `this.renderCtx` will be used.
+     * If you do not provide a headerLevel, the one from `this.renderCtx` will be used. However, if you
+     * provide a non-blank value for `advanceHeader`, the headerLevel from `this.renderCtx` + 1 will be used.
+     *
+     * This way you can easily render a piece of rich text in a component that has an optional title:
+     *
+     * this.renderRichText(this.data.richtext, { advanceHeader: this.data.title })
+     *
+     * If this.data.title is non-blank, the rich text will be balanced below it, but if it is blank,
+     * it will be balanced at the level the title would have had.
      */
     renderRichText: (html: string, opts?: {
         headerLevel?: number;
+        advanceHeader?: string | undefined | null;
     }) => string;
     /**
      * The final phase of rendering a component is the render phase. This step is BOTTOM-UP -
@@ -264,7 +273,7 @@ export declare abstract class Component<DataType extends ComponentData = any, Fe
     static editBar: (path: string, opts: EditBarOpts) => string;
     static newBar: (path: string, opts: NewBarOpts) => string;
     constructor(data: DataType, path: string, parent: Component | undefined, editMode: boolean);
-    areas: Map<string, Component<any, any, any>[]>;
+    areas: Map<string, Component<any, any, ContextBase>[]>;
     data: Omit<DataType, 'areas'>;
     fetched: FetchedType;
     renderCtx: RenderContextType;
@@ -331,6 +340,7 @@ export interface ContextBase {
      * This way every page will have a perfect header tree and avoid complaints from WAVE.
      */
     headerLevel: number;
+    [keys: string]: any;
 }
 interface BarOpts {
     editMode?: boolean;

package/dist/render.js

@@ -2,7 +2,7 @@ import { htmlEncode, isBlank, isNotEmpty } from 'txstate-utils';
 export function printHeader(ctx, content, attributes) {
     if (isBlank(content))
         return '';
-    const level = (ctx.headerLevel ?? 0) + 1;
+    const level = ctx.headerLevel ?? 1;
     const attr = isNotEmpty(attributes) ? ' ' + Object.entries(attributes).map(([key, val]) => `${key}="${htmlEncode(val)}"`).join(' ') : '';
     if (level < 1)
         return `<h1${attr}>${content}</h1>`;
@@ -12,6 +12,6 @@ export function printHeader(ctx, content, attributes) {
 }
 export function advanceHeader(ctx, content) {
     if (!isBlank(content))
-        ctx.headerLevel = (ctx.headerLevel ?? 0) + 1;
+        ctx.headerLevel = (ctx.headerLevel ?? 1) + 1;
     return ctx;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dosgato/templating",
-  "version": "0.0.86",
+  "version": "0.0.87",
   "description": "A library to support building templates for dosgato CMS.",
   "type": "module",
   "exports": {