@sankhyalabs/ezui 6.1.0-dev.20 → 6.1.0-dev.21
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-c9d1205c.js → ApplicationUtils-39807831.js} +43 -15
- package/dist/cjs/{RichToolbarHelper-438916fa.js → RichToolbarHelper-ea12328f.js} +0 -13
- package/dist/cjs/app-globals-86776e90.js +12 -0
- package/dist/cjs/{constants-569271bc.js → constants-72b7e05e.js} +0 -2
- package/dist/cjs/ez-actions-button.cjs.entry.js +2 -1
- package/dist/cjs/ez-alert-list.cjs.entry.js +5 -3
- package/dist/cjs/ez-avatar.cjs.entry.js +6 -1
- package/dist/cjs/ez-calendar.cjs.entry.js +7 -6
- package/dist/cjs/ez-collapsible-box.cjs.entry.js +13 -10
- package/dist/cjs/ez-combo-box-list_4.cjs.entry.js +24 -14
- package/dist/cjs/ez-combo-box.cjs.entry.js +7 -6
- package/dist/cjs/ez-date-input.cjs.entry.js +5 -1
- package/dist/cjs/ez-date-time-input.cjs.entry.js +5 -1
- package/dist/cjs/ez-dialog.cjs.entry.js +8 -6
- package/dist/cjs/ez-double-list.cjs.entry.js +12 -4
- package/dist/cjs/ez-file-item.cjs.entry.js +9 -6
- package/dist/cjs/ez-form-view.cjs.entry.js +3 -2
- package/dist/cjs/ez-form.cjs.entry.js +3 -2
- package/dist/cjs/ez-grid.cjs.entry.js +126 -127
- package/dist/cjs/ez-guide-navigator.cjs.entry.js +5 -1
- package/dist/cjs/ez-link-builder_6.cjs.entry.js +33 -13
- package/dist/cjs/ez-list.cjs.entry.js +4 -2
- package/dist/cjs/ez-modal-container.cjs.entry.js +5 -1
- package/dist/cjs/ez-modal.cjs.entry.js +5 -1
- package/dist/cjs/ez-multi-selection-list.cjs.entry.js +9 -5
- package/dist/cjs/ez-number-input.cjs.entry.js +5 -1
- package/dist/cjs/ez-search-plus.cjs.entry.js +8 -6
- package/dist/cjs/ez-search-result-list.cjs.entry.js +5 -2
- package/dist/cjs/ez-search.cjs.entry.js +8 -9
- package/dist/cjs/ez-sidebar-navigator.cjs.entry.js +5 -7
- package/dist/cjs/ez-skeleton.cjs.entry.js +5 -3
- package/dist/cjs/ez-sortable-list.cjs.entry.js +12 -5
- package/dist/cjs/ez-split-button.cjs.entry.js +5 -4
- package/dist/cjs/ez-split-item.cjs.entry.js +6 -2
- package/dist/cjs/ez-text-input.cjs.entry.js +1 -0
- package/dist/cjs/ez-time-input.cjs.entry.js +12 -10
- package/dist/cjs/ez-tree.cjs.entry.js +5 -1
- package/dist/cjs/ez-upload.cjs.entry.js +17 -11
- package/dist/cjs/ezui.cjs.js +4 -0
- package/dist/cjs/filter-column.cjs.entry.js +8 -4
- package/dist/cjs/index-02854309.js +3672 -0
- package/dist/cjs/loader.cjs.js +4 -0
- package/dist/cjs/{search-column-27d1f72f.js → search-column-82c52e20.js} +11 -5
- package/dist/collection/collection-manifest.json +2 -1
- package/dist/collection/components/ez-alert-list/ez-alert-list.js +5 -3
- package/dist/collection/components/ez-avatar/ez-avatar.js +5 -1
- package/dist/collection/components/ez-calendar/ez-calendar.js +7 -6
- package/dist/collection/components/ez-collapsible-box/ez-collapsible-box.js +12 -9
- package/dist/collection/components/ez-combo-box/ez-combo-box-list/ez-combo-box-list.js +7 -4
- package/dist/collection/components/ez-combo-box/ez-combo-box.js +7 -7
- package/dist/collection/components/ez-date-input/ez-date-input.js +5 -1
- package/dist/collection/components/ez-date-time-input/ez-date-time-input.js +5 -1
- package/dist/collection/components/ez-dialog/ez-dialog.js +8 -6
- package/dist/collection/components/ez-double-list/ez-double-list.js +12 -4
- package/dist/collection/components/ez-file-item/ez-file-item.js +9 -6
- package/dist/collection/components/ez-form-view/fieldbuilder/FieldBuilder.js +3 -2
- package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js +10 -9
- package/dist/collection/components/ez-grid/controller/ag-grid/test/constants/GridEditionMock.js +3 -1
- package/dist/collection/components/ez-grid/controller/ag-grid/utils/buildLocaleText.js +67 -0
- package/dist/collection/components/ez-grid/ez-grid.js +15 -13
- package/dist/collection/components/ez-grid/subcomponents/filter-column.js +7 -3
- package/dist/collection/components/ez-grid/subcomponents/selection-counter.js +2 -2
- package/dist/collection/components/ez-grid/subcomponents/utils/selectionCounterUtils.js +11 -7
- package/dist/collection/components/ez-guide-navigator/ez-guide-navigator.js +5 -1
- package/dist/collection/components/ez-list/ez-list.js +4 -2
- package/dist/collection/components/ez-modal/ez-modal.js +5 -1
- package/dist/collection/components/ez-modal-container/ez-modal-container.js +5 -1
- package/dist/collection/components/ez-multi-selection-list/ez-multi-selection-list.js +9 -5
- package/dist/collection/components/ez-number-input/ez-number-input.js +5 -1
- package/dist/collection/components/ez-rich-text/ez-link-builder/ez-link-builder.js +5 -1
- package/dist/collection/components/ez-rich-text/ez-rich-text.js +13 -9
- package/dist/collection/components/ez-rich-text/ez-rich-toolbar/RichToolbarHelper.js +0 -12
- package/dist/collection/components/ez-rich-text/ez-rich-toolbar/ez-rich-toolbar-arrows/ez-rich-toolbar-arrows.js +6 -2
- package/dist/collection/components/ez-rich-text/ez-rich-toolbar/ez-rich-toolbar-configs/ez-rich-toolbar-configs.js +6 -2
- package/dist/collection/components/ez-rich-text/ez-rich-toolbar/ez-rich-toolbar-letters/ez-rich-toolbar-letters.js +6 -2
- package/dist/collection/components/ez-rich-text/ez-rich-toolbar/ez-rich-toolbar.js +8 -4
- package/dist/collection/components/ez-rich-text/ez-simple-image-uploader/ez-simple-image-uploader.js +9 -5
- package/dist/collection/components/ez-search/ez-search.js +7 -8
- package/dist/collection/components/ez-search-plus/ez-search-plus.js +7 -5
- package/dist/collection/components/ez-search-plus/subcomponent/ez-search-result-list/ez-search-result-list.js +5 -2
- package/dist/collection/components/ez-sidebar-navigator/ez-sidebar-navigator.js +5 -2
- package/dist/collection/components/ez-skeleton/ez-skeleton.constants.js +0 -1
- package/dist/collection/components/ez-skeleton/ez-skeleton.js +4 -2
- package/dist/collection/components/ez-sortable-list/ez-sortable-list.js +15 -11
- package/dist/collection/components/ez-split-button/ez-split-button.js +6 -6
- package/dist/collection/components/ez-split-panel/structure/item/ez-split-item.js +5 -1
- package/dist/collection/components/ez-text-edit/ez-text-edit.js +5 -1
- package/dist/collection/components/ez-text-input/ez-text-input.js +1 -0
- package/dist/collection/components/ez-time-input/ez-time-input.js +12 -10
- package/dist/collection/components/ez-tree/ez-tree.js +5 -1
- package/dist/collection/components/ez-upload/ez-upload.js +18 -12
- package/dist/collection/global/app-init.js +6 -0
- package/dist/collection/setupTests.js +1 -1
- package/dist/collection/utils/ApplicationUtils.js +43 -15
- package/dist/collection/utils/constants.js +0 -1
- package/dist/collection/utils/i18n/elanguages.js +6 -0
- package/dist/collection/utils/i18n/i18nUtils.js +20 -0
- package/dist/collection/utils/i18n/index.js +30 -0
- package/dist/collection/utils/i18n/locales/en-us.js +275 -0
- package/dist/collection/utils/i18n/locales/es-es.js +275 -0
- package/dist/collection/utils/i18n/locales/pt-br.js +275 -0
- package/dist/collection/utils/i18n/translations.js +9 -0
- package/dist/collection/utils/validators/recordvalidator/RecordValidationProcessor.js +8 -2
- package/dist/custom-elements/index.js +4056 -278
- package/dist/esm/{ApplicationUtils-eaf91331.js → ApplicationUtils-72f474e8.js} +43 -15
- package/dist/esm/{RichToolbarHelper-fd6427df.js → RichToolbarHelper-f3a149c4.js} +1 -13
- package/dist/esm/app-globals-2ccb253f.js +10 -0
- package/dist/esm/{constants-b036528f.js → constants-3fabe81e.js} +1 -2
- package/dist/esm/ez-actions-button.entry.js +2 -1
- package/dist/esm/ez-alert-list.entry.js +5 -3
- package/dist/esm/ez-avatar.entry.js +6 -1
- package/dist/esm/ez-calendar.entry.js +7 -6
- package/dist/esm/ez-collapsible-box.entry.js +13 -10
- package/dist/esm/ez-combo-box-list_4.entry.js +24 -14
- package/dist/esm/ez-combo-box.entry.js +7 -6
- package/dist/esm/ez-date-input.entry.js +5 -1
- package/dist/esm/ez-date-time-input.entry.js +5 -1
- package/dist/esm/ez-dialog.entry.js +8 -6
- package/dist/esm/ez-double-list.entry.js +12 -4
- package/dist/esm/ez-file-item.entry.js +9 -6
- package/dist/esm/ez-form-view.entry.js +3 -2
- package/dist/esm/ez-form.entry.js +3 -2
- package/dist/esm/ez-grid.entry.js +108 -109
- package/dist/esm/ez-guide-navigator.entry.js +5 -1
- package/dist/esm/ez-link-builder_6.entry.js +33 -13
- package/dist/esm/ez-list.entry.js +4 -2
- package/dist/esm/ez-modal-container.entry.js +5 -1
- package/dist/esm/ez-modal.entry.js +5 -1
- package/dist/esm/ez-multi-selection-list.entry.js +9 -5
- package/dist/esm/ez-number-input.entry.js +5 -1
- package/dist/esm/ez-search-plus.entry.js +8 -6
- package/dist/esm/ez-search-result-list.entry.js +5 -2
- package/dist/esm/ez-search.entry.js +8 -9
- package/dist/esm/ez-sidebar-navigator.entry.js +5 -7
- package/dist/esm/ez-skeleton.entry.js +5 -3
- package/dist/esm/ez-sortable-list.entry.js +12 -5
- package/dist/esm/ez-split-button.entry.js +5 -4
- package/dist/esm/ez-split-item.entry.js +6 -2
- package/dist/esm/ez-text-input.entry.js +1 -0
- package/dist/esm/ez-time-input.entry.js +12 -10
- package/dist/esm/ez-tree.entry.js +5 -1
- package/dist/esm/ez-upload.entry.js +17 -11
- package/dist/esm/ezui.js +4 -0
- package/dist/esm/filter-column.entry.js +8 -4
- package/dist/esm/index-b623906e.js +3669 -0
- package/dist/esm/loader.js +4 -0
- package/dist/esm/{search-column-e609d513.js → search-column-5a55f676.js} +9 -3
- package/dist/ezui/ezui.esm.js +1 -1
- package/dist/ezui/p-0603bcc7.entry.js +1 -0
- package/dist/ezui/p-0ec7aa3a.entry.js +1 -0
- package/dist/ezui/p-0f0f3efe.entry.js +1 -0
- package/dist/ezui/p-1c3efd36.entry.js +1 -0
- package/dist/ezui/p-1ffb75d5.js +1 -0
- package/dist/ezui/p-22934e19.entry.js +1 -0
- package/dist/ezui/p-2f471aca.entry.js +1 -0
- package/dist/ezui/p-303b3b8c.entry.js +1 -0
- package/dist/ezui/p-3b89a9a0.entry.js +1 -0
- package/dist/ezui/p-3e71ca08.entry.js +1 -0
- package/dist/ezui/p-3e767a74.js +1 -0
- package/dist/ezui/p-3e88fbb6.entry.js +1 -0
- package/dist/ezui/p-4044a7d7.entry.js +1 -0
- package/dist/ezui/p-45c9b292.entry.js +1 -0
- package/dist/ezui/p-45e64547.entry.js +1 -0
- package/dist/ezui/p-46913da7.js +1 -0
- package/dist/ezui/p-4773ff4c.js +1 -0
- package/dist/ezui/p-4fc5f926.entry.js +1 -0
- package/dist/ezui/p-53bc30a1.entry.js +1 -0
- package/dist/ezui/p-627ff5a2.entry.js +1 -0
- package/dist/ezui/p-629e32e2.entry.js +1 -0
- package/dist/ezui/{p-66354b29.entry.js → p-6562b5c8.entry.js} +46 -46
- package/dist/ezui/p-6e6fccfb.entry.js +1 -0
- package/dist/ezui/{p-ad0deb16.entry.js → p-713dc93e.entry.js} +1 -1
- package/dist/ezui/p-84a136bf.entry.js +1 -0
- package/dist/ezui/p-973e6a40.entry.js +1 -0
- package/dist/ezui/p-a12f6074.entry.js +1 -0
- package/dist/ezui/p-a482aae1.entry.js +1 -0
- package/dist/ezui/p-a687f14c.entry.js +7 -0
- package/dist/ezui/p-adbc3261.entry.js +1 -0
- package/dist/ezui/p-b115058e.entry.js +1 -0
- package/dist/ezui/p-b1e45320.js +1 -0
- package/dist/ezui/p-b4215a04.entry.js +1 -0
- package/dist/ezui/p-b8ed876d.entry.js +1 -0
- package/dist/ezui/p-ba07b3df.js +1 -0
- package/dist/ezui/p-c00ad772.entry.js +1 -0
- package/dist/ezui/p-c2a8139d.entry.js +1 -0
- package/dist/ezui/p-caf2584a.entry.js +1 -0
- package/dist/ezui/p-d1d0868b.entry.js +1 -0
- package/dist/ezui/p-e5260556.entry.js +1 -0
- package/dist/ezui/p-ed3bed1e.entry.js +1 -0
- package/dist/types/components/ez-alert-list/ez-alert-list.d.ts +2 -1
- package/dist/types/components/ez-avatar/ez-avatar.d.ts +2 -0
- package/dist/types/components/ez-calendar/ez-calendar.d.ts +2 -3
- package/dist/types/components/ez-collapsible-box/ez-collapsible-box.d.ts +2 -0
- package/dist/types/components/ez-combo-box/ez-combo-box-list/ez-combo-box-list.d.ts +2 -0
- package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +2 -2
- package/dist/types/components/ez-date-input/ez-date-input.d.ts +2 -0
- package/dist/types/components/ez-date-time-input/ez-date-time-input.d.ts +2 -0
- package/dist/types/components/ez-dialog/ez-dialog.d.ts +2 -2
- package/dist/types/components/ez-double-list/ez-double-list.d.ts +2 -0
- package/dist/types/components/ez-file-item/ez-file-item.d.ts +2 -0
- package/dist/types/components/ez-grid/controller/EzGridController.d.ts +5 -0
- package/dist/types/components/ez-grid/controller/ag-grid/AgGridController.d.ts +1 -0
- package/dist/types/components/ez-grid/controller/ag-grid/test/constants/GridEditionMock.d.ts +1 -1
- package/dist/types/components/ez-grid/controller/ag-grid/utils/buildLocaleText.d.ts +66 -0
- package/dist/types/components/ez-grid/ez-grid.d.ts +2 -2
- package/dist/types/components/ez-grid/subcomponents/filter-column.d.ts +2 -0
- package/dist/types/components/ez-grid/subcomponents/selection-counter.d.ts +2 -0
- package/dist/types/components/ez-grid/subcomponents/utils/selectionCounterUtils.d.ts +2 -2
- package/dist/types/components/ez-guide-navigator/ez-guide-navigator.d.ts +2 -0
- package/dist/types/components/ez-list/ez-list.d.ts +2 -1
- package/dist/types/components/ez-modal/ez-modal.d.ts +2 -0
- package/dist/types/components/ez-modal-container/ez-modal-container.d.ts +2 -0
- package/dist/types/components/ez-multi-selection-list/ez-multi-selection-list.d.ts +2 -0
- package/dist/types/components/ez-number-input/ez-number-input.d.ts +2 -0
- package/dist/types/components/ez-rich-text/ez-link-builder/ez-link-builder.d.ts +2 -0
- package/dist/types/components/ez-rich-text/ez-rich-text.d.ts +2 -0
- package/dist/types/components/ez-rich-text/ez-rich-toolbar/RichToolbarHelper.d.ts +0 -12
- package/dist/types/components/ez-rich-text/ez-rich-toolbar/ez-rich-toolbar-arrows/ez-rich-toolbar-arrows.d.ts +2 -0
- package/dist/types/components/ez-rich-text/ez-rich-toolbar/ez-rich-toolbar-configs/ez-rich-toolbar-configs.d.ts +2 -0
- package/dist/types/components/ez-rich-text/ez-rich-toolbar/ez-rich-toolbar-letters/ez-rich-toolbar-letters.d.ts +2 -0
- package/dist/types/components/ez-rich-text/ez-rich-toolbar/ez-rich-toolbar.d.ts +2 -0
- package/dist/types/components/ez-rich-text/ez-simple-image-uploader/ez-simple-image-uploader.d.ts +2 -0
- package/dist/types/components/ez-search/ez-search.d.ts +2 -3
- package/dist/types/components/ez-search-plus/ez-search-plus.d.ts +2 -1
- package/dist/types/components/ez-search-plus/subcomponent/ez-search-result-list/ez-search-result-list.d.ts +2 -1
- package/dist/types/components/ez-sidebar-navigator/ez-sidebar-navigator.d.ts +2 -0
- package/dist/types/components/ez-skeleton/ez-skeleton.constants.d.ts +0 -1
- package/dist/types/components/ez-skeleton/ez-skeleton.d.ts +2 -1
- package/dist/types/components/ez-sortable-list/ez-sortable-list.d.ts +2 -0
- package/dist/types/components/ez-split-button/ez-split-button.d.ts +2 -2
- package/dist/types/components/ez-split-panel/structure/item/ez-split-item.d.ts +2 -0
- package/dist/types/components/ez-text-edit/ez-text-edit.d.ts +2 -0
- package/dist/types/components/ez-time-input/ez-time-input.d.ts +2 -1
- package/dist/types/components/ez-tree/ez-tree.d.ts +2 -0
- package/dist/types/components/ez-upload/ez-upload.d.ts +3 -1
- package/dist/types/global/app-init.d.ts +1 -0
- package/dist/types/utils/ApplicationUtils.d.ts +3 -1
- package/dist/types/utils/constants.d.ts +0 -1
- package/dist/types/utils/i18n/elanguages.d.ts +5 -0
- package/dist/types/utils/i18n/i18nUtils.d.ts +2 -0
- package/dist/types/utils/i18n/index.d.ts +5 -0
- package/dist/types/utils/i18n/locales/en-us.d.ts +276 -0
- package/dist/types/utils/i18n/locales/es-es.d.ts +276 -0
- package/dist/types/utils/i18n/locales/pt-br.d.ts +276 -0
- package/dist/types/utils/i18n/translations.d.ts +828 -0
- package/dist/types/utils/validators/recordvalidator/RecordValidationProcessor.d.ts +1 -0
- package/package.json +7 -1
- package/dist/collection/components/ez-grid/controller/ag-grid/i18n/pt-BR.js +0 -75
- package/dist/collection/components/ez-sidebar-navigator/messages/constants.js +0 -5
- package/dist/ezui/p-0306dff7.entry.js +0 -1
- package/dist/ezui/p-07894c4a.entry.js +0 -1
- package/dist/ezui/p-09de35a2.entry.js +0 -1
- package/dist/ezui/p-1276ef79.entry.js +0 -1
- package/dist/ezui/p-1cebdc92.js +0 -1
- package/dist/ezui/p-1eb34cad.entry.js +0 -1
- package/dist/ezui/p-2187f86c.js +0 -1
- package/dist/ezui/p-33326ac5.entry.js +0 -1
- package/dist/ezui/p-3ba9565c.entry.js +0 -1
- package/dist/ezui/p-454bba13.entry.js +0 -1
- package/dist/ezui/p-496f7832.entry.js +0 -1
- package/dist/ezui/p-4bb47bbe.entry.js +0 -1
- package/dist/ezui/p-4bd6dd6a.entry.js +0 -1
- package/dist/ezui/p-555c9018.entry.js +0 -1
- package/dist/ezui/p-57363cfd.entry.js +0 -1
- package/dist/ezui/p-58f69d24.entry.js +0 -1
- package/dist/ezui/p-59561756.entry.js +0 -7
- package/dist/ezui/p-5eea9886.js +0 -1
- package/dist/ezui/p-6bcf4ba2.entry.js +0 -1
- package/dist/ezui/p-6e429cff.entry.js +0 -1
- package/dist/ezui/p-7019f782.entry.js +0 -1
- package/dist/ezui/p-77a4bd35.entry.js +0 -1
- package/dist/ezui/p-7eae6986.entry.js +0 -1
- package/dist/ezui/p-9478b13b.entry.js +0 -1
- package/dist/ezui/p-98ee5c31.entry.js +0 -1
- package/dist/ezui/p-998afb6a.entry.js +0 -1
- package/dist/ezui/p-a148e994.entry.js +0 -1
- package/dist/ezui/p-ad79f9d1.entry.js +0 -1
- package/dist/ezui/p-b796e213.entry.js +0 -1
- package/dist/ezui/p-bac0f920.entry.js +0 -1
- package/dist/ezui/p-bff24a7b.js +0 -1
- package/dist/ezui/p-da1b4a38.entry.js +0 -1
- package/dist/ezui/p-dc73e1fe.entry.js +0 -1
- package/dist/ezui/p-ddd1e05f.entry.js +0 -1
- package/dist/ezui/p-e4528470.entry.js +0 -1
- package/dist/ezui/p-e6a9041d.entry.js +0 -1
- package/dist/ezui/p-ec0d8122.entry.js +0 -1
- package/dist/types/components/ez-grid/controller/ag-grid/i18n/pt-BR.d.ts +0 -2
- package/dist/types/components/ez-sidebar-navigator/messages/constants.d.ts +0 -5
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { ElementIDUtils, StringUtils } from "@sankhyalabs/core";
|
|
2
2
|
import { h } from "@stencil/core";
|
|
3
|
+
import initI18n from '../../utils/i18n';
|
|
3
4
|
export class EzFileItem {
|
|
4
5
|
constructor() {
|
|
5
6
|
this.canRemove = true;
|
|
@@ -10,7 +11,7 @@ export class EzFileItem {
|
|
|
10
11
|
}
|
|
11
12
|
observeProgress(newProgress) {
|
|
12
13
|
if (newProgress < 0 || newProgress > 100) {
|
|
13
|
-
throw new Error("
|
|
14
|
+
throw new Error(this.i18n("ez-file-item.invalidProgress"));
|
|
14
15
|
}
|
|
15
16
|
this._element.style.setProperty("--ez-file-item--upload-progress", `${100 - newProgress}%`);
|
|
16
17
|
}
|
|
@@ -31,14 +32,16 @@ export class EzFileItem {
|
|
|
31
32
|
}
|
|
32
33
|
return FILE_TYPE_ICONS[extension] || DEFAULT_FILE_TYPE_ICON;
|
|
33
34
|
}
|
|
35
|
+
async componentWillLoad() {
|
|
36
|
+
this.i18n = await initI18n();
|
|
37
|
+
}
|
|
34
38
|
render() {
|
|
35
39
|
this._element.title = `${this.fileName} ${this.getFileSize()}`;
|
|
36
40
|
ElementIDUtils.addIDInfoIfNotExists(this._element, 'ezFileIcon');
|
|
37
|
-
return (h("div", { class: "box", onClick: () => this.ezClick.emit(this.fileName) }, h("div", { class: "content" }, h("ez-icon", { "data-element-id": ElementIDUtils.getInternalIDInfo("fileIcon"), class: "file-type-icon", size: "medium", "icon-name": this.getIconName() }), h("label", { class: "file-name" }, this.fileName), h("label", { class: "file-size" }, this.getFileSize())), this.canRemove ?
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
} }) : undefined));
|
|
41
|
+
return (h("div", { class: "box", onClick: () => this.ezClick.emit(this.fileName) }, h("div", { class: "content" }, h("ez-icon", { "data-element-id": ElementIDUtils.getInternalIDInfo("fileIcon"), class: "file-type-icon", size: "medium", "icon-name": this.getIconName() }), h("label", { class: "file-name" }, this.fileName), h("label", { class: "file-size" }, this.getFileSize())), this.canRemove ? (h("ez-icon", { "data-element-id": ElementIDUtils.getInternalIDInfo("remove"), class: "btn-remove", size: "medium", "icon-name": "close", title: this.i18n("app.remove"), onClick: evt => {
|
|
42
|
+
this.ezRemove.emit(this.fileName);
|
|
43
|
+
evt.stopPropagation();
|
|
44
|
+
} })) : undefined));
|
|
42
45
|
}
|
|
43
46
|
static get is() { return "ez-file-item"; }
|
|
44
47
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { UserInterface } from "@sankhyalabs/core";
|
|
2
|
-
import { REQUIRED_INFO } from "../../../utils/constants";
|
|
3
2
|
import { buildCheckBox, buildSwitch } from "./templates/CheckBox.tpl";
|
|
4
3
|
import { buildComboBox } from "./templates/ComboBox.tpl";
|
|
5
4
|
import { buildDate, buildTime, buildDateTime, buildTimeSeconds } from "./templates/DateInput.tpl";
|
|
@@ -10,6 +9,7 @@ import { buildTextInput } from "./templates/TextInput.tpl";
|
|
|
10
9
|
import { buildSearchPlus } from "./templates/SearchInputPlus.tpl";
|
|
11
10
|
import { buildSearch } from "./templates/SearchInput.tpl";
|
|
12
11
|
import { buildRichText } from "./templates/RichText.tpl";
|
|
12
|
+
import { getI18n } from "../../../utils/i18n";
|
|
13
13
|
const uiBuilders = new Map();
|
|
14
14
|
uiBuilders.set(UserInterface.CHECKBOX, buildCheckBox);
|
|
15
15
|
uiBuilders.set(UserInterface.SWITCH, buildSwitch);
|
|
@@ -26,8 +26,9 @@ uiBuilders.set(UserInterface.SEARCHPLUS, buildSearchPlus);
|
|
|
26
26
|
uiBuilders.set(UserInterface.LONGTEXT, buildTextArea);
|
|
27
27
|
uiBuilders.set(UserInterface.HTML, buildRichText);
|
|
28
28
|
export const fieldBuilder = (field) => {
|
|
29
|
+
const i18n = getI18n();
|
|
29
30
|
const builder = uiBuilders.get(field.userInterface) || buildTextInput;
|
|
30
|
-
const label = field.required ? `${field.label}${
|
|
31
|
+
const label = field.required ? `${field.label}${i18n("app.requiredInfo")}` : field.label;
|
|
31
32
|
const builtElement = builder(Object.assign(Object.assign({}, field), { label }));
|
|
32
33
|
//@ts-ignore
|
|
33
34
|
builtElement.$attrs$['data-form-item'] = field.name;
|
|
@@ -5,7 +5,6 @@ import DataSource from './DataSource';
|
|
|
5
5
|
import { EzGridCustomHeader } from './components/EzGridCustomHeader';
|
|
6
6
|
import { CellRendererStatus } from './components/cellRendererStatus';
|
|
7
7
|
import SelectionHeader from './components/selectionHeader';
|
|
8
|
-
import gridTerms from './i18n/pt-BR';
|
|
9
8
|
import { DISTINCT_FILTER_NAME_PREFIX, EZ_GRID_LOADING_SOURCE, PRESENTATION_COL_ID_PROP_NAME, PRESENTATION_FROM_COL_PROP_NAME } from '../../../../utils/constants';
|
|
10
9
|
import GridEditionManager from './GridEditionManager';
|
|
11
10
|
import { ModuleRegistry } from '@ag-grid-community/core';
|
|
@@ -15,6 +14,7 @@ import { ServerSideRowModelModule } from '@ag-grid-enterprise/server-side-row-mo
|
|
|
15
14
|
import { ClipboardModule } from '@ag-grid-enterprise/clipboard';
|
|
16
15
|
import { MenuModule } from '@ag-grid-enterprise/menu';
|
|
17
16
|
import DOMPurify from 'dompurify';
|
|
17
|
+
import { buildLocaleText } from './utils/buildLocaleText';
|
|
18
18
|
export default class AgGridController {
|
|
19
19
|
configFilterColumn(filterColumn) {
|
|
20
20
|
this._filterColumn = filterColumn;
|
|
@@ -169,6 +169,7 @@ export default class AgGridController {
|
|
|
169
169
|
}
|
|
170
170
|
if (this._grid === undefined) {
|
|
171
171
|
LicenseManager.setLicenseKey(ApplicationContext.getContextValue('__EZUI__GRID_LICENSE__'));
|
|
172
|
+
this._i18n = options.i18n;
|
|
172
173
|
this._columnStateChangeCallback = options.onColumnStateChange;
|
|
173
174
|
this._selectionChangeCallback = options.onSelectionChange;
|
|
174
175
|
this._doubleClickCallBack = options.onDoubleClick;
|
|
@@ -182,7 +183,7 @@ export default class AgGridController {
|
|
|
182
183
|
}
|
|
183
184
|
this._gridOptions = {
|
|
184
185
|
suppressHorizontalScroll: options.suppressHorizontalScroll,
|
|
185
|
-
localeText:
|
|
186
|
+
localeText: buildLocaleText(this._options.i18n),
|
|
186
187
|
enableRangeSelection: this._multipleSelection,
|
|
187
188
|
rowSelection: this._multipleSelection ? 'multiple' : 'single',
|
|
188
189
|
sortingOrder: ['desc', 'asc', null],
|
|
@@ -296,7 +297,7 @@ export default class AgGridController {
|
|
|
296
297
|
buildMenuItemOptionSort(params, sortOrder) {
|
|
297
298
|
return {
|
|
298
299
|
icon: sortOrder === 'asc' ? `<i class='ez-icon-ordem-ascendente'></i>` : `<i class='ez-icon-ordem-descendente'></i>`,
|
|
299
|
-
name: sortOrder === 'asc' ?
|
|
300
|
+
name: sortOrder === 'asc' ? this._i18n("ez-grid.sortAscending") : this._i18n("ez-grid.sortDescending"),
|
|
300
301
|
action: () => this.sortDataByColumn(params, sortOrder),
|
|
301
302
|
};
|
|
302
303
|
}
|
|
@@ -305,7 +306,7 @@ export default class AgGridController {
|
|
|
305
306
|
const columnLabel = params.column.getColDef().headerName;
|
|
306
307
|
return {
|
|
307
308
|
icon: `<i class='ez-icon-filter'></i>`,
|
|
308
|
-
name:
|
|
309
|
+
name: this._i18n("ez-grid.filter"),
|
|
309
310
|
action: () => this.showFilterColumn({ columnName, columnLabel, leftPosition: this._filterColumnleftPosition, filteredOptions: this._filteredColumns.get(columnName) }),
|
|
310
311
|
};
|
|
311
312
|
}
|
|
@@ -331,7 +332,7 @@ export default class AgGridController {
|
|
|
331
332
|
const isPinned = params.column.isPinned();
|
|
332
333
|
return {
|
|
333
334
|
icon: `<i class='ez-icon-${isPinned ? 'un-pin' : 'push-pin'}'></i>`,
|
|
334
|
-
name: isPinned ?
|
|
335
|
+
name: isPinned ? this._i18n("ez-grid.unpinColumn") : this._i18n("ez-grid.pinColumn"),
|
|
335
336
|
action: () => {
|
|
336
337
|
columnApi.applyColumnState({
|
|
337
338
|
state: [{ colId: column.getColId(), pinned: column.isPinned() ? null : 'left' }],
|
|
@@ -936,7 +937,7 @@ export default class AgGridController {
|
|
|
936
937
|
tooltip = (_c = source.props) === null || _c === void 0 ? void 0 : _c.get('gridHeaderTooltip');
|
|
937
938
|
}
|
|
938
939
|
else if (propSortable === false) {
|
|
939
|
-
tooltip = '
|
|
940
|
+
tooltip = this._i18n('ez-grid.columnCantBeOrder');
|
|
940
941
|
}
|
|
941
942
|
const presentationFrom = (_d = source === null || source === void 0 ? void 0 : source.props) === null || _d === void 0 ? void 0 : _d.get(PRESENTATION_FROM_COL_PROP_NAME);
|
|
942
943
|
return this._editionManager.configureColumn({
|
|
@@ -961,7 +962,7 @@ export default class AgGridController {
|
|
|
961
962
|
return "";
|
|
962
963
|
}
|
|
963
964
|
if (params.value instanceof Promise) {
|
|
964
|
-
return "
|
|
965
|
+
return `${this._i18n("app.loading")}...`;
|
|
965
966
|
}
|
|
966
967
|
if (source.userInterface === UserInterface.HTML) {
|
|
967
968
|
this.setHTMLRender(params, source);
|
|
@@ -1057,10 +1058,10 @@ export default class AgGridController {
|
|
|
1057
1058
|
}
|
|
1058
1059
|
if ((source === null || source === void 0 ? void 0 : source.userInterface) === UserInterface.SWITCH) {
|
|
1059
1060
|
if ((params === null || params === void 0 ? void 0 : params.value) === 'S' || (params === null || params === void 0 ? void 0 : params.value) === true || (params === null || params === void 0 ? void 0 : params.value) === 'true') {
|
|
1060
|
-
return
|
|
1061
|
+
return this._i18n("app.yes");
|
|
1061
1062
|
}
|
|
1062
1063
|
else if ((params === null || params === void 0 ? void 0 : params.value) === 'N' || (params === null || params === void 0 ? void 0 : params.value) === false || (params === null || params === void 0 ? void 0 : params.value) === 'false') {
|
|
1063
|
-
return
|
|
1064
|
+
return this._i18n("app.no");
|
|
1064
1065
|
}
|
|
1065
1066
|
}
|
|
1066
1067
|
if ((source === null || source === void 0 ? void 0 : source.userInterface) === UserInterface.SEARCH) {
|
package/dist/collection/components/ez-grid/controller/ag-grid/test/constants/GridEditionMock.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { StringUtils } from "@sankhyalabs/core";
|
|
2
|
+
import initI18n from "../../../../../../utils/i18n";
|
|
2
3
|
const columnsState = [{
|
|
3
4
|
colId: StringUtils.generateUUID(),
|
|
4
5
|
}];
|
|
@@ -24,7 +25,7 @@ export const gridEditionImplementation = {
|
|
|
24
25
|
getColumnState: () => columnsState,
|
|
25
26
|
} }))
|
|
26
27
|
};
|
|
27
|
-
export function buildOptions(dataUnit) {
|
|
28
|
+
export async function buildOptions(dataUnit) {
|
|
28
29
|
return ({
|
|
29
30
|
allowMultipleSelection: true,
|
|
30
31
|
dataUnit,
|
|
@@ -38,5 +39,6 @@ export function buildOptions(dataUnit) {
|
|
|
38
39
|
useEnterLikeTab: true,
|
|
39
40
|
enableContinuousInsert: false,
|
|
40
41
|
enableGridInsert: false,
|
|
42
|
+
i18n: await initI18n(),
|
|
41
43
|
});
|
|
42
44
|
}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
export function buildLocaleText(i18n) {
|
|
2
|
+
return ({
|
|
3
|
+
page: i18n("ez-grid.pageLabel"),
|
|
4
|
+
more: i18n("ez-grid.remainingPageLabel"),
|
|
5
|
+
to: i18n("ez-grid.remainingTotalLabel"),
|
|
6
|
+
of: i18n("ez-grid.remainingTotalLabel"),
|
|
7
|
+
next: i18n("ez-grid.nextPage"),
|
|
8
|
+
previous: i18n("ez-grid.previousPage"),
|
|
9
|
+
loadingOoo: i18n("app.loading"),
|
|
10
|
+
noRowsToShow: i18n("ez-grid.noRowsToShow"),
|
|
11
|
+
pinColumn: i18n("ez-grid.pinColumn"),
|
|
12
|
+
unpinColumn: i18n("ez-grid.unpinColumn"),
|
|
13
|
+
filterOoo: i18n("ez-grid.filter"),
|
|
14
|
+
sortAscending: i18n("ez-grid.sortAscending"),
|
|
15
|
+
sortDescending: i18n("ez-grid.sortDescending"),
|
|
16
|
+
last: i18n("ez-grid.last"),
|
|
17
|
+
first: i18n("ez-grid.first"),
|
|
18
|
+
selectAll: i18n("ez-grid.selectAll"),
|
|
19
|
+
searchOoo: i18n("ez-grid.searchOoo"),
|
|
20
|
+
blanks: i18n("ez-grid.blanks"),
|
|
21
|
+
applyFilter: i18n("ez-grid.applyFilter"),
|
|
22
|
+
equals: i18n("ez-grid.equals"),
|
|
23
|
+
lessThan: i18n("ez-grid.lessThan"),
|
|
24
|
+
greaterThan: i18n("ez-grid.greaterThan"),
|
|
25
|
+
contains: i18n("ez-grid.contains"),
|
|
26
|
+
startsWith: i18n("ez-grid.startsWith"),
|
|
27
|
+
endsWith: i18n("ez-grid.endsWith"),
|
|
28
|
+
group: i18n("ez-grid.group"),
|
|
29
|
+
columns: i18n("ez-grid.columns"),
|
|
30
|
+
rowGroupColumns: i18n("ez-grid.rowGroupColumns"),
|
|
31
|
+
rowGroupColumnsEmptyMessage: i18n("ez-grid.rowGroupColumnsEmptyMessage"),
|
|
32
|
+
valueColumns: i18n("ez-grid.valueColumns"),
|
|
33
|
+
pivotMode: i18n("ez-grid.pivotMode"),
|
|
34
|
+
groups: i18n("ez-grid.groups"),
|
|
35
|
+
values: i18n("ez-grid.values"),
|
|
36
|
+
pivots: i18n("ez-grid.pivots"),
|
|
37
|
+
valueColumnsEmptyMessage: i18n("ez-grid.valueColumnsEmptyMessage"),
|
|
38
|
+
pivotColumnsEmptyMessage: i18n("ez-grid.pivotColumnsEmptyMessage"),
|
|
39
|
+
toolPanelButton: i18n("ez-grid.toolPanelButton"),
|
|
40
|
+
valueAggregation: i18n("ez-grid.valueAggregation"),
|
|
41
|
+
autosizeThiscolumn: i18n("ez-grid.autosizeThiscolumn"),
|
|
42
|
+
autosizeAllColumns: i18n("ez-grid.autosizeAllColumns"),
|
|
43
|
+
groupBy: i18n("ez-grid.groupBy"),
|
|
44
|
+
ungroupBy: i18n("ez-grid.ungroupBy"),
|
|
45
|
+
resetColumns: i18n("ez-grid.resetColumns"),
|
|
46
|
+
expandAll: i18n("ez-grid.expandAll"),
|
|
47
|
+
collapseAll: i18n("ez-grid.collapseAll"),
|
|
48
|
+
toolPanel: i18n("ez-grid.toolPanel"),
|
|
49
|
+
export: i18n("ez-grid.export"),
|
|
50
|
+
csvExport: i18n("ez-grid.csvExport"),
|
|
51
|
+
excelExport: i18n("ez-grid.excelExport"),
|
|
52
|
+
pinLeft: i18n("ez-grid.pinLeft"),
|
|
53
|
+
pinRight: i18n("ez-grid.pinRight"),
|
|
54
|
+
noPin: i18n("ez-grid.noPin"),
|
|
55
|
+
sum: i18n("ez-grid.sum"),
|
|
56
|
+
min: i18n("ez-grid.min"),
|
|
57
|
+
max: i18n("ez-grid.max"),
|
|
58
|
+
none: i18n("ez-grid.none"),
|
|
59
|
+
count: i18n("ez-grid.count"),
|
|
60
|
+
average: i18n("ez-grid.average"),
|
|
61
|
+
copy: i18n("ez-grid.copy"),
|
|
62
|
+
copyWithHeaders: i18n("ez-grid.copyWithHeaders"),
|
|
63
|
+
ctrlC: i18n("ez-grid.ctrlC"),
|
|
64
|
+
paste: i18n("ez-grid.paste"),
|
|
65
|
+
ctrlV: i18n("ez-grid.ctrlV"),
|
|
66
|
+
});
|
|
67
|
+
}
|
|
@@ -6,6 +6,7 @@ import AgGridController from './controller/ag-grid/AgGridController';
|
|
|
6
6
|
import { SelectionCounter } from './subcomponents/selection-counter';
|
|
7
7
|
import InMemoryFilterColumnDataSource from './utils/InMemoryFilterColumnDataSource';
|
|
8
8
|
import { focusOnFieldSerch, LABEL_SEARCH_COLUMN, SEARCH_FIELD_FULL_WIDTH, SHORTCUT_SEARCH_FIELD } from '../../utils/searchColumn/search-column';
|
|
9
|
+
import initI18n from '../../utils/i18n';
|
|
9
10
|
const windowInstace = window;
|
|
10
11
|
const matches = (text, filter) => {
|
|
11
12
|
const normalizedText = StringUtils.replaceAccentuatedCharsLower(text === null || text === void 0 ? void 0 : text.toLocaleLowerCase());
|
|
@@ -15,7 +16,6 @@ const matches = (text, filter) => {
|
|
|
15
16
|
export class EzGrid {
|
|
16
17
|
constructor() {
|
|
17
18
|
this._gridController = new AgGridController(false);
|
|
18
|
-
this._messageFilterAppliedSuccess = 'Filtro de coluna aplicado com sucesso!';
|
|
19
19
|
this._customEditor = new Map();
|
|
20
20
|
this._customRenders = new Map();
|
|
21
21
|
this._paginationInfo = undefined;
|
|
@@ -409,7 +409,7 @@ export class EzGrid {
|
|
|
409
409
|
await ((_a = this._cancelPaginationPopoverElement) === null || _a === void 0 ? void 0 : _a.hide());
|
|
410
410
|
}
|
|
411
411
|
renderCancelPagination() {
|
|
412
|
-
return (h("ez-popover", { ref: (element) => (this._cancelPaginationPopoverElement = element), "overlay-type": 'none', autoClose: false }, h("div", { class: 'cancel-pagination' }, h("ez-icon", { iconName: "sync", size: "x-large", class: "spin" }), h("span", { onClick: () => this.handleCancelPagination(), class: 'cancel-pagination-btn' }, "
|
|
412
|
+
return (h("ez-popover", { ref: (element) => (this._cancelPaginationPopoverElement = element), "overlay-type": 'none', autoClose: false }, h("div", { class: 'cancel-pagination' }, h("ez-icon", { iconName: "sync", size: "x-large", class: "spin" }), h("span", { onClick: () => this.handleCancelPagination(), class: 'cancel-pagination-btn' }, this.i18n("ez-grid.cancelPagination")))));
|
|
413
413
|
}
|
|
414
414
|
handleShowCancelPagination() {
|
|
415
415
|
var _a, _b, _c;
|
|
@@ -425,7 +425,7 @@ export class EzGrid {
|
|
|
425
425
|
if (!this._paginationInfo)
|
|
426
426
|
return null;
|
|
427
427
|
const { currentPage, hasMore } = this._paginationInfo;
|
|
428
|
-
return (h("div", { class: `grid-header__container grid-header__pagination ${this.resolvePaginationClassMode()}`, ref: ref => (this._refPaginationControl = ref) }, this.renderCancelPagination(), h("div", { class: "ez-text ez-text--primary ez-text--medium ez-margin-right--medium", ref: (element) => (this._refPaginationLabel = element) }, h("span", { class: "grid-header__pagination-label" }, this.shouldPresentPaginationLabel() && h("strong", { class: "ez-text ez-text--primary ez-text--medium" }, this._getActualPageLabel()), this.shouldPresentPaginationLabel() && this._getRemainingPageLabel())), h("div", { id: "grid-pagination-tooltip", ref: (element) => (this._refPaginationLabelTooltip = element), class: "ez-flex ez-margin-right--medium", title: `${this._getActualPageLabel()} ${this._getRemainingPageLabel()}` }, h("ez-button", { size: "small", class: "ez-margin-right--medium", iconName: "chevron-left", mode: "icon", enabled: currentPage > 0, onClick: () => this.previousPage(), label: "
|
|
428
|
+
return (h("div", { class: `grid-header__container grid-header__pagination ${this.resolvePaginationClassMode()}`, ref: ref => (this._refPaginationControl = ref) }, this.renderCancelPagination(), h("div", { class: "ez-text ez-text--primary ez-text--medium ez-margin-right--medium", ref: (element) => (this._refPaginationLabel = element) }, h("span", { class: "grid-header__pagination-label" }, this.shouldPresentPaginationLabel() && h("strong", { class: "ez-text ez-text--primary ez-text--medium" }, this._getActualPageLabel()), this.shouldPresentPaginationLabel() && this._getRemainingPageLabel())), h("div", { id: "grid-pagination-tooltip", ref: (element) => (this._refPaginationLabelTooltip = element), class: "ez-flex ez-margin-right--medium", title: `${this._getActualPageLabel()} ${this._getRemainingPageLabel()}` }, h("ez-button", { size: "small", class: "ez-margin-right--medium", iconName: "chevron-left", mode: "icon", enabled: currentPage > 0, onClick: () => this.previousPage(), label: this.i18n("ez-grid.previousPage") }), h("ez-button", { size: "small", iconName: "chevron-right", mode: "icon", enabled: hasMore, onClick: () => this.nextPage(), label: this.i18n("ez-grid.nextPage") }))));
|
|
429
429
|
}
|
|
430
430
|
shouldPresentPaginationLabel() {
|
|
431
431
|
return this.paginationCounterMode === 'show' || this.paginationCounterMode === 'auto';
|
|
@@ -465,7 +465,8 @@ export class EzGrid {
|
|
|
465
465
|
enableLockManagerTaskbarClick: this.enableLockManagerTaskbarClick,
|
|
466
466
|
enableLockManagerLoadingComp: this.enableLockManagerLoadingComp,
|
|
467
467
|
enableRowTableStriped: this.enableRowTableStriped,
|
|
468
|
-
suppressHorizontalScroll: this.suppressHorizontalScroll
|
|
468
|
+
suppressHorizontalScroll: this.suppressHorizontalScroll,
|
|
469
|
+
i18n: this.i18n
|
|
469
470
|
});
|
|
470
471
|
if (this.config) {
|
|
471
472
|
this.observeConfig(this.config);
|
|
@@ -498,7 +499,7 @@ export class EzGrid {
|
|
|
498
499
|
}
|
|
499
500
|
_getRemainingPageLabel() {
|
|
500
501
|
const { total, count } = this._paginationInfo;
|
|
501
|
-
return `${total == undefined ?
|
|
502
|
+
return `${total == undefined ? this.i18n("ez-grid.remainingPageLabel", { count: count + 1 }) : this.i18n("ez-grid.remainingTotalLabel", { total })}`;
|
|
502
503
|
}
|
|
503
504
|
_hasToShowCancelPagination() {
|
|
504
505
|
var _a;
|
|
@@ -574,10 +575,11 @@ export class EzGrid {
|
|
|
574
575
|
}
|
|
575
576
|
componentDidRender() {
|
|
576
577
|
windowInstace.addEventListener('onSubmitFilter', () => {
|
|
577
|
-
ApplicationUtils.info(this.
|
|
578
|
+
ApplicationUtils.info(this.i18n("ez-grid.filterAppliedSuccess"));
|
|
578
579
|
});
|
|
579
580
|
}
|
|
580
|
-
componentWillLoad() {
|
|
581
|
+
async componentWillLoad() {
|
|
582
|
+
this.i18n = await initI18n();
|
|
581
583
|
this._hasLeftButtons = !!this._element.querySelector('[slot="leftButtons"]');
|
|
582
584
|
if (!this.dataUnit.name.includes("InMemoryDataUnit"))
|
|
583
585
|
return;
|
|
@@ -616,12 +618,12 @@ export class EzGrid {
|
|
|
616
618
|
if (!this._paginationInfo)
|
|
617
619
|
return;
|
|
618
620
|
this.nextRecord();
|
|
619
|
-
}, { description: "
|
|
621
|
+
}, { description: this.i18n("ez-grid.nextRecord"), element: this._element })
|
|
620
622
|
.bind("ctrl + ,", () => {
|
|
621
623
|
if (!this._paginationInfo)
|
|
622
624
|
return;
|
|
623
625
|
this.previousRecord();
|
|
624
|
-
}, { description: "
|
|
626
|
+
}, { description: this.i18n("ez-grid.previousRecord"), element: this._element })
|
|
625
627
|
.bind("ctrl + alt + ArrowLeft", () => {
|
|
626
628
|
if (!this._paginationInfo)
|
|
627
629
|
return;
|
|
@@ -629,7 +631,7 @@ export class EzGrid {
|
|
|
629
631
|
if (currentPage > 0) {
|
|
630
632
|
this.previousPage();
|
|
631
633
|
}
|
|
632
|
-
}, { description: "
|
|
634
|
+
}, { description: this.i18n("ez-grid.previousPage"), element: this._element })
|
|
633
635
|
.bind("ctrl + alt + ArrowRight", () => {
|
|
634
636
|
if (!this._paginationInfo)
|
|
635
637
|
return;
|
|
@@ -637,7 +639,7 @@ export class EzGrid {
|
|
|
637
639
|
if (hasMore) {
|
|
638
640
|
this.nextPage();
|
|
639
641
|
}
|
|
640
|
-
}, { description: "
|
|
642
|
+
}, { description: this.i18n("ez-grid.nextPage"), element: this._element });
|
|
641
643
|
if (this.useSearchColumn) {
|
|
642
644
|
this._keyboardManager.bind(SHORTCUT_SEARCH_FIELD, async () => {
|
|
643
645
|
if (!this._container || !this._ezPopoverSearchColumn)
|
|
@@ -645,7 +647,7 @@ export class EzGrid {
|
|
|
645
647
|
const container = this._container.getBoundingClientRect();
|
|
646
648
|
await focusOnFieldSerch(this._columnSearch);
|
|
647
649
|
this._ezPopoverSearchColumn.showUnder(this._container, { horizontalGap: container.width - (SEARCH_FIELD_FULL_WIDTH), verticalGap: container.height * -1 });
|
|
648
|
-
}, { description:
|
|
650
|
+
}, { description: this.i18n("ez-grid.searchColumn"), element: this._element });
|
|
649
651
|
}
|
|
650
652
|
}
|
|
651
653
|
async removeShortcuts() {
|
|
@@ -690,7 +692,7 @@ export class EzGrid {
|
|
|
690
692
|
'shadow-mode': !this.outlineMode && !this.hideHeader(),
|
|
691
693
|
}, tabindex: "0" }, h("filter-column", { class: "grid-header__popover", noHeaderTaskBar: !this._hasLeftButtons, dataSource: this.getDataSource(), dataUnit: this.dataUnit, gridHeaderHidden: this.hideHeader(), ref: (element) => (this._filterColumn = element) }), h("div", { class: "grid-header__position" }, h("div", { class: `grid-header__container grid-header__left-container ${this.resolveLeftHeaderClass()}` }, h("slot", { name: "leftButtons" })), this.getPaginationControl())), h("ez-popover", { ref: elem => (this._ezPopoverSearchColumn = elem), overlayType: "none" }, this.renderFieldSearchColumn()), h("div", { ref: (ref) => (this._gridSelectionCounter = ref), class: `grid__selection-counter ez-elevation--4
|
|
692
694
|
${this._showSelectionCounter ? 'grid__selection-counter--opened' : ''}
|
|
693
|
-
` }, h(SelectionCounter, { selectionCount: this._selectionCount, currentPageSelected: this._currentPageSelected, paginationInfo: this._paginationInfo, canSelectAll: (_a = this.selectionToastConfig) === null || _a === void 0 ? void 0 : _a.canSelectAll, allRecordSelected: this._isAllSelection, onSelectAll: () => this.onSelectAllRecords(), onSelectPage: () => this.onSelectPageRecords(), onClearAll: () => this.onClearSelectedRecords(), onClose: () => (this._showSelectionCounter = false) })), h("div", { class: "grid__footer" }, h("slot", { name: "footer" }))));
|
|
695
|
+
` }, h(SelectionCounter, { selectionCount: this._selectionCount, currentPageSelected: this._currentPageSelected, paginationInfo: this._paginationInfo, canSelectAll: (_a = this.selectionToastConfig) === null || _a === void 0 ? void 0 : _a.canSelectAll, allRecordSelected: this._isAllSelection, i18n: this.i18n, onSelectAll: () => this.onSelectAllRecords(), onSelectPage: () => this.onSelectPageRecords(), onClearAll: () => this.onClearSelectedRecords(), onClose: () => (this._showSelectionCounter = false) })), h("div", { class: "grid__footer" }, h("slot", { name: "footer" }))));
|
|
694
696
|
}
|
|
695
697
|
static get is() { return "ez-grid"; }
|
|
696
698
|
static get encapsulation() { return "scoped"; }
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { UserInterface } from '@sankhyalabs/core';
|
|
2
2
|
import { h } from '@stencil/core';
|
|
3
3
|
import { PRESENTATION_FROM_COL_PROP_NAME } from '../../../utils/constants';
|
|
4
|
+
import initI18n from '../../../utils/i18n';
|
|
4
5
|
const windowInstace = window;
|
|
5
6
|
const onSubmitFilter = new CustomEvent('onSubmitFilter', {
|
|
6
7
|
detail: {
|
|
@@ -107,8 +108,8 @@ export class FilterColumn {
|
|
|
107
108
|
}
|
|
108
109
|
if (this.isCheckBoxOrSwitch()) {
|
|
109
110
|
return [
|
|
110
|
-
{ label:
|
|
111
|
-
{ label:
|
|
111
|
+
{ label: this.i18n("app.yes"), value: 'true', check: true },
|
|
112
|
+
{ label: this.i18n("app.no"), value: 'false', check: true },
|
|
112
113
|
];
|
|
113
114
|
}
|
|
114
115
|
const options = (_b = (_a = this.fieldDescriptor) === null || _a === void 0 ? void 0 : _a.properties) === null || _b === void 0 ? void 0 : _b.options;
|
|
@@ -128,8 +129,11 @@ export class FilterColumn {
|
|
|
128
129
|
this.clearConfigs();
|
|
129
130
|
}
|
|
130
131
|
}
|
|
132
|
+
async componentWillLoad() {
|
|
133
|
+
this.i18n = await initI18n();
|
|
134
|
+
}
|
|
131
135
|
render() {
|
|
132
|
-
return (h("ez-popover-plus", { ref: (element) => (this.ezPopoverElement = element), class: 'filter-column__popover', "overlay-type": 'none', autoClose: true, onEzVisibilityChange: this.handleEzVisibilityChange.bind(this) }, h("section", { class: 'filter-column' }, h("header", { class: 'filter-column__header' }, h("span", { class: 'ez-text ez-text--medium filter-column__header-title' }, "
|
|
136
|
+
return (h("ez-popover-plus", { ref: (element) => (this.ezPopoverElement = element), class: 'filter-column__popover', "overlay-type": 'none', autoClose: true, onEzVisibilityChange: this.handleEzVisibilityChange.bind(this) }, h("section", { class: 'filter-column' }, h("header", { class: 'filter-column__header' }, h("span", { class: 'ez-text ez-text--medium filter-column__header-title' }, this.i18n("ez-grid.filterColumnHeader", { columnLabel: this.columnLabel })), h("ez-button", { mode: 'icon', "icon-name": 'close', class: 'ez-button--tertiary', onClick: () => this.hide() })), h("ez-multi-selection-list", { id: 'filter-column-selection-list', columnName: this.columnName, dataSource: this.dataSource, options: this.options, useOptions: this.useOptions, ref: (element) => (this.ezMultiSelectionList = element), onChangeFilteredOptions: (event) => this.changeSelectedItems(event.detail), isTextSearch: this.isTextSearch }), h("footer", { class: 'filter-column__footer' }, h("ez-button", { label: this.i18n("app.apply"), class: 'ez-button--primary', onClick: this.submit.bind(this) })))));
|
|
133
137
|
}
|
|
134
138
|
static get is() { return "filter-column"; }
|
|
135
139
|
static get originalStyleUrls() {
|
|
@@ -2,7 +2,7 @@ import { ElementIDUtils } from "@sankhyalabs/core";
|
|
|
2
2
|
import { h } from "@stencil/core";
|
|
3
3
|
import { buildSelectAllLabel, buildSelectAllTitle, enableSelectAll, getText } from './utils/selectionCounterUtils';
|
|
4
4
|
export const SelectionCounter = (props) => {
|
|
5
|
-
const { selectionCount, currentPageSelected, allRecordSelected, paginationInfo, canSelectAll, onSelectAll, onSelectPage, onClearAll, onClose } = props;
|
|
5
|
+
const { selectionCount, currentPageSelected, allRecordSelected, paginationInfo, canSelectAll, onSelectAll, onSelectPage, onClearAll, onClose, i18n } = props;
|
|
6
6
|
const { total, hasMore, count } = paginationInfo || {};
|
|
7
7
|
const shouldRenderSelectionButton = () => {
|
|
8
8
|
if ((!allRecordSelected && selectionCount === total) || (allRecordSelected && !hasMore))
|
|
@@ -12,7 +12,7 @@ export const SelectionCounter = (props) => {
|
|
|
12
12
|
return !!paginationInfo && (currentPageSelected || allRecordSelected);
|
|
13
13
|
};
|
|
14
14
|
return (h("div", Object.assign({ class: "ez-box ez-box--shadow-small" }, getElementID("ezGridSelectionCounter")), h("div", { class: "ez-flex ez-flex--align-items-center ez-size-width--full ez-padding-horizontal--medium" }, h("div", { class: "ez-flex ez-flex--wrap ez-flex--align-items-baseline ez-flex--justify-center" }, h("label", Object.assign({ innerHTML: getText(selectionCount, allRecordSelected), class: "ez-text ez-text--primary ez-text--medium ez-margin-right--medium ez-margin-top--medium" }, getElementID("ezGridSelectionCounter_label"))), h("div", { class: "ez-flex ez-margin-right--medium" }, shouldRenderSelectionButton() &&
|
|
15
|
-
h("ez-button", Object.assign({ key: "selectAllRecordsEzButton", title: buildSelectAllTitle(total), enabled: enableSelectAll(total), class: "ez-margin-right--medium", label: buildSelectAllLabel(allRecordSelected, count, total), mode: "link", onClick: allRecordSelected ? onSelectPage : onSelectAll }, getElementID(`ezGridSelectionCounter_select${allRecordSelected ? "Page" : "All"}`))), h("ez-button", Object.assign({ key: "clearAllSelectionEzButton", class: "grid__btn-clear", label: "
|
|
15
|
+
h("ez-button", Object.assign({ key: "selectAllRecordsEzButton", title: buildSelectAllTitle(total), enabled: enableSelectAll(total), class: "ez-margin-right--medium", label: buildSelectAllLabel(allRecordSelected, count, total), mode: "link", onClick: allRecordSelected ? onSelectPage : onSelectAll }, getElementID(`ezGridSelectionCounter_select${allRecordSelected ? "Page" : "All"}`))), h("ez-button", Object.assign({ key: "clearAllSelectionEzButton", class: "grid__btn-clear", label: i18n("ez-grid.clearSelection"), mode: "link", onClick: onClearAll }, getElementID("ezGridSelectionCounter_clearAll"))))), h("button", Object.assign({ class: "grid__btn-close", title: i18n("app.close"), onClick: onClose }, getElementID("ezGridSelectionCounter_close")), h("ez-icon", { iconName: "close" })))));
|
|
16
16
|
};
|
|
17
17
|
function getElementID(sufix) {
|
|
18
18
|
return {
|
|
@@ -1,22 +1,26 @@
|
|
|
1
|
+
import { getI18n } from "../../../../utils/i18n";
|
|
1
2
|
export function enableSelectAll(total) {
|
|
2
3
|
return total !== undefined;
|
|
3
4
|
}
|
|
4
5
|
export function buildSelectAllLabel(allRecordSelected, count, total) {
|
|
6
|
+
const i18n = getI18n();
|
|
5
7
|
if (allRecordSelected)
|
|
6
|
-
return '
|
|
8
|
+
return i18n('utils.selectAllPage');
|
|
7
9
|
if (total === undefined)
|
|
8
|
-
return
|
|
9
|
-
return
|
|
10
|
+
return i18n('utils.loadingAllRecords', { count });
|
|
11
|
+
return i18n('utils.selectAllRecords', { total });
|
|
10
12
|
}
|
|
11
13
|
export function buildSelectAllTitle(total) {
|
|
12
14
|
if (enableSelectAll(total))
|
|
13
15
|
return '';
|
|
14
|
-
|
|
16
|
+
const i18n = getI18n();
|
|
17
|
+
return i18n('utils.waitForLoad');
|
|
15
18
|
}
|
|
16
19
|
export function getText(selectionCount, allSelectedRecords) {
|
|
20
|
+
const i18n = getI18n();
|
|
17
21
|
if (allSelectedRecords) {
|
|
18
|
-
return
|
|
22
|
+
return i18n('utils.allRecordsSelected', { selectionCount });
|
|
19
23
|
}
|
|
20
|
-
const
|
|
21
|
-
return
|
|
24
|
+
const plural = selectionCount > 1 ? "s" : "";
|
|
25
|
+
return i18n('utils.selectedRecords', { selectionCount, plural });
|
|
22
26
|
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { h, Host } from "@stencil/core";
|
|
2
2
|
import { ElementIDUtils } from "@sankhyalabs/core";
|
|
3
3
|
import { EzScrollDirection } from "../ez-scroller/EzScrollDirection";
|
|
4
|
+
import initI18n from '../../utils/i18n';
|
|
4
5
|
const ENTER_KEY = "Enter";
|
|
5
6
|
export class EzGuideNavigator {
|
|
6
7
|
constructor() {
|
|
@@ -70,6 +71,9 @@ export class EzGuideNavigator {
|
|
|
70
71
|
async getParent(id) {
|
|
71
72
|
return this._tree.getParent(id);
|
|
72
73
|
}
|
|
74
|
+
async componentWillLoad() {
|
|
75
|
+
this.i18n = await initI18n();
|
|
76
|
+
}
|
|
73
77
|
async handleToggleSidebar() {
|
|
74
78
|
this.open = !this.open;
|
|
75
79
|
}
|
|
@@ -84,7 +88,7 @@ export class EzGuideNavigator {
|
|
|
84
88
|
}
|
|
85
89
|
render() {
|
|
86
90
|
ElementIDUtils.addIDInfoIfNotExists(this._element);
|
|
87
|
-
return (h(Host, null, h("ez-sidebar-button", { class: this.open ? "hidden" : "", onEzClick: this.handleToggleSidebar.bind(this), "aria-controls": "navigator", "aria-expanded": this.open, "data-element-id": ElementIDUtils.getInternalIDInfo("openButton") }), h("aside", { tabIndex: -1, id: "navigator", class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-guide-navigator " + (this.open ? "" : "hidden"), "data-element-id": ElementIDUtils.getInternalIDInfo("sidebar") }, h("div", { role: "search", class: "ez-guide-navigator__actions" }, h("ez-filter-input", { mode: "slim", value: this.filterText, onEzChange: (event) => this.onFilterChanged(event), label: "
|
|
91
|
+
return (h(Host, null, h("ez-sidebar-button", { class: this.open ? "hidden" : "", onEzClick: this.handleToggleSidebar.bind(this), "aria-controls": "navigator", "aria-expanded": this.open, "data-element-id": ElementIDUtils.getInternalIDInfo("openButton") }), h("aside", { tabIndex: -1, id: "navigator", class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-guide-navigator " + (this.open ? "" : "hidden"), "data-element-id": ElementIDUtils.getInternalIDInfo("sidebar") }, h("div", { role: "search", class: "ez-guide-navigator__actions" }, h("ez-filter-input", { mode: "slim", value: this.filterText, onEzChange: (event) => this.onFilterChanged(event), label: this.i18n("ez-guide-navigator.searchGuide"), "aria-placeholder": this.i18n("ez-guide-navigator.searchGuide"), onKeyUp: this.handleFilterTree.bind(this), "data-element-id": ElementIDUtils.getInternalIDInfo("textinput") }), h("ez-button", { onClick: this.handleToggleSidebar.bind(this), class: "inverted", mode: "icon", size: "small", iconName: "show_menu", title: this.i18n("ez-guide-navigator.hideMenu"), "aria-label": this.i18n("ez-guide-navigator.hideMenu"), "aria-controls": "navigator", "data-element-id": ElementIDUtils.getInternalIDInfo("closeButton") })), h("ez-scroller", { direction: EzScrollDirection.VERTICAL, activeShadow: true }, h("ez-tree", { ref: element => (this._tree = element), items: this.items, "data-element-id": ElementIDUtils.getInternalIDInfo("tree"), tooltipResolver: this.tooltipResolver, onEzChange: evt => this.ezSelectionChange.emit(evt.detail), selectedId: this.selectedId })))));
|
|
88
92
|
}
|
|
89
93
|
static get is() { return "ez-guide-navigator"; }
|
|
90
94
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { ElementIDUtils, StringUtils } from '@sankhyalabs/core';
|
|
2
2
|
import { Fragment, Host, h } from '@stencil/core';
|
|
3
3
|
import { processListOnDrop } from './ezListHelper';
|
|
4
|
+
import initI18n from '../../utils/i18n';
|
|
4
5
|
export class EzList {
|
|
5
6
|
constructor() {
|
|
6
7
|
this._listItemsHistory = [];
|
|
@@ -205,7 +206,8 @@ export class EzList {
|
|
|
205
206
|
ElementIDUtils.addIDInfoIfNotExists(item, 'selectable');
|
|
206
207
|
});
|
|
207
208
|
}
|
|
208
|
-
componentWillLoad() {
|
|
209
|
+
async componentWillLoad() {
|
|
210
|
+
this.i18n = await initI18n();
|
|
209
211
|
this._listItemsHistory = [];
|
|
210
212
|
}
|
|
211
213
|
componentWillRender() {
|
|
@@ -582,7 +584,7 @@ export class EzList {
|
|
|
582
584
|
'hover-feedback': this.hoverFeedback,
|
|
583
585
|
}, key: 'item_' + item.id }, {
|
|
584
586
|
[ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: ElementIDUtils.getInternalIDInfo(`ezListItem__${StringUtils.replaceAccentuatedChars(item.label)}`),
|
|
585
|
-
}), h("div", { class: 'draggable' + (item.selected == true ? ' selected-item ' : '') + (this.ezSelectable == true ? ' selectable ' : ''), onDblClick: () => this.doubleClickItem(item), 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, this.listMode === 'regular' ? (h(Fragment, null, !!this.itemLeftSlotBuilder && this.getContainerItemBuilder('left', item, group), h("p", { title: item.label, class: 'person-name text--ellipsis' }, item.label))) : (h("ez-check", { label: item.label, value: item.check, onEzChange: evt => this.ezCheckChange.emit(this.buildItem(item, evt)) }))), !!this.itemSlotBuilder && this.getContainerItemBuilder('right', item, group, 'slot-item')))))), 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 ? (h("div", { id: this.getGroupOverlayId(group.group), class: 'group-overlay' }, "
|
|
587
|
+
}), h("div", { class: 'draggable' + (item.selected == true ? ' selected-item ' : '') + (this.ezSelectable == true ? ' selectable ' : ''), onDblClick: () => this.doubleClickItem(item), 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, this.listMode === 'regular' ? (h(Fragment, null, !!this.itemLeftSlotBuilder && this.getContainerItemBuilder('left', item, group), h("p", { title: item.label, class: 'person-name text--ellipsis' }, item.label))) : (h("ez-check", { label: item.label, value: item.check, onEzChange: evt => this.ezCheckChange.emit(this.buildItem(item, evt)) }))), !!this.itemSlotBuilder && this.getContainerItemBuilder('right', item, group, 'slot-item')))))), 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 ? (h("div", { id: this.getGroupOverlayId(group.group), class: 'group-overlay' }, this.i18n("ez-list.moveToGroup", { groupName: group.group }))) : undefined)));
|
|
586
588
|
}));
|
|
587
589
|
}
|
|
588
590
|
renderList() {
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { Host, h } from "@stencil/core";
|
|
2
2
|
import { FloatingManager, KeyboardManager } from '@sankhyalabs/core';
|
|
3
|
+
import initI18n from '../../utils/i18n';
|
|
3
4
|
export class EzModal {
|
|
4
5
|
constructor() {
|
|
5
6
|
this.modalSize = undefined;
|
|
@@ -23,6 +24,9 @@ export class EzModal {
|
|
|
23
24
|
this.opened = false;
|
|
24
25
|
this.ezCloseModal.emit(this.opened);
|
|
25
26
|
}
|
|
27
|
+
async componentWillLoad() {
|
|
28
|
+
this.i18n = await initI18n();
|
|
29
|
+
}
|
|
26
30
|
componentDidLoad() {
|
|
27
31
|
this.observeOpened();
|
|
28
32
|
this._keyboardManager = new KeyboardManager({ propagate: false, element: this._element, enableShadowDom: true })
|
|
@@ -65,7 +69,7 @@ export class EzModal {
|
|
|
65
69
|
const scrimType = `modal__screen-${this.scrim}`;
|
|
66
70
|
return (h(Host, null, this.opened
|
|
67
71
|
?
|
|
68
|
-
h("div", { ref: ref => this._modalRef = ref, class: `modal ${scrimType} ${regularVerticalPaddingClass}`, onMouseDown: evt => this.onMouseDownHandler(evt), tabIndex: -1 }, h("div", { class: `modal__container modal__container--${positionSufix}`, ref: ref => this._overlay = ref }, h("div", { onMouseLeave: () => this.onMouseLeaveHandler(), class: `modal__content ${modalContentHeightMode} ${this.modalSize}` }, h("slot", null))))
|
|
72
|
+
h("div", { ref: ref => this._modalRef = ref, class: `modal ${scrimType} ${regularVerticalPaddingClass}`, onMouseDown: evt => this.onMouseDownHandler(evt), tabIndex: -1, "aria-label": this.i18n("ez-modal.close") }, h("div", { class: `modal__container modal__container--${positionSufix}`, ref: ref => this._overlay = ref }, h("div", { onMouseLeave: () => this.onMouseLeaveHandler(), class: `modal__content ${modalContentHeightMode} ${this.modalSize}` }, h("slot", null))))
|
|
69
73
|
:
|
|
70
74
|
undefined));
|
|
71
75
|
}
|
|
@@ -2,6 +2,7 @@ import { h, Host } from "@stencil/core";
|
|
|
2
2
|
import { KeyboardManager } from "@sankhyalabs/core";
|
|
3
3
|
import ModalAction from "./modal-action";
|
|
4
4
|
import ModalButtonStatus from "./modal-button-status";
|
|
5
|
+
import initI18n from '../../utils/i18n';
|
|
5
6
|
export class EzModalContainer {
|
|
6
7
|
constructor() {
|
|
7
8
|
this.modalTitle = undefined;
|
|
@@ -25,6 +26,9 @@ export class EzModalContainer {
|
|
|
25
26
|
okIsVisible() {
|
|
26
27
|
return (this.okButtonStatus !== ModalButtonStatus.HIDDEN && this.okButtonLabel != undefined);
|
|
27
28
|
}
|
|
29
|
+
async componentWillLoad() {
|
|
30
|
+
this.i18n = await initI18n();
|
|
31
|
+
}
|
|
28
32
|
componentDidLoad() {
|
|
29
33
|
window.requestAnimationFrame(() => {
|
|
30
34
|
this.ezModalAction.emit(ModalAction.LOAD);
|
|
@@ -52,7 +56,7 @@ export class EzModalContainer {
|
|
|
52
56
|
this._closeButton.focus();
|
|
53
57
|
}
|
|
54
58
|
render() {
|
|
55
|
-
return (h(Host, null, h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: () => this.focusLast() }), h("div", { ref: ref => this._modalRef = ref, tabIndex: -1, class: "ez-modal-container__header-container" }, this.showTitleBar && (h("div", { class: "ez-modal-container__header ez-margin-bottom--medium" }, h("div", { class: "ez-col ez-align--middle ez-modal-container__title" }, h("h2", { class: "ez-text ez-title--large ez-title--primary ez-text--bold ez-margin-vertical--extra-small" }, this.modalTitle), this.modalSubTitle && (h("div", { class: "ez-text ez-text--medium ez-text--primary ez-margin-vertical--extra-small" }, this.modalSubTitle))), (this.showCloseButton && h("button", { ref: ref => this._closeButton = ref, class: "ez-modal-container__close-button", onClick: () => this.ezModalAction.emit(ModalAction.CLOSE) }, h("ez-icon", { class: "ez-modal-container__close-icon", size: "medium", iconName: "close" })))))), h("div", { tabIndex: -1, class: "ez-modal-container__content" }, h("slot", null)), h("div", { tabIndex: -1, class: "ez-modal-container__footer" }, this.cancelIsVisible() && (h("ez-button", { label: this.cancelButtonLabel, enabled: this.cancelButtonStatus !== ModalButtonStatus.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction.CANCEL) })), this.okIsVisible() && (h("ez-button", { ref: ref => this._okButton = ref, class: "ez-button--primary", label: this.okButtonLabel, enabled: this.okButtonStatus !== ModalButtonStatus.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction.OK) }))), h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: () => this.focusFirst() })));
|
|
59
|
+
return (h(Host, null, h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: () => this.focusLast() }), h("div", { ref: ref => this._modalRef = ref, tabIndex: -1, class: "ez-modal-container__header-container" }, this.showTitleBar && (h("div", { class: "ez-modal-container__header ez-margin-bottom--medium" }, h("div", { class: "ez-col ez-align--middle ez-modal-container__title" }, h("h2", { class: "ez-text ez-title--large ez-title--primary ez-text--bold ez-margin-vertical--extra-small" }, this.modalTitle), this.modalSubTitle && (h("div", { class: "ez-text ez-text--medium ez-text--primary ez-margin-vertical--extra-small" }, this.modalSubTitle))), (this.showCloseButton && h("button", { ref: ref => this._closeButton = ref, class: "ez-modal-container__close-button", onClick: () => this.ezModalAction.emit(ModalAction.CLOSE), "aria-label": this.i18n("app.close") }, h("ez-icon", { class: "ez-modal-container__close-icon", size: "medium", iconName: "close" })))))), h("div", { tabIndex: -1, class: "ez-modal-container__content" }, h("slot", null)), h("div", { tabIndex: -1, class: "ez-modal-container__footer" }, this.cancelIsVisible() && (h("ez-button", { label: this.cancelButtonLabel || this.i18n("app.cancel"), enabled: this.cancelButtonStatus !== ModalButtonStatus.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction.CANCEL) })), this.okIsVisible() && (h("ez-button", { ref: ref => this._okButton = ref, class: "ez-button--primary", label: this.okButtonLabel || this.i18n("app.ok"), enabled: this.okButtonStatus !== ModalButtonStatus.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction.OK) }))), h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: () => this.focusFirst() })));
|
|
56
60
|
}
|
|
57
61
|
static get is() { return "ez-modal-container"; }
|
|
58
62
|
static get encapsulation() { return "scoped"; }
|