@sankhyalabs/ezui 1.1.58 → 1.1.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/cjs/ez-action-chip.cjs.entry.js +2 -27
- package/dist/cjs/{ez-button_15.cjs.entry.js → ez-button_16.cjs.entry.js} +47 -1
- package/dist/cjs/ez-label-chip.cjs.entry.js +4 -31
- package/dist/cjs/ez-modal.cjs.entry.js +1 -1
- package/dist/cjs/ezui.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/ez-action-chip/ez-action-chip.css +2 -4
- package/dist/collection/components/ez-action-chip/ez-action-chip.js +3 -28
- package/dist/collection/components/ez-form/subcomponents/structure/FieldSet.js +1 -1
- package/dist/collection/components/ez-label-chip/ez-label-chip.css +27 -8
- package/dist/collection/components/ez-label-chip/ez-label-chip.js +4 -31
- package/dist/collection/components/ez-modal/ez-modal.css +1 -0
- package/dist/collection/components/ez-upload/ez-upload.js +5 -0
- package/dist/custom-elements/index.js +13 -60
- package/dist/esm/ez-action-chip.entry.js +2 -27
- package/dist/esm/{ez-button_15.entry.js → ez-button_16.entry.js} +47 -2
- package/dist/esm/ez-label-chip.entry.js +4 -31
- package/dist/esm/ez-modal.entry.js +1 -1
- package/dist/esm/ezui.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/ezui/ezui.esm.js +1 -1
- package/dist/ezui/p-8733b276.entry.js +1 -0
- package/dist/ezui/p-88b9c3d4.entry.js +1 -0
- package/dist/ezui/p-aa94210b.entry.js +1 -0
- package/dist/ezui/p-d185d7e8.entry.js +1 -0
- package/dist/types/components/ez-action-chip/ez-action-chip.d.ts +0 -2
- package/dist/types/components/ez-label-chip/ez-label-chip.d.ts +0 -2
- package/package.json +1 -1
- package/dist/cjs/ez-collapsible-box.cjs.entry.js +0 -47
- package/dist/esm/ez-collapsible-box.entry.js +0 -43
- package/dist/ezui/p-26af789f.entry.js +0 -1
- package/dist/ezui/p-a508ff3f.entry.js +0 -1
- package/dist/ezui/p-a84c8be4.entry.js +0 -1
- package/dist/ezui/p-a93e9b81.entry.js +0 -1
- package/dist/ezui/p-c2812a32.entry.js +0 -1
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-0f668cc5.js');
|
|
6
6
|
|
|
7
|
-
const ezActionChipCss = ":host{--ac--height:36px;--ac--width:100%;--ac__icon--width:48px;--ac--border-radius:var(--border--radius-large, 24px);--ac--font-size:var(--text--medium, 14px);--ac--font-family:var(--font-pattern, Arial);--ac--font-weight:var(--text-weight--large, 500);--ac--space--medium:var(--space--medium, 6px);--ac__border:1px solid;--ac__border-color-strokes:var(--color--strokes, #DCE0E8);--ac__label--title--primary:var(--title--primary, #919191);--ac__label--color-primary:var(--color--primary, #008561);--ac__label-color--disable-secondary:var(--color--disable-secondary, #F2F5F8);--ac__label--background-color:#0085610F;--ac__label__default--background-color--hover:var(--color--primary-200, #f2faf8);--ac__label__default--border-color--hover:var(--color--primary-600, #007a5a);--ac__label--text--disabled:var(--text--disable, #AFB6C0);--ac__label--text--primary:var(--text--primary, #626e82);--ac__message_box--font-size:var(--text--small, 12px);--ac__message_box--info--color:var(--color--success, #22085d);--ac__message_box--error--color:var(--color--error, #FF0000)}.padding-right--small{padding-right:var(--ac--space--medium)}.padding-left--small{padding-left:var(--ac--space--medium)}.label__container{width:fit-content;display:flex;flex-wrap:wrap;position:relative;background-color:#FFFFFF;align-items:center;align-self:center;color:var(--ac__label--title--primary);fill:var(--ac__label--title--primary);border:var(--ac__border);border-radius:var(--ac--border-radius);border-color:var( --ac__border-color-strokes);padding-right:var(--space--
|
|
7
|
+
const ezActionChipCss = ":host{--ac--height:36px;--ac--width:100%;--ac__icon--width:48px;--ac--border-radius:var(--border--radius-large, 24px);--ac--font-size:var(--text--medium, 14px);--ac--font-family:var(--font-pattern, Arial);--ac--font-weight:var(--text-weight--large, 500);--ac--space--medium:var(--space--medium, 6px);--ac__border:1px solid;--ac__border-color-strokes:var(--color--strokes, #DCE0E8);--ac__label--title--primary:var(--title--primary, #919191);--ac__label--color-primary:var(--color--primary, #008561);--ac__label-color--disable-secondary:var(--color--disable-secondary, #F2F5F8);--ac__label--background-color:#0085610F;--ac__label__default--background-color--hover:var(--color--primary-200, #f2faf8);--ac__label__default--border-color--hover:var(--color--primary-600, #007a5a);--ac__label--text--disabled:var(--text--disable, #AFB6C0);--ac__label--text--primary:var(--text--primary, #626e82);--ac__message_box--font-size:var(--text--small, 12px);--ac__message_box--info--color:var(--color--success, #22085d);--ac__message_box--error--color:var(--color--error, #FF0000)}.padding-right--small{padding-right:var(--ac--space--medium)}.padding-left--small{padding-left:var(--ac--space--medium)}.label__container{width:fit-content;display:flex;flex-wrap:wrap;position:relative;background-color:#FFFFFF;align-items:center;align-self:center;color:var(--ac__label--title--primary);fill:var(--ac__label--title--primary);border:var(--ac__border);border-radius:var(--ac--border-radius);border-color:var( --ac__border-color-strokes);padding-right:var(--space--medium, 12px);padding-left:var(--space--medium, 12px);cursor:pointer}.label__container:hover{border-color:var(--ac__label__default--border-color--hover);background-color:var(--ac__label__default--background-color--hover)}.label__container--active:hover{border-color:var(--ac__label__active--background-color--hover);background-color:var(--ac__label__active--background-color--hover)}label{display:flex;align-items:center;font-weight:var(--text-weight--large, 600);cursor:pointer;height:var(--ac--height);font-family:var(--ac--font-family);font-size:var(--ac--font-size)}";
|
|
8
8
|
|
|
9
9
|
let EzLabelChip = class {
|
|
10
10
|
constructor(hostRef) {
|
|
@@ -16,35 +16,10 @@ let EzLabelChip = class {
|
|
|
16
16
|
this.enabled = true;
|
|
17
17
|
}
|
|
18
18
|
//---------------------------------------------
|
|
19
|
-
// Event handlers
|
|
20
|
-
//---------------------------------------------
|
|
21
|
-
handleSlotChange(ev) {
|
|
22
|
-
const slot = ev.target;
|
|
23
|
-
const content = slot.assignedElements()[0];
|
|
24
|
-
if (content) {
|
|
25
|
-
content.style.position = "absolute";
|
|
26
|
-
content.style.display = "flex";
|
|
27
|
-
content.style.alignItems = "center";
|
|
28
|
-
content.style.justifyContent = "center";
|
|
29
|
-
content.style.overflow = "hidden";
|
|
30
|
-
content.style.top = "0px";
|
|
31
|
-
content.style.width = "var(--ac__icon--width)";
|
|
32
|
-
content.style.height = "var(--ac--height)";
|
|
33
|
-
if (slot.name == "leftIcon") {
|
|
34
|
-
content.style.left = "0px";
|
|
35
|
-
this._labelElem.classList.add('padding-left--small');
|
|
36
|
-
}
|
|
37
|
-
else if (slot.name == "rightIcon") {
|
|
38
|
-
content.style.right = "0px";
|
|
39
|
-
this._labelElem.classList.add('padding-right--small');
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
//---------------------------------------------
|
|
44
19
|
// Lifecycle web component
|
|
45
20
|
//---------------------------------------------
|
|
46
21
|
render() {
|
|
47
|
-
return (index.h("div", { onClick: () => this.actionClick.emit(), class: "label__container" }, index.h("slot", { name: "leftIcon"
|
|
22
|
+
return (index.h("div", { onClick: () => this.actionClick.emit(), class: "label__container" }, index.h("slot", { name: "leftIcon" }), index.h("label", null, this.label), index.h("slot", { name: "rightIcon" })));
|
|
48
23
|
}
|
|
49
24
|
};
|
|
50
25
|
EzLabelChip.style = ezActionChipCss;
|
|
@@ -271,6 +271,46 @@ let EzCheck = class {
|
|
|
271
271
|
};
|
|
272
272
|
EzCheck.style = ezCheckCss;
|
|
273
273
|
|
|
274
|
+
const ezCollapsibleBoxCss = ":host{--collapsible-box--height:42px;--collapsible-box--font-size:var(--title--medium, 14px);--collapsible-box--font-family:var(--font-pattern, Arial);--collapsible-box--font-weight:var(--text-weight--large, 600);--collapsible-box--color:var(--title--primary);--collapsible-box__btn--image--xsmall:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"12px\" width=\"7.5px\"><path d=\"M 0,10.56 4.5967752,6.0000006 0,1.3800006 1.4516132,0 7.5,6.0000006 1.4516132,12 Z\"/></svg>');--collapsible-box__btn--image--small:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"14px\" width=\"8.68px\"><path d=\"M 0,12.32 5.3200012,7.0000007 0,1.6100007 1.6800004,0 8.68,7.0000007 1.6800004,14 Z\"/></svg>');--collapsible-box__btn--image--medium:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 0.21915251,13.860393 6.0795475,8.0000007 0.21915251,2.0624968 2.0698036,0.28895588 9.7808475,8.0000007 2.0698036,15.711044 Z\"/></svg>');--collapsible-box__btn--image--large:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"18px\" width=\"11.25px\"><path d=\"M 0,15.84 6.8951628,9.0000009 0,2.0700009 2.1774198,0 11.25,9.0000009 2.1774198,18 Z\"/></svg>');--collapsible-box__btn--image--xlarge:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"20px\" width=\"12.5px\"><path d=\"M 0,17.6 7.661292,10.000001 0,2.300001 2.4193553,0 12.5,10.000001 2.4193553,20 Z\"/></svg>');--collapsible-box__btn--fill:var(--collapsible-box--color);--collapsible-box__btn--width:10px;--collapsible-box__btn--height:16px;display:flex;flex-wrap:wrap;width:100%}.collapsible-box__title{width:100%;align-self:center;display:flex;box-sizing:border-box}.collapsible-box__label{white-space:nowrap;overflow:hidden;cursor:pointer;text-overflow:ellipsis;width:100%;font-family:var(--collapsible-box--font-family);font-size:var(--collapsible-box--font-size);font-weight:var(--collapsible-box--font-weight);color:var(--collapsible-box--color)}.collapsible-box__label--icon-right{white-space:nowrap;overflow:hidden;cursor:pointer;text-overflow:ellipsis;font-family:var(--collapsible-box--font-family);font-size:var(--collapsible-box--font-size);font-weight:var(--collapsible-box--font-weight);color:var(--collapsible-box--color)}.collapsible-box__btn{outline:none;border:none;background-color:unset;cursor:pointer;padding:1px 6px}.collapsible-box__btn::after{content:'';display:flex;background-color:var(--collapsible-box__btn--fill);width:var(--collapsible-box__btn--width);height:var(--collapsible-box__btn--height);transition:transform var(--transition);transform:rotate(90deg)}.collapsible-box__btn--xsmall::after{width:7.5px;height:12px;-webkit-mask-image:var(--collapsible-box__btn--image--xsmall);mask-image:var(--collapsible-box__btn--image--xsmall)}.collapsible-box__btn--small::after{width:8.68px;height:14px;-webkit-mask-image:var(--collapsible-box__btn--image--small);mask-image:var(--collapsible-box__btn--image--small)}.collapsible-box__btn--medium::after{width:10px;height:16px;-webkit-mask-image:var(--collapsible-box__btn--image--medium);mask-image:var(--collapsible-box__btn--image--medium)}.collapsible-box__btn--large::after{width:11.25px;height:18px;-webkit-mask-image:var(--collapsible-box__btn--image--large);mask-image:var(--collapsible-box__btn--image--large)}.collapsible-box__btn--xlarge::after{width:12.5px;height:20px;-webkit-mask-image:var(--collapsible-box__btn--image--xlarge);mask-image:var(--collapsible-box__btn--image--xlarge)}.collapsible-box__btn--collapsed::after{transform:rotate(0deg)}.font--xsmall{font-size:10px}.font--small{font-size:12px}.font--medium{font-size:14px}.font--large{font-size:16px}.font--xlarge{font-size:20px}";
|
|
275
|
+
|
|
276
|
+
let EzCollapsibleBox = class {
|
|
277
|
+
constructor(hostRef) {
|
|
278
|
+
index.registerInstance(this, hostRef);
|
|
279
|
+
this.ezChange = index.createEvent(this, "ezChange", 7);
|
|
280
|
+
/**
|
|
281
|
+
* Valor externalizado que garante a exibição ou não do componente
|
|
282
|
+
*/
|
|
283
|
+
this.value = false;
|
|
284
|
+
/**
|
|
285
|
+
* Define o tamanho do texto e do ícone do componente.
|
|
286
|
+
*/
|
|
287
|
+
this.headersize = "small";
|
|
288
|
+
/**
|
|
289
|
+
* Define o local onde o ícone será renderizado.
|
|
290
|
+
*/
|
|
291
|
+
this.iconplacement = "left";
|
|
292
|
+
}
|
|
293
|
+
observeValue() {
|
|
294
|
+
this.ezChange.emit();
|
|
295
|
+
}
|
|
296
|
+
/**
|
|
297
|
+
* Esconde ou revela o conteúdo do componente
|
|
298
|
+
*/
|
|
299
|
+
async showHide() {
|
|
300
|
+
this.value = !this.value;
|
|
301
|
+
}
|
|
302
|
+
render() {
|
|
303
|
+
return (index.h(index.Host, null, this.iconplacement == 'right' ?
|
|
304
|
+
index.h("div", { class: "collapsible-box__title" }, index.h("label", { class: (this.iconplacement == 'right' ? "collapsible-box__label--icon-right " : "collapsible-box__label ") + (this.headersize ? "font--" + this.headersize : ""), onClick: () => this.showHide(), title: this.label }, this.label), index.h("button", { class: this.value ? "collapsible-box__btn collapsible-box__btn--collapsed " + "collapsible-box__btn--" + this.headersize : "collapsible-box__btn " + "collapsible-box__btn--" + this.headersize, onClick: () => this.showHide() }))
|
|
305
|
+
:
|
|
306
|
+
index.h("div", { class: "collapsible-box__title" }, index.h("button", { class: this.value ? "collapsible-box__btn collapsible-box__btn--collapsed " + "collapsible-box__btn--" + this.headersize : "collapsible-box__btn " + "collapsible-box__btn--" + this.headersize, onClick: () => this.showHide() }), index.h("label", { class: (this.iconplacement == 'right' ? "collapsible-box__label--icon-right " : "collapsible-box__label ") + (this.headersize ? "font--" + this.headersize : ""), onClick: () => this.showHide(), title: this.label }, this.label)), !this.value ? index.h("slot", null) : null));
|
|
307
|
+
}
|
|
308
|
+
static get watchers() { return {
|
|
309
|
+
"value": ["observeValue"]
|
|
310
|
+
}; }
|
|
311
|
+
};
|
|
312
|
+
EzCollapsibleBox.style = ezCollapsibleBoxCss;
|
|
313
|
+
|
|
274
314
|
const ezComboBoxCss = ":host{--cx--height:42px;--cx--width:100%;--cx__icon--width:48px;--cx--border-radius:var(--border--radius-medium, 12px);--cx--border-radius-small:var(--border--radius-small, 6px);--cx--font-size:var(--text--medium, 14px);--cx--font-family:var(--font-pattern, Arial);--cx--font-weight--large:var(--text-weight--large, 500);--cx--font-weight--medium:var(--text-weight--medium, 400);--cx--space--medium:var(--space--medium, 12px);--cx--space--small:var(--space--small, 6px);--cx--shadow:var(--shadow, 0px 0px 16px 0px rgba(0, 38, 111, .12));--cx--background-color--xlight:var(--background--xlight,#fff);--cx__input--background-color:var(--background--medium, #e0e0e0);--cx__input--border:var(--border--medium, 2px solid);--cx__input--border-color:var(--cx__input--background-color);--cx__input--focus--border-color:var(--color--primary, #008561);--cx__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--cx__input--disabled--color:var(--text--disable, #AFB6C0);--cx__input--error--border-color:#CC2936;--cx__label--color:var(--title--primary, #919191);--cx__message_box--font-size:var(--text--small, 12px);--cx__message_box--info--color:var(--color--success, #22085d);--cx__message_box--error--color:var(--color--error, #FF0000);--cx__list-text--primary:var(--text--primary,#626e82);--cx__list-text--secondary:var(--text--secondary,#a2abb9);--cx__list-height:calc(var(--cx--font-size) + var(--cx--space--medium));--cx--drop-down__image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"16px\"><path d=\"M 1.8585859,3.0707069 7.9999998,9.2121212 14.141414,3.0707069 16,5.0101006 7.9999998,12.929293 0,4.9292932 Z\"/></svg>');--cx--search__image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"22px\" width=\"22px\"><path d=\"m 9.4,2.3 c 4.1,0 7.4,3.2 7.4,7.2 0,1.8 -0.7,3.4 -1.8,4.7 l 0.3,0.3 h 0.9 l 5.7,5.6 -1.7,1.7 -5.7,-5.6 V 15.3 L 14.3,15 C 13,16.1 11.3,16.7 9.5,16.7 5.3,16.7 2,13.5 2,9.5 2,5.5 5.3,2.3 9.4,2.3 m 0,2.2 c -2.9,0 -5.1,2.2 -5.1,5 0,2.8 2.3,5 5.1,5 2.8,0 5.1,-2.2 5.1,-5 0,-2.8 -2.2,-5 -5.1,-5 z\"/></svg>');display:flex;flex-wrap:wrap;position:relative;width:var(--cx--width)}ez-text-input{--it__input--background-color:var(--cx__input--background-color, #FFFFFF);--it__input--border-color:var(--cx__input--border-color, #DCE0E8)}.list-container{position:relative;width:100%}.options-list{box-sizing:border-box;width:100%;z-index:var(--more-visible, 2);display:flex;flex-direction:column;background-color:var(--cx--background-color--xlight);padding:var(--cx--space--small);border-radius:var(--cx--border-radius);box-shadow:var(--shadow, 0px 0px 16px 0px #000);scroll-behavior:smooth;max-height:calc(4*var(--cx__list-height) + 2*var(--cx--space--small));overflow:auto}.item{text-align:left;display:flex;justify-content:space-between;align-items:center;border-radius:var(--cx--border-radius-small);padding:0 var(--cx--space--small);list-style-type:none;min-height:var(--cx__list-height)}.item--label{text-align:left;flex-basis:85%;flex-grow:1;color:var(--cx__list-text--primary);font-weight:var(--cx--font-weight--large);font-family:var(--cx--font-family);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item--value{text-align:right;flex-basis:15%;flex-grow:0;color:var(--cx__list-text--primary);font-weight:var(--cx--font-weight--large);font-family:var(--cx--font-family);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}li:hover{background-color:var(--background--medium)}.preselected{background-color:var(--background--medium)}.btn-open-options{outline:none;border:none;background-color:unset;cursor:pointer}.btn-open-options:disabled{cursor:unset}.btn-open-options::after{content:'';display:flex;background-color:var(--text--primary, #008561);width:16px;height:16px;-webkit-mask-image:var(--cx--drop-down__image);mask-image:var(--cx--drop-down__image)}.btn-open-options:disabled:after{background-color:var(--text--disable, #AFB6C0)}.btn-open-options:enabled:hover::after{background-color:var(--color--primary, #4e4e4e)}.btn-open-search{outline:none;border:none;background-color:unset;cursor:pointer}.btn-open-search:disabled{cursor:unset}.btn-open-search::after{content:'';display:flex;background-color:var(--text--primary, #008561);width:22px;height:22px;-webkit-mask-image:var(--cx--search__image);mask-image:var(--cx--search__image)}.btn-open-search:disabled:after{background-color:var(--text--disable, #AFB6C0)}.btn-open-search:enabled:hover::after{background-color:var(--color--primary, #4e4e4e)}";
|
|
275
315
|
|
|
276
316
|
let EzComboBox = class {
|
|
@@ -2629,7 +2669,7 @@ const FieldSet = ({ store, formName, source, dataUnit, enabled }) => {
|
|
|
2629
2669
|
return index.h("div", { class: "col col--sd-12 padding--small" },
|
|
2630
2670
|
index.h("div", { class: "row margin-top--large" },
|
|
2631
2671
|
index.h("div", { class: "col col--sd-12 align--middle padding-horizontal--medium" },
|
|
2632
|
-
index.h("ez-
|
|
2672
|
+
index.h("ez-collapsible-box", { value: isCollapsed, label: label, onEzChange: () => store.dispatch(collapseExpandGroup(fieldSetName, !isCollapsed)) }),
|
|
2633
2673
|
isCollapsed ? null :
|
|
2634
2674
|
index.h("div", { class: "col col--sd-12" }, fields.map(field => index.h(Field, { enabled: enabled, field: field, dataUnit: dataUnit, forceScroll: fieldToScroll === field.name }))))));
|
|
2635
2675
|
};
|
|
@@ -3818,11 +3858,16 @@ let EzUpload = class {
|
|
|
3818
3858
|
event.stopPropagation();
|
|
3819
3859
|
event.preventDefault();
|
|
3820
3860
|
event.dataTransfer.dropEffect = 'copy';
|
|
3861
|
+
this._dropZone.style.background = '#c2dbff';
|
|
3821
3862
|
});
|
|
3822
3863
|
this._dropZone.addEventListener('drop', event => {
|
|
3823
3864
|
event.stopPropagation();
|
|
3824
3865
|
event.preventDefault();
|
|
3825
3866
|
this.addFiles(Array.from(event.dataTransfer.files));
|
|
3867
|
+
this._dropZone.style.background = '';
|
|
3868
|
+
});
|
|
3869
|
+
this._dropZone.addEventListener('dragleave', _event => {
|
|
3870
|
+
this._dropZone.style.background = '';
|
|
3826
3871
|
});
|
|
3827
3872
|
}
|
|
3828
3873
|
}
|
|
@@ -4011,6 +4056,7 @@ PlaceHolder.style = placeHolderCss;
|
|
|
4011
4056
|
exports.ez_button = EzButton;
|
|
4012
4057
|
exports.ez_calendar = EzCalendar;
|
|
4013
4058
|
exports.ez_check = EzCheck;
|
|
4059
|
+
exports.ez_collapsible_box = EzCollapsibleBox;
|
|
4014
4060
|
exports.ez_combo_box = EzComboBox;
|
|
4015
4061
|
exports.ez_date_input = EzDateInput;
|
|
4016
4062
|
exports.ez_form = EzForm;
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-0f668cc5.js');
|
|
6
6
|
|
|
7
|
-
const ezLabelChipCss = ":host{--lc--height:36px;--lc--width:100%;--lc__icon--width:48px;--lc--border-radius:var(--border--radius-large, 24px);--lc--font-size:var(--text--medium, 14px);--lc--font-family:var(--font-pattern, Arial);--lc--font-weight:var(--text-weight--large, 500);--lc--space--medium:var(--space--medium, 6px);--lc__border:1px solid;--lc__border-color-strokes:var(--color--strokes, #DCE0E8);--lc__label--title--primary:var(--title--primary, #919191);--lc__label--color-primary:var(--color--primary, #008561);--lc__label-color--disable-secondary:var(--color--disable-secondary, #F2F5F8);--lc__label--background-color:#0085610F;--lc__label__default--background-color--hover:var(--color--primary-200, #f2faf8);--lc__label__default--border-color--hover:var(--color--primary-600, #007a5a);--lc__label--text--disabled:var(--text--disable, #AFB6C0);--lc__label--text--primary:var(--text--primary, #626e82);--lc__message_box--font-size:var(--text--small, 12px);--lc__message_box--info--color:var(--color--success, #22085d);--lc__message_box--error--color:var(--color--error, #FF0000)}.padding-right--small{padding-right:var(--lc--space--medium)}.padding-left--small{padding-left:var(--lc--space--medium)}.label__container{width:fit-content;display:flex;flex-wrap:wrap;position:relative;align-items:center;background-color:#FFFFFF;align-self:center;color:var(--lc__label--title--primary);fill:var(--lc__label--title--primary);border:var(--lc__border);border-radius:var(--lc--border-radius);border-color:var( --lc__border-color-strokes);padding-right:var(--space--
|
|
7
|
+
const ezLabelChipCss = ":host{--lc--height:36px;--lc--width:100%;--lc__icon--width:48px;--lc--border-radius:var(--border--radius-large, 24px);--lc--font-size:var(--text--medium, 14px);--lc--font-family:var(--font-pattern, Arial);--lc--font-weight:var(--text-weight--large, 500);--lc--space--medium:var(--space--medium, 6px);--lc__border:1px solid;--lc__border-color-strokes:var(--color--strokes, #DCE0E8);--lc__label--title--primary:var(--title--primary, #919191);--lc__label--color-primary:var(--color--primary, #008561);--lc__label-color--disable-secondary:var(--color--disable-secondary, #F2F5F8);--lc__label--background-color:#0085610F;--lc__label__default--background-color--hover:var(--color--primary-200, #f2faf8);--lc__label__default--border-color--hover:var(--color--primary-600, #007a5a);--lc__label--text--disabled:var(--text--disable, #AFB6C0);--lc__label--text--primary:var(--text--primary, #626e82);--lc__message_box--font-size:var(--text--small, 12px);--lc__message_box--info--color:var(--color--success, #22085d);--lc__message_box--error--color:var(--color--error, #FF0000);--lc--close__image:url('data:image/svg+xml;utf8,<svg width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M 4.7098145,3.9968334 7.8535703,0.85318776 C 7.9473034,0.75946455 8,0.63233985 8,0.49978585 8,0.36723841 7.947304,0.24011361 7.8535703,0.14638378 7.7598354,0.05266059 7.6327257,6.48e-8 7.500152,6.48e-8 7.3676457,6.48e-8 7.2404691,0.0526608 7.1467354,0.14638378 L 4.00298,3.2900293 0.8591984,0.14638378 C 0.76546463,0.05266059 0.63834103,6.48e-8 0.50578123,6.48e-8 0.3732281,6.48e-8 0.24609783,0.05266059 0.15236397,0.14638378 0.05863012,0.24011361 0.00597395,0.36723841 0.00597395,0.49978585 c 0,0.132554 0.05265617,0.2596787 0.14639002,0.35340191 L 3.2961455,3.9968334 0.15236397,7.1411589 C 0.10466427,7.1872561 0.06663114,7.2424161 0.04046961,7.303371 0.01431473,7.3643212 5.6180845e-4,7.429943 1.6859246e-5,7.4962264 -5.2808998e-4,7.5625744 0.01214297,7.6283944 0.03729854,7.6897476 c 0.02514888,0.061416 0.06227604,0.1171794 0.1092096,0.1640783 0.0469402,0.046903 0.10274083,0.083936 0.16415749,0.1090508 0.0614166,0.025114 0.12721688,0.037703 0.19355667,0.037103 0.06634,-5.714e-4 0.13190027,-0.014457 0.19284393,-0.04064 0.0609507,-0.026246 0.11606474,-0.064351 0.16213217,-0.1120492 L 4.00298,4.7036374 7.1467354,7.8472967 c 0.093734,0.09373 0.2209103,0.1463572 0.3534166,0.1463572 0.1325737,0 0.2596834,-0.052623 0.3534183,-0.1463572 C 7.9473034,7.753567 8,7.6264624 8,7.493895 8,7.3613281 7.9473086,7.2342224 7.8535703,7.1404927 Z\"/></svg>')}.padding-right--small{padding-right:var(--lc--space--medium)}.padding-left--small{padding-left:var(--lc--space--medium)}.btn-close{align-items:flex-start;display:flex;outline:none;border:none;padding:0px 0px 0px 6px;background-color:unset;cursor:pointer}.btn-close::after{content:'';display:flex;background-color:var(--lc__label--color-primary);width:8px;height:8px;-webkit-mask-image:var(--lc--close__image);mask-image:var(--lc--close__image)}.label__container{width:fit-content;display:flex;flex-wrap:wrap;position:relative;align-items:center;background-color:#FFFFFF;align-self:center;color:var(--lc__label--title--primary);fill:var(--lc__label--title--primary);border:var(--lc__border);border-radius:var(--lc--border-radius);border-color:var( --lc__border-color-strokes);padding-right:var(--space--medium, 12px);padding-left:var(--space--medium, 12px)}.label__container:hover{border-color:var(--lc__label__default--border-color--hover);background-color:var(--lc__label__default--background-color--hover)}.label__container--active{width:fit-content;display:flex;flex-wrap:wrap;position:relative;align-items:center;align-self:center;border:var(--lc__border);border-radius:var(--lc--border-radius);padding-right:var(--space--medium, 12px);padding-left:var(--space--medium, 12px);fill:var(--lc__label--color-primary);color:var(--lc__label--color-primary);border-color:var(--lc__label--background-color);background-color:var(--lc__label--background-color)}.label__container--disabled{width:fit-content;display:flex;flex-wrap:wrap;position:relative;align-items:center;align-self:center;border:var(--lc__border);border-color:var(--lc__label-color--disable-secondary);border-radius:var(--lc--border-radius);padding-right:var(--space--medium, 12px);padding-left:var(--space--medium, 12px);fill:var(--lc__label--text--disabled);color:var(--lc__label--text--disabled);background-color:var(--lc__label-color--disable-secondary)}label{display:flex;align-items:center;font-weight:var(--text-weight--large, 600);cursor:pointer;height:var(--lc--height);font-family:var(--lc--font-family);font-size:var(--lc--font-size)}.label__icon{display:flex;cursor:pointer}";
|
|
8
8
|
|
|
9
9
|
let EzLabelChip = class {
|
|
10
10
|
constructor(hostRef) {
|
|
@@ -66,33 +66,6 @@ let EzLabelChip = class {
|
|
|
66
66
|
}
|
|
67
67
|
}
|
|
68
68
|
}
|
|
69
|
-
handleSlotChange(ev) {
|
|
70
|
-
const slot = ev.target;
|
|
71
|
-
const content = slot.assignedElements()[0];
|
|
72
|
-
if (content) {
|
|
73
|
-
content.style.position = "absolute";
|
|
74
|
-
content.style.display = "flex";
|
|
75
|
-
content.style.alignItems = "center";
|
|
76
|
-
content.style.justifyContent = "center";
|
|
77
|
-
content.style.overflow = "hidden";
|
|
78
|
-
content.style.top = "0px";
|
|
79
|
-
content.style.width = "var(--lc__icon--width)";
|
|
80
|
-
content.style.height = "var(--lc--height)";
|
|
81
|
-
if (slot.name == "leftIcon") {
|
|
82
|
-
content.style.left = "0px";
|
|
83
|
-
this._labelElem.classList.add('padding-left--small');
|
|
84
|
-
}
|
|
85
|
-
else if (slot.name == "rightIcon") {
|
|
86
|
-
content.style.right = "0px";
|
|
87
|
-
if (this.removable) {
|
|
88
|
-
this._iconElement.classList.add('padding-right--small');
|
|
89
|
-
}
|
|
90
|
-
else {
|
|
91
|
-
this._labelElem.classList.add('padding-right--small');
|
|
92
|
-
}
|
|
93
|
-
}
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
69
|
//---------------------------------------------
|
|
97
70
|
// Lifecycle web component
|
|
98
71
|
//---------------------------------------------
|
|
@@ -117,9 +90,9 @@ let EzLabelChip = class {
|
|
|
117
90
|
}
|
|
118
91
|
}
|
|
119
92
|
render() {
|
|
120
|
-
return (index.h("div", { onClick: (ev) => this.handleClick(ev), class: this.value ? "label__container--active" : "label__container", ref: (el) => this._divElem = el }, index.h("slot", { name: "leftIcon"
|
|
121
|
-
index.h("
|
|
122
|
-
: null, index.h("slot", { name: "rightIcon"
|
|
93
|
+
return (index.h("div", { onClick: (ev) => this.handleClick(ev), class: this.value ? "label__container--active" : "label__container", ref: (el) => this._divElem = el }, index.h("slot", { name: "leftIcon" }), index.h("label", { ref: (el) => this._labelElem = el }, this.label), this.removable ?
|
|
94
|
+
index.h("button", { class: "btn-close", onClick: () => { this.removeChip.emit(); } })
|
|
95
|
+
: null, index.h("slot", { name: "rightIcon" })));
|
|
123
96
|
}
|
|
124
97
|
static get watchers() { return {
|
|
125
98
|
"value": ["reflectChange"],
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-0f668cc5.js');
|
|
6
6
|
|
|
7
|
-
const ezModalCss = ":host{--modal-z-index:var(--most-visible, 3);--modal-vertical-padding:var(--space--large, 24px);display:block}.modal{position:fixed;padding:var(--modal-vertical-padding) 0;display:flex;top:0px;z-index:var(--modal-z-index);left:0px;width:100%;box-sizing:border-box;height:100vh;backdrop-filter:blur(4px);background:rgba(0, 4, 12, 0.4)}@keyframes expand-modal--left{from{transform:translate(-100%)}}@keyframes expand-modal--right{from{transform:translate(100%)}}.modal__container{display:flex;flex-wrap:wrap;height:100%;box-sizing:border-box;width:100%;align-items:flex-start}.modal__container--right{animation:expand-modal--right .2s ease-in-out 1;justify-content:flex-end}.modal__container--left{animation:expand-modal--left .2s ease-in-out 1;justify-content:flex-start}.modal__content{display:flex;flex-wrap:wrap;max-height:calc(100% - 48px);overflow-y:auto;background-color:rgb(255, 255, 255);padding:24px;border-radius:12px 0px 0px 12px;box-shadow:rgb(0 38 111 / 12%) 0px 0px 16px 0px}.modal__content--right{border-radius:12px 0px 0px 12px}.modal__content--left{border-radius:0px 12px 12px 0px}.modal__box__container{display:flex;flex-wrap:wrap;background-color:#fff;width:100%;border-radius:12px}.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%}}";
|
|
7
|
+
const ezModalCss = ":host{--modal-z-index:var(--most-visible, 3);--modal-vertical-padding:var(--space--large, 24px);display:block}.modal{position:fixed;padding:var(--modal-vertical-padding) 0;display:flex;top:0px;z-index:var(--modal-z-index);left:0px;width:100%;box-sizing:border-box;height:100vh;backdrop-filter:blur(4px);background:rgba(0, 4, 12, 0.4)}@keyframes expand-modal--left{from{transform:translate(-100%)}}@keyframes expand-modal--right{from{transform:translate(100%)}}.modal__container{display:flex;flex-wrap:wrap;height:100%;box-sizing:border-box;width:100%;align-items:flex-start}.modal__container--right{animation:expand-modal--right .2s ease-in-out 1;justify-content:flex-end}.modal__container--left{animation:expand-modal--left .2s ease-in-out 1;justify-content:flex-start}.modal__content{display:flex;flex-wrap:wrap;max-height:calc(100% - 48px);height:100%;overflow-y:auto;background-color:rgb(255, 255, 255);padding:24px;border-radius:12px 0px 0px 12px;box-shadow:rgb(0 38 111 / 12%) 0px 0px 16px 0px}.modal__content--right{border-radius:12px 0px 0px 12px}.modal__content--left{border-radius:0px 12px 12px 0px}.modal__box__container{display:flex;flex-wrap:wrap;background-color:#fff;width:100%;border-radius:12px}.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%}}";
|
|
8
8
|
|
|
9
9
|
let EzModal = class {
|
|
10
10
|
constructor(hostRef) {
|
package/dist/cjs/ezui.cjs.js
CHANGED
|
@@ -15,5 +15,5 @@ const patchBrowser = () => {
|
|
|
15
15
|
};
|
|
16
16
|
|
|
17
17
|
patchBrowser().then(options => {
|
|
18
|
-
return index.bootstrapLazy([["ez-dialog.cjs",[[1,"ez-dialog",{"confirm":[1028],"critical":[1028],"message":[1025],"opened":[1540],"personalizedIconPath":[1025,"personalized-icon-path"],"ezTitle":[1025,"ez-title"],"handleButtonClick":[64],"show":[64]}]]],["ez-
|
|
18
|
+
return index.bootstrapLazy([["ez-dialog.cjs",[[1,"ez-dialog",{"confirm":[1028],"critical":[1028],"message":[1025],"opened":[1540],"personalizedIconPath":[1025,"personalized-icon-path"],"ezTitle":[1025,"ez-title"],"handleButtonClick":[64],"show":[64]}]]],["ez-time-input.cjs",[[1,"ez-time-input",{"label":[513],"viewValue":[1537,"view-value"],"value":[1026],"enabled":[516],"errormessage":[1537],"showSeconds":[516,"show-seconds"],"setFocus":[64],"setBlur":[64]}]]],["ez-action-chip.cjs",[[1,"ez-action-chip",{"label":[513],"enabled":[516]}]]],["ez-label-chip.cjs",[[1,"ez-label-chip",{"label":[513],"enabled":[516],"removable":[516],"value":[1540],"setFocus":[64],"setBlur":[64]}]]],["ez-modal.cjs",[[1,"ez-modal",{"modalsize":[1],"align":[1],"oppened":[4],"closeesc":[4],"closeoutsideclick":[4]}]]],["ez-number-input.cjs",[[1,"ez-number-input",{"strvalue":[1025],"value":[1026],"label":[513],"enabled":[516],"errormessage":[1537],"precision":[1538],"prettyprecision":[1538],"textleft":[516],"formatnumber":[513],"setFocus":[64],"setBlur":[64],"handleFocusout":[64]}]]],["ez-popover.cjs",[[1,"ez-popover",{"autoclose":[516],"top":[1537],"left":[1537],"bottom":[1537],"right":[1537],"boxwidth":[513],"isOpened":[1540,"is-opened"],"updatePosition":[64],"show":[64],"hide":[64]}]]],["ez-popup.cjs",[[1,"ez-popup",{"size":[1],"opened":[1540],"useHeader":[1540,"use-header"],"ezTitle":[1,"ez-title"]}]]],["ez-toast.cjs",[[1,"ez-toast",{"message":[1025],"fadeTime":[1026,"fade-time"],"useIcon":[1028,"use-icon"],"show":[64]}]]],["ez-button_16.cjs",[[0,"ez-form",{"metadataexecutor":[1],"loadexecutor":[1],"saveexecutor":[1],"removeexecutor":[1],"fieldsearchexecutor":[1],"ignoresavevalidation":[4],"metadata":[16],"slavemode":[4],"enabled":[4],"loading":[1540],"validate":[64],"getChanges":[64],"changeFieldValue":[64]}],[1,"form-metadata",{"name":[1],"label":[1],"dataunit":[1025],"many":[4],"autoload":[4],"metadata":[1040]}],[1,"ez-date-input",{"label":[513],"value":[1040],"enabled":[516],"errormessage":[1537]}],[1,"ez-search",{"value":[1537],"label":[1537],"enabled":[1540],"errormessage":[1537],"optionloader":[16],"showselectedvalue":[4],"showoptionvalue":[4]}],[1,"ez-numeric-input",{"label":[513],"value":[1538],"enabled":[516],"errormessage":[1537],"precision":[8],"prettyprecision":[8]}],[1,"ez-check",{"label":[513],"value":[1540],"enabled":[516],"mode":[513],"getMode":[64],"setFocus":[64]}],[1,"ez-collapsible-box",{"value":[1540],"label":[513],"headersize":[513],"iconplacement":[513],"showHide":[64]}],[1,"ez-tabselector",{"selectedindex":[1537],"selectedtab":[1537],"tabs":[1]}],[1,"ez-text-area",{"label":[513],"value":[1537],"enabled":[516],"loading":[516],"errormessage":[1537],"rows":[1538],"setFocus":[64],"setBlur":[64]}],[1,"ez-upload",{"label":[1],"enabled":[4],"maxfilesize":[2],"maxfiles":[2],"requestheaders":[8],"urlupload":[1],"urldelete":[1],"value":[1040],"addFiles":[64]}],[1,"place-holder"],[1,"ez-button",{"label":[513],"enabled":[516],"mode":[513],"image":[513]}],[1,"ez-combo-box",{"value":[1537],"label":[513],"enabled":[516],"options":[1040],"errormessage":[1537],"searchmode":[4],"showselectedvalue":[4],"showoptionvalue":[4],"optionloader":[16],"_preSelection":[32],"_visibleOptions":[32]}],[1,"ez-calendar",{"value":[1040],"floating":[516],"show":[64],"fitVertical":[64],"hide":[64]}],[1,"ez-icon",{"size":[513],"href":[513]}],[1,"ez-text-input",{"label":[513],"value":[1537],"enabled":[516],"loading":[516],"errormessage":[1537],"onlynumber":[516],"mask":[1],"restrict":[1],"setFocus":[64],"setBlur":[64]}]]]], options);
|
|
19
19
|
});
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -14,7 +14,7 @@ const patchEsm = () => {
|
|
|
14
14
|
const defineCustomElements = (win, options) => {
|
|
15
15
|
if (typeof window === 'undefined') return Promise.resolve();
|
|
16
16
|
return patchEsm().then(() => {
|
|
17
|
-
return index.bootstrapLazy([["ez-dialog.cjs",[[1,"ez-dialog",{"confirm":[1028],"critical":[1028],"message":[1025],"opened":[1540],"personalizedIconPath":[1025,"personalized-icon-path"],"ezTitle":[1025,"ez-title"],"handleButtonClick":[64],"show":[64]}]]],["ez-
|
|
17
|
+
return index.bootstrapLazy([["ez-dialog.cjs",[[1,"ez-dialog",{"confirm":[1028],"critical":[1028],"message":[1025],"opened":[1540],"personalizedIconPath":[1025,"personalized-icon-path"],"ezTitle":[1025,"ez-title"],"handleButtonClick":[64],"show":[64]}]]],["ez-time-input.cjs",[[1,"ez-time-input",{"label":[513],"viewValue":[1537,"view-value"],"value":[1026],"enabled":[516],"errormessage":[1537],"showSeconds":[516,"show-seconds"],"setFocus":[64],"setBlur":[64]}]]],["ez-action-chip.cjs",[[1,"ez-action-chip",{"label":[513],"enabled":[516]}]]],["ez-label-chip.cjs",[[1,"ez-label-chip",{"label":[513],"enabled":[516],"removable":[516],"value":[1540],"setFocus":[64],"setBlur":[64]}]]],["ez-modal.cjs",[[1,"ez-modal",{"modalsize":[1],"align":[1],"oppened":[4],"closeesc":[4],"closeoutsideclick":[4]}]]],["ez-number-input.cjs",[[1,"ez-number-input",{"strvalue":[1025],"value":[1026],"label":[513],"enabled":[516],"errormessage":[1537],"precision":[1538],"prettyprecision":[1538],"textleft":[516],"formatnumber":[513],"setFocus":[64],"setBlur":[64],"handleFocusout":[64]}]]],["ez-popover.cjs",[[1,"ez-popover",{"autoclose":[516],"top":[1537],"left":[1537],"bottom":[1537],"right":[1537],"boxwidth":[513],"isOpened":[1540,"is-opened"],"updatePosition":[64],"show":[64],"hide":[64]}]]],["ez-popup.cjs",[[1,"ez-popup",{"size":[1],"opened":[1540],"useHeader":[1540,"use-header"],"ezTitle":[1,"ez-title"]}]]],["ez-toast.cjs",[[1,"ez-toast",{"message":[1025],"fadeTime":[1026,"fade-time"],"useIcon":[1028,"use-icon"],"show":[64]}]]],["ez-button_16.cjs",[[0,"ez-form",{"metadataexecutor":[1],"loadexecutor":[1],"saveexecutor":[1],"removeexecutor":[1],"fieldsearchexecutor":[1],"ignoresavevalidation":[4],"metadata":[16],"slavemode":[4],"enabled":[4],"loading":[1540],"validate":[64],"getChanges":[64],"changeFieldValue":[64]}],[1,"form-metadata",{"name":[1],"label":[1],"dataunit":[1025],"many":[4],"autoload":[4],"metadata":[1040]}],[1,"ez-date-input",{"label":[513],"value":[1040],"enabled":[516],"errormessage":[1537]}],[1,"ez-search",{"value":[1537],"label":[1537],"enabled":[1540],"errormessage":[1537],"optionloader":[16],"showselectedvalue":[4],"showoptionvalue":[4]}],[1,"ez-numeric-input",{"label":[513],"value":[1538],"enabled":[516],"errormessage":[1537],"precision":[8],"prettyprecision":[8]}],[1,"ez-check",{"label":[513],"value":[1540],"enabled":[516],"mode":[513],"getMode":[64],"setFocus":[64]}],[1,"ez-collapsible-box",{"value":[1540],"label":[513],"headersize":[513],"iconplacement":[513],"showHide":[64]}],[1,"ez-tabselector",{"selectedindex":[1537],"selectedtab":[1537],"tabs":[1]}],[1,"ez-text-area",{"label":[513],"value":[1537],"enabled":[516],"loading":[516],"errormessage":[1537],"rows":[1538],"setFocus":[64],"setBlur":[64]}],[1,"ez-upload",{"label":[1],"enabled":[4],"maxfilesize":[2],"maxfiles":[2],"requestheaders":[8],"urlupload":[1],"urldelete":[1],"value":[1040],"addFiles":[64]}],[1,"place-holder"],[1,"ez-button",{"label":[513],"enabled":[516],"mode":[513],"image":[513]}],[1,"ez-combo-box",{"value":[1537],"label":[513],"enabled":[516],"options":[1040],"errormessage":[1537],"searchmode":[4],"showselectedvalue":[4],"showoptionvalue":[4],"optionloader":[16],"_preSelection":[32],"_visibleOptions":[32]}],[1,"ez-calendar",{"value":[1040],"floating":[516],"show":[64],"fitVertical":[64],"hide":[64]}],[1,"ez-icon",{"size":[513],"href":[513]}],[1,"ez-text-input",{"label":[513],"value":[1537],"enabled":[516],"loading":[516],"errormessage":[1537],"onlynumber":[516],"mask":[1],"restrict":[1],"setFocus":[64],"setBlur":[64]}]]]], options);
|
|
18
18
|
});
|
|
19
19
|
};
|
|
20
20
|
|
|
@@ -49,8 +49,8 @@
|
|
|
49
49
|
border: var(--ac__border);
|
|
50
50
|
border-radius: var(--ac--border-radius);
|
|
51
51
|
border-color: var( --ac__border-color-strokes);
|
|
52
|
-
padding-right: var(--space--
|
|
53
|
-
padding-left: var(--space--
|
|
52
|
+
padding-right: var(--space--medium, 12px);
|
|
53
|
+
padding-left: var(--space--medium, 12px);
|
|
54
54
|
cursor: pointer;
|
|
55
55
|
}
|
|
56
56
|
|
|
@@ -68,8 +68,6 @@ label {
|
|
|
68
68
|
/*private*/
|
|
69
69
|
display: flex;
|
|
70
70
|
align-items: center;
|
|
71
|
-
width: calc(100% - var(--ac__icon--width));
|
|
72
|
-
width: fit-content;
|
|
73
71
|
font-weight: var(--text-weight--large, 600);
|
|
74
72
|
cursor: pointer;
|
|
75
73
|
/*public*/
|
|
@@ -7,38 +7,13 @@ export class EzLabelChip {
|
|
|
7
7
|
this.enabled = true;
|
|
8
8
|
}
|
|
9
9
|
//---------------------------------------------
|
|
10
|
-
// Event handlers
|
|
11
|
-
//---------------------------------------------
|
|
12
|
-
handleSlotChange(ev) {
|
|
13
|
-
const slot = ev.target;
|
|
14
|
-
const content = slot.assignedElements()[0];
|
|
15
|
-
if (content) {
|
|
16
|
-
content.style.position = "absolute";
|
|
17
|
-
content.style.display = "flex";
|
|
18
|
-
content.style.alignItems = "center";
|
|
19
|
-
content.style.justifyContent = "center";
|
|
20
|
-
content.style.overflow = "hidden";
|
|
21
|
-
content.style.top = "0px";
|
|
22
|
-
content.style.width = "var(--ac__icon--width)";
|
|
23
|
-
content.style.height = "var(--ac--height)";
|
|
24
|
-
if (slot.name == "leftIcon") {
|
|
25
|
-
content.style.left = "0px";
|
|
26
|
-
this._labelElem.classList.add('padding-left--small');
|
|
27
|
-
}
|
|
28
|
-
else if (slot.name == "rightIcon") {
|
|
29
|
-
content.style.right = "0px";
|
|
30
|
-
this._labelElem.classList.add('padding-right--small');
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
//---------------------------------------------
|
|
35
10
|
// Lifecycle web component
|
|
36
11
|
//---------------------------------------------
|
|
37
12
|
render() {
|
|
38
13
|
return (h("div", { onClick: () => this.actionClick.emit(), class: "label__container" },
|
|
39
|
-
h("slot", { name: "leftIcon"
|
|
40
|
-
h("label",
|
|
41
|
-
h("slot", { name: "rightIcon"
|
|
14
|
+
h("slot", { name: "leftIcon" }),
|
|
15
|
+
h("label", null, this.label),
|
|
16
|
+
h("slot", { name: "rightIcon" })));
|
|
42
17
|
}
|
|
43
18
|
static get is() { return "ez-action-chip"; }
|
|
44
19
|
static get encapsulation() { return "shadow"; }
|
|
@@ -21,7 +21,7 @@ export const FieldSet = ({ store, formName, source, dataUnit, enabled }) => {
|
|
|
21
21
|
return h("div", { class: "col col--sd-12 padding--small" },
|
|
22
22
|
h("div", { class: "row margin-top--large" },
|
|
23
23
|
h("div", { class: "col col--sd-12 align--middle padding-horizontal--medium" },
|
|
24
|
-
h("ez-
|
|
24
|
+
h("ez-collapsible-box", { value: isCollapsed, label: label, onEzChange: () => store.dispatch(collapseExpandGroup(fieldSetName, !isCollapsed)) }),
|
|
25
25
|
isCollapsed ? null :
|
|
26
26
|
h("div", { class: "col col--sd-12" }, fields.map(field => h(Field, { enabled: enabled, field: field, dataUnit: dataUnit, forceScroll: fieldToScroll === field.name }))))));
|
|
27
27
|
};
|
|
@@ -24,6 +24,7 @@
|
|
|
24
24
|
--lc__message_box--font-size: var(--text--small, 12px);
|
|
25
25
|
--lc__message_box--info--color: var(--color--success, #22085d);
|
|
26
26
|
--lc__message_box--error--color: var(--color--error, #FF0000);
|
|
27
|
+
--lc--close__image: url('data:image/svg+xml;utf8,<svg width="8" height="8" viewBox="0 0 8 8" xmlns="http://www.w3.org/2000/svg"><path d="M 4.7098145,3.9968334 7.8535703,0.85318776 C 7.9473034,0.75946455 8,0.63233985 8,0.49978585 8,0.36723841 7.947304,0.24011361 7.8535703,0.14638378 7.7598354,0.05266059 7.6327257,6.48e-8 7.500152,6.48e-8 7.3676457,6.48e-8 7.2404691,0.0526608 7.1467354,0.14638378 L 4.00298,3.2900293 0.8591984,0.14638378 C 0.76546463,0.05266059 0.63834103,6.48e-8 0.50578123,6.48e-8 0.3732281,6.48e-8 0.24609783,0.05266059 0.15236397,0.14638378 0.05863012,0.24011361 0.00597395,0.36723841 0.00597395,0.49978585 c 0,0.132554 0.05265617,0.2596787 0.14639002,0.35340191 L 3.2961455,3.9968334 0.15236397,7.1411589 C 0.10466427,7.1872561 0.06663114,7.2424161 0.04046961,7.303371 0.01431473,7.3643212 5.6180845e-4,7.429943 1.6859246e-5,7.4962264 -5.2808998e-4,7.5625744 0.01214297,7.6283944 0.03729854,7.6897476 c 0.02514888,0.061416 0.06227604,0.1171794 0.1092096,0.1640783 0.0469402,0.046903 0.10274083,0.083936 0.16415749,0.1090508 0.0614166,0.025114 0.12721688,0.037703 0.19355667,0.037103 0.06634,-5.714e-4 0.13190027,-0.014457 0.19284393,-0.04064 0.0609507,-0.026246 0.11606474,-0.064351 0.16213217,-0.1120492 L 4.00298,4.7036374 7.1467354,7.8472967 c 0.093734,0.09373 0.2209103,0.1463572 0.3534166,0.1463572 0.1325737,0 0.2596834,-0.052623 0.3534183,-0.1463572 C 7.9473034,7.753567 8,7.6264624 8,7.493895 8,7.3613281 7.9473086,7.2342224 7.8535703,7.1404927 Z"/></svg>');
|
|
27
28
|
}
|
|
28
29
|
|
|
29
30
|
.padding-right--small {
|
|
@@ -34,6 +35,26 @@
|
|
|
34
35
|
padding-left: var(--lc--space--medium);
|
|
35
36
|
}
|
|
36
37
|
|
|
38
|
+
.btn-close {
|
|
39
|
+
align-items: flex-start;
|
|
40
|
+
display: flex;
|
|
41
|
+
outline: none;
|
|
42
|
+
border: none;
|
|
43
|
+
padding: 0px 0px 0px 6px;
|
|
44
|
+
background-color: unset;
|
|
45
|
+
cursor: pointer;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.btn-close::after {
|
|
49
|
+
content: '';
|
|
50
|
+
display: flex;
|
|
51
|
+
background-color: var(--lc__label--color-primary);
|
|
52
|
+
width: 8px;
|
|
53
|
+
height: 8px;
|
|
54
|
+
-webkit-mask-image: var(--lc--close__image);
|
|
55
|
+
mask-image: var(--lc--close__image);
|
|
56
|
+
}
|
|
57
|
+
|
|
37
58
|
.label__container {
|
|
38
59
|
/*private*/
|
|
39
60
|
width: fit-content;
|
|
@@ -48,8 +69,8 @@
|
|
|
48
69
|
border: var(--lc__border);
|
|
49
70
|
border-radius: var(--lc--border-radius);
|
|
50
71
|
border-color: var( --lc__border-color-strokes);
|
|
51
|
-
padding-right: var(--space--
|
|
52
|
-
padding-left: var(--space--
|
|
72
|
+
padding-right: var(--space--medium, 12px);
|
|
73
|
+
padding-left: var(--space--medium, 12px);
|
|
53
74
|
}
|
|
54
75
|
|
|
55
76
|
.label__container:hover {
|
|
@@ -67,8 +88,8 @@
|
|
|
67
88
|
align-self: center;
|
|
68
89
|
border: var(--lc__border);
|
|
69
90
|
border-radius: var(--lc--border-radius);
|
|
70
|
-
padding-right: var(--space--
|
|
71
|
-
padding-left: var(--space--
|
|
91
|
+
padding-right: var(--space--medium, 12px);
|
|
92
|
+
padding-left: var(--space--medium, 12px);
|
|
72
93
|
fill: var(--lc__label--color-primary);
|
|
73
94
|
color: var(--lc__label--color-primary);
|
|
74
95
|
border-color: var(--lc__label--background-color);
|
|
@@ -86,8 +107,8 @@
|
|
|
86
107
|
border: var(--lc__border);
|
|
87
108
|
border-color: var(--lc__label-color--disable-secondary);
|
|
88
109
|
border-radius: var(--lc--border-radius);
|
|
89
|
-
padding-right: var(--space--
|
|
90
|
-
padding-left: var(--space--
|
|
110
|
+
padding-right: var(--space--medium, 12px);
|
|
111
|
+
padding-left: var(--space--medium, 12px);
|
|
91
112
|
fill: var(--lc__label--text--disabled);
|
|
92
113
|
color: var(--lc__label--text--disabled);
|
|
93
114
|
background-color: var(--lc__label-color--disable-secondary);
|
|
@@ -97,8 +118,6 @@ label {
|
|
|
97
118
|
/*private*/
|
|
98
119
|
display: flex;
|
|
99
120
|
align-items: center;
|
|
100
|
-
width: calc(100% - var(--lc__icon--width));
|
|
101
|
-
width: fit-content;
|
|
102
121
|
font-weight: var(--text-weight--large, 600);
|
|
103
122
|
cursor: pointer;
|
|
104
123
|
/*public*/
|
|
@@ -56,33 +56,6 @@ export class EzLabelChip {
|
|
|
56
56
|
}
|
|
57
57
|
}
|
|
58
58
|
}
|
|
59
|
-
handleSlotChange(ev) {
|
|
60
|
-
const slot = ev.target;
|
|
61
|
-
const content = slot.assignedElements()[0];
|
|
62
|
-
if (content) {
|
|
63
|
-
content.style.position = "absolute";
|
|
64
|
-
content.style.display = "flex";
|
|
65
|
-
content.style.alignItems = "center";
|
|
66
|
-
content.style.justifyContent = "center";
|
|
67
|
-
content.style.overflow = "hidden";
|
|
68
|
-
content.style.top = "0px";
|
|
69
|
-
content.style.width = "var(--lc__icon--width)";
|
|
70
|
-
content.style.height = "var(--lc--height)";
|
|
71
|
-
if (slot.name == "leftIcon") {
|
|
72
|
-
content.style.left = "0px";
|
|
73
|
-
this._labelElem.classList.add('padding-left--small');
|
|
74
|
-
}
|
|
75
|
-
else if (slot.name == "rightIcon") {
|
|
76
|
-
content.style.right = "0px";
|
|
77
|
-
if (this.removable) {
|
|
78
|
-
this._iconElement.classList.add('padding-right--small');
|
|
79
|
-
}
|
|
80
|
-
else {
|
|
81
|
-
this._labelElem.classList.add('padding-right--small');
|
|
82
|
-
}
|
|
83
|
-
}
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
59
|
//---------------------------------------------
|
|
87
60
|
// Lifecycle web component
|
|
88
61
|
//---------------------------------------------
|
|
@@ -108,12 +81,12 @@ export class EzLabelChip {
|
|
|
108
81
|
}
|
|
109
82
|
render() {
|
|
110
83
|
return (h("div", { onClick: (ev) => this.handleClick(ev), class: this.value ? "label__container--active" : "label__container", ref: (el) => this._divElem = el },
|
|
111
|
-
h("slot", { name: "leftIcon"
|
|
112
|
-
h("label", {
|
|
84
|
+
h("slot", { name: "leftIcon" }),
|
|
85
|
+
h("label", { ref: (el) => this._labelElem = el }, this.label),
|
|
113
86
|
this.removable ?
|
|
114
|
-
h("
|
|
87
|
+
h("button", { class: "btn-close", onClick: () => { this.removeChip.emit(); } })
|
|
115
88
|
: null,
|
|
116
|
-
h("slot", { name: "rightIcon"
|
|
89
|
+
h("slot", { name: "rightIcon" })));
|
|
117
90
|
}
|
|
118
91
|
static get is() { return "ez-label-chip"; }
|
|
119
92
|
static get encapsulation() { return "shadow"; }
|
|
@@ -183,11 +183,16 @@ export class EzUpload {
|
|
|
183
183
|
event.stopPropagation();
|
|
184
184
|
event.preventDefault();
|
|
185
185
|
event.dataTransfer.dropEffect = 'copy';
|
|
186
|
+
this._dropZone.style.background = '#c2dbff';
|
|
186
187
|
});
|
|
187
188
|
this._dropZone.addEventListener('drop', event => {
|
|
188
189
|
event.stopPropagation();
|
|
189
190
|
event.preventDefault();
|
|
190
191
|
this.addFiles(Array.from(event.dataTransfer.files));
|
|
192
|
+
this._dropZone.style.background = '';
|
|
193
|
+
});
|
|
194
|
+
this._dropZone.addEventListener('dragleave', _event => {
|
|
195
|
+
this._dropZone.style.background = '';
|
|
191
196
|
});
|
|
192
197
|
}
|
|
193
198
|
}
|