juxscript 1.1.167 → 1.1.168

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.
@@ -1 +1 @@
1
- {"version":3,"file":"fileupload.d.ts","sourceRoot":"","sources":["fileupload.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAGnE,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAMxD,MAAM,WAAW,iBAAiB;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,OAAO,GAAG,MAAM,CAAC;IACjD,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAClC;AAED,UAAU,eAAgB,SAAQ,SAAS;IACvC,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;CAChB;AAED,qBAAa,UAAW,SAAQ,aAAa,CAAC,eAAe,CAAC;IAC1D,OAAO,CAAC,gBAAgB,CAA4B;IACpD,OAAO,CAAC,QAAQ,CAA4B;IAC5C,OAAO,CAAC,SAAS,CAAkC;gBAEvC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,iBAAsB;IA0BvD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAQhD,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK3B,QAAQ,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAK9B,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAKzB,OAAO,CAAC,KAAK,EAAE,WAAW,EAAE,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,IAAI;IAMjE,KAAK,IAAI,IAAI;IAgBb,QAAQ,IAAI,IAAI,EAAE;IAIlB,QAAQ,CAAC,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI;IAM7B,QAAQ,IAAI,OAAO;IAcnB,OAAO,IAAI,OAAO;IAKlB,SAAS,CAAC,cAAc,CAAC,KAAK,EAAE,IAAI,EAAE,GAAG,OAAO,GAAG,MAAM;IAiBzD,SAAS,CAAC,kBAAkB,IAAI,WAAW;IAiB3C,OAAO,CAAC,eAAe;IA6BvB,OAAO,CAAC,eAAe;IAYvB,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;CA2FrE;AAED,wBAAgB,UAAU,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,iBAAsB,GAAG,UAAU,CAElF"}
1
+ {"version":3,"file":"fileupload.d.ts","sourceRoot":"","sources":["fileupload.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAGnE,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAMxD,MAAM,WAAW,iBAAiB;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,OAAO,GAAG,MAAM,CAAC;IACjD,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAClC;AAED,UAAU,eAAgB,SAAQ,SAAS;IACvC,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;CAChB;AAED,qBAAa,UAAW,SAAQ,aAAa,CAAC,eAAe,CAAC;IAC1D,OAAO,CAAC,gBAAgB,CAA4B;IACpD,OAAO,CAAC,QAAQ,CAA4B;IAC5C,OAAO,CAAC,SAAS,CAAkC;gBAEvC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,iBAAsB;IA0BvD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAQhD,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK3B,QAAQ,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAK9B,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAKzB,OAAO,CAAC,KAAK,EAAE,WAAW,EAAE,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,IAAI;IAMjE,KAAK,IAAI,IAAI;IAgBb,QAAQ,IAAI,IAAI,EAAE;IAIlB,QAAQ,CAAC,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI;IAM7B,QAAQ,IAAI,OAAO;IAcnB,OAAO,IAAI,OAAO;IAKlB,SAAS,CAAC,cAAc,CAAC,KAAK,EAAE,IAAI,EAAE,GAAG,OAAO,GAAG,MAAM;IAiBzD,SAAS,CAAC,kBAAkB,IAAI,WAAW;IAiB3C,OAAO,CAAC,eAAe;IA6BvB,OAAO,CAAC,eAAe;IAYvB,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;CAiGrE;AAED,wBAAgB,UAAU,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,iBAAsB,GAAG,UAAU,CAElF"}
@@ -159,7 +159,7 @@ export class FileUpload extends BaseComponent {
159
159
  * ═════════════════════════════════════════════════════════════════ */
160
160
  render(targetId) {
161
161
  const container = this._setupContainer(targetId);
162
- const { icon, style, class: className } = this.state;
162
+ const { label, accept, multiple, icon, style, class: className } = this.state;
163
163
  const wrapper = document.createElement('div');
164
164
  wrapper.className = 'jux-input jux-fileupload';
165
165
  wrapper.id = this._id;
@@ -170,9 +170,15 @@ export class FileUpload extends BaseComponent {
170
170
  if (this.state.label) {
171
171
  wrapper.appendChild(this._renderLabel());
172
172
  }
173
- const inputEl = this._buildInputElement();
174
- this._inputElement = inputEl;
175
- wrapper.appendChild(inputEl);
173
+ // File input
174
+ const fileInput = document.createElement('input');
175
+ fileInput.type = 'file';
176
+ fileInput.id = `${this._id}-input`;
177
+ fileInput.style.display = 'none';
178
+ fileInput.multiple = multiple;
179
+ fileInput.accept = accept;
180
+ this._inputElement = fileInput;
181
+ wrapper.appendChild(fileInput);
176
182
  const buttonContainer = document.createElement('div');
177
183
  buttonContainer.className = 'jux-fileupload-button-container';
178
184
  if (icon) {
@@ -193,9 +199,9 @@ export class FileUpload extends BaseComponent {
193
199
  this._fileListElement = fileList;
194
200
  wrapper.appendChild(fileList);
195
201
  wrapper.appendChild(this._renderError());
196
- button.addEventListener('click', () => inputEl.click());
197
- inputEl.addEventListener('change', (e) => {
198
- const files = Array.from(inputEl.files || []);
202
+ button.addEventListener('click', () => fileInput.click());
203
+ fileInput.addEventListener('change', (e) => {
204
+ const files = Array.from(fileInput.files || []);
199
205
  this.state.files = files;
200
206
  this._updateFileList();
201
207
  this._clearError();
@@ -210,7 +216,7 @@ export class FileUpload extends BaseComponent {
210
216
  }
211
217
  });
212
218
  this._wireStandardEvents(wrapper);
213
- inputEl.addEventListener('blur', () => {
219
+ fileInput.addEventListener('blur', () => {
214
220
  if (this._hasBeenValidated) {
215
221
  this.validate();
216
222
  }
@@ -215,8 +215,7 @@ export class FileUpload extends BaseComponent<FileUploadState> {
215
215
 
216
216
  render(targetId?: string | HTMLElement | BaseComponent<any>): this {
217
217
  const container = this._setupContainer(targetId);
218
-
219
- const { icon, style, class: className } = this.state;
218
+ const { label, accept, multiple, icon, style, class: className } = this.state;
220
219
 
221
220
  const wrapper = document.createElement('div');
222
221
  wrapper.className = 'jux-input jux-fileupload';
@@ -228,9 +227,16 @@ export class FileUpload extends BaseComponent<FileUploadState> {
228
227
  wrapper.appendChild(this._renderLabel());
229
228
  }
230
229
 
231
- const inputEl = this._buildInputElement() as HTMLInputElement;
232
- this._inputElement = inputEl;
233
- wrapper.appendChild(inputEl);
230
+ // File input
231
+ const fileInput = document.createElement('input');
232
+ fileInput.type = 'file';
233
+ fileInput.id = `${this._id}-input`;
234
+ fileInput.style.display = 'none';
235
+ fileInput.multiple = multiple;
236
+ fileInput.accept = accept;
237
+
238
+ this._inputElement = fileInput;
239
+ wrapper.appendChild(fileInput);
234
240
 
235
241
  const buttonContainer = document.createElement('div');
236
242
  buttonContainer.className = 'jux-fileupload-button-container';
@@ -258,10 +264,10 @@ export class FileUpload extends BaseComponent<FileUploadState> {
258
264
 
259
265
  wrapper.appendChild(this._renderError());
260
266
 
261
- button.addEventListener('click', () => inputEl.click());
267
+ button.addEventListener('click', () => fileInput.click());
262
268
 
263
- inputEl.addEventListener('change', (e) => {
264
- const files = Array.from(inputEl.files || []);
269
+ fileInput.addEventListener('change', (e) => {
270
+ const files = Array.from(fileInput.files || []);
265
271
  this.state.files = files;
266
272
  this._updateFileList();
267
273
  this._clearError();
@@ -280,7 +286,7 @@ export class FileUpload extends BaseComponent<FileUploadState> {
280
286
 
281
287
  this._wireStandardEvents(wrapper);
282
288
 
283
- inputEl.addEventListener('blur', () => {
289
+ fileInput.addEventListener('blur', () => {
284
290
  if (this._hasBeenValidated) {
285
291
  this.validate();
286
292
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "juxscript",
3
- "version": "1.1.167",
3
+ "version": "1.1.168",
4
4
  "type": "module",
5
5
  "description": "A JavaScript UX authorship platform",
6
6
  "main": "index.js",