@sankhyalabs/ezui 1.1.92 → 1.1.95

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.
Files changed (98) hide show
  1. package/dist/cjs/{CSSVarsUtils-66e86394.js → CSSVarsUtils-8fbdf2e0.js} +1 -0
  2. package/dist/cjs/StringUtils-0ba09df4.js +57 -0
  3. package/dist/cjs/ez-button_3.cjs.entry.js +578 -0
  4. package/dist/cjs/ez-calendar_14.cjs.entry.js +2625 -0
  5. package/dist/cjs/ez-dialog.cjs.entry.js +3 -3
  6. package/dist/cjs/{ez-button_11.cjs.entry.js → ez-grid.cjs.entry.js} +32 -1439
  7. package/dist/cjs/ez-icon.cjs.entry.js +42 -0
  8. package/dist/cjs/ez-modal_2.cjs.entry.js +317 -0
  9. package/dist/cjs/ez-popover.cjs.entry.js +1 -1
  10. package/dist/cjs/ez-time-input.cjs.entry.js +2 -2
  11. package/dist/cjs/ezui.cjs.js +1 -1
  12. package/dist/cjs/{index-a92e6d04.js → index-6164b259.js} +18 -18
  13. package/dist/cjs/loader.cjs.js +1 -1
  14. package/dist/collection/components/ez-check/ez-check.css +3 -3
  15. package/dist/collection/components/ez-combo-box/ez-combo-box.js +52 -3
  16. package/dist/collection/components/ez-dialog/ez-dialog.css +14 -2
  17. package/dist/collection/components/ez-dialog/ez-dialog.js +3 -5
  18. package/dist/collection/components/ez-form/fieldbuilder/FieldBuilder.js +4 -1
  19. package/dist/collection/components/ez-form/fieldbuilder/tpl/CheckBox.tpl.js +4 -4
  20. package/dist/collection/components/ez-form/fieldbuilder/tpl/ComboBox.tpl.js +2 -2
  21. package/dist/collection/components/ez-form/fieldbuilder/tpl/DateInput.tpl.js +2 -2
  22. package/dist/collection/components/ez-form/fieldbuilder/tpl/FileInput.tpl.js +2 -2
  23. package/dist/collection/components/ez-form/fieldbuilder/tpl/NumberInput.tpl.js +6 -6
  24. package/dist/collection/components/ez-form/fieldbuilder/tpl/SearchInput.tpl.js +2 -2
  25. package/dist/collection/components/ez-form/fieldbuilder/tpl/TextArea.tpl.js +2 -2
  26. package/dist/collection/components/ez-form/structure/FormSheetMetadata.js +10 -7
  27. package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js +19 -2
  28. package/dist/collection/components/ez-grid/ez-grid.css +8 -0
  29. package/dist/collection/components/ez-grid/ez-grid.js +3 -3
  30. package/dist/collection/components/ez-grid/subcomponents/gridconfig/grid-config.css +28 -4
  31. package/dist/collection/components/ez-grid/subcomponents/gridconfig/grid-config.js +6 -5
  32. package/dist/collection/components/ez-grid/subcomponents/select-box/select-box.css +10 -7
  33. package/dist/collection/components/ez-grid/subcomponents/select-box/select-box.js +12 -17
  34. package/dist/collection/components/ez-list/ez-list.css +23 -2
  35. package/dist/collection/components/ez-list/ez-list.js +138 -68
  36. package/dist/collection/components/ez-text-input/ez-text-input.css +2 -2
  37. package/dist/collection/components/ez-text-input/ez-text-input.js +24 -1
  38. package/dist/collection/components/test-du/test-du.js +1 -1
  39. package/dist/collection/utils/CSSVarsUtils.js +1 -0
  40. package/dist/collection/utils/index.js +2 -0
  41. package/dist/custom-elements/index.js +217 -120
  42. package/dist/esm/{CSSVarsUtils-aeee9825.js → CSSVarsUtils-667e0016.js} +1 -0
  43. package/dist/esm/StringUtils-cbf10229.js +55 -0
  44. package/dist/esm/ez-button_3.entry.js +572 -0
  45. package/dist/esm/ez-calendar_14.entry.js +2608 -0
  46. package/dist/esm/ez-dialog.entry.js +3 -3
  47. package/dist/esm/{ez-button_11.entry.js → ez-grid.entry.js} +24 -1421
  48. package/dist/esm/ez-icon.entry.js +38 -0
  49. package/dist/esm/ez-modal_2.entry.js +312 -0
  50. package/dist/esm/ez-popover.entry.js +1 -1
  51. package/dist/esm/ez-time-input.entry.js +2 -2
  52. package/dist/esm/ezui.js +1 -1
  53. package/dist/esm/{index-4fb1605f.js → index-74a9c220.js} +17 -17
  54. package/dist/esm/loader.js +1 -1
  55. package/dist/ezui/ezui.esm.js +1 -1
  56. package/dist/ezui/p-0a8018c2.entry.js +1 -0
  57. package/dist/ezui/{p-552a0b2e.entry.js → p-2617733e.entry.js} +1 -1
  58. package/dist/ezui/p-2f84ba72.js +1 -0
  59. package/dist/ezui/{p-d4386e30.entry.js → p-6714a1b2.entry.js} +46 -46
  60. package/dist/ezui/p-90f6d8a0.entry.js +1 -0
  61. package/dist/ezui/p-a943d501.entry.js +1 -0
  62. package/dist/ezui/p-b139372f.entry.js +1 -0
  63. package/dist/ezui/{p-f0137439.js → p-c6762896.js} +1 -1
  64. package/dist/ezui/p-d54c157f.js +1 -0
  65. package/dist/ezui/p-e06e47f1.entry.js +1 -0
  66. package/dist/ezui/{p-7e0281cd.entry.js → p-ef393d36.entry.js} +1 -1
  67. package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +8 -0
  68. package/dist/types/components/ez-form/ez-form.d.ts +6 -1
  69. package/dist/types/components/ez-form/fieldbuilder/tpl/ComboBox.tpl.d.ts +2 -1
  70. package/dist/types/components/ez-form/fieldbuilder/tpl/DateInput.tpl.d.ts +2 -1
  71. package/dist/types/components/ez-form/fieldbuilder/tpl/FileInput.tpl.d.ts +2 -1
  72. package/dist/types/components/ez-form/fieldbuilder/tpl/NumberInput.tpl.d.ts +4 -2
  73. package/dist/types/components/ez-form/fieldbuilder/tpl/SearchInput.tpl.d.ts +2 -1
  74. package/dist/types/components/ez-form/fieldbuilder/tpl/TextArea.tpl.d.ts +2 -1
  75. package/dist/types/components/ez-grid/controller/ag-grid/AgGridController.d.ts +4 -1
  76. package/dist/types/components/ez-grid/subcomponents/select-box/select-box.d.ts +6 -4
  77. package/dist/types/components/ez-list/ez-list.d.ts +11 -6
  78. package/dist/types/components/ez-text-input/ez-text-input.d.ts +4 -0
  79. package/dist/types/components.d.ts +28 -4
  80. package/dist/types/utils/index.d.ts +2 -0
  81. package/package.json +1 -1
  82. package/dist/cjs/ApplicationUtils-d1c1db56.js +0 -35
  83. package/dist/cjs/ez-calendar.cjs.entry.js +0 -224
  84. package/dist/cjs/ez-collapsible-box_7.cjs.entry.js +0 -853
  85. package/dist/cjs/ez-combo-box.cjs.entry.js +0 -254
  86. package/dist/cjs/ez-form.cjs.entry.js +0 -753
  87. package/dist/esm/ApplicationUtils-01280a9d.js +0 -33
  88. package/dist/esm/ez-calendar.entry.js +0 -220
  89. package/dist/esm/ez-collapsible-box_7.entry.js +0 -843
  90. package/dist/esm/ez-combo-box.entry.js +0 -250
  91. package/dist/esm/ez-form.entry.js +0 -749
  92. package/dist/ezui/p-0094463f.entry.js +0 -1
  93. package/dist/ezui/p-020f1285.entry.js +0 -1
  94. package/dist/ezui/p-038fd0cb.entry.js +0 -1
  95. package/dist/ezui/p-60469339.entry.js +0 -1
  96. package/dist/ezui/p-7107d7ef.js +0 -1
  97. package/dist/ezui/p-8b099482.js +0 -1
  98. package/dist/ezui/p-d22db59d.entry.js +0 -1
@@ -2,137 +2,10 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-88286449.js');
6
- const index$1 = require('./index-a92e6d04.js');
7
- const AssetsUtils = require('./AssetsUtils-4909c6de.js');
5
+ const index$1 = require('./index-88286449.js');
6
+ const index = require('./index-6164b259.js');
8
7
 
