datasync-blob 1.1.1 → 1.1.2
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/DsBlob.js +169 -0
- package/dist/index.js +1 -243
- package/dist/types/DsBlob.d.ts +35 -0
- package/dist/types/index.d.ts +1 -0
- package/package.json +6 -8
package/dist/DsBlob.js
ADDED
|
@@ -0,0 +1,169 @@
|
|
|
1
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
2
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
3
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
4
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
5
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
6
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
7
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
8
|
+
});
|
|
9
|
+
};
|
|
10
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
11
|
+
import { Component } from "react";
|
|
12
|
+
export class DsBlob extends Component {
|
|
13
|
+
constructor(props) {
|
|
14
|
+
super(props);
|
|
15
|
+
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
16
|
+
this.reduceImage = (e) => {
|
|
17
|
+
let imageSource = (e.path && e.path[0]) || e.srcElement; //Safari compliancy
|
|
18
|
+
if (this.debugging)
|
|
19
|
+
console.log("imageSource = ", imageSource);
|
|
20
|
+
var canvas = document.createElement('canvas'), context, width = imageSource.width, height = imageSource.height;
|
|
21
|
+
//Exact size props are set
|
|
22
|
+
if (this.props.width && this.props.height) {
|
|
23
|
+
//Check image size
|
|
24
|
+
if (width > this.props.width || height > this.props.height) {
|
|
25
|
+
alert("L'image est trop grande, le format requis est " + this.props.width + "x" + this.props.height);
|
|
26
|
+
return;
|
|
27
|
+
}
|
|
28
|
+
//Check image size
|
|
29
|
+
if (width < this.props.width || height < this.props.height) {
|
|
30
|
+
alert("L'image est trop petite, le format requis est " + this.props.width + "x" + this.props.height);
|
|
31
|
+
return;
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
//Max size props are set
|
|
35
|
+
if (this.props.maxWidth && this.props.maxHeight) {
|
|
36
|
+
if (width > height) {
|
|
37
|
+
//Check resize is enabled
|
|
38
|
+
if (!this.props.reduceImage) {
|
|
39
|
+
alert("L'image est trop large ! la largeur maximale est de " + this.props.maxWidth);
|
|
40
|
+
return;
|
|
41
|
+
}
|
|
42
|
+
if (width > this.props.maxWidth) {
|
|
43
|
+
height *= this.props.maxWidth / width;
|
|
44
|
+
width = this.props.maxWidth;
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
else {
|
|
48
|
+
if (height > this.props.maxHeight) {
|
|
49
|
+
//Check resize is enabled
|
|
50
|
+
if (!this.props.reduceImage) {
|
|
51
|
+
alert("L'image est trop haute, la hauteur maximale est de " + this.props.maxHeight);
|
|
52
|
+
return;
|
|
53
|
+
}
|
|
54
|
+
width *= this.props.maxHeight / height;
|
|
55
|
+
height = this.props.maxHeight;
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
//Build 2d picture
|
|
60
|
+
canvas.width = width;
|
|
61
|
+
canvas.height = height;
|
|
62
|
+
context = canvas.getContext('2d');
|
|
63
|
+
context.drawImage(imageSource, 0, 0, width, height);
|
|
64
|
+
//Jpeg conversion
|
|
65
|
+
let jpegCompressionRatio = (this.props.jpegQuality && this.props.jpegQuality > 0 && this.props.jpegQuality < 1) ? this.props.jpegQuality : 1;
|
|
66
|
+
let canvasData = canvas.toDataURL('image/jpg', jpegCompressionRatio); //Jpeg conversion
|
|
67
|
+
if (this.debugging)
|
|
68
|
+
console.log("jpegCompressionRatio->", jpegCompressionRatio, " canvasData.length = ", canvasData.length);
|
|
69
|
+
if (this.props.removebase64) {
|
|
70
|
+
//remove base64 prefix if property is set
|
|
71
|
+
this.props.uploadPicture({ data: canvasData ? canvasData.substring("data:image/png;base64".length) : "", item_id: this.props.item_id });
|
|
72
|
+
}
|
|
73
|
+
else {
|
|
74
|
+
//Keep base 64 prefix as it is
|
|
75
|
+
this.props.uploadPicture({ data: canvasData ? canvasData : "", item_id: this.props.item_id });
|
|
76
|
+
}
|
|
77
|
+
};
|
|
78
|
+
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
79
|
+
this.storeImageToImg = (e) => {
|
|
80
|
+
var image = document.createElement('img');
|
|
81
|
+
image.onload = this.reduceImage;
|
|
82
|
+
image.src = e.currentTarget.result;
|
|
83
|
+
};
|
|
84
|
+
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
85
|
+
this.readImage = (aPictureFile) => __awaiter(this, void 0, void 0, function* () {
|
|
86
|
+
let _reader = new FileReader();
|
|
87
|
+
_reader.onload = this.storeImageToImg;
|
|
88
|
+
_reader.readAsDataURL(aPictureFile);
|
|
89
|
+
});
|
|
90
|
+
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
91
|
+
this.resetUpload = () => {
|
|
92
|
+
this.props.uploadPicture({ data: "", item_id: this.props.item_id });
|
|
93
|
+
};
|
|
94
|
+
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
95
|
+
this.onInputChange = (e) => {
|
|
96
|
+
const errs = [];
|
|
97
|
+
const files = Array.from(e.target.files || []);
|
|
98
|
+
const types = ['image/png', 'image/jpeg', 'image/gif'];
|
|
99
|
+
const _1Mo = 1024 * 1024;
|
|
100
|
+
const SizeLimit = 9;
|
|
101
|
+
//Reset input cache value - to assure trigger if user select the same file again
|
|
102
|
+
e.target.value = "";
|
|
103
|
+
if (this.debugging)
|
|
104
|
+
console.log("onInputChange");
|
|
105
|
+
if (files.length > 1) {
|
|
106
|
+
const msg = 'Pas plus d\'une image à la fois';
|
|
107
|
+
alert(msg);
|
|
108
|
+
return;
|
|
109
|
+
}
|
|
110
|
+
files.forEach((file, i) => {
|
|
111
|
+
let errCount = errs.length;
|
|
112
|
+
if (types.every(type => file.type !== type)) {
|
|
113
|
+
errs.push(`'${file.type}' : format non supporté`);
|
|
114
|
+
}
|
|
115
|
+
if (file.size > (SizeLimit * _1Mo)) {
|
|
116
|
+
errs.push(`'${file.name}' image trop volumineuse (max:${SizeLimit}Méga-octets)`);
|
|
117
|
+
}
|
|
118
|
+
if (this.debugging)
|
|
119
|
+
console.log(`errCount = ${errCount} vs errs.length = ${errs.length}`);
|
|
120
|
+
if (errCount == errs.length) { //None new error occurs
|
|
121
|
+
if (this.debugging)
|
|
122
|
+
console.log("readImage::", file.name);
|
|
123
|
+
this.readImage(file);
|
|
124
|
+
}
|
|
125
|
+
});
|
|
126
|
+
if (errs.length) {
|
|
127
|
+
return errs.forEach(err => alert(err));
|
|
128
|
+
}
|
|
129
|
+
};
|
|
130
|
+
this.state = { hover_input: false, hover_image: false };
|
|
131
|
+
this.debugging = false;
|
|
132
|
+
}
|
|
133
|
+
render() {
|
|
134
|
+
const upload_picture_label = {
|
|
135
|
+
cursor: "pointer"
|
|
136
|
+
};
|
|
137
|
+
const upload_picture_label_input = {
|
|
138
|
+
opacity: "0",
|
|
139
|
+
width: "0px",
|
|
140
|
+
height: "0px"
|
|
141
|
+
};
|
|
142
|
+
const div_show_image_hover = {
|
|
143
|
+
position: "relative",
|
|
144
|
+
margin: "0px",
|
|
145
|
+
opacity: "0.5"
|
|
146
|
+
};
|
|
147
|
+
const div_show_image = {
|
|
148
|
+
position: "relative",
|
|
149
|
+
margin: "0px"
|
|
150
|
+
};
|
|
151
|
+
const div_show_image_hover_input = {
|
|
152
|
+
display: "block",
|
|
153
|
+
top: "0px",
|
|
154
|
+
left: "0px",
|
|
155
|
+
position: "absolute"
|
|
156
|
+
};
|
|
157
|
+
const div_show_image_input = {
|
|
158
|
+
position: "absolute",
|
|
159
|
+
display: "none",
|
|
160
|
+
cursor: "pointer"
|
|
161
|
+
};
|
|
162
|
+
return (_jsxs("div", { children: [(!this.props.data) &&
|
|
163
|
+
_jsxs("label", { id: "upload-picture-label", className: this.props.buttonStyle, style: upload_picture_label, children: [this.props.Caption, _jsx("input", { style: upload_picture_label_input, id: "nested-input", type: "file", accept: "image/*", onChange: this.onInputChange, multiple: true })] }), (this.props.data && this.props.data.length > 0) &&
|
|
164
|
+
_jsxs("div", { className: "show-image", style: div_show_image, onMouseOver: () => { this.setState({ hover_input: true, hover_image: true }, () => { if (this.debugging)
|
|
165
|
+
console.log("onMouseOver"); }); }, onMouseLeave: () => { this.setState({ hover_input: false, hover_image: false }, () => { if (this.debugging)
|
|
166
|
+
console.log("onMouseLeave"); }); }, children: [_jsx("img", { style: this.state.hover_image ? div_show_image_hover : div_show_image, src: (this.props.removebase64) ? "data:image/png;base64" : "" + this.props.data, className: this.props.pictureStyle }), !this.props.readOnly &&
|
|
167
|
+
_jsx("input", { style: this.state.hover_input ? div_show_image_hover_input : div_show_image_input, className: "btn btn-primary delete", type: "button", value: "Effacer", onClick: this.resetUpload })] })] }));
|
|
168
|
+
}
|
|
169
|
+
}
|
package/dist/index.js
CHANGED
|
@@ -1,243 +1 @@
|
|
|
1
|
-
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __export = (target, all) => {
|
|
7
|
-
for (var name in all)
|
|
8
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
-
};
|
|
10
|
-
var __copyProps = (to, from, except, desc) => {
|
|
11
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
-
for (let key of __getOwnPropNames(from))
|
|
13
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
-
}
|
|
16
|
-
return to;
|
|
17
|
-
};
|
|
18
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
-
var __async = (__this, __arguments, generator) => {
|
|
20
|
-
return new Promise((resolve, reject) => {
|
|
21
|
-
var fulfilled = (value) => {
|
|
22
|
-
try {
|
|
23
|
-
step(generator.next(value));
|
|
24
|
-
} catch (e) {
|
|
25
|
-
reject(e);
|
|
26
|
-
}
|
|
27
|
-
};
|
|
28
|
-
var rejected = (value) => {
|
|
29
|
-
try {
|
|
30
|
-
step(generator.throw(value));
|
|
31
|
-
} catch (e) {
|
|
32
|
-
reject(e);
|
|
33
|
-
}
|
|
34
|
-
};
|
|
35
|
-
var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
|
|
36
|
-
step((generator = generator.apply(__this, __arguments)).next());
|
|
37
|
-
});
|
|
38
|
-
};
|
|
39
|
-
|
|
40
|
-
// src/index.ts
|
|
41
|
-
var index_exports = {};
|
|
42
|
-
__export(index_exports, {
|
|
43
|
-
DsBlob: () => DsBlob
|
|
44
|
-
});
|
|
45
|
-
module.exports = __toCommonJS(index_exports);
|
|
46
|
-
|
|
47
|
-
// src/components/DsBlob.tsx
|
|
48
|
-
var import_react = require("react");
|
|
49
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
50
|
-
var DsBlob = class extends import_react.Component {
|
|
51
|
-
constructor(props) {
|
|
52
|
-
super(props);
|
|
53
|
-
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
54
|
-
this.reduceImage = (e) => {
|
|
55
|
-
let imageSource = e.path && e.path[0] || e.srcElement;
|
|
56
|
-
if (this.debugging) console.log("imageSource = ", imageSource);
|
|
57
|
-
var canvas = document.createElement("canvas"), context, width = imageSource.width, height = imageSource.height;
|
|
58
|
-
if (this.props.width && this.props.height) {
|
|
59
|
-
if (width > this.props.width || height > this.props.height) {
|
|
60
|
-
alert("L'image est trop grande, le format requis est " + this.props.width + "x" + this.props.height);
|
|
61
|
-
return;
|
|
62
|
-
}
|
|
63
|
-
if (width < this.props.width || height < this.props.height) {
|
|
64
|
-
alert("L'image est trop petite, le format requis est " + this.props.width + "x" + this.props.height);
|
|
65
|
-
return;
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
if (this.props.maxWidth && this.props.maxHeight) {
|
|
69
|
-
if (width > height) {
|
|
70
|
-
if (!this.props.reduceImage) {
|
|
71
|
-
alert("L'image est trop large ! la largeur maximale est de " + this.props.maxWidth);
|
|
72
|
-
return;
|
|
73
|
-
}
|
|
74
|
-
if (width > this.props.maxWidth) {
|
|
75
|
-
height *= this.props.maxWidth / width;
|
|
76
|
-
width = this.props.maxWidth;
|
|
77
|
-
}
|
|
78
|
-
} else {
|
|
79
|
-
if (height > this.props.maxHeight) {
|
|
80
|
-
if (!this.props.reduceImage) {
|
|
81
|
-
alert("L'image est trop haute, la hauteur maximale est de " + this.props.maxHeight);
|
|
82
|
-
return;
|
|
83
|
-
}
|
|
84
|
-
width *= this.props.maxHeight / height;
|
|
85
|
-
height = this.props.maxHeight;
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
canvas.width = width;
|
|
90
|
-
canvas.height = height;
|
|
91
|
-
context = canvas.getContext("2d");
|
|
92
|
-
context.drawImage(imageSource, 0, 0, width, height);
|
|
93
|
-
let jpegCompressionRatio = this.props.jpegQuality && this.props.jpegQuality > 0 && this.props.jpegQuality < 1 ? this.props.jpegQuality : 1;
|
|
94
|
-
let canvasData = canvas.toDataURL("image/jpg", jpegCompressionRatio);
|
|
95
|
-
if (this.debugging)
|
|
96
|
-
console.log("jpegCompressionRatio->", jpegCompressionRatio, " canvasData.length = ", canvasData.length);
|
|
97
|
-
if (this.props.removebase64) {
|
|
98
|
-
this.props.uploadPicture({ data: canvasData ? canvasData.substring("data:image/png;base64".length) : "", item_id: this.props.item_id });
|
|
99
|
-
} else {
|
|
100
|
-
this.props.uploadPicture({ data: canvasData ? canvasData : "", item_id: this.props.item_id });
|
|
101
|
-
}
|
|
102
|
-
};
|
|
103
|
-
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
104
|
-
this.storeImageToImg = (e) => {
|
|
105
|
-
var image = document.createElement("img");
|
|
106
|
-
image.onload = this.reduceImage;
|
|
107
|
-
image.src = e.currentTarget.result;
|
|
108
|
-
};
|
|
109
|
-
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
110
|
-
this.readImage = (aPictureFile) => __async(this, null, function* () {
|
|
111
|
-
let _reader = new FileReader();
|
|
112
|
-
_reader.onload = this.storeImageToImg;
|
|
113
|
-
_reader.readAsDataURL(aPictureFile);
|
|
114
|
-
});
|
|
115
|
-
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
116
|
-
this.resetUpload = () => {
|
|
117
|
-
this.props.uploadPicture({ data: "", item_id: this.props.item_id });
|
|
118
|
-
};
|
|
119
|
-
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
120
|
-
this.onInputChange = (e) => {
|
|
121
|
-
const errs = [];
|
|
122
|
-
const files = Array.from(e.target.files || []);
|
|
123
|
-
const types = ["image/png", "image/jpeg", "image/gif"];
|
|
124
|
-
const _1Mo = 1024 * 1024;
|
|
125
|
-
const SizeLimit = 9;
|
|
126
|
-
e.target.value = "";
|
|
127
|
-
if (this.debugging)
|
|
128
|
-
console.log("onInputChange");
|
|
129
|
-
if (files.length > 1) {
|
|
130
|
-
const msg = "Pas plus d'une image \xE0 la fois";
|
|
131
|
-
alert(msg);
|
|
132
|
-
return;
|
|
133
|
-
}
|
|
134
|
-
files.forEach((file, i) => {
|
|
135
|
-
let errCount = errs.length;
|
|
136
|
-
if (types.every((type) => file.type !== type)) {
|
|
137
|
-
errs.push(`'${file.type}' : format non support\xE9`);
|
|
138
|
-
}
|
|
139
|
-
if (file.size > SizeLimit * _1Mo) {
|
|
140
|
-
errs.push(`'${file.name}' image trop volumineuse (max:${SizeLimit}M\xE9ga-octets)`);
|
|
141
|
-
}
|
|
142
|
-
if (this.debugging)
|
|
143
|
-
console.log(`errCount = ${errCount} vs errs.length = ${errs.length}`);
|
|
144
|
-
if (errCount == errs.length) {
|
|
145
|
-
if (this.debugging)
|
|
146
|
-
console.log("readImage::", file.name);
|
|
147
|
-
this.readImage(file);
|
|
148
|
-
}
|
|
149
|
-
});
|
|
150
|
-
if (errs.length) {
|
|
151
|
-
return errs.forEach((err) => alert(err));
|
|
152
|
-
}
|
|
153
|
-
};
|
|
154
|
-
this.state = { hover_input: false, hover_image: false };
|
|
155
|
-
this.debugging = false;
|
|
156
|
-
}
|
|
157
|
-
render() {
|
|
158
|
-
const upload_picture_label = {
|
|
159
|
-
cursor: "pointer"
|
|
160
|
-
};
|
|
161
|
-
const upload_picture_label_input = {
|
|
162
|
-
opacity: "0",
|
|
163
|
-
width: "0px",
|
|
164
|
-
height: "0px"
|
|
165
|
-
};
|
|
166
|
-
const div_show_image_hover = {
|
|
167
|
-
position: "relative",
|
|
168
|
-
margin: "0px",
|
|
169
|
-
opacity: "0.5"
|
|
170
|
-
};
|
|
171
|
-
const div_show_image = {
|
|
172
|
-
position: "relative",
|
|
173
|
-
margin: "0px"
|
|
174
|
-
};
|
|
175
|
-
const div_show_image_hover_input = {
|
|
176
|
-
display: "block",
|
|
177
|
-
top: "0px",
|
|
178
|
-
left: "0px",
|
|
179
|
-
position: "absolute"
|
|
180
|
-
};
|
|
181
|
-
const div_show_image_input = {
|
|
182
|
-
position: "absolute",
|
|
183
|
-
display: "none",
|
|
184
|
-
cursor: "pointer"
|
|
185
|
-
};
|
|
186
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
|
|
187
|
-
!this.props.data && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
188
|
-
"label",
|
|
189
|
-
{
|
|
190
|
-
id: "upload-picture-label",
|
|
191
|
-
className: this.props.buttonStyle,
|
|
192
|
-
style: upload_picture_label,
|
|
193
|
-
children: [
|
|
194
|
-
this.props.Caption,
|
|
195
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { style: upload_picture_label_input, id: "nested-input", type: "file", accept: "image/*", onChange: this.onInputChange, multiple: true })
|
|
196
|
-
]
|
|
197
|
-
}
|
|
198
|
-
),
|
|
199
|
-
this.props.data && this.props.data.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
200
|
-
"div",
|
|
201
|
-
{
|
|
202
|
-
className: "show-image",
|
|
203
|
-
style: div_show_image,
|
|
204
|
-
onMouseOver: () => {
|
|
205
|
-
this.setState({ hover_input: true, hover_image: true }, () => {
|
|
206
|
-
if (this.debugging) console.log("onMouseOver");
|
|
207
|
-
});
|
|
208
|
-
},
|
|
209
|
-
onMouseLeave: () => {
|
|
210
|
-
this.setState({ hover_input: false, hover_image: false }, () => {
|
|
211
|
-
if (this.debugging) console.log("onMouseLeave");
|
|
212
|
-
});
|
|
213
|
-
},
|
|
214
|
-
children: [
|
|
215
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
216
|
-
"img",
|
|
217
|
-
{
|
|
218
|
-
style: this.state.hover_image ? div_show_image_hover : div_show_image,
|
|
219
|
-
src: this.props.removebase64 ? "data:image/png;base64" : "" + this.props.data,
|
|
220
|
-
className: this.props.pictureStyle
|
|
221
|
-
}
|
|
222
|
-
),
|
|
223
|
-
!this.props.readOnly && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
224
|
-
"input",
|
|
225
|
-
{
|
|
226
|
-
style: this.state.hover_input ? div_show_image_hover_input : div_show_image_input,
|
|
227
|
-
className: "btn btn-primary delete",
|
|
228
|
-
type: "button",
|
|
229
|
-
value: "Effacer",
|
|
230
|
-
onClick: this.resetUpload
|
|
231
|
-
}
|
|
232
|
-
)
|
|
233
|
-
]
|
|
234
|
-
}
|
|
235
|
-
)
|
|
236
|
-
] });
|
|
237
|
-
}
|
|
238
|
-
};
|
|
239
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
240
|
-
0 && (module.exports = {
|
|
241
|
-
DsBlob
|
|
242
|
-
});
|
|
243
|
-
//# sourceMappingURL=index.js.map
|
|
1
|
+
export { DsBlob } from './DsBlob';
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { Component, ChangeEvent } from "react";
|
|
2
|
+
interface DsBlobProps {
|
|
3
|
+
width?: number;
|
|
4
|
+
height?: number;
|
|
5
|
+
maxWidth?: number;
|
|
6
|
+
maxHeight?: number;
|
|
7
|
+
reduceImage?: boolean;
|
|
8
|
+
jpegQuality?: number;
|
|
9
|
+
removebase64?: boolean;
|
|
10
|
+
uploadPicture: (data: {
|
|
11
|
+
data: string;
|
|
12
|
+
item_id: any;
|
|
13
|
+
}) => void;
|
|
14
|
+
item_id: any;
|
|
15
|
+
data?: string;
|
|
16
|
+
buttonStyle?: string;
|
|
17
|
+
Caption?: string;
|
|
18
|
+
pictureStyle?: string;
|
|
19
|
+
readOnly?: boolean;
|
|
20
|
+
}
|
|
21
|
+
interface DsBlobState {
|
|
22
|
+
hover_input: boolean;
|
|
23
|
+
hover_image: boolean;
|
|
24
|
+
}
|
|
25
|
+
export declare class DsBlob extends Component<DsBlobProps, DsBlobState> {
|
|
26
|
+
private debugging;
|
|
27
|
+
constructor(props: DsBlobProps);
|
|
28
|
+
reduceImage: (e: Event) => void;
|
|
29
|
+
storeImageToImg: (e: ProgressEvent<FileReader>) => void;
|
|
30
|
+
readImage: (aPictureFile: File) => Promise<void>;
|
|
31
|
+
resetUpload: () => void;
|
|
32
|
+
onInputChange: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
33
|
+
render(): import("react/jsx-runtime").JSX.Element;
|
|
34
|
+
}
|
|
35
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { DsBlob } from './DsBlob';
|
package/package.json
CHANGED
|
@@ -1,14 +1,11 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "datasync-blob",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.2",
|
|
4
4
|
"description": "Datasync Blob component",
|
|
5
|
-
"
|
|
6
|
-
"
|
|
7
|
-
"
|
|
8
|
-
"
|
|
9
|
-
"files": [
|
|
10
|
-
"./dist"
|
|
11
|
-
],
|
|
5
|
+
"main": "./dist/DsBlob.js",
|
|
6
|
+
"module": "./dist/DsBlob.js",
|
|
7
|
+
"types": "./types/DsBlob.d.ts",
|
|
8
|
+
"files": ["./dist"],
|
|
12
9
|
"repository": {
|
|
13
10
|
"type": "git",
|
|
14
11
|
"url": "https://github.com/pmabiala/datasync-blob.git"
|
|
@@ -39,6 +36,7 @@
|
|
|
39
36
|
"react": "^ 18.2.0"
|
|
40
37
|
},
|
|
41
38
|
"scripts": {
|
|
39
|
+
"hybrid":"tsc",
|
|
42
40
|
"tsup": "tsup",
|
|
43
41
|
"build_old": "rm -r dist && babel src -d dist --ignore src/**/*.test.jsx && npm run copy-files",
|
|
44
42
|
"build": "rm -r dist && babel src -d dist --ignore src/**/*.test.jsx && npm run copy-files && webpack --config webpack.config.js",
|