@threekit-tools/treble 0.0.80 → 0.0.83

package/dist/components/Modal/index.js

@@ -20,14 +20,14 @@ var prop_types_1 = __importDefault(require("prop-types"));
 var react_dom_1 = __importDefault(require("react-dom"));
 var modal_styles_1 = require("./modal.styles");
 var utils_1 = require("../../utils");
-var icons_1 = require("../../icons");
+var Remove_1 = __importDefault(require("../../icons/Remove"));
 var ModalComponent = function (props) {
     var title = props.title, children = props.children, handleClose = props.handleClose, showHeader = props.showHeader, className = props.className;
     return (react_1.default.createElement(modal_styles_1.Wrapper, { onClick: function (e) { return e.stopPropagation(); }, className: "".concat(className, " modal-main") },
         showHeader ? (react_1.default.createElement(modal_styles_1.Header, { className: "".concat(className, " modal-header") },
             react_1.default.createElement("div", { className: "".concat(className, " modal-title") }, title),
             react_1.default.createElement("div", { onClick: handleClose },
-                react_1.default.createElement(icons_1.RemoveIcon, null)))) : null,
+                react_1.default.createElement(Remove_1.default, null)))) : null,
         react_1.default.createElement(modal_styles_1.Content, { className: "".concat(className, " modal-content") }, children)));
 };
 exports.ModalComponent = ModalComponent;
