@threekit-tools/treble 0.0.20 → 0.0.21

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

@@ -0,0 +1,6 @@
+import React from 'react';
+interface ProductLayoutProps {
+    products: string | Array<string> | Record<string, string>;
+}
+declare const ProductLayout: React.FC<ProductLayoutProps>;
+export default ProductLayout;

package/dist/components/ProductLayout/index.js

@@ -0,0 +1,10 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var ProductLayout = function (props) {
+    return react_1.default.createElement(react_1.default.Fragment, null, props.children);
+};
+exports.default = ProductLayout;

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

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+/// <reference types="webpack-env" />
+import { ThreekitProviderProps } from '../ThreekitProvider';
+interface IProducts {
+    ctx: __WebpackModuleApi.RequireContext;
+}
+interface ProductLoaderProps extends Omit<ThreekitProviderProps, 'children'> {
+    productId: string;
+    products: IProducts;
+}
+export default function ProductLoader(props: ProductLoaderProps): JSX.Element | null;
+export {};

package/dist/components/ProductLoader/index.js

@@ -0,0 +1,82 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var ThreekitProvider_1 = __importDefault(require("../ThreekitProvider"));
+var productAssetId = {};
+var productComponents = [];
+var productToComponentMap = {};
+function ProductLoader(props) {
+    var productId = props.productId, products = props.products, credentials = props.credentials, playerConfig = props.playerConfig, theme = props.theme, threekitEnv = props.threekitEnv;
+    if (!productId || !products)
+        return null;
+    if (!productComponents.length) {
+        products.ctx.keys().forEach(function (fileName) {
+            if (!fileName.includes('product.js'))
+                return;
+            if (fileName.includes('].product.js'))
+                return;
+            productComponents.push(products.ctx(fileName).default);
+        });
+        react_1.Children.forEach(Object.values(productComponents).map(function (el) { return el({}); }), function (jsx, i) {
+            var _a;
+            if (!jsx)
+                return;
+            if (jsx.type.name !== 'ProductLayout')
+                return;
+            if (!jsx.props.products)
+                return;
+            var products;
+            if (Array.isArray(jsx.props.products))
+                products = jsx.props.products.reduce(function (output, id) {
+                    var _a;
+                    return Object.assign(output, (_a = {}, _a[id] = id, _a));
+                }, {});
+            else if (typeof jsx.props.products === 'string') {
+                var prdStr = jsx.props.products;
+                products = (_a = {}, _a[prdStr] = prdStr, _a);
+            }
+            else {
+                products = jsx.props.products;
+            }
+            Object.entries(products).forEach(function (_a) {
+                var key = _a[0], assetId = _a[1];
+                productAssetId[key] = assetId;
+                productToComponentMap[key] = i;
+            });
+        });
+    }
+    var Product = productComponents[productToComponentMap[props.productId]];
+    if (!Product)
+        return null;
+    var assetId = productAssetId[props.productId];
+    var env = threekitEnv || 'preview';
+    var preppedCredentials = Object.assign({}, credentials);
+    preppedCredentials[env] = Object.assign(preppedCredentials[env], {
+        assetId: assetId,
+    });
+    return (react_1.default.createElement(ThreekitProvider_1.default, { credentials: preppedCredentials, playerConfig: Object.assign({}, playerConfig), theme: theme },
+        react_1.default.createElement(Product, null)));
+}
+exports.default = ProductLoader;

package/dist/index.d.ts

@@ -37,4 +37,6 @@ import Wishlist from './components/Wishlist';
 import Share from './components/Share';
 import icons from './icons';
 export * from './icons';
