@threekit-tools/treble 0.0.86 → 0.0.88

package/dist/Treble/Treble.d.ts

@@ -1,5 +1,5 @@
 import threekitAPI from '../api';
-import { IThreekitPlayer, IThreekitPrivatePlayer, IConfiguration, ISetConfiguration, IThreekitPrivateConfigurator } from '../types';
+import { IThreekitPlayer, IThreekitPrivatePlayer, IThreekitPrivateConfigurator } from '../types';
 import { IWishlist } from './wishlist';
 import snapshots from './snapshots';
 import { ISaveConfiguration } from '../api/configurations';
@@ -8,7 +8,6 @@ import { ICartItem } from '../http/orders';
 interface ITreble {
     player: IThreekitPlayer;
     orgId: string;
-    initialConfiguration: IConfiguration;
 }
 interface IEmailShareCredentials {
     to: string;
@@ -22,11 +21,10 @@ declare class Treble {
     _api: typeof threekitAPI;
     _player: IThreekitPrivatePlayer;
     wishlist: IWishlist;
-    private _initialConfiguration;
     private _snapshots;
     takeSnapshots: typeof snapshots['takeSnapshots'];
     _debugMode: boolean;
-    constructor({ player, orgId, initialConfiguration }: ITreble);
+    constructor({ player, orgId }: ITreble);
     createOrder: (order?: IOrder) => Promise<import("../http/orders").IOrderResponse>;
     saveConfiguration: (config?: Partial<Omit<ISaveConfiguration, 'configuration'>>) => Promise<{
         resumableUrl: string;
@@ -34,7 +32,6 @@ declare class Treble {
         thumbnail: string;
     }>;
     getNestedConfigurator: (address: string | Array<string>) => undefined | IThreekitPrivateConfigurator;
-    resetConfiguration: (configuration?: ISetConfiguration) => void;
     sendEmail: (credentials: IEmailShareCredentials, templateData: Record<string, any>) => Promise<import("../http/server").IPostEmailResponse>;
 }
 export default Treble;

package/dist/Treble/Treble.js

@@ -48,7 +48,7 @@ var wishlist_1 = __importDefault(require("./wishlist"));
 var snapshots_1 = __importDefault(require("./snapshots"));
 var Treble = (function () {
     function Treble(_a) {
-        var player = _a.player, orgId = _a.orgId, initialConfiguration = _a.initialConfiguration;
+        var player = _a.player, orgId = _a.orgId;
         var _this = this;
         this.createOrder = function (order) { return __awaiter(_this, void 0, void 0, function () {
             var updatedOrder, configuration, response;
@@ -129,11 +129,6 @@ var Treble = (function () {
                 })) === null || _a === void 0 ? void 0 : _a.configurator;
             }, player.getConfigurator());
         };
-        this.resetConfiguration = function (configuration) {
-            var initialConfiguration = JSON.parse(_this._initialConfiguration);
-            var updateConfiguration = Object.assign(initialConfiguration, configuration);
-            window.threekit.configurator.setConfiguration(updateConfiguration);
-        };
         this.sendEmail = function (credentials, templateData) {
             if (!credentials)
                 throw new Error('sendEmail is missing credentials object');
@@ -155,7 +150,6 @@ var Treble = (function () {
         this._snapshots = snapshots_1.default;
         this.takeSnapshots = this._snapshots.takeSnapshots;
         this._player = player.enableApi(types_1.PRIVATE_APIS.PLAYER);
-        this._initialConfiguration = JSON.stringify(initialConfiguration);
         this._debugMode = constants_1.TREBLE_DEBUG;
     }
     return Treble;

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

@@ -4,6 +4,7 @@ interface AccordionItemProps extends React.FC {
     label: string;
     handleSelect: () => void;
     onClick: () => void;
+    children?: React.ReactNode;
 }
 interface AccordionProps<T> {
     children: React.FunctionComponentElement<T> | Array<React.FunctionComponentElement<T>>;

package/dist/components/AttributeValue/index.js

@@ -23,6 +23,8 @@ var AttributeValue = function (props) {
             return null;
         value = (_b = assetAttribute_1.values.find(function (el) { return el.assetId === assetAttribute_1.value.assetId; })) === null || _b === void 0 ? void 0 : _b.name;
     }
+    else if (attributeData.type === types_1.ATTRIBUTE_TYPES.COLOR)
+        value = JSON.stringify(attributeData.value);
     else
         value = attributeData.value;
     if (!attribute)

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

@@ -1,3 +1,6 @@
 import React from 'react';
-export declare const PortalToArOverlay: React.FC;
+interface PortalToAROverlayProps {
+    children?: React.ReactNode;
+}
+export declare const PortalToArOverlay: React.FC<PortalToAROverlayProps>;
 export default PortalToArOverlay;

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

@@ -2,6 +2,7 @@ import React from 'react';
 interface IPortalToElementProps {
     to?: string;
     strict?: boolean;
+    children?: React.ReactNode;
 }
 export declare const PortalToElement: React.FC<IPortalToElementProps>;
 export default PortalToElement;

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

@@ -2,6 +2,7 @@ import React from 'react';
 import { IProducts } from '../../types';
 export interface ProductLayoutProps {
     products: Record<string, IProducts>;
+    children?: React.ReactNode;
 }
 declare const ProductLayout: React.FC<ProductLayoutProps>;
 export default ProductLayout;

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

@@ -2,6 +2,7 @@ import React from 'react';
 interface ITabPaneProps {
     label: string;
     onClick: () => void;
+    children?: React.ReactNode;
 }
 interface ITabs {
     TabPane: React.FC<ITabPaneProps>;

package/dist/components/formComponents.d.ts

@@ -4,7 +4,7 @@ export declare const FORM_COMPONENT_TYPES: {
 };
 export declare const formComponents: {
     [x: string]: {
-        [x: string]: ((props: import("./Cards").ICards) => JSX.Element | null) | ((props: import("./Tiles").ITiles) => JSX.Element | null) | ((props: import("./TextInput").ITextInput) => JSX.Element | null);
+        [x: string]: ((props: import("./Cards").ICards) => JSX.Element | null) | ((props: import("./TextInput").ITextInput) => JSX.Element | null) | ((props: import("./Tiles").ITiles) => JSX.Element | null);
     } | {
         [x: string]: (props: import("./Upload").IUpload) => JSX.Element | null;
     };
@@ -12,7 +12,7 @@ export declare const formComponents: {
         [x: string]: ((props: import("./Cards").ICards) => JSX.Element | null) | ((props: import("./Tiles").ITiles) => JSX.Element | null);
     };
     String: {
-        [x: string]: ((props: import("./Cards").ICards) => JSX.Element | null) | ((props: import("./Tiles").ITiles) => JSX.Element | null) | ((props: import("./TextInput").ITextInput) => JSX.Element | null);
+        [x: string]: ((props: import("./Cards").ICards) => JSX.Element | null) | ((props: import("./TextInput").ITextInput) => JSX.Element | null) | ((props: import("./Tiles").ITiles) => JSX.Element | null);
     };
     upload: {
         [x: string]: (props: import("./Upload").IUpload) => JSX.Element | null;

package/dist/hooks/useConfigurationLoader/index.js

@@ -41,6 +41,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 var api_1 = __importDefault(require("../../api"));
 var attributes_1 = require("../../store/attributes");
+var treble_1 = require("../../store/treble");
 var store_1 = require("../../store");
 var useConfigurationLoader = function () {
     var dispatch = (0, store_1.useThreekitDispatch)();
@@ -56,10 +57,19 @@ var useConfigurationLoader = function () {
                     configuration = _a.sent();
                     if (!configuration)
                         return [2];
+                    if (!(configuration.data.productId === window.threekit.player.assetId)) return [3, 3];
                     return [4, dispatch((0, attributes_1.setConfiguration)(configuration.data.variant))];
                 case 2:
                     _a.sent();
-                    return [2, Promise.resolve()];
+                    return [3, 5];
+                case 3: return [4, dispatch((0, treble_1.reloadPlayer)({
+                        assetId: configuration.data.productId,
+                        configuration: configuration.data.variant,
+                    }))];
+                case 4:
+                    _a.sent();
+                    _a.label = 5;
+                case 5: return [2, Promise.resolve()];
             }
         });
     }); };

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

@@ -14,6 +14,7 @@ interface UseProductCache {
     cache: Array<HydratedCacheProduct>;
     products: Array<ISelectableProduct>;
     onLoadNewProduct: (config?: string | IReloadConfig) => Promise<void>;
+    onResetProduct: () => Promise<void>;
 }
 declare const useProductCache: () => UseProductCache;
 export default useProductCache;

package/dist/hooks/useProductCache/index.js

@@ -1,4 +1,40 @@
 "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 };
+    }
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 var product_1 = require("../../store/product");
 var store_1 = require("../../store");
@@ -9,6 +45,12 @@ var useProductCache = function () {
     var onLoadNewProduct = function (config) {
         return dispatch((0, product_1.loadNewProduct)(config));
     };
+    var onResetProduct = function () { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) {
+        switch (_a.label) {
+            case 0: return [4, dispatch((0, product_1.resetProductConfiguration)())];
+            case 1: return [2, _a.sent()];
+        }
+    }); }); };
     var hydratedCache = cache.map(function (el, i) {
         return Object.assign({}, el, {
             selected: activeProductIdx === i,
@@ -25,6 +67,6 @@ var useProductCache = function () {
             return dispatch((0, product_1.loadProduct)(prod, config));
         },
     }); });
-    return { cache: hydratedCache, products: products, onLoadNewProduct: onLoadNewProduct };
+    return { cache: hydratedCache, products: products, onLoadNewProduct: onLoadNewProduct, onResetProduct: onResetProduct };
 };
 exports.default = useProductCache;

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

@@ -0,0 +1,3 @@
+declare type UseShareHook = undefined | (() => Promise<void>);
+declare const useResetProduct: () => UseShareHook;
+export default useResetProduct;

package/dist/hooks/useResetProduct/index.js

@@ -0,0 +1,55 @@
+"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 };
+    }
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var store_1 = require("../../store");
+var treble_1 = require("../../store/treble");
+var product_1 = require("../../store/product");
+var useResetProduct = function () {
+    var isLoaded = (0, store_1.useThreekitSelector)(treble_1.isThreekitInitialized);
+    var dispatch = (0, store_1.useThreekitDispatch)();
+    if (!isLoaded)
+        return undefined;
+    var handleReset = function () { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) {
+        switch (_a.label) {
+            case 0: return [4, dispatch((0, product_1.resetProductConfiguration)())];
+            case 1: return [2, _a.sent()];
+        }
+    }); }); };
+    return handleReset;
+};
+exports.default = useResetProduct;

