@zcomponent/core 1.19.1-beta → 1.19.2-beta
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/lib/behavior.d.ts +1 -0
- package/lib/components/DefaultLoader.js +2 -2
- package/lib/components/SnapshotUI.d.ts +8 -1
- package/lib/components/SnapshotUI.js +15 -10
- package/lib/contexts/canvascontext.js +2 -0
- package/lib/types.d.ts +2 -1
- package/lib/types.js +1 -0
- package/lib/zcomponent.d.ts +6 -0
- package/lib/zcomponent.js +17 -1
- package/package.json +1 -1
package/lib/behavior.d.ts
CHANGED
|
@@ -22,6 +22,7 @@ export type ConstructorPropsOfBehavior<BehaviorType> = BehaviorType extends Beha
|
|
|
22
22
|
export type BehaviorConstructorProps = {
|
|
23
23
|
[id: string]: unknown;
|
|
24
24
|
};
|
|
25
|
+
export type ConstructorForBehavior<BehaviorType extends Behavior = Behavior> = new (contextManager: ContextManager, instance: BehaviorType extends Behavior<infer InstanceType> ? InstanceType : never) => BehaviorType;
|
|
25
26
|
/**
|
|
26
27
|
* Base class for all behaviors.
|
|
27
28
|
*
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Component, useCanvas, Observable, isDesignTime, useIsLoaded, useLoadPercent } from '..';
|
|
1
|
+
import { Component, useCanvas, Observable, isDesignTime, useIsLoaded, useLoadPercent, isStarted } from '..';
|
|
2
2
|
/**
|
|
3
3
|
* The DefaultLoader shows a customizable loading bar while the assets of your experience are being downloaded and parsed by the browser.
|
|
4
4
|
*
|
|
@@ -28,7 +28,7 @@ export class DefaultLoader extends Component {
|
|
|
28
28
|
};
|
|
29
29
|
this._updateVisibility = () => {
|
|
30
30
|
let shouldBeAttached = false;
|
|
31
|
-
if (!isDesignTime(this.contextManager) && !useIsLoaded(this.contextManager).value)
|
|
31
|
+
if (!isDesignTime(this.contextManager) && !useIsLoaded(this.contextManager).value && !isStarted(this.contextManager))
|
|
32
32
|
shouldBeAttached = true;
|
|
33
33
|
if (isDesignTime(this.contextManager) && this.preview.value)
|
|
34
34
|
shouldBeAttached = true;
|
|
@@ -3,6 +3,13 @@ import { ImageFormat } from '../behaviors/TakeSnapshot';
|
|
|
3
3
|
import { Component, ConstructorProps } from '../component';
|
|
4
4
|
import { ContextManager } from '../context';
|
|
5
5
|
import { Event } from '../event';
|
|
6
|
+
export interface SnapshotUIConstructorProps extends ConstructorProps {
|
|
7
|
+
/**
|
|
8
|
+
* @zprop
|
|
9
|
+
* @zdefault true
|
|
10
|
+
*/
|
|
11
|
+
allowShare: boolean;
|
|
12
|
+
}
|
|
6
13
|
/**
|
|
7
14
|
* Provides a user interface for capturing, downloading, and sharing snapshots of a canvas element.
|
|
8
15
|
*
|
|
@@ -61,6 +68,6 @@ export declare class SnapshotUI extends Component {
|
|
|
61
68
|
* @param contextManager - The current ContextManager
|
|
62
69
|
* @param props - The constructor properties.
|
|
63
70
|
*/
|
|
64
|
-
constructor(contextManager: ContextManager, props:
|
|
71
|
+
constructor(contextManager: ContextManager, props: SnapshotUIConstructorProps);
|
|
65
72
|
dispose(): never;
|
|
66
73
|
}
|
|
@@ -88,14 +88,17 @@ export class SnapshotUI extends Component {
|
|
|
88
88
|
const ssctx = this.contextManager.get(SnapshotContext);
|
|
89
89
|
ssctx.title.value = title;
|
|
90
90
|
});
|
|
91
|
-
|
|
91
|
+
const showSupported = this.contextManager.get(SnapshotContext).shareAPISupported.value;
|
|
92
|
+
const showShare = (props.allowShare ?? true) && showSupported;
|
|
93
|
+
this.socialShareBehaviours = new SocialShareBehaviors(contextManager, this, {
|
|
94
|
+
allowShare: showShare,
|
|
95
|
+
});
|
|
92
96
|
this.socialShareBehaviours.onSave.addListener(() => {
|
|
93
97
|
this.onSave.emit();
|
|
94
98
|
});
|
|
95
|
-
this.socialShareBehaviours.onShare
|
|
99
|
+
this.socialShareBehaviours.onShare?.addListener(() => {
|
|
96
100
|
this.onShare.emit();
|
|
97
101
|
});
|
|
98
|
-
const showShare = this.contextManager.get(SnapshotContext).shareAPISupported.value;
|
|
99
102
|
this.shareDiv = new ShareDivElement(showShare, async () => {
|
|
100
103
|
try {
|
|
101
104
|
this.socialShareBehaviours.share();
|
|
@@ -134,19 +137,21 @@ class SocialShareBehaviors {
|
|
|
134
137
|
* @param contextManager - The current ContextManager
|
|
135
138
|
* @param parent - The parent component.
|
|
136
139
|
*/
|
|
137
|
-
constructor(contextManager, parent) {
|
|
140
|
+
constructor(contextManager, parent, props) {
|
|
138
141
|
this.capture_b = new TakeSnapshot(contextManager, parent, { event: 'social-share', runAtEditTime: false });
|
|
139
142
|
this.download_b = new DownloadSnapshot(contextManager, parent, { event: 'social-share', runAtEditTime: false });
|
|
140
|
-
this.share_b = new ShareSnapshot(contextManager, parent, { event: 'social-share', runAtEditTime: false });
|
|
141
|
-
parent.addBehavior(this.capture_b);
|
|
142
143
|
parent.addBehavior(this.download_b);
|
|
143
|
-
|
|
144
|
+
if (props.allowShare) {
|
|
145
|
+
this.share_b = new ShareSnapshot(contextManager, parent, { event: 'social-share', runAtEditTime: false });
|
|
146
|
+
parent.addBehavior(this.share_b);
|
|
147
|
+
}
|
|
148
|
+
parent.addBehavior(this.capture_b);
|
|
144
149
|
}
|
|
145
150
|
get onSave() {
|
|
146
151
|
return this.download_b.onSave;
|
|
147
152
|
}
|
|
148
153
|
get onShare() {
|
|
149
|
-
return this.share_b
|
|
154
|
+
return this.share_b?.onShare;
|
|
150
155
|
}
|
|
151
156
|
capture() {
|
|
152
157
|
this.capture_b.perform();
|
|
@@ -155,12 +160,12 @@ class SocialShareBehaviors {
|
|
|
155
160
|
this.download_b.perform();
|
|
156
161
|
}
|
|
157
162
|
share() {
|
|
158
|
-
this.share_b
|
|
163
|
+
this.share_b?.perform();
|
|
159
164
|
}
|
|
160
165
|
dispose() {
|
|
161
166
|
this.capture_b.dispose();
|
|
162
167
|
this.download_b.dispose();
|
|
163
|
-
this.share_b
|
|
168
|
+
this.share_b?.dispose();
|
|
164
169
|
}
|
|
165
170
|
}
|
|
166
171
|
class CaptureButtonElement {
|
|
@@ -37,6 +37,8 @@ export class CanvasContext extends Context {
|
|
|
37
37
|
this.canvas.style.width = '100%';
|
|
38
38
|
this.canvas.style.height = '100%';
|
|
39
39
|
this.canvas.style.touchAction = 'none';
|
|
40
|
+
this.canvas.style.webkitUserSelect = 'none';
|
|
41
|
+
this.canvas.style.userSelect = 'none';
|
|
40
42
|
document.body.append(this.canvas);
|
|
41
43
|
}
|
|
42
44
|
else {
|
package/lib/types.d.ts
CHANGED
|
@@ -183,7 +183,8 @@ export declare enum ValuesType {
|
|
|
183
183
|
'layerclipids' = "layerclipids",
|
|
184
184
|
'easings' = "easings",
|
|
185
185
|
'layerids' = "layerids",
|
|
186
|
-
'streamids' = "streamids"
|
|
186
|
+
'streamids' = "streamids",
|
|
187
|
+
'behaviorids' = "behaviorids"
|
|
187
188
|
}
|
|
188
189
|
/**
|
|
189
190
|
* Interface representing a values definition.
|
package/lib/types.js
CHANGED
|
@@ -63,6 +63,7 @@ export var ValuesType;
|
|
|
63
63
|
ValuesType["easings"] = "easings";
|
|
64
64
|
ValuesType["layerids"] = "layerids";
|
|
65
65
|
ValuesType["streamids"] = "streamids";
|
|
66
|
+
ValuesType["behaviorids"] = "behaviorids";
|
|
66
67
|
})(ValuesType || (ValuesType = {}));
|
|
67
68
|
/**
|
|
68
69
|
* Checks if values in two objects are compatible.
|
package/lib/zcomponent.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Animation, Stream } from './animation/index';
|
|
2
|
+
import { Behavior, ConstructorForBehavior } from './behavior';
|
|
2
3
|
import { Component, ComponentChildren, ConstructorForComponent, ConstructorProps } from './component';
|
|
3
4
|
import { ContextManager, Context } from './context';
|
|
4
5
|
import { Entity } from './entity';
|
|
@@ -104,6 +105,11 @@ export declare class ZComponent<RootType = any> extends Component<RootType> {
|
|
|
104
105
|
* is an instance of that component, or return undefined if it is not.
|
|
105
106
|
*/
|
|
106
107
|
resolveNodeID<T extends Component = Component>(id: string, type?: ConstructorForComponent<T>): T | undefined;
|
|
108
|
+
/**
|
|
109
|
+
* This function returns the behavior with the given ID. If the behavior is not found, it will return undefined.
|
|
110
|
+
* This function is used to get a behavior from a behavior ID, which is a string representation of a behavior.
|
|
111
|
+
*/
|
|
112
|
+
resolveBehaviorID<T extends Behavior = Behavior>(id: string, type?: ConstructorForBehavior<T>): T | undefined;
|
|
107
113
|
/**
|
|
108
114
|
* Resolves an entity ID to an entity instance.
|
|
109
115
|
*
|
package/lib/zcomponent.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/* eslint-disable @typescript-eslint/no-this-alias */
|
|
2
2
|
import { Animation } from './animation/index';
|
|
3
|
-
import { shouldBehaviorRunAtDesignTime } from './behavior';
|
|
3
|
+
import { Behavior, shouldBehaviorRunAtDesignTime } from './behavior';
|
|
4
4
|
import { Component } from './component';
|
|
5
5
|
import { Context } from './context';
|
|
6
6
|
import { useOnBeforeRender } from './contexts/canvascontext';
|
|
@@ -289,6 +289,22 @@ export class ZComponent extends Component {
|
|
|
289
289
|
return entity;
|
|
290
290
|
return undefined;
|
|
291
291
|
}
|
|
292
|
+
/**
|
|
293
|
+
* This function returns the behavior with the given ID. If the behavior is not found, it will return undefined.
|
|
294
|
+
* This function is used to get a behavior from a behavior ID, which is a string representation of a behavior.
|
|
295
|
+
*/
|
|
296
|
+
resolveBehaviorID(id, type) {
|
|
297
|
+
const entity = this.entityByID.get(id);
|
|
298
|
+
if (!entity)
|
|
299
|
+
return this.getZComponentInstance()?.resolveBehaviorID(id, type);
|
|
300
|
+
if (!(entity instanceof Behavior))
|
|
301
|
+
return undefined;
|
|
302
|
+
if (!type)
|
|
303
|
+
return entity;
|
|
304
|
+
if (entity instanceof type)
|
|
305
|
+
return entity;
|
|
306
|
+
return undefined;
|
|
307
|
+
}
|
|
292
308
|
/**
|
|
293
309
|
* Resolves an entity ID to an entity instance.
|
|
294
310
|
*
|