-export { useAttribute, useConfigurator, useMetadata, useName, usePlayerLoadingStatus, usePrice, useThreekitInitStatus, useZoom, useSnapshot, useWishlist, useShare, ThreekitProvider, Player, Button, Cards, Dropdown, Strips, Swatch, Tiles, TilesGroup, ProductName, ProductDescription, AttributeTitle, AttributeValue, TotalPrice, message, Modal, Drawer, Accordion, Tabs, PortalToElement, AwaitThreekitLoad, FlatForm, Zoom, Snapshots, Wishlist, Share, icons, };
+import ProductLoader from './components/ProductLoader';
+import ProductLayout from './components/ProductLayout';
+export { useAttribute, useConfigurator, useMetadata, useName, usePlayerLoadingStatus, usePrice, useThreekitInitStatus, useZoom, useSnapshot, useWishlist, useShare, ThreekitProvider, Player, Button, Cards, Dropdown, Strips, Swatch, Tiles, TilesGroup, ProductName, ProductDescription, AttributeTitle, AttributeValue, TotalPrice, message, Modal, Drawer, Accordion, Tabs, PortalToElement, AwaitThreekitLoad, FlatForm, Zoom, Snapshots, Wishlist, Share, icons, ProductLoader, ProductLayout, };

package/dist/index.js

@@ -13,7 +13,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.icons = exports.Share = exports.Wishlist = exports.Snapshots = exports.Zoom = exports.FlatForm = exports.AwaitThreekitLoad = exports.PortalToElement = exports.Tabs = exports.Accordion = exports.Drawer = exports.Modal = exports.message = exports.TotalPrice = exports.AttributeValue = exports.AttributeTitle = exports.ProductDescription = exports.ProductName = exports.TilesGroup = exports.Tiles = exports.Swatch = exports.Strips = exports.Dropdown = exports.Cards = exports.Button = exports.Player = exports.ThreekitProvider = 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.ProductLoader = exports.icons = exports.Share = exports.Wishlist = exports.Snapshots = exports.Zoom = exports.FlatForm = exports.AwaitThreekitLoad = exports.PortalToElement = exports.Tabs = exports.Accordion = exports.Drawer = exports.Modal = exports.message = exports.TotalPrice = exports.AttributeValue = exports.AttributeTitle = exports.ProductDescription = exports.ProductName = exports.TilesGroup = exports.Tiles = exports.Swatch = exports.Strips = exports.Dropdown = exports.Cards = exports.Button = exports.Player = exports.ThreekitProvider = exports.useShare = exports.useWishlist = exports.useSnapshot = exports.useZoom = exports.useThreekitInitStatus = exports.usePrice = exports.usePlayerLoadingStatus = exports.useName = exports.useMetadata = exports.useConfigurator = exports.useAttribute = void 0;
 //  Hooks
 var useAttribute_1 = __importDefault(require("./hooks/useAttribute"));
 exports.useAttribute = useAttribute_1.default;
@@ -101,3 +101,8 @@ exports.Share = Share_1.default;
 var icons_1 = __importDefault(require("./icons"));
 exports.icons = icons_1.default;
 __exportStar(require("./icons"), exports);
+//  Products - Multi-configurtors
+var ProductLoader_1 = __importDefault(require("./components/ProductLoader"));
+exports.ProductLoader = ProductLoader_1.default;
+var ProductLayout_1 = __importDefault(require("./components/ProductLayout"));
+exports.ProductLayout = ProductLayout_1.default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@threekit-tools/treble",
-  "version": "0.0.20",
+  "version": "0.0.21",
   "author": "Amaan Saeed",
   "license": "MIT",
   "files": [
@@ -44,6 +44,7 @@
     "@types/react-dom": ">=17.0.9",
     "@types/redux-logger": "^3.0.9",
     "@types/styled-components": "^5.1.15",
+    "@types/webpack-env": "^1.16.3",
     "babel-loader": "^8.2.2",
     "react": ">=17.0.2",
     "react-dom": ">=17.0.2",

package/tailwind-presets.js

@@ -1,3 +1,4 @@
+// eslint-disable-next-line
 module.exports = {
   purge: ['./public/index.html', './src/**/*.{js,jsx,ts,tsx}'],
   mode: 'jit',