package/dist/index.d.ts

@@ -23,6 +23,7 @@ import Cards from './components/Cards';
 import Dropdown from './components/Dropdown';
 import Strips from './components/Strips';
 import Swatch from './components/Swatch';
+import TextInput from './components/TextInput';
 import Tiles from './components/Tiles';
 import TilesGroup from './components/TilesGroup';
 import Upload from './components/Upload';
@@ -95,4 +96,4 @@ import WishlistIcon from './icons/Wishlist';
 import ZoomInIcon from './icons/ZoomIn';
 import ZoomOutIcon from './icons/ZoomOut';
 import SpinnerIcon from './icons/Spinner';
-export { useAttribute, useConfigurator, useConfigurationLoader, useFirstPlayerInteraction, useMetadata, useName, usePlayerLoadingStatus, usePrice, useThreekitInitStatus, useZoom, useSnapshot, useWishlist, useShare, usePlayerPortal, useProductCache, useNestedConfigurator, useLoadingProgress, usePlayer, ThreekitProvider, Player, Button, Cards, Dropdown, Strips, Swatch, Tiles, TilesGroup, Upload, Switch, ProductName, ProductDescription, AttributeTitle, AttributeValue, TotalPrice, Skeleton, message, Modal, Drawer, Accordion, Tabs, PortalToArOverlay, PortalToElement, AwaitThreekitLoad, FlatForm, Zoom, Snapshots, Wishlist, Share, TrebleApp, ProductLayout, PlayerLoadingCircular, PlayerLoadingSpinner, DraggableHint, TurntableAnimation, BreatheAnimation, AddIcon, ArrowLeftIcon, ArrowRightIcon, CameraIcon, CaretDownIcon, CaretUpIcon, CaretLeftIcon, CaretRightIcon, CartIcon, CheckmateIcon, ClipboardIcon, ColorPickerIcon, CopyIcon, DeleteIcon, DoubleCaretLeftIcon, DoubleCaretRightIcon, DownloadIcon, DraggableIcon, DragIcon, EditIcon, HeartIcon, ImageIcon, InfoIcon, MailIcon, MenuIcon, MoreIcon, NewWindowIcon, PauseIcon, PlayIcon, RedoIcon, RemoveIcon, RulerIcon, SearchIcon, SettingsIcon, ShareIcon, SwitchIcon, TagIcon, UndoIcon, WishlistIcon, ZoomInIcon, ZoomOutIcon, SpinnerIcon, };
+export { useAttribute, useConfigurator, useConfigurationLoader, useFirstPlayerInteraction, useMetadata, useName, usePlayerLoadingStatus, usePrice, useThreekitInitStatus, useZoom, useSnapshot, useWishlist, useShare, usePlayerPortal, useProductCache, useNestedConfigurator, useLoadingProgress, usePlayer, ThreekitProvider, Player, Button, Cards, Dropdown, Strips, Swatch, TextInput, Tiles, TilesGroup, Upload, Switch, ProductName, ProductDescription, AttributeTitle, AttributeValue, TotalPrice, Skeleton, message, Modal, Drawer, Accordion, Tabs, PortalToArOverlay, PortalToElement, AwaitThreekitLoad, FlatForm, Zoom, Snapshots, Wishlist, Share, TrebleApp, ProductLayout, PlayerLoadingCircular, PlayerLoadingSpinner, DraggableHint, TurntableAnimation, BreatheAnimation, AddIcon, ArrowLeftIcon, ArrowRightIcon, CameraIcon, CaretDownIcon, CaretUpIcon, CaretLeftIcon, CaretRightIcon, CartIcon, CheckmateIcon, ClipboardIcon, ColorPickerIcon, CopyIcon, DeleteIcon, DoubleCaretLeftIcon, DoubleCaretRightIcon, DownloadIcon, DraggableIcon, DragIcon, EditIcon, HeartIcon, ImageIcon, InfoIcon, MailIcon, MenuIcon, MoreIcon, NewWindowIcon, PauseIcon, PlayIcon, RedoIcon, RemoveIcon, RulerIcon, SearchIcon, SettingsIcon, ShareIcon, SwitchIcon, TagIcon, UndoIcon, WishlistIcon, ZoomInIcon, ZoomOutIcon, SpinnerIcon, };

