@threedddplus/logoeditor 0.0.8 → 0.0.9
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/middleMenu/middleMenu.d.ts +3 -1
- package/dist/components/myLogo/myLogo.d.ts +3 -1
- package/dist/index.d.ts +5 -1
- package/dist/logoeditor.cjs.development.js +39 -15
- package/dist/logoeditor.cjs.development.js.map +1 -1
- package/dist/logoeditor.cjs.production.min.js +1 -1
- package/dist/logoeditor.cjs.production.min.js.map +1 -1
- package/dist/logoeditor.esm.js +39 -15
- package/dist/logoeditor.esm.js.map +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
@@ -6,7 +6,11 @@ import * as services from './services';
|
|
6
6
|
/**
|
7
7
|
* A custom App component. Neat!
|
8
8
|
*/
|
9
|
-
declare const LogoEditor: ({ stepperId }: {
|
9
|
+
declare const LogoEditor: ({ stepperId, onApply, customLogoColorList, defaultColorList, logoData, }: {
|
10
10
|
stepperId: any;
|
11
|
+
onApply: any;
|
12
|
+
customLogoColorList: any;
|
13
|
+
defaultColorList: any;
|
14
|
+
logoData: any;
|
11
15
|
}) => React.JSX.Element;
|
12
16
|
export { LogoEditor, Components, use3dddPlus, services };
|
@@ -13,7 +13,6 @@ var CryptoJS = _interopDefault(require('crypto-js'));
|
|
13
13
|
var fabric = require('fabric');
|
14
14
|
var AWS = _interopDefault(require('aws-sdk'));
|
15
15
|
var ImageTracer = _interopDefault(require('imagetracerjs'));
|
16
|
-
var client = require('react-dom/client');
|
17
16
|
var reakit = require('reakit');
|
18
17
|
var reactIcons = require('react-icons');
|
19
18
|
var io = require('react-icons/io');
|
@@ -4963,7 +4962,8 @@ var Loader = function Loader(_ref) {
|
|
4963
4962
|
}));
|
4964
4963
|
};
|
4965
4964
|
|
4966
|
-
var MyLogo$1 = function MyLogo() {
|
4965
|
+
var MyLogo$1 = function MyLogo(_ref) {
|
4966
|
+
var onApply = _ref.onApply;
|
4967
4967
|
var _React$useState = React__default.useState(),
|
4968
4968
|
logoSelected = _React$useState[0],
|
4969
4969
|
setLogoSelected = _React$useState[1];
|
@@ -4988,7 +4988,12 @@ var MyLogo$1 = function MyLogo() {
|
|
4988
4988
|
};
|
4989
4989
|
|
4990
4990
|
var handleApplyLogo = function handleApplyLogo(logo) {
|
4991
|
+
if (logo) {
|
4992
|
+
onApply();
|
4993
|
+
// setLogoSelected(logo);
|
4994
|
+
}
|
4991
4995
|
};
|
4996
|
+
|
4992
4997
|
return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
|
4993
4998
|
className: "bg-[#F7F7F7] absolute z-100 w-[90%] h-full pr-[56px]"
|
4994
4999
|
}, React__default.createElement("div", {
|
@@ -5049,7 +5054,7 @@ var MyLogo$1 = function MyLogo() {
|
|
5049
5054
|
}
|
5050
5055
|
}, "Edit"), React__default.createElement("button", {
|
5051
5056
|
onClick: function onClick() {
|
5052
|
-
return handleApplyLogo();
|
5057
|
+
return handleApplyLogo(logoData);
|
5053
5058
|
},
|
5054
5059
|
className: "border p-3 w-[160px] " + (logoSelected ? 'border-[#e11a38] text-[#e11a38]' : 'bg-[black] text-white font-bold')
|
5055
5060
|
}, "Apply"))), loading && React__default.createElement(Loader, null));
|
@@ -6351,7 +6356,8 @@ var ColorPicker = function ColorPicker() {
|
|
6351
6356
|
})));
|
6352
6357
|
};
|
6353
6358
|
|
6354
|
-
var MiddleMenu = function MiddleMenu() {
|
6359
|
+
var MiddleMenu = function MiddleMenu(_ref) {
|
6360
|
+
var onApply = _ref.onApply;
|
6355
6361
|
var _use3dddPlus = use3dddPlus(function (state) {
|
6356
6362
|
return [state.selectedStepper, state.toggleSaveDesign, state.loadingLogo];
|
6357
6363
|
}, shallow.shallow),
|
@@ -6367,7 +6373,9 @@ var MiddleMenu = function MiddleMenu() {
|
|
6367
6373
|
className: "flex w-[70%] h-[100%]"
|
6368
6374
|
}, React__default.createElement(canvas, null)), toggleSaveDesign.status && React__default.createElement(SaveDesign, null), React__default.createElement("div", {
|
6369
6375
|
className: "flex-1 z-10 h-[100%] "
|
6370
|
-
}, React__default.createElement(Rightmenu, null))), selectedStepper === 1 && React__default.createElement(UploadLogo, null), selectedStepper === 4 && React__default.createElement(AddMascot, null), selectedStepper === 2 && React__default.createElement(MyLogo$1,
|
6376
|
+
}, React__default.createElement(Rightmenu, null))), selectedStepper === 1 && React__default.createElement(UploadLogo, null), selectedStepper === 4 && React__default.createElement(AddMascot, null), selectedStepper === 2 && React__default.createElement(MyLogo$1, {
|
6377
|
+
onApply: onApply
|
6378
|
+
}), selectedStepper === 5 && React__default.createElement(ColorPicker, null));
|
6371
6379
|
};
|
6372
6380
|
|
6373
6381
|
// import { Modal } from './components';
|
@@ -6378,14 +6386,34 @@ var MiddleMenu = function MiddleMenu() {
|
|
6378
6386
|
* A custom App component. Neat!
|
6379
6387
|
*/
|
6380
6388
|
var LogoEditor = function LogoEditor(_ref) {
|
6381
|
-
var stepperId = _ref.stepperId
|
6389
|
+
var stepperId = _ref.stepperId,
|
6390
|
+
onApply = _ref.onApply,
|
6391
|
+
customLogoColorList = _ref.customLogoColorList,
|
6392
|
+
defaultColorList = _ref.defaultColorList,
|
6393
|
+
logoData = _ref.logoData;
|
6382
6394
|
var _use3dddPlus = use3dddPlus(function (state) {
|
6383
|
-
return [state.setSelectedStepper];
|
6395
|
+
return [state.setSelectedStepper, state.myLogoHandler];
|
6384
6396
|
}),
|
6385
|
-
setSelectedStepper = _use3dddPlus[0]
|
6397
|
+
setSelectedStepper = _use3dddPlus[0],
|
6398
|
+
myLogoHandler = _use3dddPlus[1];
|
6386
6399
|
React__default.useEffect(function () {
|
6387
6400
|
setSelectedStepper(stepperId);
|
6401
|
+
if (stepperId == undefined) {
|
6402
|
+
myLogoHandler(logoData);
|
6403
|
+
console.log('logoData', logoData);
|
6404
|
+
}
|
6388
6405
|
}, [stepperId]);
|
6406
|
+
React__default.useEffect(function () {
|
6407
|
+
use3dddPlus.setState({
|
6408
|
+
customUploadLogoColorList: customLogoColorList
|
6409
|
+
});
|
6410
|
+
}, [customLogoColorList]);
|
6411
|
+
React__default.useEffect(function () {
|
6412
|
+
use3dddPlus.setState({
|
6413
|
+
defaultColorList: defaultColorList
|
6414
|
+
});
|
6415
|
+
}, [defaultColorList]);
|
6416
|
+
console.log('defaultColorList', defaultColorList);
|
6389
6417
|
return (
|
6390
6418
|
// <Modal
|
6391
6419
|
// backdropStyle={`z-[7]`}
|
@@ -6399,17 +6427,13 @@ var LogoEditor = function LogoEditor(_ref) {
|
|
6399
6427
|
className: "lg:w-[10%]"
|
6400
6428
|
}, React__default.createElement(LeftMenu, null)), React__default.createElement("div", {
|
6401
6429
|
className: " flex h-full w-[90%]"
|
6402
|
-
}, React__default.createElement(MiddleMenu,
|
6430
|
+
}, React__default.createElement(MiddleMenu, {
|
6431
|
+
onApply: onApply
|
6432
|
+
})))
|
6403
6433
|
// </Modal>
|
6404
6434
|
);
|
6405
6435
|
};
|
6406
6436
|
|
6407
|
-
var container = /*#__PURE__*/document.getElementById('root');
|
6408
|
-
var root = /*#__PURE__*/client.createRoot(container); // createRoot(container!) if you use TypeScript
|
6409
|
-
root.render(React__default.createElement(LogoEditor, {
|
6410
|
-
stepperId: 1
|
6411
|
-
}));
|
6412
|
-
|
6413
6437
|
exports.Components = index$1;
|
6414
6438
|
exports.LogoEditor = LogoEditor;
|
6415
6439
|
exports.services = index;
|