@threekit-tools/treble 0.0.74 → 0.0.77

package/dist/Treble/Snapshots.d.ts

@@ -9,6 +9,7 @@ export interface ITakeSnapshotsConfig {
     format?: string;
     size?: SnapshotSize;
     filename?: string;
+    useStage?: boolean;
 }
 interface IGetSnapshot {
     size: SnapshotSize;
@@ -16,13 +17,11 @@ interface IGetSnapshot {
 }
 interface ISnapshots {
     getSnapshot(snapshotConfig: IGetSnapshot): Promise<string>;
-    getSnapshots(cameras: Array<string | undefined>, snapshotConfig: Pick<ITakeSnapshotsConfig, 'attributeName' | 'format' | 'size'>): Promise<Array<string>>;
     takeSnapshots(cameras: ISnapshotsCameras, config: ITakeSnapshotsConfig): Promise<void | string[] | Blob[] | null>;
 }
 declare class Snapshots implements ISnapshots {
     constructor();
     getSnapshot: ({ size, format }: IGetSnapshot) => Promise<string>;
-    getSnapshots: (cameras: Array<string | undefined>, snapshotConfig: Pick<ITakeSnapshotsConfig, 'attributeName' | 'format' | 'size'>) => Promise<string[]>;
     takeSnapshots: (camerasList: ISnapshotsCameras, snapshotsConfig: ITakeSnapshotsConfig) => Promise<void | string[] | Blob[] | null>;
 }
 export default Snapshots;

package/dist/Treble/Snapshots.js

@@ -49,22 +49,23 @@ var DEFAULT_CAMERA_CONFIG = {
     format: constants_1.SNAPSHOT_FORMATS.png,
     attributeName: constants_1.ATTRIBUTES_RESERVED.camera,
     output: constants_1.SNAPSHOT_OUTPUTS.blob,
+    useStage: false,
 };
 var cameraValues;
-var getCameraValue = function (cameraAttrName) {
+var getCameraValue = function (configurator, cameraAttrName) {
     if (cameraAttrName === void 0) { cameraAttrName = constants_1.ATTRIBUTES_RESERVED.camera; }
-    var attribute = window.threekit.configurator
+    var attribute = configurator
         .getDisplayAttributes()
         .find(function (el) { return el.name === cameraAttrName; });
     if (!attribute)
         return undefined;
     return attribute.value;
 };
-var getCamerasMap = function (cameraAttrName) {
+var getCamerasMap = function (configurator, cameraAttrName) {
     if (cameraAttrName === void 0) { cameraAttrName = constants_1.ATTRIBUTES_RESERVED.camera; }
     if (cameraValues)
         return cameraValues;
-    var attribute = window.threekit.configurator
+    var attribute = configurator
         .getDisplayAttributes()
         .find(function (el) { return el.name === cameraAttrName; });
     if (!attribute) {
@@ -83,97 +84,124 @@ var getCamerasMap = function (cameraAttrName) {
     }, {});
     return cameraValues;
 };
+var getSnapshot = function (_a) {
+    var size = _a.size, format = _a.format;
+    return window.threekit.player.snapshotAsync({
+        size: size,
+        mimeType: "image/".concat(constants_1.SNAPSHOT_FORMATS[format]),
+    });
+};
+var getSnapshots = function (cameras, snapshotConfig) { return __awaiter(void 0, void 0, void 0, function () {
+    var attributeName, size, format, configurator, _a, camerasMap, snapshots;
+    return __generator(this, function (_b) {
+        switch (_b.label) {
+            case 0:
+                attributeName = snapshotConfig.attributeName || DEFAULT_CAMERA_CONFIG.attributeName;
+                size = snapshotConfig.size || DEFAULT_CAMERA_CONFIG.size;
+                format = snapshotConfig.format || DEFAULT_CAMERA_CONFIG.format;
+                if (!(snapshotConfig === null || snapshotConfig === void 0 ? void 0 : snapshotConfig.useStage)) return [3 /*break*/, 2];
+                return [4 /*yield*/, window.threekit.player.getStageConfigurator()];
+            case 1:
+                _a = _b.sent();
+                return [3 /*break*/, 3];
+            case 2:
+                _a = window.threekit.configurator;
+                _b.label = 3;
+            case 3:
+                configurator = _a;
+                camerasMap = getCamerasMap(configurator, attributeName);
+                if (!camerasMap)
+                    return [2 /*return*/, Promise.resolve([])];
+                snapshots = [];
+                return [2 /*return*/, cameras.reduce(function (snapshotPromise, camera) {
+                        return snapshotPromise.then(function () {
+                            return new Promise(function (resolve) { return __awaiter(void 0, void 0, void 0, function () {
+                                var snapshotStr;
+                                var _a;
+                                return __generator(this, function (_b) {
+                                    switch (_b.label) {
+                                        case 0:
+                                            if (!camera) return [3 /*break*/, 2];
+                                            return [4 /*yield*/, configurator.setConfiguration((_a = {},
+                                                    _a[attributeName] = camerasMap[camera],
+                                                    _a))];
+                                        case 1:
+                                            _b.sent();
+                                            _b.label = 2;
+                                        case 2: return [4 /*yield*/, getSnapshot({ size: size, format: format })];
+                                        case 3:
+                                            snapshotStr = _b.sent();
+                                            snapshots.push(snapshotStr);
+                                            resolve(snapshots);
+                                            return [2 /*return*/];
+                                    }
+                                });
+                            }); });
+                        });
+                    }, Promise.resolve(snapshots))];
+        }
+    });
+}); };
 var Snapshots = /** @class */ (function () {
     function Snapshots() {
         var _this = this;
-        this.getSnapshot = function (_a) {
-            var size = _a.size, format = _a.format;
-            return window.threekit.player.snapshotAsync({
-                size: size,
-                mimeType: "image/".concat(constants_1.SNAPSHOT_FORMATS[format]),
-            });
-        };
-        this.getSnapshots = function (cameras, snapshotConfig) {
-            var attributeName = snapshotConfig.attributeName || DEFAULT_CAMERA_CONFIG.attributeName;
-            var size = snapshotConfig.size || DEFAULT_CAMERA_CONFIG.size;
-            var format = snapshotConfig.format || DEFAULT_CAMERA_CONFIG.format;
-            var camerasMap = getCamerasMap(attributeName);
-            if (!camerasMap)
-                return Promise.resolve([]);
-            var snapshots = [];
-            return cameras.reduce(function (snapshotPromise, camera) {
-                return snapshotPromise.then(function () {
-                    return new Promise(function (resolve) { return __awaiter(_this, void 0, void 0, function () {
-                        var snapshotStr;
-                        var _a;
-                        return __generator(this, function (_b) {
-                            switch (_b.label) {
-                                case 0:
-                                    if (!camera) return [3 /*break*/, 2];
-                                    return [4 /*yield*/, window.threekit.configurator.setConfiguration((_a = {},
-                                            _a[attributeName] = camerasMap[camera],
-                                            _a))];
-                                case 1:
-                                    _b.sent();
-                                    _b.label = 2;
-                                case 2: return [4 /*yield*/, this.getSnapshot({ size: size, format: format })];
-                                case 3:
-                                    snapshotStr = _b.sent();
-                                    snapshots.push(snapshotStr);
-                                    resolve(snapshots);
-                                    return [2 /*return*/];
-                            }
-                        });
-                    }); });
-                });
-            }, Promise.resolve(snapshots));
-        };
+        this.getSnapshot = getSnapshot;
         this.takeSnapshots = function (camerasList, snapshotsConfig) { return __awaiter(_this, void 0, void 0, function () {
-            var filename, size, format, attributeName, output, cameras, snapshotsRaw, snapshotData, camerasMap_1, currentCamera, cameraPosition, _a, attachments, response, urlsArray, snapshotBlobs, snapshotFiles;
-            var _b;
-            return __generator(this, function (_c) {
-                switch (_c.label) {
+            var filename, size, format, attributeName, output, configurator, _a, cameras, snapshotsRaw, snapshotData, camerasMap_1, currentCamera, cameraPosition, _b, attachments, response, urlsArray, snapshotBlobs, snapshotFiles;
+            var _c;
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0:
                         filename = (snapshotsConfig === null || snapshotsConfig === void 0 ? void 0 : snapshotsConfig.filename) || DEFAULT_CAMERA_CONFIG.filename;
                         size = (snapshotsConfig === null || snapshotsConfig === void 0 ? void 0 : snapshotsConfig.size) || DEFAULT_CAMERA_CONFIG.size;
                         format = (snapshotsConfig === null || snapshotsConfig === void 0 ? void 0 : snapshotsConfig.format) || DEFAULT_CAMERA_CONFIG.format;
                         attributeName = (snapshotsConfig === null || snapshotsConfig === void 0 ? void 0 : snapshotsConfig.attributeName) || DEFAULT_CAMERA_CONFIG.attributeName;
                         output = (snapshotsConfig === null || snapshotsConfig === void 0 ? void 0 : snapshotsConfig.output) || DEFAULT_CAMERA_CONFIG.output;
+                        if (!(snapshotsConfig === null || snapshotsConfig === void 0 ? void 0 : snapshotsConfig.useStage)) return [3 /*break*/, 2];
+                        return [4 /*yield*/, window.threekit.player.getStageConfigurator()];
+                    case 1:
+                        _a = _d.sent();
+                        return [3 /*break*/, 3];
+                    case 2:
+                        _a = window.threekit.configurator;
+                        _d.label = 3;
+                    case 3:
+                        configurator = _a;
                         cameras = Array.isArray(camerasList) ? camerasList : [camerasList];
-                        if (!(cameras.length === 1 && cameras[0] === undefined)) return [3 /*break*/, 2];
+                        if (!(cameras.length === 1 && cameras[0] === undefined)) return [3 /*break*/, 5];
                         return [4 /*yield*/, this.getSnapshot({ size: size, format: format })];
-                    case 1:
-                        snapshotData = _c.sent();
+                    case 4:
+                        snapshotData = _d.sent();
                         snapshotsRaw = [snapshotData];
-                        return [3 /*break*/, 5];
-                    case 2:
-                        camerasMap_1 = getCamerasMap(attributeName);
+                        return [3 /*break*/, 8];
+                    case 5:
+                        camerasMap_1 = getCamerasMap(configurator, attributeName);
                         if (!camerasMap_1)
                             return [2 /*return*/, null];
                         cameras = cameras.filter(function (el) { return el === undefined || Object.keys(camerasMap_1).includes(el); });
-                        currentCamera = getCameraValue(attributeName);
+                        currentCamera = getCameraValue(configurator, attributeName);
                         cameraPosition = (0, utils_1.getCameraPosition)(window.threekit.player.camera);
-                        return [4 /*yield*/, this.getSnapshots(cameras, camerasMap_1)];
-                    case 3:
-                        snapshotsRaw = _c.sent();
-                        return [4 /*yield*/, window.threekit.configurator.setConfiguration((_b = {},
-                                _b[attributeName] = currentCamera,
-                                _b))];
-                    case 4:
-                        _c.sent();
+                        return [4 /*yield*/, getSnapshots(cameras, snapshotsConfig)];
+                    case 6:
+                        snapshotsRaw = _d.sent();
+                        return [4 /*yield*/, configurator.setConfiguration((_c = {},
+                                _c[attributeName] = currentCamera,
+                                _c))];
+                    case 7:
+                        _d.sent();
                         (0, utils_1.setCameraPosition)(window.threekit.player.camera, cameraPosition);
-                        _c.label = 5;
-                    case 5:
-                        _a = output;
-                        switch (_a) {
-                            case constants_1.SNAPSHOT_OUTPUTS.url: return [3 /*break*/, 6];
-                            case constants_1.SNAPSHOT_OUTPUTS.download: return [3 /*break*/, 8];
-                            case constants_1.SNAPSHOT_OUTPUTS.blob: return [3 /*break*/, 9];
-                            case constants_1.SNAPSHOT_OUTPUTS.file: return [3 /*break*/, 10];
-                            case constants_1.SNAPSHOT_OUTPUTS.dataUrl: return [3 /*break*/, 11];
+                        _d.label = 8;
+                    case 8:
+                        _b = output;
+                        switch (_b) {
+                            case constants_1.SNAPSHOT_OUTPUTS.url: return [3 /*break*/, 9];
+                            case constants_1.SNAPSHOT_OUTPUTS.download: return [3 /*break*/, 11];
+                            case constants_1.SNAPSHOT_OUTPUTS.blob: return [3 /*break*/, 12];
+                            case constants_1.SNAPSHOT_OUTPUTS.file: return [3 /*break*/, 13];
+                            case constants_1.SNAPSHOT_OUTPUTS.dataUrl: return [3 /*break*/, 14];
                         }
-                        return [3 /*break*/, 11];
-                    case 6:
+                        return [3 /*break*/, 14];
+                    case 9:
                         attachments = snapshotsRaw.reduce(function (output, el, idx) {
                             var _a;
                             var cameraName = (camerasList === null || camerasList === void 0 ? void 0 : camerasList[idx])
@@ -190,11 +218,11 @@ var Snapshots = /** @class */ (function () {
                                 configuration: window.threekit.configurator.getConfiguration(),
                                 attachments: attachments,
                             })];
-                    case 7:
-                        response = _c.sent();
+                    case 10:
+                        response = _d.sent();
                         urlsArray = Object.values(response.data.attachments);
                         return [2 /*return*/, Promise.resolve(urlsArray)];
-                    case 8:
+                    case 11:
                         snapshotsRaw.forEach(function (snapshotBlob, idx) {
                             var cameraName = (camerasList === null || camerasList === void 0 ? void 0 : camerasList[idx])
                                 ? "-".concat((0, utils_1.regularToKebabCase)(camerasList[idx] || 'default'))
@@ -202,10 +230,10 @@ var Snapshots = /** @class */ (function () {
                             (0, utils_1.downloadSnapshot)(snapshotBlob, "".concat(filename).concat(cameraName, ".").concat(format));
                         });
                         return [2 /*return*/, Promise.resolve()];
-                    case 9:
+                    case 12:
                         snapshotBlobs = snapshotsRaw.map(function (el) { return (0, utils_1.dataURItoBlob)(el); });
                         return [2 /*return*/, Promise.resolve(snapshotBlobs)];
-                    case 10:
+                    case 13:
                         snapshotFiles = snapshotsRaw.map(function (el, idx) {
                             var cameraName = (camerasList === null || camerasList === void 0 ? void 0 : camerasList[idx])
                                 ? "-".concat((0, utils_1.regularToKebabCase)(camerasList[idx] || 'default'))
@@ -213,7 +241,7 @@ var Snapshots = /** @class */ (function () {
                             return (0, utils_1.dataURItoFile)(el, "".concat(filename).concat(cameraName, ".").concat(format));
                         });
                         return [2 /*return*/, Promise.resolve(snapshotFiles)];
-                    case 11: return [2 /*return*/, Promise.resolve(snapshotsRaw)];
+                    case 14: return [2 /*return*/, Promise.resolve(snapshotsRaw)];
                 }
             });
         }); };

package/dist/hooks/useNestedConfigurator/index.js

@@ -65,7 +65,7 @@ var useNestedConfigurator = function (address) {
             setAttributes(updatedAttrs);
             metadataRef.current = configurator.current.getMetadata();
         })();
-    }, [address, hasInitialized, playerLoading]);
+    }, [JSON.stringify(address), hasInitialized, playerLoading]);
     if (!hasInitialized || !configurator.current || !attributes)
         return [undefined, undefined, undefined, undefined];
     var handleSelect = function (config) { return __awaiter(void 0, void 0, void 0, function () {

package/dist/hooks/useProductCache/index.d.ts

@@ -1,4 +1,4 @@
-import { CachedProduct } from '../../store/product';
+import { CachedProduct, LoadProductConfig } from '../../store/product';
 import { IReloadConfig } from '../../store/treble';
 interface HydratedCacheProduct extends Pick<CachedProduct, 'name' | 'label' | 'thumbnail'> {
     selected: boolean;
@@ -8,7 +8,7 @@ interface HydratedCacheProduct extends Pick<CachedProduct, 'name' | 'label' | 't
 interface ISelectableProduct {
     id: string;
     label: string;
-    handleSelect: () => void;
+    handleSelect: (config?: LoadProductConfig) => void;
 }
 interface CacheData {
     cache: Array<HydratedCacheProduct>;

package/dist/hooks/useProductCache/index.js

@@ -21,7 +21,9 @@ var useProductCache = function () {
     var products = Object.keys(product_1.PRODUCTS).map(function (prod) { return ({
         id: prod,
         label: prod,
-        handleSelect: function () { return dispatch((0, product_1.loadProduct)(prod)); },
+        handleSelect: function (config) {
+            return dispatch((0, product_1.loadProduct)(prod, config));
+        },
     }); });
     return [{ cache: hydratedCache, products: products }, handleLoadNewProduct];
 };

package/dist/store/product.d.ts

@@ -13,6 +13,9 @@ export interface CachedProduct {
     connection: IConnectionConfig;
     configuration: IConfiguration;
 }
+export interface LoadProductConfig {
+    cacheProduct: boolean;
+}
 export interface CachedProductState extends Pick<CachedProduct, 'id' | 'name' | 'label' | 'thumbnail'> {
     data: string;
 }
@@ -60,7 +63,7 @@ export declare const cacheActiveProduct: (config?: Pick<IReloadConfig, "label" |
     payload: CachedProductState;
     type: string;
 };
-export declare const loadProduct: (id: string) => (dispatch: ThreekitDispatch, getState: () => RootState) => Promise<void>;
+export declare const loadProduct: (id: string, config?: LoadProductConfig | undefined) => (dispatch: ThreekitDispatch, getState: () => RootState) => Promise<void>;
 export declare const loadNewProduct: (config: undefined | string | IReloadConfig) => (dispatch: ThreekitDispatch) => Promise<void>;
 export declare const changeActiveCacheIdx: (idx: number) => (dispatch: ThreekitDispatch, getState: () => RootState) => Promise<void>;
 export declare const removeProductIdx: (idx?: number | undefined) => (dispatch: ThreekitDispatch, getState: () => RootState) => Promise<void>;

package/dist/store/product.js

@@ -193,25 +193,25 @@ var cacheActiveProduct = function (config) {
     };
 };
 exports.cacheActiveProduct = cacheActiveProduct;
-var loadProduct = function (id) {
+var loadProduct = function (id, config) {
     return function (dispatch, getState) { return __awaiter(void 0, void 0, void 0, function () {
-        var state, productsList, shouldCacheProduct, productConfig;
+        var cacheProduct, state, productsList, productConfig;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
+                    cacheProduct = (config || { cacheProduct: true }).cacheProduct;
                     state = getState();
                     productsList = Object.keys(exports.PRODUCTS);
-                    shouldCacheProduct = true;
                     if (!productsList.includes(id))
                         return [2 /*return*/];
                     productConfig = exports.PRODUCTS[id][state.treble.threekitEnv];
                     dispatch((0, exports.setProductId)(id));
-                    if (shouldCacheProduct)
+                    if (cacheProduct)
                         dispatch((0, exports.cacheActiveProduct)());
                     return [4 /*yield*/, dispatch((0, treble_1.reloadPlayer)(productConfig))];
                 case 1:
                     _a.sent();
-                    if (shouldCacheProduct) {
+                    if (cacheProduct) {
                         dispatch((0, exports.incrementActiveCacheIdx)());
                         dispatch((0, exports.cacheActiveProduct)());
                     }

package/dist/types.d.ts

@@ -218,6 +218,7 @@ export interface IThreekitPlayer {
     setActiveCamera: () => void;
     on: (phase: SCENE_PHASES | string, callback: (args: any) => void) => void;
     getConfigurator: () => Promise<IThreekitConfigurator>;
+    getStageConfigurator: () => Promise<IThreekitConfigurator>;
     enableApi: (api: PRIVATE_APIS) => any;
     snapshotAsync: (snapshotConfig: ISnapshotConfig) => Promise<string>;
     unload: () => Promise<string>;

package/dist/utils.d.ts

@@ -22,6 +22,7 @@ export declare const generateLayoutClassName: (component: string, customClassNam
 export declare const generateToolClassName: (component: string, customClassName?: string | undefined, title?: string | undefined) => string;
 export declare const generateDisplayClassName: (component: string, customClassName?: string | undefined, title?: string | undefined) => string;
 export declare const generateFormClassName: (component: string, customClassName?: string | undefined, title?: string | undefined) => string;
+export declare const isIOS: () => RegExpMatchArray | null;
 export declare const isJsonString: (str: string) => boolean;
 export declare const objectToQueryStr: (obj: Record<string, any>) => string;
 export declare const getParams: () => Record<string, string | {

package/dist/utils.js

@@ -45,7 +45,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.loadTrebleConfig = exports.isUuid = exports.filterFormAttributes = exports.selectionToConfiguration = exports.hydrateAttribute = exports.metadataValueToObject = exports.easeInOutCubic = exports.copyToClipboard = exports.downloadSnapshot = exports.dataURItoFile = exports.dataURItoBlob = exports.setCameraPosition = exports.getCameraPosition = exports.findHitNode = exports.deflateRgb = exports.inflateRgb = exports.rgbToHex = exports.hexToRgb = exports.regularToKebabCase = exports.deepCompare = exports.shallowCompare = exports.getResumableUrl = exports.getParams = exports.objectToQueryStr = exports.isJsonString = exports.generateFormClassName = exports.generateDisplayClassName = exports.generateToolClassName = exports.generateLayoutClassName = exports.generateWidgetClassName = exports.generateInputClassName = exports.generateClassName = void 0;
+exports.loadTrebleConfig = exports.isUuid = exports.filterFormAttributes = exports.selectionToConfiguration = exports.hydrateAttribute = exports.metadataValueToObject = exports.easeInOutCubic = exports.copyToClipboard = exports.downloadSnapshot = exports.dataURItoFile = exports.dataURItoBlob = exports.setCameraPosition = exports.getCameraPosition = exports.findHitNode = exports.deflateRgb = exports.inflateRgb = exports.rgbToHex = exports.hexToRgb = exports.regularToKebabCase = exports.deepCompare = exports.shallowCompare = exports.getResumableUrl = exports.getParams = exports.objectToQueryStr = exports.isJsonString = exports.isIOS = exports.generateFormClassName = exports.generateDisplayClassName = exports.generateToolClassName = exports.generateLayoutClassName = exports.generateWidgetClassName = exports.generateInputClassName = exports.generateClassName = void 0;
 var constants_1 = require("./constants");
 var generateClassName = function (baseClass) {
     return function (component, customClassName, title) {
@@ -65,6 +65,8 @@ exports.generateLayoutClassName = (0, exports.generateClassName)(constants_1.LAY
 exports.generateToolClassName = (0, exports.generateClassName)(constants_1.TOOL_CLASS_NAME);
 exports.generateDisplayClassName = (0, exports.generateClassName)(constants_1.DISPLAY_CLASS_NAME);
 exports.generateFormClassName = (0, exports.generateClassName)(constants_1.FORM_CLASS_NAME);
+var isIOS = function () { return navigator.userAgent.match(/ipad|iphone/i); };
+exports.isIOS = isIOS;
 var isJsonString = function (str) {
     try {
         JSON.parse(str);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@threekit-tools/treble",
-  "version": "0.0.74",
+  "version": "0.0.77",
   "author": "Amaan Saeed",
   "license": "MIT",
   "files": [