package/dist/index.js

@@ -3,8 +3,8 @@ 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.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.Skeleton = 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.usePlayer = exports.useLoadingProgress = 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.useFirstPlayerInteraction = exports.useConfigurationLoader = exports.useConfigurator = exports.useAttribute = void 0;
-exports.SpinnerIcon = exports.ZoomOutIcon = exports.ZoomInIcon = exports.WishlistIcon = exports.UndoIcon = exports.TagIcon = exports.SwitchIcon = exports.ShareIcon = exports.SettingsIcon = exports.SearchIcon = exports.RulerIcon = exports.RemoveIcon = exports.RedoIcon = exports.PlayIcon = exports.PauseIcon = exports.NewWindowIcon = exports.MoreIcon = exports.MenuIcon = exports.MailIcon = exports.InfoIcon = exports.ImageIcon = exports.HeartIcon = exports.EditIcon = exports.DragIcon = exports.DraggableIcon = exports.DownloadIcon = exports.DoubleCaretRightIcon = exports.DoubleCaretLeftIcon = exports.DeleteIcon = exports.CopyIcon = exports.ColorPickerIcon = exports.ClipboardIcon = exports.CheckmateIcon = exports.CartIcon = exports.CaretRightIcon = exports.CaretLeftIcon = exports.CaretUpIcon = exports.CaretDownIcon = exports.CameraIcon = exports.ArrowRightIcon = exports.ArrowLeftIcon = exports.AddIcon = exports.BreatheAnimation = exports.TurntableAnimation = exports.DraggableHint = exports.PlayerLoadingSpinner = exports.PlayerLoadingCircular = void 0;
+exports.TrebleApp = 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.Skeleton = exports.TotalPrice = exports.AttributeValue = exports.AttributeTitle = exports.ProductDescription = exports.ProductName = exports.Switch = exports.Upload = exports.TilesGroup = exports.Tiles = exports.TextInput = exports.Swatch = exports.Strips = exports.Dropdown = exports.Cards = exports.Button = exports.Player = exports.ThreekitProvider = exports.usePlayer = exports.useLoadingProgress = 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.useFirstPlayerInteraction = exports.useConfigurationLoader = exports.useConfigurator = exports.useAttribute = void 0;
+exports.SpinnerIcon = exports.ZoomOutIcon = exports.ZoomInIcon = exports.WishlistIcon = exports.UndoIcon = exports.TagIcon = exports.SwitchIcon = exports.ShareIcon = exports.SettingsIcon = exports.SearchIcon = exports.RulerIcon = exports.RemoveIcon = exports.RedoIcon = exports.PlayIcon = exports.PauseIcon = exports.NewWindowIcon = exports.MoreIcon = exports.MenuIcon = exports.MailIcon = exports.InfoIcon = exports.ImageIcon = exports.HeartIcon = exports.EditIcon = exports.DragIcon = exports.DraggableIcon = exports.DownloadIcon = exports.DoubleCaretRightIcon = exports.DoubleCaretLeftIcon = exports.DeleteIcon = exports.CopyIcon = exports.ColorPickerIcon = exports.ClipboardIcon = exports.CheckmateIcon = exports.CartIcon = exports.CaretRightIcon = exports.CaretLeftIcon = exports.CaretUpIcon = exports.CaretDownIcon = exports.CameraIcon = exports.ArrowRightIcon = exports.ArrowLeftIcon = exports.AddIcon = exports.BreatheAnimation = exports.TurntableAnimation = exports.DraggableHint = exports.PlayerLoadingSpinner = exports.PlayerLoadingCircular = exports.ProductLayout = void 0;
 var useAttribute_1 = __importDefault(require("./hooks/useAttribute"));
 exports.useAttribute = useAttribute_1.default;
 var useConfigurator_1 = __importDefault(require("./hooks/useConfigurator"));
