@dosgato/templating 0.0.64 → 0.0.65
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/component.d.ts +10 -2
- package/dist/component.js +7 -0
- package/dist/uitemplate.d.ts +37 -1
- package/package.json +1 -1
package/dist/component.d.ts
CHANGED
|
@@ -127,8 +127,8 @@ export declare abstract class Component<DataType extends ComponentData = any, Fe
|
|
|
127
127
|
hideMaxWarning?: boolean;
|
|
128
128
|
maxWarning?: string;
|
|
129
129
|
hideInheritBars?: boolean;
|
|
130
|
-
newBarOpts
|
|
131
|
-
editBarOpts
|
|
130
|
+
newBarOpts?: NewBarOpts;
|
|
131
|
+
editBarOpts?: RenderAreaEditBarOpts;
|
|
132
132
|
}): string;
|
|
133
133
|
/**
|
|
134
134
|
* During rendering, each component should determine the CSS blocks that it needs. This may
|
|
@@ -158,6 +158,12 @@ export declare abstract class Component<DataType extends ComponentData = any, Fe
|
|
|
158
158
|
* CSS class
|
|
159
159
|
*/
|
|
160
160
|
editClass(): string | undefined;
|
|
161
|
+
/**
|
|
162
|
+
* Override with `true` to indicate that this template never accepts data from editors
|
|
163
|
+
*
|
|
164
|
+
* Its edit bar will not have a pencil icon.
|
|
165
|
+
*/
|
|
166
|
+
noData: boolean;
|
|
161
167
|
/**
|
|
162
168
|
* Components may override this function to give their new bars a custom
|
|
163
169
|
* label
|
|
@@ -224,6 +230,7 @@ export interface PageRecord<DataType extends PageData = PageData> {
|
|
|
224
230
|
linkId: string;
|
|
225
231
|
createdAt: Date;
|
|
226
232
|
modifiedAt: Date;
|
|
233
|
+
publishedAt: Date;
|
|
227
234
|
path: string;
|
|
228
235
|
data: DataType;
|
|
229
236
|
site: SiteInfo;
|
|
@@ -262,6 +269,7 @@ interface BarOpts {
|
|
|
262
269
|
export interface EditBarOpts extends BarOpts {
|
|
263
270
|
inheritedFrom?: string;
|
|
264
271
|
disableDelete?: boolean;
|
|
272
|
+
hideEdit?: boolean;
|
|
265
273
|
}
|
|
266
274
|
export interface RenderAreaEditBarOpts extends Omit<Omit<EditBarOpts, 'label'>, 'extraClass'> {
|
|
267
275
|
label?: string | ((c: Component) => string);
|
package/dist/component.js
CHANGED
|
@@ -12,6 +12,12 @@ export class Component extends ResourceProvider {
|
|
|
12
12
|
// a Component will also construct/hydrate all its child components
|
|
13
13
|
constructor(data, path, parent, editMode) {
|
|
14
14
|
super();
|
|
15
|
+
/**
|
|
16
|
+
* Override with `true` to indicate that this template never accepts data from editors
|
|
17
|
+
*
|
|
18
|
+
* Its edit bar will not have a pencil icon.
|
|
19
|
+
*/
|
|
20
|
+
this.noData = false;
|
|
15
21
|
// Properties provided during the rendering process. You do not have to provide these when
|
|
16
22
|
// building a template, but you can use them in the functions you do provide
|
|
17
23
|
this.areas = new Map(); // a Map of area names and the array of hydrated components in each
|
|
@@ -171,6 +177,7 @@ export class Component extends ResourceProvider {
|
|
|
171
177
|
options.extraClass ?? (options.extraClass = this.editClass());
|
|
172
178
|
options.editMode ?? (options.editMode = this.editMode);
|
|
173
179
|
options.inheritedFrom ?? (options.inheritedFrom = this.inheritedFrom);
|
|
180
|
+
options.hideEdit = this.noData || options.hideEdit;
|
|
174
181
|
return Component.editBar(this.path, options);
|
|
175
182
|
}
|
|
176
183
|
/**
|
package/dist/uitemplate.d.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { ComponentData } from './component';
|
|
1
2
|
export interface SvelteComponent {
|
|
2
3
|
$set: (props?: Record<string, any>) => void;
|
|
3
4
|
$on: (event: string, callback: (event: any) => void) => () => void;
|
|
@@ -19,8 +20,43 @@ export interface IconOrSVG extends IconifyIcon {
|
|
|
19
20
|
}
|
|
20
21
|
export interface UITemplate {
|
|
21
22
|
templateKey: string;
|
|
22
|
-
|
|
23
|
+
/**
|
|
24
|
+
* A svelte component that expects to be inside a @dosgato/dialog Form component
|
|
25
|
+
*
|
|
26
|
+
* This dialog will be how editors interact with your component and edit its data. If you
|
|
27
|
+
* do not provide a dialog, it will be assumed that this template has no data and it will be
|
|
28
|
+
* inserted into the page without further user interaction.
|
|
29
|
+
*
|
|
30
|
+
* Several props are delivered to the svelte component that may be important for you:
|
|
31
|
+
*
|
|
32
|
+
* - creating: boolean, true when creating component for the first time, false when editing
|
|
33
|
+
* - data: ComponentData, the current data on the page, should not be mutated during editing,
|
|
34
|
+
* undefined when creating
|
|
35
|
+
* - templateProperties: the template properties for the current page template, so you can make
|
|
36
|
+
* things like color pickers that visually match the colors of the current page template
|
|
37
|
+
* - environmentConfig: base URLs in case you need to generate a link to the API or something
|
|
38
|
+
*/
|
|
39
|
+
dialog?: SvelteComponent;
|
|
40
|
+
/**
|
|
41
|
+
* Sometimes when you create a component that has areas, you want to automatically fill
|
|
42
|
+
* one or more areas with some default introductory content.
|
|
43
|
+
*
|
|
44
|
+
* You can place that introductory content here and it will be automatically placed into
|
|
45
|
+
* components with this template upon creation (and never again).
|
|
46
|
+
*/
|
|
47
|
+
defaultContent?: Record<string, ComponentData[]>;
|
|
48
|
+
/**
|
|
49
|
+
* if present this SVG will be used when presenting users with
|
|
50
|
+
* an array of choices of templates to create. Ideally it should look
|
|
51
|
+
* a lot like the template will look on a webpage. It will be presented
|
|
52
|
+
* about 1-2 inches wide
|
|
53
|
+
*/
|
|
23
54
|
preview?: IconOrSVG;
|
|
55
|
+
/**
|
|
56
|
+
* if present this icon will be used to represent the template in various
|
|
57
|
+
* UI contexts. It will be presented about 3mm wide. Falls back to the
|
|
58
|
+
* preview image.
|
|
59
|
+
*/
|
|
24
60
|
icon?: IconOrSVG;
|
|
25
61
|
}
|
|
26
62
|
export {};
|