@sankhyalabs/sankhyablocks 1.1.22 → 1.1.25
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/cjs/ApplicationUtils-05b74ee9.js +39 -0
- package/dist/cjs/AssetsUtils-7e3c38f9.js +24 -0
- package/dist/cjs/CSSVarsUtils-75ca9c64.js +19 -0
- package/dist/cjs/ez-action-chip.cjs.entry.js +27 -0
- package/dist/cjs/ez-application.cjs.entry.js +26 -0
- package/dist/cjs/ez-button_4.cjs.entry.js +660 -0
- package/dist/cjs/ez-calendar.cjs.entry.js +223 -0
- package/dist/cjs/ez-collapsible-box.cjs.entry.js +47 -0
- package/dist/cjs/ez-combo-box.cjs.entry.js +278 -0
- package/dist/cjs/ez-date-input.cjs.entry.js +102 -0
- package/dist/cjs/ez-date-time-input.cjs.entry.js +145 -0
- package/dist/cjs/ez-dialog.cjs.entry.js +89 -0
- package/dist/cjs/ez-form.cjs.entry.js +463 -0
- package/dist/cjs/ez-grid.cjs.entry.js +647 -0
- package/dist/cjs/ez-icon.cjs.entry.js +41 -0
- package/dist/cjs/ez-label-chip.cjs.entry.js +104 -0
- package/dist/cjs/ez-modal_2.cjs.entry.js +316 -0
- package/dist/cjs/ez-number-input.cjs.entry.js +86 -0
- package/dist/cjs/ez-popover.cjs.entry.js +120 -0
- package/dist/cjs/ez-popup.cjs.entry.js +48 -0
- package/dist/cjs/ez-search.cjs.entry.js +64 -0
- package/dist/cjs/ez-tabselector.cjs.entry.js +198 -0
- package/dist/cjs/ez-text-area.cjs.entry.js +114 -0
- package/dist/cjs/ez-text-input.cjs.entry.js +201 -0
- package/dist/cjs/ez-time-input.cjs.entry.js +118 -0
- package/dist/cjs/ez-toast.cjs.entry.js +44 -0
- package/dist/cjs/ez-upload.cjs.entry.js +356 -0
- package/dist/cjs/index-682c98b2.js +1771 -0
- package/dist/cjs/loader.cjs.js +3 -3
- package/dist/cjs/sankhyablocks.cjs.js +3 -3
- package/dist/cjs/snk-application.cjs.entry.js +319 -1275
- package/dist/cjs/test-du.cjs.entry.js +76 -0
- package/dist/collection/collection-manifest.json +37 -2
- package/dist/collection/components/snk-application/snk-application.js +8 -4
- package/dist/collection/lib/http/data-fetcher/fetchers/dataunit-fetcher.js +16 -9
- package/dist/{collection/temp → components}/ApplicationUtils.js +37 -31
- package/dist/components/AssetsUtils.js +22 -0
- package/dist/components/CSSVarsUtils.js +17 -0
- package/dist/components/ez-action-chip.js +44 -0
- package/dist/components/ez-application.js +39 -0
- package/dist/components/ez-button.js +6 -0
- package/dist/components/ez-button2.js +105 -0
- package/dist/components/ez-calendar.js +6 -0
- package/dist/components/ez-calendar2.js +242 -0
- package/dist/components/ez-check.js +6 -0
- package/dist/components/ez-check2.js +94 -0
- package/dist/components/ez-collapsible-box.js +67 -0
- package/dist/components/ez-combo-box.js +6 -0
- package/dist/components/ez-combo-box2.js +311 -0
- package/dist/components/ez-date-input.js +135 -0
- package/dist/components/ez-date-time-input.js +179 -0
- package/dist/components/ez-dialog.js +124 -0
- package/dist/components/ez-form.js +6 -0
- package/dist/components/ez-form2.js +485 -0
- package/dist/components/ez-grid.js +738 -0
- package/dist/components/ez-icon.js +6 -0
- package/dist/components/ez-icon2.js +56 -0
- package/dist/components/ez-label-chip.js +125 -0
- package/dist/components/ez-list.js +6 -0
- package/dist/components/ez-list2.js +523 -0
- package/dist/components/ez-modal.js +6 -0
- package/dist/components/ez-modal2.js +82 -0
- package/dist/components/ez-number-input.js +115 -0
- package/dist/components/ez-popover.js +145 -0
- package/dist/components/ez-popup.js +67 -0
- package/dist/components/ez-search.js +100 -0
- package/dist/components/ez-tabselector.js +6 -0
- package/dist/components/ez-tabselector2.js +213 -0
- package/dist/components/ez-text-area.js +137 -0
- package/dist/components/ez-text-input.js +6 -0
- package/dist/components/ez-text-input2.js +223 -0
- package/dist/components/ez-time-input.js +153 -0
- package/dist/components/ez-toast.js +64 -0
- package/dist/components/ez-upload.js +382 -0
- package/dist/components/grid-config.js +6 -0
- package/dist/components/grid-config2.js +318 -0
- package/dist/components/select-box.js +6 -0
- package/dist/components/select-box2.js +47 -0
- package/dist/components/snk-application.js +310 -1266
- package/dist/components/test-du.js +101 -0
- package/dist/esm/ApplicationUtils-e0b6d857.js +37 -0
- package/dist/esm/AssetsUtils-6e6624dc.js +22 -0
- package/dist/esm/CSSVarsUtils-0787c3f3.js +17 -0
- package/dist/esm/ez-action-chip.entry.js +23 -0
- package/dist/esm/ez-application.entry.js +22 -0
- package/dist/esm/ez-button_4.entry.js +653 -0
- package/dist/esm/ez-calendar.entry.js +219 -0
- package/dist/esm/ez-collapsible-box.entry.js +43 -0
- package/dist/esm/ez-combo-box.entry.js +274 -0
- package/dist/esm/ez-date-input.entry.js +98 -0
- package/dist/esm/ez-date-time-input.entry.js +141 -0
- package/dist/esm/ez-dialog.entry.js +85 -0
- package/dist/esm/ez-form.entry.js +459 -0
- package/dist/esm/ez-grid.entry.js +643 -0
- package/dist/esm/ez-icon.entry.js +37 -0
- package/dist/esm/ez-label-chip.entry.js +100 -0
- package/dist/esm/ez-modal_2.entry.js +311 -0
- package/dist/esm/ez-number-input.entry.js +82 -0
- package/dist/esm/ez-popover.entry.js +116 -0
- package/dist/esm/ez-popup.entry.js +44 -0
- package/dist/esm/ez-search.entry.js +60 -0
- package/dist/esm/ez-tabselector.entry.js +194 -0
- package/dist/esm/ez-text-area.entry.js +110 -0
- package/dist/esm/ez-text-input.entry.js +197 -0
- package/dist/esm/ez-time-input.entry.js +114 -0
- package/dist/esm/ez-toast.entry.js +40 -0
- package/dist/esm/ez-upload.entry.js +352 -0
- package/dist/esm/index-35088a3f.js +1740 -0
- package/dist/esm/loader.js +3 -3
- package/dist/esm/sankhyablocks.js +3 -3
- package/dist/esm/snk-application.entry.js +311 -1267
- package/dist/esm/test-du.entry.js +72 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-action-chip/ez-action-chip.css +67 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-application/ez-application.css +3 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-button/ez-button.css +180 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-calendar/ez-calendar.css +319 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-check/ez-check.css +327 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-collapsible-box/ez-collapsible-box.css +162 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-combo-box/ez-combo-box.css +217 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-date-input/ez-date-input.css +49 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-date-time-input/ez-date-time-input.css +44 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-dialog/ez-dialog.css +527 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-form/ez-form.css +5 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-grid/ez-grid.css +31 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-grid/subcomponents/gridconfig/grid-config.css +129 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-grid/subcomponents/select-box/select-box.css +10 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-icon/ez-icon.css +176 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-label-chip/ez-label-chip.css +139 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-list/ez-list.css +335 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-modal/ez-modal.css +358 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-number-input/ez-number-input.css +4 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-popover/ez-popover.css +44 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-popup/ez-popup.css +405 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-search/ez-search.css +3 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-tabselector/ez-tabselector.css +138 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-text-area/ez-text-area.css +165 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-text-input/ez-text-input.css +196 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-time-input/ez-time-input.css +10 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-toast/ez-toast.css +127 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/ez-upload/ez-upload.css +568 -0
- package/dist/node_modules/@sankhyalabs/ezui/dist/collection/components/test-du/test-du.css +3 -0
- package/dist/sankhyablocks/p-0183d259.entry.js +1 -0
- package/dist/sankhyablocks/p-01f23a70.entry.js +1 -0
- package/dist/sankhyablocks/p-07c32f68.entry.js +1 -0
- package/dist/sankhyablocks/p-0f90499d.entry.js +1 -0
- package/dist/sankhyablocks/p-105724a3.entry.js +1 -0
- package/dist/sankhyablocks/p-2ac02d48.entry.js +1 -0
- package/dist/sankhyablocks/p-35364a97.entry.js +1 -0
- package/dist/sankhyablocks/p-3f6aa9a7.entry.js +1 -0
- package/dist/sankhyablocks/p-5f9af495.entry.js +1 -0
- package/dist/sankhyablocks/p-60967cf0.js +1 -0
- package/dist/sankhyablocks/p-6ce33b60.entry.js +57 -0
- package/dist/sankhyablocks/p-70ad6c16.entry.js +1 -0
- package/dist/sankhyablocks/p-710bfffe.entry.js +1 -0
- package/dist/sankhyablocks/p-735440c1.entry.js +1 -0
- package/dist/sankhyablocks/p-811b4b9d.js +1 -0
- package/dist/sankhyablocks/p-813fe4f7.js +1 -0
- package/dist/sankhyablocks/p-85a9446b.js +2 -0
- package/dist/sankhyablocks/p-89a1100f.entry.js +1 -0
- package/dist/sankhyablocks/p-8b543003.entry.js +1 -0
- package/dist/sankhyablocks/p-9750632b.entry.js +1 -0
- package/dist/sankhyablocks/p-a96272f7.entry.js +1 -0
- package/dist/sankhyablocks/p-ac8842e5.entry.js +1 -0
- package/dist/sankhyablocks/p-ba64cc41.entry.js +1 -0
- package/dist/sankhyablocks/p-c1ede043.entry.js +1 -0
- package/dist/sankhyablocks/p-d90ebb85.entry.js +1 -0
- package/dist/sankhyablocks/p-e17dfaae.entry.js +1 -0
- package/dist/sankhyablocks/p-e5355a29.entry.js +1 -0
- package/dist/sankhyablocks/p-ef04b633.entry.js +1 -0
- package/dist/sankhyablocks/p-f6db07fb.entry.js +1 -0
- package/dist/sankhyablocks/p-fcd9bd92.entry.js +1 -0
- package/dist/sankhyablocks/sankhyablocks.esm.js +1 -1
- package/dist/types/components/snk-application/snk-application.d.ts +1 -1
- package/dist/types/components.d.ts +7 -3
- package/dist/types/lib/http/data-fetcher/fetchers/dataunit-fetcher.d.ts +1 -0
- package/package.json +12 -7
- package/react/components.d.ts +29 -0
- package/react/components.js +29 -0
- package/react/components.js.map +1 -1
- package/dist/cjs/index-20a7d705.js +0 -733
- package/dist/esm/index-8d3572c4.js +0 -707
- package/dist/sankhyablocks/p-5fa264b9.js +0 -1
- package/dist/sankhyablocks/p-fe95f2c4.entry.js +0 -57
- package/dist/types/temp/ApplicationUtils.d.ts +0 -7
|
@@ -0,0 +1,114 @@
|
|
|
1
|
+
import { r as registerInstance, h, H as Host, g as getElement } from './index-35088a3f.js';
|
|
2
|
+
import { MaskFormatter, TimeFormatter, NumberUtils } from '@sankhyalabs/core';
|
|
3
|
+
import { C as CSSVarsUtils } from './CSSVarsUtils-0787c3f3.js';
|
|
4
|
+
import { g as getSpritePath } from './AssetsUtils-6e6624dc.js';
|
|
5
|
+
|
|
6
|
+
const ezTimeInputCss = ":host{display:flex;flex-wrap:wrap;position:relative;width:100%}";
|
|
7
|
+
|
|
8
|
+
const EzTimeInput = class {
|
|
9
|
+
constructor(hostRef) {
|
|
10
|
+
registerInstance(this, hostRef);
|
|
11
|
+
/**
|
|
12
|
+
* Deixa o campo disponível ou não para digitação.
|
|
13
|
+
*/
|
|
14
|
+
this.enabled = true;
|
|
15
|
+
/**
|
|
16
|
+
* Define se o componente irá ou não considerar os segundos
|
|
17
|
+
*/
|
|
18
|
+
this.showSeconds = false;
|
|
19
|
+
}
|
|
20
|
+
prepareMask() {
|
|
21
|
+
if (this.showSeconds) {
|
|
22
|
+
if (this._maskFormatter == undefined) {
|
|
23
|
+
this._maskFormatter = new MaskFormatter("##:##:##");
|
|
24
|
+
}
|
|
25
|
+
else {
|
|
26
|
+
this._maskFormatter.mask = "##:##:##";
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
else {
|
|
30
|
+
if (this._maskFormatter == undefined) {
|
|
31
|
+
this._maskFormatter = new MaskFormatter("##:##");
|
|
32
|
+
}
|
|
33
|
+
else {
|
|
34
|
+
this._maskFormatter.mask = "##:##";
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
onValueChanged() {
|
|
39
|
+
if (this.value === NaN) {
|
|
40
|
+
this.value = undefined;
|
|
41
|
+
this.handleFocusout();
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
//---------------------------------------------
|
|
45
|
+
// Public methods
|
|
46
|
+
//---------------------------------------------
|
|
47
|
+
/**
|
|
48
|
+
* Faz o foco no componente de input
|
|
49
|
+
*/
|
|
50
|
+
async setFocus() {
|
|
51
|
+
this._inputElem.focus();
|
|
52
|
+
}
|
|
53
|
+
/**
|
|
54
|
+
* Remove o foco no componente de input
|
|
55
|
+
*/
|
|
56
|
+
async setBlur() {
|
|
57
|
+
this._inputElem.blur();
|
|
58
|
+
}
|
|
59
|
+
//---------------------------------------------
|
|
60
|
+
// Event handlers
|
|
61
|
+
//---------------------------------------------
|
|
62
|
+
handleFocusout() {
|
|
63
|
+
this.errorMessage = "";
|
|
64
|
+
this.prepareValue(this.viewValue);
|
|
65
|
+
if (!TimeFormatter.validateTime(this.viewValue, this.showSeconds)) {
|
|
66
|
+
this.clearField();
|
|
67
|
+
this.errorMessage = "Favor inserir um horário válido.";
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
prepareValue(value) {
|
|
71
|
+
try {
|
|
72
|
+
this.viewValue = TimeFormatter.prepareValue(value, this.showSeconds);
|
|
73
|
+
}
|
|
74
|
+
catch (e) {
|
|
75
|
+
this.clearField();
|
|
76
|
+
this.errorMessage = e.message;
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
clearField() {
|
|
80
|
+
this.viewValue = this.value = undefined;
|
|
81
|
+
}
|
|
82
|
+
handleChange() {
|
|
83
|
+
this.viewValue = this._inputElem.value;
|
|
84
|
+
this.value = NumberUtils.stringToNumber(this.viewValue.replace(/\D/g, ""));
|
|
85
|
+
}
|
|
86
|
+
//---------------------------------------------
|
|
87
|
+
// Lifecycle web component
|
|
88
|
+
//---------------------------------------------
|
|
89
|
+
componentDidLoad() {
|
|
90
|
+
this.onValueChanged();
|
|
91
|
+
CSSVarsUtils.applyVarsTextInput(this._elem, this._inputElem);
|
|
92
|
+
}
|
|
93
|
+
componentWillLoad() {
|
|
94
|
+
this.prepareMask();
|
|
95
|
+
if (this.value) {
|
|
96
|
+
this.prepareValue(this.value.toString());
|
|
97
|
+
}
|
|
98
|
+
else if (this.viewValue) {
|
|
99
|
+
this.prepareValue(this.viewValue);
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
render() {
|
|
103
|
+
return (h(Host, null, h("ez-text-input", { ref: (el) => this._inputElem = el, value: this.viewValue, enabled: this.enabled, label: this.label, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); }, errorMessage: this.errorMessage }, h("ez-icon", { slot: "leftIcon", href: getSpritePath("timer-outline") }))));
|
|
104
|
+
}
|
|
105
|
+
static get assetsDirs() { return ["../assets"]; }
|
|
106
|
+
get _elem() { return getElement(this); }
|
|
107
|
+
static get watchers() { return {
|
|
108
|
+
"showSeconds": ["prepareMask"],
|
|
109
|
+
"value": ["onValueChanged"]
|
|
110
|
+
}; }
|
|
111
|
+
};
|
|
112
|
+
EzTimeInput.style = ezTimeInputCss;
|
|
113
|
+
|
|
114
|
+
export { EzTimeInput as ez_time_input };
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { r as registerInstance, h } from './index-35088a3f.js';
|
|
2
|
+
|
|
3
|
+
const ezToastCss = ":host{--ez-toast__btn__close__image:url('data:image/svg+xml;utf8,<svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" xmlns=\"http://www.w3.org/2000/svg%22%3E<path d=\"M 7.0060773,5.995511 11.461972,1.5397722 c 0.132856,-0.1328413 0.207547,-0.3130253 0.207547,-0.5009046 0,-0.18786999 -0.07469,-0.3680541 -0.207547,-0.5009048 -0.132857,-0.13284126 -0.31302,-0.20748126 -0.500927,-0.20748126 -0.187812,0 -0.36807,0.07464 -0.500926,0.20748126 L 6.0042244,4.9937015 1.5482921,0.5379628 C 1.4154357,0.40512154 1.2352533,0.33048154 1.0473657,0.33048154 c -0.18787813,0 -0.36807,0.07464 -0.50092647,0.20748126 -0.13285646,0.1328507 -0.20749026,0.31303481 -0.20749026,0.5009048 0,0.1878793 0.0746338,0.3680633 0.20749026,0.5009046 L 5.0023715,5.995511 0.54643923,10.452213 c -0.0676086,0.06534 -0.12151598,0.14352 -0.15859681,0.229916 -0.0370714,0.08639 -0.0565645,0.1794 -0.0573369,0.27335 -7.724e-4,0.09404 0.0171873,0.187331 0.0528423,0.274293 0.0356455,0.08705 0.0882688,0.166087 0.15479148,0.23256 0.0665321,0.06648 0.14562277,0.11897 0.2326735,0.154567 0.0870507,0.0356 0.18031463,0.05344 0.2743433,0.05259 0.094029,-8.5e-4 0.1869528,-0.02049 0.2733331,-0.0576 0.08639,-0.0372 0.1645078,-0.09121 0.2298029,-0.158817 L 6.0042244,6.9973204 10.460119,11.453078 c 0.132856,0.132851 0.313114,0.207444 0.500926,0.207444 0.187907,0 0.36807,-0.07459 0.500927,-0.207444 0.132856,-0.13285 0.207547,-0.313006 0.207547,-0.500904 0,-0.187898 -0.07469,-0.368054 -0.207547,-0.500905 z\"/></svg>');--ez-toast__container-z-index:var(--more-visible, 2);--ez-toast__container--background-color:var(--color--secondary, #383c45);--ez-toast__icon--padding-left:var(--space--small, 6px)}.toast__container{position:fixed;display:flex;bottom:100px;z-index:var(--ez-toast__container-z-index);left:100px;width:280px;box-sizing:border-box;background-color:var(--ez-toast__container--background-color);border-radius:6px;align-items:center;padding:12px;visibility:hidden}.message__container{font-family:\"Sora\", \"Algerian\";text-shadow:0 0 0 #353535, 0 0 1px transparent;color:#FFFFFF;font-size:14px;width:90%;overflow:hidden;word-break:break-all;height:auto;-webkit-box-orient:vertical;-webkit-line-clamp:4;display:-webkit-box;text-overflow:ellipsis}.message__conteiner--icon{padding-left:var(--ez-toast__icon--padding-left);width:80%}.btn-close{margin-top:3px;display:flex;justify-content:flex-end;align-self:flex-start;padding:0;outline:none;width:10%;border:none;background-color:unset;cursor:pointer}.btn-close::after{content:'';display:flex;background-color:#FFFFFF;width:12px;height:12px;-webkit-mask-image:var(--ez-toast__btn__close__image);mask-image:var(--ez-toast__btn__close__image)}.toast__container--oppened{animation:fadein 0.5s, fadeout 0.5s 3s;visibility:visible}@-webkit-keyframes fadein{from{left:-100px;opacity:0}to{left:100px;opacity:1}}@keyframes fadein{from{left:-100px;opacity:0}to{left:100px;opacity:1}}@-webkit-keyframes fadeout{from{left:100px;opacity:1}to{bottom:0;opacity:0}}@keyframes fadeout{from{left:100px;opacity:1}to{bottom:0;opacity:0}}";
|
|
4
|
+
|
|
5
|
+
const EzToast = class {
|
|
6
|
+
constructor(hostRef) {
|
|
7
|
+
registerInstance(this, hostRef);
|
|
8
|
+
/**
|
|
9
|
+
* Controla o tempo de exibição do componente em milissegundos.
|
|
10
|
+
*/
|
|
11
|
+
this.fadeTime = 5000;
|
|
12
|
+
/**
|
|
13
|
+
* Adiciona ícone de check no componente.
|
|
14
|
+
*/
|
|
15
|
+
this.useIcon = false;
|
|
16
|
+
/**
|
|
17
|
+
* Controla o uso do icone de fechar o toast.
|
|
18
|
+
*/
|
|
19
|
+
this.canClose = true;
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* Exibe o componente na tela.
|
|
23
|
+
*/
|
|
24
|
+
async show() {
|
|
25
|
+
this.container.classList.add("toast__container--oppened");
|
|
26
|
+
this.container.style.animation = `fadein 0.5s, fadeout 0.5s ${this.fadeTime / 1000}s`;
|
|
27
|
+
setTimeout(() => {
|
|
28
|
+
this.container.classList.remove("toast__container--oppened");
|
|
29
|
+
this.container.style.animation = `none`;
|
|
30
|
+
}, this.fadeTime + 400);
|
|
31
|
+
}
|
|
32
|
+
render() {
|
|
33
|
+
return (h("div", { ref: (el) => this.container = el, class: "toast__container" }, this.useIcon &&
|
|
34
|
+
h("slot", { name: "icon" }), h("div", { class: this.useIcon ? "message__container message__conteiner--icon" : "message__container", title: this.message, innerHTML: this.message }), this.canClose &&
|
|
35
|
+
h("button", { class: "btn-close", onClick: () => { this.container.classList.remove("toast__container--oppened"); this.container.style.animation = `none`; } })));
|
|
36
|
+
}
|
|
37
|
+
};
|
|
38
|
+
EzToast.style = ezToastCss;
|
|
39
|
+
|
|
40
|
+
export { EzToast as ez_toast };
|
|
@@ -0,0 +1,352 @@
|
|
|
1
|
+
import { r as registerInstance, c as createEvent, f as forceUpdate, h, g as getElement } from './index-35088a3f.js';
|
|
2
|
+
import { A as ApplicationUtils } from './ApplicationUtils-e0b6d857.js';
|
|
3
|
+
|
|
4
|
+
class RemoteFile {
|
|
5
|
+
constructor(file) {
|
|
6
|
+
this.file = file;
|
|
7
|
+
this.size = file.size;
|
|
8
|
+
this.name = file.name;
|
|
9
|
+
}
|
|
10
|
+
abortUpload() {
|
|
11
|
+
if (this._uploadingXhr) {
|
|
12
|
+
this._aborted = true;
|
|
13
|
+
this._uploadingXhr.abort();
|
|
14
|
+
this._uploadingXhr = undefined;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
isUploading() {
|
|
18
|
+
return this._uploadingXhr !== undefined;
|
|
19
|
+
}
|
|
20
|
+
async upload(server, headers, updateCallBack) {
|
|
21
|
+
return new Promise((resolve, reject) => {
|
|
22
|
+
const xhr = new XMLHttpRequest();
|
|
23
|
+
this._uploadingXhr = xhr;
|
|
24
|
+
this._aborted = false;
|
|
25
|
+
this.progress = 0;
|
|
26
|
+
xhr.upload.onprogress = (e) => {
|
|
27
|
+
const loaded = e.loaded;
|
|
28
|
+
const total = e.total;
|
|
29
|
+
this.progress = ~~((loaded / total) * 100);
|
|
30
|
+
updateCallBack(this, loaded, total);
|
|
31
|
+
};
|
|
32
|
+
xhr.onreadystatechange = () => {
|
|
33
|
+
if (xhr.readyState == 4) {
|
|
34
|
+
this._uploadingXhr = undefined;
|
|
35
|
+
const status = xhr.status;
|
|
36
|
+
if (!this._aborted) {
|
|
37
|
+
if (status === 0) {
|
|
38
|
+
reject("Servidor indisponível");
|
|
39
|
+
}
|
|
40
|
+
else if (status >= 500) {
|
|
41
|
+
reject("Erro inesperado no servidor");
|
|
42
|
+
}
|
|
43
|
+
else if (status >= 400) {
|
|
44
|
+
reject("Operação não permitida");
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
const response = xhr.response;
|
|
48
|
+
if (response) {
|
|
49
|
+
resolve(JSON.parse(response));
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
};
|
|
53
|
+
xhr.ontimeout = () => {
|
|
54
|
+
reject("Tempo limite de transferência atingido.");
|
|
55
|
+
};
|
|
56
|
+
const formData = new FormData();
|
|
57
|
+
formData.append("ARQUIVO", this.file, this.file.name);
|
|
58
|
+
xhr.open("POST", server, true);
|
|
59
|
+
if (headers) {
|
|
60
|
+
headers.forEach((value, key) => xhr.setRequestHeader(key, value));
|
|
61
|
+
}
|
|
62
|
+
xhr.send(formData);
|
|
63
|
+
});
|
|
64
|
+
}
|
|
65
|
+
async delete(item, server, headers) {
|
|
66
|
+
return new Promise((resolve, reject) => {
|
|
67
|
+
const xhr = new XMLHttpRequest();
|
|
68
|
+
xhr.onreadystatechange = () => {
|
|
69
|
+
if (xhr.readyState == 4) {
|
|
70
|
+
if (xhr.status === 0) {
|
|
71
|
+
reject("Servidor indisponível");
|
|
72
|
+
}
|
|
73
|
+
else if (xhr.status >= 500) {
|
|
74
|
+
reject("Erro inesperado no servidor");
|
|
75
|
+
}
|
|
76
|
+
else if (xhr.status >= 400) {
|
|
77
|
+
reject("Operação não permitida");
|
|
78
|
+
}
|
|
79
|
+
resolve(true);
|
|
80
|
+
}
|
|
81
|
+
};
|
|
82
|
+
xhr.ontimeout = () => {
|
|
83
|
+
reject("Tempo limite de remoção atingido.");
|
|
84
|
+
};
|
|
85
|
+
xhr.open("DELETE", server, true);
|
|
86
|
+
if (headers) {
|
|
87
|
+
headers.forEach((value, key) => xhr.setRequestHeader(key, value));
|
|
88
|
+
}
|
|
89
|
+
xhr.send(JSON.stringify(item));
|
|
90
|
+
});
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
const ezUploadCss = ":host{--ez-upload--height:42px;--ez-upload--width:100%;--ez-upload__icon--width:48px;--ez-upload__container--background-color:var(--background--medium, #d2dce9);--ez-upload__color--primary:var(--color--primary, #008561);--ez-upload--padding--extra-small:var(--space--extra-small, 3px);--ez-upload--padding--small:var(--space--small, 6px);--ez-upload--padding--medium:var(--space--medium, 12px);--ez-upload--padding--large:var(--space--large, 24px);--ez-upload__border--color:var(--color-strokes, #DCE0E8);--ez-upload--text-shadow:var(--text-shadow, 0 0 0 #353535, 0 0 1px transparent);--ez-upload--text--primary:var(--text-primary, #626e82);--ez-upload--font-size:var(--text--medium, 14px);--ez-upload--font-family:var(--font-pattern, Arial);--ez-upload--font-weight:var(--text-weight--large, 500);--ez-upload__btn__cancel-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"8x\" width=\"8px\"><path d=\"M 8,0.8 7.2,0 4,3.2 0.8,0 0,0.8 3.2,4 0,7.2 0.8,8 4,4.8 7.2,8 8,7.2 4.8,4 Z\"/></svg>');--ez-upload__file-icon-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"11x\" width=\"9px\"><path d=\"M 1.2272719,8.4999999 V 2.75 c 0,-1.1045695 1.4652499,-2 3.2727273,-2 1.8074777,0 3.2727281,0.8954305 3.2727281,2 V 8.9999999 C 7.7727273,9.690356 6.8569456,10.25 5.7272719,10.25 4.5975985,10.25 3.6818174,9.690356 3.6818174,8.9999999 V 3.75 c 0,-0.2761425 0.3663125,-0.5 0.8181818,-0.5 0.4518694,0 0.8181818,0.2238575 0.8181818,0.5 V 8.4999999 H 6.5454537 V 3.75 C 6.5454537,3.059644 5.6296725,2.5 4.4999992,2.5 3.3703258,2.5 2.4545446,3.059644 2.4545446,3.75 V 8.9999999 C 2.4545446,10.10457 3.9197945,11 5.7272719,11 7.5347496,11 9,10.10457 9,8.9999999 V 2.75 C 9,1.231217 6.9852809,0 4.4999992,0 2.0147181,5e-7 0,1.231217 0,2.75 v 5.7499999 z\"/></svg>');display:flex;flex-wrap:wrap;position:relative;font-family:var(--ez-upload--font-family);font-size:var(--ez-upload--font-size);width:var(--ez-upload--width);font-weight:var(--ez-upload--font-weight)}.iu{display:flex;flex-wrap:wrap;background-color:var(--ez-upload__container--background-color);padding:var(--ez-upload--padding--small);width:100%;border-radius:12px;box-sizing:border-box}.iu__container{width:100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;border:2px dashed var(--ez-upload__border--color);border-radius:6px;box-sizing:border-box}.iu__footer{display:flex;flex-wrap:wrap;justify-content:flex-start;width:100%;padding:0 var(--ez-upload--padding--medium) var(--ez-upload--padding--medium) var(--ez-upload--padding--medium);box-sizing:border-box}.iu__item{display:flex;width:100%;justify-content:flex-start;align-items:center;align-self:center;padding-bottom:var(--ez-upload--padding--extra-small);box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.iu__item-label{display:flex;max-width:80%;align-self:stretch;align-items:center}.file__name{font-weight:200}.box__content{width:100%;justify-content:center;align-items:center;height:100%;border:1px dashed var(--ez-upload__border--color);border-radius:6px;box-sizing:border-box}.box__container{display:flex;flex-wrap:wrap;background-color:var(--ez-upload__container--background-color);padding:6px;width:100%;border-radius:12px}a:-webkit-any-link{color:#008561;fill:#008561;cursor:pointer;text-decoration:none}progress[value]{display:flex;width:100%;appearance:none;border:1px solid var(--ez-upload__border--color);height:12px;justify-content:flex-start;align-items:center;border-radius:3px;position:relative}progress[value]::-webkit-progress-bar{display:flex;-webkit-appearance:none;width:100%;background-color:rgb(255, 255, 255);border-radius:2px;padding:2px}progress[value]::-webkit-progress-value{display:flex;width:100%;background-color:var(--ez-upload__color--primary)}.text--center{text-align:center}.align--middle{align-self:center;align-items:center}.text{font-family:\"Sora\", \"Algerian\";text-shadow:0 0 0 #353535, 0 0 1px transparent}.text--primary{color:var(--ez-upload--text--primary);text-shadow:var(--ez-upload--text-shadow)}.text--ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.text--medium{font-size:14px}.text--small{font-size:12px}.btn-cancel{outline:none;border:none;background-color:unset;cursor:pointer}.btn-cancel::after{content:'';display:flex;background-color:var(--text--primary, #008561);width:8px;height:8px;-webkit-mask-image:var(--ez-upload__btn__cancel-image);mask-image:var(--ez-upload__btn__cancel-image)}.iu_header{display:flex;flex-direction:column;width:100%}.iu__label{padding:var(--space--small);box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--ez-upload--font-family);font-size:var(--text--extra-small);font-weight:var(--ez-upload--font-weight);color:var(--ez-upload--text--primary);text-shadow:var(--ez-upload--text-shadow)}.iu__file-icon{outline:none;border:none;background-color:unset;cursor:pointer}.iu__file-icon:disabled{cursor:unset}.iu__file-icon::after{content:'';display:flex;background-color:var(--text--primary, #626e82);width:9px;height:11px;-webkit-mask-image:var(--ez-upload__file-icon-image);mask-image:var(--ez-upload__file-icon-image)}.iu__file-icon:disabled::after{background-color:var(--text--disable, #AFB6C0)}.iu__icon-label{justify-content:center;display:flex;cursor:pointer;padding:var(--ez-upload--padding--large) 0px;box-sizing:border-box}.background--disabled{background-color:var(--color--disable-secondary, #F2F5F8)}.text--disabled{color:var(--text--disable, #AFB6C0)}.mouse-pointer--disabled{cursor:unset}.appearanceNone{width:0px;height:0px}.row{width:100%;display:flex;flex-wrap:wrap}.col{display:flex;flex-wrap:wrap;align-self:flex-start;box-sizing:border-box}.col--stretch{align-self:stretch}.col--undefined{width:unset}.col--nowrap{flex-wrap:nowrap}@media screen and (min-width: 320px){.col--sd-1{width:8.33333%}.col--sd-2{width:16.66667%}.col--sd-3{width:25%}.col--sd-4{width:33.33333%}.col--sd-5{width:41.66667%}.col--sd-6{width:50%}.col--sd-7{width:58.33333%}.col--sd-8{width:66.66667%}.col--sd-9{width:75%}.col--sd-10{width:83.33333%}.col--sd-11{width:91.66667%}.col--sd-12{width:100%}}@media screen and (min-width: 480px){.col--pn-1{width:8.33333%}.col--pn-2{width:16.66667%}.col--pn-3{width:25%}.col--pn-4{width:33.33333%}.col--pn-5{width:41.66667%}.col--pn-6{width:50%}.col--pn-7{width:58.33333%}.col--pn-8{width:66.66667%}.col--pn-9{width:75%}.col--pn-10{width:83.33333%}.col--pn-11{width:91.66667%}.col--pn-12{width:100%}}@media screen and (min-width: 768px){.col--tb-1{width:8.33333%}.col--tb-2{width:16.66667%}.col--tb-3{width:25%}.col--tb-4{width:33.33333%}.col--tb-5{width:41.66667%}.col--tb-6{width:50%}.col--tb-7{width:58.33333%}.col--tb-8{width:66.66667%}.col--tb-9{width:75%}.col--tb-10{width:83.33333%}.col--tb-11{width:91.66667%}.col--tb-12{width:100%}}@media screen and (min-width: 992px){.col--md-1{width:8.33333%}.col--md-2{width:16.66667%}.col--md-3{width:25%}.col--md-4{width:33.33333%}.col--md-5{width:41.66667%}.col--md-6{width:50%}.col--md-7{width:58.33333%}.col--md-8{width:66.66667%}.col--md-9{width:75%}.col--md-10{width:83.33333%}.col--md-11{width:91.66667%}.col--md-12{width:100%}}@media screen and (min-width: 1200px){.col--ld-1{width:8.33333%}.col--ld-2{width:16.66667%}.col--ld-3{width:25%}.col--ld-4{width:33.33333%}.col--ld-5{width:41.66667%}.col--ld-6{width:50%}.col--ld-7{width:58.33333%}.col--ld-8{width:66.66667%}.col--ld-9{width:75%}.col--ld-10{width:83.33333%}.col--ld-11{width:91.66667%}.col--ld-12{width:100%}}";
|
|
95
|
+
|
|
96
|
+
const EzUpload = class {
|
|
97
|
+
constructor(hostRef) {
|
|
98
|
+
registerInstance(this, hostRef);
|
|
99
|
+
this.ezChange = createEvent(this, "ezChange", 7);
|
|
100
|
+
this._filePointers = new Map();
|
|
101
|
+
/**
|
|
102
|
+
* Deixa o campo disponível ou não para digitação.
|
|
103
|
+
*/
|
|
104
|
+
this.enabled = true;
|
|
105
|
+
}
|
|
106
|
+
changeValue(newValue) {
|
|
107
|
+
if (newValue !== this._updatingValue) {
|
|
108
|
+
this._filePointers.forEach(f => {
|
|
109
|
+
if (this.isRemoteFile(f)) {
|
|
110
|
+
f.abortUpload();
|
|
111
|
+
}
|
|
112
|
+
});
|
|
113
|
+
this._filePointers = new Map();
|
|
114
|
+
this.updateFilePointers();
|
|
115
|
+
}
|
|
116
|
+
this._updatingValue = undefined;
|
|
117
|
+
}
|
|
118
|
+
updateFilePointers() {
|
|
119
|
+
if (this.value) {
|
|
120
|
+
this.value.forEach(ezFile => this._filePointers.set(ezFile.name, ezFile));
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
normalizeRequestHeaders() {
|
|
124
|
+
this._requestHeaders = new Map();
|
|
125
|
+
if (typeof this.requestHeaders == "string") {
|
|
126
|
+
try {
|
|
127
|
+
this.requestHeaders = JSON.parse(this.requestHeaders);
|
|
128
|
+
}
|
|
129
|
+
catch (e) {
|
|
130
|
+
this.requestHeaders = undefined;
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
for (var key in this.requestHeaders) {
|
|
134
|
+
this._requestHeaders.set(key, this.requestHeaders[key]);
|
|
135
|
+
}
|
|
136
|
+
}
|
|
137
|
+
/**
|
|
138
|
+
* Método responsável por adicionar um ou mais arquivos ao componente.
|
|
139
|
+
*/
|
|
140
|
+
async addFiles(files) {
|
|
141
|
+
if (this.maxFiles > 0) {
|
|
142
|
+
let countDistinctFiles = this._filePointers.size;
|
|
143
|
+
files.forEach(file => {
|
|
144
|
+
if (!this._filePointers.has(file.name)) {
|
|
145
|
+
countDistinctFiles++;
|
|
146
|
+
}
|
|
147
|
+
});
|
|
148
|
+
if (countDistinctFiles > this.maxFiles) {
|
|
149
|
+
this.showError(`A quantidade máxima de arquivos é ${this.maxFiles}.`);
|
|
150
|
+
return;
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
Array.prototype.forEach.call(files, this.addFile.bind(this));
|
|
154
|
+
}
|
|
155
|
+
/**
|
|
156
|
+
* Realiza o foco no componente de upload
|
|
157
|
+
*/
|
|
158
|
+
async setFocus() {
|
|
159
|
+
this._fileInput.focus();
|
|
160
|
+
}
|
|
161
|
+
/**
|
|
162
|
+
* Remove o foco no componente de upload
|
|
163
|
+
*/
|
|
164
|
+
async setBlur() {
|
|
165
|
+
this._fileInput.blur();
|
|
166
|
+
}
|
|
167
|
+
async addFile(file) {
|
|
168
|
+
const oldFile = this._filePointers.get(file.name);
|
|
169
|
+
if (oldFile) {
|
|
170
|
+
ApplicationUtils.confirm("Substituir arquivo", `Já existe um arquivo chamado "${file.name}". Deseja substituí-lo?`)
|
|
171
|
+
.then(ok => {
|
|
172
|
+
if (ok) {
|
|
173
|
+
if (this.isRemoteFile(oldFile)) {
|
|
174
|
+
oldFile.abortUpload();
|
|
175
|
+
}
|
|
176
|
+
this.doAddFile(file);
|
|
177
|
+
}
|
|
178
|
+
});
|
|
179
|
+
}
|
|
180
|
+
else {
|
|
181
|
+
this.doAddFile(file);
|
|
182
|
+
}
|
|
183
|
+
}
|
|
184
|
+
async doAddFile(file) {
|
|
185
|
+
if (this.validateFile(file)) {
|
|
186
|
+
const uploadingFile = new RemoteFile(file);
|
|
187
|
+
this._filePointers.set(file.name, uploadingFile);
|
|
188
|
+
uploadingFile.upload(this.urlUpload, this._requestHeaders, (file) => this.updateFeedback(file))
|
|
189
|
+
.then((files) => files.forEach(ezFile => this.finishUpload(ezFile)))
|
|
190
|
+
.catch(msg => this.showError(msg));
|
|
191
|
+
forceUpdate(this);
|
|
192
|
+
}
|
|
193
|
+
}
|
|
194
|
+
finishUpload(ezFile) {
|
|
195
|
+
this._filePointers.set(ezFile.name, ezFile);
|
|
196
|
+
this.updateValue();
|
|
197
|
+
}
|
|
198
|
+
updateValue() {
|
|
199
|
+
this._updatingValue = [];
|
|
200
|
+
this._filePointers.forEach(f => {
|
|
201
|
+
if (!this.isRemoteFile(f)) {
|
|
202
|
+
this._updatingValue.push(f);
|
|
203
|
+
}
|
|
204
|
+
});
|
|
205
|
+
this.value = this._updatingValue;
|
|
206
|
+
this.ezChange.emit(this.value);
|
|
207
|
+
}
|
|
208
|
+
buildProgressId(uploading) {
|
|
209
|
+
let sanitizedName = uploading.name.replace(/[^a-z0-9_]/gi, "_");
|
|
210
|
+
return `PROGRESS_${sanitizedName}_${uploading.file.lastModified}`;
|
|
211
|
+
}
|
|
212
|
+
updateFeedback(uf) {
|
|
213
|
+
window.requestAnimationFrame(() => {
|
|
214
|
+
if (this._host) {
|
|
215
|
+
const progress = this._host.shadowRoot.querySelector("#" + this.buildProgressId(uf));
|
|
216
|
+
if (progress) {
|
|
217
|
+
progress.value = uf.progress;
|
|
218
|
+
}
|
|
219
|
+
}
|
|
220
|
+
});
|
|
221
|
+
}
|
|
222
|
+
validateFile(file) {
|
|
223
|
+
if (!this._filePointers.has(file.name) && this.maxFiles > 0 && this._filePointers.size >= this.maxFiles) {
|
|
224
|
+
this.showError(`A quantidade máxima de arquivos é ${this.maxFiles}.`);
|
|
225
|
+
return false;
|
|
226
|
+
}
|
|
227
|
+
if (file.size === 0) {
|
|
228
|
+
this.showError(`Erro de permissão: O arquivo "${file.name}" não pode ser enviado.`);
|
|
229
|
+
return false;
|
|
230
|
+
}
|
|
231
|
+
if (!this.urlUpload) {
|
|
232
|
+
this.showError("Endereço de upload não informado");
|
|
233
|
+
return false;
|
|
234
|
+
}
|
|
235
|
+
if (this.maxFileSize >= 0 && file.size > this.maxFileSize) {
|
|
236
|
+
this.showError("O tamanho máximo dos arquivos é de " + this.formatBytes(this.maxFileSize));
|
|
237
|
+
return false;
|
|
238
|
+
}
|
|
239
|
+
return true;
|
|
240
|
+
}
|
|
241
|
+
showError(message) {
|
|
242
|
+
ApplicationUtils.alert("Enviando arquivo", message);
|
|
243
|
+
}
|
|
244
|
+
formatBytes(bytes, decimals = 1) {
|
|
245
|
+
if (bytes === 0)
|
|
246
|
+
return "0 Bytes";
|
|
247
|
+
const k = 1024;
|
|
248
|
+
const dm = decimals < 0 ? 0 : decimals;
|
|
249
|
+
const sizes = ["B", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
|
|
250
|
+
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
|
251
|
+
return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
|
|
252
|
+
}
|
|
253
|
+
onFileInputChange(event) {
|
|
254
|
+
const input = event.target;
|
|
255
|
+
this.addFiles(Array.from(input.files));
|
|
256
|
+
this._fileInput.value = "";
|
|
257
|
+
}
|
|
258
|
+
isRemoteFile(item) {
|
|
259
|
+
return "file" in item;
|
|
260
|
+
}
|
|
261
|
+
removeFromList(name) {
|
|
262
|
+
this._filePointers.delete(name);
|
|
263
|
+
this.updateValue();
|
|
264
|
+
}
|
|
265
|
+
removeFile(name) {
|
|
266
|
+
const item = this._filePointers.get(name);
|
|
267
|
+
if (this.isRemoteFile(item)) {
|
|
268
|
+
item.abortUpload();
|
|
269
|
+
this.removeFromList(name);
|
|
270
|
+
}
|
|
271
|
+
else {
|
|
272
|
+
if (this.urlDelete) {
|
|
273
|
+
const uploadingFile = new RemoteFile(null);
|
|
274
|
+
this._filePointers.set(item.name, uploadingFile);
|
|
275
|
+
uploadingFile.delete(item, this.urlDelete, null)
|
|
276
|
+
.then(_ok => this.removeFromList(name))
|
|
277
|
+
.catch(msg => this.showError(msg));
|
|
278
|
+
}
|
|
279
|
+
else {
|
|
280
|
+
this.removeFromList(name);
|
|
281
|
+
}
|
|
282
|
+
}
|
|
283
|
+
}
|
|
284
|
+
openFilesDialog() {
|
|
285
|
+
if (this.enabled) {
|
|
286
|
+
this._fileInput.click();
|
|
287
|
+
}
|
|
288
|
+
}
|
|
289
|
+
componentDidLoad() {
|
|
290
|
+
if (this.enabled && this._dropZone && window.FileList && window.File) {
|
|
291
|
+
this._dropZone.addEventListener("dragover", event => {
|
|
292
|
+
event.stopPropagation();
|
|
293
|
+
event.preventDefault();
|
|
294
|
+
event.dataTransfer.dropEffect = "copy";
|
|
295
|
+
this._dropZone.style.background = "#c2dbff";
|
|
296
|
+
});
|
|
297
|
+
this._dropZone.addEventListener("drop", event => {
|
|
298
|
+
event.stopPropagation();
|
|
299
|
+
event.preventDefault();
|
|
300
|
+
this.addFiles(Array.from(event.dataTransfer.files));
|
|
301
|
+
this._dropZone.style.background = "";
|
|
302
|
+
});
|
|
303
|
+
this._dropZone.addEventListener("dragleave", _event => {
|
|
304
|
+
this._dropZone.style.background = "";
|
|
305
|
+
});
|
|
306
|
+
}
|
|
307
|
+
}
|
|
308
|
+
componentWillRender() {
|
|
309
|
+
if (this.value) {
|
|
310
|
+
if (this._filePointers.size < this.value.length) {
|
|
311
|
+
this.updateFilePointers();
|
|
312
|
+
}
|
|
313
|
+
}
|
|
314
|
+
}
|
|
315
|
+
render() {
|
|
316
|
+
return (h("div", { ref: (el) => this._dropZone = el, class: this.evalDisabledClass("iu", "background--disabled") }, h("div", { class: "iu__container", onClick: () => this.openFilesDialog() }, h("div", { class: "iu_header" }, this.label ? h("label", { class: this.evalDisabledClass("iu__label", "text--disabled"), title: this.label }, this.label) : null, h("div", { class: this.evalDisabledClass("iu__icon-label", "mouse-pointer--disabled") }, h("button", { class: "iu__file-icon", disabled: !this.enabled }), h("div", { class: this.evalDisabledClass("text text--center text--medium text--primary", "text--disabled") }, this.enabled ? "Arraste e solte ou clique para adicionar arquivos" : "Somente leitura"))), this.buildFooter()), h("input", { ref: (el) => this._fileInput = el, onChange: (ev) => this.onFileInputChange(ev), type: "file", multiple: true, class: "appearanceNone" })));
|
|
317
|
+
}
|
|
318
|
+
buildFooter() {
|
|
319
|
+
if (this._filePointers.size === 0) {
|
|
320
|
+
return null;
|
|
321
|
+
}
|
|
322
|
+
const items = [];
|
|
323
|
+
this._filePointers.forEach(item => items.push(this.buildFileItem(item)));
|
|
324
|
+
return (h("div", { class: "iu__footer" }, items));
|
|
325
|
+
}
|
|
326
|
+
buildFileItem(item) {
|
|
327
|
+
const fileName = item.name;
|
|
328
|
+
const progress = Number(item["progress"]);
|
|
329
|
+
const downloadURL = item["downloadURL"];
|
|
330
|
+
const label = `${fileName} (${this.formatBytes(item.size)})`;
|
|
331
|
+
return (h("div", { class: "iu__item", key: fileName, onClick: evt => evt.stopPropagation() }, h("div", { class: "iu__item-label modificador" }, h("div", { title: label, class: "col--stretch align--middle file__name text text--primary text--small text--ellipsis align--middle" }, downloadURL ? h("a", { href: downloadURL, download: true }, label) : label)), isNaN(progress)
|
|
332
|
+
?
|
|
333
|
+
null
|
|
334
|
+
:
|
|
335
|
+
h("div", { class: "col col--sd-4 col--stretch align--middle" }, h("progress", { id: this.buildProgressId(item), value: progress, max: "100" })), this.enabled
|
|
336
|
+
?
|
|
337
|
+
h("div", { class: "col col--stretch align--middle" }, h("button", { class: "btn-cancel ", onClick: () => this.removeFile(fileName) }))
|
|
338
|
+
:
|
|
339
|
+
null));
|
|
340
|
+
}
|
|
341
|
+
evalDisabledClass(regularClasses, disabledClass) {
|
|
342
|
+
return this.enabled ? regularClasses : `${regularClasses} ${disabledClass}`;
|
|
343
|
+
}
|
|
344
|
+
get _host() { return getElement(this); }
|
|
345
|
+
static get watchers() { return {
|
|
346
|
+
"value": ["changeValue"],
|
|
347
|
+
"requestHeaders": ["normalizeRequestHeaders"]
|
|
348
|
+
}; }
|
|
349
|
+
};
|
|
350
|
+
EzUpload.style = ezUploadCss;
|
|
351
|
+
|
|
352
|
+
export { EzUpload as ez_upload };
|