@@ -55,6 +55,8 @@ var Strips_1 = __importDefault(require("./components/Strips"));
 exports.Strips = Strips_1.default;
 var Swatch_1 = __importDefault(require("./components/Swatch"));
 exports.Swatch = Swatch_1.default;
+var TextInput_1 = __importDefault(require("./components/TextInput"));
+exports.TextInput = TextInput_1.default;
 var Tiles_1 = __importDefault(require("./components/Tiles"));
 exports.Tiles = Tiles_1.default;
 var TilesGroup_1 = __importDefault(require("./components/TilesGroup"));

package/dist/store/index.d.ts

@@ -7,7 +7,7 @@ declare const store: import("@reduxjs/toolkit").EnhancedStore<{
     translations: import("./translations").TranslationsState;
     wishlist: import("../Treble").WishlistArray;
     price: import("./price").PriceState;
-}, import("redux").AnyAction, import("@reduxjs/toolkit").MiddlewareArray<import("redux").Middleware<{}, any, import("redux").Dispatch<import("redux").AnyAction>> | import("redux-thunk").ThunkMiddleware<{
+}, import("redux").AnyAction, import("@reduxjs/toolkit").MiddlewareArray<import("redux-thunk").ThunkMiddleware<{
     treble: import("./treble").TrebleState;
     product: import("./product").ProductState;
     attributes: import("./attributes").AttributesState;
@@ -36,7 +36,7 @@ export declare const createStore: (reducer?: Record<string, Reducer>) => import(
     translations: import("./translations").TranslationsState;
     wishlist: import("../Treble").WishlistArray;
     price: import("./price").PriceState;
-}, import("redux").AnyAction, import("@reduxjs/toolkit").MiddlewareArray<import("redux").Middleware<{}, any, import("redux").Dispatch<import("redux").AnyAction>> | import("redux-thunk").ThunkMiddleware<{
+}, import("redux").AnyAction, import("@reduxjs/toolkit").MiddlewareArray<import("redux-thunk").ThunkMiddleware<{
     treble: import("./treble").TrebleState;
     product: import("./product").ProductState;
     attributes: import("./attributes").AttributesState;

package/dist/store/index.js

@@ -34,18 +34,22 @@ var store = (0, toolkit_1.configureStore)({
         wishlist: wishlist_1.default,
         price: price_1.default,
     },
-    middleware: constants_1.TREBLE_DEBUG
-        ? function (getDefaultMiddleware) { return getDefaultMiddleware().concat(redux_logger_1.default); }
-        : function (getDefaultMiddleware) { return getDefaultMiddleware(); },
+    middleware: function (getDefaultMiddleware) {
+        return constants_1.TREBLE_DEBUG
+            ? getDefaultMiddleware().concat(redux_logger_1.default)
+            : getDefaultMiddleware();
+    },
 });
 var createStore = function (reducer) {
     if (!reducer)
         return store;
     return (0, toolkit_1.configureStore)({
         reducer: __assign(__assign({}, reducer), { treble: treble_1.default, product: product_1.default, attributes: attributes_1.default, translations: translations_1.default, wishlist: wishlist_1.default, price: price_1.default }),
-        middleware: constants_1.TREBLE_DEBUG
-            ? function (getDefaultMiddleware) { return getDefaultMiddleware().concat(redux_logger_1.default); }
-            : function (getDefaultMiddleware) { return getDefaultMiddleware(); },
+        middleware: function (getDefaultMiddleware) {
+            return constants_1.TREBLE_DEBUG
+                ? getDefaultMiddleware().concat(redux_logger_1.default)
+                : getDefaultMiddleware();
+        },
     });
 };
 exports.createStore = createStore;

package/dist/store/product.d.ts

@@ -16,8 +16,7 @@ export interface LoadProductConfig {
 export interface CachedProductState extends Pick<CachedProduct, 'id' | 'name' | 'label' | 'thumbnail'> {
     data: string;
 }
-interface IEnvConfig extends Record<string, Partial<IProduct>> {
-}
+declare type IEnvConfig = Record<string, Partial<IProduct>>;
 export interface IHydratedProducts extends Record<string, IEnvConfig> {
 }
 export interface ProductState {
@@ -43,7 +42,8 @@ export declare const getName: (state: RootState) => undefined | string;
 export declare const getMetadata: (state: RootState) => undefined | IMetadata;
 export declare const getActiveCacheIdx: (state: RootState) => number;
 export declare const getProductCache: (state: RootState) => Array<Pick<CachedProduct, 'name' | 'label' | 'thumbnail'>>;
-export declare const initProduct: (prods?: IHydratedProducts) => (dispatch: ThreekitDispatch, getState: () => RootState) => void;
+export declare const setProducts: (products: IHydratedProducts) => IHydratedProducts;
+export declare const initProduct: () => (dispatch: ThreekitDispatch, getState: () => RootState) => void;
 export declare const cacheActiveProduct: (config?: Pick<IReloadConfig, 'label' | 'thumbnail'>) => (dispatch: ThreekitDispatch, getState: () => RootState) => {
     payload: CachedProductState;
     type: string;
@@ -52,4 +52,5 @@ export declare const loadProduct: (id: string, config?: LoadProductConfig) => (d
 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) => (dispatch: ThreekitDispatch, getState: () => RootState) => Promise<void>;
+export declare const resetProductConfiguration: () => (dispatch: ThreekitDispatch, getState: () => RootState) => Promise<void>;
 export default reducer;

package/dist/store/product.js

@@ -50,11 +50,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.removeProductIdx = exports.changeActiveCacheIdx = exports.loadNewProduct = exports.loadProduct = exports.cacheActiveProduct = exports.initProduct = exports.getProductCache = exports.getActiveCacheIdx = exports.getMetadata = exports.getName = exports.getProductId = exports.decrementActiveCacheIdx = exports.incrementActiveCacheIdx = exports.setActiveCacheIdx = exports.removeFromCache = exports.updateActiveProductCache = exports.appendToCache = exports.setMetadata = exports.setName = exports.setProductId = exports.PRODUCTS = void 0;
+exports.resetProductConfiguration = exports.removeProductIdx = exports.changeActiveCacheIdx = exports.loadNewProduct = exports.loadProduct = exports.cacheActiveProduct = exports.initProduct = exports.setProducts = exports.getProductCache = exports.getActiveCacheIdx = exports.getMetadata = exports.getName = exports.getProductId = exports.decrementActiveCacheIdx = exports.incrementActiveCacheIdx = exports.setActiveCacheIdx = exports.removeFromCache = exports.updateActiveProductCache = exports.appendToCache = exports.setMetadata = exports.setName = exports.setProductId = exports.PRODUCTS = void 0;
 var toolkit_1 = require("@reduxjs/toolkit");
 var types_1 = require("../types");
 var connection_1 = __importDefault(require("../connection"));
 var treble_1 = require("./treble");
+var attributes_1 = require("./attributes");
+var INITIAL_CONFIGURATIONS = {};
 exports.setProductId = (0, toolkit_1.createAction)('treble/set-product-id');
 exports.setName = (0, toolkit_1.createAction)('treble/set-product-name');
 exports.setMetadata = (0, toolkit_1.createAction)('treble/set-metadata');
@@ -142,25 +144,29 @@ var getProductCache = function (state) {
     });
 };
 exports.getProductCache = getProductCache;
-var initProduct = function (prods) {
-    return function (dispatch, getState) {
-        if (prods)
-            exports.PRODUCTS = prods;
-        if (!window.threekit)
-            return;
-        var state = getState();
-        var name = window.threekit.player.scene.get({
-            id: window.threekit.player.assetId,
-        }).name;
-        var metadata = window.threekit.configurator.getMetadata();
-        dispatch((0, exports.setName)(name));
-        dispatch((0, exports.setMetadata)(metadata));
-        if (!state.product.cache.length) {
-            dispatch((0, exports.setActiveCacheIdx)(0));
-            dispatch((0, exports.cacheActiveProduct)());
-        }
-    };
+var setProducts = function (products) {
+    return (exports.PRODUCTS = products);
 };
+exports.setProducts = setProducts;
+var initProduct = function () { return function (dispatch, getState) {
+    var state = getState();
+    var name = window.threekit.player.scene.get({
+        id: window.threekit.player.assetId,
+    }).name;
+    var metadata = window.threekit.configurator.getMetadata();
+    var productId = state.product.id;
+    if (productId && !INITIAL_CONFIGURATIONS[productId]) {
+        var player = window.threekit.player.enableApi(types_1.PRIVATE_APIS.PLAYER);
+        var configuration = player.configurator.getFullConfiguration();
+        INITIAL_CONFIGURATIONS[productId] = JSON.stringify(configuration);
+    }
+    dispatch((0, exports.setName)(name));
+    dispatch((0, exports.setMetadata)(metadata));
+    if (!state.product.cache.length) {
+        dispatch((0, exports.setActiveCacheIdx)(0));
+        dispatch((0, exports.cacheActiveProduct)());
+    }
+}; };
 exports.initProduct = initProduct;
 var cacheActiveProduct = function (config) {
     return function (dispatch, getState) {
@@ -306,4 +312,16 @@ var removeProductIdx = function (idx) {
     }); };
 };
 exports.removeProductIdx = removeProductIdx;
+var resetProductConfiguration = function () { return function (dispatch, getState) { return __awaiter(void 0, void 0, void 0, function () {
+    var state, initialConfiguration;
+    return __generator(this, function (_a) {
+        state = getState();
+        if (!state.product.id)
+            return [2];
+        initialConfiguration = INITIAL_CONFIGURATIONS[state.product.id];
+        dispatch((0, attributes_1.setConfiguration)(JSON.parse(initialConfiguration)));
+        return [2];
+    });
+}); }; };
+exports.resetProductConfiguration = resetProductConfiguration;
 exports.default = reducer;

package/dist/store/treble.d.ts

@@ -5,7 +5,6 @@ export interface IPlayerInit {
     authToken: string;
     assetId: string;
     stageId?: string;
-    orgId: string;
     playerConfig: IPlayerConfig;
     initialConfiguration?: IConfiguration;
 }

package/dist/store/treble.js

@@ -167,11 +167,11 @@ var getPlayerInteraction = function (state) {
 exports.getPlayerInteraction = getPlayerInteraction;
 var initPlayer = function (config) {
     return function (dispatch, getState) { return __awaiter(void 0, void 0, void 0, function () {
-        var el, authToken, assetId, stageId, orgId, playerConfig, initialConfiguration, player, configurator, ruleName;
+        var el, authToken, assetId, stageId, playerConfig, initialConfiguration, player, configurator, orgId, ruleName;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
-                    el = config.el, authToken = config.authToken, assetId = config.assetId, stageId = config.stageId, orgId = config.orgId, playerConfig = config.playerConfig, initialConfiguration = config.initialConfiguration;
+                    el = config.el, authToken = config.authToken, assetId = config.assetId, stageId = config.stageId, playerConfig = config.playerConfig, initialConfiguration = config.initialConfiguration;
                     dispatch((0, exports.updateLoadingProgress)(0));
                     return [4, window.threekitPlayer(__assign(__assign({ el: el, authToken: authToken, stageId: stageId, assetId: assetId }, playerConfig), { initialConfiguration: initialConfiguration, onLoadingProgress: function (progress) {
                                 var _a;
@@ -183,6 +183,8 @@ var initPlayer = function (config) {
                     return [4, player.getConfigurator()];
                 case 2:
                     configurator = _a.sent();
+                    orgId = player.enableApi(types_1.PRIVATE_APIS.PLAYER).orgId;
+                    connection_1.default.connect({ orgId: orgId });
                     if (window.threekit) {
                         window.threekit = Object.assign(window.threekit, {
                             player: player,
@@ -197,7 +199,6 @@ var initPlayer = function (config) {
                             treble: new Treble_1.default({
                                 player: player,
                                 orgId: orgId,
-                                initialConfiguration: configurator.getConfiguration(),
                             }),
                         };
                     dispatch((0, exports.setThreekitInitialized)(true));
@@ -250,7 +251,7 @@ var initPlayer = function (config) {
 exports.initPlayer = initPlayer;
 var launch = function (launchConfig) {
     return function (dispatch) { return __awaiter(void 0, void 0, void 0, function () {
-        var config, productId, credentials, productsRaw, products, threekitEnv, serverUrl, playerConfig, envCredentials, _a, assetIdRaw, stageId, configurationId, initialConfigurationRaw, assetId, threekitDomainRaw, orgId, authToken, el, threekitDomain, initialConfiguration, updatedAssetId, params, configId, configuration;
+        var config, productId, credentials, productsRaw, products, threekitEnv, serverUrl, playerConfig, envCredentials, _a, assetIdRaw, stageId, configurationId, initialConfigurationRaw, assetId, threekitDomainRaw, authToken, el, threekitDomain, initialConfiguration, updatedAssetId, params, configId, configuration;
         var _b, _c, _d, _e, _f, _g, _h;
         return __generator(this, function (_j) {
             switch (_j.label) {
@@ -304,7 +305,7 @@ var launch = function (launchConfig) {
                     }, {});
                     if (!Object.keys(credentials).length || !Object.keys(products).length)
                         return [2, console.error('Missing credentials')];
-                    dispatch((0, product_1.initProduct)(products));
+                    (0, product_1.setProducts)(products);
                     dispatch((0, product_1.setProductId)(productId));
                     threekitEnv = (launchConfig === null || launchConfig === void 0 ? void 0 : launchConfig.threekitEnv) || process.env.THREEKIT_ENV || 'preview';
                     serverUrl = (launchConfig === null || launchConfig === void 0 ? void 0 : launchConfig.serverUrl) || ((_g = config === null || config === void 0 ? void 0 : config.project) === null || _g === void 0 ? void 0 : _g.serverUrl);
@@ -313,7 +314,7 @@ var launch = function (launchConfig) {
                     _a = products[productId][threekitEnv] || {}, assetIdRaw = _a.assetId, stageId = _a.stageId, configurationId = _a.configurationId, initialConfigurationRaw = _a.initialConfiguration;
                     assetId = (launchConfig === null || launchConfig === void 0 ? void 0 : launchConfig.assetId) || assetIdRaw;
                     threekitDomainRaw = envCredentials.threekitDomain || "".concat(threekitEnv, ".threekit.com");
-                    orgId = envCredentials.orgId, authToken = envCredentials.publicToken;
+                    authToken = envCredentials.publicToken;
                     if (playerConfig.elementId) {
                         el = document.getElementById(playerConfig.elementId);
                         if (el)
@@ -325,7 +326,6 @@ var launch = function (launchConfig) {
                     }
                     connection_1.default.connect({
                         authToken: authToken,
-                        orgId: orgId,
                         assetId: assetId,
                         threekitDomain: threekitDomainRaw,
                         serverUrl: serverUrl,
@@ -361,7 +361,6 @@ var launch = function (launchConfig) {
                     _j.sent();
                     return [4, dispatch((0, exports.initPlayer)({
                             el: el,
-                            orgId: orgId,
                             authToken: authToken,
                             stageId: stageId,
                             assetId: updatedAssetId,
@@ -446,7 +445,6 @@ var reloadPlayer = function (config) {
                     _a.label = 6;
                 case 6: return [4, dispatch((0, exports.initPlayer)({
                         el: el,
-                        orgId: connectionObj.orgId,
                         authToken: connectionObj.authToken,
                         stageId: stageId,
                         assetId: assetId,

package/dist/types.d.ts

@@ -86,7 +86,7 @@ export interface ISceneResult {
 }
 export interface IConfigurationAsset {
     assetId: string;
-    configuration?: string;
+    configuration?: IConfiguration | string;
     type?: string;
 }
 export interface IConfigurationColor {
@@ -281,14 +281,24 @@ export interface IThreekitPlayer {
     unload: () => Promise<string>;
 }
 export interface IThreekitPrivateConfigurator extends IThreekitConfigurator {
+    name: string;
+    metadata: IMetadata;
     getAppliedConfiguration: (attributeName: string) => string;
     getFullConfiguration: () => IConfiguration;
 }
 export interface IThreekitPrivatePlayer {
+    v: string;
+    id: string;
+    assetId: string;
+    stageId: undefined | string;
+    instanceId: string;
+    assetType: string;
+    orgId: string;
+    rect: DOMRect;
+    isFullscreen: boolean;
+    zoomDisabled: boolean;
     getConfigurator: () => IThreekitPrivateConfigurator;
-    configurator: {
-        getFullConfiguration: () => IConfiguration;
-    };
+    configurator: IThreekitPrivateConfigurator;
     calculateLogs: () => Promise<Record<string, any>>;
     getAssetInstance: (query: ISceneQueryNode | string) => Promise<string>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@threekit-tools/treble",
-  "version": "0.0.86",
+  "version": "0.0.88",
   "author": "Amaan Saeed",
   "license": "MIT",
   "files": [
@@ -32,7 +32,8 @@
     "lint-staged": "lint-staged",
     "check-format": "prettier -c ./src",
     "format": "prettier --write ./src",
-    "test": "jest"
+    "test": "jest",
+    "deploy": "npm run build && npm publish"
   },
   "lint-staged": {
     "./src/**/*.{css,less,scss,html,json,jsx,js,tsx,ts}": [