@threekit-tools/treble 0.0.60-next.2 → 0.0.62
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Switch/index.d.ts +66 -0
- package/dist/components/Switch/index.js +86 -0
- package/dist/components/Switch/switch.styles.d.ts +4 -0
- package/dist/components/Switch/switch.styles.js +16 -0
- package/dist/components/TextInput/index.js +2 -0
- package/dist/components/Upload/index.js +5 -4
- package/dist/components/UploadArea/index.js +4 -3
- package/dist/components/containers/formInputContainer.d.ts +4 -4
- package/dist/components/formComponents.js +5 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +3 -1
- package/dist/threekit.d.ts +9 -5
- package/package.json +1 -1
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
3
|
+
import { IFormComponentProps, IOption } from '../containers/formInputContainer';
|
|
4
|
+
export interface ISwitch extends IFormComponentProps<IOption> {
|
|
5
|
+
showDescription?: boolean;
|
|
6
|
+
}
|
|
7
|
+
export declare const Switch: {
|
|
8
|
+
(props: ISwitch): JSX.Element;
|
|
9
|
+
propTypes: {
|
|
10
|
+
/**
|
|
11
|
+
* Is the attribute name on the initialized asset that we are
|
|
12
|
+
* using this component for. If the attribute prop is used,
|
|
13
|
+
* the component will ignore the props for: `value`, `options`, `onClick`.
|
|
14
|
+
*/
|
|
15
|
+
attribute: PropTypes.Requireable<string>;
|
|
16
|
+
/**
|
|
17
|
+
* Used to add a title to the input
|
|
18
|
+
*/
|
|
19
|
+
title: PropTypes.Requireable<string>;
|
|
20
|
+
/**
|
|
21
|
+
* Used to provide a custom description for the input component
|
|
22
|
+
*/
|
|
23
|
+
description: PropTypes.Requireable<string>;
|
|
24
|
+
/**
|
|
25
|
+
* Selected value from the option set. Should match the 'value' property
|
|
26
|
+
* of one of the items in the options array.
|
|
27
|
+
*/
|
|
28
|
+
value: PropTypes.Requireable<boolean>;
|
|
29
|
+
/**
|
|
30
|
+
* The size of the for a Switch option. The size should be a valid CSS
|
|
31
|
+
* height/width property.
|
|
32
|
+
*
|
|
33
|
+
*/
|
|
34
|
+
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
35
|
+
/**
|
|
36
|
+
* Used to add a custom class name to each of the components html elements
|
|
37
|
+
*/
|
|
38
|
+
className: PropTypes.Requireable<string>;
|
|
39
|
+
/**
|
|
40
|
+
* By default the description is soruced from the `_description` metadata
|
|
41
|
+
* key in the option's Catalog Item. This metadata key can be overwritten
|
|
42
|
+
* by passing in the prefered key value to the **metadataKeyDescription**
|
|
43
|
+
* prop.
|
|
44
|
+
*/
|
|
45
|
+
metadataKeyDescription: PropTypes.Requireable<string>;
|
|
46
|
+
/**
|
|
47
|
+
* A boolean to set whether or all the Cards should display the description
|
|
48
|
+
* for the options.
|
|
49
|
+
*/
|
|
50
|
+
showDescription: PropTypes.Requireable<boolean>;
|
|
51
|
+
};
|
|
52
|
+
defaultProps: {
|
|
53
|
+
description: undefined;
|
|
54
|
+
className: undefined;
|
|
55
|
+
attribute: undefined;
|
|
56
|
+
metadataKeyDescription: undefined;
|
|
57
|
+
showDescription: boolean;
|
|
58
|
+
title: undefined;
|
|
59
|
+
value: undefined;
|
|
60
|
+
onClick: undefined;
|
|
61
|
+
};
|
|
62
|
+
componentName: string;
|
|
63
|
+
compatibleAttributes: Set<string>;
|
|
64
|
+
};
|
|
65
|
+
declare const _default: (props: ISwitch) => JSX.Element | null;
|
|
66
|
+
export default _default;
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.Switch = void 0;
|
|
7
|
+
var react_1 = __importDefault(require("react"));
|
|
8
|
+
var prop_types_1 = __importDefault(require("prop-types"));
|
|
9
|
+
var FormComponentTitle_1 = __importDefault(require("../FormComponentTitle"));
|
|
10
|
+
var FormComponentDescription_1 = __importDefault(require("../FormComponentDescription"));
|
|
11
|
+
var switch_styles_1 = require("./switch.styles");
|
|
12
|
+
var shared_styles_1 = require("../shared.styles");
|
|
13
|
+
var utils_1 = require("../../utils");
|
|
14
|
+
var constants_1 = require("../../constants");
|
|
15
|
+
var formInputContainer_1 = __importDefault(require("../containers/formInputContainer"));
|
|
16
|
+
var Switch = function (props) {
|
|
17
|
+
var title = props.title, value = props.value, onChange = props.onChange, description = props.description, customClassName = props.className, showDescription = props.showDescription;
|
|
18
|
+
var cls = (0, utils_1.generateInputClassName)('Switch', customClassName, title);
|
|
19
|
+
return (react_1.default.createElement(shared_styles_1.FormComponentWrapper, { className: cls },
|
|
20
|
+
react_1.default.createElement(FormComponentTitle_1.default, { title: title, className: cls }),
|
|
21
|
+
react_1.default.createElement(FormComponentDescription_1.default, { description: showDescription ? description : undefined, className: cls }),
|
|
22
|
+
react_1.default.createElement(switch_styles_1.SwitchWrapper, null,
|
|
23
|
+
react_1.default.createElement(switch_styles_1.Checkbox, { type: "checkbox", checked: !!!value, onChange: function () { return onChange === null || onChange === void 0 ? void 0 : onChange(!!!value); } }),
|
|
24
|
+
react_1.default.createElement(switch_styles_1.Knob, null),
|
|
25
|
+
react_1.default.createElement(switch_styles_1.Layer, null))));
|
|
26
|
+
};
|
|
27
|
+
exports.Switch = Switch;
|
|
28
|
+
exports.Switch.propTypes = {
|
|
29
|
+
/**
|
|
30
|
+
* Is the attribute name on the initialized asset that we are
|
|
31
|
+
* using this component for. If the attribute prop is used,
|
|
32
|
+
* the component will ignore the props for: `value`, `options`, `onClick`.
|
|
33
|
+
*/
|
|
34
|
+
attribute: prop_types_1.default.string,
|
|
35
|
+
/**
|
|
36
|
+
* Used to add a title to the input
|
|
37
|
+
*/
|
|
38
|
+
title: prop_types_1.default.string,
|
|
39
|
+
/**
|
|
40
|
+
* Used to provide a custom description for the input component
|
|
41
|
+
*/
|
|
42
|
+
description: prop_types_1.default.string,
|
|
43
|
+
/**
|
|
44
|
+
* Selected value from the option set. Should match the 'value' property
|
|
45
|
+
* of one of the items in the options array.
|
|
46
|
+
*/
|
|
47
|
+
value: prop_types_1.default.bool,
|
|
48
|
+
/**
|
|
49
|
+
* The size of the for a Switch option. The size should be a valid CSS
|
|
50
|
+
* height/width property.
|
|
51
|
+
*
|
|
52
|
+
*/
|
|
53
|
+
onClick: prop_types_1.default.func,
|
|
54
|
+
/**
|
|
55
|
+
* Used to add a custom class name to each of the components html elements
|
|
56
|
+
*/
|
|
57
|
+
className: prop_types_1.default.string,
|
|
58
|
+
/**
|
|
59
|
+
* By default the description is soruced from the `_description` metadata
|
|
60
|
+
* key in the option's Catalog Item. This metadata key can be overwritten
|
|
61
|
+
* by passing in the prefered key value to the **metadataKeyDescription**
|
|
62
|
+
* prop.
|
|
63
|
+
*/
|
|
64
|
+
metadataKeyDescription: prop_types_1.default.string,
|
|
65
|
+
/**
|
|
66
|
+
* A boolean to set whether or all the Cards should display the description
|
|
67
|
+
* for the options.
|
|
68
|
+
*/
|
|
69
|
+
showDescription: prop_types_1.default.bool,
|
|
70
|
+
};
|
|
71
|
+
exports.Switch.defaultProps = {
|
|
72
|
+
description: undefined,
|
|
73
|
+
className: undefined,
|
|
74
|
+
// Default use
|
|
75
|
+
attribute: undefined,
|
|
76
|
+
// Default user overrides
|
|
77
|
+
metadataKeyDescription: undefined,
|
|
78
|
+
showDescription: true,
|
|
79
|
+
// Custom use
|
|
80
|
+
title: undefined,
|
|
81
|
+
value: undefined,
|
|
82
|
+
onClick: undefined,
|
|
83
|
+
};
|
|
84
|
+
exports.Switch.componentName = 'Switch';
|
|
85
|
+
exports.Switch.compatibleAttributes = new Set([constants_1.ATTRIBUTE_TYPES.boolean]);
|
|
86
|
+
exports.default = (0, formInputContainer_1.default)(exports.Switch);
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export declare const Layer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
2
|
+
export declare const Knob: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
+
export declare const Checkbox: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, {}, never>;
|
|
4
|
+
export declare const SwitchWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
3
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
|
+
return cooked;
|
|
5
|
+
};
|
|
6
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
7
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
8
|
+
};
|
|
9
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
10
|
+
exports.SwitchWrapper = exports.Checkbox = exports.Knob = exports.Layer = void 0;
|
|
11
|
+
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
|
+
exports.Layer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n\n width: 100%;\n border-radius: 100px;\n background-color: #bbb;\n transition: 0.3s ease all;\n z-index: 1;\n"], ["\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n\n width: 100%;\n border-radius: 100px;\n background-color: #bbb;\n transition: 0.3s ease all;\n z-index: 1;\n"])));
|
|
13
|
+
exports.Knob = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 2;\n\n &:before {\n content: '';\n position: absolute;\n top: 4px;\n left: 4px;\n width: 20px;\n height: 10px;\n color: #fff;\n font-size: 10px;\n font-weight: bold;\n text-align: center;\n line-height: 1;\n padding: 9px 4px;\n background-color: #fff;\n border-radius: 50%;\n transition: 0.3s ease all, left 0.3s cubic-bezier(0.18, 0.89, 0.35, 1.15);\n }\n"], ["\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 2;\n\n &:before {\n content: '';\n position: absolute;\n top: 4px;\n left: 4px;\n width: 20px;\n height: 10px;\n color: #fff;\n font-size: 10px;\n font-weight: bold;\n text-align: center;\n line-height: 1;\n padding: 9px 4px;\n background-color: #fff;\n border-radius: 50%;\n transition: 0.3s ease all, left 0.3s cubic-bezier(0.18, 0.89, 0.35, 1.15);\n }\n"])));
|
|
14
|
+
exports.Checkbox = styled_components_1.default.input(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n position: relative;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n opacity: 0;\n cursor: pointer;\n z-index: 3;\n"], ["\n position: relative;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n opacity: 0;\n cursor: pointer;\n z-index: 3;\n"])));
|
|
15
|
+
exports.SwitchWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: relative;\n width: 74px;\n height: 36px;\n overflow: hidden;\n\n & ", ":active + ", ":before {\n width: 46px;\n border-radius: 100px;\n }\n\n & ", ":checked + ", ":before {\n content: '';\n left: 42px;\n }\n\n & ", ":checked:active + ", ":before {\n margin-left: -26px;\n }\n\n & ", ":checked ~ ", " {\n background-color: ", ";\n }\n"], ["\n position: relative;\n width: 74px;\n height: 36px;\n overflow: hidden;\n\n & ", ":active + ", ":before {\n width: 46px;\n border-radius: 100px;\n }\n\n & ", ":checked + ", ":before {\n content: '';\n left: 42px;\n }\n\n & ", ":checked:active + ", ":before {\n margin-left: -26px;\n }\n\n & ", ":checked ~ ", " {\n background-color: ", ";\n }\n"])), exports.Checkbox, exports.Knob, exports.Checkbox, exports.Knob, exports.Checkbox, exports.Knob, exports.Checkbox, exports.Layer, function (props) { return props.theme.primaryColor; });
|
|
16
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
@@ -16,6 +16,8 @@ var formInputContainer_1 = __importDefault(require("../containers/formInputConta
|
|
|
16
16
|
var TextInput = function (props) {
|
|
17
17
|
var title = props.title, description = props.description, value = props.value, onChange = props.onChange, maxLength = props.maxLength, customClassName = props.className;
|
|
18
18
|
var cls = (0, utils_1.generateInputClassName)('text-input', customClassName, title);
|
|
19
|
+
if (typeof value !== 'string')
|
|
20
|
+
return react_1.default.createElement(react_1.default.Fragment, null);
|
|
19
21
|
return (react_1.default.createElement(shared_styles_1.FormComponentWrapper, { className: cls },
|
|
20
22
|
react_1.default.createElement(FormComponentTitle_1.default, { title: title, className: cls }),
|
|
21
23
|
react_1.default.createElement(FormComponentDescription_1.default, { description: description, className: cls }),
|
|
@@ -69,8 +69,9 @@ var icons_1 = require("../../icons");
|
|
|
69
69
|
var formInputContainer_1 = __importDefault(require("../containers/formInputContainer"));
|
|
70
70
|
var upload_styles_1 = require("./upload.styles");
|
|
71
71
|
var Upload = function (props) {
|
|
72
|
+
var _a, _b;
|
|
72
73
|
var title = props.title, description = props.description, value = props.value, onChange = props.onChange, customClassName = props.className;
|
|
73
|
-
var
|
|
74
|
+
var _c = (0, react_1.useState)(false), isUploading = _c[0], setIsUploading = _c[1];
|
|
74
75
|
var inputRef = (0, react_1.useRef)(null);
|
|
75
76
|
var imgRef = (0, react_1.useRef)(null);
|
|
76
77
|
var cls = (0, utils_1.generateInputClassName)('upload', customClassName, title);
|
|
@@ -78,7 +79,7 @@ var Upload = function (props) {
|
|
|
78
79
|
var _a;
|
|
79
80
|
if (isUploading)
|
|
80
81
|
return;
|
|
81
|
-
if (value === null || value === void 0 ? void 0 : value.length)
|
|
82
|
+
if (typeof value === 'string' && (value === null || value === void 0 ? void 0 : value.length))
|
|
82
83
|
return;
|
|
83
84
|
(_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
84
85
|
};
|
|
@@ -109,7 +110,7 @@ var Upload = function (props) {
|
|
|
109
110
|
return (react_1.default.createElement(shared_styles_1.FormComponentWrapper, null,
|
|
110
111
|
react_1.default.createElement(FormComponentTitle_1.default, { title: title, className: cls }),
|
|
111
112
|
react_1.default.createElement(FormComponentDescription_1.default, { description: description, className: cls }),
|
|
112
|
-
react_1.default.createElement(upload_styles_1.UploadWrapper, { className: cls, uploaded: !!(!isUploading && (value === null ||
|
|
113
|
+
react_1.default.createElement(upload_styles_1.UploadWrapper, { className: cls, uploaded: !!(!isUploading && ((_a = value) === null || _a === void 0 ? void 0 : _a.length)) },
|
|
113
114
|
react_1.default.createElement("input", { type: "file", ref: inputRef, onChange: function (e) { return __awaiter(void 0, void 0, void 0, function () {
|
|
114
115
|
var _a;
|
|
115
116
|
return __generator(this, function (_b) {
|
|
@@ -122,7 +123,7 @@ var Upload = function (props) {
|
|
|
122
123
|
react_1.default.createElement("button", { type: "button", onClick: handleClick }, isUploading ? (react_1.default.createElement(react_1.default.Fragment, null,
|
|
123
124
|
react_1.default.createElement(upload_styles_1.IconWrapper, null,
|
|
124
125
|
react_1.default.createElement(icons_1.SpinnerIcon, { size: "28px" })),
|
|
125
|
-
react_1.default.createElement("div", null, "Uploading..."))) : (value === null ||
|
|
126
|
+
react_1.default.createElement("div", null, "Uploading..."))) : ((_b = value) === null || _b === void 0 ? void 0 : _b.length) ? (react_1.default.createElement(upload_styles_1.ImageWrapper, null,
|
|
126
127
|
react_1.default.createElement("div", null,
|
|
127
128
|
react_1.default.createElement("img", { ref: imgRef, src: "#" })),
|
|
128
129
|
react_1.default.createElement(upload_styles_1.ImageActionArea, null,
|
|
@@ -69,9 +69,10 @@ var icons_1 = require("../../icons");
|
|
|
69
69
|
var formInputContainer_1 = __importDefault(require("../containers/formInputContainer"));
|
|
70
70
|
var uploadArea_styles_1 = require("./uploadArea.styles");
|
|
71
71
|
var UploadArea = function (props) {
|
|
72
|
+
var _a;
|
|
72
73
|
var title = props.title, description = props.description, value = props.value, onChange = props.onChange, customClassName = props.className;
|
|
73
|
-
var
|
|
74
|
-
var
|
|
74
|
+
var _b = (0, react_1.useState)(false), isUploading = _b[0], setIsUploading = _b[1];
|
|
75
|
+
var _c = (0, react_1.useState)(undefined), filename = _c[0], setFilename = _c[1];
|
|
75
76
|
var inputRef = (0, react_1.useRef)(null);
|
|
76
77
|
var imgRef = (0, react_1.useRef)(null);
|
|
77
78
|
var cls = (0, utils_1.generateInputClassName)('upload', customClassName, title);
|
|
@@ -120,7 +121,7 @@ var UploadArea = function (props) {
|
|
|
120
121
|
react_1.default.createElement("button", { type: "button", onClick: handleClick }, isUploading ? (react_1.default.createElement(uploadArea_styles_1.UploadingWrapper, null,
|
|
121
122
|
react_1.default.createElement("div", null,
|
|
122
123
|
react_1.default.createElement(icons_1.SpinnerIcon, { size: "28px" })),
|
|
123
|
-
react_1.default.createElement("div", null, "Uploading..."))) : (value === null ||
|
|
124
|
+
react_1.default.createElement("div", null, "Uploading..."))) : ((_a = value) === null || _a === void 0 ? void 0 : _a.length) ? (react_1.default.createElement(uploadArea_styles_1.UploadingWrapper, null,
|
|
124
125
|
react_1.default.createElement("div", null,
|
|
125
126
|
react_1.default.createElement("img", { ref: imgRef, src: "#" })),
|
|
126
127
|
react_1.default.createElement("div", null,
|
|
@@ -25,7 +25,7 @@ export interface IFormContainerProps extends Pick<MetadataKeys, 'metadataKeyThum
|
|
|
25
25
|
sort?: string;
|
|
26
26
|
title?: string;
|
|
27
27
|
description?: string;
|
|
28
|
-
value?: string;
|
|
28
|
+
value?: string | boolean;
|
|
29
29
|
onClick?: (value: RawAttributeValue) => Promise<void>;
|
|
30
30
|
onChange?: (value: RawAttributeValue) => Promise<void>;
|
|
31
31
|
className?: string;
|
|
@@ -36,12 +36,12 @@ export interface IFormComponentProps<T extends IOptionShared | undefined> extend
|
|
|
36
36
|
export interface IFormComponent<P> extends FunctionComponent<P> {
|
|
37
37
|
compatibleAttributes: Set<string>;
|
|
38
38
|
}
|
|
39
|
-
interface
|
|
39
|
+
interface IHydrateAttributeConfig {
|
|
40
40
|
metadataKeys: MetadataKeys;
|
|
41
41
|
sort?: string;
|
|
42
42
|
}
|
|
43
|
-
export declare const hydrateAttributeForComponent: (attribute: IHydratedAttribute, config:
|
|
44
|
-
selected: string | number | import("../../threekit").IConfigurationAsset | import("../../threekit").IConfigurationColor;
|
|
43
|
+
export declare const hydrateAttributeForComponent: (attribute: IHydratedAttribute, config: IHydrateAttributeConfig) => {
|
|
44
|
+
selected: string | number | boolean | import("../../threekit").IConfigurationAsset | import("../../threekit").IConfigurationColor;
|
|
45
45
|
options: {
|
|
46
46
|
name: string;
|
|
47
47
|
handleSelect: () => Promise<void>;
|
|
@@ -18,7 +18,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
18
18
|
__setModuleDefault(result, mod);
|
|
19
19
|
return result;
|
|
20
20
|
};
|
|
21
|
-
var _a, _b, _c, _d, _e;
|
|
21
|
+
var _a, _b, _c, _d, _e, _f;
|
|
22
22
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
23
23
|
exports.formComponents = exports.FORM_COMPONENT_TYPES = void 0;
|
|
24
24
|
var constants_1 = require("../constants");
|
|
@@ -31,6 +31,7 @@ var TilesGroup_1 = __importStar(require("./TilesGroup"));
|
|
|
31
31
|
var Upload_1 = __importStar(require("./Upload"));
|
|
32
32
|
// import UploadArea, { UploadArea as UploadAreaComponent } from './UploadArea';
|
|
33
33
|
var TextInput_1 = __importStar(require("./TextInput"));
|
|
34
|
+
var Switch_1 = __importStar(require("./Switch"));
|
|
34
35
|
exports.FORM_COMPONENT_TYPES = {
|
|
35
36
|
stringInput: 'string-input',
|
|
36
37
|
};
|
|
@@ -59,5 +60,8 @@ exports.formComponents = (_a = {},
|
|
|
59
60
|
_a[constants_1.ASSET_TYPES.upload] = (_e = {},
|
|
60
61
|
_e[Upload_1.Upload.componentName] = Upload_1.default,
|
|
61
62
|
_e),
|
|
63
|
+
_a[constants_1.ATTRIBUTE_TYPES.boolean] = (_f = {},
|
|
64
|
+
_f[Switch_1.Switch.componentName] = Switch_1.default,
|
|
65
|
+
_f),
|
|
62
66
|
_a);
|
|
63
67
|
exports.default = exports.formComponents;
|
package/dist/index.d.ts
CHANGED
|
@@ -22,6 +22,7 @@ import Swatch from './components/Swatch';
|
|
|
22
22
|
import Tiles from './components/Tiles';
|
|
23
23
|
import TilesGroup from './components/TilesGroup';
|
|
24
24
|
import Upload from './components/Upload';
|
|
25
|
+
import Switch from './components/Switch';
|
|
25
26
|
import ProductName from './components/ProductName';
|
|
26
27
|
import ProductDescription from './components/ProductDescription';
|
|
27
28
|
import AttributeTitle from './components/AttributeTitle';
|
|
@@ -43,4 +44,4 @@ import icons from './icons';
|
|
|
43
44
|
export * from './icons';
|
|
44
45
|
import TrebleApp from './components/TrebleApp';
|
|
45
46
|
import ProductLayout from './components/ProductLayout';
|
|
46
|
-
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, ProductName, ProductDescription, AttributeTitle, AttributeValue, TotalPrice, message, Modal, Drawer, Accordion, Tabs, PortalToElement, AwaitThreekitLoad, FlatForm, Zoom, Snapshots, Wishlist, Share, icons, TrebleApp, ProductLayout, };
|
|
47
|
+
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, PortalToElement, AwaitThreekitLoad, FlatForm, Zoom, Snapshots, Wishlist, Share, icons, TrebleApp, ProductLayout, };
|
package/dist/index.js
CHANGED
|
@@ -13,7 +13,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
13
13
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
14
14
|
};
|
|
15
15
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
16
|
-
exports.ProductLayout = exports.TrebleApp = 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.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;
|
|
16
|
+
exports.ProductLayout = exports.TrebleApp = 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.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;
|
|
17
17
|
// Hooks
|
|
18
18
|
var useAttribute_1 = __importDefault(require("./hooks/useAttribute"));
|
|
19
19
|
exports.useAttribute = useAttribute_1.default;
|
|
@@ -66,6 +66,8 @@ var TilesGroup_1 = __importDefault(require("./components/TilesGroup"));
|
|
|
66
66
|
exports.TilesGroup = TilesGroup_1.default;
|
|
67
67
|
var Upload_1 = __importDefault(require("./components/Upload"));
|
|
68
68
|
exports.Upload = Upload_1.default;
|
|
69
|
+
var Switch_1 = __importDefault(require("./components/Switch"));
|
|
70
|
+
exports.Switch = Switch_1.default;
|
|
69
71
|
// Display
|
|
70
72
|
var ProductName_1 = __importDefault(require("./components/ProductName"));
|
|
71
73
|
exports.ProductName = ProductName_1.default;
|
package/dist/threekit.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import Treble from './Treble';
|
|
|
3
3
|
declare type SCENE_PHASES = 'LOADED' | 'PRELOADED' | 'RENDERED';
|
|
4
4
|
declare type PRIVATE_APIS = 'scene' | 'player';
|
|
5
5
|
export declare type DISPLAY_OPTIONS = 'webgl' | 'image';
|
|
6
|
-
export declare type IAttributeTypes = 'String' | 'Asset' | 'Color' | 'Number';
|
|
6
|
+
export declare type IAttributeTypes = 'String' | 'Asset' | 'Color' | 'Number' | 'Boolean';
|
|
7
7
|
export declare type AssetType = 'upload' | 'item';
|
|
8
8
|
export declare type IMetadata = Record<string, string | number | null>;
|
|
9
9
|
/***************************************************
|
|
@@ -53,7 +53,7 @@ export interface IConfigurationColor {
|
|
|
53
53
|
g: number;
|
|
54
54
|
b: number;
|
|
55
55
|
}
|
|
56
|
-
export declare type IConfigurationAttribute = IConfigurationAsset | IConfigurationColor | string | number | undefined;
|
|
56
|
+
export declare type IConfigurationAttribute = IConfigurationAsset | IConfigurationColor | string | number | boolean | undefined;
|
|
57
57
|
export declare type IConfiguration = Record<string, IConfigurationAttribute>;
|
|
58
58
|
export declare type ISetConfiguration = Record<string, IConfigurationAttribute>;
|
|
59
59
|
/***************************************************
|
|
@@ -131,12 +131,16 @@ export interface IAttributeNumber extends IAttributeBase<'Number', number> {
|
|
|
131
131
|
min?: number;
|
|
132
132
|
step: number;
|
|
133
133
|
}
|
|
134
|
+
/****** NUMBER TYPE ATTRIBUTE *******/
|
|
135
|
+
export interface IAttributeBoolean extends IAttributeBase<'Boolean', boolean> {
|
|
136
|
+
defaultValue: boolean;
|
|
137
|
+
}
|
|
134
138
|
/****** getAttributes() *******/
|
|
135
|
-
export declare type IThreekitAttribute = IAttributeAsset | IAttributeColor | IAttributeString | IAttributeNumber;
|
|
139
|
+
export declare type IThreekitAttribute = IAttributeAsset | IAttributeColor | IAttributeString | IAttributeNumber | IAttributeBoolean;
|
|
136
140
|
/****** getDisplayAttributes() *******/
|
|
137
|
-
export declare type IThreekitDisplayAttribute = IDisplayAttributeAsset | IDisplayAttributeString | IAttributeColor | IAttributeNumber;
|
|
141
|
+
export declare type IThreekitDisplayAttribute = IDisplayAttributeAsset | IDisplayAttributeString | IAttributeColor | IAttributeNumber | IAttributeBoolean;
|
|
138
142
|
/****** Treble Hydrated Values *******/
|
|
139
|
-
export declare type IHydratedAttribute = IHydratedAttributeAsset | IHydratedAttributeString | IAttributeColor | IAttributeNumber;
|
|
143
|
+
export declare type IHydratedAttribute = IHydratedAttributeAsset | IHydratedAttributeString | IAttributeColor | IAttributeNumber | IAttributeBoolean;
|
|
140
144
|
/***************************************************
|
|
141
145
|
* Camera
|
|
142
146
|
**************************************************/
|