@@ -39,22 +39,9 @@ var Modal = function (props) {
 };
 exports.Modal = Modal;
 exports.ModalComponent.propTypes = {
-    /**
-     * The title to be shown in the Modal header
-     */
     title: prop_types_1.default.string,
-    /**
-     * Callback function to close the modal. Can be used with custom UI
-     * components in the Modal
-     */
     handleClose: prop_types_1.default.func,
-    /**
-     * Whether or not to render the default Modal header
-     */
     showHeader: prop_types_1.default.bool,
-    /**
-     * Used to add a custom class name to each of the components html elements
-     */
     className: prop_types_1.default.string,
 };
 exports.ModalComponent.defaultProps = {

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

@@ -7,7 +7,6 @@ export interface PlayerProps extends IProps {
     width?: string;
     minHeight?: string;
 }
-export declare const PLAYER_DIV_ID = "tk-player-component";
 declare const Player: {
     (props: PlayerProps): JSX.Element;
     TopLeftWidgets(props: IProps): JSX.Element;

package/dist/components/Player/index.js

@@ -1,33 +1,12 @@
 "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 });
-exports.PLAYER_DIV_ID = void 0;
-var react_1 = __importStar(require("react"));
+var react_1 = __importDefault(require("react"));
 var player_styles_1 = require("./player.styles");
 var constants_1 = require("../../constants");
-var usePlayerPortal_1 = __importDefault(require("../../hooks/usePlayerPortal"));
-exports.PLAYER_DIV_ID = 'tk-player-component';
+var usePlayer_1 = __importDefault(require("../../hooks/usePlayer"));
 var className = "".concat(constants_1.DEFAULT_CLASS_NAME, " ").concat(constants_1.CLASS_NAME_PREFIX, "-player");
 var Player = function (props) {
     var _a = Object.assign({
@@ -35,22 +14,9 @@ var Player = function (props) {
         minHeight: '600px',
         width: '100%',
     }, props), height = _a.height, width = _a.width, minHeight = _a.minHeight, children = _a.children;
-    var _b = (0, usePlayerPortal_1.default)(), portalPlayerTo = _b[0], portalBack = _b[1];
-    var hasMoved = (0, react_1.useRef)(false);
-    (0, react_1.useEffect)(function () {
-        if (portalPlayerTo && !hasMoved.current) {
-            portalPlayerTo(exports.PLAYER_DIV_ID);
-            hasMoved.current = true;
-        }
-        return function () {
-            if (portalBack) {
-                portalBack();
-                hasMoved.current = false;
-            }
-        };
-    }, [portalPlayerTo]);
+    var playerRef = (0, usePlayer_1.default)()[0];
     return (react_1.default.createElement(player_styles_1.Wrapper, { height: height, width: width, minHeight: minHeight, className: className },
-        react_1.default.createElement("div", { id: exports.PLAYER_DIV_ID }),
+        react_1.default.createElement("div", { ref: playerRef }),
         children));
 };
 Player.TopLeftWidgets = function (props) {

package/dist/components/PortalToArOverlay/index.js

@@ -1,7 +1,11 @@
 "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]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];

package/dist/components/PortalToElement/index.js

@@ -24,15 +24,7 @@ var PortalToElement = function (props) {
 };
 exports.PortalToElement = PortalToElement;
 exports.PortalToElement.propTypes = {
-    /**
-     * The id of the HTML element you want the content to be rendered in
-     */
     to: prop_types_1.default.string,
-    /**
-     * Defines the behaviour if the HTML element is not found. If strict is
-     * set to `true` the content will not render, if set to `false` the
-     * content will render out in its defualt flow.
-     */
     strict: prop_types_1.default.bool,
 };
 exports.PortalToElement.defaultProps = {};

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

@@ -7,13 +7,7 @@ interface IProductDescription {
 export declare const ProductDescriptionComponent: {
     (props: IProductDescription): JSX.Element;
     propTypes: {
-        /**
-         * The description displayed to the user
-         */
         description: PropTypes.Requireable<string>;
-        /**
-         * Custom classNames applied to the HTML Element to apply custom CSS styling.
-         */
         className: PropTypes.Requireable<string>;
     };
     defaultProps: {

package/dist/components/ProductDescription/index.js

@@ -28,13 +28,7 @@ var ProductDescription = function (props) {
     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.ProductDescriptionComponent.propTypes = {
-    /**
-     * The description displayed to the user
-     */
     description: prop_types_1.default.string,
-    /**
-     * Custom classNames applied to the HTML Element to apply custom CSS styling.
-     */
     className: prop_types_1.default.string,
 };
 exports.ProductDescriptionComponent.defaultProps = {

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

@@ -8,17 +8,8 @@ interface ITitle {
 export declare const ProductNameComponent: {
     (props: ITitle): JSX.Element;
     propTypes: {
-        /**
-         * The title displayed to the user
-         */
         title: PropTypes.Requireable<string>;
-        /**
-         * Custom classNames applied to the HTML Element to apply custom CSS styling.
-         */
         className: PropTypes.Requireable<string>;
-        /**
-         * The CSS Text alignment property. Options: 'left' | 'center' | 'right'
-         */
         align: PropTypes.Requireable<string>;
     };
     defaultProps: {

package/dist/components/ProductName/index.js

@@ -24,17 +24,8 @@ var ProductName = function (props) {
 };
 exports.ProductName = ProductName;
 exports.ProductNameComponent.propTypes = {
-    /**
-     * The title displayed to the user
-     */
     title: prop_types_1.default.string,
-    /**
-     * Custom classNames applied to the HTML Element to apply custom CSS styling.
-     */
     className: prop_types_1.default.string,
-    /**
-     * The CSS Text alignment property. Options: 'left' | 'center' | 'right'
-     */
     align: prop_types_1.default.string,
 };
 exports.ProductNameComponent.defaultProps = {

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

@@ -11,20 +11,8 @@ export declare const Share: {
     (props: ShareProps): JSX.Element | null;
     propTypes: {
         className: PropTypes.Requireable<string>;
-        /**
-         * The presentational type of the input component. Options
-         * include: `hollow`, `standard`, `accent`, `primary`
-         */
         type: PropTypes.Requireable<string>;
-        /**
-         * Used to set the shape of the Widget button. Options
-         * include: `square`, `round`
-         */
         shape: PropTypes.Requireable<string>;
-        /**
-         * Used to set an overwrite of the message presented to the user
-         * when the share URL has been successfully copied.
-         */
         message: PropTypes.Requireable<string>;
     };
     defaultProps: {

package/dist/components/Share/index.js

@@ -7,7 +7,7 @@ exports.Share = void 0;
 var react_1 = __importDefault(require("react"));
 var prop_types_1 = __importDefault(require("prop-types"));
 var Button_1 = __importDefault(require("../Button"));
-var icons_1 = require("../../icons");
+var Share_1 = __importDefault(require("../../icons/Share"));
 var useThreekitInitStatus_1 = __importDefault(require("../../hooks/useThreekitInitStatus"));
 var useShare_1 = __importDefault(require("../../hooks/useShare"));
 var utils_1 = require("../../utils");
@@ -21,25 +21,13 @@ var Share = function (props) {
     var handleClick = function () {
         handleShare(message);
     };
-    return (react_1.default.createElement(Button_1.default, { className: cls, shape: shape, type: type, icon: icons_1.ShareIcon.iconName, onClick: handleClick }));
+    return (react_1.default.createElement(Button_1.default, { className: cls, shape: shape, type: type, icon: Share_1.default.iconName, onClick: handleClick }));
 };
 exports.Share = Share;
 exports.Share.propTypes = {
     className: prop_types_1.default.string,
-    /**
-     * The presentational type of the input component. Options
-     * include: `hollow`, `standard`, `accent`, `primary`
-     */
     type: prop_types_1.default.string,
-    /**
-     * Used to set the shape of the Widget button. Options
-     * include: `square`, `round`
-     */
     shape: prop_types_1.default.string,
-    /**
-     * Used to set an overwrite of the message presented to the user
-     * when the share URL has been successfully copied.
-     */
     message: prop_types_1.default.string,
 };
 exports.Share.defaultProps = {

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

@@ -13,15 +13,7 @@ export declare const Snapshots: {
     (props: SnapshotProps): JSX.Element | null;
     propTypes: {
         className: PropTypes.Requireable<string>;
-        /**
-         * The presentational type of the input component. Options
-         * include: `hollow`, `standard`, `accent`, `primary`
-         */
         type: PropTypes.Requireable<string>;
-        /**
-         * Used to set the shape of the Widget button. Options
-         * include: `square`, `round`
-         */
         shape: PropTypes.Requireable<string>;
     };
     defaultProps: {

package/dist/components/Snapshots/index.js

@@ -7,7 +7,7 @@ exports.Snapshots = void 0;
 var react_1 = __importDefault(require("react"));
 var prop_types_1 = __importDefault(require("prop-types"));
 var Button_1 = __importDefault(require("../Button"));
-var icons_1 = require("../../icons");
+var Download_1 = __importDefault(require("../../icons/Download"));
 var useThreekitInitStatus_1 = __importDefault(require("../../hooks/useThreekitInitStatus"));
 var useSnapshot_1 = __importDefault(require("../../hooks/useSnapshot"));
 var utils_1 = require("../../utils");
@@ -19,20 +19,12 @@ var Snapshots = function (props) {
     if (!hasLoaded)
         return null;
     var cls = (0, utils_1.generateWidgetClassName)('snapshots', className);
-    return (react_1.default.createElement(Button_1.default, { className: cls, shape: shape, type: type, icon: icons_1.DownloadIcon.iconName, onClick: takeSnapshot }));
+    return (react_1.default.createElement(Button_1.default, { className: cls, shape: shape, type: type, icon: Download_1.default.iconName, onClick: takeSnapshot }));
 };
 exports.Snapshots = Snapshots;
 exports.Snapshots.propTypes = {
     className: prop_types_1.default.string,
-    /**
-     * The presentational type of the input component. Options
-     * include: `hollow`, `standard`, `accent`, `primary`
-     */
     type: prop_types_1.default.string,
-    /**
-     * Used to set the shape of the Widget button. Options
-     * include: `square`, `round`
-     */
     shape: prop_types_1.default.string,
 };
 exports.Snapshots.defaultProps = {

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

@@ -9,33 +9,11 @@ export interface IStrips extends IFormComponentProps<IOption> {
 export declare const Strips: {
     (props: IStrips): JSX.Element;
     propTypes: {
-        /**
-         * Is the attribute name on the initialized asset that we are
-         * using this component for. If the attribute prop is used,
-         * the component will ignore the props for: `value`, `options`, `onClick`.
-         */
         attribute: PropTypes.Requireable<string>;
-        /**
-         * Used to add a title to the input
-         */
         title: PropTypes.Requireable<string>;
-        /**
-         * Used to provide a custom description for the input component
-         */
         description: PropTypes.Requireable<string>;
-        /**
-         * Selected value from the option set. Should match the 'value' property
-         * of one of the items in the options array.
-         */
         value: PropTypes.Requireable<string>;
-        /**
-         * Handles the user seletion by passing the value of the selected
-         * option as the argument into the onClick callback.
-         */
         onClick: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * The options set to be displayed for the user
-         */
         options: PropTypes.Requireable<(PropTypes.InferProps<{
             name: PropTypes.Requireable<string>;
             description: PropTypes.Requireable<string>;
@@ -44,44 +22,12 @@ export declare const Strips: {
             color: PropTypes.Requireable<string>;
             disabled: PropTypes.Requireable<boolean>;
         }> | null | undefined)[]>;
-        /**
-         * Used to add a custom class name to each of the components html elements
-         */
         className: PropTypes.Requireable<string>;
-        /**
-         * By default the thumbnail (image/color value) is soruced from the `_thumbnail`
-         * metadata key in the option's Catalog Item. This metadata key can be overwritten
-         * by passing in the prefered key value to the **thumbnailFromMetadata** prop.
-         */
         metadataKeyThumbnail: PropTypes.Requireable<string>;
-        /**
-         * By default the description is soruced from the `_description` metadata
-         * key in the option's Catalog Item. This metadata key can be overwritten
-         * by passing in the prefered key value to the **metadataKeyDescription**
-         * prop.
-         */
         metadataKeyDescription: PropTypes.Requireable<string>;
-        /**
-         * By default the price of an item is soruced from the pricebook entry for
-         * the option's Catalog Item. The price can alternatively be soruced from
-         * the option's Catalog Item metadata, by specifying the key under which the
-         * price can be found as the **metadataKeyPrice** prop.
-         */
         metadataKeyPrice: PropTypes.Requireable<string>;
-        /**
-         * A boolean to set whether or all the Cards should display thumbnails
-         * for the options.
-         */
         showThumbnail: PropTypes.Requireable<boolean>;
-        /**
-         * A boolean to set whether or all the Cards should display the description
-         * for the options.
-         */
         showDescription: PropTypes.Requireable<boolean>;
-        /**
-         * A boolean to set whether or all the Cards should display the price
-         * for the options/
-         */
         showPrice: PropTypes.Requireable<boolean>;
     };
     defaultProps: {

package/dist/components/Strips/index.js

@@ -62,33 +62,11 @@ var Strips = function (props) {
 };
 exports.Strips = Strips;
 exports.Strips.propTypes = {
-    /**
-     * Is the attribute name on the initialized asset that we are
-     * using this component for. If the attribute prop is used,
-     * the component will ignore the props for: `value`, `options`, `onClick`.
-     */
     attribute: prop_types_1.default.string,
-    /**
-     * Used to add a title to the input
-     */
     title: prop_types_1.default.string,
-    /**
-     * Used to provide a custom description for the input component
-     */
     description: prop_types_1.default.string,
-    /**
-     * Selected value from the option set. Should match the 'value' property
-     * of one of the items in the options array.
-     */
     value: prop_types_1.default.string,
-    /**
-     * Handles the user seletion by passing the value of the selected
-     * option as the argument into the onClick callback.
-     */
     onClick: prop_types_1.default.func,
-    /**
-     * The options set to be displayed for the user
-     */
     options: prop_types_1.default.arrayOf(prop_types_1.default.shape({
         name: prop_types_1.default.string,
         description: prop_types_1.default.string,
@@ -97,59 +75,24 @@ exports.Strips.propTypes = {
         color: prop_types_1.default.string,
         disabled: prop_types_1.default.bool,
     })),
-    /**
-     * Used to add a custom class name to each of the components html elements
-     */
     className: prop_types_1.default.string,
-    /**
-     * By default the thumbnail (image/color value) is soruced from the `_thumbnail`
-     * metadata key in the option's Catalog Item. This metadata key can be overwritten
-     * by passing in the prefered key value to the **thumbnailFromMetadata** prop.
-     */
     metadataKeyThumbnail: prop_types_1.default.string,
-    /**
-     * By default the description is soruced from the `_description` metadata
-     * key in the option's Catalog Item. This metadata key can be overwritten
-     * by passing in the prefered key value to the **metadataKeyDescription**
-     * prop.
-     */
     metadataKeyDescription: prop_types_1.default.string,
-    /**
-     * By default the price of an item is soruced from the pricebook entry for
-     * the option's Catalog Item. The price can alternatively be soruced from
-     * the option's Catalog Item metadata, by specifying the key under which the
-     * price can be found as the **metadataKeyPrice** prop.
-     */
     metadataKeyPrice: prop_types_1.default.string,
-    /**
-     * A boolean to set whether or all the Cards should display thumbnails
-     * for the options.
-     */
     showThumbnail: prop_types_1.default.bool,
-    /**
-     * A boolean to set whether or all the Cards should display the description
-     * for the options.
-     */
     showDescription: prop_types_1.default.bool,
-    /**
-     * A boolean to set whether or all the Cards should display the price
-     * for the options/
-     */
     showPrice: prop_types_1.default.bool,
 };
 exports.Strips.defaultProps = {
     description: undefined,
     className: undefined,
-    //  Default use
     attribute: undefined,
-    //  Default user overrides
     metadataKeyThumbnail: undefined,
     metadataKeyDescription: undefined,
     metadataKeyPrice: undefined,
     showThumbnail: true,
     showPrice: true,
     showDescription: true,
-    //  Custom use
     title: undefined,
     value: undefined,
     options: undefined,

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

@@ -10,44 +10,13 @@ export interface ISwatch extends IFormComponentProps<IOption> {
 export declare const Swatch: {
     (props: ISwatch): JSX.Element;
     propTypes: {
-        /**
-         * Is the attribute name on the initialized asset that we are
-         * using this component for. If the attribute prop is used,
-         * the component will ignore the props for: `value`, `options`, `onClick`.
-         */
         attribute: PropTypes.Requireable<string>;
-        /**
-         * Used to set the shape of the Swatch Option component. Options
-         * include: `square`, `round`
-         */
         shape: PropTypes.Requireable<string>;
-        /**
-         * Used to add a title to the input
-         */
         title: PropTypes.Requireable<string>;
-        /**
-         * Used to provide a custom description for the input component
-         */
         description: PropTypes.Requireable<string>;
-        /**
-         * Selected value from the option set. Should match the 'value' property
-         * of one of the items in the options array.
-         */
         value: PropTypes.Requireable<string>;
-        /**
-         * Handles the user seletion by passing the value of the selected
-         * option as the argument into the onClick callback.
-         */
         size: PropTypes.Requireable<string>;
-        /**
-         * The size of the for a swatch option. The size should be a valid CSS
-         * height/width property.
-         *
-         */
         onClick: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * The options set to be displayed for the user
-         */
         options: PropTypes.Requireable<(PropTypes.InferProps<{
             name: PropTypes.Requireable<string>;
             description: PropTypes.Requireable<string>;
@@ -57,44 +26,12 @@ export declare const Swatch: {
             color: PropTypes.Requireable<string>;
             disabled: PropTypes.Requireable<boolean>;
         }> | null | undefined)[]>;
-        /**
-         * Used to add a custom class name to each of the components html elements
-         */
         className: PropTypes.Requireable<string>;
-        /**
-         * By default the thumbnail (image/color value) is soruced from the `_thumbnail`
-         * metadata key in the option's Catalog Item. This metadata key can be overwritten
-         * by passing in the prefered key value to the **thumbnailFromMetadata** prop.
-         */
         metadataKeyThumbnail: PropTypes.Requireable<string>;
-        /**
-         * By default the description is soruced from the `_description` metadata
-         * key in the option's Catalog Item. This metadata key can be overwritten
-         * by passing in the prefered key value to the **metadataKeyDescription**
-         * prop.
-         */
         metadataKeyDescription: PropTypes.Requireable<string>;
-        /**
-         * By default the price of an item is soruced from the pricebook entry for
-         * the option's Catalog Item. The price can alternatively be soruced from
-         * the option's Catalog Item metadata, by specifying the key under which the
-         * price can be found as the **metadataKeyPrice** prop.
-         */
         metadataKeyPrice: PropTypes.Requireable<string>;
-        /**
-         * A boolean to set whether or all the Cards should display thumbnails
-         * for the options.
-         */
         showThumbnail: PropTypes.Requireable<boolean>;
-        /**
-         * A boolean to set whether or all the Cards should display the description
-         * for the options.
-         */
         showDescription: PropTypes.Requireable<boolean>;
-        /**
-         * A boolean to set whether or all the Cards should display the price
-         * for the options/
-         */
         showPrice: PropTypes.Requireable<boolean>;
     };
     defaultProps: {