@sankhyalabs/ezui 5.20.0-dev.4 → 5.20.0-dev.41
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/{CSSVarsUtils-b136a156.js → CSSVarsUtils-10c9d5b4.js} +13 -0
- package/dist/cjs/ez-actions-button.cjs.entry.js +1 -1
- package/dist/cjs/ez-alert-list.cjs.entry.js +1 -1
- package/dist/cjs/ez-card-item_3.cjs.entry.js +183 -0
- package/dist/cjs/ez-check.cjs.entry.js +1 -1
- package/dist/cjs/ez-combo-box.cjs.entry.js +20 -163
- package/dist/cjs/ez-date-input.cjs.entry.js +4 -1
- package/dist/cjs/ez-date-time-input.cjs.entry.js +4 -1
- package/dist/cjs/ez-form-view.cjs.entry.js +30 -13
- package/dist/cjs/ez-grid.cjs.entry.js +169 -62
- package/dist/cjs/ez-icon.cjs.entry.js +1 -1
- package/dist/cjs/ez-modal-container.cjs.entry.js +6 -0
- package/dist/cjs/ez-multi-selection-list.cjs.entry.js +2 -10
- package/dist/cjs/ez-number-input.cjs.entry.js +4 -1
- package/dist/cjs/ez-popup.cjs.entry.js +8 -1
- package/dist/cjs/ez-scroller_3.cjs.entry.js +18 -4
- package/dist/cjs/ez-search.cjs.entry.js +611 -32
- package/dist/cjs/ez-split-button.cjs.entry.js +166 -0
- package/dist/cjs/ez-split-item.cjs.entry.js +20 -2
- package/dist/cjs/ez-split-panel.cjs.entry.js +52 -15
- package/dist/cjs/ez-time-input.cjs.entry.js +1 -1
- package/dist/cjs/ez-toast.cjs.entry.js +1 -1
- package/dist/cjs/ezui.cjs.js +1 -1
- package/dist/cjs/filter-column.cjs.entry.js +16 -5
- package/dist/cjs/index-a7b0c73d.js +10 -10
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +4 -3
- package/dist/collection/components/ez-alert-list/ez-alert-list.css +1 -1
- package/dist/collection/components/ez-card-item/ez-card-item.css +52 -3
- package/dist/collection/components/ez-card-item/ez-card-item.js +22 -3
- package/dist/collection/components/ez-check/ez-check.css +1 -0
- package/dist/collection/components/ez-collapsible-box/ez-collapsible-box.css +1 -0
- package/dist/collection/components/ez-combo-box/ez-combo-box.js +20 -180
- package/dist/collection/components/ez-date-input/ez-date-input.js +3 -0
- package/dist/collection/components/ez-date-time-input/ez-date-time-input.js +3 -0
- package/dist/collection/components/ez-form-view/ez-form-view.css +17 -1
- package/dist/collection/components/ez-form-view/ez-form-view.js +22 -5
- package/dist/collection/components/ez-form-view/fieldbuilder/templates/CheckBox.tpl.js +1 -1
- package/dist/collection/components/ez-form-view/fieldbuilder/templates/ComboBox.tpl.js +1 -1
- package/dist/collection/components/ez-form-view/fieldbuilder/templates/DateInput.tpl.js +3 -3
- package/dist/collection/components/ez-form-view/fieldbuilder/templates/NumberInput.tpl.js +1 -1
- package/dist/collection/components/ez-form-view/fieldbuilder/templates/SearchInput.tpl.js +1 -1
- package/dist/collection/components/ez-form-view/fieldbuilder/templates/TextInput.tpl.js +1 -1
- package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js +34 -18
- package/dist/collection/components/ez-grid/controller/ag-grid/DataSource.js +15 -2
- package/dist/collection/components/ez-grid/controller/ag-grid/DataSourceInterceptor.js +21 -0
- package/dist/collection/components/ez-grid/controller/ag-grid/components/EzGridCustomHeader.js +5 -7
- package/dist/collection/components/ez-grid/ez-grid.css +25 -2
- package/dist/collection/components/ez-grid/ez-grid.js +100 -30
- package/dist/collection/components/ez-grid/subcomponents/filter-column.js +16 -5
- package/dist/collection/components/ez-icon/ez-icon.css +118 -116
- package/dist/collection/components/ez-modal-container/ez-modal-container.js +15 -0
- package/dist/collection/components/ez-multi-selection-list/ez-multi-selection-list.js +2 -10
- package/dist/collection/components/ez-number-input/ez-number-input.js +3 -0
- package/dist/collection/components/ez-popup/ez-popup.css +2 -5
- package/dist/collection/components/ez-popup/ez-popup.js +31 -1
- package/dist/collection/components/ez-search/ez-search.css +331 -0
- package/dist/collection/components/ez-search/ez-search.js +688 -55
- package/dist/collection/components/ez-split-button/ez-split-button.css +229 -0
- package/dist/collection/components/ez-split-button/ez-split-button.js +455 -0
- package/dist/collection/components/ez-split-button/test/dropdownItems.js +42 -0
- package/dist/collection/components/ez-split-panel/ez-split-panel.css +6 -14
- package/dist/collection/components/ez-split-panel/ez-split-panel.js +77 -23
- package/dist/collection/components/ez-split-panel/structure/item/ez-split-item.css +66 -12
- package/dist/collection/components/ez-split-panel/structure/item/ez-split-item.js +82 -2
- package/dist/collection/components/ez-toast/ez-toast.css +1 -1
- package/dist/collection/components/ez-tree/ez-tree.css +26 -0
- package/dist/collection/components/ez-tree/interfaces/ITreeItemBadge.js +1 -0
- package/dist/collection/components/ez-tree/subcomponents/TreeItem.js +15 -2
- package/dist/collection/utils/CSSVarsUtils.js +13 -0
- package/dist/collection/utils/form/test/DataBinder.test.js +9 -0
- package/dist/custom-elements/index.d.ts +6 -0
- package/dist/custom-elements/index.js +1148 -326
- package/dist/esm/{CSSVarsUtils-a97cfa29.js → CSSVarsUtils-71ce76be.js} +13 -0
- package/dist/esm/ez-actions-button.entry.js +1 -1
- package/dist/esm/ez-alert-list.entry.js +1 -1
- package/dist/esm/ez-card-item_3.entry.js +177 -0
- package/dist/esm/ez-check.entry.js +1 -1
- package/dist/esm/ez-combo-box.entry.js +21 -164
- package/dist/esm/ez-date-input.entry.js +4 -1
- package/dist/esm/ez-date-time-input.entry.js +4 -1
- package/dist/esm/ez-form-view.entry.js +31 -14
- package/dist/esm/ez-grid.entry.js +170 -63
- package/dist/esm/ez-icon.entry.js +1 -1
- package/dist/esm/ez-modal-container.entry.js +6 -0
- package/dist/esm/ez-multi-selection-list.entry.js +2 -10
- package/dist/esm/ez-number-input.entry.js +4 -1
- package/dist/esm/ez-popup.entry.js +8 -1
- package/dist/esm/ez-scroller_3.entry.js +18 -4
- package/dist/esm/ez-search.entry.js +613 -34
- package/dist/esm/ez-split-button.entry.js +162 -0
- package/dist/esm/ez-split-item.entry.js +20 -2
- package/dist/esm/ez-split-panel.entry.js +52 -15
- package/dist/esm/ez-time-input.entry.js +1 -1
- package/dist/esm/ez-toast.entry.js +1 -1
- package/dist/esm/ezui.js +1 -1
- package/dist/esm/filter-column.entry.js +16 -5
- package/dist/esm/index-baa5e267.js +10 -10
- package/dist/esm/loader.js +1 -1
- package/dist/ezui/ezui.esm.js +1 -1
- package/dist/ezui/p-2eb8f73b.entry.js +1 -0
- package/dist/ezui/p-3faa2b46.entry.js +1 -0
- package/dist/ezui/p-58fae29b.entry.js +1 -0
- package/dist/ezui/{p-40f72de4.entry.js → p-784fe207.entry.js} +1 -1
- package/dist/ezui/p-7a636dfc.entry.js +1 -0
- package/dist/ezui/p-7af81663.entry.js +1 -0
- package/dist/ezui/p-7bc07c31.entry.js +1 -0
- package/dist/ezui/p-8c82374d.entry.js +1 -0
- package/dist/ezui/{p-8becebf8.entry.js → p-8df1ca33.entry.js} +1 -1
- package/dist/ezui/{p-940ed30b.entry.js → p-8e7031a0.entry.js} +1 -1
- package/dist/ezui/p-91f626d3.entry.js +1 -0
- package/dist/ezui/{p-eb36f072.entry.js → p-99ead599.entry.js} +1 -1
- package/dist/ezui/{p-7eb3e1a5.js → p-9e11fc7b.js} +1 -1
- package/dist/ezui/p-9f1e89c9.entry.js +1 -0
- package/dist/ezui/p-af95cd16.entry.js +1 -0
- package/dist/ezui/{p-c0f1715f.entry.js → p-b567fa8c.entry.js} +1 -1
- package/dist/ezui/p-bae3d0aa.entry.js +1 -0
- package/dist/ezui/p-baf80b13.entry.js +1 -0
- package/dist/ezui/p-bf79aaa1.entry.js +1 -0
- package/dist/ezui/{p-93c3df4f.entry.js → p-d7d7423a.entry.js} +1 -1
- package/dist/ezui/p-db77a984.entry.js +1 -0
- package/dist/ezui/{p-9cad9b6e.entry.js → p-e85c48d7.entry.js} +1 -1
- package/dist/ezui/{p-844ee673.entry.js → p-fb5adf9e.entry.js} +2 -2
- package/dist/types/components/ez-card-item/ez-card-item.d.ts +4 -0
- package/dist/types/components/ez-combo-box/ez-combo-box.d.ts +1 -15
- package/dist/types/components/ez-form-view/ez-form-view.d.ts +3 -0
- package/dist/types/components/ez-grid/controller/EzGridController.d.ts +1 -0
- package/dist/types/components/ez-grid/controller/ag-grid/AgGridController.d.ts +2 -0
- package/dist/types/components/ez-grid/controller/ag-grid/DataSource.d.ts +2 -1
- package/dist/types/components/ez-grid/controller/ag-grid/DataSourceInterceptor.d.ts +8 -0
- package/dist/types/components/ez-grid/controller/ag-grid/components/EzGridCustomHeader.d.ts +1 -1
- package/dist/types/components/ez-grid/ez-grid.d.ts +17 -2
- package/dist/types/components/ez-grid/subcomponents/filter-column.d.ts +4 -1
- package/dist/types/components/ez-guide-navigator/interfaces/IGuideItem.d.ts +0 -1
- package/dist/types/components/ez-modal-container/ez-modal-container.d.ts +1 -0
- package/dist/types/components/ez-multi-selection-list/ez-multi-selection-list.d.ts +0 -1
- package/dist/types/components/ez-popup/ez-popup.d.ts +6 -1
- package/dist/types/components/ez-search/ez-search.d.ts +100 -10
- package/dist/types/components/ez-split-button/ez-split-button.d.ts +92 -0
- package/dist/types/components/ez-split-button/test/dropdownItems.d.ts +2 -0
- package/dist/types/components/ez-split-panel/ez-split-panel.d.ts +28 -0
- package/dist/types/components/ez-split-panel/structure/item/ez-split-item.d.ts +27 -0
- package/dist/types/components/ez-tree/interfaces/ITreeItem.d.ts +3 -1
- package/dist/types/components/ez-tree/interfaces/ITreeItemBadge.d.ts +6 -0
- package/dist/types/components/ez-tree/subcomponents/TreeItem.d.ts +0 -1
- package/dist/types/components.d.ts +182 -21
- package/dist/types/utils/CSSVarsUtils.d.ts +1 -0
- package/dist/types/utils/form/test/DataBinder.test.d.ts +1 -0
- package/dist/types/utils/interfaces/AbstractFieldMetadata.d.ts +2 -1
- package/package.json +5 -5
- package/react/components.d.ts +1 -0
- package/react/components.js +1 -0
- package/react/components.js.map +1 -1
- package/dist/cjs/ez-card-item.cjs.entry.js +0 -52
- package/dist/cjs/ez-filter-input_2.cjs.entry.js +0 -137
- package/dist/collection/components/ez-grid/controller/ag-grid/AgGridUtils.js +0 -8
- package/dist/esm/ez-card-item.entry.js +0 -48
- package/dist/esm/ez-filter-input_2.entry.js +0 -132
- package/dist/ezui/p-05f5a778.entry.js +0 -1
- package/dist/ezui/p-13dbad96.entry.js +0 -1
- package/dist/ezui/p-24d3fede.entry.js +0 -1
- package/dist/ezui/p-51c5e071.entry.js +0 -1
- package/dist/ezui/p-5613fe63.entry.js +0 -1
- package/dist/ezui/p-596634e9.entry.js +0 -1
- package/dist/ezui/p-5d692ed1.entry.js +0 -1
- package/dist/ezui/p-5d86cca9.entry.js +0 -1
- package/dist/ezui/p-60848ef6.entry.js +0 -1
- package/dist/ezui/p-a08b309b.entry.js +0 -1
- package/dist/ezui/p-a32aaac6.entry.js +0 -1
- package/dist/ezui/p-a5ac7151.entry.js +0 -1
- package/dist/ezui/p-af15c277.entry.js +0 -1
- package/dist/ezui/p-d6ffe679.entry.js +0 -1
- package/dist/types/components/ez-grid/controller/ag-grid/AgGridUtils.d.ts +0 -1
|
@@ -66,6 +66,19 @@ class CSSVarsUtils {
|
|
|
66
66
|
});
|
|
67
67
|
}
|
|
68
68
|
}
|
|
69
|
+
static applyVarsGrid(host, child) {
|
|
70
|
+
if (child) {
|
|
71
|
+
[
|
|
72
|
+
"--ez-grid--min-height",
|
|
73
|
+
"--snk-grid-min-height",
|
|
74
|
+
].forEach(prop => {
|
|
75
|
+
const propValue = getComputedStyle(host).getPropertyValue(prop);
|
|
76
|
+
if (propValue !== null && propValue !== undefined) {
|
|
77
|
+
child.style.setProperty(prop, propValue);
|
|
78
|
+
}
|
|
79
|
+
});
|
|
80
|
+
}
|
|
81
|
+
}
|
|
69
82
|
static applyIfExists(host, element, varName) {
|
|
70
83
|
const prop = getComputedStyle(host).getPropertyValue(varName);
|
|
71
84
|
if (prop) {
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
const index = require('./index-a7b0c73d.js');
|
|
6
6
|
const core = require('@sankhyalabs/core');
|
|
7
7
|
require('./ApplicationUtils-c9d1205c.js');
|
|
8
|
-
const CSSVarsUtils = require('./CSSVarsUtils-
|
|
8
|
+
const CSSVarsUtils = require('./CSSVarsUtils-10c9d5b4.js');
|
|
9
9
|
require('./DialogType-2114c337.js');
|
|
10
10
|
require('./CheckMode-ecb90b87.js');
|
|
11
11
|
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
const index = require('./index-a7b0c73d.js');
|
|
6
6
|
const core = require('@sankhyalabs/core');
|
|
7
7
|
|
|
8
|
-
const ezAlertListCss = ":host {\n display: flex;\n\n /* Alert List */\n \n /*@doc Define a largura da lista minimizado */\n --ez-alert-list__container--width: 680px;\n /*@doc Define a altura da lista minimizado */\n --ez-alert-list__container--height: 220px;\n \n /*@doc Define a largura da lista maximizada */\n --ez-alert-list__container--width--expanded: 920px;\n /*@doc Define a altura da lista maximizada */\n --ez-alert-list__container--height--expanded: 540px;\n\n /* Title */\n /*@doc Define a fonte do título do componente */\n --ez-alert-list__title--font-family: var(--font-pattern, \"Roboto\");\n /*@doc Define o tamanho da fonte do título do popup.*/\n --ez-alert-list__title--font-size: var(--title--large, 20px);\n /*@doc Define a cor da fonte do título do popup.*/\n --ez-alert-list__title--color: var(--title--primary, #2b3a54);\n /*@doc Define o peso da fonte do título do popup.*/\n --ez-alert-list__title--font-weight: var(--text-weight--extra-large, 700);\n\n /* @doc Define a borda inferior do item da lista. */\n --ez-list__item--border-bottom: var(--border--small, 1px solid);\n\n /* @doc Define a cor da borda inferior do item da lista. */\n --ez-list__item--border-bottom-color: var(--color--strokes, #DCE0E8);\n\n /* @doc Define o tipo da quebra de linha do item da lista. */\n --ez-list__item--white-space: break-space;\n}\n\n.alert-list__content {\n display: flex;\n flex-direction: column;\n \n gap: var(--space--xs);\n margin: var(--space--large, 24px);\n width: 100%;\n}\n\n.alert-list__container {\n z-index: var(--
|
|
8
|
+
const ezAlertListCss = ":host {\n display: flex;\n\n /* Alert List */\n \n /*@doc Define a largura da lista minimizado */\n --ez-alert-list__container--width: 680px;\n /*@doc Define a altura da lista minimizado */\n --ez-alert-list__container--height: 220px;\n \n /*@doc Define a largura da lista maximizada */\n --ez-alert-list__container--width--expanded: 920px;\n /*@doc Define a altura da lista maximizada */\n --ez-alert-list__container--height--expanded: 540px;\n\n /* Title */\n /*@doc Define a fonte do título do componente */\n --ez-alert-list__title--font-family: var(--font-pattern, \"Roboto\");\n /*@doc Define o tamanho da fonte do título do popup.*/\n --ez-alert-list__title--font-size: var(--title--large, 20px);\n /*@doc Define a cor da fonte do título do popup.*/\n --ez-alert-list__title--color: var(--title--primary, #2b3a54);\n /*@doc Define o peso da fonte do título do popup.*/\n --ez-alert-list__title--font-weight: var(--text-weight--extra-large, 700);\n\n /* @doc Define a borda inferior do item da lista. */\n --ez-list__item--border-bottom: var(--border--small, 1px solid);\n\n /* @doc Define a cor da borda inferior do item da lista. */\n --ez-list__item--border-bottom-color: var(--color--strokes, #DCE0E8);\n\n /* @doc Define o tipo da quebra de linha do item da lista. */\n --ez-list__item--white-space: break-space;\n}\n\n.alert-list__content {\n display: flex;\n flex-direction: column;\n \n gap: var(--space--xs);\n margin: var(--space--large, 24px);\n width: 100%;\n}\n\n.alert-list__container {\n z-index: var(--ez-elevation--8, 8);\n display: flex;\n height: var(--ez-alert-list__container--height);\n width: var(--ez-alert-list__container--width);\n border-radius: var(--border--radius-medium);\n background-color: var(--background--xlight);\n box-shadow: var(--shadow--medium);\n\n &.expanded {\n height: var(--ez-alert-list__container--height--expanded);\n width: var(--ez-alert-list__container--width--expanded);\n }\n\n @media (max-height: 640px) {\n max-height: calc(100vh - var(--space--3xl));\n } \n}\n\n.alert-list__header {\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n\n.alert-list__title {\n font-family: var(--ez-alert-list__title--font-family);\n font-size: var(--ez-alert-list__title--font-size);\n font-weight: var(--ez-alert-list__title--font-weight);\n color: var(--ez-alert-list__title--color);\n}\n\n.alert-list__header__buttons {\n display: flex;\n gap: var(--space--xs);\n}\n\n.alert-list__expandable-content {\n overflow-y: auto;\n scrollbar-width: thin;\n}\n\n";
|
|
9
9
|
|
|
10
10
|
const EzAlertList = class {
|
|
11
11
|
constructor(hostRef) {
|
|
@@ -0,0 +1,183 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
const index = require('./index-a7b0c73d.js');
|
|
6
|
+
const core = require('@sankhyalabs/core');
|
|
7
|
+
const CSSVarsUtils = require('./CSSVarsUtils-10c9d5b4.js');
|
|
8
|
+
|
|
9
|
+
const ezCardItemCss = ":host {\n /*@doc Define o tamanho da fonte do componente.*/\n --ez-card-item--font-size: var(--text--medium, 14px);\n\n /*@doc Define a família da fonte do componente.*/\n --ez-card-item--font-family: var(--font-pattern, Arial);\n\n /*@doc Define o peso da fonte do componente.*/\n --ez-card-item--font-weight: var(--text-weight--medium, 400);\n\n /*@doc Define o peso da fonte do title do componente.*/\n --ez-card-item--font-weight-large: var(--text-weight--large, 600);\n\n /*@doc Define a cor da fonte do componente.*/\n --ez-card-item--color: var(--title--primary, #2B3A54);\n\n /*@doc Define a cor da fonte da key do componente.*/\n --ez-card-item__key--color: var(--text--primary, #626e82);\n\n /*@doc Define a cor da fonte do label do detalhe do componente.*/\n --ez-card-item__detail-label--color: var(--text--secondary, #A2ABB9);\n\n /*@doc Define o espaçamento inferior dos detalhes do componente.*/\n --ez-card-item__detail--padding-bottom: var(--space--extra-small, 3px);\n\n /*@doc Define o espaçamento inferior do title do componente.*/\n --ez-card-item__title--padding-bottom: var(--space--extra-small, 3px);\n\n /*@doc Define a cor do highlight / marcação nos textos do componente.*/\n --ez-card-item__highlight--color: var(--color--primary-300, #E2F4EF);\n\n width: 100%;\n display: flex;\n cursor: pointer;\n}\n\n.card-item {\n display: flex;\n flex-direction: column;\n width: 100%;\n cursor: pointer;\n padding: 12px;\n z-index: 0;\n position: relative;\n container-type: inline-size;\n container-name: box;\n white-space: pre-line;\n}\n\n.card-item:hover {\n background: #F0F3F7;\n border-radius: 12px;\n}\n\n.card-item__title {\n display: flex;\n align-items: center;\n line-height: 18px;\n cursor: pointer;\n\n /*public*/\n font-size: var(--ez-card-item--font-size);\n font-family: var(--ez-card-item--font-family);\n font-weight: var(--ez-card-item--font-weight-large);\n color: var(--ez-card-item--color);\n padding-bottom: var(--ez-card-item__title--padding-bottom);\n gap: var(--space--small, 6px);\n}\n\n.card-item__key {\n /*public*/\n color: var(--ez-card-item__key--color);\n}\n\n.card-item__details {\n display: flex;\n flex-direction: column;\n cursor: pointer;\n justify-content: space-between;\n width: 100%;\n}\n\n.card-item__details-container__left {\n white-space: pre-line;\n cursor: pointer;\n width: 50%;\n}\n\n.card-item__details-container__right {\n white-space: pre-line;\n width: 50%;\n cursor: pointer;\n}\n\n.card-item__detail:not(:last-child) {\n cursor: pointer;\n white-space: pre-line;\n\n /*public*/\n padding-bottom: var(--ez-card-item__detail--padding-bottom);\n}\n\n.card-item__detail-label {\n cursor: pointer;\n\n /*public*/\n font-size: var(--ez-card-item--font-size);\n font-family: var(--ez-card-item--font-family);\n font-weight: var(--ez-card-item--font-weight);\n color: var(--ez-card-item__detail-label--color);\n}\n\n.card-item__detail-value {\n cursor: pointer;\n line-break: anywhere;\n\n /*public*/\n font-size: var(--ez-card-item--font-size);\n font-family: var(--ez-card-item--font-family);\n font-weight: var(--ez-card-item--font-weight);\n color: var(--ez-card-item--color);\n}\n\n.card-item__highlight {\n position: relative;\n border-radius: 8px;\n z-index: -1;\n\n /*public*/\n background-color: var(--ez-card-item__highlight--color);\n outline: 2px solid var(--ez-card-item__highlight--color);\n box-shadow: -4px 0px 0px 0px var(--ez-card-item__highlight--color), \n 4px 0px 0px 0px var(--ez-card-item__highlight--color);\n}\n\n.card-item__content{\n display: flex;\n align-items: center;\n}\n\n.card-item__details-container{\n display: flex;\n}\n\n.card-item__details-slot{\n margin-left: auto;\n}\n\n@container box (max-width: 550px) {\n .card-item__details {\n flex-direction: column;\n }\n\n .card-item__details-container__left {\n width: 100%;\n }\n \n .card-item__details-container__right {\n width: 100%;\n }\n}\n\n@container box (max-width: 200px) {\n .card-item__title {\n font-size: 10px;\n }\n\n .card-item__detail-label {\n font-size: 10px;\n }\n\n .card-item__detail-value {\n font-size: 10px;\n }\n\n}";
|
|
10
|
+
|
|
11
|
+
const EzCardItem = class {
|
|
12
|
+
constructor(hostRef) {
|
|
13
|
+
index.registerInstance(this, hostRef);
|
|
14
|
+
this.ezClick = index.createEvent(this, "ezClick", 7);
|
|
15
|
+
this.item = undefined;
|
|
16
|
+
this.enableKey = true;
|
|
17
|
+
}
|
|
18
|
+
componentWillRender() {
|
|
19
|
+
this.createDetailList();
|
|
20
|
+
}
|
|
21
|
+
componentDidLoad() {
|
|
22
|
+
var _a, _b;
|
|
23
|
+
const dataInfo = { id: core.StringUtils.toCamelCase(((_a = this.item) === null || _a === void 0 ? void 0 : _a.key) || ((_b = this.item) === null || _b === void 0 ? void 0 : _b.title) || "") };
|
|
24
|
+
core.ElementIDUtils.addIDInfo(this._element, null, dataInfo);
|
|
25
|
+
}
|
|
26
|
+
createDetailList() {
|
|
27
|
+
var _a, _b, _c;
|
|
28
|
+
this._details = { detailsLeft: [], detailsRight: [] };
|
|
29
|
+
let cont = 0;
|
|
30
|
+
if ((_a = this.item) === null || _a === void 0 ? void 0 : _a.details) {
|
|
31
|
+
for (const attribute in this.item.details) {
|
|
32
|
+
cont < 3 ?
|
|
33
|
+
this._details.detailsLeft.push({ label: attribute, value: (_b = this.item.details[attribute]) === null || _b === void 0 ? void 0 : _b.toString() }) :
|
|
34
|
+
this._details.detailsRight.push({ label: attribute, value: (_c = this.item.details[attribute]) === null || _c === void 0 ? void 0 : _c.toString() });
|
|
35
|
+
cont++;
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
buildDetailContent(detail) {
|
|
40
|
+
return index.h("div", { class: "card-item__detail" }, index.h("label", { class: "card-item__detail-label" }, detail.label), ": ", index.h("label", { class: "card-item__detail-value", innerHTML: detail.value }));
|
|
41
|
+
}
|
|
42
|
+
render() {
|
|
43
|
+
return (index.h(index.Host, null, this.item &&
|
|
44
|
+
index.h("div", { class: "card-item", onClick: () => { this.ezClick.emit(this.item); } }, index.h("div", { class: "ez-row card-item__content" }, index.h("div", { class: "ez-col ez-col--sd-11 card-item__details" }, index.h("label", { class: "card-item__title" }, this.enableKey && (index.h("span", { class: "card-item__key", innerHTML: this.item.key })), index.h("span", { innerHTML: this.item.title })), index.h("div", { class: "card-item__details-container" }, index.h("div", { class: "card-item__details-container__left" }, this._details.detailsLeft.map(detail => {
|
|
45
|
+
return this.buildDetailContent(detail);
|
|
46
|
+
})), index.h("div", { class: "card-item__details-container__right" }, this._details.detailsRight.map(detail => {
|
|
47
|
+
return this.buildDetailContent(detail);
|
|
48
|
+
})))), index.h("div", { class: "ez-col ez-col--sd-1 card-item__details-slot" }, index.h("slot", { name: "rightSlot" }))))));
|
|
49
|
+
}
|
|
50
|
+
get _element() { return index.getElement(this); }
|
|
51
|
+
};
|
|
52
|
+
EzCardItem.style = ezCardItemCss;
|
|
53
|
+
|
|
54
|
+
const ezFilterInputCss = ":host{display:block;width:100%}";
|
|
55
|
+
|
|
56
|
+
const EzFilterInput = class {
|
|
57
|
+
constructor(hostRef) {
|
|
58
|
+
index.registerInstance(this, hostRef);
|
|
59
|
+
this.ezChange = index.createEvent(this, "ezChange", 7);
|
|
60
|
+
this.ezSearching = index.createEvent(this, "ezSearching", 7);
|
|
61
|
+
this.ezFocusIn = index.createEvent(this, "ezFocusIn", 7);
|
|
62
|
+
this._searchingText = "";
|
|
63
|
+
this.handleFocus = () => {
|
|
64
|
+
if (this._searchingText === "") {
|
|
65
|
+
this._textInput.value = "";
|
|
66
|
+
}
|
|
67
|
+
else {
|
|
68
|
+
this._textInput.value = this._searchingText;
|
|
69
|
+
}
|
|
70
|
+
this.ezFocusIn.emit();
|
|
71
|
+
};
|
|
72
|
+
this.label = undefined;
|
|
73
|
+
this.value = undefined;
|
|
74
|
+
this.enabled = true;
|
|
75
|
+
this.errorMessage = undefined;
|
|
76
|
+
this.restrict = undefined;
|
|
77
|
+
this.mode = "regular";
|
|
78
|
+
this.asyncSearch = false;
|
|
79
|
+
this.canShowError = true;
|
|
80
|
+
}
|
|
81
|
+
observeLabel() {
|
|
82
|
+
if (this._textInput) {
|
|
83
|
+
this._textInput.label = this.label;
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
observeErrorMessage() {
|
|
87
|
+
if (this._textInput) {
|
|
88
|
+
this._textInput.errorMessage = this.errorMessage;
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
observeValue(newValue, oldValue) {
|
|
92
|
+
if (this._textInput && newValue != oldValue) {
|
|
93
|
+
this._textInput.value = newValue;
|
|
94
|
+
this.ezChange.emit(newValue);
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
/**
|
|
98
|
+
* Aplica o foco no campo.
|
|
99
|
+
*/
|
|
100
|
+
async setFocus() {
|
|
101
|
+
this._textInput.setFocus();
|
|
102
|
+
}
|
|
103
|
+
/**
|
|
104
|
+
* Remove o foco do campo.
|
|
105
|
+
*/
|
|
106
|
+
async setBlur() {
|
|
107
|
+
this._textInput.setBlur();
|
|
108
|
+
}
|
|
109
|
+
/**
|
|
110
|
+
* Retorna se o conteúdo é inválido.
|
|
111
|
+
*/
|
|
112
|
+
async isInvalid() {
|
|
113
|
+
return typeof this.errorMessage === "string" && this.errorMessage.trim() !== "";
|
|
114
|
+
}
|
|
115
|
+
/**
|
|
116
|
+
* Método responsável por setar um novo valor ao campo.
|
|
117
|
+
*/
|
|
118
|
+
async setValue(newValue) {
|
|
119
|
+
if (!this.asyncSearch || this._textInput == undefined) {
|
|
120
|
+
return;
|
|
121
|
+
}
|
|
122
|
+
if (newValue !== this.value) {
|
|
123
|
+
this.value = newValue;
|
|
124
|
+
this._searchingText = "";
|
|
125
|
+
}
|
|
126
|
+
else {
|
|
127
|
+
this._textInput.value = newValue;
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
/**
|
|
131
|
+
* Método responsável por resetar o valor do campo para o ultimo valor inputado.
|
|
132
|
+
*/
|
|
133
|
+
async endSearch() {
|
|
134
|
+
if (!this.asyncSearch || this._textInput == undefined) {
|
|
135
|
+
return;
|
|
136
|
+
}
|
|
137
|
+
if (this._textInput.value !== this.value) {
|
|
138
|
+
this._textInput.value = this.value;
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
handleChange(evt) {
|
|
142
|
+
const newValue = evt.detail;
|
|
143
|
+
this.errorMessage = "";
|
|
144
|
+
if (this.asyncSearch) {
|
|
145
|
+
this._searchingText = newValue;
|
|
146
|
+
this.ezSearching.emit(newValue);
|
|
147
|
+
}
|
|
148
|
+
else if (newValue !== this.value) {
|
|
149
|
+
this.value = newValue;
|
|
150
|
+
}
|
|
151
|
+
}
|
|
152
|
+
componentDidLoad() {
|
|
153
|
+
CSSVarsUtils.CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
|
|
154
|
+
}
|
|
155
|
+
render() {
|
|
156
|
+
core.ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
|
|
157
|
+
return (index.h("ez-text-input", { "data-element-id": core.ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, label: this.label, onEzChange: evt => this.handleChange(evt), value: this.value, enabled: this.enabled, errorMessage: this.errorMessage, restrict: this.restrict, mode: this.mode, onFocusin: this.handleFocus, canShowError: this.canShowError }, index.h("ez-icon", { slot: "leftIcon", iconName: "search" })));
|
|
158
|
+
}
|
|
159
|
+
get _elem() { return index.getElement(this); }
|
|
160
|
+
static get watchers() { return {
|
|
161
|
+
"label": ["observeLabel"],
|
|
162
|
+
"errorMessage": ["observeErrorMessage"],
|
|
163
|
+
"value": ["observeValue"]
|
|
164
|
+
}; }
|
|
165
|
+
};
|
|
166
|
+
EzFilterInput.style = ezFilterInputCss;
|
|
167
|
+
|
|
168
|
+
const multiSelectionBoxMessageCss = ".multi-selection__message{display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;min-height:320px;text-align:center}.multi-selection__text-message{margin-top:-30px;font-family:var(--font-pattern);font-size:var(--text--meduim);padding:var(--space-xs);color:var(--text--primary)}";
|
|
169
|
+
|
|
170
|
+
const MultiSelectionBoxMessage = class {
|
|
171
|
+
constructor(hostRef) {
|
|
172
|
+
index.registerInstance(this, hostRef);
|
|
173
|
+
this.message = undefined;
|
|
174
|
+
}
|
|
175
|
+
render() {
|
|
176
|
+
return (index.h("div", { class: "multi-selection__message" }, index.h("span", { class: "multi-selection__text-message" }, this.message)));
|
|
177
|
+
}
|
|
178
|
+
};
|
|
179
|
+
MultiSelectionBoxMessage.style = multiSelectionBoxMessageCss;
|
|
180
|
+
|
|
181
|
+
exports.ez_card_item = EzCardItem;
|
|
182
|
+
exports.ez_filter_input = EzFilterInput;
|
|
183
|
+
exports.multi_selection_box_message = MultiSelectionBoxMessage;
|
|
@@ -6,7 +6,7 @@ const index = require('./index-a7b0c73d.js');
|
|
|
6
6
|
const core = require('@sankhyalabs/core');
|
|
7
7
|
const CheckMode = require('./CheckMode-ecb90b87.js');
|
|
8
8
|
|
|
9
|
-
const ezCheckCss = ":host{--ez-check--box--width:20px;--ez-check--box--height:20px;--ez-check--width:calc(var(--ez-check--box--width) + var(--ez-check--outter-gap, 14px));--ez-check--height:calc(var(--ez-check--box--width) + var(--ez-check--outter-gap, 14px));--ez-check--border-radius:var(--border--radius-small);--ez-check--checked--background-color:var(--color--primary-200);--ez-check--focus--background-color:var(--color--strokes, #FFFFFF);--ez-check--hover--background-color:var(--background--medium);--ez-check--checked--disabled--background-color:var(--color--disable-secondary);--ez-check--border:var(--border--medium) var(--title--primary);--ez-check--disabled--border:var(--border--medium) var(--color--strokes);--ez-check--checked--border:var(--border--medium) var(--color--primary);--ez-check--checked--hover--background-color:var(--color--primary-200);--ez-check--checked--focus--background-color:var(--color--primary-300, #FFFFFF);--ez-check--check--image:url('data:image/svg+xml;utf8,<svg width=\"8\" height=\"7\" viewBox=\"0 0 8 7\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7.70002 0.398999L7.48502 0.207997C7.31524 0.0598858 7.09376 -0.0150438 6.86894 -0.000430025C6.64411 0.0141838 6.43419 0.117153 6.28502 0.285997L2.70002 4.332L1.61802 3.384C1.44837 3.23576 1.22697 3.16067 1.00214 3.17509C0.77732 3.18952 0.567332 3.2923 0.418019 3.461L0.229019 3.674C0.0752361 3.84797 -0.00437434 4.07521 0.00721192 4.30713C0.0187982 4.53904 0.120661 4.75722 0.291019 4.915L2.27402 6.762C2.35832 6.8432 2.45842 6.90618 2.56811 6.94702C2.67779 6.98787 2.79471 7.00571 2.91159 6.99942C3.02846 6.99314 3.14279 6.96287 3.24747 6.91049C3.35214 6.85812 3.44492 6.78477 3.52002 6.695L7.79102 1.638C7.94063 1.46048 8.01486 1.23149 7.99786 0.999963C7.98085 0.768436 7.87396 0.552749 7.70002 0.398999Z\"/></svg>');--ez-check--indeterminate--image:url('data:image/svg+xml;utf8,<svg width=\"10\" height=\"2\" viewBox=\"0 0 10 2\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m 1,0 h 8 c 0.554,0 1,0.446 1,1 0,0.554 -0.446,1 -1,1 H 1 C 0.446,2 0,1.554 0,1 0,0.446 0.446,0 1,0 Z\" /></svg>');--ez-check--check--background-color:var(--color--primary);--ez-check--check--disabled--background-color:var(--color--strokes);--ez-switch--slider--width:34px;--ez-switch--slider--height:14px;--ez-switch--pin--width:19px;--ez-switch--pin--height:19px;--ez-switch--focus--width:32px;--ez-switch--focus--height:32px;--ez-switch--background-color:var(--color--strokes);--ez-switch--disabled--background-color:var(--color--disable-secondary);--ez-switch--disabled--checked--background-color:var(--color--primary-300);--ez-switch--checked--background-color:var(--color--primary);--ez-switch--pin--background-color:var(--background--xlight);--ez-switch--pin--disabled--background-color:var(--color--disable-primary);--ez-switch--pin--checked--background-color:var(--background--xlight);--ez-switch--pin--checked--disabled--background-color:#E8F7F4;--ez-switch--pin--focus--background-color:var(--text--disable);--ez-switch--pin--checked--focus--background-color:var(--color--primary);--ez-switch--pin--border-color:var(--text--primary);--ez-switch--pin--disabled--border-color:var(--text--secondary);--ez-check--label--font-size:var(--text--medium, 14px);--ez-check--label--font-family:var(--font-pattern, Arial);--ez-check--label--color:var(--title--primary, #000);--ez-check--label--disabled--color:var(--text--disable, #AFB6C0);display:flex;align-items:center;margin:0}input.regular-mode{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;box-sizing:border-box;-webkit-appearance:none;appearance:none;cursor:pointer;border-radius:50%;position:relative;width:var(--ez-check--width);height:var(--ez-check--height)}input.compact{margin-right:0px}input.regular-mode:enabled:hover{background-color:var(--ez-check--hover--background-color)}input.regular-mode:enabled:focus{outline:none;background-color:var(--ez-check--focus--background-color)}input.regular-mode:disabled{cursor:auto;background:none}input.regular-mode::before{box-sizing:border-box;content:\"\";display:block;width:var(--ez-check--box--width);height:var(--ez-check--box--height);border-radius:var(--ez-check--border-radius);border:var(--ez-check--border)}input.regular-mode:disabled::before{border:var(--ez-check--disabled--border)}input.regular-mode:checked:enabled:hover,input.regular-mode:indeterminate:enabled:hover{background-color:var(--ez-check--checked--hover--background-color)}input.regular-mode:checked:enabled:focus,input.regular-mode:indeterminate:enabled:focus{background-color:var(--ez-check--checked--focus--background-color)}input.regular-mode:checked::before,input.regular-mode:indeterminate::before{border:var(--ez-check--checked--border);background-color:var(--ez-check--checked--background-color)}input.regular-mode:disabled:before{border:var(--ez-check--disabled--border);background-color:var(--ez-check--checked--disabled--background-color)}input.regular-mode:checked::after,input.regular-mode:indeterminate:after{display:flex;position:absolute;content:\"\";background-color:var(--ez-check--check--background-color);width:8px;height:7px;-webkit-mask-image:var(--ez-check--check--image);mask-image:var(--ez-check--check--image)}input.regular-mode:indeterminate:after{display:flex;position:absolute;content:\"\";background-color:var(--ez-check--check--background-color);width:10px;height:2px;-webkit-mask-image:var(--ez-check--indeterminate--image);mask-image:var(--ez-check--indeterminate--image)}input.regular-mode:checked:disabled::after,input.regular-mode:indeterminate:disabled::after{background-color:var(--ez-check--check--disabled--background-color)}input.switch-mode{flex-shrink:0;-webkit-appearance:none;appearance:none;position:relative;outline:none;cursor:pointer;border-radius:20px;border:var(--border--small, 1px solid) var(--ez-switch--pin--border-color, #626e82);transition:background-color var(--transition);width:var(--ez-switch--slider--width);height:var(--ez-switch--slider--height);background-color:var(--ez-switch--background-color)}input.switch-mode:disabled{background-color:var(--ez-switch--disabled--background-color);border:var(--border--small, 1px solid) var(--ez-switch--pin--disabled--border-color, #a2abb9)}input.switch-mode:checked:disabled{background-color:var(--ez-switch--disabled--checked--background-color)}input.switch-mode::after{content:\"\";display:block;position:absolute;box-shadow:var(--shadow);transition:transform var(--transition);transition:background-color var(--transition);transition:border-color var(--transition);transform:translateX(-2px) translateY(-4px);border-radius:50%;border:var(--border--small, 1px solid) var(--ez-switch--pin--border-color, #626e82);width:var(--ez-switch--pin--width);height:var(--ez-switch--pin--height);background-color:var(--ez-switch--pin--background-color)}input.switch-mode:disabled::after{background-color:var(--ez-switch--pin--disabled--background-color);border:var(--border--small, 1px solid) var(--ez-switch--pin--disabled--border-color, #a2abb9)}input.switch-mode:checked{transition:background-color var(--transition), border var(--transition);background-color:var(--ez-switch--checked--background-color);border:var(--border--small, 1px solid) var(--color--primary, #008561)}input.switch-mode::before{display:block;content:\"\";display:block;position:absolute;border-radius:50%;opacity:0;width:var(--ez-switch--focus--width);height:var(--ez-switch--focus--height);top:calc((var(--ez-switch--slider--height) - var(--ez-switch--focus--height)) / 2);left:calc((var(--ez-switch--pin--width) - var(--ez-switch--focus--width) - 2px) / 2);background-color:var(--ez-switch--pin--focus--background-color)}input.switch-mode:focus::before{opacity:0.24;transition:opacity var(--transition)}input.switch-mode:checked:focus::before{background-color:var(--ez-switch--pin--checked--focus--background-color);transform:translateX(calc(var(--ez-switch--slider--width) - var(--ez-switch--pin--width) + 2px))}input.switch-mode:checked::after{transition:transform var(--transition);transition:background-color var(--transition);transition:border-color var(--transition);transform:translateX(calc(var(--ez-switch--slider--width) - var(--ez-switch--pin--width))) translateY(-4px);box-shadow:var(--shadow);background-color:var(--ez-switch--pin--checked--background-color);border:var(--border--small, 1px solid) var(--color--primary, #008561)}input.switch-mode:checked:disabled::after{background-color:var(--ez-switch--pin--checked--disabled--background-color)}.label{flex-shrink:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ez-check--label--color);font-size:var(--ez-check--label--font-size);font-family:var(--ez-check--label--font-family);cursor:default;width:inherit}.label--disabled{color:var(--ez-check--label--disabled--color)}.label--padding{padding-left:var(--space--small)}";
|
|
9
|
+
const ezCheckCss = ":host{--ez-check--box--width:20px;--ez-check--box--height:20px;--ez-check--width:calc(var(--ez-check--box--width) + var(--ez-check--outter-gap, 14px));--ez-check--height:calc(var(--ez-check--box--width) + var(--ez-check--outter-gap, 14px));--ez-check--border-radius:var(--border--radius-small);--ez-check--checked--background-color:var(--color--primary-200);--ez-check--focus--background-color:var(--color--strokes, #FFFFFF);--ez-check--hover--background-color:var(--background--medium);--ez-check--checked--disabled--background-color:var(--color--disable-secondary);--ez-check--border:var(--border--medium) var(--title--primary);--ez-check--disabled--border:var(--border--medium) var(--color--strokes);--ez-check--checked--border:var(--border--medium) var(--color--primary);--ez-check--checked--hover--background-color:var(--color--primary-200);--ez-check--checked--focus--background-color:var(--color--primary-300, #FFFFFF);--ez-check--check--image:url('data:image/svg+xml;utf8,<svg width=\"8\" height=\"7\" viewBox=\"0 0 8 7\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7.70002 0.398999L7.48502 0.207997C7.31524 0.0598858 7.09376 -0.0150438 6.86894 -0.000430025C6.64411 0.0141838 6.43419 0.117153 6.28502 0.285997L2.70002 4.332L1.61802 3.384C1.44837 3.23576 1.22697 3.16067 1.00214 3.17509C0.77732 3.18952 0.567332 3.2923 0.418019 3.461L0.229019 3.674C0.0752361 3.84797 -0.00437434 4.07521 0.00721192 4.30713C0.0187982 4.53904 0.120661 4.75722 0.291019 4.915L2.27402 6.762C2.35832 6.8432 2.45842 6.90618 2.56811 6.94702C2.67779 6.98787 2.79471 7.00571 2.91159 6.99942C3.02846 6.99314 3.14279 6.96287 3.24747 6.91049C3.35214 6.85812 3.44492 6.78477 3.52002 6.695L7.79102 1.638C7.94063 1.46048 8.01486 1.23149 7.99786 0.999963C7.98085 0.768436 7.87396 0.552749 7.70002 0.398999Z\"/></svg>');--ez-check--indeterminate--image:url('data:image/svg+xml;utf8,<svg width=\"10\" height=\"2\" viewBox=\"0 0 10 2\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m 1,0 h 8 c 0.554,0 1,0.446 1,1 0,0.554 -0.446,1 -1,1 H 1 C 0.446,2 0,1.554 0,1 0,0.446 0.446,0 1,0 Z\" /></svg>');--ez-check--check--background-color:var(--color--primary);--ez-check--check--disabled--background-color:var(--color--strokes);--ez-switch--slider--width:34px;--ez-switch--slider--height:14px;--ez-switch--pin--width:19px;--ez-switch--pin--height:19px;--ez-switch--focus--width:32px;--ez-switch--focus--height:32px;--ez-switch--background-color:var(--color--strokes);--ez-switch--disabled--background-color:var(--color--disable-secondary);--ez-switch--disabled--checked--background-color:var(--color--primary-300);--ez-switch--checked--background-color:var(--color--primary);--ez-switch--pin--background-color:var(--background--xlight);--ez-switch--pin--disabled--background-color:var(--color--disable-primary);--ez-switch--pin--checked--background-color:var(--background--xlight);--ez-switch--pin--checked--disabled--background-color:#E8F7F4;--ez-switch--pin--focus--background-color:var(--text--disable);--ez-switch--pin--checked--focus--background-color:var(--color--primary);--ez-switch--pin--border-color:var(--text--primary);--ez-switch--pin--disabled--border-color:var(--text--secondary);--ez-check--label--font-size:var(--text--medium, 14px);--ez-check--label--font-family:var(--font-pattern, Arial);--ez-check--label--color:var(--title--primary, #000);--ez-check--label--disabled--color:var(--text--disable, #AFB6C0);display:flex;align-items:center;margin:0;max-width:100%}input.regular-mode{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;box-sizing:border-box;-webkit-appearance:none;appearance:none;cursor:pointer;border-radius:50%;position:relative;width:var(--ez-check--width);height:var(--ez-check--height)}input.compact{margin-right:0px}input.regular-mode:enabled:hover{background-color:var(--ez-check--hover--background-color)}input.regular-mode:enabled:focus{outline:none;background-color:var(--ez-check--focus--background-color)}input.regular-mode:disabled{cursor:auto;background:none}input.regular-mode::before{box-sizing:border-box;content:\"\";display:block;width:var(--ez-check--box--width);height:var(--ez-check--box--height);border-radius:var(--ez-check--border-radius);border:var(--ez-check--border)}input.regular-mode:disabled::before{border:var(--ez-check--disabled--border)}input.regular-mode:checked:enabled:hover,input.regular-mode:indeterminate:enabled:hover{background-color:var(--ez-check--checked--hover--background-color)}input.regular-mode:checked:enabled:focus,input.regular-mode:indeterminate:enabled:focus{background-color:var(--ez-check--checked--focus--background-color)}input.regular-mode:checked::before,input.regular-mode:indeterminate::before{border:var(--ez-check--checked--border);background-color:var(--ez-check--checked--background-color)}input.regular-mode:disabled:before{border:var(--ez-check--disabled--border);background-color:var(--ez-check--checked--disabled--background-color)}input.regular-mode:checked::after,input.regular-mode:indeterminate:after{display:flex;position:absolute;content:\"\";background-color:var(--ez-check--check--background-color);width:8px;height:7px;-webkit-mask-image:var(--ez-check--check--image);mask-image:var(--ez-check--check--image)}input.regular-mode:indeterminate:after{display:flex;position:absolute;content:\"\";background-color:var(--ez-check--check--background-color);width:10px;height:2px;-webkit-mask-image:var(--ez-check--indeterminate--image);mask-image:var(--ez-check--indeterminate--image)}input.regular-mode:checked:disabled::after,input.regular-mode:indeterminate:disabled::after{background-color:var(--ez-check--check--disabled--background-color)}input.switch-mode{flex-shrink:0;-webkit-appearance:none;appearance:none;position:relative;outline:none;cursor:pointer;border-radius:20px;border:var(--border--small, 1px solid) var(--ez-switch--pin--border-color, #626e82);transition:background-color var(--transition);width:var(--ez-switch--slider--width);height:var(--ez-switch--slider--height);background-color:var(--ez-switch--background-color)}input.switch-mode:disabled{background-color:var(--ez-switch--disabled--background-color);border:var(--border--small, 1px solid) var(--ez-switch--pin--disabled--border-color, #a2abb9)}input.switch-mode:checked:disabled{background-color:var(--ez-switch--disabled--checked--background-color)}input.switch-mode::after{content:\"\";display:block;position:absolute;box-shadow:var(--shadow);transition:transform var(--transition);transition:background-color var(--transition);transition:border-color var(--transition);transform:translateX(-2px) translateY(-4px);border-radius:50%;border:var(--border--small, 1px solid) var(--ez-switch--pin--border-color, #626e82);width:var(--ez-switch--pin--width);height:var(--ez-switch--pin--height);background-color:var(--ez-switch--pin--background-color)}input.switch-mode:disabled::after{background-color:var(--ez-switch--pin--disabled--background-color);border:var(--border--small, 1px solid) var(--ez-switch--pin--disabled--border-color, #a2abb9)}input.switch-mode:checked{transition:background-color var(--transition), border var(--transition);background-color:var(--ez-switch--checked--background-color);border:var(--border--small, 1px solid) var(--color--primary, #008561)}input.switch-mode::before{display:block;content:\"\";display:block;position:absolute;border-radius:50%;opacity:0;width:var(--ez-switch--focus--width);height:var(--ez-switch--focus--height);top:calc((var(--ez-switch--slider--height) - var(--ez-switch--focus--height)) / 2);left:calc((var(--ez-switch--pin--width) - var(--ez-switch--focus--width) - 2px) / 2);background-color:var(--ez-switch--pin--focus--background-color)}input.switch-mode:focus::before{opacity:0.24;transition:opacity var(--transition)}input.switch-mode:checked:focus::before{background-color:var(--ez-switch--pin--checked--focus--background-color);transform:translateX(calc(var(--ez-switch--slider--width) - var(--ez-switch--pin--width) + 2px))}input.switch-mode:checked::after{transition:transform var(--transition);transition:background-color var(--transition);transition:border-color var(--transition);transform:translateX(calc(var(--ez-switch--slider--width) - var(--ez-switch--pin--width))) translateY(-4px);box-shadow:var(--shadow);background-color:var(--ez-switch--pin--checked--background-color);border:var(--border--small, 1px solid) var(--color--primary, #008561)}input.switch-mode:checked:disabled::after{background-color:var(--ez-switch--pin--checked--disabled--background-color)}.label{flex-shrink:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ez-check--label--color);font-size:var(--ez-check--label--font-size);font-family:var(--ez-check--label--font-family);cursor:default;width:inherit}.label--disabled{color:var(--ez-check--label--disabled--color)}.label--padding{padding-left:var(--space--small)}";
|
|
10
10
|
|
|
11
11
|
const EzCheck = class {
|
|
12
12
|
constructor(hostRef) {
|
|
@@ -4,11 +4,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-a7b0c73d.js');
|
|
6
6
|
const core = require('@sankhyalabs/core');
|
|
7
|
-
|
|
8
|
-
const CSSVarsUtils = require('./CSSVarsUtils-
|
|
7
|
+
require('./ApplicationUtils-c9d1205c.js');
|
|
8
|
+
const CSSVarsUtils = require('./CSSVarsUtils-10c9d5b4.js');
|
|
9
9
|
require('./DialogType-2114c337.js');
|
|
10
10
|
require('./CheckMode-ecb90b87.js');
|
|
11
|
-
const constants = require('./constants-2714478b.js');
|
|
12
11
|
|
|
13
12
|
const ezComboBoxCss = ":host{--ez-combo-box--height:42px;--ez-combo-box--width:100%;--ez-combo-box__icon--width:48px;--ez-combo-box--border-radius:var(--border--radius-medium, 12px);--ez-combo-box--border-radius-small:var(--border--radius-small, 6px);--ez-combo-box--font-size:var(--text--medium, 14px);--ez-combo-box--font-family:var(--font-pattern, Arial);--ez-combo-box--font-weight--large:var(--text-weight--large, 500);--ez-combo-box--font-weight--medium:var(--text-weight--medium, 400);--ez-combo-box--background-color--xlight:var(--background--xlight, #fff);--ez-combo-box--background-medium:var(--background--medium, #f0f3f7);--ez-combo-box--line-height:calc(var(--text--medium, 14px) + 4px);--ez-combo-box__input--background-color:var(--background--medium, #e0e0e0);--ez-combo-box__input--border:var(--border--medium, 2px solid);--ez-combo-box__input--border-color:var(--ez-combo-box__input--background-color);--ez-combo-box__input--focus--border-color:var(--color--primary, #008561);--ez-combo-box__input--disabled--background-color:var(--color--disable-secondary, #F2F5F8);--ez-combo-box__input--disabled--color:var(--text--disable, #AFB6C0);--ez-combo-box__input--error--border-color:#CC2936;--ez-combo-box__btn--color:var(--title--primary, #2B3A54);--ez-combo-box__btn-disabled--color:var(--text--disable, #AFB6C0);--ez-combo-box__btn-hover--color:var(--color--primary, #4e4e4e);--ez-combo-box__label--color:var(--title--primary, #2B3A54);--ez-combo-box__list-title--primary:var(--title--primary, #2B3A54);--ez-combo-box__list-text--primary:var(--text--primary, #626e82);--ez-combo-box__list-height:calc(var(--ez-combo-box--font-size) + var(--ez-combo-box--space--medium) + 4px);--ez-combo-box__list-min-width:64px;--ez-combo-box--space--medium:var(--space--medium, 12px);--ez-combo-box--space--small:var(--space--small, 6px);--ez-combo-box__scrollbar--color-default:var(--scrollbar--default, #626e82);--ez-combo-box__scrollbar--color-background:var(--scrollbar--background, #E5EAF0);--ez-combo-box__scrollbar--color-hover:var(--scrollbar--hover, #2B3A54);--ez-combo-box__scrollbar--color-clicked:var(--scrollbar--clicked, #a2abb9);--ez-combo-box__scrollbar--border-radius:var(--border--radius-small, 6px);--ez-combo-box__scrollbar--width:var(--space--medium, 12px);display:flex;flex-wrap:wrap;position:relative;width:var(--ez-combo-box--width)}ez-icon{--ez-icon--color:inherit;font-weight:var(--text-weight--large, 600)}.suppressed-search-input{--ez-text-input__input--border-color:var(--color--strokes, #dce0e8);--ez-text-input__input--disabled--background-color:var(--background--xlight, #fff);--ez-text-input__input--disabled--color:var(--title--primary, #2B3A54)}.list-container{min-width:var(--ez-combo-box__list-min-width);position:relative;width:100%}.list-wrapper{display:flex;flex-direction:column;box-sizing:border-box;width:0;z-index:var(--more-visible, 2);max-height:calc(4*var(--ez-combo-box__list-height) + 2*var(--ez-combo-box--space--small) + 9px);background-color:var(--ez-combo-box--background-color--xlight);border-radius:var(--ez-combo-box--border-radius);box-shadow:var(--shadow, 0px 0px 16px 0px #000);padding:var(--ez-combo-box--space--small)}.list-options{box-sizing:border-box;width:100%;height:100%;padding:0;display:flex;flex-direction:column;scroll-behavior:smooth;overflow:auto;scrollbar-width:thin;gap:3px;scrollbar-color:var(--ez-combo-box__scrollbar--color-clicked) var(--ez-combo-box__scrollbar--color-background)}.list-options::-webkit-scrollbar{background-color:var(--ez-combo-box__scrollbar--color-background);width:var(--ez-combo-box__scrollbar--width);max-width:var(--ez-combo-box__scrollbar--width);min-width:var(--ez-combo-box__scrollbar--width)}.list-options::-webkit-scrollbar-track{background-color:var(--ez-combo-box__scrollbar--color-background);border-radius:var(--ez-combo-box__scrollbar--border-radius)}.list-options::-webkit-scrollbar-thumb{background-color:var(--ez-combo-box__scrollbar--color-default);border-radius:var(--ez-combo-box__scrollbar--border-radius)}.list-options::-webkit-scrollbar-thumb:vertical:hover,.list-options::-webkit-scrollbar-thumb:horizontal:hover{background-color:var(--ez-combo-box__scrollbar--color-hover)}.list-options::-webkit-scrollbar-thumb:vertical:active,.list-options::-webkit-scrollbar-thumb:horizontal:active{background-color:var(--ez-combo-box__scrollbar--color-clicked)}.item{display:flex;align-items:center;width:100%;box-sizing:border-box;list-style-type:none;cursor:pointer;border-radius:var(--ez-combo-box--border-radius-small);padding:var(--ez-combo-box--space--small);min-height:var(--ez-combo-box__list-height);gap:var(--space--small, 6px)}.item__value,.item__label{flex-basis:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ez-combo-box__list-title--primary);font-family:var(--ez-combo-box--font-family);font-size:var(--ez-combo-box--font-size);line-height:var(--ez-combo-box--line-height)}.item__label{font-weight:var(--ez-combo-box--font-weight--medium)}.item__label--bold{font-weight:var(--ez-combo-box--font-weight--large)}.item__value{text-align:center;color:var(--ez-combo-box__list-text--primary);font-weight:var(--ez-combo-box--font-weight--large)}.item__value--hidden{visibility:hidden;position:absolute;white-space:nowrap;z-index:-1;top:0;left:0}.item__label{text-align:left}.message{text-align:center;display:flex;justify-content:center;align-items:center;list-style-type:none;min-height:var(--ez-combo-box__list-height)}.message__no-result{color:var(--ez-combo-box__list-title--primary);font-family:var(--ez-combo-box--font-family);font-size:var(--ez-combo-box--font-size)}.message__loading{border-radius:50%;width:14px;height:14px;-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border:3px solid var(--ez-combo-box__list-title--primary);border-top:3px solid transparent}li:hover{background-color:var(--ez-combo-box--background-medium)}.preselected{background-color:var(--background--medium)}.btn{outline:none;border:none;background:none;cursor:pointer;color:var(--ez-combo-box__btn--color)}.btn:disabled{cursor:unset;color:var(--ez-combo-box__btn-disabled--color)}.btn:disabled:hover{cursor:unset;color:var(--ez-combo-box__btn-disabled--color)}.btn:hover{color:var(--ez-combo-box__btn-hover--color)}.btn__close{visibility:hidden}ez-text-input:hover .btn__close,ez-text-input:focus .btn__close{visibility:visible}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}";
|
|
14
13
|
|
|
@@ -21,7 +20,6 @@ const EzComboBox = class {
|
|
|
21
20
|
this._maxWidthValue = 0;
|
|
22
21
|
this._tabPressed = false;
|
|
23
22
|
this._textEmptyList = "Nenhum resultado encontrado";
|
|
24
|
-
this._textEmptySearch = "Nenhum resultado de {0} encontrado";
|
|
25
23
|
this._lookupMode = false;
|
|
26
24
|
this._preSelection = undefined;
|
|
27
25
|
this._visibleOptions = undefined;
|
|
@@ -34,7 +32,6 @@ const EzComboBox = class {
|
|
|
34
32
|
this.enabled = true;
|
|
35
33
|
this.options = undefined;
|
|
36
34
|
this.errorMessage = undefined;
|
|
37
|
-
this.searchMode = undefined;
|
|
38
35
|
this.showSelectedValue = false;
|
|
39
36
|
this.showOptionValue = false;
|
|
40
37
|
this.suppressSearch = false;
|
|
@@ -58,7 +55,7 @@ const EzComboBox = class {
|
|
|
58
55
|
observeValue(newValue, oldValue) {
|
|
59
56
|
if (this._textInput && newValue != oldValue) {
|
|
60
57
|
try {
|
|
61
|
-
if (
|
|
58
|
+
if (typeof newValue === "string") {
|
|
62
59
|
this.setInputValue();
|
|
63
60
|
return;
|
|
64
61
|
}
|
|
@@ -83,7 +80,7 @@ const EzComboBox = class {
|
|
|
83
80
|
}
|
|
84
81
|
}
|
|
85
82
|
observeOptions(newOptions, oldOptions) {
|
|
86
|
-
if ((newOptions
|
|
83
|
+
if (core.ObjectUtils.equals(newOptions, oldOptions))
|
|
87
84
|
return;
|
|
88
85
|
this.loadOptions(SearchMode.PRELOAD);
|
|
89
86
|
}
|
|
@@ -221,18 +218,19 @@ const EzComboBox = class {
|
|
|
221
218
|
}
|
|
222
219
|
updateVisibleOptions() {
|
|
223
220
|
let opts = this._source || [];
|
|
224
|
-
if (
|
|
221
|
+
if (this._criteria) {
|
|
225
222
|
const upperCriteria = this._criteria.toUpperCase();
|
|
226
223
|
opts = opts.filter(opt => opt.label.toLocaleUpperCase().indexOf(upperCriteria) > -1);
|
|
227
224
|
}
|
|
228
|
-
if (this.
|
|
229
|
-
|
|
230
|
-
}
|
|
231
|
-
else {
|
|
232
|
-
this._visibleOptions = [{ value: undefined, label: "" }].concat(opts);
|
|
225
|
+
if (this.hasToAddEmptyoption(opts)) {
|
|
226
|
+
opts = [{ value: undefined, label: "" }].concat(opts);
|
|
233
227
|
}
|
|
228
|
+
this._visibleOptions = opts;
|
|
234
229
|
this._maxWidthValue = this.getMaxWidthValue();
|
|
235
230
|
}
|
|
231
|
+
hasToAddEmptyoption(opts) {
|
|
232
|
+
return !this.suppressEmptyOption && !opts.filter(opt => !opt.value).length;
|
|
233
|
+
}
|
|
236
234
|
getMaxWidthValue() {
|
|
237
235
|
var _a;
|
|
238
236
|
if (this.showOptionValue) {
|
|
@@ -296,7 +294,7 @@ const EzComboBox = class {
|
|
|
296
294
|
return this._floatingID !== undefined && core.FloatingManager.isFloating(this._floatingID);
|
|
297
295
|
}
|
|
298
296
|
nextOption() {
|
|
299
|
-
if (
|
|
297
|
+
if (!this.isOptionsVisible()) {
|
|
300
298
|
return;
|
|
301
299
|
}
|
|
302
300
|
this.showOptions();
|
|
@@ -319,9 +317,6 @@ const EzComboBox = class {
|
|
|
319
317
|
this.selectOption(this._visibleOptions[this._preSelection]);
|
|
320
318
|
this._preSelection = undefined;
|
|
321
319
|
}
|
|
322
|
-
else {
|
|
323
|
-
this.controlListWithOnlyOne();
|
|
324
|
-
}
|
|
325
320
|
}
|
|
326
321
|
updateSource(source) {
|
|
327
322
|
this._startLoading = false;
|
|
@@ -340,7 +335,6 @@ const EzComboBox = class {
|
|
|
340
335
|
this.updateVisibleOptions();
|
|
341
336
|
if (this._tabPressed) {
|
|
342
337
|
this._tabPressed = false;
|
|
343
|
-
this.controlEmptySearch();
|
|
344
338
|
}
|
|
345
339
|
}
|
|
346
340
|
else {
|
|
@@ -348,10 +342,6 @@ const EzComboBox = class {
|
|
|
348
342
|
}
|
|
349
343
|
}
|
|
350
344
|
}
|
|
351
|
-
clearSource() {
|
|
352
|
-
this._source = [];
|
|
353
|
-
this.updateVisibleOptions();
|
|
354
|
-
}
|
|
355
345
|
selectOption(newOption) {
|
|
356
346
|
var _a, _b;
|
|
357
347
|
const currentValue = this.getSelectedOption(this.value);
|
|
@@ -363,10 +353,6 @@ const EzComboBox = class {
|
|
|
363
353
|
else {
|
|
364
354
|
this.resetOptions();
|
|
365
355
|
}
|
|
366
|
-
if (this.searchMode) {
|
|
367
|
-
this._visibleOptions = [];
|
|
368
|
-
this.clearSource();
|
|
369
|
-
}
|
|
370
356
|
}
|
|
371
357
|
loadOptions(mode, argument = "") {
|
|
372
358
|
this._criteria = argument;
|
|
@@ -385,7 +371,7 @@ const EzComboBox = class {
|
|
|
385
371
|
}
|
|
386
372
|
else {
|
|
387
373
|
window.setTimeout(() => {
|
|
388
|
-
this.setInputValue();
|
|
374
|
+
this.setInputValue(false);
|
|
389
375
|
}, this._deboucingTime);
|
|
390
376
|
}
|
|
391
377
|
this.resetOptions();
|
|
@@ -402,93 +388,6 @@ const EzComboBox = class {
|
|
|
402
388
|
clearSearch() {
|
|
403
389
|
this.value = null;
|
|
404
390
|
}
|
|
405
|
-
controlListWithOnlyOne() {
|
|
406
|
-
var _a;
|
|
407
|
-
if (this.searchMode) {
|
|
408
|
-
const source = (_a = this._visibleOptions) === null || _a === void 0 ? void 0 : _a.filter((opt) => opt.label !== "" && opt.value != undefined);
|
|
409
|
-
if ((source === null || source === void 0 ? void 0 : source.length) === 1) {
|
|
410
|
-
this.selectOption(source[0]);
|
|
411
|
-
}
|
|
412
|
-
}
|
|
413
|
-
}
|
|
414
|
-
controlEmptySearch() {
|
|
415
|
-
var _a;
|
|
416
|
-
if (this.searchMode) {
|
|
417
|
-
if (!((_a = this._visibleOptions) === null || _a === void 0 ? void 0 : _a.length)) {
|
|
418
|
-
this.clearSearch();
|
|
419
|
-
ApplicationUtils.ApplicationUtils.info(this._textEmptyList);
|
|
420
|
-
}
|
|
421
|
-
else {
|
|
422
|
-
this.controlListWithOnlyOne();
|
|
423
|
-
}
|
|
424
|
-
}
|
|
425
|
-
}
|
|
426
|
-
validateDescriptionValue() {
|
|
427
|
-
if (!this.searchMode || core.StringUtils.isEmpty(this.value)) {
|
|
428
|
-
return;
|
|
429
|
-
}
|
|
430
|
-
let value = this.value;
|
|
431
|
-
if (typeof value === "object") {
|
|
432
|
-
return;
|
|
433
|
-
}
|
|
434
|
-
if (core.StringUtils.isEmpty(value)) {
|
|
435
|
-
return;
|
|
436
|
-
}
|
|
437
|
-
this.loadDescriptionValue(value);
|
|
438
|
-
}
|
|
439
|
-
async loadDescriptionValue(argument) {
|
|
440
|
-
var _a, _b;
|
|
441
|
-
if (argument == undefined) {
|
|
442
|
-
return;
|
|
443
|
-
}
|
|
444
|
-
if (((_a = this.options) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
445
|
-
this.loadOptionValue(argument);
|
|
446
|
-
return;
|
|
447
|
-
}
|
|
448
|
-
const searchArgument = {
|
|
449
|
-
mode: SearchMode.PREDICTIVE,
|
|
450
|
-
argument
|
|
451
|
-
};
|
|
452
|
-
const source = await ((_b = this.optionLoader) === null || _b === void 0 ? void 0 : _b.call(this, searchArgument));
|
|
453
|
-
if (source == undefined) {
|
|
454
|
-
return;
|
|
455
|
-
}
|
|
456
|
-
if (source instanceof Promise) {
|
|
457
|
-
source.then((result) => {
|
|
458
|
-
this.setDescriptionValue(result);
|
|
459
|
-
});
|
|
460
|
-
}
|
|
461
|
-
else {
|
|
462
|
-
this.setDescriptionValue(source);
|
|
463
|
-
}
|
|
464
|
-
}
|
|
465
|
-
setDescriptionValue(source) {
|
|
466
|
-
const value = (source === null || source === void 0 ? void 0 : source[0]) || source;
|
|
467
|
-
if (value == undefined || !Object.keys(value).length) {
|
|
468
|
-
this.showNoResultMessage();
|
|
469
|
-
return;
|
|
470
|
-
}
|
|
471
|
-
this._lookupMode = true;
|
|
472
|
-
this.value = value;
|
|
473
|
-
}
|
|
474
|
-
loadOptionValue(argument) {
|
|
475
|
-
var _a;
|
|
476
|
-
const source = (_a = this.options) === null || _a === void 0 ? void 0 : _a.find((opt) => opt.value === argument);
|
|
477
|
-
if (source != undefined) {
|
|
478
|
-
this.selectOption(source);
|
|
479
|
-
}
|
|
480
|
-
else {
|
|
481
|
-
this.showNoResultMessage();
|
|
482
|
-
}
|
|
483
|
-
}
|
|
484
|
-
async showNoResultMessage() {
|
|
485
|
-
this.clearSearch();
|
|
486
|
-
ApplicationUtils.ApplicationUtils.info(this._textEmptySearch.replace("{0}", this.getFieldLabel()));
|
|
487
|
-
}
|
|
488
|
-
getFieldLabel() {
|
|
489
|
-
var _a;
|
|
490
|
-
return (_a = this.label) === null || _a === void 0 ? void 0 : _a.replace(constants.REQUIRED_INFO, "").toUpperCase();
|
|
491
|
-
}
|
|
492
391
|
resetOptions() {
|
|
493
392
|
this.hideOptions();
|
|
494
393
|
this._criteria = undefined;
|
|
@@ -514,12 +413,7 @@ const EzComboBox = class {
|
|
|
514
413
|
});
|
|
515
414
|
}
|
|
516
415
|
}
|
|
517
|
-
|
|
518
|
-
this.updateSource([]);
|
|
519
|
-
}
|
|
520
|
-
else {
|
|
521
|
-
this.loadOptions(SearchMode.PRELOAD);
|
|
522
|
-
}
|
|
416
|
+
this.loadOptions(SearchMode.PRELOAD);
|
|
523
417
|
}
|
|
524
418
|
componentDidRender() {
|
|
525
419
|
var _a;
|
|
@@ -529,7 +423,6 @@ const EzComboBox = class {
|
|
|
529
423
|
(_a = this._optionsList) === null || _a === void 0 ? void 0 : _a.querySelectorAll(".item").forEach((elem) => {
|
|
530
424
|
core.ElementIDUtils.addIDInfoIfNotExists(elem, "itemComboBox");
|
|
531
425
|
});
|
|
532
|
-
this.validateDescriptionValue();
|
|
533
426
|
}
|
|
534
427
|
componentDidLoad() {
|
|
535
428
|
CSSVarsUtils.CSSVarsUtils.applyVarsTextInput(this.el, this._textInput);
|
|
@@ -549,13 +442,7 @@ const EzComboBox = class {
|
|
|
549
442
|
// Event handlers
|
|
550
443
|
//---------------------------------------------
|
|
551
444
|
handlerIconClick() {
|
|
552
|
-
this.
|
|
553
|
-
}
|
|
554
|
-
buildNumberArgument(argument) {
|
|
555
|
-
if (this.isTextSearch) {
|
|
556
|
-
return NaN;
|
|
557
|
-
}
|
|
558
|
-
return Number(argument || undefined);
|
|
445
|
+
this.showOptions();
|
|
559
446
|
}
|
|
560
447
|
onTextInputChangeHandler(event) {
|
|
561
448
|
var _a;
|
|
@@ -572,36 +459,12 @@ const EzComboBox = class {
|
|
|
572
459
|
}
|
|
573
460
|
this._criteria = argument;
|
|
574
461
|
if (argument) {
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
this.clearSource();
|
|
578
|
-
const enoughChars = argument.length >= this.limitCharsToSearch;
|
|
579
|
-
const argumentNumber = this.buildNumberArgument(argument);
|
|
580
|
-
if (enoughChars || !isNaN(argumentNumber)) {
|
|
581
|
-
this._showLoading = true;
|
|
582
|
-
this._changeDeboucingTimeout = window.setTimeout(() => {
|
|
583
|
-
this.loadOptions(SearchMode.PREDICTIVE, isNaN(argumentNumber) ? argument : argumentNumber.toString());
|
|
584
|
-
}, this._deboucingTime);
|
|
585
|
-
this.showOptions();
|
|
586
|
-
}
|
|
587
|
-
else {
|
|
588
|
-
this.hideOptions();
|
|
589
|
-
}
|
|
590
|
-
}
|
|
591
|
-
else {
|
|
592
|
-
this.updateVisibleOptions();
|
|
593
|
-
this.showOptions();
|
|
594
|
-
}
|
|
462
|
+
this.updateVisibleOptions();
|
|
463
|
+
this.showOptions();
|
|
595
464
|
}
|
|
596
465
|
else {
|
|
597
466
|
this.hideOptions();
|
|
598
|
-
|
|
599
|
-
this._showLoading = false;
|
|
600
|
-
this.clearSource();
|
|
601
|
-
}
|
|
602
|
-
else {
|
|
603
|
-
this.updateVisibleOptions();
|
|
604
|
-
}
|
|
467
|
+
this.updateVisibleOptions();
|
|
605
468
|
}
|
|
606
469
|
}
|
|
607
470
|
clearDeboucingTimeout() {
|
|
@@ -611,9 +474,7 @@ const EzComboBox = class {
|
|
|
611
474
|
}
|
|
612
475
|
}
|
|
613
476
|
onTextInputClickHandler() {
|
|
614
|
-
|
|
615
|
-
this.showOptions();
|
|
616
|
-
}
|
|
477
|
+
this.showOptions();
|
|
617
478
|
}
|
|
618
479
|
keyDownHandler(event) {
|
|
619
480
|
this._tabPressed = false;
|
|
@@ -645,7 +506,6 @@ const EzComboBox = class {
|
|
|
645
506
|
break;
|
|
646
507
|
case "Tab":
|
|
647
508
|
this._tabPressed = true;
|
|
648
|
-
this.controlListWithOnlyOne();
|
|
649
509
|
break;
|
|
650
510
|
}
|
|
651
511
|
//ATENÇÃO: Existe a necessidade de propagar o evento de teclado.
|
|
@@ -662,11 +522,8 @@ const EzComboBox = class {
|
|
|
662
522
|
return !this._showLoading && this._visibleOptions.length > 0;
|
|
663
523
|
}
|
|
664
524
|
render() {
|
|
665
|
-
var _a;
|
|
666
525
|
core.ElementIDUtils.addIDInfoIfNotExists(this.el, 'input');
|
|
667
|
-
return (index.h(index.Host, null, index.h("ez-text-input", { "data-element-id": core.ElementIDUtils.getInternalIDInfo("textInput"), class: this.suppressSearch ? "suppressed-search-input" : "", ref: elem => this._textInput = elem, "data-slave-mode": "true", enabled: this.enabled && !this.suppressSearch, onInput: event => this.onTextInputChangeHandler(event), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode }, index.h("button", { class: "btn", slot:
|
|
668
|
-
? index.h("button", { class: "btn btn__close", slot: "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.clearSearch() }, index.h("ez-icon", { iconName: "close" }))
|
|
669
|
-
: undefined), index.h("section", { class: "list-container", ref: elem => this._listContainer = elem }, index.h("div", { class: "list-wrapper", ref: elem => this._listWrapper = elem }, index.h("ul", { class: "list-options", ref: elem => this._optionsList = elem }, !this._showLoading
|
|
526
|
+
return (index.h(index.Host, null, index.h("ez-text-input", { "data-element-id": core.ElementIDUtils.getInternalIDInfo("textInput"), class: this.suppressSearch ? "suppressed-search-input" : "", ref: elem => this._textInput = elem, "data-slave-mode": "true", enabled: this.enabled && !this.suppressSearch, onInput: event => this.onTextInputChangeHandler(event), onClick: () => this.onTextInputClickHandler(), onFocusout: () => this.onTextInputFocusOutHandler(), onKeyDown: event => this.keyDownHandler(event), label: this.label, canShowError: this.canShowError, errorMessage: this.errorMessage, mode: this.mode }, index.h("button", { class: "btn", slot: "rightIcon", disabled: !this.enabled, tabindex: -1, onClick: () => this.handlerIconClick() }, index.h("ez-icon", { iconName: "chevron-down" }))), index.h("section", { class: "list-container", ref: elem => this._listContainer = elem }, index.h("div", { class: "list-wrapper", ref: elem => this._listWrapper = elem }, index.h("ul", { class: "list-options", ref: elem => this._optionsList = elem }, !this._showLoading
|
|
670
527
|
&& this._visibleOptions.length === 0
|
|
671
528
|
&& index.h("div", { class: "message" }, index.h("span", { class: "message__no-result" }, this._textEmptyList)), this._showLoading
|
|
672
529
|
&& index.h("div", { class: "message" }, index.h("div", { class: "message__loading" })), this.showOptionValue
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-a7b0c73d.js');
|
|
6
6
|
const core = require('@sankhyalabs/core');
|
|
7
|
-
const CSSVarsUtils = require('./CSSVarsUtils-
|
|
7
|
+
const CSSVarsUtils = require('./CSSVarsUtils-10c9d5b4.js');
|
|
8
8
|
|
|
9
9
|
const ezDateInputCss = ":host{display:block;width:100%;--ez-date-input__input--background-color:var(--background--medium, #e0e0e0);--ez-date-input__input--border-color:var(--ez-date-input__input--background-color);--ez-date-input__calendar-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" height=\"16px\" width=\"15px\"><path d=\"M 3.171875,5.25 C 2.6485088,5.25 2.21875,5.6797588 2.21875,6.203125 2.21875,6.7264912 2.6485088,7.15625 3.171875,7.15625 3.6952412,7.15625 4.125,6.7264912 4.125,6.203125 4.125,5.6797588 3.6952412,5.25 3.171875,5.25 Z m 2.875,0 C 5.5235088,5.25 5.09375,5.6797588 5.09375,6.203125 5.09375,6.7264912 5.5235088,7.15625 6.046875,7.15625 6.5702412,7.15625 7,6.7264912 7,6.203125 7,5.6797588 6.5702412,5.25 6.046875,5.25 Z m 2.875,0 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.953125 0.953125,0.953125 0.5233662,0 0.9511719,-0.4297588 0.9511719,-0.953125 C 9.8730469,5.6797588 9.4452412,5.25 8.921875,5.25 Z m 2.873047,0 c -0.523366,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.429759,0.953125 0.953125,0.953125 0.523366,0 0.953125,-0.4297588 0.953125,-0.953125 C 12.748047,5.6797588 12.318288,5.25 11.794922,5.25 Z M 3.171875,8.1230469 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.9531251 0.953125,0.9531251 0.5233662,0 0.953125,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.875,0 c -0.5233662,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297588,0.9531251 0.953125,0.9531251 C 6.5702412,10.029297 7,9.5995381 7,9.0761719 7,8.5528057 6.5702412,8.1230469 6.046875,8.1230469 Z m 2.8554688,0 c -0.5233663,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.4297587,0.9531251 0.953125,0.9531251 0.5233661,0 0.9531249,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.9003902,0 c -0.523366,0 -0.953125,0.4297588 -0.953125,0.953125 0,0.5233662 0.429759,0.9531251 0.953125,0.9531251 0.523367,0 0.953125,-0.4297589 0.953125,-0.9531251 0,-0.5233662 -0.429758,-0.953125 -0.953125,-0.953125 z M 3.171875,10.998047 c -0.5233662,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297588,0.953125 0.953125,0.953125 0.5233662,0 0.953125,-0.429759 0.953125,-0.953125 0,-0.523366 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.875,0 c -0.5233662,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297588,0.953125 0.953125,0.953125 C 6.5702412,12.904297 7,12.474538 7,11.951172 7,11.427806 6.5702412,10.998047 6.046875,10.998047 Z m 2.8554688,0 c -0.5233663,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.4297587,0.953125 0.953125,0.953125 0.5233661,0 0.9531249,-0.429759 0.953125,-0.953125 0,-0.523366 -0.4297588,-0.953125 -0.953125,-0.953125 z m 2.9003902,0 c -0.523366,0 -0.953125,0.429759 -0.953125,0.953125 0,0.523366 0.429759,0.953125 0.953125,0.953125 0.523367,0 0.953125,-0.429759 0.953125,-0.953125 0,-0.523366 -0.429758,-0.953125 -0.953125,-0.953125 z M 3.5,0 c -0.554,0 -1,0.446 -1,1 v 0.050781 C 1.0853217,1.2909766 0,2.5186658 0,4 v 9 c 0,1.652487 1.3475134,3 3,3 h 9 c 1.652487,0 3,-1.347513 3,-3 V 4 C 15,2.5186658 13.914678,1.2909766 12.5,1.0507812 V 1 c 0,-0.554 -0.446,-1 -1,-1 -0.554,0 -1,0.446 -1,1 h -2 c 0,-0.554 -0.446,-1 -1,-1 -0.554,0 -1,0.446 -1,1 h -2 C 4.5,0.446 4.054,0 3.5,0 Z m 1,2.0996094 h 2 v 0.640625 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 v -0.640625 h 2 v 0.640625 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 V 2.1738281 C 13.311725,2.3905225 13.900391,3.11278 13.900391,4 v 9 c 0,1.062113 -0.838278,1.900391 -1.900391,1.900391 H 3 C 1.9378864,14.900391 1.0996094,14.062113 1.0996094,13 V 4 C 1.0996094,3.11278 1.6882747,2.3905225 2.5,2.1738281 v 0.5664063 c 0,0.554 0.446,1 1,1 0.554,0 1,-0.446 1,-1 z\"/></svg>')}.btn-open-cal{outline:none;border:none;background-color:unset;cursor:pointer}.btn-open-cal:disabled{cursor:unset}.btn-open-cal::after{content:'';display:flex;background-color:var(--text--primary, #008561);width:15px;height:16px;-webkit-mask-image:var(--ez-date-input__calendar-image);mask-image:var(--ez-date-input__calendar-image)}.btn-open-cal:disabled:after{background-color:var(--text--disable, #AFB6C0)}.btn-open-cal:enabled:hover::after{background-color:var(--color--primary, #4e4e4e)}ez-text-input{--text-input__input--background-color:var(--ez-date-input__input--background-color, #FFFFFF);--text-input__input--border-color:var(--ez-date-input__input--border-color, #DCE0E8)}";
|
|
10
10
|
|
|
@@ -111,6 +111,9 @@ const EzDateInput = class {
|
|
|
111
111
|
this._calendar.hide();
|
|
112
112
|
}
|
|
113
113
|
handleBlur() {
|
|
114
|
+
if (!this._changePending) {
|
|
115
|
+
return;
|
|
116
|
+
}
|
|
114
117
|
try {
|
|
115
118
|
const strValue = this._textInput.value;
|
|
116
119
|
const newValue = core.DateUtils.strToDate(strValue);
|