@threekit-tools/treble 0.0.69 → 0.0.72

package/dist/Treble/Snapshots.js

@@ -40,7 +40,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var api_1 = __importDefault(require("../api"));
-var connection_1 = __importDefault(require("../connection"));
+// import connection from '../connection';
 var constants_1 = require("../constants");
 var utils_1 = require("../utils");
 var DEFAULT_CAMERA_CONFIG = {
@@ -129,12 +129,11 @@ var Snapshots = /** @class */ (function () {
             }, Promise.resolve(snapshots));
         };
         this.takeSnapshots = function (camerasList, snapshotsConfig) { return __awaiter(_this, void 0, void 0, function () {
-            var _a, threekitDomain, orgId, filename, size, format, attributeName, output, cameras, snapshotsRaw, snapshotData, camerasMap_1, currentCamera, cameraPosition, _b, attachments, response_1, urlsArray, snapshotBlobs, snapshotFiles;
-            var _c;
-            return __generator(this, function (_d) {
-                switch (_d.label) {
+            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) {
                     case 0:
-                        _a = connection_1.default.getConnection(), threekitDomain = _a.threekitDomain, orgId = _a.orgId;
                         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;
@@ -144,7 +143,7 @@ var Snapshots = /** @class */ (function () {
                         if (!(cameras.length === 1 && cameras[0] === undefined)) return [3 /*break*/, 2];
                         return [4 /*yield*/, this.getSnapshot({ size: size, format: format })];
                     case 1:
-                        snapshotData = _d.sent();
+                        snapshotData = _c.sent();
                         snapshotsRaw = [snapshotData];
                         return [3 /*break*/, 5];
                     case 2:
@@ -156,17 +155,17 @@ var Snapshots = /** @class */ (function () {
                         cameraPosition = (0, utils_1.getCameraPosition)(window.threekit.player.camera);
                         return [4 /*yield*/, this.getSnapshots(cameras, camerasMap_1)];
                     case 3:
-                        snapshotsRaw = _d.sent();
-                        return [4 /*yield*/, window.threekit.configurator.setConfiguration((_c = {},
-                                _c[attributeName] = currentCamera,
-                                _c))];
+                        snapshotsRaw = _c.sent();
+                        return [4 /*yield*/, window.threekit.configurator.setConfiguration((_b = {},
+                                _b[attributeName] = currentCamera,
+                                _b))];
                     case 4:
-                        _d.sent();
+                        _c.sent();
                         (0, utils_1.setCameraPosition)(window.threekit.player.camera, cameraPosition);
-                        _d.label = 5;
+                        _c.label = 5;
                     case 5:
-                        _b = output;
-                        switch (_b) {
+                        _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];
@@ -179,8 +178,11 @@ var Snapshots = /** @class */ (function () {
                             var _a;
                             var cameraName = (camerasList === null || camerasList === void 0 ? void 0 : camerasList[idx])
                                 ? (0, utils_1.regularToKebabCase)(camerasList[idx] || 'default')
-                                : '';
-                            var file = (0, utils_1.dataURItoFile)(el, "".concat(filename, "-").concat(cameraName, ".").concat(format));
+                                : filename;
+                            var preppedFilename = cameraName === filename
+                                ? "".concat(filename, ".").concat(format)
+                                : "".concat(filename, "-").concat(cameraName, ".").concat(format);
+                            var file = (0, utils_1.dataURItoFile)(el, preppedFilename);
                             return Object.assign(output, (_a = {}, _a[cameraName] = file, _a));
                         }, {});
                         return [4 /*yield*/, api_1.default.configurations.save({
@@ -189,10 +191,8 @@ var Snapshots = /** @class */ (function () {
                                 attachments: attachments,
                             })];
                     case 7:
-                        response_1 = _d.sent();
-                        urlsArray = Object.keys(response_1.data.attachments).map(function (key) {
-                            return "".concat(threekitDomain, "/api/configurations/").concat(response_1.data.shortId, "/files/").concat(key, "?orgId=").concat(orgId);
-                        });
+                        response = _c.sent();
+                        urlsArray = Object.values(response.data.attachments);
                         return [2 /*return*/, Promise.resolve(urlsArray)];
                     case 8:
                         snapshotsRaw.forEach(function (snapshotBlob, idx) {

package/dist/api/datatables.js

@@ -70,8 +70,6 @@ var getDatatable = function (datatableId, config) { return __awaiter(void 0, voi
                         return output;
                     var rowOutput = row.reduce(function (result, el, i) {
                         var _a;
-                        if (!i)
-                            return result;
                         return Object.assign(result, (_a = {},
                             _a[headings[i]] = el.length
                                 ? (0, utils_1.isJsonString)(el)

package/dist/components/ProductDescription/index.d.ts

@@ -4,8 +4,8 @@ interface IProductDescription {
     description?: string;
     className?: string;
 }
-export declare const ProductDescription: {
-    (props: IProductDescription): JSX.Element | null;
+export declare const ProductDescriptionComponent: {
+    (props: IProductDescription): JSX.Element;
     propTypes: {
         /**
          * The description displayed to the user
@@ -21,4 +21,5 @@ export declare const ProductDescription: {
         className: string;
     };
 };
+declare const ProductDescription: (props: IProductDescription) => JSX.Element | null;
 export default ProductDescription;

package/dist/components/ProductDescription/index.js

@@ -3,25 +3,31 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ProductDescription = void 0;
+exports.ProductDescriptionComponent = void 0;
 var react_1 = __importDefault(require("react"));
 var prop_types_1 = __importDefault(require("prop-types"));
-var description_styles_1 = require("./description.styles");
+var productDescription_styles_1 = require("./productDescription.styles");
 var useMetadata_1 = __importDefault(require("../../hooks/useMetadata"));
 var utils_1 = require("../../utils");
+var ProductDescriptionComponent = function (props) {
+    var _a = Object.assign({ className: '' }, props), description = _a.description, customClassName = _a.className;
+    var cls = (0, utils_1.generateDisplayClassName)('description', customClassName);
+    return react_1.default.createElement(productDescription_styles_1.Wrapper, { className: cls }, description);
+};
+exports.ProductDescriptionComponent = ProductDescriptionComponent;
 var ProductDescription = function (props) {
-    var _a = Object.assign({
+    var _a;
+    var _b = Object.assign({
         description: undefined,
-        className: '',
-    }, props), description = _a.description, customClassName = _a.className;
+    }, props), description = _b.description, className = _b.className;
     var metadata = (0, useMetadata_1.default)();
     if (!description && !(metadata === null || metadata === void 0 ? void 0 : metadata._description))
         return null;
-    var cls = (0, utils_1.generateDisplayClassName)('description', customClassName);
-    return (react_1.default.createElement(description_styles_1.Wrapper, { className: cls }, (metadata === null || metadata === void 0 ? void 0 : metadata._description) || description));
+    if (!description)
+        return null;
+    return (react_1.default.createElement(exports.ProductDescriptionComponent, { className: className, description: ((_a = metadata === null || metadata === void 0 ? void 0 : metadata._description) === null || _a === void 0 ? void 0 : _a.toString()) || description }));
 };
-exports.ProductDescription = ProductDescription;
-exports.ProductDescription.propTypes = {
+exports.ProductDescriptionComponent.propTypes = {
     /**
      * The description displayed to the user
      */
@@ -31,8 +37,8 @@ exports.ProductDescription.propTypes = {
      */
     className: prop_types_1.default.string,
 };
-exports.ProductDescription.defaultProps = {
+exports.ProductDescriptionComponent.defaultProps = {
     description: undefined,
     className: '',
 };
-exports.default = exports.ProductDescription;
+exports.default = ProductDescription;

package/dist/components/ProductName/index.d.ts

@@ -5,8 +5,8 @@ interface ITitle {
     className?: string;
     align?: string;
 }
-export declare const ProductName: {
-    (props: ITitle): JSX.Element | null;
+export declare const ProductNameComponent: {
+    (props: ITitle): JSX.Element;
     propTypes: {
         /**
          * The title displayed to the user
@@ -26,4 +26,5 @@ export declare const ProductName: {
         align: string;
     };
 };
+export declare const ProductName: (props: ITitle) => JSX.Element | null;
 export default ProductName;

package/dist/components/ProductName/index.js

@@ -3,22 +3,27 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ProductName = void 0;
+exports.ProductName = exports.ProductNameComponent = void 0;
 var react_1 = __importDefault(require("react"));
 var prop_types_1 = __importDefault(require("prop-types"));
 var productName_styles_1 = require("./productName.styles");
 var useName_1 = __importDefault(require("../../hooks/useName"));
 var utils_1 = require("../../utils");
-var ProductName = function (props) {
+var ProductNameComponent = function (props) {
     var _a = Object.assign({ className: '', align: 'left' }, props), title = _a.title, customClassName = _a.className, align = _a.align;
+    var cls = (0, utils_1.generateDisplayClassName)('title', customClassName);
+    return (react_1.default.createElement(productName_styles_1.Wrapper, { align: align, className: cls }, title));
+};
+exports.ProductNameComponent = ProductNameComponent;
+var ProductName = function (props) {
+    var title = props.title, className = props.className, align = props.align;
     var name = (0, useName_1.default)();
     if (!(title === null || title === void 0 ? void 0 : title.length) && !name)
         return null;
-    var cls = (0, utils_1.generateDisplayClassName)('title', customClassName);
-    return (react_1.default.createElement(productName_styles_1.Wrapper, { align: align, className: cls }, title || name));
+    return (react_1.default.createElement(exports.ProductNameComponent, { align: align, className: className, title: title || name }));
 };
 exports.ProductName = ProductName;
-exports.ProductName.propTypes = {
+exports.ProductNameComponent.propTypes = {
     /**
      * The title displayed to the user
      */
@@ -32,7 +37,7 @@ exports.ProductName.propTypes = {
      */
     align: prop_types_1.default.string,
 };
-exports.ProductName.defaultProps = {
+exports.ProductNameComponent.defaultProps = {
     className: '',
     align: 'left',
 };

package/dist/components/TotalPrice/index.d.ts

@@ -4,8 +4,8 @@ interface IPrice {
     price?: string;
     className?: string;
 }
-export declare const TotalPrice: {
-    (props: IPrice): JSX.Element | null;
+export declare const TotalPriceComponent: {
+    (props: IPrice): JSX.Element;
     propTypes: {
         /**
          * The price displayed to the user
@@ -21,4 +21,5 @@ export declare const TotalPrice: {
         className: string;
     };
 };
+export declare const TotalPrice: (props: IPrice) => JSX.Element | null;
 export default TotalPrice;

package/dist/components/TotalPrice/index.js

@@ -3,25 +3,30 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TotalPrice = void 0;
+exports.TotalPrice = exports.TotalPriceComponent = void 0;
 var react_1 = __importDefault(require("react"));
 var prop_types_1 = __importDefault(require("prop-types"));
 var totalPrice_styles_1 = require("./totalPrice.styles");
 var usePrice_1 = __importDefault(require("../../hooks/usePrice"));
 var utils_1 = require("../../utils");
-var TotalPrice = function (props) {
+var TotalPriceComponent = function (props) {
     var price = props.price, customClassName = props.className;
-    var priceData = (0, usePrice_1.default)();
     var cls = (0, utils_1.generateDisplayClassName)('price', customClassName);
+    return react_1.default.createElement(totalPrice_styles_1.Wrapper, { className: cls }, price);
+};
+exports.TotalPriceComponent = TotalPriceComponent;
+var TotalPrice = function (props) {
+    var price = props.price, className = props.className;
+    var priceData = (0, usePrice_1.default)();
     var preppedPrice = props.price;
     if (priceData)
         preppedPrice = "".concat(priceData.price, " ").concat(priceData.currency);
     if (!price && !priceData)
         return null;
-    return react_1.default.createElement(totalPrice_styles_1.Wrapper, { className: cls }, preppedPrice);
+    return react_1.default.createElement(exports.TotalPriceComponent, { className: className, price: preppedPrice });
 };
 exports.TotalPrice = TotalPrice;
-exports.TotalPrice.propTypes = {
+exports.TotalPriceComponent.propTypes = {
     /**
      * The price displayed to the user
      */
@@ -31,7 +36,7 @@ exports.TotalPrice.propTypes = {
      */
     className: prop_types_1.default.string,
 };
-exports.TotalPrice.defaultProps = {
+exports.TotalPriceComponent.defaultProps = {
     price: undefined,
     className: '',
 };

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

@@ -0,0 +1,2 @@
+declare const useConfigurationLoader: () => (configurationId: string) => Promise<void>;
+export default useConfigurationLoader;

package/dist/hooks/useConfigurationLoader/index.js

@@ -0,0 +1,68 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var api_1 = __importDefault(require("../../api"));
+var attributes_1 = require("../../store/attributes");
+var store_1 = require("../../store");
+var useConfigurationLoader = function () {
+    var dispatch = (0, store_1.useThreekitDispatch)();
+    var loadConfiguration = function (configurationId) { return __awaiter(void 0, void 0, void 0, function () {
+        var configuration;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    if (!configurationId)
+                        return [2 /*return*/];
+                    return [4 /*yield*/, api_1.default.configurations.fetch(configurationId)];
+                case 1:
+                    configuration = _a.sent();
+                    if (!configuration)
+                        return [2 /*return*/];
+                    return [4 /*yield*/, dispatch((0, attributes_1.setConfiguration)(configuration.data.variant))];
+                case 2:
+                    _a.sent();
+                    return [2 /*return*/, Promise.resolve()];
+            }
+        });
+    }); };
+    return loadConfiguration;
+};
+exports.default = useConfigurationLoader;

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 import useAttribute from './hooks/useAttribute';
 import useConfigurator from './hooks/useConfigurator';
+import useConfigurationLoader from './hooks/useConfigurationLoader';
 import useMetadata from './hooks/useMetadata';
 import useName from './hooks/useName';
 import usePlayerLoadingStatus from './hooks/usePlayerLoadingStatus';
@@ -45,4 +46,4 @@ import icons from './icons';
 export * from './icons';
 import TrebleApp from './components/TrebleApp';
 import ProductLayout from './components/ProductLayout';
-export { useAttribute, useConfigurator, useMetadata, useName, usePlayerLoadingStatus, usePrice, useThreekitInitStatus, useZoom, useSnapshot, useWishlist, useShare, usePlayerPortal, useProductCache, useNestedConfigurator, ThreekitProvider, Player, Button, Cards, Dropdown, Strips, Swatch, Tiles, TilesGroup, Upload, Switch, ProductName, ProductDescription, AttributeTitle, AttributeValue, TotalPrice, message, Modal, Drawer, Accordion, Tabs, PortalToArOverlay, PortalToElement, AwaitThreekitLoad, FlatForm, Zoom, Snapshots, Wishlist, Share, icons, TrebleApp, ProductLayout, };
+export { useAttribute, useConfigurator, useConfigurationLoader, useMetadata, useName, usePlayerLoadingStatus, usePrice, useThreekitInitStatus, useZoom, useSnapshot, useWishlist, useShare, usePlayerPortal, useProductCache, useNestedConfigurator, ThreekitProvider, Player, Button, Cards, Dropdown, Strips, Swatch, Tiles, TilesGroup, Upload, Switch, ProductName, ProductDescription, AttributeTitle, AttributeValue, TotalPrice, message, Modal, Drawer, Accordion, Tabs, PortalToArOverlay, PortalToElement, AwaitThreekitLoad, FlatForm, Zoom, Snapshots, Wishlist, Share, icons, TrebleApp, ProductLayout, };

package/dist/index.js

@@ -13,12 +13,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ProductLayout = exports.TrebleApp = exports.icons = exports.Share = exports.Wishlist = exports.Snapshots = exports.Zoom = exports.FlatForm = exports.AwaitThreekitLoad = exports.PortalToElement = exports.PortalToArOverlay = exports.Tabs = exports.Accordion = exports.Drawer = exports.Modal = exports.message = exports.TotalPrice = exports.AttributeValue = exports.AttributeTitle = exports.ProductDescription = exports.ProductName = exports.Switch = exports.Upload = exports.TilesGroup = exports.Tiles = exports.Swatch = exports.Strips = exports.Dropdown = exports.Cards = exports.Button = exports.Player = exports.ThreekitProvider = exports.useNestedConfigurator = exports.useProductCache = exports.usePlayerPortal = exports.useShare = exports.useWishlist = exports.useSnapshot = exports.useZoom = exports.useThreekitInitStatus = exports.usePrice = exports.usePlayerLoadingStatus = exports.useName = exports.useMetadata = exports.useConfigurator = exports.useAttribute = void 0;
+exports.ProductLayout = exports.TrebleApp = exports.icons = exports.Share = exports.Wishlist = exports.Snapshots = exports.Zoom = exports.FlatForm = exports.AwaitThreekitLoad = exports.PortalToElement = exports.PortalToArOverlay = exports.Tabs = exports.Accordion = exports.Drawer = exports.Modal = exports.message = exports.TotalPrice = exports.AttributeValue = exports.AttributeTitle = exports.ProductDescription = exports.ProductName = exports.Switch = exports.Upload = exports.TilesGroup = exports.Tiles = exports.Swatch = exports.Strips = exports.Dropdown = exports.Cards = exports.Button = exports.Player = exports.ThreekitProvider = exports.useNestedConfigurator = exports.useProductCache = exports.usePlayerPortal = exports.useShare = exports.useWishlist = exports.useSnapshot = exports.useZoom = exports.useThreekitInitStatus = exports.usePrice = exports.usePlayerLoadingStatus = exports.useName = exports.useMetadata = exports.useConfigurationLoader = exports.useConfigurator = exports.useAttribute = void 0;
 //  Hooks
 var useAttribute_1 = __importDefault(require("./hooks/useAttribute"));
 exports.useAttribute = useAttribute_1.default;
 var useConfigurator_1 = __importDefault(require("./hooks/useConfigurator"));
 exports.useConfigurator = useConfigurator_1.default;
+var useConfigurationLoader_1 = __importDefault(require("./hooks/useConfigurationLoader"));
+exports.useConfigurationLoader = useConfigurationLoader_1.default;
 var useMetadata_1 = __importDefault(require("./hooks/useMetadata"));
 exports.useMetadata = useMetadata_1.default;
 var useName_1 = __importDefault(require("./hooks/useName"));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@threekit-tools/treble",
-  "version": "0.0.69",
+  "version": "0.0.72",
   "author": "Amaan Saeed",
   "license": "MIT",
   "files": [
@@ -60,12 +60,13 @@
     "@types/webpack-env": "^1.16.3",
     "babel-jest": "^27.5.1",
     "babel-loader": "^8.2.2",
+    "chromatic": "^6.5.3",
     "jest": "^27.5.1",
     "react": ">=17.0.2",
     "react-dom": ">=17.0.2",
     "rimraf": "^3.0.2",
     "serve": "^12.0.1",
-    "storybook-addon-styled-component-theme": "^2.0.0",
+    "themeprovider-storybook": "^1.8.0",
     "ts-jest": "^27.1.3",
     "typescript": ">=4.4.4"
   },