@sankhyalabs/ezui 1.1.86 → 1.1.89
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-button_11.cjs.entry.js +33 -12
- package/dist/cjs/ez-calendar.cjs.entry.js +1 -1
- package/dist/cjs/ez-collapsible-box_7.cjs.entry.js +1 -1
- package/dist/cjs/ez-combo-box.cjs.entry.js +1 -1
- package/dist/cjs/ez-form.cjs.entry.js +33 -2
- package/dist/cjs/ez-popover.cjs.entry.js +1 -1
- package/dist/cjs/ez-time-input.cjs.entry.js +1 -1
- package/dist/cjs/ezui.cjs.js +1 -1
- package/dist/cjs/{index-789fa661.js → index-a92e6d04.js} +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/ez-button/ez-button.js +19 -2
- package/dist/collection/components/ez-form/ez-form.js +17 -1
- package/dist/collection/components/ez-form/structure/FormSheetMetadata.js +16 -1
- package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js +7 -0
- package/dist/collection/components/ez-grid/ez-grid.js +21 -4
- package/dist/collection/components/ez-icon/ez-icon.css +133 -1
- package/dist/collection/components/ez-icon/ez-icon.js +34 -6
- package/dist/custom-elements/index.js +85 -33
- package/dist/esm/ez-button_11.entry.js +33 -12
- package/dist/esm/ez-calendar.entry.js +1 -1
- package/dist/esm/ez-collapsible-box_7.entry.js +1 -1
- package/dist/esm/ez-combo-box.entry.js +1 -1
- package/dist/esm/ez-form.entry.js +33 -2
- package/dist/esm/ez-popover.entry.js +1 -1
- package/dist/esm/ez-time-input.entry.js +1 -1
- package/dist/esm/ezui.js +1 -1
- package/dist/esm/{index-461f1302.js → index-4fb1605f.js} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/ezui/ezui.esm.js +1 -1
- package/dist/ezui/{p-88e84ff2.entry.js → p-27a35580.entry.js} +1 -1
- package/dist/ezui/{p-8b7a4a16.entry.js → p-3e79877f.entry.js} +1 -1
- package/dist/ezui/p-4e08b842.entry.js +1 -0
- package/dist/ezui/{p-b1d7488d.entry.js → p-535771b6.entry.js} +1 -1
- package/dist/ezui/{p-cc448554.entry.js → p-826b6c4d.entry.js} +1 -1
- package/dist/ezui/{p-ca6240ff.entry.js → p-93bb1854.entry.js} +19 -19
- package/dist/ezui/{p-d93a3e2b.entry.js → p-eefc1f9d.entry.js} +1 -1
- package/dist/ezui/{p-7c4d4946.js → p-f0137439.js} +1 -1
- package/dist/types/components/ez-button/ez-button.d.ts +4 -0
- package/dist/types/components/ez-form/ez-form.d.ts +4 -2
- package/dist/types/components/ez-form/structure/FormSheetMetadata.d.ts +3 -0
- package/dist/types/components/ez-grid/controller/EzGridController.d.ts +4 -0
- package/dist/types/components/ez-grid/controller/ag-grid/AgGridController.d.ts +2 -0
- package/dist/types/components/ez-grid/ez-grid.d.ts +4 -0
- package/dist/types/components/ez-icon/ez-icon.d.ts +6 -0
- package/dist/types/components.d.ts +20 -0
- package/package.json +1 -1
- package/dist/ezui/p-9f98c4d1.entry.js +0 -1
|
@@ -36,4 +36,136 @@ svg {
|
|
|
36
36
|
.x-large {
|
|
37
37
|
width: 30px;
|
|
38
38
|
height: 30px;
|
|
39
|
-
}
|
|
39
|
+
}
|
|
40
|
+
/*
|
|
41
|
+
START CSS GENERATED BY EZ-DESIGN ICONS, SEE MORE AT ez-design\scripts\fontsGenerator.js.
|
|
42
|
+
WHEN ADD NEW ICONS THIS CSS NEED TO BE UPDATED
|
|
43
|
+
*/
|
|
44
|
+
[class^="ez-icon-"], [class*=" ez-icon-"] {
|
|
45
|
+
font-family: 'ez-icons' !important;
|
|
46
|
+
font-size: 16px;
|
|
47
|
+
font-style:normal;
|
|
48
|
+
-webkit-font-smoothing: antialiased;
|
|
49
|
+
-moz-osx-font-smoothing: grayscale;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.ez-icon-account-outline:before { content: "\ea01"; }
|
|
53
|
+
.ez-icon-account:before { content: "\ea02"; }
|
|
54
|
+
.ez-icon-alert-circle-inverted:before { content: "\ea03"; }
|
|
55
|
+
.ez-icon-alert-circle:before { content: "\ea04"; }
|
|
56
|
+
.ez-icon-alert-mail:before { content: "\ea05"; }
|
|
57
|
+
.ez-icon-alert-outline:before { content: "\ea06"; }
|
|
58
|
+
.ez-icon-alert-popup:before { content: "\ea07"; }
|
|
59
|
+
.ez-icon-apps:before { content: "\ea08"; }
|
|
60
|
+
.ez-icon-arrow_back:before { content: "\ea09"; }
|
|
61
|
+
.ez-icon-bell-inverted:before { content: "\ea0a"; }
|
|
62
|
+
.ez-icon-bell:before { content: "\ea0b"; }
|
|
63
|
+
.ez-icon-business-center:before { content: "\ea0c"; }
|
|
64
|
+
.ez-icon-calendar-text:before { content: "\ea0d"; }
|
|
65
|
+
.ez-icon-calendar:before { content: "\ea0e"; }
|
|
66
|
+
.ez-icon-check-circle-inverted:before { content: "\ea0f"; }
|
|
67
|
+
.ez-icon-check-circle:before { content: "\ea10"; }
|
|
68
|
+
.ez-icon-check:before { content: "\ea11"; }
|
|
69
|
+
.ez-icon-chevron-down:before { content: "\ea12"; }
|
|
70
|
+
.ez-icon-chevron-left:before { content: "\ea13"; }
|
|
71
|
+
.ez-icon-chevron-right:before { content: "\ea14"; }
|
|
72
|
+
.ez-icon-chevron-up:before { content: "\ea15"; }
|
|
73
|
+
.ez-icon-circle--medium:before { content: "\ea16"; }
|
|
74
|
+
.ez-icon-circle:before { content: "\ea17"; }
|
|
75
|
+
.ez-icon-clipboard:before { content: "\ea18"; }
|
|
76
|
+
.ez-icon-close-circle-inverted:before { content: "\ea19"; }
|
|
77
|
+
.ez-icon-close-circle:before { content: "\ea1a"; }
|
|
78
|
+
.ez-icon-close:before { content: "\ea1b"; }
|
|
79
|
+
.ez-icon-comment-inverted:before { content: "\ea1c"; }
|
|
80
|
+
.ez-icon-comment:before { content: "\ea1d"; }
|
|
81
|
+
.ez-icon-configuration:before { content: "\ea1e"; }
|
|
82
|
+
.ez-icon-copy:before { content: "\ea1f"; }
|
|
83
|
+
.ez-icon-crop:before { content: "\ea20"; }
|
|
84
|
+
.ez-icon-delete:before { content: "\ea21"; }
|
|
85
|
+
.ez-icon-description:before { content: "\ea22"; }
|
|
86
|
+
.ez-icon-dot-notification:before { content: "\ea23"; }
|
|
87
|
+
.ez-icon-dots-horizontal:before { content: "\ea24"; }
|
|
88
|
+
.ez-icon-dots-vertical:before { content: "\ea25"; }
|
|
89
|
+
.ez-icon-drag-indicator:before { content: "\ea26"; }
|
|
90
|
+
.ez-icon-edit-file:before { content: "\ea27"; }
|
|
91
|
+
.ez-icon-edit-table:before { content: "\ea28"; }
|
|
92
|
+
.ez-icon-edit-time:before { content: "\ea29"; }
|
|
93
|
+
.ez-icon-edit:before { content: "\ea2a"; }
|
|
94
|
+
.ez-icon-email-inverted:before { content: "\ea2b"; }
|
|
95
|
+
.ez-icon-email:before { content: "\ea2c"; }
|
|
96
|
+
.ez-icon-error-octagon:before { content: "\ea2d"; }
|
|
97
|
+
.ez-icon-expand:before { content: "\ea2e"; }
|
|
98
|
+
.ez-icon-eye-off:before { content: "\ea2f"; }
|
|
99
|
+
.ez-icon-eye:before { content: "\ea30"; }
|
|
100
|
+
.ez-icon-favorite:before { content: "\ea31"; }
|
|
101
|
+
.ez-icon-file-download:before { content: "\ea32"; }
|
|
102
|
+
.ez-icon-file-upload:before { content: "\ea33"; }
|
|
103
|
+
.ez-icon-filter:before { content: "\ea34"; }
|
|
104
|
+
.ez-icon-find-file:before { content: "\ea35"; }
|
|
105
|
+
.ez-icon-find-page:before { content: "\ea36"; }
|
|
106
|
+
.ez-icon-format-color-fill:before { content: "\ea37"; }
|
|
107
|
+
.ez-icon-help-circle-outline:before { content: "\ea38"; }
|
|
108
|
+
.ez-icon-help-inverted:before { content: "\ea39"; }
|
|
109
|
+
.ez-icon-help:before { content: "\ea3a"; }
|
|
110
|
+
.ez-icon-home:before { content: "\ea3b"; }
|
|
111
|
+
.ez-icon-language:before { content: "\ea3c"; }
|
|
112
|
+
.ez-icon-launch:before { content: "\ea3d"; }
|
|
113
|
+
.ez-icon-lightbulb:before { content: "\ea3e"; }
|
|
114
|
+
.ez-icon-list:before { content: "\ea3f"; }
|
|
115
|
+
.ez-icon-loading:before { content: "\ea40"; }
|
|
116
|
+
.ez-icon-lock-outline:before { content: "\ea41"; }
|
|
117
|
+
.ez-icon-lock:before { content: "\ea42"; }
|
|
118
|
+
.ez-icon-menu:before { content: "\ea43"; }
|
|
119
|
+
.ez-icon-minus-circle-inverted:before { content: "\ea44"; }
|
|
120
|
+
.ez-icon-minus:before { content: "\ea45"; }
|
|
121
|
+
.ez-icon-money-off:before { content: "\ea46"; }
|
|
122
|
+
.ez-icon-money:before { content: "\ea47"; }
|
|
123
|
+
.ez-icon-north-west:before { content: "\ea48"; }
|
|
124
|
+
.ez-icon-pause:before { content: "\ea49"; }
|
|
125
|
+
.ez-icon-payments:before { content: "\ea4a"; }
|
|
126
|
+
.ez-icon-play:before { content: "\ea4b"; }
|
|
127
|
+
.ez-icon-plus-circle-inverted:before { content: "\ea4c"; }
|
|
128
|
+
.ez-icon-plus-circle:before { content: "\ea4d"; }
|
|
129
|
+
.ez-icon-plus:before { content: "\ea4e"; }
|
|
130
|
+
.ez-icon-power:before { content: "\ea4f"; }
|
|
131
|
+
.ez-icon-push-pin:before { content: "\ea50"; }
|
|
132
|
+
.ez-icon-restore:before { content: "\ea51"; }
|
|
133
|
+
.ez-icon-return:before { content: "\ea52"; }
|
|
134
|
+
.ez-icon-rotate:before { content: "\ea53"; }
|
|
135
|
+
.ez-icon-save:before { content: "\ea54"; }
|
|
136
|
+
.ez-icon-search:before { content: "\ea55"; }
|
|
137
|
+
.ez-icon-settings-inverted:before { content: "\ea56"; }
|
|
138
|
+
.ez-icon-settings:before { content: "\ea57"; }
|
|
139
|
+
.ez-icon-share:before { content: "\ea58"; }
|
|
140
|
+
.ez-icon-shield:before { content: "\ea59"; }
|
|
141
|
+
.ez-icon-south-east:before { content: "\ea5a"; }
|
|
142
|
+
.ez-icon-success-circle:before { content: "\ea5b"; }
|
|
143
|
+
.ez-icon-sync:before { content: "\ea5c"; }
|
|
144
|
+
.ez-icon-table:before { content: "\ea5d"; }
|
|
145
|
+
.ez-icon-timer-outline:before { content: "\ea5e"; }
|
|
146
|
+
.ez-icon-user-circle:before { content: "\ea5f"; }
|
|
147
|
+
.ez-icon-warning-minus:before { content: "\ea60"; }
|
|
148
|
+
.ez-icon-warning-triangle:before { content: "\ea61"; }
|
|
149
|
+
/*
|
|
150
|
+
END CSS GENERATED BY EZ-DESIGN ICONS
|
|
151
|
+
*/
|
|
152
|
+
|
|
153
|
+
.x-small--font {
|
|
154
|
+
font-size: 12px;
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
.small--font {
|
|
158
|
+
font-size: 16px;
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
.medium--font {
|
|
162
|
+
font-size: 20px;
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
.large--font {
|
|
166
|
+
font-size: 24px;
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
.x-large--font {
|
|
170
|
+
font-size: 30px;
|
|
171
|
+
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { StringUtils } from '@sankhyalabs/core';
|
|
1
2
|
import { Component, h, Host, Prop } from '@stencil/core';
|
|
2
3
|
export class EzIcon {
|
|
3
4
|
constructor() {
|
|
@@ -9,13 +10,23 @@ export class EzIcon {
|
|
|
9
10
|
isSprite() {
|
|
10
11
|
return this.href && this.href.indexOf('#') > -1;
|
|
11
12
|
}
|
|
13
|
+
getIconClassName() {
|
|
14
|
+
return `ez-icon-${this.iconName}`;
|
|
15
|
+
}
|
|
16
|
+
getIconContent() {
|
|
17
|
+
if (this.isSprite()) {
|
|
18
|
+
return h("svg", { class: this.size, role: "img" },
|
|
19
|
+
h("use", { xlinkHref: this.href }));
|
|
20
|
+
}
|
|
21
|
+
else if (!StringUtils.isEmpty(this.iconName)) {
|
|
22
|
+
return h("span", { class: `icon-content ${this.getIconClassName()} ${this.size}--font` });
|
|
23
|
+
}
|
|
24
|
+
else {
|
|
25
|
+
return h("img", { class: this.size, src: this.href });
|
|
26
|
+
}
|
|
27
|
+
}
|
|
12
28
|
render() {
|
|
13
|
-
return (h(Host, null, this.
|
|
14
|
-
?
|
|
15
|
-
h("svg", { class: this.size, role: "img" },
|
|
16
|
-
h("use", { xlinkHref: this.href }))
|
|
17
|
-
:
|
|
18
|
-
h("img", { class: this.size, src: this.href })));
|
|
29
|
+
return (h(Host, null, this.getIconContent()));
|
|
19
30
|
}
|
|
20
31
|
static get is() { return "ez-icon"; }
|
|
21
32
|
static get encapsulation() { return "shadow"; }
|
|
@@ -60,6 +71,23 @@ export class EzIcon {
|
|
|
60
71
|
},
|
|
61
72
|
"attribute": "href",
|
|
62
73
|
"reflect": true
|
|
74
|
+
},
|
|
75
|
+
"iconName": {
|
|
76
|
+
"type": "string",
|
|
77
|
+
"mutable": false,
|
|
78
|
+
"complexType": {
|
|
79
|
+
"original": "string",
|
|
80
|
+
"resolved": "string",
|
|
81
|
+
"references": {}
|
|
82
|
+
},
|
|
83
|
+
"required": false,
|
|
84
|
+
"optional": false,
|
|
85
|
+
"docs": {
|
|
86
|
+
"tags": [],
|
|
87
|
+
"text": "Nome do icone dispon\u00EDvel no pacote de fontes [ez-icons](https://sankhyalabs-storybook.herokuapp.com/themes/default/icons/fonts/index.html)"
|
|
88
|
+
},
|
|
89
|
+
"attribute": "icon-name",
|
|
90
|
+
"reflect": true
|
|
63
91
|
}
|
|
64
92
|
}; }
|
|
65
93
|
}
|
|
@@ -84,13 +84,13 @@ let EzButton$1 = class extends HTMLElement$1 {
|
|
|
84
84
|
}
|
|
85
85
|
render() {
|
|
86
86
|
if (this.mode == "icon") {
|
|
87
|
-
return (h("button", { class: "icon " + this.size, type: "button", disabled: !this.enabled }, h("ez-icon", { class: "icon", href: this.image, size: this.getIconSize(), onClick: evt => {
|
|
87
|
+
return (h("button", { class: "icon " + this.size, type: "button", disabled: !this.enabled }, h("ez-icon", { class: "icon", href: this.image, iconName: this.iconName, size: this.getIconSize(), onClick: evt => {
|
|
88
88
|
if (!this.enabled)
|
|
89
89
|
evt.stopPropagation();
|
|
90
90
|
} })));
|
|
91
91
|
}
|
|
92
92
|
else if (this.mode == "label-icon") {
|
|
93
|
-
return (h("div", { class: "label-icon" }, h("button", { class: "icon", type: "button", disabled: !this.enabled }, h("ez-icon", { class: "icon", href: this.image, size: "large", onClick: evt => {
|
|
93
|
+
return (h("div", { class: "label-icon" }, h("button", { class: "icon", type: "button", disabled: !this.enabled }, h("ez-icon", { class: "icon", href: this.image, iconName: this.iconName, size: "large", onClick: evt => {
|
|
94
94
|
if (!this.enabled)
|
|
95
95
|
evt.stopPropagation();
|
|
96
96
|
} })), h("label", { title: this.label }, this.label)));
|
|
@@ -8770,6 +8770,7 @@ class FormMetadata {
|
|
|
8770
8770
|
constructor() {
|
|
8771
8771
|
this._sheets = new Map();
|
|
8772
8772
|
this._requiredFields = [];
|
|
8773
|
+
this._cleanOnCopyFields = [];
|
|
8773
8774
|
}
|
|
8774
8775
|
getSheet(name) {
|
|
8775
8776
|
return this._sheets.get(name);
|
|
@@ -8780,10 +8781,14 @@ class FormMetadata {
|
|
|
8780
8781
|
addSheet(sheet) {
|
|
8781
8782
|
this._sheets.set(sheet.name, sheet);
|
|
8782
8783
|
this._requiredFields = this._requiredFields.concat(sheet.requiredFields);
|
|
8784
|
+
this._cleanOnCopyFields = this._cleanOnCopyFields.concat(sheet.cleanOnCopyFields);
|
|
8783
8785
|
}
|
|
8784
8786
|
getRequiredFields() {
|
|
8785
8787
|
return this._requiredFields;
|
|
8786
8788
|
}
|
|
8789
|
+
getCleanOnCopyFields() {
|
|
8790
|
+
return this._cleanOnCopyFields;
|
|
8791
|
+
}
|
|
8787
8792
|
}
|
|
8788
8793
|
const buildFromDataUnit = (dataUnit) => {
|
|
8789
8794
|
var _a;
|
|
@@ -8797,6 +8802,9 @@ const buildFromDataUnit = (dataUnit) => {
|
|
|
8797
8802
|
items: visibleFields.map(descriptor => { return { descriptor }; }),
|
|
8798
8803
|
requiredFields: visibleFields
|
|
8799
8804
|
.filter(descriptor => descriptor.required)
|
|
8805
|
+
.map(descriptor => descriptor.name),
|
|
8806
|
+
cleanOnCopyFields: visibleFields
|
|
8807
|
+
.filter(descriptor => { var _a; return (_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.cleanOnCopy; })
|
|
8800
8808
|
.map(descriptor => descriptor.name)
|
|
8801
8809
|
});
|
|
8802
8810
|
}
|
|
@@ -8805,7 +8813,9 @@ const buildFromDataUnit = (dataUnit) => {
|
|
|
8805
8813
|
const buildFromConfig = (fields, dataUnit) => {
|
|
8806
8814
|
const sheets = new Map();
|
|
8807
8815
|
const requiredFields = [];
|
|
8816
|
+
const cleanOnCopyFields = [];
|
|
8808
8817
|
fields.forEach(config => {
|
|
8818
|
+
var _a;
|
|
8809
8819
|
if (config.visible !== false) {
|
|
8810
8820
|
const tab = config.tab || "Geral";
|
|
8811
8821
|
const descriptor = dataUnit.getField(config.name);
|
|
@@ -8817,6 +8827,10 @@ const buildFromConfig = (fields, dataUnit) => {
|
|
|
8817
8827
|
if (isRequired) {
|
|
8818
8828
|
requiredFields.push(config.name);
|
|
8819
8829
|
}
|
|
8830
|
+
const clearOnCopy = config.cleanOnCopy === undefined ? (_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.cleanOnCopy : config.cleanOnCopy;
|
|
8831
|
+
if (clearOnCopy) {
|
|
8832
|
+
cleanOnCopyFields.push(config.name);
|
|
8833
|
+
}
|
|
8820
8834
|
const tabItens = sheets.get(tab);
|
|
8821
8835
|
const fieldMD = { config, descriptor };
|
|
8822
8836
|
const group = config.group;
|
|
@@ -8841,7 +8855,8 @@ const buildFromConfig = (fields, dataUnit) => {
|
|
|
8841
8855
|
label: key,
|
|
8842
8856
|
name: key,
|
|
8843
8857
|
items: Array.from(value.values()),
|
|
8844
|
-
requiredFields
|
|
8858
|
+
requiredFields,
|
|
8859
|
+
cleanOnCopyFields
|
|
8845
8860
|
});
|
|
8846
8861
|
});
|
|
8847
8862
|
return metadata;
|
|
@@ -9368,10 +9383,26 @@ let EzForm$1 = class extends HTMLElement$1 {
|
|
|
9368
9383
|
var _a;
|
|
9369
9384
|
return ((_a = this._staticFields) === null || _a === void 0 ? void 0 : _a.length) > 0;
|
|
9370
9385
|
}
|
|
9386
|
+
interceptAction(action) {
|
|
9387
|
+
if (action.type === Action.RECORDS_COPIED) {
|
|
9388
|
+
const metadata = selectFormMetadata(this._store.getState());
|
|
9389
|
+
const cleanFields = metadata.getCleanOnCopyFields();
|
|
9390
|
+
if (cleanFields) {
|
|
9391
|
+
const records = action.payload;
|
|
9392
|
+
return new DataUnitAction(Action.RECORDS_COPIED, records.map(record => {
|
|
9393
|
+
const newRecord = Object.assign({}, record);
|
|
9394
|
+
cleanFields.forEach(fieldName => delete newRecord[fieldName]);
|
|
9395
|
+
return newRecord;
|
|
9396
|
+
}));
|
|
9397
|
+
}
|
|
9398
|
+
}
|
|
9399
|
+
return action;
|
|
9400
|
+
}
|
|
9371
9401
|
componentWillLoad() {
|
|
9372
9402
|
if (this.dataUnit === undefined) {
|
|
9373
9403
|
this.dataUnit = new DataUnit("ez-form");
|
|
9374
9404
|
}
|
|
9405
|
+
this.dataUnit.addInterceptor(this);
|
|
9375
9406
|
this.dataUnit.subscribe(action => {
|
|
9376
9407
|
if (action.type === Action.METADATA_LOADED) {
|
|
9377
9408
|
this.processMetadata();
|
|
@@ -119439,6 +119470,7 @@ class AgGridController {
|
|
|
119439
119470
|
this._columnStateChangeCallback = options.onColumnStateChange;
|
|
119440
119471
|
this._selectionChangeCallback = options.onSelectionChange;
|
|
119441
119472
|
this._paginationChangeCallback = options.onPaginationChange;
|
|
119473
|
+
this._doubleClickCallBack = options.onDoubleClick;
|
|
119442
119474
|
this._multipleSelection = options.allowMultipleSelection;
|
|
119443
119475
|
this._pageSize = options.pageSize;
|
|
119444
119476
|
this._serverURL = options.serverURL;
|
|
@@ -119478,6 +119510,7 @@ class AgGridController {
|
|
|
119478
119510
|
opt.onColumnVisible = e => this.onCallStateChange("visibleChange", e);
|
|
119479
119511
|
opt.onSelectionChanged = e => this.onSelectionChange(e);
|
|
119480
119512
|
opt.onPaginationChanged = () => this.onPaginationChange();
|
|
119513
|
+
opt.onRowDoubleClicked = evt => this.onRowDoubleClick(evt);
|
|
119481
119514
|
}
|
|
119482
119515
|
setOptionsPagination(opt) {
|
|
119483
119516
|
opt.pagination = (this._pageSize > -1);
|
|
@@ -119621,6 +119654,11 @@ class AgGridController {
|
|
|
119621
119654
|
}
|
|
119622
119655
|
}
|
|
119623
119656
|
}
|
|
119657
|
+
onRowDoubleClick(evt) {
|
|
119658
|
+
if (this._doubleClickCallBack) {
|
|
119659
|
+
this._doubleClickCallBack(evt.data);
|
|
119660
|
+
}
|
|
119661
|
+
}
|
|
119624
119662
|
conditionalSet(host, attribute, value) {
|
|
119625
119663
|
if (value !== null && value !== undefined && value !== false) {
|
|
119626
119664
|
host[attribute] = value;
|
|
@@ -119628,25 +119666,6 @@ class AgGridController {
|
|
|
119628
119666
|
}
|
|
119629
119667
|
}
|
|
119630
119668
|
|
|
119631
|
-
const getSpritePath = (sprite) => `${getContextAssetsPath("../assets/actions-sprite.svg")}#${sprite}`;
|
|
119632
|
-
let ctxLoaded = false;
|
|
119633
|
-
function getContextAssetsPath(resource) {
|
|
119634
|
-
if (!ctxLoaded) {
|
|
119635
|
-
const scriptElem = document.querySelector("script[data-ezui-assets-url]");
|
|
119636
|
-
if (scriptElem) {
|
|
119637
|
-
let assetsPath = scriptElem.dataset.ezuiAssetsUrl;
|
|
119638
|
-
if (assetsPath) {
|
|
119639
|
-
if (assetsPath.startsWith('/')) {
|
|
119640
|
-
assetsPath = window.location.origin + assetsPath;
|
|
119641
|
-
}
|
|
119642
|
-
setAssetPath(assetsPath);
|
|
119643
|
-
}
|
|
119644
|
-
}
|
|
119645
|
-
ctxLoaded = true;
|
|
119646
|
-
}
|
|
119647
|
-
return getAssetPath(resource);
|
|
119648
|
-
}
|
|
119649
|
-
|
|
119650
119669
|
class DataUnitBridge {
|
|
119651
119670
|
constructor(gridController, dataUnit) {
|
|
119652
119671
|
this._gridController = gridController;
|
|
@@ -119679,6 +119698,7 @@ let EzGrid$1 = class extends HTMLElement$1 {
|
|
|
119679
119698
|
this.__registerHost();
|
|
119680
119699
|
this.ezColumnStateChange = createEvent(this, "ezColumnStateChange", 7);
|
|
119681
119700
|
this.ezSelectionChange = createEvent(this, "ezSelectionChange", 7);
|
|
119701
|
+
this.ezDoubleClick = createEvent(this, "ezDoubleClick", 7);
|
|
119682
119702
|
this._gridController = new AgGridController(false);
|
|
119683
119703
|
this._popUpVisible = false;
|
|
119684
119704
|
/**
|
|
@@ -119747,6 +119767,9 @@ let EzGrid$1 = class extends HTMLElement$1 {
|
|
|
119747
119767
|
this._navigationLastRow = status.pageEnd;
|
|
119748
119768
|
this._navigationTotalRows = status.totalRows;
|
|
119749
119769
|
},
|
|
119770
|
+
onDoubleClick: (row) => {
|
|
119771
|
+
this.ezDoubleClick.emit(row);
|
|
119772
|
+
},
|
|
119750
119773
|
allowMultipleSelection: this.multipleSelection,
|
|
119751
119774
|
pageSize: this.pageSize,
|
|
119752
119775
|
serverURL: this.serverUrl,
|
|
@@ -119762,8 +119785,8 @@ let EzGrid$1 = class extends HTMLElement$1 {
|
|
|
119762
119785
|
}
|
|
119763
119786
|
return [
|
|
119764
119787
|
h("div", { class: "text text--primary text--medium margin-right--medium" }, h("strong", { class: "text text--primary text--medium" }, `${this._navigationFirstRow}-${this._navigationLastRow}`), ` de ${this._navigationTotalRows}`),
|
|
119765
|
-
h("ez-button", { size: "small",
|
|
119766
|
-
h("ez-button", { size: "small",
|
|
119788
|
+
h("ez-button", { size: "small", iconName: "chevron-left", class: "button--secondary margin-right--medium", mode: "icon", enabled: this._navigationHasPrevious, onClick: () => this._gridController.previousPage(), label: "P\u00E1gina anterior" }),
|
|
119789
|
+
h("ez-button", { size: "small", iconName: "chevron-right", class: "button--secondary margin-right--medium", mode: "icon", enabled: this._navigationHasNext, onClick: () => this._gridController.nextPage(), label: "Pr\u00F3xima P\u00E1gina" })
|
|
119767
119790
|
];
|
|
119768
119791
|
}
|
|
119769
119792
|
applyConfig(cols) {
|
|
@@ -119779,13 +119802,13 @@ let EzGrid$1 = class extends HTMLElement$1 {
|
|
|
119779
119802
|
this._popUpVisible = true;
|
|
119780
119803
|
}
|
|
119781
119804
|
render() {
|
|
119782
|
-
return (h(Host, null, h("div", { class: "box box--shadow padding--medium grid__header margin-bottom--small" }, this.getPaginationControl(), h("ez-button", { size: "small",
|
|
119805
|
+
return (h(Host, null, h("div", { class: "box box--shadow padding--medium grid__header margin-bottom--small" }, this.getPaginationControl(), h("ez-button", { size: "small", iconName: "settings", class: "button--secondary", mode: "icon", onClick: () => { this.openConfig(); } })), h("div", { class: "grid__container ag-sankhya-theme", ref: elem => this._container = elem }), h("div", { class: "grid__footer" }), h("ez-modal", { modalSize: "small", closeEsc: true, closeOutsideClick: true, opened: this._popUpVisible, onEzCloseModal: () => this._popUpVisible = false }, h("grid-config", { ref: ref => this._gridConfig = ref, selectedTab: "Colunas", onConfigFinish: evt => this.applyConfig(evt.detail), onConfigCancel: _evt => this.closeConfig() }))));
|
|
119783
119806
|
}
|
|
119784
119807
|
static get assetsDirs() { return ["../assets"]; }
|
|
119785
119808
|
static get style() { return ezGridCss; }
|
|
119786
119809
|
};
|
|
119787
119810
|
|
|
119788
|
-
const ezIconCss = ":host{display:flex;overflow:hidden;position:relative;--ez-icon--color:var(--icon--color, #ffffff)}svg{display:flex;justify-content:center;align-items:center;fill:var(--ez-icon--color)}.x-small{width:12px;height:12px}.small{width:16px;height:16px}.medium{width:20px;height:20px}.large{width:24px;height:24px}.x-large{width:30px;height:30px}";
|
|
119811
|
+
const ezIconCss = ":host{display:flex;overflow:hidden;position:relative;--ez-icon--color:var(--icon--color, #ffffff)}svg{display:flex;justify-content:center;align-items:center;fill:var(--ez-icon--color)}.x-small{width:12px;height:12px}.small{width:16px;height:16px}.medium{width:20px;height:20px}.large{width:24px;height:24px}.x-large{width:30px;height:30px}[class^=\"ez-icon-\"],[class*=\" ez-icon-\"]{font-family:'ez-icons' !important;font-size:16px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.ez-icon-account-outline:before{content:\"\\ea01\"}.ez-icon-account:before{content:\"\\ea02\"}.ez-icon-alert-circle-inverted:before{content:\"\\ea03\"}.ez-icon-alert-circle:before{content:\"\\ea04\"}.ez-icon-alert-mail:before{content:\"\\ea05\"}.ez-icon-alert-outline:before{content:\"\\ea06\"}.ez-icon-alert-popup:before{content:\"\\ea07\"}.ez-icon-apps:before{content:\"\\ea08\"}.ez-icon-arrow_back:before{content:\"\\ea09\"}.ez-icon-bell-inverted:before{content:\"\\ea0a\"}.ez-icon-bell:before{content:\"\\ea0b\"}.ez-icon-business-center:before{content:\"\\ea0c\"}.ez-icon-calendar-text:before{content:\"\\ea0d\"}.ez-icon-calendar:before{content:\"\\ea0e\"}.ez-icon-check-circle-inverted:before{content:\"\\ea0f\"}.ez-icon-check-circle:before{content:\"\\ea10\"}.ez-icon-check:before{content:\"\\ea11\"}.ez-icon-chevron-down:before{content:\"\\ea12\"}.ez-icon-chevron-left:before{content:\"\\ea13\"}.ez-icon-chevron-right:before{content:\"\\ea14\"}.ez-icon-chevron-up:before{content:\"\\ea15\"}.ez-icon-circle--medium:before{content:\"\\ea16\"}.ez-icon-circle:before{content:\"\\ea17\"}.ez-icon-clipboard:before{content:\"\\ea18\"}.ez-icon-close-circle-inverted:before{content:\"\\ea19\"}.ez-icon-close-circle:before{content:\"\\ea1a\"}.ez-icon-close:before{content:\"\\ea1b\"}.ez-icon-comment-inverted:before{content:\"\\ea1c\"}.ez-icon-comment:before{content:\"\\ea1d\"}.ez-icon-configuration:before{content:\"\\ea1e\"}.ez-icon-copy:before{content:\"\\ea1f\"}.ez-icon-crop:before{content:\"\\ea20\"}.ez-icon-delete:before{content:\"\\ea21\"}.ez-icon-description:before{content:\"\\ea22\"}.ez-icon-dot-notification:before{content:\"\\ea23\"}.ez-icon-dots-horizontal:before{content:\"\\ea24\"}.ez-icon-dots-vertical:before{content:\"\\ea25\"}.ez-icon-drag-indicator:before{content:\"\\ea26\"}.ez-icon-edit-file:before{content:\"\\ea27\"}.ez-icon-edit-table:before{content:\"\\ea28\"}.ez-icon-edit-time:before{content:\"\\ea29\"}.ez-icon-edit:before{content:\"\\ea2a\"}.ez-icon-email-inverted:before{content:\"\\ea2b\"}.ez-icon-email:before{content:\"\\ea2c\"}.ez-icon-error-octagon:before{content:\"\\ea2d\"}.ez-icon-expand:before{content:\"\\ea2e\"}.ez-icon-eye-off:before{content:\"\\ea2f\"}.ez-icon-eye:before{content:\"\\ea30\"}.ez-icon-favorite:before{content:\"\\ea31\"}.ez-icon-file-download:before{content:\"\\ea32\"}.ez-icon-file-upload:before{content:\"\\ea33\"}.ez-icon-filter:before{content:\"\\ea34\"}.ez-icon-find-file:before{content:\"\\ea35\"}.ez-icon-find-page:before{content:\"\\ea36\"}.ez-icon-format-color-fill:before{content:\"\\ea37\"}.ez-icon-help-circle-outline:before{content:\"\\ea38\"}.ez-icon-help-inverted:before{content:\"\\ea39\"}.ez-icon-help:before{content:\"\\ea3a\"}.ez-icon-home:before{content:\"\\ea3b\"}.ez-icon-language:before{content:\"\\ea3c\"}.ez-icon-launch:before{content:\"\\ea3d\"}.ez-icon-lightbulb:before{content:\"\\ea3e\"}.ez-icon-list:before{content:\"\\ea3f\"}.ez-icon-loading:before{content:\"\\ea40\"}.ez-icon-lock-outline:before{content:\"\\ea41\"}.ez-icon-lock:before{content:\"\\ea42\"}.ez-icon-menu:before{content:\"\\ea43\"}.ez-icon-minus-circle-inverted:before{content:\"\\ea44\"}.ez-icon-minus:before{content:\"\\ea45\"}.ez-icon-money-off:before{content:\"\\ea46\"}.ez-icon-money:before{content:\"\\ea47\"}.ez-icon-north-west:before{content:\"\\ea48\"}.ez-icon-pause:before{content:\"\\ea49\"}.ez-icon-payments:before{content:\"\\ea4a\"}.ez-icon-play:before{content:\"\\ea4b\"}.ez-icon-plus-circle-inverted:before{content:\"\\ea4c\"}.ez-icon-plus-circle:before{content:\"\\ea4d\"}.ez-icon-plus:before{content:\"\\ea4e\"}.ez-icon-power:before{content:\"\\ea4f\"}.ez-icon-push-pin:before{content:\"\\ea50\"}.ez-icon-restore:before{content:\"\\ea51\"}.ez-icon-return:before{content:\"\\ea52\"}.ez-icon-rotate:before{content:\"\\ea53\"}.ez-icon-save:before{content:\"\\ea54\"}.ez-icon-search:before{content:\"\\ea55\"}.ez-icon-settings-inverted:before{content:\"\\ea56\"}.ez-icon-settings:before{content:\"\\ea57\"}.ez-icon-share:before{content:\"\\ea58\"}.ez-icon-shield:before{content:\"\\ea59\"}.ez-icon-south-east:before{content:\"\\ea5a\"}.ez-icon-success-circle:before{content:\"\\ea5b\"}.ez-icon-sync:before{content:\"\\ea5c\"}.ez-icon-table:before{content:\"\\ea5d\"}.ez-icon-timer-outline:before{content:\"\\ea5e\"}.ez-icon-user-circle:before{content:\"\\ea5f\"}.ez-icon-warning-minus:before{content:\"\\ea60\"}.ez-icon-warning-triangle:before{content:\"\\ea61\"}.x-small--font{font-size:12px}.small--font{font-size:16px}.medium--font{font-size:20px}.large--font{font-size:24px}.x-large--font{font-size:30px}";
|
|
119789
119812
|
|
|
119790
119813
|
let EzIcon$1 = class extends HTMLElement$1 {
|
|
119791
119814
|
constructor() {
|
|
@@ -119800,12 +119823,22 @@ let EzIcon$1 = class extends HTMLElement$1 {
|
|
|
119800
119823
|
isSprite() {
|
|
119801
119824
|
return this.href && this.href.indexOf('#') > -1;
|
|
119802
119825
|
}
|
|
119826
|
+
getIconClassName() {
|
|
119827
|
+
return `ez-icon-${this.iconName}`;
|
|
119828
|
+
}
|
|
119829
|
+
getIconContent() {
|
|
119830
|
+
if (this.isSprite()) {
|
|
119831
|
+
return h("svg", { class: this.size, role: "img" }, h("use", { xlinkHref: this.href }));
|
|
119832
|
+
}
|
|
119833
|
+
else if (!StringUtils.isEmpty(this.iconName)) {
|
|
119834
|
+
return h("span", { class: `icon-content ${this.getIconClassName()} ${this.size}--font` });
|
|
119835
|
+
}
|
|
119836
|
+
else {
|
|
119837
|
+
return h("img", { class: this.size, src: this.href });
|
|
119838
|
+
}
|
|
119839
|
+
}
|
|
119803
119840
|
render() {
|
|
119804
|
-
return (h(Host, null, this.
|
|
119805
|
-
?
|
|
119806
|
-
h("svg", { class: this.size, role: "img" }, h("use", { xlinkHref: this.href }))
|
|
119807
|
-
:
|
|
119808
|
-
h("img", { class: this.size, src: this.href })));
|
|
119841
|
+
return (h(Host, null, this.getIconContent()));
|
|
119809
119842
|
}
|
|
119810
119843
|
static get style() { return ezIconCss; }
|
|
119811
119844
|
};
|
|
@@ -121167,6 +121200,25 @@ let EzTextInput$1 = class extends HTMLElement$1 {
|
|
|
121167
121200
|
static get style() { return ezTextInputCss; }
|
|
121168
121201
|
};
|
|
121169
121202
|
|
|
121203
|
+
const getSpritePath = (sprite) => `${getContextAssetsPath("../assets/actions-sprite.svg")}#${sprite}`;
|
|
121204
|
+
let ctxLoaded = false;
|
|
121205
|
+
function getContextAssetsPath(resource) {
|
|
121206
|
+
if (!ctxLoaded) {
|
|
121207
|
+
const scriptElem = document.querySelector("script[data-ezui-assets-url]");
|
|
121208
|
+
if (scriptElem) {
|
|
121209
|
+
let assetsPath = scriptElem.dataset.ezuiAssetsUrl;
|
|
121210
|
+
if (assetsPath) {
|
|
121211
|
+
if (assetsPath.startsWith('/')) {
|
|
121212
|
+
assetsPath = window.location.origin + assetsPath;
|
|
121213
|
+
}
|
|
121214
|
+
setAssetPath(assetsPath);
|
|
121215
|
+
}
|
|
121216
|
+
}
|
|
121217
|
+
ctxLoaded = true;
|
|
121218
|
+
}
|
|
121219
|
+
return getAssetPath(resource);
|
|
121220
|
+
}
|
|
121221
|
+
|
|
121170
121222
|
const ezTimeInputCss = ":host{display:flex;flex-wrap:wrap;position:relative;width:100%}";
|
|
121171
121223
|
|
|
121172
121224
|
let EzTimeInput$1 = class extends HTMLElement$1 {
|
|
@@ -121992,7 +122044,7 @@ let TestDu$1 = class extends HTMLElement$1 {
|
|
|
121992
122044
|
|
|
121993
122045
|
const EzActionChip = /*@__PURE__*/proxyCustomElement(EzLabelChip$2, [1,"ez-action-chip",{"label":[513],"enabled":[516]}]);
|
|
121994
122046
|
const EzApplication = /*@__PURE__*/proxyCustomElement(EzApplication$1, [0,"ez-application"]);
|
|
121995
|
-
const EzButton = /*@__PURE__*/proxyCustomElement(EzButton$1, [1,"ez-button",{"label":[513],"enabled":[516],"mode":[513],"image":[513],"size":[513]}]);
|
|
122047
|
+
const EzButton = /*@__PURE__*/proxyCustomElement(EzButton$1, [1,"ez-button",{"label":[513],"enabled":[516],"mode":[513],"image":[513],"iconName":[513,"icon-name"],"size":[513]}]);
|
|
121996
122048
|
const EzCalendar = /*@__PURE__*/proxyCustomElement(EzCalendar$1, [1,"ez-calendar",{"value":[1040],"floating":[516],"time":[516],"showSeconds":[516,"show-seconds"]}]);
|
|
121997
122049
|
const EzCheck = /*@__PURE__*/proxyCustomElement(EzCheck$1, [1,"ez-check",{"label":[513],"value":[1540],"enabled":[516],"mode":[513]}]);
|
|
121998
122050
|
const EzCollapsibleBox = /*@__PURE__*/proxyCustomElement(EzCollapsibleBox$1, [1,"ez-collapsible-box",{"value":[1540],"label":[513],"headerSize":[513,"header-size"],"iconPlacement":[513,"icon-placement"]}]);
|
|
@@ -122002,7 +122054,7 @@ const EzDateTimeInput = /*@__PURE__*/proxyCustomElement(EzDateTimeInput$1, [1,"e
|
|
|
122002
122054
|
const EzDialog = /*@__PURE__*/proxyCustomElement(EzDialog$1, [1,"ez-dialog",{"confirm":[1028],"critical":[1028],"message":[1025],"opened":[1540],"personalizedIconPath":[1025,"personalized-icon-path"],"ezTitle":[1025,"ez-title"]}]);
|
|
122003
122055
|
const EzForm = /*@__PURE__*/proxyCustomElement(EzForm$1, [0,"ez-form",{"dataUnit":[1040],"config":[16]}]);
|
|
122004
122056
|
const EzGrid = /*@__PURE__*/proxyCustomElement(EzGrid$1, [2,"ez-grid",{"multipleSelection":[4,"multiple-selection"],"pageSize":[2,"page-size"],"serverUrl":[1,"server-url"],"dataUnit":[16],"_navigationHasPrevious":[32],"_navigationHasNext":[32],"_navigationFirstRow":[32],"_navigationLastRow":[32],"_navigationTotalRows":[32],"_popUpVisible":[32]}]);
|
|
122005
|
-
const EzIcon = /*@__PURE__*/proxyCustomElement(EzIcon$1, [1,"ez-icon",{"size":[513],"href":[513]}]);
|
|
122057
|
+
const EzIcon = /*@__PURE__*/proxyCustomElement(EzIcon$1, [1,"ez-icon",{"size":[513],"href":[513],"iconName":[513,"icon-name"]}]);
|
|
122006
122058
|
const EzLabelChip = /*@__PURE__*/proxyCustomElement(EzLabelChip$1, [1,"ez-label-chip",{"label":[513],"enabled":[516],"removable":[516],"value":[1540]}]);
|
|
122007
122059
|
const EzList = /*@__PURE__*/proxyCustomElement(EzList$1, [1,"ez-list",{"dataSource":[1040],"useGroups":[1540,"use-groups"],"ezDraggable":[1028,"ez-draggable"],"ezSelectable":[1028,"ez-selectable"],"itemSlotBuilder":[1040],"_listItems":[32],"_listGroupItems":[32]}]);
|
|
122008
122060
|
const EzModal = /*@__PURE__*/proxyCustomElement(EzModal$1, [1,"ez-modal",{"modalSize":[1,"modal-size"],"align":[1],"opened":[1028],"closeEsc":[4,"close-esc"],"closeOutsideClick":[4,"close-outside-click"]}]);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, h, c as createEvent, H as Host, g as getElement } from './index-d80a8d1f.js';
|
|
2
|
-
import { c as createCommonjsModule, a as commonjsGlobal, A as Action, M as MaskFormatter, D as DataUnit, b as DataType, U as UserInterface } from './index-
|
|
2
|
+
import { c as createCommonjsModule, a as commonjsGlobal, A as Action, M as MaskFormatter, D as DataUnit, b as DataType, U as UserInterface } from './index-4fb1605f.js';
|
|
3
3
|
import { g as getSpritePath } from './AssetsUtils-9b1d9c38.js';
|
|
4
4
|
|
|
5
5
|
const ezButtonCss = ":host{--ez-button--min-width:100px;--ez-button--height:42px;--ez-button__icon--width:18px;--ez-button__inline__icon--padding:12px;--ez-button--padding-top:var(--space--medium, 12px);--ez-button--padding-bottom:var(--space--medium, 12px);--ez-button--padding-right:var(--space--large, 24px);--ez-button--padding-left:var(--space--large, 24px);--ez-button--color:var(--text--primary, #FFF);--ez-button--font-size:var(--text--medium, 14px);--ez-button--font-family:var(--font-pattern, Arial);--ez-button--font-weight:var(--text-weight--large);--ez-button--background-color:var(--background--medium, #c0c0c0);--ez-button--border-radius:var(--border--radius-large, 12px);--ez-button--border:none;--ez-button--hover--background-color:var(--background--strong, var(--ez-button--background-color));--ez-button--disabled-color:var(--text--disable);--ez-button--disabled--background-color:var(--color--disable-secondary);--ez-button--focus--border:var(--ez-button--border);--ez-button--focus--box-shadow:none;--ez-button--link-color:var(--title--primary, '#C0C0C0')}ez-icon{--ez-icon--color:inherit}button{display:flex;align-items:center;justify-content:center;margin:0;cursor:pointer;transition:background-color 0.2s linear;min-width:var(--ez-button--min-width);height:var(--ez-button--height);font-family:var(--ez-button--font-family);font-size:var(--ez-button--font-size);font-weight:var(--ez-button--font-weight);padding:var(--ez-button--padding-top) var(--ez-button--padding-right) var(--ez-button--padding-bottom) var(--ez-button--padding-left);border-radius:var(--ez-button--border-radius);background-color:var(--ez-button--background-color);color:var(--ez-button--color);fill:var(--ez-button--color);border:var(--ez-button--border)}button:hover{background-color:var(--ez-button--hover--background-color)}button:focus{outline:none;border:var(--ez-button--focus--border);box-shadow:var(--ez-button--focus--box-shadow)}button:disabled{background-color:var(--ez-button--disabled--background-color);color:var(--ez-button--disabled-color);fill:var(--ez-button--disabled-color);border:none;cursor:no-drop}button.icon{padding:0px}button.small{width:32px;min-width:32px;height:32px}button.medium{width:42px;min-width:42px;height:42px}button.large{width:52px;min-width:52px;height:52px}.label-icon{display:flex;flex-direction:column;align-items:center;color:var(--ez-button--color)}.label-icon label{max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;font-family:var(--ez-button--font-family);font-size:var(--ez-button--font-size);font-weight:var(--ez-button--font-weight)}a{font-family:var(--ez-button--font-family);font-size:var(--ez-button--font-size);font-weight:var(--ez-button--font-weight);color:var(--ez-button--link-color);cursor:pointer;display:flex;align-items:center;justify-content:center;}";
|
|
@@ -41,13 +41,13 @@ let EzButton = class {
|
|
|
41
41
|
}
|
|
42
42
|
render() {
|
|
43
43
|
if (this.mode == "icon") {
|
|
44
|
-
return (h("button", { class: "icon " + this.size, type: "button", disabled: !this.enabled }, h("ez-icon", { class: "icon", href: this.image, size: this.getIconSize(), onClick: evt => {
|
|
44
|
+
return (h("button", { class: "icon " + this.size, type: "button", disabled: !this.enabled }, h("ez-icon", { class: "icon", href: this.image, iconName: this.iconName, size: this.getIconSize(), onClick: evt => {
|
|
45
45
|
if (!this.enabled)
|
|
46
46
|
evt.stopPropagation();
|
|
47
47
|
} })));
|
|
48
48
|
}
|
|
49
49
|
else if (this.mode == "label-icon") {
|
|
50
|
-
return (h("div", { class: "label-icon" }, h("button", { class: "icon", type: "button", disabled: !this.enabled }, h("ez-icon", { class: "icon", href: this.image, size: "large", onClick: evt => {
|
|
50
|
+
return (h("div", { class: "label-icon" }, h("button", { class: "icon", type: "button", disabled: !this.enabled }, h("ez-icon", { class: "icon", href: this.image, iconName: this.iconName, size: "large", onClick: evt => {
|
|
51
51
|
if (!this.enabled)
|
|
52
52
|
evt.stopPropagation();
|
|
53
53
|
} })), h("label", { title: this.label }, this.label)));
|
|
@@ -110174,6 +110174,7 @@ class AgGridController {
|
|
|
110174
110174
|
this._columnStateChangeCallback = options.onColumnStateChange;
|
|
110175
110175
|
this._selectionChangeCallback = options.onSelectionChange;
|
|
110176
110176
|
this._paginationChangeCallback = options.onPaginationChange;
|
|
110177
|
+
this._doubleClickCallBack = options.onDoubleClick;
|
|
110177
110178
|
this._multipleSelection = options.allowMultipleSelection;
|
|
110178
110179
|
this._pageSize = options.pageSize;
|
|
110179
110180
|
this._serverURL = options.serverURL;
|
|
@@ -110213,6 +110214,7 @@ class AgGridController {
|
|
|
110213
110214
|
opt.onColumnVisible = e => this.onCallStateChange("visibleChange", e);
|
|
110214
110215
|
opt.onSelectionChanged = e => this.onSelectionChange(e);
|
|
110215
110216
|
opt.onPaginationChanged = () => this.onPaginationChange();
|
|
110217
|
+
opt.onRowDoubleClicked = evt => this.onRowDoubleClick(evt);
|
|
110216
110218
|
}
|
|
110217
110219
|
setOptionsPagination(opt) {
|
|
110218
110220
|
opt.pagination = (this._pageSize > -1);
|
|
@@ -110356,6 +110358,11 @@ class AgGridController {
|
|
|
110356
110358
|
}
|
|
110357
110359
|
}
|
|
110358
110360
|
}
|
|
110361
|
+
onRowDoubleClick(evt) {
|
|
110362
|
+
if (this._doubleClickCallBack) {
|
|
110363
|
+
this._doubleClickCallBack(evt.data);
|
|
110364
|
+
}
|
|
110365
|
+
}
|
|
110359
110366
|
conditionalSet(host, attribute, value) {
|
|
110360
110367
|
if (value !== null && value !== undefined && value !== false) {
|
|
110361
110368
|
host[attribute] = value;
|
|
@@ -110448,6 +110455,7 @@ let EzGrid = class {
|
|
|
110448
110455
|
registerInstance(this, hostRef);
|
|
110449
110456
|
this.ezColumnStateChange = createEvent(this, "ezColumnStateChange", 7);
|
|
110450
110457
|
this.ezSelectionChange = createEvent(this, "ezSelectionChange", 7);
|
|
110458
|
+
this.ezDoubleClick = createEvent(this, "ezDoubleClick", 7);
|
|
110451
110459
|
this._gridController = new AgGridController(false);
|
|
110452
110460
|
this._popUpVisible = false;
|
|
110453
110461
|
/**
|
|
@@ -110516,6 +110524,9 @@ let EzGrid = class {
|
|
|
110516
110524
|
this._navigationLastRow = status.pageEnd;
|
|
110517
110525
|
this._navigationTotalRows = status.totalRows;
|
|
110518
110526
|
},
|
|
110527
|
+
onDoubleClick: (row) => {
|
|
110528
|
+
this.ezDoubleClick.emit(row);
|
|
110529
|
+
},
|
|
110519
110530
|
allowMultipleSelection: this.multipleSelection,
|
|
110520
110531
|
pageSize: this.pageSize,
|
|
110521
110532
|
serverURL: this.serverUrl,
|
|
@@ -110531,8 +110542,8 @@ let EzGrid = class {
|
|
|
110531
110542
|
}
|
|
110532
110543
|
return [
|
|
110533
110544
|
h("div", { class: "text text--primary text--medium margin-right--medium" }, h("strong", { class: "text text--primary text--medium" }, `${this._navigationFirstRow}-${this._navigationLastRow}`), ` de ${this._navigationTotalRows}`),
|
|
110534
|
-
h("ez-button", { size: "small",
|
|
110535
|
-
h("ez-button", { size: "small",
|
|
110545
|
+
h("ez-button", { size: "small", iconName: "chevron-left", class: "button--secondary margin-right--medium", mode: "icon", enabled: this._navigationHasPrevious, onClick: () => this._gridController.previousPage(), label: "P\u00E1gina anterior" }),
|
|
110546
|
+
h("ez-button", { size: "small", iconName: "chevron-right", class: "button--secondary margin-right--medium", mode: "icon", enabled: this._navigationHasNext, onClick: () => this._gridController.nextPage(), label: "Pr\u00F3xima P\u00E1gina" })
|
|
110536
110547
|
];
|
|
110537
110548
|
}
|
|
110538
110549
|
applyConfig(cols) {
|
|
@@ -110548,13 +110559,13 @@ let EzGrid = class {
|
|
|
110548
110559
|
this._popUpVisible = true;
|
|
110549
110560
|
}
|
|
110550
110561
|
render() {
|
|
110551
|
-
return (h(Host, null, h("div", { class: "box box--shadow padding--medium grid__header margin-bottom--small" }, this.getPaginationControl(), h("ez-button", { size: "small",
|
|
110562
|
+
return (h(Host, null, h("div", { class: "box box--shadow padding--medium grid__header margin-bottom--small" }, this.getPaginationControl(), h("ez-button", { size: "small", iconName: "settings", class: "button--secondary", mode: "icon", onClick: () => { this.openConfig(); } })), h("div", { class: "grid__container ag-sankhya-theme", ref: elem => this._container = elem }), h("div", { class: "grid__footer" }), h("ez-modal", { modalSize: "small", closeEsc: true, closeOutsideClick: true, opened: this._popUpVisible, onEzCloseModal: () => this._popUpVisible = false }, h("grid-config", { ref: ref => this._gridConfig = ref, selectedTab: "Colunas", onConfigFinish: evt => this.applyConfig(evt.detail), onConfigCancel: _evt => this.closeConfig() }))));
|
|
110552
110563
|
}
|
|
110553
110564
|
static get assetsDirs() { return ["../assets"]; }
|
|
110554
110565
|
};
|
|
110555
110566
|
EzGrid.style = ezGridCss;
|
|
110556
110567
|
|
|
110557
|
-
const ezIconCss = ":host{display:flex;overflow:hidden;position:relative;--ez-icon--color:var(--icon--color, #ffffff)}svg{display:flex;justify-content:center;align-items:center;fill:var(--ez-icon--color)}.x-small{width:12px;height:12px}.small{width:16px;height:16px}.medium{width:20px;height:20px}.large{width:24px;height:24px}.x-large{width:30px;height:30px}";
|
|
110568
|
+
const ezIconCss = ":host{display:flex;overflow:hidden;position:relative;--ez-icon--color:var(--icon--color, #ffffff)}svg{display:flex;justify-content:center;align-items:center;fill:var(--ez-icon--color)}.x-small{width:12px;height:12px}.small{width:16px;height:16px}.medium{width:20px;height:20px}.large{width:24px;height:24px}.x-large{width:30px;height:30px}[class^=\"ez-icon-\"],[class*=\" ez-icon-\"]{font-family:'ez-icons' !important;font-size:16px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.ez-icon-account-outline:before{content:\"\\ea01\"}.ez-icon-account:before{content:\"\\ea02\"}.ez-icon-alert-circle-inverted:before{content:\"\\ea03\"}.ez-icon-alert-circle:before{content:\"\\ea04\"}.ez-icon-alert-mail:before{content:\"\\ea05\"}.ez-icon-alert-outline:before{content:\"\\ea06\"}.ez-icon-alert-popup:before{content:\"\\ea07\"}.ez-icon-apps:before{content:\"\\ea08\"}.ez-icon-arrow_back:before{content:\"\\ea09\"}.ez-icon-bell-inverted:before{content:\"\\ea0a\"}.ez-icon-bell:before{content:\"\\ea0b\"}.ez-icon-business-center:before{content:\"\\ea0c\"}.ez-icon-calendar-text:before{content:\"\\ea0d\"}.ez-icon-calendar:before{content:\"\\ea0e\"}.ez-icon-check-circle-inverted:before{content:\"\\ea0f\"}.ez-icon-check-circle:before{content:\"\\ea10\"}.ez-icon-check:before{content:\"\\ea11\"}.ez-icon-chevron-down:before{content:\"\\ea12\"}.ez-icon-chevron-left:before{content:\"\\ea13\"}.ez-icon-chevron-right:before{content:\"\\ea14\"}.ez-icon-chevron-up:before{content:\"\\ea15\"}.ez-icon-circle--medium:before{content:\"\\ea16\"}.ez-icon-circle:before{content:\"\\ea17\"}.ez-icon-clipboard:before{content:\"\\ea18\"}.ez-icon-close-circle-inverted:before{content:\"\\ea19\"}.ez-icon-close-circle:before{content:\"\\ea1a\"}.ez-icon-close:before{content:\"\\ea1b\"}.ez-icon-comment-inverted:before{content:\"\\ea1c\"}.ez-icon-comment:before{content:\"\\ea1d\"}.ez-icon-configuration:before{content:\"\\ea1e\"}.ez-icon-copy:before{content:\"\\ea1f\"}.ez-icon-crop:before{content:\"\\ea20\"}.ez-icon-delete:before{content:\"\\ea21\"}.ez-icon-description:before{content:\"\\ea22\"}.ez-icon-dot-notification:before{content:\"\\ea23\"}.ez-icon-dots-horizontal:before{content:\"\\ea24\"}.ez-icon-dots-vertical:before{content:\"\\ea25\"}.ez-icon-drag-indicator:before{content:\"\\ea26\"}.ez-icon-edit-file:before{content:\"\\ea27\"}.ez-icon-edit-table:before{content:\"\\ea28\"}.ez-icon-edit-time:before{content:\"\\ea29\"}.ez-icon-edit:before{content:\"\\ea2a\"}.ez-icon-email-inverted:before{content:\"\\ea2b\"}.ez-icon-email:before{content:\"\\ea2c\"}.ez-icon-error-octagon:before{content:\"\\ea2d\"}.ez-icon-expand:before{content:\"\\ea2e\"}.ez-icon-eye-off:before{content:\"\\ea2f\"}.ez-icon-eye:before{content:\"\\ea30\"}.ez-icon-favorite:before{content:\"\\ea31\"}.ez-icon-file-download:before{content:\"\\ea32\"}.ez-icon-file-upload:before{content:\"\\ea33\"}.ez-icon-filter:before{content:\"\\ea34\"}.ez-icon-find-file:before{content:\"\\ea35\"}.ez-icon-find-page:before{content:\"\\ea36\"}.ez-icon-format-color-fill:before{content:\"\\ea37\"}.ez-icon-help-circle-outline:before{content:\"\\ea38\"}.ez-icon-help-inverted:before{content:\"\\ea39\"}.ez-icon-help:before{content:\"\\ea3a\"}.ez-icon-home:before{content:\"\\ea3b\"}.ez-icon-language:before{content:\"\\ea3c\"}.ez-icon-launch:before{content:\"\\ea3d\"}.ez-icon-lightbulb:before{content:\"\\ea3e\"}.ez-icon-list:before{content:\"\\ea3f\"}.ez-icon-loading:before{content:\"\\ea40\"}.ez-icon-lock-outline:before{content:\"\\ea41\"}.ez-icon-lock:before{content:\"\\ea42\"}.ez-icon-menu:before{content:\"\\ea43\"}.ez-icon-minus-circle-inverted:before{content:\"\\ea44\"}.ez-icon-minus:before{content:\"\\ea45\"}.ez-icon-money-off:before{content:\"\\ea46\"}.ez-icon-money:before{content:\"\\ea47\"}.ez-icon-north-west:before{content:\"\\ea48\"}.ez-icon-pause:before{content:\"\\ea49\"}.ez-icon-payments:before{content:\"\\ea4a\"}.ez-icon-play:before{content:\"\\ea4b\"}.ez-icon-plus-circle-inverted:before{content:\"\\ea4c\"}.ez-icon-plus-circle:before{content:\"\\ea4d\"}.ez-icon-plus:before{content:\"\\ea4e\"}.ez-icon-power:before{content:\"\\ea4f\"}.ez-icon-push-pin:before{content:\"\\ea50\"}.ez-icon-restore:before{content:\"\\ea51\"}.ez-icon-return:before{content:\"\\ea52\"}.ez-icon-rotate:before{content:\"\\ea53\"}.ez-icon-save:before{content:\"\\ea54\"}.ez-icon-search:before{content:\"\\ea55\"}.ez-icon-settings-inverted:before{content:\"\\ea56\"}.ez-icon-settings:before{content:\"\\ea57\"}.ez-icon-share:before{content:\"\\ea58\"}.ez-icon-shield:before{content:\"\\ea59\"}.ez-icon-south-east:before{content:\"\\ea5a\"}.ez-icon-success-circle:before{content:\"\\ea5b\"}.ez-icon-sync:before{content:\"\\ea5c\"}.ez-icon-table:before{content:\"\\ea5d\"}.ez-icon-timer-outline:before{content:\"\\ea5e\"}.ez-icon-user-circle:before{content:\"\\ea5f\"}.ez-icon-warning-minus:before{content:\"\\ea60\"}.ez-icon-warning-triangle:before{content:\"\\ea61\"}.x-small--font{font-size:12px}.small--font{font-size:16px}.medium--font{font-size:20px}.large--font{font-size:24px}.x-large--font{font-size:30px}";
|
|
110558
110569
|
|
|
110559
110570
|
let EzIcon = class {
|
|
110560
110571
|
constructor(hostRef) {
|
|
@@ -110567,12 +110578,22 @@ let EzIcon = class {
|
|
|
110567
110578
|
isSprite() {
|
|
110568
110579
|
return this.href && this.href.indexOf('#') > -1;
|
|
110569
110580
|
}
|
|
110581
|
+
getIconClassName() {
|
|
110582
|
+
return `ez-icon-${this.iconName}`;
|
|
110583
|
+
}
|
|
110584
|
+
getIconContent() {
|
|
110585
|
+
if (this.isSprite()) {
|
|
110586
|
+
return h("svg", { class: this.size, role: "img" }, h("use", { xlinkHref: this.href }));
|
|
110587
|
+
}
|
|
110588
|
+
else if (!StringUtils.isEmpty(this.iconName)) {
|
|
110589
|
+
return h("span", { class: `icon-content ${this.getIconClassName()} ${this.size}--font` });
|
|
110590
|
+
}
|
|
110591
|
+
else {
|
|
110592
|
+
return h("img", { class: this.size, src: this.href });
|
|
110593
|
+
}
|
|
110594
|
+
}
|
|
110570
110595
|
render() {
|
|
110571
|
-
return (h(Host, null, this.
|
|
110572
|
-
?
|
|
110573
|
-
h("svg", { class: this.size, role: "img" }, h("use", { xlinkHref: this.href }))
|
|
110574
|
-
:
|
|
110575
|
-
h("img", { class: this.size, src: this.href })));
|
|
110596
|
+
return (h(Host, null, this.getIconContent()));
|
|
110576
110597
|
}
|
|
110577
110598
|
};
|
|
110578
110599
|
EzIcon.style = ezIconCss;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, f as forceUpdate, h } from './index-d80a8d1f.js';
|
|
2
|
-
import './index-
|
|
2
|
+
import './index-4fb1605f.js';
|
|
3
3
|
import { F as FloatingManager } from './FloatingManager-bb90ef41.js';
|
|
4
4
|
|
|
5
5
|
const ezCalendarCss = ":host{--ez-calendar--font-family:var(--font-pattern, Arial);--ez-calendar--color:var(--title--primary, #626e82);--ez-calendar--text-shadow:var(--text-shadow, 0 0 0 #353535, 0 0 1px transparent);--ez-calendar__body--background-color:var(--background--xlight, #FFF);--ez-calendar__Time--background-color:var(--background--xlight, #FAFAFA);--ez-calendar__body--padding:var(--space--medium, 12px);--ez-calendar__body--border-radius:var(--border--radius-medium, 12px);--ez-calendar__body--shadow:var(--shadow, 0px 0px 16px 0px #000);--ez-calendar__header-line--stroke:2px;--ez-calendar__header-line--color:var(--color--strokes, #C0C0C0);--ez-calendar__nav-btn--fill:var(--text--primary, #008561);--ez-calendar__nav-btn--hover--fill:var(--color--primary, #350404);--ez-calendar__nav-btn--width:10px;--ez-calendar__nav-btn--height:16px;--ez-calendar__nav-btn--previous-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"10px\"><path d=\"M 9.7808475,13.860393 3.9204526,8.0000004 9.7808475,2.0624965 7.9301965,0.28895552 0.21915255,8.0000004 7.9301965,15.711044 Z\"/></svg>');--ez-calendar__nav-btn--next-image: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>');--ez-calendar__cell--margin:0px var(--space--small, 12px);--ez-calendar__cell--width:var(--space--large, 24px);--ez-calendar__cell--padding:var(--space--extra-small, 3px) 0px;--ez-calendar__cell--border-radius:var(--border--radius-small, 6px);--ez-calendar__cell--over--background-color:var(--color--strokes, #E2F4EF);--ez-calendar__cell--outset--color:var(--color--strokes, #C0C0C0);--ez-calendar__cell--selected--background-color:var(--color--primary, #008561);--ez-calendar__cell--selected--color:var(--color--inverted, #FFF);--ez-calendar__btn-today--color:var(--color--primary);--ez-calendar__btn-today--hover--background-color:var(--color--strokes, #E2F4EF);--ez-calendar__btn-today--border-radius:var(--border--radius-small, 6px);position:relative;display:flex;user-select:none}.calendar{z-index:var(--more-visible, 2);display:flex;flex-direction:column;background-color:var(--ez-calendar__body--background-color);padding:var(--ez-calendar__body--padding);border-radius:var(--ez-calendar__body--border-radius);box-shadow:var(--ez-calendar__body--shadow)}.calendar__header{display:flex;justify-content:space-between;padding-bottom:var(--space--medium, 12px);margin:var(--space--small, 6px) var(--space--, 12px);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow);border-bottom:solid var(--ez-calendar__header-line--stroke) var(--ez-calendar__header-line--color)}.calendar__btn-next,.calendar__btn-previous{outline:none;border:none;background-color:unset;cursor:pointer;padding:0px}.calendar__btn-next::after,.calendar__btn-previous::after{content:'';display:flex;background-color:var(--ez-calendar__nav-btn--fill);width:var(--ez-calendar__nav-btn--width);height:var(--ez-calendar__nav-btn--height)}.calendar__btn-previous::after{-webkit-mask-image:var(--ez-calendar__nav-btn--previous-image);mask-image:var(--ez-calendar__nav-btn--previous-image)}.calendar__btn-next::after{-webkit-mask-image:var(--ez-calendar__nav-btn--next-image);mask-image:var(--ez-calendar__nav-btn--next-image)}.calendar__btn-next:hover::after,.calendar__btn-previous:hover::after{background-color:var(--ez-calendar__nav-btn--hover--fill)}.calendar__lbl-month{font-weight:var(--text-weight--large, 600);font-size:var(--title--medium, 16px);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow)}.calendar__line{display:flex;padding:0px;margin:0px}.calendar__cell{display:flex;justify-content:center;align-content:center;cursor:pointer;font-size:var(--text--small, 12px);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow);padding:var(--ez-calendar__cell--padding);margin:var(--ez-calendar__cell--margin);min-width:var(--ez-calendar__cell--width);border-radius:var(--ez-calendar__cell--border-radius)}.calendar__cell:hover{background-color:var(--ez-calendar__cell--over--background-color)}.calendar__cell--secondary{color:var(--ez-calendar__cell--outset--color)}.calendar__cell--unselectable:hover{background-color:unset;border-radius:unset;cursor:unset}.calendar__cell--unselectable{font-weight:var(--text-weight--large, 600);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow)}.calendar__cell--selected,.calendar__cell--selected:hover{background-color:var(--ez-calendar__cell--selected--background-color);color:var(--ez-calendar__cell--selected--color)}.calendar__body{padding:var(--space--small, 6px) 0px}.calendar__footer{display:flex;flex-direction:column}.calendar__btn-today{border:none;background-color:unset;cursor:pointer;font-weight:var(--text-weight--large, 600);font-size:var(--title--small);padding:var(--space--extra-small, 6px);font-family:var(--ez-calendar--font-family);text-shadow:var(--ez-calendar--text-shadow);color:var(--ez-calendar__btn-today--color);border-radius:var(--ez-calendar__btn-today--border-radius)}.calendar__btn-today:hover{background-color:var(--ez-calendar__btn-today--hover--background-color)}section{display:flex}.calendarTime{margin-left:-10px;display:flex;flex-direction:column;padding:12px 6px;padding-left:16px;padding-bottom:0px;background-color:var(--ez-calendar__Time--background-color);border-top-right-radius:var(--ez-calendar__body--border-radius);border-bottom-right-radius:var(--ez-calendar__body--border-radius);box-shadow:var(--ez-calendar__body--shadow)}.calendar__column{height:180px;padding:0px;margin:0px;overflow:auto}.calendar__column::-webkit-scrollbar{width:0px;max-width:0px;min-width:0px}.calendarTime__header{padding-left:6px;padding-right:6px;display:flex;justify-content:space-between;padding-bottom:var(--space--medium, 12px);margin:var(--space--small, 6px) var(--space--, 12px);font-weight:var(--text-weight--large, 600);font-size:var(--title--medium, 16px);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow);border-bottom:solid var(--ez-calendar__header-line--stroke) var(--ez-calendar__header-line--color);font-family:var(--ez-calendar--font-family);color:var(--ez-calendar--color);text-shadow:var(--ez-calendar--text-shadow)}.separatorTime{color:#A2ABB9}.endHidden{-webkit-mask-image:linear-gradient(180deg, #000 calc(100% - 48px), transparent 100%)}";
|