@dosgato/templating 0.0.68 → 0.0.70

package/dist/component.d.ts

@@ -116,10 +116,20 @@ export declare abstract class Component<DataType extends ComponentData = any, Fe
      */
     renderComponents(components?: RenderedComponent[] | string, opts?: {
         hideInheritBars?: boolean;
+        skipBars?: boolean;
+        skipContent?: boolean;
         editBarOpts?: RenderAreaEditBarOpts;
     }): string;
     /**
      * helper function to print an area and set a minimum or maximum number of components
+     *
+     * In some cases you might be rendering the edit bars in a separate div instead of placing
+     * them above each component. For instance, a slider that only shows one slide at a time may
+     * prefer not to put bars with slides because that would mean only one bar is visible at a time
+     * and then there's no way to re-order slides.
+     *
+     * In that case you would call this.renderArea('areaname', { ..., skipEditBars: true }) first
+     * and then this.renderArea('areaname', { ..., skipContent: true }) in another place.
      */
     renderArea(areaName: string, opts?: {
         min?: number;
@@ -127,6 +137,8 @@ export declare abstract class Component<DataType extends ComponentData = any, Fe
         hideMaxWarning?: boolean;
         maxWarning?: string;
         hideInheritBars?: boolean;
+        skipBars?: boolean;
+        skipContent?: boolean;
         newBarOpts?: NewBarOpts;
         editBarOpts?: RenderAreaEditBarOpts;
     }): string;
@@ -230,7 +242,7 @@ export interface PageRecord<DataType extends PageData = PageData> {
     linkId: string;
     createdAt: Date;
     modifiedAt: Date;
-    publishedAt: Date | null;
+    publishedAt?: Date;
     path: string;
     data: DataType;
     site: SiteInfo;

package/dist/component.js

@@ -95,30 +95,41 @@ export class Component extends ResourceProvider {
     renderComponents(components = [], opts) {
         if (!Array.isArray(components))
             components = this.renderedAreas.get(components) ?? [];
+        if (opts?.skipBars)
+            return components.map(c => c.output).join('');
         return components
-            .flatMap(c => c.component.inheritedFrom &&
-            opts?.hideInheritBars
-            ? [c.output]
+            .flatMap(c => c.component.inheritedFrom && opts?.hideInheritBars
+            ? [opts.skipContent ? '' : c.output]
             : [c.component.editBar({
                     ...opts?.editBarOpts,
                     label: typeof opts?.editBarOpts?.label === 'function' ? opts.editBarOpts.label(c.component) : opts?.editBarOpts?.label,
                     extraClass: typeof opts?.editBarOpts?.extraClass === 'function' ? opts.editBarOpts.extraClass(c.component) : opts?.editBarOpts?.extraClass
-                }), c.output]).join('');
+                }), opts?.skipContent ? '' : c.output]).join('');
     }
     /**
      * helper function to print an area and set a minimum or maximum number of components
+     *
+     * In some cases you might be rendering the edit bars in a separate div instead of placing
+     * them above each component. For instance, a slider that only shows one slide at a time may
+     * prefer not to put bars with slides because that would mean only one bar is visible at a time
+     * and then there's no way to re-order slides.
+     *
+     * In that case you would call this.renderArea('areaname', { ..., skipEditBars: true }) first
+     * and then this.renderArea('areaname', { ..., skipContent: true }) in another place.
      */
     renderArea(areaName, opts) {
         const components = this.renderedAreas.get(areaName) ?? [];
         const ownedComponentCount = components.filter(c => !c.component.inheritedFrom).length;
         const full = !!(opts?.max && ownedComponentCount >= opts.max);
-        let output = this.renderComponents(components, { hideInheritBars: opts?.hideInheritBars, editBarOpts: { ...opts?.editBarOpts, disableDelete: ownedComponentCount <= (opts?.min ?? 0), disableDrop: full } });
-        if (full) {
-            if (!opts.hideMaxWarning)
-                output += this.newBar(areaName, { ...opts.newBarOpts, label: opts.maxWarning ?? 'Maximum Reached', disabled: true });
-        }
-        else {
-            output += this.newBar(areaName, opts?.newBarOpts);
+        let output = this.renderComponents(components, { hideInheritBars: opts?.hideInheritBars, skipBars: opts?.skipBars, skipContent: opts?.skipContent, editBarOpts: { ...opts?.editBarOpts, disableDelete: ownedComponentCount <= (opts?.min ?? 0), disableDrop: full } });
+        if (!opts?.skipBars) {
+            if (full) {
+                if (!opts.hideMaxWarning)
+                    output += this.newBar(areaName, { ...opts.newBarOpts, label: opts.maxWarning ?? 'Maximum Reached', disabled: true });
+            }
+            else {
+                output += this.newBar(areaName, opts?.newBarOpts);
+            }
         }
         return output;
     }

package/dist/uitemplate.d.ts

@@ -1,10 +1,4 @@
 import { ComponentData } from './component.js';
-export interface SvelteComponent {
-    $set: (props?: Record<string, any>) => void;
-    $on: (event: string, callback: (event: any) => void) => () => void;
-    $destroy: () => void;
-    [accessor: string]: any;
-}
 interface IconifyIcon {
     body: string;
     rotate?: number;
@@ -36,7 +30,7 @@ export interface UITemplate {
      *   things like color pickers that visually match the colors of the current page template
      * - environmentConfig: base URLs in case you need to generate a link to the API or something
      */
-    dialog?: new (...args: any[]) => SvelteComponent;
+    dialog?: new (...args: any[]) => any;
     /**
      * Sometimes when you create a component that has areas, you want to automatically fill
      * one or more areas with some default introductory content.

package/package.json

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