@sankhyalabs/ezui 1.2.0-beta.9 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{ApplicationUtils-2ac1b73e.js → ApplicationUtils-edc62c5c.js} +4 -1
- package/dist/cjs/CheckMode-ecb90b87.js +7 -0
- package/dist/cjs/{DialogType-a1e288e6.js → DialogType-aa435c52.js} +1 -0
- package/dist/cjs/ez-actions-button.cjs.entry.js +68 -17
- package/dist/cjs/ez-application.cjs.entry.js +1 -1
- package/dist/cjs/ez-button.cjs.entry.js +13 -11
- package/dist/cjs/ez-calendar.cjs.entry.js +5 -5
- package/dist/cjs/ez-card-item.cjs.entry.js +1 -1
- package/dist/cjs/ez-check.cjs.entry.js +11 -9
- package/dist/cjs/ez-chip.cjs.entry.js +17 -7
- package/dist/cjs/ez-collapsible-box.cjs.entry.js +85 -7
- package/dist/cjs/ez-combo-box.cjs.entry.js +51 -20
- package/dist/cjs/ez-date-input.cjs.entry.js +13 -18
- package/dist/cjs/ez-date-time-input.cjs.entry.js +12 -17
- package/dist/cjs/ez-dialog.cjs.entry.js +43 -8
- package/dist/cjs/ez-filter-input.cjs.entry.js +1 -1
- package/dist/cjs/ez-form.cjs.entry.js +99 -486
- package/dist/cjs/ez-grid-config.cjs.entry.js +8 -9
- package/dist/cjs/ez-grid.cjs.entry.js +1067 -1165
- package/dist/cjs/ez-icon.cjs.entry.js +3 -3
- package/dist/cjs/ez-list.cjs.entry.js +2 -4
- package/dist/cjs/ez-loading-bar.cjs.entry.js +1 -1
- package/dist/cjs/ez-modal-container.cjs.entry.js +58 -0
- package/dist/cjs/ez-modal.cjs.entry.js +1 -1
- package/dist/cjs/ez-number-input.cjs.entry.js +4 -4
- package/dist/cjs/ez-popover.cjs.entry.js +6 -6
- package/dist/cjs/ez-popup.cjs.entry.js +8 -4
- package/dist/cjs/ez-radio-button.cjs.entry.js +3 -3
- package/dist/cjs/ez-scroller.cjs.entry.js +2 -2
- package/dist/cjs/ez-search.cjs.entry.js +1 -1
- package/dist/cjs/ez-select-box.cjs.entry.js +1 -1
- package/dist/cjs/ez-tabselector.cjs.entry.js +8 -7
- package/dist/cjs/ez-text-area.cjs.entry.js +7 -7
- package/dist/cjs/ez-text-edit.cjs.entry.js +103 -0
- package/dist/cjs/ez-text-input.cjs.entry.js +14 -4
- package/dist/cjs/ez-time-input.cjs.entry.js +7 -7
- package/dist/cjs/ez-toast.cjs.entry.js +2 -2
- package/dist/cjs/ez-upload.cjs.entry.js +4 -4
- package/dist/cjs/ez-view-stack.cjs.entry.js +10 -7
- package/dist/cjs/ezui.cjs.js +4 -112
- package/dist/cjs/loader.cjs.js +2 -18
- package/dist/collection/collection-manifest.json +2 -0
- package/dist/collection/components/ez-actions-button/ez-actions-button.css +49 -20
- package/dist/collection/components/ez-actions-button/ez-actions-button.js +219 -23
- package/dist/collection/components/ez-button/ez-button.css +0 -6
- package/dist/collection/components/ez-button/ez-button.js +11 -9
- package/dist/collection/components/ez-calendar/ez-calendar.css +17 -20
- package/dist/collection/components/ez-check/CheckMode.js +5 -0
- package/dist/collection/components/ez-check/ez-check.css +23 -24
- package/dist/collection/components/ez-check/ez-check.js +10 -8
- package/dist/collection/components/ez-chip/ez-chip.css +4 -2
- package/dist/collection/components/ez-chip/ez-chip.js +16 -6
- package/dist/collection/components/ez-collapsible-box/ez-collapsible-box.css +16 -0
- package/dist/collection/components/ez-collapsible-box/ez-collapsible-box.js +226 -7
- package/dist/collection/components/ez-combo-box/ez-combo-box.css +1 -22
- package/dist/collection/components/ez-combo-box/ez-combo-box.js +51 -20
- package/dist/collection/components/ez-date-input/ez-date-input.js +8 -13
- package/dist/collection/components/ez-date-time-input/ez-date-time-input.js +8 -13
- package/dist/collection/components/ez-dialog/DialogType.js +1 -0
- package/dist/collection/components/ez-dialog/ez-dialog.css +19 -25
- package/dist/collection/components/ez-dialog/ez-dialog.js +41 -6
- package/dist/collection/components/ez-form/DataBinder.js +1 -0
- package/dist/collection/components/ez-form/ez-form.js +22 -13
- package/dist/collection/components/ez-form/fieldbuilder/FieldBuilder.js +3 -3
- package/dist/collection/components/ez-form/fieldbuilder/tpl/CheckBox.tpl.js +2 -1
- package/dist/collection/components/ez-form/fieldbuilder/tpl/DateInput.tpl.js +4 -4
- package/dist/collection/components/ez-form/structure/FormSheetMetadata.js +25 -15
- package/dist/collection/components/ez-grid/controller/DataUnitBridge.js +3 -0
- package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js +45 -12
- package/dist/collection/components/ez-grid/controller/ag-grid/components/cellRenderer.js +31 -0
- package/dist/collection/components/ez-grid/ez-grid.js +40 -3
- package/dist/collection/components/ez-grid/subcomponents/ez-grid-config/ez-grid-config.css +38 -27
- package/dist/collection/components/ez-grid/subcomponents/ez-grid-config/ez-grid-config.js +1 -2
- package/dist/collection/components/ez-grid/subcomponents/ez-select-box/ez-select-box.js +5 -4
- package/dist/collection/components/ez-list/ez-list.css +12 -4
- package/dist/collection/components/ez-modal-container/ez-modal-container.css +38 -0
- package/dist/collection/components/ez-modal-container/ez-modal-container.js +190 -0
- package/dist/collection/components/ez-modal-container/index.js +2 -0
- package/dist/collection/components/ez-modal-container/modal-action.js +8 -0
- package/dist/collection/components/ez-modal-container/modal-button-status.js +7 -0
- package/dist/collection/components/ez-popover/ez-popover.css +1 -1
- package/dist/collection/components/ez-popup/ez-popup.css +6 -1
- package/dist/collection/components/ez-popup/ez-popup.js +26 -4
- package/dist/collection/components/ez-radio-button/ez-radio-button.css +16 -5
- package/dist/collection/components/ez-radio-button/ez-radio-button.js +1 -1
- package/dist/collection/components/ez-scroller/ez-scroller.css +2 -2
- package/dist/collection/components/ez-search/ez-search.js +6 -6
- package/dist/collection/components/ez-tabselector/ez-tabselector.css +10 -1
- package/dist/collection/components/ez-tabselector/ez-tabselector.js +7 -3
- package/dist/collection/components/ez-text-area/ez-text-area.css +6 -3
- package/dist/collection/components/ez-text-area/ez-text-area.js +5 -5
- package/dist/collection/components/ez-text-edit/ez-text-edit.css +19 -0
- package/dist/collection/components/ez-text-edit/ez-text-edit.js +188 -0
- package/dist/collection/components/ez-text-input/ez-text-input.css +18 -2
- package/dist/collection/components/ez-text-input/ez-text-input.js +28 -0
- package/dist/collection/components/ez-toast/ez-toast.css +1 -1
- package/dist/collection/components/ez-upload/ez-upload.css +1 -1
- package/dist/collection/components/ez-view-stack/ez-view-stack.js +12 -6
- package/dist/collection/utils/ApplicationUtils.js +3 -0
- package/dist/collection/utils/index.js +1 -0
- package/dist/custom-elements/index.d.ts +12 -0
- package/dist/custom-elements/index.js +1589 -4002
- package/dist/{ezui/ApplicationUtils-30a69eb0.js → esm/ApplicationUtils-205ac4bc.js} +4 -2
- package/dist/esm/CheckMode-bdb2ec19.js +7 -0
- package/dist/esm/{DialogType-72afa679.js → DialogType-4059dc4d.js} +1 -0
- package/dist/esm/ez-actions-button.entry.js +68 -17
- package/dist/esm/ez-application.entry.js +1 -1
- package/dist/esm/ez-button.entry.js +13 -11
- package/dist/esm/ez-calendar.entry.js +3 -3
- package/dist/esm/ez-card-item.entry.js +1 -1
- package/dist/esm/ez-check.entry.js +11 -9
- package/dist/esm/ez-chip.entry.js +17 -7
- package/dist/esm/ez-collapsible-box.entry.js +85 -7
- package/dist/esm/ez-combo-box.entry.js +48 -17
- package/dist/esm/ez-date-input.entry.js +10 -15
- package/dist/esm/ez-date-time-input.entry.js +10 -15
- package/dist/esm/ez-dialog.entry.js +43 -8
- package/dist/esm/ez-filter-input.entry.js +1 -1
- package/dist/esm/ez-form.entry.js +65 -452
- package/dist/esm/ez-grid-config.entry.js +6 -7
- package/dist/esm/ez-grid.entry.js +1033 -1131
- package/dist/esm/ez-icon.entry.js +2 -2
- package/dist/esm/ez-list.entry.js +2 -4
- package/dist/esm/ez-loading-bar.entry.js +1 -1
- package/dist/esm/ez-modal-container.entry.js +54 -0
- package/dist/esm/ez-modal.entry.js +1 -1
- package/dist/esm/ez-number-input.entry.js +2 -2
- package/dist/esm/ez-popover.entry.js +3 -3
- package/dist/esm/ez-popup.entry.js +8 -4
- package/dist/esm/ez-radio-button.entry.js +3 -3
- package/dist/esm/ez-scroller.entry.js +2 -2
- package/dist/esm/ez-search.entry.js +1 -1
- package/dist/esm/ez-select-box.entry.js +1 -1
- package/dist/esm/ez-tabselector.entry.js +8 -7
- package/dist/esm/ez-text-area.entry.js +7 -7
- package/dist/esm/ez-text-edit.entry.js +99 -0
- package/dist/esm/ez-text-input.entry.js +13 -3
- package/dist/esm/ez-time-input.entry.js +2 -2
- package/dist/esm/ez-toast.entry.js +2 -2
- package/dist/esm/ez-upload.entry.js +4 -4
- package/dist/esm/ez-view-stack.entry.js +10 -7
- package/dist/esm/ezui.js +4 -112
- package/dist/esm/loader.js +2 -18
- package/dist/ezui/ezui.esm.js +1 -125
- package/dist/ezui/index.esm.js +0 -1
- package/dist/ezui/p-04a41a44.entry.js +1 -0
- package/dist/ezui/p-0b44cf1c.js +1 -0
- package/dist/ezui/p-0c7203d5.entry.js +1 -0
- package/dist/ezui/p-2213da1f.entry.js +1 -0
- package/dist/ezui/p-2c6398b3.entry.js +1 -0
- package/dist/ezui/p-2ccad880.entry.js +1 -0
- package/dist/ezui/p-333d79c4.entry.js +1 -0
- package/dist/ezui/p-3987f8d8.entry.js +1 -0
- package/dist/ezui/{p-81eb2738.entry.js → p-42c6493e.entry.js} +1 -1
- package/dist/ezui/{p-b4ad3b15.entry.js → p-482c3dd8.entry.js} +1 -1
- package/dist/ezui/p-5bdb1a41.entry.js +1 -0
- package/dist/ezui/{p-b2cf7db2.entry.js → p-63d567cc.entry.js} +1 -1
- package/dist/ezui/p-659616e4.entry.js +1 -0
- package/dist/ezui/p-6608b9a5.entry.js +1 -0
- package/dist/ezui/p-77ec47ac.entry.js +1 -0
- package/dist/ezui/p-9b9ebf95.entry.js +1 -0
- package/dist/ezui/{p-3a0dd69f.entry.js → p-ae5af8f9.entry.js} +1 -1
- package/dist/ezui/p-b853763b.js +1 -0
- package/dist/ezui/p-be06251d.entry.js +1 -0
- package/dist/ezui/{p-e7d03a0d.entry.js → p-bffae598.entry.js} +1 -1
- package/dist/ezui/p-cd4677d4.entry.js +1 -0
- package/dist/ezui/p-cfcc23e6.entry.js +1 -0
- package/dist/ezui/p-dfcf55e0.entry.js +1 -0
- package/dist/ezui/p-e1148f5c.js +1 -0
- package/dist/ezui/p-e1f2b5da.entry.js +1 -0
- package/dist/ezui/p-e230bfd2.entry.js +1 -0
- package/dist/ezui/{p-c0dd9a2e.entry.js → p-e3ee814c.entry.js} +1 -1
- package/dist/ezui/p-e697ffd5.entry.js +1 -0
- package/dist/ezui/{p-4eb273f8.entry.js → p-efa32bcc.entry.js} +1 -1
- package/dist/types/components/ez-actions-button/ez-actions-button.d.ts +42 -9
- package/dist/types/components/ez-check/CheckMode.d.ts +4 -0
- package/dist/types/components/ez-chip/ez-chip.d.ts +2 -1
- package/dist/types/components/ez-collapsible-box/ez-collapsible-box.d.ts +46 -1
- package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +15 -5
- package/dist/types/components/ez-date-input/ez-date-input.d.ts +0 -1
- package/dist/types/components/ez-date-time-input/ez-date-time-input.d.ts +0 -1
- package/dist/types/components/ez-dialog/DialogType.d.ts +1 -0
- package/dist/types/components/ez-dialog/ez-dialog.d.ts +3 -0
- package/dist/types/components/ez-form/DataBinder.d.ts +2 -2
- package/dist/types/components/ez-form/ez-form.d.ts +21 -11
- package/dist/types/components/ez-form/fieldbuilder/tpl/CheckBox.tpl.d.ts +3 -3
- package/dist/types/components/ez-form/fieldbuilder/tpl/DateInput.tpl.d.ts +4 -2
- package/dist/types/components/ez-form/fieldbuilder/tpl/NumberInput.tpl.d.ts +2 -5
- package/dist/types/components/ez-form/structure/FormSheetMetadata.d.ts +3 -3
- package/dist/types/components/ez-grid/controller/EzGridController.d.ts +11 -0
- package/dist/types/components/ez-grid/controller/ag-grid/AgGridController.d.ts +4 -1
- package/dist/types/components/ez-grid/controller/ag-grid/components/cellRenderer.d.ts +9 -0
- package/dist/types/components/ez-grid/ez-grid.d.ts +8 -3
- package/dist/types/components/ez-grid/subcomponents/ez-select-box/ez-select-box.d.ts +2 -6
- package/dist/types/components/ez-modal-container/ez-modal-container.d.ts +47 -0
- package/dist/types/components/ez-modal-container/index.d.ts +2 -0
- package/dist/types/components/ez-modal-container/modal-action.d.ts +7 -0
- package/dist/types/components/ez-modal-container/modal-button-status.d.ts +6 -0
- package/dist/types/components/ez-popup/ez-popup.d.ts +4 -0
- package/dist/types/components/ez-search/ez-search.d.ts +3 -3
- package/dist/types/components/ez-tabselector/ez-tabselector.d.ts +2 -0
- package/dist/types/components/ez-text-edit/ez-text-edit.d.ts +39 -0
- package/dist/types/components/ez-text-input/ez-text-input.d.ts +5 -0
- package/dist/types/components/ez-view-stack/ez-view-stack.d.ts +5 -1
- package/dist/types/components.d.ts +274 -28
- package/dist/types/utils/ApplicationUtils.d.ts +1 -0
- package/dist/types/utils/index.d.ts +1 -0
- package/package.json +5 -5
- package/react/components.d.ts +2 -0
- package/react/components.js +2 -0
- package/react/components.js.map +1 -1
- package/dist/cjs/ApplicationUtils-475b50d9.js +0 -63
- package/dist/cjs/app-globals-3a1e7e63.js +0 -5
- package/dist/cjs/css-shim-3bfdba4f.js +0 -6
- package/dist/cjs/dom-8ac1ad03.js +0 -75
- package/dist/cjs/index-2ec1da82.js +0 -2307
- package/dist/cjs/index-55178184.js +0 -6
- package/dist/cjs/index-d9c5cb88.js +0 -3068
- package/dist/cjs/shadow-css-41d9783d.js +0 -390
- package/dist/esm/ApplicationUtils-30a69eb0.js +0 -61
- package/dist/esm/ApplicationUtils-a4a76132.js +0 -60
- package/dist/esm/app-globals-0f993ce5.js +0 -3
- package/dist/esm/css-shim-20dbffa5.js +0 -4
- package/dist/esm/dom-c5ed0ba5.js +0 -73
- package/dist/esm/index-1e9d524f.js +0 -3031
- package/dist/esm/index-b96183c8.js +0 -2295
- package/dist/esm/index-f32470b5.js +0 -3
- package/dist/esm/shadow-css-8c625855.js +0 -388
- package/dist/ezui/CSSVarsUtils-00f67f32.js +0 -70
- package/dist/ezui/DialogType-72afa679.js +0 -8
- package/dist/ezui/app-globals-0f993ce5.js +0 -3
- package/dist/ezui/css-shim-20dbffa5.js +0 -4
- package/dist/ezui/dom-c5ed0ba5.js +0 -73
- package/dist/ezui/ez-actions-button.entry.js +0 -98
- package/dist/ezui/ez-application.entry.js +0 -22
- package/dist/ezui/ez-button.entry.js +0 -73
- package/dist/ezui/ez-calendar.entry.js +0 -219
- package/dist/ezui/ez-card-item.entry.js +0 -40
- package/dist/ezui/ez-check.entry.js +0 -72
- package/dist/ezui/ez-chip.entry.js +0 -97
- package/dist/ezui/ez-collapsible-box.entry.js +0 -57
- package/dist/ezui/ez-combo-box.entry.js +0 -439
- package/dist/ezui/ez-date-input.entry.js +0 -159
- package/dist/ezui/ez-date-time-input.entry.js +0 -214
- package/dist/ezui/ez-dialog.entry.js +0 -108
- package/dist/ezui/ez-filter-input.entry.js +0 -75
- package/dist/ezui/ez-form.entry.js +0 -1395
- package/dist/ezui/ez-grid-config.entry.js +0 -433
- package/dist/ezui/ez-grid.entry.js +0 -115422
- package/dist/ezui/ez-icon.entry.js +0 -37
- package/dist/ezui/ez-list.entry.js +0 -516
- package/dist/ezui/ez-loading-bar.entry.js +0 -24
- package/dist/ezui/ez-modal.entry.js +0 -67
- package/dist/ezui/ez-number-input.entry.js +0 -148
- package/dist/ezui/ez-popover.entry.js +0 -141
- package/dist/ezui/ez-popup.entry.js +0 -49
- package/dist/ezui/ez-radio-button.entry.js +0 -45
- package/dist/ezui/ez-scroller.entry.js +0 -101
- package/dist/ezui/ez-search.entry.js +0 -83
- package/dist/ezui/ez-select-box.entry.js +0 -18
- package/dist/ezui/ez-tabselector.entry.js +0 -195
- package/dist/ezui/ez-text-area.entry.js +0 -158
- package/dist/ezui/ez-text-input.entry.js +0 -235
- package/dist/ezui/ez-time-input.entry.js +0 -164
- package/dist/ezui/ez-toast.entry.js +0 -84
- package/dist/ezui/ez-upload.entry.js +0 -379
- package/dist/ezui/ez-view-stack.entry.js +0 -74
- package/dist/ezui/index-1e9d524f.js +0 -3031
- package/dist/ezui/index-b96183c8.js +0 -2295
- package/dist/ezui/index-f32470b5.js +0 -3
- package/dist/ezui/p-2f02347d.entry.js +0 -1
- package/dist/ezui/p-416bedbe.entry.js +0 -1
- package/dist/ezui/p-544f0c63.entry.js +0 -1
- package/dist/ezui/p-62110996.entry.js +0 -1
- package/dist/ezui/p-719e9ef9.entry.js +0 -1
- package/dist/ezui/p-787fbdfe.js +0 -1
- package/dist/ezui/p-9d5be6a7.entry.js +0 -1
- package/dist/ezui/p-a27dafa4.entry.js +0 -1
- package/dist/ezui/p-aba3fa6c.entry.js +0 -1
- package/dist/ezui/p-adbe4188.js +0 -1
- package/dist/ezui/p-af43be42.entry.js +0 -1
- package/dist/ezui/p-b7467ad6.entry.js +0 -1
- package/dist/ezui/p-c019e137.entry.js +0 -1
- package/dist/ezui/p-c9d2060e.entry.js +0 -1
- package/dist/ezui/p-cccd8cde.entry.js +0 -1
- package/dist/ezui/p-d0671e14.entry.js +0 -1
- package/dist/ezui/p-e0f06d73.entry.js +0 -1
- package/dist/ezui/p-e59adce6.entry.js +0 -1
- package/dist/ezui/p-ed835b36.entry.js +0 -1
- package/dist/ezui/shadow-css-8c625855.js +0 -388
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, h, f as Host } from './index-1e9d524f.js';
|
|
2
|
-
import { d as StringUtils } from './index-b96183c8.js';
|
|
3
|
-
|
|
4
|
-
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-\"]{color:var(--ez-icon--color)}[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-2chevron-down:before{content:\"\\ea01\"}.ez-icon-2chevron-up:before{content:\"\\ea02\"}.ez-icon-account-outline:before{content:\"\\ea03\"}.ez-icon-account:before{content:\"\\ea04\"}.ez-icon-actions-sprite:before{content:\"\\ea05\"}.ez-icon-alert-circle-inverted:before{content:\"\\ea06\"}.ez-icon-alert-circle:before{content:\"\\ea07\"}.ez-icon-alert-mail:before{content:\"\\ea08\"}.ez-icon-alert-popup:before{content:\"\\ea09\"}.ez-icon-anexo:before{content:\"\\ea0a\"}.ez-icon-apps:before{content:\"\\ea0b\"}.ez-icon-arrow_back:before{content:\"\\ea0c\"}.ez-icon-arrow_downward:before{content:\"\\ea0d\"}.ez-icon-balance:before{content:\"\\ea0e\"}.ez-icon-bell-inverted:before{content:\"\\ea0f\"}.ez-icon-bell:before{content:\"\\ea10\"}.ez-icon-boleto:before{content:\"\\ea11\"}.ez-icon-business-center:before{content:\"\\ea12\"}.ez-icon-calendar-clock:before{content:\"\\ea13\"}.ez-icon-calendar:before{content:\"\\ea14\"}.ez-icon-cash-remove:before{content:\"\\ea15\"}.ez-icon-check-circle-inverted:before{content:\"\\ea16\"}.ez-icon-check-circle:before{content:\"\\ea17\"}.ez-icon-check:before{content:\"\\ea18\"}.ez-icon-chevron-down:before{content:\"\\ea19\"}.ez-icon-chevron-left:before{content:\"\\ea1a\"}.ez-icon-chevron-right:before{content:\"\\ea1b\"}.ez-icon-chevron-up:before{content:\"\\ea1c\"}.ez-icon-circle--medium:before{content:\"\\ea1d\"}.ez-icon-circle:before{content:\"\\ea1e\"}.ez-icon-cleaning:before{content:\"\\ea1f\"}.ez-icon-clipboard:before{content:\"\\ea20\"}.ez-icon-close:before{content:\"\\ea21\"}.ez-icon-cobrar:before{content:\"\\ea22\"}.ez-icon-configuration:before{content:\"\\ea23\"}.ez-icon-copy:before{content:\"\\ea24\"}.ez-icon-credit_card:before{content:\"\\ea25\"}.ez-icon-crop:before{content:\"\\ea26\"}.ez-icon-custom:before{content:\"\\ea27\"}.ez-icon-delete:before{content:\"\\ea28\"}.ez-icon-description:before{content:\"\\ea29\"}.ez-icon-dot-notification:before{content:\"\\ea2a\"}.ez-icon-dots-horizontal:before{content:\"\\ea2b\"}.ez-icon-dots-vertical:before{content:\"\\ea2c\"}.ez-icon-drag-indicator:before{content:\"\\ea2d\"}.ez-icon-dual-chevron-down:before{content:\"\\ea2e\"}.ez-icon-dual-chevron-up:before{content:\"\\ea2f\"}.ez-icon-edit-file:before{content:\"\\ea30\"}.ez-icon-edit-table:before{content:\"\\ea31\"}.ez-icon-edit-time:before{content:\"\\ea32\"}.ez-icon-edit:before{content:\"\\ea33\"}.ez-icon-email:before{content:\"\\ea34\"}.ez-icon-expand:before{content:\"\\ea35\"}.ez-icon-extrato:before{content:\"\\ea36\"}.ez-icon-eye-off:before{content:\"\\ea37\"}.ez-icon-eye:before{content:\"\\ea38\"}.ez-icon-favorite:before{content:\"\\ea39\"}.ez-icon-file-download:before{content:\"\\ea3a\"}.ez-icon-file-upload:before{content:\"\\ea3b\"}.ez-icon-filter:before{content:\"\\ea3c\"}.ez-icon-find-file:before{content:\"\\ea3d\"}.ez-icon-find-page:before{content:\"\\ea3e\"}.ez-icon-format-color-fill:before{content:\"\\ea3f\"}.ez-icon-graph_bar:before{content:\"\\ea40\"}.ez-icon-handshake:before{content:\"\\ea41\"}.ez-icon-help-inverted:before{content:\"\\ea42\"}.ez-icon-help:before{content:\"\\ea43\"}.ez-icon-home:before{content:\"\\ea44\"}.ez-icon-icons104:before{content:\"\\ea45\"}.ez-icon-language:before{content:\"\\ea46\"}.ez-icon-launch:before{content:\"\\ea47\"}.ez-icon-lightbulb:before{content:\"\\ea48\"}.ez-icon-list:before{content:\"\\ea49\"}.ez-icon-location:before{content:\"\\ea4a\"}.ez-icon-lock-outline:before{content:\"\\ea4b\"}.ez-icon-lock:before{content:\"\\ea4c\"}.ez-icon-menu:before{content:\"\\ea4d\"}.ez-icon-mid:before{content:\"\\ea4e\"}.ez-icon-minus:before{content:\"\\ea4f\"}.ez-icon-money-off:before{content:\"\\ea50\"}.ez-icon-money:before{content:\"\\ea51\"}.ez-icon-more:before{content:\"\\ea52\"}.ez-icon-north-west:before{content:\"\\ea53\"}.ez-icon-number:before{content:\"\\ea54\"}.ez-icon-ordem-ascendente:before{content:\"\\ea55\"}.ez-icon-ordem-descendente:before{content:\"\\ea56\"}.ez-icon-parcelar:before{content:\"\\ea57\"}.ez-icon-pause:before{content:\"\\ea58\"}.ez-icon-payments:before{content:\"\\ea59\"}.ez-icon-play:before{content:\"\\ea5a\"}.ez-icon-plus:before{content:\"\\ea5b\"}.ez-icon-power:before{content:\"\\ea5c\"}.ez-icon-print:before{content:\"\\ea5d\"}.ez-icon-push-pin:before{content:\"\\ea5e\"}.ez-icon-receipt:before{content:\"\\ea5f\"}.ez-icon-restore:before{content:\"\\ea60\"}.ez-icon-return:before{content:\"\\ea61\"}.ez-icon-save:before{content:\"\\ea62\"}.ez-icon-search:before{content:\"\\ea63\"}.ez-icon-settings-inverted:before{content:\"\\ea64\"}.ez-icon-settings:before{content:\"\\ea65\"}.ez-icon-share:before{content:\"\\ea66\"}.ez-icon-shield:before{content:\"\\ea67\"}.ez-icon-south-east:before{content:\"\\ea68\"}.ez-icon-sync:before{content:\"\\ea69\"}.ez-icon-table:before{content:\"\\ea6a\"}.ez-icon-text:before{content:\"\\ea6b\"}.ez-icon-timeline:before{content:\"\\ea6c\"}.ez-icon-timer-outline:before{content:\"\\ea6d\"}.ez-icon-tune:before{content:\"\\ea6e\"}.ez-icon-un-pin:before{content:\"\\ea6f\"}.ez-icon-unfold_less:before{content:\"\\ea70\"}.ez-icon-unfold_more:before{content:\"\\ea71\"}.ez-icon-user-circle:before{content:\"\\ea72\"}.ez-icon-warning-outline:before{content:\"\\ea73\"}.ez-icon-warning_triangle:before{content:\"\\ea74\"}.ez-icon-whatshot:before{content:\"\\ea75\"}.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}";
|
|
5
|
-
|
|
6
|
-
let EzIcon = class {
|
|
7
|
-
constructor(hostRef) {
|
|
8
|
-
registerInstance(this, hostRef);
|
|
9
|
-
/**
|
|
10
|
-
* Tamanho do ícone
|
|
11
|
-
*/
|
|
12
|
-
this.size = 'medium';
|
|
13
|
-
}
|
|
14
|
-
isSprite() {
|
|
15
|
-
return this.href && this.href.indexOf('#') > -1;
|
|
16
|
-
}
|
|
17
|
-
getIconClassName() {
|
|
18
|
-
return `ez-icon-${this.iconName}`;
|
|
19
|
-
}
|
|
20
|
-
getIconContent() {
|
|
21
|
-
if (this.isSprite()) {
|
|
22
|
-
return h("svg", { class: this.size, role: "img" }, h("use", { xlinkHref: this.href }));
|
|
23
|
-
}
|
|
24
|
-
else if (!StringUtils.isEmpty(this.iconName)) {
|
|
25
|
-
return h("span", { class: `icon-content ${this.getIconClassName()} ${this.size}--font` });
|
|
26
|
-
}
|
|
27
|
-
else {
|
|
28
|
-
return h("img", { class: this.size, src: this.href });
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
-
render() {
|
|
32
|
-
return (h(Host, null, this.getIconContent()));
|
|
33
|
-
}
|
|
34
|
-
};
|
|
35
|
-
EzIcon.style = ezIconCss;
|
|
36
|
-
|
|
37
|
-
export { EzIcon as ez_icon };
|
|
@@ -1,516 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, e as createEvent, h, f as Host } from './index-1e9d524f.js';
|
|
2
|
-
|
|
3
|
-
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-color: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-small, 6px);--ez-list__group-container-scrollbar--width:var(--space--medium, 12px);--ez-list__group-container-scrollbar--background-color-primary:var(--scrollbar--primary, #2B3A54);--ez-list__group-container-scrollbar--background-color-secondary:var(--scrollbar--secondary, #E5EAF0);--ez-list__over--border--color:var(--color--primary, #008561);--ez-list__last-droppable-space--height:var(--space--small, 6px);--ez-list__draggable-scrollbar--border-radius:var(--border--radius-small, 6px);--ez-list__draggable-scrollbar--width:var(--space--medium, 12px);--ez-list__draggable-scrollbar--background-color-primary:var(--scrollbar--primary, #2B3A54);--ez-list__draggable-scrollbar--background-color-secondary:var(--scrollbar--secondary, #E5EAF0);--ez-list__draggable-list--padding-bottom:var(--space--small, 6px);--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;width:100%}.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:flex-start;align-items:center;width:calc(100% - 41px)}.draggable-list{color:var(--text-color);padding:0;margin:0;width:100%;max-height:100%;scrollbar-width:thin;scrollbar-color:var(--ez-list__draggable-scrollbar--background-color-primary) var(--ez-list__draggable-scrollbar--background-color-secondary)}.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:var(--ez-list__draggable-scrollbar--background-color-secondary)}.draggable-list::-webkit-scrollbar-thumb{background-color:var(--ez-list__draggable-scrollbar--background-color-primary);border-radius:var(--ez-list__draggable-scrollbar--border-radius)}.draggable-list::-webkit-scrollbar{background-color:var(--ez-list__draggable-scrollbar--background-color-secondary);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%;scrollbar-width:thin;scrollbar-color:var(--ez-list__group-container-scrollbar--background-color-primary) var(--ez-list__group-container-scrollbar--background-color-secondary)}.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:var(--ez-list__group-container-scrollbar--background-color-secondary)}.group-container::-webkit-scrollbar-thumb{background-color:var(--ez-list__group-container-scrollbar--background-color-primary);border-radius:var(--ez-list__group-container-scrollbar--border-radius)}.group-container::-webkit-scrollbar{background-color:var(--ez-list__group-container-scrollbar--background-color-secondary);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;scrollbar-width:thin;scrollbar-color:var(--ez-list__draggable-scrollbar--background-color-primary) var(--ez-list__draggable-scrollbar--background-color-secondary)}.group-items-container{width:100%;max-height:100%;height:100%;outline:none}.items-container::-webkit-scrollbar-track{background-color:var(--ez-list__draggable-scrollbar--background-color-secondary)}.items-container::-webkit-scrollbar-thumb{background-color:var(--ez-list__draggable-scrollbar--background-color-primary);border-radius:var(--ez-list__draggable-scrollbar--border-radius)}.items-container::-webkit-scrollbar{background-color:var(--ez-list__draggable-scrollbar--background-color-secondary);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-color);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}";
|
|
4
|
-
|
|
5
|
-
;
|
|
6
|
-
;
|
|
7
|
-
let EzList = class {
|
|
8
|
-
constructor(hostRef) {
|
|
9
|
-
registerInstance(this, hostRef);
|
|
10
|
-
this.ezChange = createEvent(this, "ezChange", 7);
|
|
11
|
-
this._listItems = [];
|
|
12
|
-
this._listGroupItems = [];
|
|
13
|
-
this._listItemsHistory = [];
|
|
14
|
-
/**
|
|
15
|
-
* Define a lista inicial do componente.
|
|
16
|
-
*/
|
|
17
|
-
this.dataSource = [];
|
|
18
|
-
/**
|
|
19
|
-
* Define se o componente renderizará os itens separados em grupos..
|
|
20
|
-
*/
|
|
21
|
-
this.useGroups = false;
|
|
22
|
-
/**
|
|
23
|
-
* Define se o componente terá o comportamento de arrasto de linhas.
|
|
24
|
-
*/
|
|
25
|
-
this.ezDraggable = false;
|
|
26
|
-
/**
|
|
27
|
-
* Define se os items da lista serão selecionáveis.
|
|
28
|
-
*/
|
|
29
|
-
this.ezSelectable = false;
|
|
30
|
-
}
|
|
31
|
-
createList() {
|
|
32
|
-
if (this.useGroups) {
|
|
33
|
-
let list = [...this.dataSource];
|
|
34
|
-
list.forEach(itemGroup => {
|
|
35
|
-
this.sortGroup(itemGroup);
|
|
36
|
-
});
|
|
37
|
-
this._listGroupItems = list;
|
|
38
|
-
}
|
|
39
|
-
else {
|
|
40
|
-
this._listItems = this._listItemsHistory.length > 0 ? this._listItemsHistory : [...this.dataSource];
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
sortGroup(itemGroup) {
|
|
44
|
-
if (itemGroup.sort) {
|
|
45
|
-
itemGroup.items.sort(function (a, b) {
|
|
46
|
-
return a.label < b.label ? -1 : a.label > b.label ? 1 : 0;
|
|
47
|
-
});
|
|
48
|
-
if (itemGroup.sort === "DSC") {
|
|
49
|
-
itemGroup.items.reverse();
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
/**
|
|
54
|
-
* Responsável por limpar a lista de histórico do componente.
|
|
55
|
-
*/
|
|
56
|
-
async clearHistory() {
|
|
57
|
-
this._listItemsHistory = [];
|
|
58
|
-
}
|
|
59
|
-
/**
|
|
60
|
-
* Responsável por dar um scroll top no componente da lista.
|
|
61
|
-
*/
|
|
62
|
-
async scrollToTop() {
|
|
63
|
-
if (this.useGroups) {
|
|
64
|
-
this._element.shadowRoot.querySelector('.group-container').scrollTop = 0;
|
|
65
|
-
}
|
|
66
|
-
else {
|
|
67
|
-
this._element.shadowRoot.querySelector('.items-container').scrollTop = 0;
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
/**
|
|
71
|
-
* 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).
|
|
72
|
-
*/
|
|
73
|
-
async setSelection(selectedItem, scrollToOption) {
|
|
74
|
-
if (selectedItem && this.ezSelectable) {
|
|
75
|
-
if (this.useGroups) {
|
|
76
|
-
let newList = [...this._listGroupItems];
|
|
77
|
-
newList.forEach(groupItem => {
|
|
78
|
-
groupItem.items.forEach(item => {
|
|
79
|
-
if (item.label == selectedItem.label) {
|
|
80
|
-
item.selected = true;
|
|
81
|
-
}
|
|
82
|
-
else {
|
|
83
|
-
item.selected = false;
|
|
84
|
-
}
|
|
85
|
-
});
|
|
86
|
-
});
|
|
87
|
-
this._listGroupItems = newList;
|
|
88
|
-
}
|
|
89
|
-
else {
|
|
90
|
-
let newList = [...this._listItems];
|
|
91
|
-
newList.forEach(item => {
|
|
92
|
-
if (item.label === selectedItem.label) {
|
|
93
|
-
item.selected = true;
|
|
94
|
-
}
|
|
95
|
-
else {
|
|
96
|
-
item.selected = false;
|
|
97
|
-
}
|
|
98
|
-
});
|
|
99
|
-
this._listItems = newList;
|
|
100
|
-
}
|
|
101
|
-
if (scrollToOption) {
|
|
102
|
-
let liElem = this.useGroups ?
|
|
103
|
-
this._groupContainer.querySelector('li#item_' + this.getItemId(selectedItem.label))
|
|
104
|
-
: this._itemContainer.querySelector('li#item_' + this.getItemId(selectedItem.label));
|
|
105
|
-
if (liElem) {
|
|
106
|
-
liElem.scrollIntoView();
|
|
107
|
-
}
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
|
-
else {
|
|
111
|
-
this.removeSelection();
|
|
112
|
-
}
|
|
113
|
-
}
|
|
114
|
-
removeSelection() {
|
|
115
|
-
if (this.useGroups) {
|
|
116
|
-
let newList = [...this._listGroupItems];
|
|
117
|
-
newList.forEach(groupItem => {
|
|
118
|
-
groupItem.items.forEach(item => {
|
|
119
|
-
item.selected = false;
|
|
120
|
-
});
|
|
121
|
-
});
|
|
122
|
-
this._listGroupItems = newList;
|
|
123
|
-
}
|
|
124
|
-
else {
|
|
125
|
-
let newList = [...this._listItems];
|
|
126
|
-
newList.forEach(item => {
|
|
127
|
-
item.selected = false;
|
|
128
|
-
});
|
|
129
|
-
this._listItems = newList;
|
|
130
|
-
}
|
|
131
|
-
}
|
|
132
|
-
/**
|
|
133
|
-
* Retorna o item selecionado.
|
|
134
|
-
*/
|
|
135
|
-
async getSelection() {
|
|
136
|
-
let selectedItem;
|
|
137
|
-
if (this.useGroups) {
|
|
138
|
-
this._listGroupItems.every(group => {
|
|
139
|
-
let item = group.items.find((item) => item.selected == true);
|
|
140
|
-
if (item) {
|
|
141
|
-
selectedItem = item;
|
|
142
|
-
return false;
|
|
143
|
-
}
|
|
144
|
-
return true;
|
|
145
|
-
});
|
|
146
|
-
}
|
|
147
|
-
else {
|
|
148
|
-
selectedItem = this._listItems.find((item) => item.selected == true);
|
|
149
|
-
}
|
|
150
|
-
return selectedItem;
|
|
151
|
-
}
|
|
152
|
-
/**
|
|
153
|
-
* Retorna a lista de items conforme o modo de uso.
|
|
154
|
-
*/
|
|
155
|
-
async getList() {
|
|
156
|
-
if (this.useGroups) {
|
|
157
|
-
return this._listGroupItems;
|
|
158
|
-
}
|
|
159
|
-
return this._listItems;
|
|
160
|
-
}
|
|
161
|
-
componentWillLoad() {
|
|
162
|
-
this._listItemsHistory = [];
|
|
163
|
-
}
|
|
164
|
-
componentWillRender() {
|
|
165
|
-
this.createList();
|
|
166
|
-
}
|
|
167
|
-
onDrop(ev, dragEndItem) {
|
|
168
|
-
this.removeOverClass();
|
|
169
|
-
this.setSelection(undefined);
|
|
170
|
-
if (this._dragStartItem) {
|
|
171
|
-
if (this.useGroups) {
|
|
172
|
-
let newList = [...this._listGroupItems];
|
|
173
|
-
let groupEnd = this._listGroupItems.find(group => dragEndItem.groupName == group.group);
|
|
174
|
-
//Remove item arrastado
|
|
175
|
-
newList.find(group => group.group == this._dragStartItem.groupName).items.splice(this._dragStartItem.index, 1);
|
|
176
|
-
//Adiciona item arrastado
|
|
177
|
-
if (groupEnd.sort) {
|
|
178
|
-
newList.find(group => group.group == dragEndItem.groupName).items.push(this._dragStartItem.item);
|
|
179
|
-
newList.find(group => group.group == dragEndItem.groupName).items.sort(function (a, b) {
|
|
180
|
-
return a.label < b.label ? -1 : a.label > b.label ? 1 : 0;
|
|
181
|
-
});
|
|
182
|
-
if (groupEnd.sort === "DSC") {
|
|
183
|
-
newList.find(group => group.group == dragEndItem.groupName).items.reverse();
|
|
184
|
-
}
|
|
185
|
-
}
|
|
186
|
-
else {
|
|
187
|
-
let indexForAdd = (dragEndItem.index > this._dragStartItem.index) ? dragEndItem.index - 1 : dragEndItem.index;
|
|
188
|
-
newList.find(group => group.group == dragEndItem.groupName).items.splice(indexForAdd, 0, this._dragStartItem.item);
|
|
189
|
-
}
|
|
190
|
-
this._listGroupItems = newList;
|
|
191
|
-
this.ezChange.emit(this._listGroupItems);
|
|
192
|
-
}
|
|
193
|
-
else {
|
|
194
|
-
let newList = [...this._listItems];
|
|
195
|
-
newList.splice(this._dragStartItem.index, 1);
|
|
196
|
-
newList.splice(dragEndItem.index, 0, this._dragStartItem.item);
|
|
197
|
-
this._listItems = newList;
|
|
198
|
-
this._listItemsHistory = newList;
|
|
199
|
-
this.ezChange.emit(this._listItems);
|
|
200
|
-
}
|
|
201
|
-
}
|
|
202
|
-
ev.stopPropagation();
|
|
203
|
-
}
|
|
204
|
-
onDropLastIndex(ev, groupDropped) {
|
|
205
|
-
this.removeOverClass();
|
|
206
|
-
this.setSelection(undefined);
|
|
207
|
-
if (this._dragStartItem) {
|
|
208
|
-
if (this.useGroups) {
|
|
209
|
-
let newList = [...this._listGroupItems];
|
|
210
|
-
let groupEnd = this._listGroupItems.find(group => groupDropped.group == group.group);
|
|
211
|
-
//Remove item arrastado
|
|
212
|
-
newList.find(group => group.group == this._dragStartItem.groupName).items.splice(this._dragStartItem.index, 1);
|
|
213
|
-
//Adiciona item arrastado
|
|
214
|
-
newList.find(group => group.group == groupDropped.group).items.push(this._dragStartItem.item);
|
|
215
|
-
if (groupEnd.sort) {
|
|
216
|
-
newList.find(group => group.group == groupDropped.group).items.sort(function (a, b) {
|
|
217
|
-
return a.label < b.label ? -1 : a.label > b.label ? 1 : 0;
|
|
218
|
-
});
|
|
219
|
-
if (groupEnd.sort === "DSC") {
|
|
220
|
-
newList.find(group => group.group == groupDropped.group).items.reverse();
|
|
221
|
-
}
|
|
222
|
-
}
|
|
223
|
-
this._listGroupItems = newList;
|
|
224
|
-
this.ezChange.emit(this._listGroupItems);
|
|
225
|
-
}
|
|
226
|
-
else {
|
|
227
|
-
let newList = [...this._listItems];
|
|
228
|
-
newList.splice(this._dragStartItem.index, 1);
|
|
229
|
-
newList.push(this._dragStartItem.item);
|
|
230
|
-
this._listItems = newList;
|
|
231
|
-
this._listItemsHistory = newList;
|
|
232
|
-
this.ezChange.emit(this._listItems);
|
|
233
|
-
}
|
|
234
|
-
}
|
|
235
|
-
ev.stopPropagation();
|
|
236
|
-
}
|
|
237
|
-
onDropGroup(groupSelected) {
|
|
238
|
-
var _a;
|
|
239
|
-
let newList = [...this._listGroupItems];
|
|
240
|
-
this.setSelection(undefined);
|
|
241
|
-
let newGroup = newList.find(group => group.group === groupSelected.group);
|
|
242
|
-
if (newGroup) {
|
|
243
|
-
if (((_a = newGroup.items) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
244
|
-
let newItem;
|
|
245
|
-
newGroup.items.forEach((item, index) => {
|
|
246
|
-
if (item.label === this._dragStartItem.item.label) {
|
|
247
|
-
newItem = { item: item, index: index };
|
|
248
|
-
}
|
|
249
|
-
});
|
|
250
|
-
if (newItem) {
|
|
251
|
-
newGroup.items.splice(newItem.index, 1);
|
|
252
|
-
newGroup.items.unshift(newItem.item);
|
|
253
|
-
this.sortGroup(newGroup);
|
|
254
|
-
}
|
|
255
|
-
else {
|
|
256
|
-
newGroup.items.unshift(this._dragStartItem.item);
|
|
257
|
-
this.sortGroup(newGroup);
|
|
258
|
-
newList.find(group => group.group === this._dragStartItem.groupName).items.splice(this._dragStartItem.index, 1);
|
|
259
|
-
}
|
|
260
|
-
}
|
|
261
|
-
else {
|
|
262
|
-
newList.find(group => group.group === this._dragStartItem.groupName).items.splice(this._dragStartItem.index, 1);
|
|
263
|
-
newGroup.items = [this._dragStartItem.item];
|
|
264
|
-
}
|
|
265
|
-
this._listGroupItems = newList;
|
|
266
|
-
}
|
|
267
|
-
}
|
|
268
|
-
onDragEnd() {
|
|
269
|
-
this._dragStartItem = undefined;
|
|
270
|
-
if (this.useGroups) {
|
|
271
|
-
this.hideOverlays();
|
|
272
|
-
}
|
|
273
|
-
if (this._draggingElement) {
|
|
274
|
-
try {
|
|
275
|
-
this._element.shadowRoot.removeChild(this._draggingElement);
|
|
276
|
-
}
|
|
277
|
-
catch (err) { }
|
|
278
|
-
this._draggingElement = undefined;
|
|
279
|
-
}
|
|
280
|
-
}
|
|
281
|
-
addOverClass(element) {
|
|
282
|
-
if ((element === null || element === void 0 ? void 0 : element.__proto__) == HTMLDivElement.prototype && element.classList.contains("draggable")) {
|
|
283
|
-
element.classList.add('over');
|
|
284
|
-
}
|
|
285
|
-
else if ((element === null || element === void 0 ? void 0 : element.parentElement) && !element.parentElement.classList.contains("draggable-list")) {
|
|
286
|
-
this.addOverClass(element.parentElement);
|
|
287
|
-
}
|
|
288
|
-
}
|
|
289
|
-
addOverGroupClass(ev, group) {
|
|
290
|
-
if (ev.target) {
|
|
291
|
-
let groupContainer = this._groupContainer.querySelector("div#" + this.getDivGroupId(group.group));
|
|
292
|
-
let groupOverlay = groupContainer.getElementsByClassName("group-overlay")[0];
|
|
293
|
-
if (group.items.length > 0) {
|
|
294
|
-
groupOverlay.setAttribute("style", "display:grid");
|
|
295
|
-
}
|
|
296
|
-
else {
|
|
297
|
-
groupOverlay.classList.add("presetedHeight");
|
|
298
|
-
groupOverlay.setAttribute("style", "display:grid");
|
|
299
|
-
groupOverlay.scrollIntoView(false);
|
|
300
|
-
}
|
|
301
|
-
}
|
|
302
|
-
}
|
|
303
|
-
removeOverClass() {
|
|
304
|
-
var _a, _b;
|
|
305
|
-
let overCollection;
|
|
306
|
-
let overLastDroppableCollection;
|
|
307
|
-
if (this.useGroups) {
|
|
308
|
-
overCollection = (_a = this._groupContainer) === null || _a === void 0 ? void 0 : _a.getElementsByClassName('over');
|
|
309
|
-
overLastDroppableCollection = this._groupContainer.getElementsByClassName('last-droppable-space');
|
|
310
|
-
}
|
|
311
|
-
else {
|
|
312
|
-
overCollection = (_b = this._itemContainer) === null || _b === void 0 ? void 0 : _b.getElementsByClassName('over');
|
|
313
|
-
overLastDroppableCollection = this._itemContainer.getElementsByClassName('last-droppable-space');
|
|
314
|
-
}
|
|
315
|
-
if (overCollection) {
|
|
316
|
-
Array.from(overCollection).forEach(function (element) {
|
|
317
|
-
element.classList.remove('over');
|
|
318
|
-
});
|
|
319
|
-
}
|
|
320
|
-
if (overLastDroppableCollection) {
|
|
321
|
-
Array.from(overLastDroppableCollection).forEach(function (element) {
|
|
322
|
-
element.classList.remove('over');
|
|
323
|
-
});
|
|
324
|
-
}
|
|
325
|
-
}
|
|
326
|
-
removeOverGroupClass(ev, group) {
|
|
327
|
-
if (ev.target) {
|
|
328
|
-
let groupContainer = this._groupContainer.querySelector("div#" + this.getDivGroupId(group.group));
|
|
329
|
-
let groupOverlay = groupContainer.getElementsByClassName("group-overlay")[0];
|
|
330
|
-
if (groupOverlay) {
|
|
331
|
-
groupOverlay.classList.remove("presetedHeight");
|
|
332
|
-
groupOverlay.setAttribute("style", "display:none");
|
|
333
|
-
}
|
|
334
|
-
}
|
|
335
|
-
}
|
|
336
|
-
onDragStart(item, group, index) {
|
|
337
|
-
if (this._changeDeboucingTimeout) {
|
|
338
|
-
window.clearTimeout(this._changeDeboucingTimeout);
|
|
339
|
-
}
|
|
340
|
-
if (this.useGroups) {
|
|
341
|
-
this._dragStartItem = { groupName: group.group, item: item, index: index };
|
|
342
|
-
this._changeDeboucingTimeout = window.setTimeout(() => {
|
|
343
|
-
this.showOverlays(group);
|
|
344
|
-
}, 10);
|
|
345
|
-
}
|
|
346
|
-
else {
|
|
347
|
-
this._dragStartItem = { item: item.item, index: item.index };
|
|
348
|
-
}
|
|
349
|
-
}
|
|
350
|
-
selectFirstItem() {
|
|
351
|
-
if (this.useGroups) {
|
|
352
|
-
this.setSelection(this._listGroupItems[0].items[0]);
|
|
353
|
-
}
|
|
354
|
-
{
|
|
355
|
-
this.setSelection(this._listItems[0]);
|
|
356
|
-
}
|
|
357
|
-
}
|
|
358
|
-
nextOption(selectedItem) {
|
|
359
|
-
let nextItem = undefined;
|
|
360
|
-
if (this.useGroups) {
|
|
361
|
-
this._listGroupItems.every((group, groupIndex, listGroupItems) => {
|
|
362
|
-
let item = undefined;
|
|
363
|
-
let itemIndex = group.items.findIndex(item => item.label == selectedItem.label);
|
|
364
|
-
if (itemIndex != undefined && itemIndex != -1) {
|
|
365
|
-
if (itemIndex === group.items.length - 1) {
|
|
366
|
-
if (groupIndex + 1 <= listGroupItems.length - 1) {
|
|
367
|
-
item = { label: listGroupItems[groupIndex + 1].items[0].label };
|
|
368
|
-
}
|
|
369
|
-
}
|
|
370
|
-
else {
|
|
371
|
-
item = { label: group.items[itemIndex + 1].label };
|
|
372
|
-
}
|
|
373
|
-
}
|
|
374
|
-
if (item != undefined) {
|
|
375
|
-
nextItem = item;
|
|
376
|
-
return false;
|
|
377
|
-
}
|
|
378
|
-
return true;
|
|
379
|
-
});
|
|
380
|
-
}
|
|
381
|
-
else {
|
|
382
|
-
let itemIndex = this._listItems.findIndex(item => item.label === selectedItem.label);
|
|
383
|
-
if (itemIndex >= 0 && itemIndex < this._listItems.length) {
|
|
384
|
-
nextItem = this._listItems[itemIndex + 1];
|
|
385
|
-
}
|
|
386
|
-
}
|
|
387
|
-
this.setSelection(nextItem, true);
|
|
388
|
-
}
|
|
389
|
-
previousOption(selectedItem) {
|
|
390
|
-
let previousItem = undefined;
|
|
391
|
-
if (this.useGroups) {
|
|
392
|
-
this._listGroupItems.every((group, groupIndex, listGroupItems) => {
|
|
393
|
-
let item = undefined;
|
|
394
|
-
let itemIndex = group.items.findIndex(item => item.label == selectedItem.label);
|
|
395
|
-
if (itemIndex != undefined && itemIndex != -1) {
|
|
396
|
-
if (itemIndex === 0) {
|
|
397
|
-
if ((groupIndex - 1 >= 0)) {
|
|
398
|
-
item = { label: listGroupItems[groupIndex - 1].items[listGroupItems[groupIndex - 1].items.length - 1].label };
|
|
399
|
-
}
|
|
400
|
-
}
|
|
401
|
-
else {
|
|
402
|
-
item = { label: group.items[itemIndex - 1].label };
|
|
403
|
-
}
|
|
404
|
-
}
|
|
405
|
-
if (item != undefined) {
|
|
406
|
-
previousItem = item;
|
|
407
|
-
return false;
|
|
408
|
-
}
|
|
409
|
-
return true;
|
|
410
|
-
});
|
|
411
|
-
}
|
|
412
|
-
else {
|
|
413
|
-
let itemIndex = this._listItems.findIndex(item => item.label === selectedItem.label);
|
|
414
|
-
if (itemIndex > 0 && itemIndex < this._listItems.length) {
|
|
415
|
-
previousItem = this._listItems[itemIndex - 1];
|
|
416
|
-
}
|
|
417
|
-
}
|
|
418
|
-
this.setSelection(previousItem, true);
|
|
419
|
-
}
|
|
420
|
-
keyDownHandler(event) {
|
|
421
|
-
event.preventDefault();
|
|
422
|
-
this.getSelection().then(selectedItem => {
|
|
423
|
-
if (selectedItem) {
|
|
424
|
-
switch (event.key) {
|
|
425
|
-
case "ArrowDown":
|
|
426
|
-
this.nextOption(selectedItem);
|
|
427
|
-
break;
|
|
428
|
-
case "ArrowUp":
|
|
429
|
-
this.previousOption(selectedItem);
|
|
430
|
-
break;
|
|
431
|
-
}
|
|
432
|
-
}
|
|
433
|
-
else {
|
|
434
|
-
this.selectFirstItem();
|
|
435
|
-
}
|
|
436
|
-
});
|
|
437
|
-
event.stopPropagation();
|
|
438
|
-
}
|
|
439
|
-
getItemId(itemLabel) {
|
|
440
|
-
if (itemLabel) {
|
|
441
|
-
return itemLabel.replace(/[^a-z0-9_]/gi, "_");
|
|
442
|
-
}
|
|
443
|
-
return undefined;
|
|
444
|
-
}
|
|
445
|
-
getDivGroupId(groupName) {
|
|
446
|
-
if (groupName) {
|
|
447
|
-
return "group-" + groupName.replace(/[^a-z0-9_]/gi, "_");
|
|
448
|
-
}
|
|
449
|
-
return undefined;
|
|
450
|
-
}
|
|
451
|
-
getGroupOverlayId(groupName) {
|
|
452
|
-
if (groupName) {
|
|
453
|
-
return "group-overlay-" + groupName.replace(/[^a-z0-9_]/gi, "_");
|
|
454
|
-
}
|
|
455
|
-
return undefined;
|
|
456
|
-
}
|
|
457
|
-
onDragOverGroup(event, group) {
|
|
458
|
-
if (this._dragStartItem && this._dragStartItem.groupName !== group.group && group.sort) {
|
|
459
|
-
event.preventDefault();
|
|
460
|
-
this.addOverGroupClass(event, group);
|
|
461
|
-
}
|
|
462
|
-
}
|
|
463
|
-
onDragOverItem(event) {
|
|
464
|
-
if (this._dragStartItem) {
|
|
465
|
-
event.preventDefault();
|
|
466
|
-
this.addOverClass(event.target);
|
|
467
|
-
event.stopPropagation();
|
|
468
|
-
}
|
|
469
|
-
}
|
|
470
|
-
onDragOverLastIndex(ev) {
|
|
471
|
-
ev.preventDefault();
|
|
472
|
-
if (this._dragStartItem) {
|
|
473
|
-
ev.target.classList.add('over');
|
|
474
|
-
ev.stopPropagation();
|
|
475
|
-
}
|
|
476
|
-
}
|
|
477
|
-
showOverlays(groupDragStart) {
|
|
478
|
-
let groupOverlayCollection = this._groupContainer.getElementsByClassName("group-overlay");
|
|
479
|
-
Array.from(groupOverlayCollection).forEach(groupOverlay => {
|
|
480
|
-
let groupOverlayID = this.getGroupOverlayId(groupDragStart.group);
|
|
481
|
-
if (groupOverlayID && groupOverlay.getAttribute("id") && groupOverlayID != groupOverlay.getAttribute("id")) {
|
|
482
|
-
groupOverlay.classList.add("presetedHeight");
|
|
483
|
-
groupOverlay.setAttribute("style", "display:grid");
|
|
484
|
-
}
|
|
485
|
-
});
|
|
486
|
-
}
|
|
487
|
-
hideOverlays() {
|
|
488
|
-
var _a;
|
|
489
|
-
let groupOverlayCollection = (_a = this._groupContainer) === null || _a === void 0 ? void 0 : _a.getElementsByClassName("group-overlay");
|
|
490
|
-
Array.from(groupOverlayCollection).forEach(groupOverlay => {
|
|
491
|
-
groupOverlay.classList.remove("presetedHeight");
|
|
492
|
-
groupOverlay.setAttribute("style", "display:none");
|
|
493
|
-
});
|
|
494
|
-
}
|
|
495
|
-
render() {
|
|
496
|
-
return (h(Host, { ref: (el) => this._element = el }, this.useGroups ?
|
|
497
|
-
h("div", { class: "group-container", ref: (el) => this._groupContainer = el, tabIndex: 0, onKeyDown: (event) => { this.keyDownHandler(event); } }, this._listGroupItems.map(group => {
|
|
498
|
-
return h("div", { id: this.getDivGroupId(group.group), class: "group", key: group.group + group.items.length, onDrop: () => this.onDropGroup(group) }, h("label", { draggable: false, class: "group-name" }, group.group), h("section", { class: "section-container", onDragOver: (ev) => ev.preventDefault() }, h("div", { class: "group-items-container" }, h("div", { class: "draggable-list" }, group.items.map((item, index) => {
|
|
499
|
-
return h("li", { id: 'item_' + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: 'item_' + this.getItemId(item.label) }, 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), onDragOver: (event) => { group.sort ? undefined : this.onDragOverItem(event); }, onDrop: (event) => this.onDrop(event, { groupName: group.group, item: item, index: index }), draggable: this.ezDraggable }, h("div", { class: "item-content" }, this.ezDraggable ? h("span", { class: "draggable-icon" }) : undefined, h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label)), this.itemSlotBuilder ?
|
|
500
|
-
h("div", { class: "slot-item" }, this.itemSlotBuilder(item, group))
|
|
501
|
-
: undefined));
|
|
502
|
-
})), 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 ?
|
|
503
|
-
h("div", { id: this.getGroupOverlayId(group.group), class: "group-overlay" }, "Mover para ", group.group)
|
|
504
|
-
: undefined));
|
|
505
|
-
}))
|
|
506
|
-
:
|
|
507
|
-
h("div", { class: "items-container", ref: (el) => this._itemContainer = el, tabIndex: 0, onKeyDown: (event) => { this.keyDownHandler(event); } }, h("div", { class: "draggable-list" }, this._listItems.map((item, index) => {
|
|
508
|
-
return h("li", { id: 'item_' + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: 'item_' + this.getItemId(item.label) }, h("div", { class: "draggable" + (item.selected == true ? " selected-item " : "") + (this.ezSelectable == true ? " selectable " : ""), onDragStart: () => this.onDragStart({ item: item, index: index }), onClick: () => { this.setSelection(item); }, onDragLeave: () => this.removeOverClass(), onDragOver: (event) => this.onDragOverItem(event), onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDrop(event, { item: item, index: index }), draggable: this.ezDraggable }, h("div", { class: "item-content" }, this.ezDraggable ? h("span", { class: "draggable-icon" }) : undefined, h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label)), this.itemSlotBuilder ?
|
|
509
|
-
h("div", null, this.itemSlotBuilder(item))
|
|
510
|
-
: undefined));
|
|
511
|
-
}), h("div", { class: "last-droppable-space", onDragLeave: () => this.removeOverClass(), onDragOver: (event) => { this.onDragOverLastIndex(event); }, onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDropLastIndex(event) })))));
|
|
512
|
-
}
|
|
513
|
-
};
|
|
514
|
-
EzList.style = ezListCss;
|
|
515
|
-
|
|
516
|
-
export { EzList as ez_list };
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, h, f as Host } from './index-1e9d524f.js';
|
|
2
|
-
|
|
3
|
-
const ezLoadingBarCss = ":host{position:fixed;top:0px;width:100%}.loading-bar{width:100%;margin:0 auto;position:absolute;background-color:var(--color--primary-300, #e2f4ef);height:5px}.loading-bar:before{content:'';position:absolute}.loading-bar__container{position:absolute;top:0;right:100%;bottom:0;left:0;background-color:var(--color--primary, #008561);width:0;animation:loading 2s linear infinite}@keyframes loading{0%{left:0%;right:100%;width:0%}25%{left:0%;right:75%;width:25%}50%{left:0%;right:50%;width:90%}70%{right:0%;left:75%;width:25%}100%{left:100%;right:0%;width:0%}}@-webkit-keyframes loading{0%{left:0%;right:100%;width:0%}25%{left:0%;right:75%;width:25%}50%{left:0%;right:50%;width:90%}70%{right:0%;left:75%;width:25%}100%{left:100%;right:0%;width:0%}}";
|
|
4
|
-
|
|
5
|
-
let EzLoadingBar = class {
|
|
6
|
-
constructor(hostRef) {
|
|
7
|
-
registerInstance(this, hostRef);
|
|
8
|
-
this._showLoading = true;
|
|
9
|
-
}
|
|
10
|
-
hide() {
|
|
11
|
-
this._showLoading = false;
|
|
12
|
-
return Promise.resolve();
|
|
13
|
-
}
|
|
14
|
-
show() {
|
|
15
|
-
this._showLoading = true;
|
|
16
|
-
return Promise.resolve();
|
|
17
|
-
}
|
|
18
|
-
render() {
|
|
19
|
-
return (h(Host, null, this._showLoading && h("div", { class: "loading-bar" }, h("div", { class: "loading-bar__container" }))));
|
|
20
|
-
}
|
|
21
|
-
};
|
|
22
|
-
EzLoadingBar.style = ezLoadingBarCss;
|
|
23
|
-
|
|
24
|
-
export { EzLoadingBar as ez_loading_bar };
|
|
@@ -1,67 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, e as createEvent, h, f as Host } from './index-1e9d524f.js';
|
|
2
|
-
|
|
3
|
-
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;box-sizing:border-box;max-height:100%;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%}}";
|
|
4
|
-
|
|
5
|
-
let EzModal = class {
|
|
6
|
-
constructor(hostRef) {
|
|
7
|
-
registerInstance(this, hostRef);
|
|
8
|
-
this.ezCloseModal = createEvent(this, "ezCloseModal", 7);
|
|
9
|
-
this.ezOpenModal = createEvent(this, "ezOpenModal", 7);
|
|
10
|
-
/**
|
|
11
|
-
* Controle de exibição do Modal
|
|
12
|
-
*/
|
|
13
|
-
this.opened = true;
|
|
14
|
-
/**
|
|
15
|
-
* Define se o modal será fechado ao clicar ESC
|
|
16
|
-
*/
|
|
17
|
-
this.closeEsc = false;
|
|
18
|
-
/**
|
|
19
|
-
* Define se o modal será fechado ao clicar fora do conteúdo.
|
|
20
|
-
*/
|
|
21
|
-
this.closeOutsideClick = false;
|
|
22
|
-
this.handleKeyboardEvent = (ev) => {
|
|
23
|
-
if ((ev === null || ev === void 0 ? void 0 : ev.key) === "Escape" && this.closeEsc) {
|
|
24
|
-
this.closeModal();
|
|
25
|
-
}
|
|
26
|
-
};
|
|
27
|
-
}
|
|
28
|
-
observeOpened() {
|
|
29
|
-
if (this.opened) {
|
|
30
|
-
document.addEventListener("keydown", this.handleKeyboardEvent);
|
|
31
|
-
}
|
|
32
|
-
else {
|
|
33
|
-
document.removeEventListener("keydown", this.handleKeyboardEvent);
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
closeModal() {
|
|
37
|
-
this.opened = false;
|
|
38
|
-
this.ezCloseModal.emit(this.opened);
|
|
39
|
-
}
|
|
40
|
-
componentDidLoad() {
|
|
41
|
-
this.observeOpened();
|
|
42
|
-
}
|
|
43
|
-
componentDidRender() {
|
|
44
|
-
if (this.opened) {
|
|
45
|
-
this.ezOpenModal.emit();
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
onMouseDownHandler(event) {
|
|
49
|
-
if (this.closeOutsideClick && event.target === this._overlay) {
|
|
50
|
-
this.closeModal();
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
render() {
|
|
54
|
-
const positionSufix = this.align === "left" ? "left" : "right";
|
|
55
|
-
return (h(Host, null, this.opened
|
|
56
|
-
?
|
|
57
|
-
h("div", { class: "modal", onMouseDown: evt => this.onMouseDownHandler(evt) }, h("div", { class: `modal__container modal__container--${positionSufix}`, ref: ref => this._overlay = ref }, h("div", { class: `modal__content modal__content--${positionSufix} ${this.modalSize}` }, h("slot", null))))
|
|
58
|
-
:
|
|
59
|
-
undefined));
|
|
60
|
-
}
|
|
61
|
-
static get watchers() { return {
|
|
62
|
-
"opened": ["observeOpened"]
|
|
63
|
-
}; }
|
|
64
|
-
};
|
|
65
|
-
EzModal.style = ezModalCss;
|
|
66
|
-
|
|
67
|
-
export { EzModal as ez_modal };
|