@sankhyalabs/ezui 1.1.94 → 1.1.97

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 (93) 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/UnitMetadata-2e11c5d3.js +1310 -0
  4. package/dist/cjs/ez-button_3.cjs.entry.js +578 -0
  5. package/dist/cjs/ez-calendar_14.cjs.entry.js +2657 -0
  6. package/dist/cjs/{ez-button_11.cjs.entry.js → ez-grid.cjs.entry.js} +27 -1501
  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 +7 -7
  11. package/dist/cjs/ezui.cjs.js +1 -1
  12. package/dist/cjs/loader.cjs.js +1 -1
  13. package/dist/collection/components/ez-check/ez-check.css +4 -3
  14. package/dist/collection/components/ez-combo-box/ez-combo-box.js +52 -3
  15. package/dist/collection/components/ez-form/DataBinder.js +13 -0
  16. package/dist/collection/components/ez-form/fieldbuilder/FieldBuilder.js +4 -1
  17. package/dist/collection/components/ez-form/fieldbuilder/tpl/CheckBox.tpl.js +4 -4
  18. package/dist/collection/components/ez-form/fieldbuilder/tpl/ComboBox.tpl.js +2 -2
  19. package/dist/collection/components/ez-form/fieldbuilder/tpl/DateInput.tpl.js +2 -2
  20. package/dist/collection/components/ez-form/fieldbuilder/tpl/FileInput.tpl.js +2 -2
  21. package/dist/collection/components/ez-form/fieldbuilder/tpl/NumberInput.tpl.js +6 -6
  22. package/dist/collection/components/ez-form/fieldbuilder/tpl/SearchInput.tpl.js +2 -2
  23. package/dist/collection/components/ez-form/fieldbuilder/tpl/TextArea.tpl.js +2 -2
  24. package/dist/collection/components/ez-form/structure/FormSheetMetadata.js +14 -8
  25. package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js +3 -2
  26. package/dist/collection/components/ez-grid/ez-grid.css +8 -0
  27. package/dist/collection/components/ez-grid/ez-grid.js +3 -3
  28. package/dist/collection/components/ez-grid/subcomponents/gridconfig/grid-config.css +28 -4
  29. package/dist/collection/components/ez-grid/subcomponents/gridconfig/grid-config.js +6 -5
  30. package/dist/collection/components/ez-grid/subcomponents/select-box/select-box.css +10 -7
  31. package/dist/collection/components/ez-grid/subcomponents/select-box/select-box.js +12 -17
  32. package/dist/collection/components/ez-icon/ez-icon.css +5 -0
  33. package/dist/collection/components/ez-list/ez-list.js +2 -2
  34. package/dist/collection/components/ez-text-input/ez-text-input.css +2 -2
  35. package/dist/collection/components/ez-text-input/ez-text-input.js +24 -1
  36. package/dist/collection/components/test-du/test-du.js +1 -1
  37. package/dist/collection/utils/CSSVarsUtils.js +1 -0
  38. package/dist/custom-elements/index.js +290 -6376
  39. package/dist/esm/{CSSVarsUtils-aeee9825.js → CSSVarsUtils-667e0016.js} +1 -0
  40. package/dist/esm/StringUtils-cbf10229.js +55 -0
  41. package/dist/esm/UnitMetadata-8b1bbaa2.js +1304 -0
  42. package/dist/esm/ez-button_3.entry.js +572 -0
  43. package/dist/esm/ez-calendar_14.entry.js +2640 -0
  44. package/dist/esm/{ez-button_11.entry.js → ez-grid.entry.js} +23 -1487
  45. package/dist/esm/ez-icon.entry.js +38 -0
  46. package/dist/esm/ez-modal_2.entry.js +312 -0
  47. package/dist/esm/ez-popover.entry.js +1 -1
  48. package/dist/esm/ez-time-input.entry.js +2 -2
  49. package/dist/esm/ezui.js +1 -1
  50. package/dist/esm/loader.js +1 -1
  51. package/dist/ezui/ezui.esm.js +1 -1
  52. package/dist/ezui/p-07b60fe9.js +1 -0
  53. package/dist/ezui/p-2336c9ce.entry.js +1 -0
  54. package/dist/ezui/p-2f84ba72.js +1 -0
  55. package/dist/ezui/{p-4b5c4408.entry.js → p-45a25c30.entry.js} +1 -1
  56. package/dist/ezui/{p-ca42d682.entry.js → p-532b5b24.entry.js} +46 -46
  57. package/dist/ezui/p-614fbb4e.entry.js +1 -0
  58. package/dist/ezui/p-7165ac4f.entry.js +1 -0
  59. package/dist/ezui/p-90f6d8a0.entry.js +1 -0
  60. package/dist/ezui/{p-7e1d9c29.entry.js → p-d3f87e18.entry.js} +1 -1
  61. package/dist/ezui/p-d54c157f.js +1 -0
  62. package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +8 -0
  63. package/dist/types/components/ez-form/DataBinder.d.ts +1 -0
  64. package/dist/types/components/ez-form/ez-form.d.ts +6 -1
  65. package/dist/types/components/ez-form/fieldbuilder/tpl/ComboBox.tpl.d.ts +2 -1
  66. package/dist/types/components/ez-form/fieldbuilder/tpl/DateInput.tpl.d.ts +2 -1
  67. package/dist/types/components/ez-form/fieldbuilder/tpl/FileInput.tpl.d.ts +2 -1
  68. package/dist/types/components/ez-form/fieldbuilder/tpl/NumberInput.tpl.d.ts +4 -2
  69. package/dist/types/components/ez-form/fieldbuilder/tpl/SearchInput.tpl.d.ts +2 -1
  70. package/dist/types/components/ez-form/fieldbuilder/tpl/TextArea.tpl.d.ts +2 -1
  71. package/dist/types/components/ez-grid/subcomponents/select-box/select-box.d.ts +6 -4
  72. package/dist/types/components/ez-text-input/ez-text-input.d.ts +4 -0
  73. package/dist/types/components.d.ts +26 -2
  74. package/package.json +2 -2
  75. package/dist/cjs/ApplicationUtils-d1c1db56.js +0 -35
  76. package/dist/cjs/ez-calendar.cjs.entry.js +0 -224
  77. package/dist/cjs/ez-collapsible-box_7.cjs.entry.js +0 -853
  78. package/dist/cjs/ez-combo-box.cjs.entry.js +0 -254
  79. package/dist/cjs/ez-form.cjs.entry.js +0 -753
  80. package/dist/cjs/index-5c8eb919.js +0 -7460
  81. package/dist/esm/ApplicationUtils-01280a9d.js +0 -33
  82. package/dist/esm/ez-calendar.entry.js +0 -220
  83. package/dist/esm/ez-collapsible-box_7.entry.js +0 -843
  84. package/dist/esm/ez-combo-box.entry.js +0 -250
  85. package/dist/esm/ez-form.entry.js +0 -749
  86. package/dist/esm/index-4688c617.js +0 -7452
  87. package/dist/ezui/p-278ce681.entry.js +0 -1
  88. package/dist/ezui/p-33d1247f.entry.js +0 -1
  89. package/dist/ezui/p-5793a2e1.entry.js +0 -1
  90. package/dist/ezui/p-68f6b75e.entry.js +0 -1
  91. package/dist/ezui/p-7107d7ef.js +0 -1
  92. package/dist/ezui/p-7ff8b7f7.js +0 -1
  93. package/dist/ezui/p-8b099482.js +0 -1
@@ -3,136 +3,25 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-88286449.js');
6
- const index$1 = require('./index-5c8eb919.js');
7
- const AssetsUtils = require('./AssetsUtils-4909c6de.js');
6
+ const UnitMetadata = require('./UnitMetadata-2e11c5d3.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;}";
8
+ var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
10
9
 
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)}";
10
+ function createCommonjsModule(fn, basedir, module) {
11
+ return module = {
12
+ path: basedir,
13
+ exports: {},
14
+ require: function (path, base) {
15
+ return commonjsRequire();
16
+ }
17
+ }, fn(module, module.exports), module.exports;
18
+ }
70
19
 
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;
20
+ function commonjsRequire () {
21
+ throw new Error('Dynamic requires are not currently supported by @rollup/plugin-commonjs');
22
+ }
134
23
 