9
- 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;}";
10
-
11
- let EzButton = class {
12
- constructor(hostRef) {
13
- index.registerInstance(this, hostRef);
14
- /**
15
- * Deixa o botão disponível ou não para interação com o usuário.
16
- */
17
- this.enabled = true;
18
- /**
19
- * Define o modo de uso do botão; opções: icon, link e regular
20
- */
21
- this.mode = "regular";
22
- /**
23
- * Quando em modo "icon" pode-se escolher entre [small,medium,large] (somente para o modo "icon")
24
- */
25
- this.size = "medium";
26
- }
27
- getIconSize() {
28
- return this.size;
29
- }
30
- handleSlotChange(ev) {
31
- const slot = ev.target;
32
- const content = slot.assignedElements()[0];
33
- if (this.mode == "link") {
34
- content.style.display = "inline";
35
- if (slot.name == "leftIcon") {
36
- content.style.paddingRight = "var(--ez-button__inline__icon--padding)";
37
- }
38
- else if (slot.name == "rightIcon") {
39
- content.style.paddingLeft = "var(--ez-button__inline__icon--padding)";
40
- }
41
- }
42
- else {
43
- content.style.setProperty('--ez-icon--color', 'var(--ez-icon--color)');
44
- }
45
- }
46
- render() {
47
- if (this.mode == "icon") {
48
- return (index.h("button", { class: "icon " + this.size, type: "button", disabled: !this.enabled }, index.h("ez-icon", { class: "icon", href: this.image, iconName: this.iconName, size: this.getIconSize(), onClick: evt => {
49
- if (!this.enabled)
50
- evt.stopPropagation();
51
- } })));
52
- }
53
- else if (this.mode == "label-icon") {
54
- return (index.h("div", { class: "label-icon" }, index.h("button", { class: "icon", type: "button", disabled: !this.enabled }, index.h("ez-icon", { class: "icon", href: this.image, iconName: this.iconName, size: "large", onClick: evt => {
55
- if (!this.enabled)
56
- evt.stopPropagation();
57
- } })), index.h("label", { title: this.label }, this.label)));
58
- }
59
- else if (this.mode == "link") {
60
- return (index.h("a", null, index.h("slot", { name: "leftIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.label, index.h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } })));
61
- }
62
- else {
63
- return (index.h("button", { type: "button", disabled: !this.enabled }, index.h("slot", { name: "leftIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.label, index.h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } })));
64
- }
65
- }
66
- };
67
- EzButton.style = ezButtonCss;
68
-
69
- const ezCheckCss = ":host{--ez-check--box--width:18px;--ez-check--box--height:18px;--ez-check--width:calc(var(--ez-check--box--width) + 14px);--ez-check--height:calc(var(--ez-check--box--width) + 14px);--ez-check--border-radius:var(--border--radius-small);--ez-check--checked--background-color:var(--color--primary-200);--ez-check--focus--background-color:var(--color--strokes, #FFFFFF);--ez-check--hover--background-color:var(--background--medium);--ez-check--checked--disabled--background-color:var(--color--disable-secondary);--ez-check--border:var(--border--medium) var(--title--primary);--ez-check--disabled--border:var(--border--medium) var(--color--strokes);--ez-check--checked--border:var(--border--medium) var(--color--primary);--ez-check--checked--hover--background-color:var(--color--primary-200);--ez-check--checked--focus--background-color:var(--color--primary-300, #FFFFFF);--ez-check--check--image:url('data:image/svg+xml;utf8,<svg width=\"8\" height=\"7\" viewBox=\"0 0 8 7\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7.70002 0.398999L7.48502 0.207997C7.31524 0.0598858 7.09376 -0.0150438 6.86894 -0.000430025C6.64411 0.0141838 6.43419 0.117153 6.28502 0.285997L2.70002 4.332L1.61802 3.384C1.44837 3.23576 1.22697 3.16067 1.00214 3.17509C0.77732 3.18952 0.567332 3.2923 0.418019 3.461L0.229019 3.674C0.0752361 3.84797 -0.00437434 4.07521 0.00721192 4.30713C0.0187982 4.53904 0.120661 4.75722 0.291019 4.915L2.27402 6.762C2.35832 6.8432 2.45842 6.90618 2.56811 6.94702C2.67779 6.98787 2.79471 7.00571 2.91159 6.99942C3.02846 6.99314 3.14279 6.96287 3.24747 6.91049C3.35214 6.85812 3.44492 6.78477 3.52002 6.695L7.79102 1.638C7.94063 1.46048 8.01486 1.23149 7.99786 0.999963C7.98085 0.768436 7.87396 0.552749 7.70002 0.398999Z\"/></svg>');--ez-check--check--background-color:var(--color--primary);--ez-check--check--disabled--background-color:var(--color--strokes);--ez-switch--slider--width:34px;--ez-switch--slider--height:14px;--ez-switch--pin--width:20px;--ez-switch--pin--height:20px;--ez-switch--focus--width:32px;--ez-switch--focus--height:32px;--ez-switch--background-color:var(--color--strokes);--ez-switch--disabled--background-color:var(--color--disable-secondary);--ez-switch--checked--background-color:var(--color--primary-300);--ez-switch--pin--background-color:var(--background--xlight);--ez-switch--pin--disabled--background-color:var(--color--disable-secondary);--ez-switch--pin--checked--background-color:var(--color--primary);--ez-switch--pin--checked--disabled--background-color:#E8F7F4;--ez-switch--pin--focus--background-color:var(--text--disable);--ez-switch--pin--checked--focus--background-color:var(--color--primary);--ez-check--label--font-size:var(--text--medium, 14px);--ez-check--label--font-family:var(--font-pattern, Arial);--ez-check--label--color:var(--title--primary, #000);--ez-check--label--disabled--color:var(--text--disable, #AFB6C0);display:flex;width:100%;align-items:center;margin:0}input.regularMode{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;box-sizing:border-box;-webkit-appearance:none;appearance:none;cursor:pointer;border-radius:50%;position:relative;width:var(--ez-check--width);height:var(--ez-check--height)}input.regularMode:enabled:hover{background-color:var(--ez-check--hover--background-color)}input.regularMode:enabled:focus{outline:none;background-color:var(--ez-check--focus--background-color)}input.regularMode:disabled{cursor:auto;background:none}input.regularMode::before{box-sizing:border-box;content:\"\";display:block;width:var(--ez-check--box--width);height:var(--ez-check--box--height);border-radius:var(--ez-check--border-radius);border:var(--ez-check--border)}input.regularMode:disabled::before{border:var(--ez-check--disabled--border)}input.regularMode:checked:enabled:hover{background-color:var(--ez-check--checked--hover--background-color)}input.regularMode:checked:enabled:focus{background-color:var(--ez-check--checked--focus--background-color)}input.regularMode:checked::before{border:var(--ez-check--checked--border);background-color:var(--ez-check--checked--background-color)}input.regularMode:checked:disabled:before{border:var(--ez-check--disabled--border);background-color:var(--ez-check--checked--disabled--background-color)}input.regularMode:checked::after{display:flex;position:absolute;content:\"\";background-color:var(--ez-check--check--background-color);width:8px;height:7px;-webkit-mask-image:var(--ez-check--check--image);mask-image:var(--ez-check--check--image)}input.regularMode:checked:disabled::after{background-color:var(--ez-check--check--disabled--background-color)}input.switchMode{flex-shrink:0;-webkit-appearance:none;appearance:none;position:relative;outline:none;cursor:pointer;border-radius:20px;border:none;transition:background-color var(--transition);width:var(--ez-switch--slider--width);height:var(--ez-switch--slider--height);background-color:var(--ez-switch--background-color)}input.switchMode:disabled{background-color:var(--ez-switch--disabled--background-color)}input.switchMode::after{content:\"\";display:block;position:absolute;box-shadow:var(--shadow);transition:transform var(--transition);transition:background-color var(--transition);transform:translateY(-3px);border-radius:50%;width:var(--ez-switch--pin--width);height:var(--ez-switch--pin--height);background-color:var(--ez-switch--pin--background-color)}input.switchMode:disabled::after{background-color:var(--ez-switch--pin--disabled--background-color)}input.switchMode:checked{transition:background-color var(--transition);background-color:var(--ez-switch--checked--background-color)}input.switchMode::before{display:block;content:\"\";display:block;position:absolute;border-radius:50%;opacity:0;width:var(--ez-switch--focus--width);height:var(--ez-switch--focus--height);top:calc((var(--ez-switch--slider--height) - var(--ez-switch--focus--height)) / 2);left:calc((var(--ez-switch--pin--width) - var(--ez-switch--focus--width))/2);background-color:var(--ez-switch--pin--focus--background-color)}input.switchMode:focus::before{opacity:0.24;transition:opacity var(--transition)}input.switchMode:checked:focus::before{background-color:var(--ez-switch--pin--checked--focus--background-color);transform:translateX(calc(var(--ez-switch--slider--width) - var(--ez-switch--pin--width)))}input.switchMode:checked::after{transition:transform var(--transition);transition:background-color var(--transition);transform:translateX(calc(var(--ez-switch--slider--width) - var(--ez-switch--pin--width))) translateY(-3px);box-shadow:var(--shadow);background-color:var(--ez-switch--pin--checked--background-color)}input.switchMode:checked:disabled::after{background-color:var(--ez-switch--pin--checked--disabled--background-color)}.label{flex-shrink:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ez-check--label--color);text-shadow:var(--text-shadow);font-size:var(--ez-check--label--font-size);font-family:var(--ez-check--label--font-family);cursor:default;padding-left:var(--space--small)}.label--disabled{color:var(--ez-check--label--disabled--color)}";
70
-
71
- let EzCheck = class {
72
- constructor(hostRef) {
73
- index.registerInstance(this, hostRef);
74
- this.ezChange = index.createEvent(this, "ezChange", 7);
75
- /**
76
- * Deixa o campo disponível ou não para interação com o usuário.
77
- */
78
- this.enabled = true;
79
- /**
80
- * Existem dois modos de visualização: regular e switch.
81
- * Se esta propriedade for omitida, o componete assume o formato "regular".
82
- * No modo "regular" a visualização é a tradicional de uma caixinha marcada/desmarcada.
83
- * No modo "switch" o campo tem uma interface em formato de um pino liga/desliga.
84
- */
85
- this.mode = "regular";
86
- }
87
- adjustMode() {
88
- if (this.mode === "switch") {
89
- this._inputElem.classList.remove("regularMode");
90
- this._inputElem.classList.add("switchMode");
91
- }
92
- else {
93
- this._inputElem.classList.remove("switchMode");
94
- this._inputElem.classList.add("regularMode");
95
- }
96
- }
97
- //---------------------------------------------
98
- // Public methods
99
- //---------------------------------------------
100
- /**
101
- * Devolve o modo escolhido para o componente
102
- */
103
- async getMode() {
104
- return this.mode;
105
- }
106
- /**
107
- * Faz o foco no componente de input
108
- */
109
- async setFocus() {
110
- this._inputElem.focus();
111
- }
112
- componentDidLoad() {
113
- this.adjustMode();
114
- }
115
- changeValue() {
116
- this.value = !this.value;
117
- this.ezChange.emit(this.value);
118
- }
119
- getLabelClasses() {
120
- let classes = "label";
121
- if (!this.enabled) {
122
- classes += " label--disabled";
123
- }
124
- return classes;
125
- }
126
- render() {
127
- return (index.h(index.Host, null, index.h("input", { type: "checkbox", class: "regularMode", checked: this.value === true, onChange: () => { this.changeValue(); }, disabled: !this.enabled, ref: (el) => this._inputElem = el }), this.label ? index.h("label", { class: this.getLabelClasses(), onClick: () => { this.changeValue(); }, title: this.label }, this.label) : undefined));
128
- }
129
- static get watchers() { return {
130
- "mode": ["adjustMode"]
131
- }; }
132
- };
133
- EzCheck.style = ezCheckCss;
134
-
135
- var agGridCommunity_cjs = index$1.createCommonjsModule(function (module, exports) {
8
+ var agGridCommunity_cjs = index.createCommonjsModule(function (module, exports) {
136
9
 
137
10
  Object.defineProperty(exports, '__esModule', { value: true });
138
11
 
@@ -46434,7 +46307,7 @@ var BaseComponentWrapper = /** @class */ (function () {
46434
46307
  * @link http://www.ag-grid.com/
46435
46308
  * @license MIT
46436
46309
  */
46437
- var globalObj = typeof index$1.commonjsGlobal === 'undefined' ? {} : index$1.commonjsGlobal;
46310
+ var globalObj = typeof index.commonjsGlobal === 'undefined' ? {} : index.commonjsGlobal;
46438
46311
  globalObj.HTMLElement = typeof HTMLElement === 'undefined' ? {} : HTMLElement;
46439
46312
  globalObj.HTMLButtonElement = typeof HTMLButtonElement === 'undefined' ? {} : HTMLButtonElement;
46440
46313
  globalObj.HTMLSelectElement = typeof HTMLSelectElement === 'undefined' ? {} : HTMLSelectElement;
@@ -50139,7 +50012,7 @@ exports.simpleHttpRequest = simpleHttpRequest;
50139
50012
  exports.stringToArray = stringToArray;
50140
50013
  });
50141
50014
 
50142
- var agGridEnterprise_cjs = index$1.createCommonjsModule(function (module, exports) {
50015
+ var agGridEnterprise_cjs = index.createCommonjsModule(function (module, exports) {
50143
50016
 
50144
50017
  Object.defineProperty(exports, '__esModule', { value: true });
50145
50018
 
@@ -110173,6 +110046,19 @@ class AgGridController {
110173
110046
  this._menuItems = [];
110174
110047
  this._enterprise = enterprise;
110175
110048
  }
110049
+ getSort() {
110050
+ const sortedColumns = [];
110051
+ this._gridOptions.api.getSortModel().forEach(({ colId, sort }) => {
110052
+ if (sort) {
110053
+ const field = this._dataUnit.getField(colId);
110054
+ const mode = sort === "asc" ? index.SortMode.ASC : index.SortMode.DESC;
110055
+ const sortField = field ? { field: field.name, dataType: field.dataType, mode } : { field: colId, dataType: index.DataType.TEXT, mode };
110056
+ sortedColumns.push(sortField);
110057
+ }
110058
+ });
110059
+ return sortedColumns;
110060
+ }
110061
+ ;
110176
110062
  initDatagrid(container, options) {
110177
110063
  if (this._grid === undefined) {
110178
110064
  this._columnStateChangeCallback = options.onColumnStateChange;
@@ -110183,6 +110069,7 @@ class AgGridController {
110183
110069
  this._pageSize = options.pageSize;
110184
110070
  this._serverURL = options.serverURL;
110185
110071
  this._dataUnit = options.dataUnit;
110072
+ this._dataUnit.sortingProvider = this;
110186
110073
  this._gridOptions = {
110187
110074
  localeText: gridTerms,
110188
110075
  rowModelType: "serverSide",
@@ -110246,8 +110133,9 @@ class AgGridController {
110246
110133
  headerName: "",
110247
110134
  checkboxSelection: true,
110248
110135
  headerCheckboxSelection: false,
110249
- width: 100,
110250
- suppressMovable: true
110136
+ width: 24,
110137
+ suppressMovable: true,
110138
+ suppressMenu: true
110251
110139
  });
110252
110140
  }
110253
110141
  cols.forEach(c => {
@@ -110415,60 +110303,6 @@ class AgGridController {
110415
110303
  }
110416
110304
  }
110417
110305
 
110418
- /**
110419
- * Classe com utiliários comuns para Strings.
110420
- */
110421
- class StringUtils {
110422
- /**
110423
- * Verifica se a string está vazia.
110424
- * Valores null e undefined são considerados como vazio.
110425
- *
110426
- * @param value String para ser validada.
110427
- */
110428
- static isEmpty(value) {
110429
- if (value == undefined || value === null) {
110430
- return true;
110431
- }
110432
- value = value.toString();
110433
- value = value.trim();
110434
- if (value.length === 0) {
110435
- return true;
110436
- }
110437
- return false;
110438
- }
110439
- /**
110440
- * Remove acentos de vogais, substitui Ç por c e retorna a string em caixa alta.
110441
- *
110442
- * @param value String para ser transformada.
110443
- */
110444
- static replaceAccentuatedChars(text) {
110445
- text = text.toUpperCase();
110446
- text = text.replace(/[À]/, "A");
110447
- text = text.replace(/[Á]/, "A");
110448
- text = text.replace(/[Â]/, "A");
110449
- text = text.replace(/[Ã]/, "A");
110450
- text = text.replace(/[Ä]/, "A");
110451
- text = text.replace(/[È]/, "E");
110452
- text = text.replace(/[É]/, "E");
110453
- text = text.replace(/[Ê]/, "E");
110454
- text = text.replace(/[Ë]/, "E");
110455
- text = text.replace(/[Ì]/, "I");
110456
- text = text.replace(/[Í]/, "I");
110457
- text = text.replace(/[Î]/, "I");
110458
- text = text.replace(/[Ï]/, "I");
110459
- text = text.replace(/[Ò]/, "O");
110460
- text = text.replace(/[Ó]/, "O");
110461
- text = text.replace(/[Ô]/, "O");
110462
- text = text.replace(/[Ö]/, "O");
110463
- text = text.replace(/[Ù]/, "U");
110464
- text = text.replace(/[Ú]/, "U");
110465
- text = text.replace(/[Û]/, "U");
110466
- text = text.replace(/[Ü]/, "U");
110467
- text = text.replace(/[Ç]/, "C");
110468
- return text.replace(/[^a-z0-9]/gi, '');
110469
- }
110470
- }
110471
-
110472
110306
  class DataUnitBridge {
110473
110307
  constructor(gridController, dataUnit) {
110474
110308
  this._gridController = gridController;
@@ -110477,7 +110311,7 @@ class DataUnitBridge {
110477
110311
  }
110478
110312
  processAction(action) {
110479
110313
  switch (action.type) {
110480
- case index$1.Action.METADATA_LOADED:
110314
+ case index.Action.METADATA_LOADED:
110481
110315
  this._gridController.setColumnsDef(this.buildColumnDefs(), true);
110482
110316
  break;
110483
110317
  }
@@ -110495,14 +110329,14 @@ class DataUnitBridge {
110495
110329
  }
110496
110330
  }
110497
110331
 
110498
- const ezGridCss = ".sc-ez-grid-h{display:grid;grid-template-rows:auto 1fr auto;height:100%;width:100%;--ezgrid__header--background-color:var(--background--xlight, #FFF)}.grid-header.sc-ez-grid{display:flex;justify-content:space-between;align-items:center;background-color:var(--ezgrid__header--background-color)}.grid-header__container.sc-ez-grid{display:flex;align-items:center}";
110332
+ const ezGridCss = ".sc-ez-grid-h{display:grid;grid-template-rows:auto 1fr auto;height:100%;width:100%;--ezgrid__header--background-color:var(--background--xlight, #FFF)}.grid-header.sc-ez-grid{display:flex;justify-content:space-between;align-items:center;background-color:var(--ezgrid__header--background-color, #FFF);z-index:var(--visible)}.grid__container.sc-ez-grid{box-shadow:0 0 16px 0 rgb(0 38 111 / 12%);padding-top:15px;margin-top:-12px;background-color:var(--ezgrid__header--background-color)}.grid-header__container.sc-ez-grid{display:flex;align-items:center}";
110499
110333
 
110500
110334
  let EzGrid = class {
110501
110335
  constructor(hostRef) {
110502
- index.registerInstance(this, hostRef);
110503
- this.ezColumnStateChange = index.createEvent(this, "ezColumnStateChange", 7);
110504
- this.ezSelectionChange = index.createEvent(this, "ezSelectionChange", 7);
110505
- this.ezDoubleClick = index.createEvent(this, "ezDoubleClick", 7);
110336
+ index$1.registerInstance(this, hostRef);
110337
+ this.ezColumnStateChange = index$1.createEvent(this, "ezColumnStateChange", 7);
110338
+ this.ezSelectionChange = index$1.createEvent(this, "ezSelectionChange", 7);
110339
+ this.ezDoubleClick = index$1.createEvent(this, "ezDoubleClick", 7);
110506
110340
  this._gridController = new AgGridController(false);
110507
110341
  this._popUpVisible = false;
110508
110342
  /**
@@ -110588,9 +110422,9 @@ let EzGrid = class {
110588
110422
  return null;
110589
110423
  }
110590
110424
  return [
110591
- index.h("div", { class: "text text--primary text--medium margin-right--medium" }, index.h("strong", { class: "text text--primary text--medium" }, `${this._navigationFirstRow}-${this._navigationLastRow}`), ` de ${this._navigationTotalRows}`),
110592
- index.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" }),
110593
- index.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" })
110425
+ index$1.h("div", { class: "text text--primary text--medium margin-right--medium" }, index$1.h("strong", { class: "text text--primary text--medium" }, `${this._navigationFirstRow}-${this._navigationLastRow}`), ` de ${this._navigationTotalRows}`),
110426
+ index$1.h("ez-button", { size: "small", iconName: "chevron-left", class: "margin-right--medium", mode: "icon", enabled: this._navigationHasPrevious, onClick: () => this._gridController.previousPage(), label: "P\u00E1gina anterior" }),
110427
+ index$1.h("ez-button", { size: "small", iconName: "chevron-right", class: "margin-right--medium", mode: "icon", enabled: this._navigationHasNext, onClick: () => this._gridController.nextPage(), label: "Pr\u00F3xima P\u00E1gina" })
110594
110428
  ];
110595
110429
  }
110596
110430
  applyConfig(cols) {
@@ -110606,1251 +110440,10 @@ let EzGrid = class {
110606
110440
  this._popUpVisible = true;
110607
110441
  }
110608
110442
  render() {
110609
- return (index.h(index.Host, null, index.h("div", { class: "box box--shadow padding--medium grid-header margin-bottom--small" }, index.h("div", { class: "grid-header__container" }, index.h("slot", { name: "leftButtons" })), index.h("div", { class: "grid-header__container" }, this.getPaginationControl(), index.h("ez-button", { size: "small", iconName: "settings", class: "button--secondary", mode: "icon", onClick: () => { this.openConfig(); } }))), index.h("div", { class: "grid__container ag-sankhya-theme", ref: elem => this._container = elem }), index.h("div", { class: "grid__footer" }), index.h("ez-modal", { modalSize: "small", closeEsc: true, closeOutsideClick: true, opened: this._popUpVisible, onEzCloseModal: () => this._popUpVisible = false }, index.h("grid-config", { ref: ref => this._gridConfig = ref, selectedTab: "Colunas", onConfigFinish: evt => this.applyConfig(evt.detail), onConfigCancel: _evt => this.closeConfig() }))));
110443
+ return (index$1.h(index$1.Host, null, index$1.h("div", { class: "box box--shadow padding--medium grid-header" }, index$1.h("div", { class: "grid-header__container" }, index$1.h("slot", { name: "leftButtons" })), index$1.h("div", { class: "grid-header__container" }, this.getPaginationControl(), index$1.h("ez-button", { size: "small", iconName: "settings", class: "button--secondary", mode: "icon", onClick: () => { this.openConfig(); } }))), index$1.h("div", { class: "grid__container ag-sankhya-theme", ref: elem => this._container = elem }), index$1.h("div", { class: "grid__footer" }), index$1.h("ez-modal", { modalSize: "small", closeEsc: true, closeOutsideClick: true, opened: this._popUpVisible, onEzCloseModal: () => this._popUpVisible = false }, index$1.h("grid-config", { ref: ref => this._gridConfig = ref, selectedTab: "Colunas", onConfigFinish: evt => this.applyConfig(evt.detail), onConfigCancel: _evt => this.closeConfig() }))));
110610
110444
  }
110611
110445
  static get assetsDirs() { return ["../assets"]; }
110612
110446
  };
110613
110447
  EzGrid.style = ezGridCss;
110614
110448
 
110615
- 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}";
110616
-
110617
- let EzIcon = class {
110618
- constructor(hostRef) {
110619
- index.registerInstance(this, hostRef);
110620
- /**
110621
- * Tamanho do ícone
110622
- */
110623
- this.size = 'medium';
110624
- }
110625
- isSprite() {
110626
- return this.href && this.href.indexOf('#') > -1;
110627
- }
110628
- getIconClassName() {
110629
- return `ez-icon-${this.iconName}`;
110630
- }
110631
- getIconContent() {
110632
- if (this.isSprite()) {
110633
- return index.h("svg", { class: this.size, role: "img" }, index.h("use", { xlinkHref: this.href }));
110634
- }
110635
- else if (!StringUtils.isEmpty(this.iconName)) {
110636
- return index.h("span", { class: `icon-content ${this.getIconClassName()} ${this.size}--font` });
110637
- }
110638
- else {
110639
- return index.h("img", { class: this.size, src: this.href });
110640
- }
110641
- }
110642
- render() {
110643
- return (index.h(index.Host, null, this.getIconContent()));
110644
- }
110645
- };
110646
- EzIcon.style = ezIconCss;
110647
-
110648
- const ezListCss = ":host{--ez-list__host--z-index:var(--visible, 1);--ez-list__host--border-radius:var(--border--radius-medium, 12px);--ez-list__host--padding:var(--space--medium, 12px);--ez-list__icon__padding:var(--space--small, 6px);--ez-list__icon--color:#AFB6C0;--ez-list__item__margin:0 var(--space--small, 6px);--ez-list__item--color:var(--title--primary, #2b3a54);--ez-list__item--border-bottom:var(--border--small, 1px solid);--ez-list__item--border-color:var(--title--primary, #2b3a54);--ez-list__item--font-family:var(--font-pattern, \"Sora\");--ez-list__item--font-size:var(--text--medium, 14px);--ez-list__selectable--padding-right:var(--space--small, 6px);--ez-list__selectable--padding-left:var(--space--small, 6px);--ez-list__selected-item__border-radius:var(--border--radius-small, 6px);--ez-list__selected-item__background:var(--color--primary-300, #E2F4EF);--ez-list__group--font-family:var(--font-pattern, \"Sora\");--ez-list__group--font-size:var(--text--medium, 14px);--ez-list__group--font-weight:var(--text-weight--large, 600);--ez-list__group--padding-bottom:var(--space-small, 6px);--ez-list__group__overlay--font-family:var(--font-pattern, \"Sora\");--ez-list__group__overlay--font-size:var(--text--medium, 14px);--ez-list__group-container__scrollbar--border-radius:var(--border--radius-large, 24px);--ez-list__group-container__scrollbar--width:var(--space--medium, 12px);--ez-list__group-container__scrollbar--background-color:var(--text--primary, #626e82);--ez-list__over--border--color:var(--color--primary, #008561);--ez-list__draggable__scrollbar--border-radius:var(--border--radius-large, 24px);--ez-list__draggable__scrollbar--width:var(--space--medium, 12px);--ez-list__draggable__scrollbar--background-color:var(--text--primary, #626e82);--ez-list__draggable__icon--image:url('data:image/svg+xml;utf8,<svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m 6.75,2.25 h 1.5 v 1.5 h -1.5 z m 3,0 h 1.5 v 1.5 h -1.5 z m -3,3 h 1.5 v 1.5 h -1.5 z m 3,0 h 1.5 v 1.5 h -1.5 z m -3,3 h 1.5 v 1.5 h -1.5 z m 3,0 h 1.5 v 1.5 h -1.5 z m -3,3 h 1.5 v 1.5 h -1.5 z m 3,0 h 1.5 v 1.5 h -1.5 z m -3,3 h 1.5 v 1.5 h -1.5 z m 3,0 h 1.5 v 1.5 h -1.5 z\"/></svg>');max-height:100%;width:100%;background-color:#fff;display:flex;z-index:var(--ez-list__host--z-index)}.draggable{display:flex;align-items:center;justify-content:space-between;background-color:#fff;font-family:var(--ez-list__item--font-family);font-size:var(--ez-list__item--font-size);flex:1}.dragging{background:#FFFFFF;border:1px solid #008561;box-sizing:border-box;box-shadow:0px 0px 16px rgba(0, 38, 111, 0.122);border-radius:6px}.selectable{cursor:pointer;padding-right:var(--ez-list__selectable--padding-right);padding-left:var(--ez-list__selectable--padding-left)}.selectable-container{margin:0px !important}.item-content{display:flex;justify-content:center;align-items:center}.draggable-list{color:var(--text-color);padding:0;margin:0;width:100%;max-height:100%;padding-bottom:var(--space--small)}.draggable-list li{background-color:#fff;display:flex;margin:var(--ez-list__item__margin);font-family:var(--ez-list__item--font-family);font-size:var(--ez-list__item--font-size);color:var(--ez-list__item--color);height:32px}.over{border-top:1px dashed var(--ez-list__over--border--color)}.draggable-selected{background-color:var(--background--strong) !important}.draggable-selected div:hover{background-color:var(--background--strong) !important}.draggable-list::-webkit-scrollbar-track{background-color:#f0f2f5}.draggable-list::-webkit-scrollbar-thumb{background-color:var(--ez-list__draggable__scrollbar--background-color);border-radius:var(--ez-list__draggable__scrollbar--border-radius)}.draggable-list::-webkit-scrollbar{background-color:#f0f2f5;width:var(--ez-list__draggable__scrollbar--width);max-width:var(--ez-list__draggable__scrollbar--width);min-width:var(--ez-list__draggable__scrollbar--width)}.draggable-icon{align-items:flex-start;display:flex;outline:none;border:none;background-color:unset}.draggable-icon::after{content:'';display:flex;background-color:var(--ez-list__icon--color);width:18px;height:18px;-webkit-mask-image:var(--ez-list__draggable__icon--image);mask-image:var(--ez-list__draggable__icon--image)}*{box-sizing:border-box}.checkbox{width:fit-content}.text--ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.group-container{display:flex;flex-direction:column;max-height:100%;overflow-y:auto;outline:none;width:100%}.group-name{font-family:var(--ez-list__group--font-family);font-size:var(--ez-list__group--font-size);font-weight:var(--ez-list__group--font-weight);padding-bottom:var(--ez-list__group--padding-bottom)}.group{display:flex;flex-direction:column}.group-container::-webkit-scrollbar-track{background-color:#f0f2f5}.group-container::-webkit-scrollbar-thumb{background-color:var(--ez-list__group-container__scrollbar--background-color);border-radius:var(--ez-list__group-container__scrollbar--border-radius)}.group-container::-webkit-scrollbar{background-color:#f0f2f5;width:var(--ez-list__group-container__scrollbar--width);max-width:var(--ez-list__group-container__scrollbar--width);min-width:var(--ez-list__group-container__scrollbar--width)}.section-container{display:flex;position:relative;height:100%}.items-container{width:100%;max-height:100%;overflow-y:auto;outline:none}.group-items-container{width:100%;max-height:100%;height:100%;outline:none}.items-container::-webkit-scrollbar-track{background-color:#f0f2f5}.items-container::-webkit-scrollbar-thumb{background-color:var(--ez-list__draggable__scrollbar--background-color);border-radius:var(--ez-list__draggable__scrollbar--border-radius)}.items-container::-webkit-scrollbar{background-color:#f0f2f5;width:var(--ez-list__draggable__scrollbar--width);max-width:var(--ez-list__draggable__scrollbar--width);min-width:var(--ez-list__draggable__scrollbar--width)}.group-overlay{font-family:var(--ez-list__group__overlay--font-family);font-size:var(--ez-list__group__overlay--font-size);background:rgba(226, 244, 239, 0.8);border:1px solid #008561;border-radius:8px;position:absolute;display:none;place-items:center;top:0;bottom:0;left:0;right:0;z-index:2;margin:0;cursor:pointer}.overlay-text{position:absolute;top:50%;left:50%;font-size:50px;color:white;transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%)}.selected-item{background:var(--ez-list__selected-item__background);border-radius:var(--ez-list__selected-item__border-radius)}.slot-item{align-items:flex-end}.overGroup{background:rgba(226, 244, 239, 0.8);border:1px solid #008561;box-sizing:border-box;border-radius:8px;padding-top:6px}";
110649
-
110650
- let EzList = class {
110651
- constructor(hostRef) {
110652
- index.registerInstance(this, hostRef);
110653
- this.ezChange = index.createEvent(this, "ezChange", 7);
110654
- this._listItems = [];
110655
- this._listGroupItems = [];
110656
- this._listItemsHistory = [];
110657
- /**
110658
- * Define a lista inicial do componente.
110659
- */
110660
- this.dataSource = [];
110661
- /**
110662
- * Define se o componente renderizará os itens separados em grupos..
110663
- */
110664
- this.useGroups = false;
110665
- /**
110666
- * Define se o componente terá o comportamento de arrasto de linhas.
110667
- */
110668
- this.ezDraggable = false;
110669
- /**
110670
- * Define se os items da lista serão selecionáveis.
110671
- */
110672
- this.ezSelectable = false;
110673
- }
110674
- createList() {
110675
- if (this.useGroups) {
110676
- let list = [...this.dataSource];
110677
- list.forEach(itemGroup => {
110678
- this.sortGroup(itemGroup);
110679
- });
110680
- this._listGroupItems = list;
110681
- }
110682
- else {
110683
- this._listItems = this._listItemsHistory.length > 0 ? this._listItemsHistory : [...this.dataSource];
110684
- }
110685
- }
110686
- sortGroup(itemGroup) {
110687
- if (itemGroup.sort) {
110688
- itemGroup.items.sort(function (a, b) {
110689
- return a.label < b.label ? -1 : a.label > b.label ? 1 : 0;
110690
- });
110691
- if (itemGroup.sort === "DSC") {
110692
- itemGroup.items.reverse();
110693
- }
110694
- }
110695
- }
110696
- /**
110697
- * Recebe como argumento um ListItem {label: string} e um booleano que define se o componente deve fazer scroll para exibir o item específico (opcional).
110698
- */
110699
- async setSelection(selectedItem, scrollToOption) {
110700
- if (selectedItem && this.ezSelectable) {
110701
- if (this.useGroups) {
110702
- let newList = [...this._listGroupItems];
110703
- newList.forEach(groupItem => {
110704
- groupItem.items.forEach(item => {
110705
- if (item.label == selectedItem.label) {
110706
- item.selected = !item.selected;
110707
- }
110708
- else {
110709
- item.selected = false;
110710
- }
110711
- });
110712
- });
110713
- this._listGroupItems = newList;
110714
- }
110715
- else {
110716
- let newList = [...this._listItems];
110717
- newList.forEach(item => {
110718
- if (item.label === selectedItem.label) {
110719
- item.selected = !item.selected;
110720
- }
110721
- else {
110722
- item.selected = false;
110723
- }
110724
- });
110725
- this._listItems = newList;
110726
- }
110727
- if (scrollToOption) {
110728
- let liElem = this.useGroups ?
110729
- this._groupContainer.querySelector('li#item_' + this.getItemId(selectedItem.label))
110730
- : this._itemContainer.querySelector('li#item_' + this.getItemId(selectedItem.label));
110731
- if (liElem) {
110732
- liElem.scrollIntoView();
110733
- }
110734
- }
110735
- }
110736
- else {
110737
- this.removeSelection();
110738
- }
110739
- }
110740
- removeSelection() {
110741
- if (this.useGroups) {
110742
- let newList = [...this._listGroupItems];
110743
- newList.forEach(groupItem => {
110744
- groupItem.items.forEach(item => {
110745
- item.selected = false;
110746
- });
110747
- });
110748
- this._listGroupItems = newList;
110749
- }
110750
- else {
110751
- let newList = [...this._listItems];
110752
- newList.forEach(item => {
110753
- item.selected = false;
110754
- });
110755
- this._listItems = newList;
110756
- }
110757
- }
110758
- /**
110759
- * Retorna o item selecionado.
110760
- */
110761
- async getSelection() {
110762
- let selectedItem;
110763
- if (this.useGroups) {
110764
- this._listGroupItems.every(group => {
110765
- let item = group.items.find((item) => item.selected == true);
110766
- if (item) {
110767
- selectedItem = item;
110768
- return false;
110769
- }
110770
- return true;
110771
- });
110772
- }
110773
- else {
110774
- selectedItem = this._listItems.find((item) => item.selected == true);
110775
- }
110776
- return selectedItem;
110777
- }
110778
- /**
110779
- * Retorna a lista de items conforme o modo de uso.
110780
- */
110781
- async getList() {
110782
- if (this.useGroups) {
110783
- return this._listGroupItems;
110784
- }
110785
- return this._listItems;
110786
- }
110787
- componentWillLoad() {
110788
- this._listItemsHistory = [];
110789
- }
110790
- componentWillRender() {
110791
- this.createList();
110792
- }
110793
- onDrop(ev, dragEndItem) {
110794
- this.removeOverClass(ev);
110795
- this.setSelection(undefined);
110796
- if (this._dragStartItem) {
110797
- if (this.useGroups) {
110798
- let newList = [...this._listGroupItems];
110799
- let groupEnd = this._listGroupItems.find(group => dragEndItem.groupName == group.group);
110800
- //Remove item arrastado
110801
- newList.find(group => group.group == this._dragStartItem.groupName).items.splice(this._dragStartItem.index, 1);
110802
- //Adiciona item arrastado
110803
- if (groupEnd.sort) {
110804
- newList.find(group => group.group == dragEndItem.groupName).items.push(this._dragStartItem.item);
110805
- newList.find(group => group.group == dragEndItem.groupName).items.sort(function (a, b) {
110806
- return a.label < b.label ? -1 : a.label > b.label ? 1 : 0;
110807
- });
110808
- if (groupEnd.sort === "DSC") {
110809
- newList.find(group => group.group == dragEndItem.groupName).items.reverse();
110810
- }
110811
- }
110812
- else {
110813
- let indexForAdd = (dragEndItem.index > this._dragStartItem.index) ? dragEndItem.index - 1 : dragEndItem.index;
110814
- newList.find(group => group.group == dragEndItem.groupName).items.splice(indexForAdd, 0, this._dragStartItem.item);
110815
- }
110816
- this._listGroupItems = newList;
110817
- this.ezChange.emit(this._listGroupItems);
110818
- }
110819
- else {
110820
- let newList = [...this._listItems];
110821
- newList.splice(this._dragStartItem.index, 1);
110822
- newList.splice(dragEndItem.index, 0, this._dragStartItem.item);
110823
- this._listItems = newList;
110824
- this._listItemsHistory = newList;
110825
- this.ezChange.emit(this._listItems);
110826
- }
110827
- }
110828
- ev.stopPropagation();
110829
- }
110830
- onDropGroup(groupSelected) {
110831
- var _a;
110832
- let newList = [...this._listGroupItems];
110833
- this.setSelection(undefined);
110834
- let newGroup = newList.find(group => group.group === groupSelected.group);
110835
- if (newGroup) {
110836
- if (((_a = newGroup.items) === null || _a === void 0 ? void 0 : _a.length) > 0) {
110837
- let newItem;
110838
- newGroup.items.forEach((item, index) => {
110839
- if (item.label === this._dragStartItem.item.label) {
110840
- newItem = { item: item, index: index };
110841
- }
110842
- });
110843
- if (newItem) {
110844
- newGroup.items.splice(newItem.index, 1);
110845
- newGroup.items.unshift(newItem.item);
110846
- this.sortGroup(newGroup);
110847
- }
110848
- else {
110849
- newGroup.items.unshift(this._dragStartItem.item);
110850
- this.sortGroup(newGroup);
110851
- newList.find(group => group.group === this._dragStartItem.groupName).items.splice(this._dragStartItem.index, 1);
110852
- }
110853
- }
110854
- else {
110855
- newList.find(group => group.group === this._dragStartItem.groupName).items.splice(this._dragStartItem.index, 1);
110856
- newGroup.items = [this._dragStartItem.item];
110857
- }
110858
- this._listGroupItems = newList;
110859
- }
110860
- }
110861
- onDragEnd() {
110862
- this._dragStartItem = undefined;
110863
- if (this._draggingElement) {
110864
- try {
110865
- this._element.shadowRoot.removeChild(this._draggingElement);
110866
- }
110867
- catch (err) { }
110868
- this._draggingElement = undefined;
110869
- }
110870
- }
110871
- addOverClass(ev) {
110872
- if (ev.target.__proto__ == HTMLDivElement.prototype && ev.target.classList.contains("draggable")) {
110873
- ev.target.classList.add('over');
110874
- }
110875
- }
110876
- addOverGroupClass(ev, group) {
110877
- if (ev.target) {
110878
- let groupContainer = this._groupContainer.querySelector("div#" + this.getDivGroupId(group.group));
110879
- if (group.items.length > 0) {
110880
- let groupOverlay = groupContainer.getElementsByClassName("group-overlay")[0];
110881
- groupOverlay.setAttribute("style", "display:grid");
110882
- }
110883
- else {
110884
- groupContainer === null || groupContainer === void 0 ? void 0 : groupContainer.classList.add('overGroup');
110885
- }
110886
- }
110887
- }
110888
- removeOverClass(ev) {
110889
- ev.target.classList.remove('over');
110890
- }
110891
- removeOverGroupClass(ev, group) {
110892
- if (ev.target) {
110893
- let groupContainer = this._groupContainer.querySelector("div#" + this.getDivGroupId(group.group));
110894
- if (group.items.length > 0) {
110895
- let groupOverlay = groupContainer.getElementsByClassName("group-overlay")[0];
110896
- groupOverlay.setAttribute("style", "display:none");
110897
- }
110898
- else {
110899
- groupContainer === null || groupContainer === void 0 ? void 0 : groupContainer.classList.remove('overGroup');
110900
- }
110901
- }
110902
- }
110903
- onDragStart(event, item, group, index) {
110904
- if (this.useGroups) {
110905
- this._dragStartItem = { groupName: group.group, item: item, index: index };
110906
- }
110907
- else {
110908
- this._dragStartItem = { item: item.item, index: item.index };
110909
- }
110910
- let sourceElement = event.srcElement.cloneNode(true);
110911
- this._draggingElement = event.srcElement.cloneNode(true);
110912
- this._draggingElement.style.position = "absolute";
110913
- this._draggingElement.style.top = (event.clientY + 5) + 'px';
110914
- this._draggingElement.style.left = (event.clientX + 5) + 'px';
110915
- this._draggingElement.style.height = event.srcElement.clientHeight + 'px';
110916
- this._draggingElement.style.width = event.srcElement.clientWidth + 'px';
110917
- this._draggingElement.style.background = "#FFFFFF";
110918
- this._draggingElement.style.border = "1px solid #008561";
110919
- this._draggingElement.style["box-sizing"] = "border-box";
110920
- this._draggingElement.style["box-shadow"] = "0px 0px 16px rgba(0, 38, 111, 0.122)";
110921
- this._draggingElement.style["border-radius"] = "6px";
110922
- this._element.shadowRoot.appendChild(this._draggingElement);
110923
- event.dataTransfer.setDragImage(sourceElement, -10000, -10000);
110924
- }
110925
- onDrag(event) {
110926
- if (this._draggingElement) {
110927
- this._draggingElement.style.top = (event.clientY + 5) + 'px';
110928
- this._draggingElement.style.left = (event.clientX + 5) + 'px';
110929
- }
110930
- }
110931
- selectFirstItem() {
110932
- if (this.useGroups) {
110933
- this.setSelection(this._listGroupItems[0].items[0]);
110934
- }
110935
- {
110936
- this.setSelection(this._listItems[0]);
110937
- }
110938
- }
110939
- nextOption(selectedItem) {
110940
- let nextItem = undefined;
110941
- if (this.useGroups) {
110942
- this._listGroupItems.every((group, groupIndex, listGroupItems) => {
110943
- let item = undefined;
110944
- let itemIndex = group.items.findIndex(item => item.label == selectedItem.label);
110945
- if (itemIndex != undefined && itemIndex != -1) {
110946
- if (itemIndex === group.items.length - 1) {
110947
- if (groupIndex + 1 <= listGroupItems.length - 1) {
110948
- item = { label: listGroupItems[groupIndex + 1].items[0].label };
110949
- }
110950
- }
110951
- else {
110952
- item = { label: group.items[itemIndex + 1].label };
110953
- }
110954
- }
110955
- if (item != undefined) {
110956
- nextItem = item;
110957
- return false;
110958
- }
110959
- return true;
110960
- });
110961
- }
110962
- else {
110963
- let itemIndex = this._listItems.findIndex(item => item.label === selectedItem.label);
110964
- if (itemIndex >= 0 && itemIndex < this._listItems.length) {
110965
- nextItem = this._listItems[itemIndex + 1];
110966
- }
110967
- }
110968
- this.setSelection(nextItem, true);
110969
- }
110970
- previousOption(selectedItem) {
110971
- let previousItem = undefined;
110972
- if (this.useGroups) {
110973
- this._listGroupItems.every((group, groupIndex, listGroupItems) => {
110974
- let item = undefined;
110975
- let itemIndex = group.items.findIndex(item => item.label == selectedItem.label);
110976
- if (itemIndex != undefined && itemIndex != -1) {
110977
- if (itemIndex === 0) {
110978
- if ((groupIndex - 1 >= 0)) {
110979
- item = { label: listGroupItems[groupIndex - 1].items[listGroupItems[groupIndex - 1].items.length - 1].label };
110980
- }
110981
- }
110982
- else {
110983
- item = { label: group.items[itemIndex - 1].label };
110984
- }
110985
- }
110986
- if (item != undefined) {
110987
- previousItem = item;
110988
- return false;
110989
- }
110990
- return true;
110991
- });
110992
- }
110993
- else {
110994
- let itemIndex = this._listItems.findIndex(item => item.label === selectedItem.label);
110995
- if (itemIndex > 0 && itemIndex < this._listItems.length) {
110996
- previousItem = this._listItems[itemIndex - 1];
110997
- }
110998
- }
110999
- this.setSelection(previousItem, true);
111000
- }
111001
- keyDownHandler(event) {
111002
- event.preventDefault();
111003
- this.getSelection().then(selectedItem => {
111004
- if (selectedItem) {
111005
- switch (event.key) {
111006
- case "ArrowDown":
111007
- this.nextOption(selectedItem);
111008
- break;
111009
- case "ArrowUp":
111010
- this.previousOption(selectedItem);
111011
- break;
111012
- }
111013
- }
111014
- else {
111015
- this.selectFirstItem();
111016
- }
111017
- });
111018
- event.stopPropagation();
111019
- }
111020
- getItemId(itemLabel) {
111021
- if (itemLabel) {
111022
- return itemLabel.replace(/[^a-z0-9_]/gi, "_");
111023
- }
111024
- return undefined;
111025
- }
111026
- getDivGroupId(groupName) {
111027
- if (groupName) {
111028
- return "group-" + groupName.replace(/[^a-z0-9_]/gi, "_");
111029
- }
111030
- return undefined;
111031
- }
111032
- onDragOverGroup(event, group) {
111033
- if (this._dragStartItem && this._dragStartItem.groupName !== group.group) {
111034
- event.preventDefault();
111035
- this.addOverGroupClass(event, group);
111036
- }
111037
- }
111038
- onDragOverItem(event, group) {
111039
- if (this._dragStartItem) {
111040
- event.preventDefault();
111041
- if (group) {
111042
- group.sort ?
111043
- () => {
111044
- this.addOverGroupClass(event, group);
111045
- }
111046
- : this.addOverClass(event);
111047
- }
111048
- else {
111049
- this.addOverClass(event);
111050
- }
111051
- event.stopPropagation();
111052
- }
111053
- }
111054
- render() {
111055
- return (index.h(index.Host, { ref: (el) => this._element = el }, this.useGroups ?
111056
- index.h("div", { class: "group-container", ref: (el) => this._groupContainer = el, tabIndex: 0, onKeyDown: (event) => { this.keyDownHandler(event); } }, this._listGroupItems.map(group => {
111057
- return index.h("div", { id: this.getDivGroupId(group.group), class: "group", key: group.group + group.items.length, onDragLeave: (event) => { this.removeOverGroupClass(event, group); }, onDragEnd: (event) => { this.onDragEnd(); this.removeOverGroupClass(event, group); }, onDragOver: (event) => { this.onDragOverGroup(event, group); }, onDrop: () => this.onDropGroup(group) }, index.h("label", { class: "group-name", onDragLeave: (event) => { this.removeOverGroupClass(event, group); }, onDragOver: (event) => { this.onDragOverGroup(event, group); }, onDragEnd: (event) => { this.onDragEnd(); this.removeOverGroupClass(event, group); }, onDrop: () => this.onDropGroup(group) }, group.group), index.h("section", { class: "section-container", onDragOver: (ev) => ev.preventDefault() }, index.h("div", { class: "group-items-container" }, index.h("div", { class: "draggable-list" }, group.items.map((item, index$1) => {
111058
- return index.h("li", { id: 'item_' + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: 'item_' + this.getItemId(item.label) }, index.h("div", { class: "draggable" + (item.selected == true ? " selected-item " : "") + (this.ezSelectable == true ? " selectable " : ""), onClick: () => { this.setSelection(item); }, onDragLeave: (event) => { group.sort ? undefined : this.removeOverClass(event); }, onDragEnd: () => this.onDragEnd(), onDragStart: (event) => this.onDragStart(event, item, group, index$1), onDragOver: (event) => this.onDragOverItem(event, group), onDrop: (event) => this.onDrop(event, { groupName: group.group, item: item, index: index$1 }), onDrag: (event) => this.onDrag(event), draggable: this.ezDraggable }, index.h("div", { class: "item-content" }, this.ezDraggable ? index.h("span", { class: "draggable-icon" }) : undefined, index.h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label)), this.itemSlotBuilder ?
111059
- index.h("div", { class: "slot-item" }, this.itemSlotBuilder(item, group))
111060
- : undefined));
111061
- }))), index.h("div", { class: "group-overlay" }, index.h("div", { id: "overlay-text" }, index.h("b", null, "Mover"), " para ", group.group))));
111062
- }))
111063
- :
111064
- index.h("div", { class: "items-container", ref: (el) => this._itemContainer = el, tabIndex: 0, onKeyDown: (event) => { this.keyDownHandler(event); } }, index.h("div", { class: "draggable-list" }, this._listItems.map((item, index$1) => {
111065
- return index.h("li", { id: 'item_' + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: 'item_' + this.getItemId(item.label) }, index.h("div", { class: "draggable" + (item.selected == true ? " selected-item " : "") + (this.ezSelectable == true ? " selectable " : ""), onDragStart: (event) => this.onDragStart(event, { item: item, index: index$1 }), onClick: () => { this.setSelection(item); }, onDragLeave: event => this.removeOverClass(event), onDragOver: (event) => this.onDragOverItem(event), onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDrop(event, { item: item, index: index$1 }), onDrag: (event) => this.onDrag(event), draggable: this.ezDraggable }, index.h("div", { class: "item-content" }, this.ezDraggable ? index.h("span", { class: "draggable-icon" }) : undefined, index.h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label)), this.itemSlotBuilder ?
111066
- index.h("div", null, this.itemSlotBuilder(item))
111067
- : undefined));
111068
- })))));
111069
- }
111070
- };
111071
- EzList.style = ezListCss;
111072
-
111073
- const ezModalCss = ":host{--ez-modal-z-index:var(--most-visible, 3);--ez-modal-vertical-padding:var(--space--large, 24px);display:block}.modal{position:fixed;padding:var(--ez-modal-vertical-padding) 0;display:flex;top:0px;z-index:var(--ez-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%}}";
111074
-
111075
- let EzModal = class {
111076
- constructor(hostRef) {
111077
- index.registerInstance(this, hostRef);
111078
- this.ezCloseModal = index.createEvent(this, "ezCloseModal", 7);
111079
- /**
111080
- * Controle de exibição do Modal
111081
- */
111082
- this.opened = true;
111083
- /**
111084
- * Define se o modal será fechado ao clicar ESC
111085
- */
111086
- this.closeEsc = false;
111087
- /**
111088
- * Define se o modal será fechado ao clicar fora do conteúdo.
111089
- */
111090
- this.closeOutsideClick = false;
111091
- this.handleKeyboardEvent = (ev) => {
111092
- if ((ev === null || ev === void 0 ? void 0 : ev.key) === "Escape" && this.closeEsc) {
111093
- this.closeModal();
111094
- }
111095
- };
111096
- }
111097
- handleopenedChange() {
111098
- if (this.opened) {
111099
- document.addEventListener("keydown", this.handleKeyboardEvent);
111100
- }
111101
- else {
111102
- document.removeEventListener("keydown", this.handleKeyboardEvent);
111103
- }
111104
- }
111105
- closeModal() {
111106
- this.opened = false;
111107
- this.ezCloseModal.emit(this.opened);
111108
- }
111109
- componentDidLoad() {
111110
- this.handleopenedChange();
111111
- }
111112
- onMouseDownHandler(event) {
111113
- if (this.closeOutsideClick && event.target === this._overlay) {
111114
- this.closeModal();
111115
- }
111116
- }
111117
- render() {
111118
- const positionSufix = this.align === "left" ? "left" : "right";
111119
- return (index.h(index.Host, null, this.opened
111120
- ?
111121
- index.h("div", { class: "modal", onMouseDown: evt => this.onMouseDownHandler(evt) }, index.h("div", { class: `modal__container modal__container--${positionSufix}`, ref: ref => this._overlay = ref }, index.h("div", { class: `modal__content modal__content--${positionSufix} ${this.modalSize}` }, index.h("slot", null))))
111122
- :
111123
- undefined));
111124
- }
111125
- static get watchers() { return {
111126
- "opened": ["handleopenedChange"]
111127
- }; }
111128
- };
111129
- EzModal.style = ezModalCss;
111130
-
111131
- const ezTabselectorCss = "@keyframes activate{0%{clip-path:inset(calc(100% - 3px) 50% 0px 50%)}100%{clip-path:inset(calc(100% - 3px) 0px 0px 0px)}}:host{display:flex;position:relative;width:100%;overflow:hidden;--tabselector--backward-icon: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>');--tabselector--forward-icon: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>')}.scroll{display:flex;width:100%;scroll-behavior:smooth;overflow-x:auto;scrollbar-width:none}.scroll.startHidden{-webkit-mask-image:linear-gradient(90deg, transparent 20px, #000 48px)}.scroll.midle{-webkit-mask-image:linear-gradient(90deg, transparent 20px, #000 48px, #000 calc(100% - 48px), transparent calc(100% - 20px))}.scroll.endHidden{-webkit-mask-image:linear-gradient(90deg, #000 calc(100% - 48px), transparent calc(100% - 20px))}.tab{display:flex;border:none;min-width:100px;background-color:unset;cursor:pointer;padding:6px 12px;align-items:center;justify-content:center;color:var(--text--primary, #626e82);font-family:var(--font-pattern, \"Sora, Algerian\");font-size:var(--title--small, 14px)}.tab:focus,.forward-button,.backward-button{outline:none}.is-active{position:relative;color:var(--color--primary, #008561)}.is-active::after{content:\"\";position:absolute;width:100%;height:100%;background-color:var(--color--primary, #008561);clip-path:inset(calc(100% - 3px) 0px 0px 0px);animation:activate 0.25s ease-in-out}.is-focused{border:1px dashed var(--color--primary, #000000c5)}.tab-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-shadow:var(--text-shadow);margin-bottom:var(--space--extra-small, 3px)}.forward-button,.backward-button{position:absolute;z-index:1;display:flex;box-sizing:border-box;padding:0px;top:0px;right:0px;width:16px;height:100%;border:none;background-color:unset;cursor:pointer;justify-content:center;align-items:center}.backward-button{left:0px}.forward-button::after,.backward-button::after{content:'';display:flex;background-color:var(--text--primary, #008561);width:10px;height:16px}.forward-button::after{-webkit-mask-image:var(--tabselector--forward-icon);mask-image:var(--tabselector--forward-icon)}.backward-button::after{-webkit-mask-image:var(--tabselector--backward-icon);mask-image:var(--tabselector--backward-icon)}.forward-button:hover::after,.backward-button:hover::after{background-color:var(--color--primary, #4e4e4e)}.hidden{display:none}.scroll::-webkit-scrollbar{display:none}";
111132
-
111133
- let EzTabselector = class {
111134
- constructor(hostRef) {
111135
- index.registerInstance(this, hostRef);
111136
- this.ezChange = index.createEvent(this, "ezChange", 7);
111137
- this.setFocusedParam = (ev) => {
111138
- if (ev.key === "Enter") {
111139
- const selectedTab = this._processedTabs[this._focusedIndex];
111140
- this.handleTabClick(selectedTab);
111141
- ev.preventDefault();
111142
- this.setFocusedTab(selectedTab.index);
111143
- }
111144
- else if (ev.key === "ArrowLeft" || ev.key === "ArrowRight") {
111145
- let operator = undefined;
111146
- if (ev.key === "ArrowLeft") {
111147
- operator = false;
111148
- }
111149
- else if (ev.key === "ArrowRight") {
111150
- operator = true;
111151
- }
111152
- else {
111153
- return;
111154
- }
111155
- if (this._focusedIndex === undefined) {
111156
- if (operator === false) {
111157
- this._focusedIndex = this.selectedIndex !== undefined ? this.selectedIndex - 1 : undefined;
111158
- }
111159
- else {
111160
- this._focusedIndex = this.selectedIndex !== undefined ? this.selectedIndex + 1 : undefined;
111161
- }
111162
- }
111163
- else {
111164
- if (operator === false) {
111165
- this._focusedIndex = this._focusedIndex - 1;
111166
- }
111167
- else {
111168
- this._focusedIndex = this._focusedIndex + 1;
111169
- }
111170
- }
111171
- if (this._focusedIndex < 0) {
111172
- this._focusedIndex = 0;
111173
- }
111174
- else if (this._focusedIndex > this._processedTabs.length - 1) {
111175
- this._focusedIndex = this._processedTabs.length - 1;
111176
- }
111177
- this.setFocusedBtn(true, this._focusedIndex);
111178
- this.setFocusedTab(this._focusedIndex);
111179
- }
111180
- else if (ev.key === "Tab" || ev.key === "Escape") {
111181
- const currentTab = this._processedTabs[this.selectedIndex];
111182
- this._focusedIndex = undefined;
111183
- this.handleTabClick(currentTab);
111184
- ev.preventDefault();
111185
- this.setFocusedTab(this.selectedIndex);
111186
- }
111187
- };
111188
- }
111189
- handleTabClick(tab) {
111190
- this.selectedIndex = tab.index;
111191
- this._focusedIndex = undefined;
111192
- this.selectedTab = tab.tabKey;
111193
- this.ezChange.emit(tab);
111194
- this.setFocusedBtn(false, tab.index);
111195
- }
111196
- componentWillRender() {
111197
- if (!this._processedTabs) {
111198
- this._processedTabs = [];
111199
- if (this.tabs) {
111200
- this.tabs.split(",").forEach((label) => {
111201
- label = label.trim();
111202
- this._processedTabs.push({ label, tabKey: label, index: this._processedTabs.length });
111203
- });
111204
- }
111205
- this._hostElem.querySelectorAll("ez-tab").forEach((elem) => {
111206
- const tabKey = elem.getAttribute("tabKey");
111207
- const label = elem.getAttribute("label");
111208
- const t = { label, tabKey, index: this._processedTabs.length };
111209
- const content = elem.firstChild;
111210
- if (content) {
111211
- content.setAttribute("slot", "tab" + t.index);
111212
- this._hostElem.appendChild(content);
111213
- }
111214
- this._processedTabs.push(t);
111215
- });
111216
- }
111217
- }
111218
- handleSlotChange(ev) {
111219
- const slot = ev.target;
111220
- const content = slot.assignedElements()[0];
111221
- if (content) {
111222
- content.style.marginLeft = "6px";
111223
- }
111224
- }
111225
- scrollBackward() {
111226
- const container = this._scrollContainer;
111227
- if (container) {
111228
- container.scrollLeft -= container.clientWidth;
111229
- }
111230
- }
111231
- scrollFoward() {
111232
- const container = this._scrollContainer;
111233
- if (container) {
111234
- let lastTab = null;
111235
- container.querySelectorAll(".tab").forEach((tab) => {
111236
- if (tab.getBoundingClientRect().right < container.clientWidth) {
111237
- lastTab = tab;
111238
- }
111239
- });
111240
- container.scrollLeft = lastTab.offsetLeft + lastTab.offsetWidth;
111241
- }
111242
- }
111243
- componentDidRender() {
111244
- this.updateScroll();
111245
- }
111246
- updateScroll() {
111247
- const container = this._scrollContainer;
111248
- if (container) {
111249
- const { scrollWidth, clientWidth, scrollLeft } = container;
111250
- const remainingScroll = scrollWidth - clientWidth - Math.ceil(scrollLeft);
111251
- this._startHidden = container.scrollLeft > 0;
111252
- this._endHidden = remainingScroll > 0;
111253
- if (this._startHidden) {
111254
- this._backwardButton.classList.remove("hidden");
111255
- }
111256
- else {
111257
- this._backwardButton.classList.add("hidden");
111258
- }
111259
- if (this._endHidden) {
111260
- this._forwardButton.classList.remove("hidden");
111261
- }
111262
- else {
111263
- this._forwardButton.classList.add("hidden");
111264
- }
111265
- const classNames = ["", "startHidden", "endHidden", "midle"];
111266
- const currentClass = classNames[Number(this._startHidden) | Number(this._endHidden) << 1];
111267
- classNames.forEach((name) => {
111268
- if (name !== currentClass && container.classList.contains(name)) {
111269
- container.classList.remove(name);
111270
- }
111271
- });
111272
- if (currentClass && !container.classList.contains(currentClass)) {
111273
- container.classList.add(currentClass);
111274
- }
111275
- }
111276
- }
111277
- domScrollHandler() {
111278
- window.clearTimeout(this._scrollCallBack);
111279
- this._scrollCallBack = window.setTimeout(() => { this.updateScroll(); }, 200);
111280
- }
111281
- setFocusedTab(index) {
111282
- window.clearTimeout(this._scrollCallBackTest);
111283
- this._scrollCallBackTest = window.setTimeout(() => {
111284
- const tabtoscroll = this._scrollContainer.querySelector(`#tab${index}`);
111285
- tabtoscroll.scrollIntoView();
111286
- }, 200);
111287
- }
111288
- getTextWidth(text) {
111289
- if (this._textMesurement === undefined) {
111290
- this._textMesurement = this._hostElem.shadowRoot.ownerDocument.createElement("canvas");
111291
- }
111292
- const context = this._textMesurement.getContext("2d");
111293
- context.font = "14px Sora, Algerian";
111294
- return Math.min(220, 24 + context.measureText(text).width) + "px";
111295
- }
111296
- ;
111297
- setFocusedBtn(visible, parameter) {
111298
- const tabsButtons = this._scrollContainer.querySelectorAll(".tab");
111299
- tabsButtons.forEach((el) => {
111300
- el.classList.remove("is-focused");
111301
- if (el.id === "tab" + parameter && visible) {
111302
- el.classList.add("is-focused");
111303
- }
111304
- });
111305
- }
111306
- render() {
111307
- return (index.h(index.Host, null, index.h("button", { class: "backward-button", ref: (el) => this._backwardButton = el, onClick: () => this.scrollBackward() }), index.h("div", { class: "scroll", ref: (el) => this._scrollContainer = el, onScroll: () => this.domScrollHandler(), onKeyDown: (ev) => this.setFocusedParam(ev) }, this._processedTabs.map((tab, index$1) => {
111308
- const labelStyle = { "min-width": this.getTextWidth(tab.label) };
111309
- const tabId = "tab" + index$1;
111310
- const isSelected = index$1 === this.selectedIndex || (this.selectedTab && tab.tabKey === this.selectedTab);
111311
- if (isSelected) {
111312
- this.selectedTab = tab.tabKey;
111313
- this.selectedIndex = index$1;
111314
- }
111315
- return index.h("button", { id: tabId, class: `tab${isSelected ? " is-active" : ""}`, onClick: () => this.handleTabClick(tab), style: labelStyle }, index.h("span", { class: "tab-label", title: tab.label }, tab.label), index.h("slot", { name: tabId, onSlotchange: (ev) => { this.handleSlotChange(ev); } }));
111316
- })), index.h("button", { class: "forward-button", ref: (el) => this._forwardButton = el, onClick: () => this.scrollFoward() })));
111317
- }
111318
- get _hostElem() { return index.getElement(this); }
111319
- };
111320
- EzTabselector.style = ezTabselectorCss;
111321
-
111322
- const ezTextInputCss = ":host{--ez-text-input--height:42px;--ez-text-input--width:100%;--ez-text-input__icon--width:48px;--ez-text-input--border-radius:var(--border--radius-medium, 12px);--ez-text-input--font-size:var(--text--medium, 14px);--ez-text-input--font-family:var(--font-pattern, Arial);--ez-text-input--font-weight:var(--text-weight--large, 500);--ez-text-input--color:var(--title--primary, #000);--ez-text-input__input--background-color:var(--background--medium, #e0e0e0);--ez-text-input__input--border:var(--border--medium, 2px solid);--ez-text-input__input--border-color:var(--ez-text-input__input--background-color);--ez-text-input__input--focus--border-color:var(--color--alert-cold-800, #042EFF);--ez-text-input__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--ez-text-input__input--disabled--color:var(--text--disable, #AFB6C0);--ez-text-input__input--error--border-color:#CC2936;--ez-text-input__message_box--font-size:var(--text--small, 12px);--ez-text-input__message_box--info--color:var(--color--success, #22085d);--ez-text-input__message_box--error--color:var(--color--error, #FF0000);--ez-text-input__label--floating--top:6px;--ez-text-input__label--padding-top:12px;--ez-text-input__label--padding-left:14px;--ez-text-input__label--padding-right:12px;display:flex;flex-wrap:wrap;position:relative;width:var(--ez-text-input--width)}input{width:100%;box-sizing:border-box;padding:var(--space--medium, 6px);font-weight:var(--text-weight--large, 600);height:var(--ez-text-input--height);border-radius:var(--ez-text-input--border-radius);font-family:var(--ez-text-input--font-family);font-size:var(--ez-text-input--font-size);border:var(--ez-text-input__input--border);border-color:var(--ez-text-input__input--border-color);background-color:var(--ez-text-input__input--background-color);color:var(--ez-text-input--color)}input:disabled{background-color:var(--ez-text-input__input--disabled--background-color);color:var(--ez-text-input__input--disabled--color)}input:focus{outline:none;border-color:var(--ez-text-input__input--focus--border-color)}input.icon--left{padding-left:var(--ez-text-input__icon--width)}input.icon--right{padding-right:var(--ez-text-input__icon--width)}input.hasError{color:var(--ez-text-input--color);border-color:var(--ez-text-input__input--error--border-color)}input.text--right{text-align:right}.message-box{display:flex;min-height:16px;min-width:100%;margin-top:2px;line-height:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--ez-text-input--font-family);font-size:var(--ez-text-input__message_box--font-size);color:var(--ez-text-input__message_box--info--color)}.hasError{color:var(--ez-text-input__message_box--error--color)}.input__label{box-sizing:border-box;position:absolute;z-index:var(--visible);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-transition:font-size .05s, top .05s;transition:font-size .05s, top .05s;width:calc(100% - var(--ez-text-input__label--padding-right));left:var(--ez-text-input--space--medium);font-family:var(--ez-text-input--font-family);font-size:var(--ez-text-input--font-size);font-weight:var(--ez-text-input--font-weight);color:var(--ez-text-input--color);top:var(--ez-text-input__label--padding-top);left:var(--ez-text-input__label--padding-left);padding-right:var(--ez-text-input__label--padding-right)}.input__label--floated{font-family:var(--ez-text-input--font-family);font-size:var(--text--extra-small);color:var(--text--primary);top:var(--ez-text-input__label--floating--top)}.input__label--disabled{color:var(--ez-text-input__input--disabled--color)}.input__label--left{text-align:left;left:calc(var(--ez-text-input__icon--width) + 2px);width:calc(100% - var(--ez-text-input__icon--width))}.input__label--right{right:var(--ez-text-input__icon--width);width:calc(100% - var(--ez-text-input__icon--width))}.input__label--left.input__label--right{left:calc(var(--ez-text-input__icon--width) + 2px);width:calc(100% - var(--ez-text-input__icon--width) * 2)}.input--with--label{padding-bottom:0}";
111323
-
111324
- let EzTextInput = class {
111325
- constructor(hostRef) {
111326
- index.registerInstance(this, hostRef);
111327
- this.ezChange = index.createEvent(this, "ezChange", 7);
111328
- /**
111329
- * Deixa o campo disponível ou não para digitação.
111330
- */
111331
- this.enabled = true;
111332
- }
111333
- showError() {
111334
- const hasError = typeof this.errorMessage === "string" && this.errorMessage !== "";
111335
- if (hasError) {
111336
- this._inputElem.classList.add("hasError");
111337
- this._messageBoxElem.classList.add("hasError");
111338
- }
111339
- else {
111340
- this._inputElem.classList.remove("hasError");
111341
- this._messageBoxElem.classList.remove("hasError");
111342
- }
111343
- }
111344
- prepareMask() {
111345
- if (this.mask) {
111346
- if (this._maskFormatter == undefined) {
111347
- this._maskFormatter = new index$1.MaskFormatter(this.mask);
111348
- }
111349
- else {
111350
- this._maskFormatter.mask = this.mask;
111351
- }
111352
- }
111353
- }
111354
- updateInputValue() {
111355
- if (this._inputElem) {
111356
- this._inputElem.value = this.value;
111357
- }
111358
- this.handleChange();
111359
- this.errorMessage = "";
111360
- this.ezChange.emit(this.value);
111361
- this.adjustFloatingLabel();
111362
- }
111363
- adjustFloatingLabel() {
111364
- if (this.label && this._labelElem) {
111365
- if (this._inputElem && !this._inputElem.classList.contains("input--with--label")) {
111366
- this._inputElem.classList.add("input--with--label");
111367
- }
111368
- const hasValue = this.value && this.value.toString().length > 0;
111369
- const containsFloatedClass = this._labelElem.classList.contains("input__label--floated");
111370
- if (hasValue || this.isFocused()) {
111371
- if (!containsFloatedClass) {
111372
- this._labelElem.classList.add("input__label--floated");
111373
- }
111374
- }
111375
- else {
111376
- if (containsFloatedClass) {
111377
- this._labelElem.classList.remove("input__label--floated");
111378
- }
111379
- }
111380
- }
111381
- }
111382
- isFocused() {
111383
- return this._hostElement.shadowRoot.activeElement !== null;
111384
- }
111385
- //---------------------------------------------
111386
- // Public methods
111387
- //---------------------------------------------
111388
- /**
111389
- * Faz o foco no componente de input
111390
- */
111391
- async setFocus() {
111392
- this._inputElem.focus();
111393
- }
111394
- /**
111395
- * Remove o foco no componente de input
111396
- */
111397
- async setBlur() {
111398
- this._inputElem.blur();
111399
- }
111400
- //---------------------------------------------
111401
- // Event handlers
111402
- //---------------------------------------------
111403
- handleFocusout() {
111404
- const value = this._inputElem.value;
111405
- if (value && this._maskFormatter) {
111406
- try {
111407
- this._inputElem.value = this._maskFormatter.format(value);
111408
- }
111409
- catch (e) {
111410
- this.errorMessage = e.message;
111411
- }
111412
- }
111413
- this.value = this._inputElem.value;
111414
- this.adjustFloatingLabel();
111415
- }
111416
- isValidValue(value) {
111417
- if (this.restrict) {
111418
- return Array.from(value).reduce((valid, c) => valid && this.restrict.indexOf(c) > -1, true);
111419
- }
111420
- return true;
111421
- }
111422
- handleChange() {
111423
- if (!this._inputElem) {
111424
- return;
111425
- }
111426
- const value = this._inputElem.value;
111427
- if (this.isValidValue(value)) {
111428
- this._lastValidValue = value;
111429
- }
111430
- else {
111431
- this._inputElem.value = this._lastValidValue === undefined ? "" : this._lastValidValue;
111432
- }
111433
- this.value = this._inputElem.value;
111434
- }
111435
- handleSlotChange(ev) {
111436
- const slot = ev.target;
111437
- const content = slot.assignedElements()[0];
111438
- if (content) {
111439
- content.style.position = "absolute";
111440
- content.style.display = "flex";
111441
- content.style.alignItems = "center";
111442
- content.style.justifyContent = "center";
111443
- content.style.overflow = "hidden";
111444
- content.style.top = "0px";
111445
- content.style.width = "var(--ez-text-input__icon--width)";
111446
- content.style.height = "var(--ez-text-input--height)";
111447
- if (slot.name == "leftIcon") {
111448
- content.style.left = "0px";
111449
- content.style.borderRadius = "var(--ez-text-input--border-radius) 0 0 var(--ez-text-input--border-radius)";
111450
- this._inputElem.classList.add("icon--left");
111451
- if (this._labelElem) {
111452
- this._labelElem.classList.add("input__label--left");
111453
- }
111454
- }
111455
- else if (slot.name == "rightIcon") {
111456
- content.style.right = "0px";
111457
- content.style.borderRadius = "0 var(--ez-text-input--border-radius) var(--ez-text-input--border-radius) 0";
111458
- this._inputElem.classList.add("icon--right");
111459
- if (this._labelElem) {
111460
- this._labelElem.classList.add("input__label--right");
111461
- }
111462
- }
111463
- }
111464
- this.showError();
111465
- }
111466
- doFocus() {
111467
- if (this.label && this._labelElem && !this._labelElem.classList.contains("input__label--floated")) {
111468
- this._labelElem.classList.add("input__label--floated");
111469
- }
111470
- }
111471
- //---------------------------------------------
111472
- // Lifecycle web component
111473
- //---------------------------------------------
111474
- componentDidLoad() {
111475
- this.showError();
111476
- this.prepareMask();
111477
- this.adjustFloatingLabel();
111478
- }
111479
- componentWillLoad() {
111480
- this.prepareMask();
111481
- if (this.value) {
111482
- if (this._maskFormatter) {
111483
- try {
111484
- this.value = this._maskFormatter.format(this.value);
111485
- }
111486
- catch (e) {
111487
- this.errorMessage = e.message;
111488
- }
111489
- }
111490
- if (!this.isValidValue(this.value)) {
111491
- this._lastValidValue = "";
111492
- this.value = "";
111493
- }
111494
- }
111495
- }
111496
- render() {
111497
- return (index.h(index.Host, null, index.h("slot", { name: "leftIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.label ?
111498
- index.h("label", { ref: (el) => this._labelElem = el, class: this.enabled ? "input__label" : "input__label input__label--disabled", onClick: () => this._inputElem.focus(), title: this.label }, this.label)
111499
- : null, index.h("input", { onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: "text", value: this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), index.h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), index.h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage }, this.errorMessage)));
111500
- }
111501
- get _hostElement() { return index.getElement(this); }
111502
- static get watchers() { return {
111503
- "errorMessage": ["showError"],
111504
- "mask": ["prepareMask"],
111505
- "value": ["updateInputValue"]
111506
- }; }
111507
- };
111508
- EzTextInput.style = ezTextInputCss;
111509
-
111510
- const gridConfigCss = ".sc-grid-config-h{--ez-grid-config__footer--padding-top:var(--space--medium, 12px);--ez-grid-config__main--padding-right:var(--space--medium, 12px);--ez-grid-config__tabselector-container--padding:var(--space--medium, 12px);--ez-grid-config__button-close--padding-left:var(--space--medium, 12px);--ez-grid-config__subtitle--font-family:var(--font-pattern, \"Sora\");--ez-grid-config__title--font-family:var(--font-pattern, \"Sora\");--ez-grid-config__title--font-weight:var(--text-weight--large, 14px);--ez-grid-config__subtitle--font-size:var(--text--medium, 14px);--ez-grid-config__scrollbar--width:var(--space--medium, 12px);--ez-grid-config__main__scrollbar--background-color:var(--text--primary, #626e82);--ez-grid-config__main__scrollbar--border-radius:var(--border--radius-medium, 12px);display:grid;grid-template-rows:auto 1fr auto;max-height:100%;width:100%}.padding-right--medium.sc-grid-config{padding-right:var(--space--medium)}ez-list.sc-grid-config{height:100%}.grid-config__footer.sc-grid-config{padding-top:var(--ez-grid-config__footer--padding-top);display:flex;justify-content:flex-end;width:100%}.hidden.sc-grid-config{display:none}.grid-config__main.sc-grid-config{padding-right:var(--ez-grid-config__main--padding-right);overflow-y:auto}.tabselector-container.sc-grid-config{padding:var(--ez-grid-config__tabselector-container--padding) 0}.button-close.sc-grid-config{padding-left:var(--ez-grid-config__button-close--padding-left)}.title-container.sc-grid-config{display:flex;justify-content:center;align-items:center}.subtitle.sc-grid-config{font-family:var(--ez-grid-config__subtitle--font-family);font-size:var(--ez-grid-config__subtitle--font-size)}.title.sc-grid-config{display:flex;font-family:var(--ez-grid-config__title--font-family);margin:0;font-weight:var(--ez-grid-config__title--font-weight);line-height:1.3}.grid-config__main.sc-grid-config::-webkit-scrollbar-track{background-color:#f0f2f5}.grid-config__main.sc-grid-config::-webkit-scrollbar-thumb{background-color:var(--ez-grid-config__main__scrollbar--background-color);border-radius:var(--ez-grid-config__main__scrollbar--border-radius)}.grid-config__main.sc-grid-config::-webkit-scrollbar{background-color:#f0f2f5;width:var(--ez-grid-config__scrollbar--width);max-width:var(--ez-grid-config__scrollbar--width);min-width:var(--ez-grid-config__scrollbar--width)}";
111511
-
111512
- let GridConfig = class {
111513
- constructor(hostRef) {
111514
- index.registerInstance(this, hostRef);
111515
- this.configFinish = index.createEvent(this, "configFinish", 7);
111516
- this.configCancel = index.createEvent(this, "configCancel", 7);
111517
- this._columnListHistory = [];
111518
- this._orderListItems = [];
111519
- this._columListItems = [];
111520
- this.selectedTab = "Colunas";
111521
- this._selectedIndex = -1;
111522
- }
111523
- /* Creation Methods */
111524
- createOrderList() {
111525
- var _a;
111526
- let newList = [];
111527
- if (((_a = this._columnListHistory) === null || _a === void 0 ? void 0 : _a.length) > 0) {
111528
- this._columnListHistory.find(group => group.group === "Visíveis").items.forEach(column => {
111529
- let item = { label: column.label };
111530
- newList.push(item);
111531
- });
111532
- }
111533
- else {
111534
- this.columns.forEach(column => {
111535
- let item = { name: column.name, label: column.label };
111536
- if (!column.hidden) {
111537
- newList.push(item);
111538
- }
111539
- });
111540
- }
111541
- this._orderListItems = newList;
111542
- }
111543
- createColumnList() {
111544
- let visibleGroup = {
111545
- group: 'Visíveis',
111546
- items: [],
111547
- };
111548
- let hiddenGroup = {
111549
- group: 'Ocultas',
111550
- items: [],
111551
- sort: 'ASC'
111552
- };
111553
- this.columns.forEach(column => {
111554
- let item = { label: column.label };
111555
- if (column.hidden) {
111556
- hiddenGroup.items.push(item);
111557
- }
111558
- else {
111559
- visibleGroup.items.push(item);
111560
- }
111561
- });
111562
- if (this._columnListHistory.length <= 0) {
111563
- this._columListItems = [visibleGroup, hiddenGroup];
111564
- }
111565
- }
111566
- buildColumnListSlot(item, group) {
111567
- return (index.h("div", null, index.h("ez-check", { mode: 'switch', id: 'switch' + item + group, value: group.group === "Visíveis", onEzChange: (ev) => { this.switchColumnGroup(ev, item); } })));
111568
- }
111569
- buildOrderListSlot(item) {
111570
- let existingItem = this.columns.find(columnItem => columnItem.label === item.label);
111571
- return (index.h("div", null, index.h("select-box", { selectedOption: existingItem === null || existingItem === void 0 ? void 0 : existingItem.sort, key: 'select-box' + item, onEzChange: (ev) => { ev.stopPropagation(); this.updateOrder(ev.detail, item); } })));
111572
- }
111573
- updateOrder(sortOrder, updatedItem) {
111574
- let newList = [...this.columns];
111575
- let newItem = newList.find(item => item.label === updatedItem.label);
111576
- if (newItem) {
111577
- newItem.sort = sortOrder;
111578
- }
111579
- this.columns = newList;
111580
- }
111581
- /* Actions Methods */
111582
- switchColumnGroup(ev, switchedItem) {
111583
- ev.stopPropagation();
111584
- let newList = [...this._columListItems];
111585
- if (ev.detail === true) {
111586
- let hiddenGroup = newList.find(group => group.group === "Ocultas");
111587
- let index = hiddenGroup.items.findIndex(item => item.label === switchedItem.label);
111588
- if (index >= 0) {
111589
- hiddenGroup.items.splice(index, 1);
111590
- }
111591
- let visibleGroup = newList.find(group => group.group === "Visíveis");
111592
- visibleGroup.items.push(switchedItem);
111593
- this._columListItems = newList;
111594
- this.createOrderList();
111595
- }
111596
- else if (ev.detail === false) {
111597
- let visibleGroup = newList.find(group => group.group === "Visíveis");
111598
- let index = visibleGroup.items.findIndex(item => item.label === switchedItem.label);
111599
- if (index >= 0) {
111600
- visibleGroup.items.splice(index, 1);
111601
- }
111602
- let hiddenGroup = newList.find(group => group.group === "Ocultas");
111603
- hiddenGroup.items.push(switchedItem);
111604
- this._columListItems = newList;
111605
- this.createOrderList();
111606
- }
111607
- }
111608
- finish() {
111609
- let newColumnList = [];
111610
- this._columListItems.forEach(group => {
111611
- group.items.forEach(item => {
111612
- const baseColumn = this.columns.find(column => column.label === item.label);
111613
- let newColumnItem = Object.assign({}, baseColumn);
111614
- if (group.group === "Ocultas") {
111615
- newColumnItem.hidden = true;
111616
- }
111617
- else {
111618
- newColumnItem.hidden = false;
111619
- }
111620
- newColumnList.push(newColumnItem);
111621
- });
111622
- });
111623
- this._columnListHistory = [];
111624
- this.columns = newColumnList;
111625
- this.configFinish.emit(this.columns);
111626
- }
111627
- async locateColumn(evt, searchingText) {
111628
- var _a;
111629
- const hitEnter = evt.key === "Enter";
111630
- if (!searchingText) {
111631
- searchingText = (_a = evt.currentTarget) === null || _a === void 0 ? void 0 : _a.value;
111632
- }
111633
- let newSelected = -1;
111634
- if (this.selectedTab === "Ordenação") {
111635
- if (searchingText) {
111636
- const matchedIndexes = [];
111637
- let orderListDatasource;
111638
- await this._orderList.getList().then(listGroup => {
111639
- orderListDatasource = listGroup;
111640
- orderListDatasource.forEach((column, index) => {
111641
- if (this.compareWords(column, searchingText)) {
111642
- matchedIndexes.push(index);
111643
- }
111644
- });
111645
- });
111646
- if (matchedIndexes.length > 0) {
111647
- if (hitEnter) {
111648
- for (let j = 0; j < matchedIndexes.length; j++) {
111649
- if (matchedIndexes[j] > this._selectedIndex) {
111650
- newSelected = matchedIndexes[j];
111651
- break;
111652
- }
111653
- }
111654
- }
111655
- if (newSelected === -1) {
111656
- newSelected = matchedIndexes[0];
111657
- }
111658
- }
111659
- this._selectedIndex = newSelected;
111660
- let selectedColumn;
111661
- selectedColumn = orderListDatasource[newSelected];
111662
- if (selectedColumn) {
111663
- this._orderList.setSelection({ label: selectedColumn.label }, true);
111664
- }
111665
- else {
111666
- this._orderList.setSelection(undefined);
111667
- }
111668
- }
111669
- else {
111670
- this._orderList.setSelection(undefined);
111671
- }
111672
- }
111673
- else {
111674
- if (searchingText) {
111675
- const matchedIndexes = [];
111676
- this.columns.forEach((column, index) => {
111677
- if (this.compareWords(column, searchingText)) {
111678
- matchedIndexes.push(index);
111679
- }
111680
- });
111681
- if (matchedIndexes.length > 0) {
111682
- if (hitEnter) {
111683
- for (let j = 0; j < matchedIndexes.length; j++) {
111684
- if (matchedIndexes[j] > this._selectedIndex) {
111685
- newSelected = matchedIndexes[j];
111686
- break;
111687
- }
111688
- }
111689
- }
111690
- if (newSelected === -1) {
111691
- newSelected = matchedIndexes[0];
111692
- }
111693
- }
111694
- this._selectedIndex = newSelected;
111695
- let selectedColumn = this.columns[newSelected];
111696
- if (selectedColumn) {
111697
- this._columnList.setSelection({ label: selectedColumn.label }, true);
111698
- }
111699
- else {
111700
- this._columnList.setSelection(undefined);
111701
- }
111702
- }
111703
- else {
111704
- this._columnList.setSelection(undefined);
111705
- }
111706
- }
111707
- }
111708
- compareWords(column, searchingText) {
111709
- if (StringUtils.replaceAccentuatedChars(column.label).indexOf(StringUtils.replaceAccentuatedChars(searchingText)) > -1) {
111710
- return true;
111711
- }
111712
- return false;
111713
- }
111714
- closeConfig() {
111715
- this._columnListHistory = [];
111716
- this.configCancel.emit();
111717
- }
111718
- /* Handlers */
111719
- handleTabChange(ev) {
111720
- var _a;
111721
- if ((_a = ev === null || ev === void 0 ? void 0 : ev.target) === null || _a === void 0 ? void 0 : _a.selectedTab) {
111722
- if (ev.target.selectedTab === "Ordenação") {
111723
- this._columnListHistory = this._columnList.dataSource;
111724
- this.createOrderList();
111725
- }
111726
- this.selectedTab = ev.target.selectedTab;
111727
- }
111728
- }
111729
- handleColumnListChange(ev) {
111730
- var _a;
111731
- if (ev.detail) {
111732
- let visibleItems = (_a = ev.detail.find(group => group.group === "Visíveis")) === null || _a === void 0 ? void 0 : _a.items;
111733
- if (visibleItems) {
111734
- this._orderListItems = visibleItems;
111735
- }
111736
- }
111737
- }
111738
- componentWillRender() {
111739
- var _a;
111740
- if (((_a = this.columns) === null || _a === void 0 ? void 0 : _a.length) > 0) {
111741
- this.createColumnList();
111742
- this.createOrderList();
111743
- }
111744
- }
111745
- componentDidRender() {
111746
- var _a;
111747
- if (((_a = this.columns) === null || _a === void 0 ? void 0 : _a.length) > 0) {
111748
- this.locateColumn(new KeyboardEvent("arrow-right", { key: "ArrowRight" }), this._searchElement.value);
111749
- }
111750
- }
111751
- render() {
111752
- return (index.h(index.Host, null, index.h("div", { class: "grid-config__header" }, index.h("div", { class: "title-container" }, index.h("div", { class: "" }, index.h("label", { class: "title" }, "Configura\u00E7\u00E3o da Grade"), index.h("label", { class: "subtitle" }, "Defina visibilidade e ordem das colunas.")), index.h("div", { class: "button-close" }, index.h("ez-button", { mode: 'icon', image: AssetsUtils.getSpritePath("close"), size: 'medium', onClick: () => this.closeConfig() }))), index.h("div", { class: "tabselector-container" }, index.h("ez-tabselector", { selectedTab: this.selectedTab, selectedIndex: 0, onEzChange: (ev) => { this.handleTabChange(ev); }, tabs: 'Colunas, Ordena\u00E7\u00E3o' })), index.h("div", null, index.h("ez-text-input", { ref: (el) => this._searchElement = el, label: "Localizar coluna", onKeyUp: evt => this.locateColumn(evt) }, index.h("ez-icon", { slot: "leftIcon", size: "medium", href: AssetsUtils.getSpritePath("search") })))), index.h("div", { class: "grid-config__main" }, index.h("ez-list", { ref: (el) => this._columnList = el, class: this.selectedTab === "Colunas" ? "" : "hidden", dataSource: this._columListItems, onEzChange: ev => this.handleColumnListChange(ev), ezDraggable: true, ezSelectable: true, itemSlotBuilder: (item, group) => this.buildColumnListSlot(item, group), useGroups: true }), index.h("ez-list", { ref: (el) => this._orderList = el, class: this.selectedTab === "Ordenação" ? "" : "hidden", dataSource: this._orderListItems, ezSelectable: true, itemSlotBuilder: (item) => this.buildOrderListSlot(item) })), index.h("div", { class: "grid-config__footer" }, index.h("ez-button", { class: "padding-right--medium", label: "Cancelar", onClick: () => this.closeConfig() }), index.h("ez-button", { label: "Concluir", class: "button--primary", onClick: () => this.finish() }))));
111753
- }
111754
- static get assetsDirs() { return ["../assets"]; }
111755
- };
111756
- GridConfig.style = gridConfigCss;
111757
-
111758
- const selectBoxCss = "select{border:1px solid #DCE0E8;font-family:'Sora';border-radius:3px;outline:none;cursor:pointer}";
111759
-
111760
- let SelectBox = class {
111761
- constructor(hostRef) {
111762
- index.registerInstance(this, hostRef);
111763
- this.ezChange = index.createEvent(this, "ezChange", 7);
111764
- }
111765
- changeSelection() {
111766
- this.ezChange.emit(this._selectElem.value);
111767
- }
111768
- componentDidRender() {
111769
- if (this._selectElem) {
111770
- if (this.selectedOption) {
111771
- this._selectElem.value = this.selectedOption;
111772
- }
111773
- else {
111774
- this._selectElem.value = "na";
111775
- }
111776
- }
111777
- }
111778
- render() {
111779
- return (index.h("select", { ref: (el) => this._selectElem = el, onChange: () => { this.changeSelection(); } }, index.h("option", { value: "na" }, "N/A"), index.h("option", { value: "asc" }, "A-Z"), index.h("option", { value: "desc" }, "Z-A")));
111780
- }
111781
- static get assetsDirs() { return ["../assets"]; }
111782
- };
111783
- SelectBox.style = selectBoxCss;
111784
-
111785
- const testDuCss = ":host{display:block}";
111786
-
111787
- let TestDu = class {
111788
- constructor(hostRef) {
111789
- index.registerInstance(this, hostRef);
111790
- }
111791
- componentWillLoad() {
111792
- this.dataUnit = new index$1.DataUnit("testes_com_formulario");
111793
- this.dataUnit.metadata = {
111794
- name: "dd://br.com.sankhya.fin.cad.movimentacaoFinanceira/Financeiro",
111795
- label: "Parceiro",
111796
- fields: [
111797
- {
111798
- name: "CODPARC",
111799
- label: "Parceiro",
111800
- dataType: index$1.DataType.NUMBER,
111801
- userInterface: index$1.UserInterface.SEARCH,
111802
- required: true,
111803
- properties: {}
111804
- },
111805
- {
111806
- name: "RECDESP",
111807
- label: "Receita/Despesa",
111808
- dataType: index$1.DataType.TEXT,
111809
- userInterface: index$1.UserInterface.OPTIONSELECTOR,
111810
- required: true,
111811
- properties: { options: `{"-1": "Despesa", "1": "Receita"}` }
111812
- },
111813
- {
111814
- name: "P",
111815
- label: "pera",
111816
- dataType: index$1.DataType.TEXT,
111817
- userInterface: index$1.UserInterface.OPTIONSELECTOR,
111818
- properties: { options: `{"M": "Madura", "V": "Verde", "P": "Passada"}` }
111819
- },
111820
- {
111821
- name: "ME",
111822
- label: "ME",
111823
- dataType: index$1.DataType.NUMBER,
111824
- userInterface: index$1.UserInterface.DECIMALNUMBER,
111825
- properties: { precision: 4, prettyPrecision: 1 }
111826
- }
111827
- ]
111828
- };
111829
- this.dataUnit.dataLoader = () => new Promise(accept => accept([
111830
- {
111831
- __record__id__: "1321321321321321",
111832
- CODPARC: 10,
111833
- NOMEPARC: "Parceiro 10",
111834
- P: "M",
111835
- L: "Bagaço",
111836
- LI: "Azedo"
111837
- }
111838
- ]));
111839
- }
111840
- render() {
111841
- return (index.h("ez-grid", { dataUnit: this.dataUnit }));
111842
- }
111843
- };
111844
- TestDu.style = testDuCss;
111845
-
111846
- exports.ez_button = EzButton;
111847
- exports.ez_check = EzCheck;
111848
110449
  exports.ez_grid = EzGrid;
111849
- exports.ez_icon = EzIcon;
111850
- exports.ez_list = EzList;
111851
- exports.ez_modal = EzModal;
111852
- exports.ez_tabselector = EzTabselector;
111853
- exports.ez_text_input = EzTextInput;
111854
- exports.grid_config = GridConfig;
111855
- exports.select_box = SelectBox;
111856
- exports.test_du = TestDu;