135
- var agGridCommunity_cjs = index$1.createCommonjsModule(function (module, exports) {
24
+ var agGridCommunity_cjs = createCommonjsModule(function (module, exports) {
136
25
 
137
26
  Object.defineProperty(exports, '__esModule', { value: true });
138
27
 
@@ -46434,7 +46323,7 @@ var BaseComponentWrapper = /** @class */ (function () {
46434
46323
  * @link http://www.ag-grid.com/
46435
46324
  * @license MIT
46436
46325
  */
46437
- var globalObj = typeof index$1.commonjsGlobal === 'undefined' ? {} : index$1.commonjsGlobal;
46326
+ var globalObj = typeof commonjsGlobal === 'undefined' ? {} : commonjsGlobal;
46438
46327
  globalObj.HTMLElement = typeof HTMLElement === 'undefined' ? {} : HTMLElement;
46439
46328
  globalObj.HTMLButtonElement = typeof HTMLButtonElement === 'undefined' ? {} : HTMLButtonElement;
46440
46329
  globalObj.HTMLSelectElement = typeof HTMLSelectElement === 'undefined' ? {} : HTMLSelectElement;
@@ -50139,7 +50028,7 @@ exports.simpleHttpRequest = simpleHttpRequest;
50139
50028
  exports.stringToArray = stringToArray;
50140
50029
  });
50141
50030
 
50142
- var agGridEnterprise_cjs = index$1.createCommonjsModule(function (module, exports) {
50031
+ var agGridEnterprise_cjs = createCommonjsModule(function (module, exports) {
50143
50032
 
50144
50033
  Object.defineProperty(exports, '__esModule', { value: true });
50145
50034
 
@@ -110168,60 +110057,6 @@ class DataSource {
110168
110057
  }
110169
110058
  }
110170
110059
 
110171
- /**
110172
- * Classe com utiliários comuns para Strings.
110173
- */
110174
- class StringUtils {
110175
- /**
110176
- * Verifica se a string está vazia.
110177
- * Valores null e undefined são considerados como vazio.
110178
- *
110179
- * @param value String para ser validada.
110180
- */
110181
- static isEmpty(value) {
110182
- if (value == undefined || value === null) {
110183
- return true;
110184
- }
110185
- value = value.toString();
110186
- value = value.trim();
110187
- if (value.length === 0) {
110188
- return true;
110189
- }
110190
- return false;
110191
- }
110192
- /**
110193
- * Remove acentos de vogais, substitui Ç por c e retorna a string em caixa alta.
110194
- *
110195
- * @param value String para ser transformada.
110196
- */
110197
- static replaceAccentuatedChars(text) {
110198
- text = text.toUpperCase();
110199
- text = text.replace(/[À]/, "A");
110200
- text = text.replace(/[Á]/, "A");
110201
- text = text.replace(/[Â]/, "A");
110202
- text = text.replace(/[Ã]/, "A");
110203
- text = text.replace(/[Ä]/, "A");
110204
- text = text.replace(/[È]/, "E");
110205
- text = text.replace(/[É]/, "E");
110206
- text = text.replace(/[Ê]/, "E");
110207
- text = text.replace(/[Ë]/, "E");
110208
- text = text.replace(/[Ì]/, "I");
110209
- text = text.replace(/[Í]/, "I");
110210
- text = text.replace(/[Î]/, "I");
110211
- text = text.replace(/[Ï]/, "I");
110212
- text = text.replace(/[Ò]/, "O");
110213
- text = text.replace(/[Ó]/, "O");
110214
- text = text.replace(/[Ô]/, "O");
110215
- text = text.replace(/[Ö]/, "O");
110216
- text = text.replace(/[Ù]/, "U");
110217
- text = text.replace(/[Ú]/, "U");
110218
- text = text.replace(/[Û]/, "U");
110219
- text = text.replace(/[Ü]/, "U");
110220
- text = text.replace(/[Ç]/, "C");
110221
- return text.replace(/[^a-z0-9]/gi, '');
110222
- }
110223
- }
110224
-
110225
110060
  class AgGridController {
110226
110061
  constructor(enterprise) {
110227
110062
  this._menuItems = [];
@@ -110232,8 +110067,8 @@ class AgGridController {
110232
110067
  this._gridOptions.api.getSortModel().forEach(({ colId, sort }) => {
110233
110068
  if (sort) {
110234
110069
  const field = this._dataUnit.getField(colId);
110235
- const mode = sort === "asc" ? index$1.SortMode.ASC : index$1.SortMode.DESC;
110236
- const sortField = field ? { field: field.name, dataType: field.dataType, mode } : { field: colId, dataType: index$1.DataType.TEXT, mode };
110070
+ const mode = sort === "asc" ? UnitMetadata.SortMode.ASC : UnitMetadata.SortMode.DESC;
110071
+ const sortField = field ? { field: field.name, dataType: field.dataType, mode } : { field: colId, dataType: UnitMetadata.DataType.TEXT, mode };
110237
110072
  sortedColumns.push(sortField);
110238
110073
  }
110239
110074
  });
@@ -110314,8 +110149,9 @@ class AgGridController {
110314
110149
  headerName: "",
110315
110150
  checkboxSelection: true,
110316
110151
  headerCheckboxSelection: false,
110317
- width: 100,
110318
- suppressMovable: true
110152
+ width: 24,
110153
+ suppressMovable: true,
110154
+ suppressMenu: true
110319
110155
  });
110320
110156
  }
110321
110157
  cols.forEach(c => {
@@ -110491,7 +110327,7 @@ class DataUnitBridge {
110491
110327
  }
110492
110328
  processAction(action) {
110493
110329
  switch (action.type) {
110494
- case index$1.Action.METADATA_LOADED:
110330
+ case UnitMetadata.Action.METADATA_LOADED:
110495
110331
  this._gridController.setColumnsDef(this.buildColumnDefs(), true);
110496
110332
  break;
110497
110333
  }
@@ -110509,7 +110345,7 @@ class DataUnitBridge {
110509
110345
  }
110510
110346
  }
110511
110347
 
110512
- 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}";
110348
+ 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}";
110513
110349
 
110514
110350
  let EzGrid = class {
110515
110351
  constructor(hostRef) {
@@ -110603,8 +110439,8 @@ let EzGrid = class {
110603
110439
  }
110604
110440
  return [
110605
110441
  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}`),
110606
- 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" }),
110607
- 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" })
110442
+ index.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" }),
110443
+ index.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" })
110608
110444
  ];
110609
110445
  }
110610
110446
  applyConfig(cols) {
@@ -110620,1320 +110456,10 @@ let EzGrid = class {
110620
110456
  this._popUpVisible = true;
110621
110457
  }
110622
110458
  render() {
110623
- 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() }))));
110459
+ return (index.h(index.Host, null, index.h("div", { class: "box box--shadow padding--medium grid-header" }, 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() }))));
110624
110460
  }
110625
110461
  static get assetsDirs() { return ["../assets"]; }
110626
110462
  };
110627
110463
  EzGrid.style = ezGridCss;
110628
110464
 
110629
- 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}";
110630
-
110631
- let EzIcon = class {
110632
- constructor(hostRef) {
110633
- index.registerInstance(this, hostRef);
110634
- /**
110635
- * Tamanho do ícone
110636
- */
110637
- this.size = 'medium';
110638
- }
110639
- isSprite() {
110640
- return this.href && this.href.indexOf('#') > -1;
110641
- }
110642
- getIconClassName() {
110643
- return `ez-icon-${this.iconName}`;
110644
- }
110645
- getIconContent() {
110646
- if (this.isSprite()) {
110647
- return index.h("svg", { class: this.size, role: "img" }, index.h("use", { xlinkHref: this.href }));
110648
- }
110649
- else if (!StringUtils.isEmpty(this.iconName)) {
110650
- return index.h("span", { class: `icon-content ${this.getIconClassName()} ${this.size}--font` });
110651
- }
110652
- else {
110653
- return index.h("img", { class: this.size, src: this.href });
110654
- }
110655
- }
110656
- render() {
110657
- return (index.h(index.Host, null, this.getIconContent()));
110658
- }
110659
- };
110660
- EzIcon.style = ezIconCss;
110661
-
110662
- 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__list--padding-bottom:var(--space--small, 6px);--ez-list__last-droppable-space--height:var(--space--small, 6px);--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)}p{margin:0}.draggable{display:flex;align-items:center;border-top:1px dashed #fff;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%}.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)}.last-droppable-space{height:var(--ez-list__last-droppable-space--height)}.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);-webkit-user-select:none;-moz-user-select:-moz-none;-ms-user-select:none;user-select:none}.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}.presetedHeight{min-height:100px}.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}";
110663
-
110664
- let EzList = class {
110665
- constructor(hostRef) {
110666
- index.registerInstance(this, hostRef);
110667
- this.ezChange = index.createEvent(this, "ezChange", 7);
110668
- this._listItems = [];
110669
- this._listGroupItems = [];
110670
- this._listItemsHistory = [];
110671
- /**
110672
- * Define a lista inicial do componente.
110673
- */
110674
- this.dataSource = [];
110675
- /**
110676
- * Define se o componente renderizará os itens separados em grupos..
110677
- */
110678
- this.useGroups = false;
110679
- /**
110680
- * Define se o componente terá o comportamento de arrasto de linhas.
110681
- */
110682
- this.ezDraggable = false;
110683
- /**
110684
- * Define se os items da lista serão selecionáveis.
110685
- */
110686
- this.ezSelectable = false;
110687
- }
110688
- createList() {
110689
- if (this.useGroups) {
110690
- let list = [...this.dataSource];
110691
- list.forEach(itemGroup => {
110692
- this.sortGroup(itemGroup);
110693
- });
110694
- this._listGroupItems = list;
110695
- }
110696
- else {
110697
- this._listItems = this._listItemsHistory.length > 0 ? this._listItemsHistory : [...this.dataSource];
110698
- }
110699
- }
110700
- sortGroup(itemGroup) {
110701
- if (itemGroup.sort) {
110702
- itemGroup.items.sort(function (a, b) {
110703
- return a.label < b.label ? -1 : a.label > b.label ? 1 : 0;
110704
- });
110705
- if (itemGroup.sort === "DSC") {
110706
- itemGroup.items.reverse();
110707
- }
110708
- }
110709
- }
110710
- /**
110711
- * 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).
110712
- */
110713
- async setSelection(selectedItem, scrollToOption) {
110714
- if (selectedItem && this.ezSelectable) {
110715
- if (this.useGroups) {
110716
- let newList = [...this._listGroupItems];
110717
- newList.forEach(groupItem => {
110718
- groupItem.items.forEach(item => {
110719
- if (item.label == selectedItem.label) {
110720
- item.selected = !item.selected;
110721
- }
110722
- else {
110723
- item.selected = false;
110724
- }
110725
- });
110726
- });
110727
- this._listGroupItems = newList;
110728
- }
110729
- else {
110730
- let newList = [...this._listItems];
110731
- newList.forEach(item => {
110732
- if (item.label === selectedItem.label) {
110733
- item.selected = !item.selected;
110734
- }
110735
- else {
110736
- item.selected = false;
110737
- }
110738
- });
110739
- this._listItems = newList;
110740
- }
110741
- if (scrollToOption) {
110742
- let liElem = this.useGroups ?
110743
- this._groupContainer.querySelector('li#item_' + this.getItemId(selectedItem.label))
110744
- : this._itemContainer.querySelector('li#item_' + this.getItemId(selectedItem.label));
110745
- if (liElem) {
110746
- liElem.scrollIntoView();
110747
- }
110748
- }
110749
- }
110750
- else {
110751
- this.removeSelection();
110752
- }
110753
- }
110754
- removeSelection() {
110755
- if (this.useGroups) {
110756
- let newList = [...this._listGroupItems];
110757
- newList.forEach(groupItem => {
110758
- groupItem.items.forEach(item => {
110759
- item.selected = false;
110760
- });
110761
- });
110762
- this._listGroupItems = newList;
110763
- }
110764
- else {
110765
- let newList = [...this._listItems];
110766
- newList.forEach(item => {
110767
- item.selected = false;
110768
- });
110769
- this._listItems = newList;
110770
- }
110771
- }
110772
- /**
110773
- * Retorna o item selecionado.
110774
- */
110775
- async getSelection() {
110776
- let selectedItem;
110777
- if (this.useGroups) {
110778
- this._listGroupItems.every(group => {
110779
- let item = group.items.find((item) => item.selected == true);
110780
- if (item) {
110781
- selectedItem = item;
110782
- return false;
110783
- }
110784
- return true;
110785
- });
110786
- }
110787
- else {
110788
- selectedItem = this._listItems.find((item) => item.selected == true);
110789
- }
110790
- return selectedItem;
110791
- }
110792
- /**
110793
- * Retorna a lista de items conforme o modo de uso.
110794
- */
110795
- async getList() {
110796
- if (this.useGroups) {
110797
- return this._listGroupItems;
110798
- }
110799
- return this._listItems;
110800
- }
110801
- componentWillLoad() {
110802
- this._listItemsHistory = [];
110803
- }
110804
- componentWillRender() {
110805
- this.createList();
110806
- }
110807
- onDrop(ev, dragEndItem) {
110808
- this.removeOverClass();
110809
- this.setSelection(undefined);
110810
- if (this._dragStartItem) {
110811
- if (this.useGroups) {
110812
- let newList = [...this._listGroupItems];
110813
- let groupEnd = this._listGroupItems.find(group => dragEndItem.groupName == group.group);
110814
- //Remove item arrastado
110815
- newList.find(group => group.group == this._dragStartItem.groupName).items.splice(this._dragStartItem.index, 1);
110816
- //Adiciona item arrastado
110817
- if (groupEnd.sort) {
110818
- newList.find(group => group.group == dragEndItem.groupName).items.push(this._dragStartItem.item);
110819
- newList.find(group => group.group == dragEndItem.groupName).items.sort(function (a, b) {
110820
- return a.label < b.label ? -1 : a.label > b.label ? 1 : 0;
110821
- });
110822
- if (groupEnd.sort === "DSC") {
110823
- newList.find(group => group.group == dragEndItem.groupName).items.reverse();
110824
- }
110825
- }
110826
- else {
110827
- let indexForAdd = (dragEndItem.index > this._dragStartItem.index) ? dragEndItem.index - 1 : dragEndItem.index;
110828
- newList.find(group => group.group == dragEndItem.groupName).items.splice(indexForAdd, 0, this._dragStartItem.item);
110829
- }
110830
- this._listGroupItems = newList;
110831
- this.ezChange.emit(this._listGroupItems);
110832
- }
110833
- else {
110834
- let newList = [...this._listItems];
110835
- newList.splice(this._dragStartItem.index, 1);
110836
- newList.splice(dragEndItem.index, 0, this._dragStartItem.item);
110837
- this._listItems = newList;
110838
- this._listItemsHistory = newList;
110839
- this.ezChange.emit(this._listItems);
110840
- }
110841
- }
110842
- ev.stopPropagation();
110843
- }
110844
- onDropLastIndex(ev, groupDropped) {
110845
- this.removeOverClass();
110846
- this.setSelection(undefined);
110847
- if (this._dragStartItem) {
110848
- if (this.useGroups) {
110849
- let newList = [...this._listGroupItems];
110850
- let groupEnd = this._listGroupItems.find(group => groupDropped.group == group.group);
110851
- //Remove item arrastado
110852
- newList.find(group => group.group == this._dragStartItem.groupName).items.splice(this._dragStartItem.index, 1);
110853
- //Adiciona item arrastado
110854
- newList.find(group => group.group == groupDropped.group).items.push(this._dragStartItem.item);
110855
- if (groupEnd.sort) {
110856
- newList.find(group => group.group == groupDropped.group).items.sort(function (a, b) {
110857
- return a.label < b.label ? -1 : a.label > b.label ? 1 : 0;
110858
- });
110859
- if (groupEnd.sort === "DSC") {
110860
- newList.find(group => group.group == groupDropped.group).items.reverse();
110861
- }
110862
- }
110863
- this._listGroupItems = newList;
110864
- this.ezChange.emit(this._listGroupItems);
110865
- }
110866
- else {
110867
- let newList = [...this._listItems];
110868
- newList.splice(this._dragStartItem.index, 1);
110869
- newList.push(this._dragStartItem.item);
110870
- this._listItems = newList;
110871
- this._listItemsHistory = newList;
110872
- this.ezChange.emit(this._listItems);
110873
- }
110874
- }
110875
- ev.stopPropagation();
110876
- }
110877
- onDropGroup(groupSelected) {
110878
- var _a;
110879
- let newList = [...this._listGroupItems];
110880
- this.setSelection(undefined);
110881
- let newGroup = newList.find(group => group.group === groupSelected.group);
110882
- if (newGroup) {
110883
- if (((_a = newGroup.items) === null || _a === void 0 ? void 0 : _a.length) > 0) {
110884
- let newItem;
110885
- newGroup.items.forEach((item, index) => {
110886
- if (item.label === this._dragStartItem.item.label) {
110887
- newItem = { item: item, index: index };
110888
- }
110889
- });
110890
- if (newItem) {
110891
- newGroup.items.splice(newItem.index, 1);
110892
- newGroup.items.unshift(newItem.item);
110893
- this.sortGroup(newGroup);
110894
- }
110895
- else {
110896
- newGroup.items.unshift(this._dragStartItem.item);
110897
- this.sortGroup(newGroup);
110898
- newList.find(group => group.group === this._dragStartItem.groupName).items.splice(this._dragStartItem.index, 1);
110899
- }
110900
- }
110901
- else {
110902
- newList.find(group => group.group === this._dragStartItem.groupName).items.splice(this._dragStartItem.index, 1);
110903
- newGroup.items = [this._dragStartItem.item];
110904
- }
110905
- this._listGroupItems = newList;
110906
- }
110907
- }
110908
- onDragEnd() {
110909
- this._dragStartItem = undefined;
110910
- if (this.useGroups) {
110911
- this.hideOverlays();
110912
- }
110913
- if (this._draggingElement) {
110914
- try {
110915
- this._element.shadowRoot.removeChild(this._draggingElement);
110916
- }
110917
- catch (err) { }
110918
- this._draggingElement = undefined;
110919
- }
110920
- }
110921
- addOverClass(element) {
110922
- if ((element === null || element === void 0 ? void 0 : element.__proto__) == HTMLDivElement.prototype && element.classList.contains("draggable")) {
110923
- element.classList.add('over');
110924
- }
110925
- else if ((element === null || element === void 0 ? void 0 : element.parentElement) && !element.parentElement.classList.contains("draggable-list")) {
110926
- this.addOverClass(element.parentElement);
110927
- }
110928
- }
110929
- addOverGroupClass(ev, group) {
110930
- if (ev.target) {
110931
- let groupContainer = this._groupContainer.querySelector("div#" + this.getDivGroupId(group.group));
110932
- let groupOverlay = groupContainer.getElementsByClassName("group-overlay")[0];
110933
- if (group.items.length > 0) {
110934
- groupOverlay.setAttribute("style", "display:grid");
110935
- }
110936
- else {
110937
- groupOverlay.classList.add("presetedHeight");
110938
- groupOverlay.setAttribute("style", "display:grid");
110939
- groupOverlay.scrollIntoView(false);
110940
- }
110941
- }
110942
- }
110943
- removeOverClass() {
110944
- var _a, _b;
110945
- let overCollection;
110946
- let overLastDroppableCollection;
110947
- if (this.useGroups) {
110948
- overCollection = (_a = this._groupContainer) === null || _a === void 0 ? void 0 : _a.getElementsByClassName('over');
110949
- overLastDroppableCollection = this._groupContainer.getElementsByClassName('last-droppable-space');
110950
- }
110951
- else {
110952
- overCollection = (_b = this._itemContainer) === null || _b === void 0 ? void 0 : _b.getElementsByClassName('over');
110953
- overLastDroppableCollection = this._itemContainer.getElementsByClassName('last-droppable-space');
110954
- }
110955
- if (overCollection) {
110956
- Array.from(overCollection).forEach(function (element) {
110957
- element.classList.remove('over');
110958
- });
110959
- }
110960
- if (overLastDroppableCollection) {
110961
- Array.from(overLastDroppableCollection).forEach(function (element) {
110962
- element.classList.remove('over');
110963
- });
110964
- }
110965
- }
110966
- removeOverGroupClass(ev, group) {
110967
- if (ev.target) {
110968
- let groupContainer = this._groupContainer.querySelector("div#" + this.getDivGroupId(group.group));
110969
- let groupOverlay = groupContainer.getElementsByClassName("group-overlay")[0];
110970
- if (groupOverlay) {
110971
- groupOverlay.classList.remove("presetedHeight");
110972
- groupOverlay.setAttribute("style", "display:none");
110973
- }
110974
- }
110975
- }
110976
- onDragStart(item, group, index) {
110977
- if (this._changeDeboucingTimeout) {
110978
- window.clearTimeout(this._changeDeboucingTimeout);
110979
- }
110980
- if (this.useGroups) {
110981
- this._dragStartItem = { groupName: group.group, item: item, index: index };
110982
- this._changeDeboucingTimeout = window.setTimeout(() => {
110983
- this.showOverlays(group);
110984
- }, 10);
110985
- }
110986
- else {
110987
- this._dragStartItem = { item: item.item, index: item.index };
110988
- }
110989
- }
110990
- selectFirstItem() {
110991
- if (this.useGroups) {
110992
- this.setSelection(this._listGroupItems[0].items[0]);
110993
- }
110994
- {
110995
- this.setSelection(this._listItems[0]);
110996
- }
110997
- }
110998
- nextOption(selectedItem) {
110999
- let nextItem = undefined;
111000
- if (this.useGroups) {
111001
- this._listGroupItems.every((group, groupIndex, listGroupItems) => {
111002
- let item = undefined;
111003
- let itemIndex = group.items.findIndex(item => item.label == selectedItem.label);
111004
- if (itemIndex != undefined && itemIndex != -1) {
111005
- if (itemIndex === group.items.length - 1) {
111006
- if (groupIndex + 1 <= listGroupItems.length - 1) {
111007
- item = { label: listGroupItems[groupIndex + 1].items[0].label };
111008
- }
111009
- }
111010
- else {
111011
- item = { label: group.items[itemIndex + 1].label };
111012
- }
111013
- }
111014
- if (item != undefined) {
111015
- nextItem = item;
111016
- return false;
111017
- }
111018
- return true;
111019
- });
111020
- }
111021
- else {
111022
- let itemIndex = this._listItems.findIndex(item => item.label === selectedItem.label);
111023
- if (itemIndex >= 0 && itemIndex < this._listItems.length) {
111024
- nextItem = this._listItems[itemIndex + 1];
111025
- }
111026
- }
111027
- this.setSelection(nextItem, true);
111028
- }
111029
- previousOption(selectedItem) {
111030
- let previousItem = undefined;
111031
- if (this.useGroups) {
111032
- this._listGroupItems.every((group, groupIndex, listGroupItems) => {
111033
- let item = undefined;
111034
- let itemIndex = group.items.findIndex(item => item.label == selectedItem.label);
111035
- if (itemIndex != undefined && itemIndex != -1) {
111036
- if (itemIndex === 0) {
111037
- if ((groupIndex - 1 >= 0)) {
111038
- item = { label: listGroupItems[groupIndex - 1].items[listGroupItems[groupIndex - 1].items.length - 1].label };
111039
- }
111040
- }
111041
- else {
111042
- item = { label: group.items[itemIndex - 1].label };
111043
- }
111044
- }
111045
- if (item != undefined) {
111046
- previousItem = item;
111047
- return false;
111048
- }
111049
- return true;
111050
- });
111051
- }
111052
- else {
111053
- let itemIndex = this._listItems.findIndex(item => item.label === selectedItem.label);
111054
- if (itemIndex > 0 && itemIndex < this._listItems.length) {
111055
- previousItem = this._listItems[itemIndex - 1];
111056
- }
111057
- }
111058
- this.setSelection(previousItem, true);
111059
- }
111060
- keyDownHandler(event) {
111061
- event.preventDefault();
111062
- this.getSelection().then(selectedItem => {
111063
- if (selectedItem) {
111064
- switch (event.key) {
111065
- case "ArrowDown":
111066
- this.nextOption(selectedItem);
111067
- break;
111068
- case "ArrowUp":
111069
- this.previousOption(selectedItem);
111070
- break;
111071
- }
111072
- }
111073
- else {
111074
- this.selectFirstItem();
111075
- }
111076
- });
111077
- event.stopPropagation();
111078
- }
111079
- getItemId(itemLabel) {
111080
- if (itemLabel) {
111081
- return itemLabel.replace(/[^a-z0-9_]/gi, "_");
111082
- }
111083
- return undefined;
111084
- }
111085
- getDivGroupId(groupName) {
111086
- if (groupName) {
111087
- return "group-" + groupName.replace(/[^a-z0-9_]/gi, "_");
111088
- }
111089
- return undefined;
111090
- }
111091
- getGroupOverlayId(groupName) {
111092
- if (groupName) {
111093
- return "group-overlay-" + groupName.replace(/[^a-z0-9_]/gi, "_");
111094
- }
111095
- return undefined;
111096
- }
111097
- onDragOverGroup(event, group) {
111098
- if (this._dragStartItem && this._dragStartItem.groupName !== group.group && group.sort) {
111099
- event.preventDefault();
111100
- this.addOverGroupClass(event, group);
111101
- }
111102
- }
111103
- onDragOverItem(event) {
111104
- if (this._dragStartItem) {
111105
- event.preventDefault();
111106
- this.addOverClass(event.target);
111107
- event.stopPropagation();
111108
- }
111109
- }
111110
- onDragOverLastIndex(ev) {
111111
- ev.preventDefault();
111112
- if (this._dragStartItem) {
111113
- ev.target.classList.add('over');
111114
- ev.stopPropagation();
111115
- }
111116
- }
111117
- showOverlays(groupDragStart) {
111118
- let groupOverlayCollection = this._groupContainer.getElementsByClassName("group-overlay");
111119
- Array.from(groupOverlayCollection).forEach(groupOverlay => {
111120
- let groupOverlayID = this.getGroupOverlayId(groupDragStart.group);
111121
- if (groupOverlayID && groupOverlay.getAttribute("id") && groupOverlayID != groupOverlay.getAttribute("id")) {
111122
- groupOverlay.classList.add("presetedHeight");
111123
- groupOverlay.setAttribute("style", "display:grid");
111124
- }
111125
- });
111126
- }
111127
- hideOverlays() {
111128
- var _a;
111129
- let groupOverlayCollection = (_a = this._groupContainer) === null || _a === void 0 ? void 0 : _a.getElementsByClassName("group-overlay");
111130
- Array.from(groupOverlayCollection).forEach(groupOverlay => {
111131
- groupOverlay.classList.remove("presetedHeight");
111132
- groupOverlay.setAttribute("style", "display:none");
111133
- });
111134
- }
111135
- render() {
111136
- return (index.h(index.Host, { ref: (el) => this._element = el }, this.useGroups ?
111137
- index.h("div", { class: "group-container", ref: (el) => this._groupContainer = el, tabIndex: 0, onKeyDown: (event) => { this.keyDownHandler(event); } }, this._listGroupItems.map(group => {
111138
- return index.h("div", { id: this.getDivGroupId(group.group), class: "group", key: group.group + group.items.length, onDrop: () => this.onDropGroup(group) }, index.h("label", { draggable: false, class: "group-name" }, 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) => {
111139
- 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: () => { group.sort ? undefined : this.removeOverClass(); }, onDragEnd: () => this.onDragEnd(), onDragStart: () => this.onDragStart(item, group, index$1), onDragOver: (event) => { group.sort ? undefined : this.onDragOverItem(event); }, onDrop: (event) => this.onDrop(event, { groupName: group.group, item: item, index: index$1 }), 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 ?
111140
- index.h("div", { class: "slot-item" }, this.itemSlotBuilder(item, group))
111141
- : undefined));
111142
- })), index.h("div", { class: "last-droppable-space", onDragLeave: () => this.removeOverClass(), onDragOver: (event) => { this.onDragOverLastIndex(event); }, onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDropLastIndex(event, group) })), group.sort ?
111143
- index.h("div", { id: this.getGroupOverlayId(group.group), class: "group-overlay" }, "Mover para ", group.group)
111144
- : undefined));
111145
- }))
111146
- :
111147
- 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) => {
111148
- 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: () => this.onDragStart({ item: item, index: index$1 }), onClick: () => { this.setSelection(item); }, onDragLeave: () => this.removeOverClass(), onDragOver: (event) => this.onDragOverItem(event), onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDrop(event, { item: item, index: index$1 }), 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 ?
111149
- index.h("div", null, this.itemSlotBuilder(item))
111150
- : undefined));
111151
- }), index.h("div", { class: "last-droppable-space", onDragLeave: () => this.removeOverClass(), onDragOver: (event) => { this.onDragOverLastIndex(event); }, onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDropLastIndex(event) })))));
111152
- }
111153
- };
111154
- EzList.style = ezListCss;
111155
-
111156
- 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%}}";
111157
-
111158
- let EzModal = class {
111159
- constructor(hostRef) {
111160
- index.registerInstance(this, hostRef);
111161
- this.ezCloseModal = index.createEvent(this, "ezCloseModal", 7);
111162
- /**
111163
- * Controle de exibição do Modal
111164
- */
111165
- this.opened = true;
111166
- /**
111167
- * Define se o modal será fechado ao clicar ESC
111168
- */
111169
- this.closeEsc = false;
111170
- /**
111171
- * Define se o modal será fechado ao clicar fora do conteúdo.
111172
- */
111173
- this.closeOutsideClick = false;
111174
- this.handleKeyboardEvent = (ev) => {
111175
- if ((ev === null || ev === void 0 ? void 0 : ev.key) === "Escape" && this.closeEsc) {
111176
- this.closeModal();
111177
- }
111178
- };
111179
- }
111180
- handleopenedChange() {
111181
- if (this.opened) {
111182
- document.addEventListener("keydown", this.handleKeyboardEvent);
111183
- }
111184
- else {
111185
- document.removeEventListener("keydown", this.handleKeyboardEvent);
111186
- }
111187
- }
111188
- closeModal() {
111189
- this.opened = false;
111190
- this.ezCloseModal.emit(this.opened);
111191
- }
111192
- componentDidLoad() {
111193
- this.handleopenedChange();
111194
- }
111195
- onMouseDownHandler(event) {
111196
- if (this.closeOutsideClick && event.target === this._overlay) {
111197
- this.closeModal();
111198
- }
111199
- }
111200
- render() {
111201
- const positionSufix = this.align === "left" ? "left" : "right";
111202
- return (index.h(index.Host, null, this.opened
111203
- ?
111204
- 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))))
111205
- :
111206
- undefined));
111207
- }
111208
- static get watchers() { return {
111209
- "opened": ["handleopenedChange"]
111210
- }; }
111211
- };
111212
- EzModal.style = ezModalCss;
111213
-
111214
- 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}";
111215
-
111216
- let EzTabselector = class {
111217
- constructor(hostRef) {
111218
- index.registerInstance(this, hostRef);
111219
- this.ezChange = index.createEvent(this, "ezChange", 7);
111220
- this.setFocusedParam = (ev) => {
111221
- if (ev.key === "Enter") {
111222
- const selectedTab = this._processedTabs[this._focusedIndex];
111223
- this.handleTabClick(selectedTab);
111224
- ev.preventDefault();
111225
- this.setFocusedTab(selectedTab.index);
111226
- }
111227
- else if (ev.key === "ArrowLeft" || ev.key === "ArrowRight") {
111228
- let operator = undefined;
111229
- if (ev.key === "ArrowLeft") {
111230
- operator = false;
111231
- }
111232
- else if (ev.key === "ArrowRight") {
111233
- operator = true;
111234
- }
111235
- else {
111236
- return;
111237
- }
111238
- if (this._focusedIndex === undefined) {
111239
- if (operator === false) {
111240
- this._focusedIndex = this.selectedIndex !== undefined ? this.selectedIndex - 1 : undefined;
111241
- }
111242
- else {
111243
- this._focusedIndex = this.selectedIndex !== undefined ? this.selectedIndex + 1 : undefined;
111244
- }
111245
- }
111246
- else {
111247
- if (operator === false) {
111248
- this._focusedIndex = this._focusedIndex - 1;
111249
- }
111250
- else {
111251
- this._focusedIndex = this._focusedIndex + 1;
111252
- }
111253
- }
111254
- if (this._focusedIndex < 0) {
111255
- this._focusedIndex = 0;
111256
- }
111257
- else if (this._focusedIndex > this._processedTabs.length - 1) {
111258
- this._focusedIndex = this._processedTabs.length - 1;
111259
- }
111260
- this.setFocusedBtn(true, this._focusedIndex);
111261
- this.setFocusedTab(this._focusedIndex);
111262
- }
111263
- else if (ev.key === "Tab" || ev.key === "Escape") {
111264
- const currentTab = this._processedTabs[this.selectedIndex];
111265
- this._focusedIndex = undefined;
111266
- this.handleTabClick(currentTab);
111267
- ev.preventDefault();
111268
- this.setFocusedTab(this.selectedIndex);
111269
- }
111270
- };
111271
- }
111272
- handleTabClick(tab) {
111273
- this.selectedIndex = tab.index;
111274
- this._focusedIndex = undefined;
111275
- this.selectedTab = tab.tabKey;
111276
- this.ezChange.emit(tab);
111277
- this.setFocusedBtn(false, tab.index);
111278
- }
111279
- componentWillRender() {
111280
- if (!this._processedTabs) {
111281
- this._processedTabs = [];
111282
- if (this.tabs) {
111283
- this.tabs.split(",").forEach((label) => {
111284
- label = label.trim();
111285
- this._processedTabs.push({ label, tabKey: label, index: this._processedTabs.length });
111286
- });
111287
- }
111288
- this._hostElem.querySelectorAll("ez-tab").forEach((elem) => {
111289
- const tabKey = elem.getAttribute("tabKey");
111290
- const label = elem.getAttribute("label");
111291
- const t = { label, tabKey, index: this._processedTabs.length };
111292
- const content = elem.firstChild;
111293
- if (content) {
111294
- content.setAttribute("slot", "tab" + t.index);
111295
- this._hostElem.appendChild(content);
111296
- }
111297
- this._processedTabs.push(t);
111298
- });
111299
- }
111300
- }
111301
- handleSlotChange(ev) {
111302
- const slot = ev.target;
111303
- const content = slot.assignedElements()[0];
111304
- if (content) {
111305
- content.style.marginLeft = "6px";
111306
- }
111307
- }
111308
- scrollBackward() {
111309
- const container = this._scrollContainer;
111310
- if (container) {
111311
- container.scrollLeft -= container.clientWidth;
111312
- }
111313
- }
111314
- scrollFoward() {
111315
- const container = this._scrollContainer;
111316
- if (container) {
111317
- let lastTab = null;
111318
- container.querySelectorAll(".tab").forEach((tab) => {
111319
- if (tab.getBoundingClientRect().right < container.clientWidth) {
111320
- lastTab = tab;
111321
- }
111322
- });
111323
- container.scrollLeft = lastTab.offsetLeft + lastTab.offsetWidth;
111324
- }
111325
- }
111326
- componentDidRender() {
111327
- this.updateScroll();
111328
- }
111329
- updateScroll() {
111330
- const container = this._scrollContainer;
111331
- if (container) {
111332
- const { scrollWidth, clientWidth, scrollLeft } = container;
111333
- const remainingScroll = scrollWidth - clientWidth - Math.ceil(scrollLeft);
111334
- this._startHidden = container.scrollLeft > 0;
111335
- this._endHidden = remainingScroll > 0;
111336
- if (this._startHidden) {
111337
- this._backwardButton.classList.remove("hidden");
111338
- }
111339
- else {
111340
- this._backwardButton.classList.add("hidden");
111341
- }
111342
- if (this._endHidden) {
111343
- this._forwardButton.classList.remove("hidden");
111344
- }
111345
- else {
111346
- this._forwardButton.classList.add("hidden");
111347
- }
111348
- const classNames = ["", "startHidden", "endHidden", "midle"];
111349
- const currentClass = classNames[Number(this._startHidden) | Number(this._endHidden) << 1];
111350
- classNames.forEach((name) => {
111351
- if (name !== currentClass && container.classList.contains(name)) {
111352
- container.classList.remove(name);
111353
- }
111354
- });
111355
- if (currentClass && !container.classList.contains(currentClass)) {
111356
- container.classList.add(currentClass);
111357
- }
111358
- }
111359
- }
111360
- domScrollHandler() {
111361
- window.clearTimeout(this._scrollCallBack);
111362
- this._scrollCallBack = window.setTimeout(() => { this.updateScroll(); }, 200);
111363
- }
111364
- setFocusedTab(index) {
111365
- window.clearTimeout(this._scrollCallBackTest);
111366
- this._scrollCallBackTest = window.setTimeout(() => {
111367
- const tabtoscroll = this._scrollContainer.querySelector(`#tab${index}`);
111368
- tabtoscroll.scrollIntoView();
111369
- }, 200);
111370
- }
111371
- getTextWidth(text) {
111372
- if (this._textMesurement === undefined) {
111373
- this._textMesurement = this._hostElem.shadowRoot.ownerDocument.createElement("canvas");
111374
- }
111375
- const context = this._textMesurement.getContext("2d");
111376
- context.font = "14px Sora, Algerian";
111377
- return Math.min(220, 24 + context.measureText(text).width) + "px";
111378
- }
111379
- ;
111380
- setFocusedBtn(visible, parameter) {
111381
- const tabsButtons = this._scrollContainer.querySelectorAll(".tab");
111382
- tabsButtons.forEach((el) => {
111383
- el.classList.remove("is-focused");
111384
- if (el.id === "tab" + parameter && visible) {
111385
- el.classList.add("is-focused");
111386
- }
111387
- });
111388
- }
111389
- render() {
111390
- 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) => {
111391
- const labelStyle = { "min-width": this.getTextWidth(tab.label) };
111392
- const tabId = "tab" + index$1;
111393
- const isSelected = index$1 === this.selectedIndex || (this.selectedTab && tab.tabKey === this.selectedTab);
111394
- if (isSelected) {
111395
- this.selectedTab = tab.tabKey;
111396
- this.selectedIndex = index$1;
111397
- }
111398
- 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); } }));
111399
- })), index.h("button", { class: "forward-button", ref: (el) => this._forwardButton = el, onClick: () => this.scrollFoward() })));
111400
- }
111401
- get _hostElem() { return index.getElement(this); }
111402
- };
111403
- EzTabselector.style = ezTabselectorCss;
111404
-
111405
- 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}";
111406
-
111407
- let EzTextInput = class {
111408
- constructor(hostRef) {
111409
- index.registerInstance(this, hostRef);
111410
- this.ezChange = index.createEvent(this, "ezChange", 7);
111411
- /**
111412
- * Deixa o campo disponível ou não para digitação.
111413
- */
111414
- this.enabled = true;
111415
- }
111416
- showError() {
111417
- const hasError = typeof this.errorMessage === "string" && this.errorMessage !== "";
111418
- if (hasError) {
111419
- this._inputElem.classList.add("hasError");
111420
- this._messageBoxElem.classList.add("hasError");
111421
- }
111422
- else {
111423
- this._inputElem.classList.remove("hasError");
111424
- this._messageBoxElem.classList.remove("hasError");
111425
- }
111426
- }
111427
- prepareMask() {
111428
- if (this.mask) {
111429
- if (this._maskFormatter == undefined) {
111430
- this._maskFormatter = new index$1.MaskFormatter(this.mask);
111431
- }
111432
- else {
111433
- this._maskFormatter.mask = this.mask;
111434
- }
111435
- }
111436
- }
111437
- updateInputValue() {
111438
- if (this._inputElem) {
111439
- this._inputElem.value = this.value;
111440
- }
111441
- this.handleChange();
111442
- this.errorMessage = "";
111443
- this.ezChange.emit(this.value);
111444
- this.adjustFloatingLabel();
111445
- }
111446
- adjustFloatingLabel() {
111447
- if (this.label && this._labelElem) {
111448
- if (this._inputElem && !this._inputElem.classList.contains("input--with--label")) {
111449
- this._inputElem.classList.add("input--with--label");
111450
- }
111451
- const hasValue = this.value && this.value.toString().length > 0;
111452
- const containsFloatedClass = this._labelElem.classList.contains("input__label--floated");
111453
- if (hasValue || this.isFocused()) {
111454
- if (!containsFloatedClass) {
111455
- this._labelElem.classList.add("input__label--floated");
111456
- }
111457
- }
111458
- else {
111459
- if (containsFloatedClass) {
111460
- this._labelElem.classList.remove("input__label--floated");
111461
- }
111462
- }
111463
- }
111464
- }
111465
- isFocused() {
111466
- return this._hostElement.shadowRoot.activeElement !== null;
111467
- }
111468
- //---------------------------------------------
111469
- // Public methods
111470
- //---------------------------------------------
111471
- /**
111472
- * Faz o foco no componente de input
111473
- */
111474
- async setFocus() {
111475
- this._inputElem.focus();
111476
- }
111477
- /**
111478
- * Remove o foco no componente de input
111479
- */
111480
- async setBlur() {
111481
- this._inputElem.blur();
111482
- }
111483
- //---------------------------------------------
111484
- // Event handlers
111485
- //---------------------------------------------
111486
- handleFocusout() {
111487
- const value = this._inputElem.value;
111488
- if (value && this._maskFormatter) {
111489
- try {
111490
- this._inputElem.value = this._maskFormatter.format(value);
111491
- }
111492
- catch (e) {
111493
- this.errorMessage = e.message;
111494
- }
111495
- }
111496
- this.value = this._inputElem.value;
111497
- this.adjustFloatingLabel();
111498
- }
111499
- isValidValue(value) {
111500
- if (this.restrict) {
111501
- return Array.from(value).reduce((valid, c) => valid && this.restrict.indexOf(c) > -1, true);
111502
- }
111503
- return true;
111504
- }
111505
- handleChange() {
111506
- if (!this._inputElem) {
111507
- return;
111508
- }
111509
- const value = this._inputElem.value;
111510
- if (this.isValidValue(value)) {
111511
- this._lastValidValue = value;
111512
- }
111513
- else {
111514
- this._inputElem.value = this._lastValidValue === undefined ? "" : this._lastValidValue;
111515
- }
111516
- this.value = this._inputElem.value;
111517
- }
111518
- handleSlotChange(ev) {
111519
- const slot = ev.target;
111520
- const content = slot.assignedElements()[0];
111521
- if (content) {
111522
- content.style.position = "absolute";
111523
- content.style.display = "flex";
111524
- content.style.alignItems = "center";
111525
- content.style.justifyContent = "center";
111526
- content.style.overflow = "hidden";
111527
- content.style.top = "0px";
111528
- content.style.width = "var(--ez-text-input__icon--width)";
111529
- content.style.height = "var(--ez-text-input--height)";
111530
- if (slot.name == "leftIcon") {
111531
- content.style.left = "0px";
111532
- content.style.borderRadius = "var(--ez-text-input--border-radius) 0 0 var(--ez-text-input--border-radius)";
111533
- this._inputElem.classList.add("icon--left");
111534
- if (this._labelElem) {
111535
- this._labelElem.classList.add("input__label--left");
111536
- }
111537
- }
111538
- else if (slot.name == "rightIcon") {
111539
- content.style.right = "0px";
111540
- content.style.borderRadius = "0 var(--ez-text-input--border-radius) var(--ez-text-input--border-radius) 0";
111541
- this._inputElem.classList.add("icon--right");
111542
- if (this._labelElem) {
111543
- this._labelElem.classList.add("input__label--right");
111544
- }
111545
- }
111546
- }
111547
- this.showError();
111548
- }
111549
- doFocus() {
111550
- if (this.label && this._labelElem && !this._labelElem.classList.contains("input__label--floated")) {
111551
- this._labelElem.classList.add("input__label--floated");
111552
- }
111553
- }
111554
- //---------------------------------------------
111555
- // Lifecycle web component
111556
- //---------------------------------------------
111557
- componentDidLoad() {
111558
- this.showError();
111559
- this.prepareMask();
111560
- this.adjustFloatingLabel();
111561
- }
111562
- componentWillLoad() {
111563
- this.prepareMask();
111564
- if (this.value) {
111565
- if (this._maskFormatter) {
111566
- try {
111567
- this.value = this._maskFormatter.format(this.value);
111568
- }
111569
- catch (e) {
111570
- this.errorMessage = e.message;
111571
- }
111572
- }
111573
- if (!this.isValidValue(this.value)) {
111574
- this._lastValidValue = "";
111575
- this.value = "";
111576
- }
111577
- }
111578
- }
111579
- render() {
111580
- return (index.h(index.Host, null, index.h("slot", { name: "leftIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.label ?
111581
- 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)
111582
- : 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)));
111583
- }
111584
- get _hostElement() { return index.getElement(this); }
111585
- static get watchers() { return {
111586
- "errorMessage": ["showError"],
111587
- "mask": ["prepareMask"],
111588
- "value": ["updateInputValue"]
111589
- }; }
111590
- };
111591
- EzTextInput.style = ezTextInputCss;
111592
-
111593
- 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)}";
111594
-
111595
- let GridConfig = class {
111596
- constructor(hostRef) {
111597
- index.registerInstance(this, hostRef);
111598
- this.configFinish = index.createEvent(this, "configFinish", 7);
111599
- this.configCancel = index.createEvent(this, "configCancel", 7);
111600
- this._columnListHistory = [];
111601
- this._orderListItems = [];
111602
- this._columListItems = [];
111603
- this.selectedTab = "Colunas";
111604
- this._selectedIndex = -1;
111605
- }
111606
- /* Creation Methods */
111607
- createOrderList() {
111608
- var _a;
111609
- let newList = [];
111610
- if (((_a = this._columnListHistory) === null || _a === void 0 ? void 0 : _a.length) > 0) {
111611
- this._columnListHistory.find(group => group.group === "Visíveis").items.forEach(column => {
111612
- let item = { label: column.label };
111613
- newList.push(item);
111614
- });
111615
- }
111616
- else {
111617
- this.columns.forEach(column => {
111618
- let item = { name: column.name, label: column.label };
111619
- if (!column.hidden) {
111620
- newList.push(item);
111621
- }
111622
- });
111623
- }
111624
- this._orderListItems = newList;
111625
- }
111626
- createColumnList() {
111627
- let visibleGroup = {
111628
- group: 'Visíveis',
111629
- items: [],
111630
- };
111631
- let hiddenGroup = {
111632
- group: 'Ocultas',
111633
- items: [],
111634
- sort: 'ASC'
111635
- };
111636
- this.columns.forEach(column => {
111637
- let item = { label: column.label };
111638
- if (column.hidden) {
111639
- hiddenGroup.items.push(item);
111640
- }
111641
- else {
111642
- visibleGroup.items.push(item);
111643
- }
111644
- });
111645
- if (this._columnListHistory.length <= 0) {
111646
- this._columListItems = [visibleGroup, hiddenGroup];
111647
- }
111648
- }
111649
- buildColumnListSlot(item, group) {
111650
- 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); } })));
111651
- }
111652
- buildOrderListSlot(item) {
111653
- let existingItem = this.columns.find(columnItem => columnItem.label === item.label);
111654
- 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); } })));
111655
- }
111656
- updateOrder(sortOrder, updatedItem) {
111657
- let newList = [...this.columns];
111658
- let newItem = newList.find(item => item.label === updatedItem.label);
111659
- if (newItem) {
111660
- newItem.sort = sortOrder;
111661
- }
111662
- this.columns = newList;
111663
- }
111664
- /* Actions Methods */
111665
- switchColumnGroup(ev, switchedItem) {
111666
- ev.stopPropagation();
111667
- let newList = [...this._columListItems];
111668
- if (ev.detail === true) {
111669
- let hiddenGroup = newList.find(group => group.group === "Ocultas");
111670
- let index = hiddenGroup.items.findIndex(item => item.label === switchedItem.label);
111671
- if (index >= 0) {
111672
- hiddenGroup.items.splice(index, 1);
111673
- }
111674
- let visibleGroup = newList.find(group => group.group === "Visíveis");
111675
- visibleGroup.items.push(switchedItem);
111676
- this._columListItems = newList;
111677
- this.createOrderList();
111678
- }
111679
- else if (ev.detail === false) {
111680
- let visibleGroup = newList.find(group => group.group === "Visíveis");
111681
- let index = visibleGroup.items.findIndex(item => item.label === switchedItem.label);
111682
- if (index >= 0) {
111683
- visibleGroup.items.splice(index, 1);
111684
- }
111685
- let hiddenGroup = newList.find(group => group.group === "Ocultas");
111686
- hiddenGroup.items.push(switchedItem);
111687
- this._columListItems = newList;
111688
- this.createOrderList();
111689
- }
111690
- }
111691
- finish() {
111692
- let newColumnList = [];
111693
- this._columListItems.forEach(group => {
111694
- group.items.forEach(item => {
111695
- const baseColumn = this.columns.find(column => column.label === item.label);
111696
- let newColumnItem = Object.assign({}, baseColumn);
111697
- if (group.group === "Ocultas") {
111698
- newColumnItem.hidden = true;
111699
- }
111700
- else {
111701
- newColumnItem.hidden = false;
111702
- }
111703
- newColumnList.push(newColumnItem);
111704
- });
111705
- });
111706
- this._columnListHistory = [];
111707
- this.columns = newColumnList;
111708
- this.configFinish.emit(this.columns);
111709
- }
111710
- async locateColumn(evt, searchingText) {
111711
- var _a;
111712
- const hitEnter = evt.key === "Enter";
111713
- if (!searchingText) {
111714
- searchingText = (_a = evt.currentTarget) === null || _a === void 0 ? void 0 : _a.value;
111715
- }
111716
- let newSelected = -1;
111717
- if (this.selectedTab === "Ordenação") {
111718
- if (searchingText) {
111719
- const matchedIndexes = [];
111720
- let orderListDatasource;
111721
- await this._orderList.getList().then(listGroup => {
111722
- orderListDatasource = listGroup;
111723
- orderListDatasource.forEach((column, index) => {
111724
- if (this.compareWords(column, searchingText)) {
111725
- matchedIndexes.push(index);
111726
- }
111727
- });
111728
- });
111729
- if (matchedIndexes.length > 0) {
111730
- if (hitEnter) {
111731
- for (let j = 0; j < matchedIndexes.length; j++) {
111732
- if (matchedIndexes[j] > this._selectedIndex) {
111733
- newSelected = matchedIndexes[j];
111734
- break;
111735
- }
111736
- }
111737
- }
111738
- if (newSelected === -1) {
111739
- newSelected = matchedIndexes[0];
111740
- }
111741
- }
111742
- this._selectedIndex = newSelected;
111743
- let selectedColumn;
111744
- selectedColumn = orderListDatasource[newSelected];
111745
- if (selectedColumn) {
111746
- this._orderList.setSelection({ label: selectedColumn.label }, true);
111747
- }
111748
- else {
111749
- this._orderList.setSelection(undefined);
111750
- }
111751
- }
111752
- else {
111753
- this._orderList.setSelection(undefined);
111754
- }
111755
- }
111756
- else {
111757
- if (searchingText) {
111758
- const matchedIndexes = [];
111759
- this.columns.forEach((column, index) => {
111760
- if (this.compareWords(column, searchingText)) {
111761
- matchedIndexes.push(index);
111762
- }
111763
- });
111764
- if (matchedIndexes.length > 0) {
111765
- if (hitEnter) {
111766
- for (let j = 0; j < matchedIndexes.length; j++) {
111767
- if (matchedIndexes[j] > this._selectedIndex) {
111768
- newSelected = matchedIndexes[j];
111769
- break;
111770
- }
111771
- }
111772
- }
111773
- if (newSelected === -1) {
111774
- newSelected = matchedIndexes[0];
111775
- }
111776
- }
111777
- this._selectedIndex = newSelected;
111778
- let selectedColumn = this.columns[newSelected];
111779
- if (selectedColumn) {
111780
- this._columnList.setSelection({ label: selectedColumn.label }, true);
111781
- }
111782
- else {
111783
- this._columnList.setSelection(undefined);
111784
- }
111785
- }
111786
- else {
111787
- this._columnList.setSelection(undefined);
111788
- }
111789
- }
111790
- }
111791
- compareWords(column, searchingText) {
111792
- if (StringUtils.replaceAccentuatedChars(column.label).indexOf(StringUtils.replaceAccentuatedChars(searchingText)) > -1) {
111793
- return true;
111794
- }
111795
- return false;
111796
- }
111797
- closeConfig() {
111798
- this._columnListHistory = [];
111799
- this.configCancel.emit();
111800
- }
111801
- /* Handlers */
111802
- handleTabChange(ev) {
111803
- var _a;
111804
- if ((_a = ev === null || ev === void 0 ? void 0 : ev.target) === null || _a === void 0 ? void 0 : _a.selectedTab) {
111805
- if (ev.target.selectedTab === "Ordenação") {
111806
- this._columnListHistory = this._columnList.dataSource;
111807
- this.createOrderList();
111808
- }
111809
- this.selectedTab = ev.target.selectedTab;
111810
- }
111811
- }
111812
- handleColumnListChange(ev) {
111813
- var _a;
111814
- if (ev.detail) {
111815
- let visibleItems = (_a = ev.detail.find(group => group.group === "Visíveis")) === null || _a === void 0 ? void 0 : _a.items;
111816
- if (visibleItems) {
111817
- this._orderListItems = visibleItems;
111818
- }
111819
- }
111820
- }
111821
- componentWillRender() {
111822
- var _a;
111823
- if (((_a = this.columns) === null || _a === void 0 ? void 0 : _a.length) > 0) {
111824
- this.createColumnList();
111825
- this.createOrderList();
111826
- }
111827
- }
111828
- componentDidRender() {
111829
- var _a;
111830
- if (((_a = this.columns) === null || _a === void 0 ? void 0 : _a.length) > 0) {
111831
- this.locateColumn(new KeyboardEvent("arrow-right", { key: "ArrowRight" }), this._searchElement.value);
111832
- }
111833
- }
111834
- render() {
111835
- 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() }))));
111836
- }
111837
- static get assetsDirs() { return ["../assets"]; }
111838
- };
111839
- GridConfig.style = gridConfigCss;
111840
-
111841
- const selectBoxCss = "select{border:1px solid #DCE0E8;font-family:'Sora';border-radius:3px;outline:none;cursor:pointer}";
111842
-
111843
- let SelectBox = class {
111844
- constructor(hostRef) {
111845
- index.registerInstance(this, hostRef);
111846
- this.ezChange = index.createEvent(this, "ezChange", 7);
111847
- }
111848
- changeSelection() {
111849
- this.ezChange.emit(this._selectElem.value);
111850
- }
111851
- componentDidRender() {
111852
- if (this._selectElem) {
111853
- if (this.selectedOption) {
111854
- this._selectElem.value = this.selectedOption;
111855
- }
111856
- else {
111857
- this._selectElem.value = "na";
111858
- }
111859
- }
111860
- }
111861
- render() {
111862
- 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")));
111863
- }
111864
- static get assetsDirs() { return ["../assets"]; }
111865
- };
111866
- SelectBox.style = selectBoxCss;
111867
-
111868
- const testDuCss = ":host{display:block}";
111869
-
111870
- let TestDu = class {
111871
- constructor(hostRef) {
111872
- index.registerInstance(this, hostRef);
111873
- }
111874
- componentWillLoad() {
111875
- this.dataUnit = new index$1.DataUnit("testes_com_formulario");
111876
- this.dataUnit.metadata = {
111877
- name: "dd://br.com.sankhya.fin.cad.movimentacaoFinanceira/Financeiro",
111878
- label: "Parceiro",
111879
- fields: [
111880
- {
111881
- name: "CODPARC",
111882
- label: "Parceiro",
111883
- dataType: index$1.DataType.NUMBER,
111884
- userInterface: index$1.UserInterface.SEARCH,
111885
- required: true,
111886
- properties: {}
111887
- },
111888
- {
111889
- name: "RECDESP",
111890
- label: "Receita/Despesa",
111891
- dataType: index$1.DataType.TEXT,
111892
- userInterface: index$1.UserInterface.OPTIONSELECTOR,
111893
- required: true,
111894
- properties: { options: `{"-1": "Despesa", "1": "Receita"}` }
111895
- },
111896
- {
111897
- name: "P",
111898
- label: "pera",
111899
- dataType: index$1.DataType.TEXT,
111900
- userInterface: index$1.UserInterface.OPTIONSELECTOR,
111901
- properties: { options: `{"M": "Madura", "V": "Verde", "P": "Passada"}` }
111902
- },
111903
- {
111904
- name: "ME",
111905
- label: "ME",
111906
- dataType: index$1.DataType.NUMBER,
111907
- userInterface: index$1.UserInterface.DECIMALNUMBER,
111908
- properties: { precision: 4, prettyPrecision: 1 }
111909
- }
111910
- ]
111911
- };
111912
- this.dataUnit.dataLoader = () => new Promise(accept => accept([
111913
- {
111914
- __record__id__: "1321321321321321",
111915
- CODPARC: 10,
111916
- NOMEPARC: "Parceiro 10",
111917
- P: "M",
111918
- L: "Bagaço",
111919
- LI: "Azedo"
111920
- }
111921
- ]));
111922
- }
111923
- render() {
111924
- return (index.h("ez-grid", { dataUnit: this.dataUnit }));
111925
- }
111926
- };
111927
- TestDu.style = testDuCss;
111928
-
111929
- exports.ez_button = EzButton;
111930
- exports.ez_check = EzCheck;
111931
110465
  exports.ez_grid = EzGrid;
111932
- exports.ez_icon = EzIcon;
111933
- exports.ez_list = EzList;
111934
- exports.ez_modal = EzModal;
111935
- exports.ez_tabselector = EzTabselector;
111936
- exports.ez_text_input = EzTextInput;
111937
- exports.grid_config = GridConfig;
111938
- exports.select_box = SelectBox;
111939
- exports.test_du = TestDu;