@3t-transform/threeteeui 0.2.92 → 0.2.93

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.
@@ -14,7 +14,7 @@ const patchEsm = () => {
14
14
  const defineCustomElements = (win, options) => {
15
15
  if (typeof window === 'undefined') return Promise.resolve();
16
16
  return patchEsm().then(() => {
17
- return index.bootstrapLazy([["tttx-data-pattern.cjs",[[1,"tttx-data-pattern",{"data":[1],"sorteroptions":[1],"filteroptions":[1],"filterheader":[1]}]]],["tttx-multiselect-box.cjs",[[1,"tttx-multiselect-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"htmlVisibleValue":[4,"html-visible-value"],"visibleValue":[1,"visible-value"],"open":[32],"unsavedSelectedItems":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-dialog-box.cjs",[[1,"tttx-dialog-box",{"data":[1025],"size":[1],"open":[1028],"allowOverflow":[4,"allow-overflow"],"elementSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-select-box.cjs",[[1,"tttx-select-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"selectedValue":[1,"selected-value"],"open":[32],"selectedItem":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-tree-view.cjs",[[1,"tttx-tree-view",{"data":[1040],"treeData":[32],"selectedId":[32]}]]],["tttx-checkbox.cjs",[[0,"tttx-checkbox",{"checkboxId":[1,"checkbox-id"],"label":[1],"inline":[4],"indeterminate":[4],"checked":[4]}]]],["tttx-expander.cjs",[[1,"tttx-expander",{"name":[1],"open":[4],"lefticon":[1],"lefticoncolor":[1],"isExpanded":[32]}]]],["tttx-tabs.cjs",[[2,"tttx-tabs",{"tabsName":[1,"tabs-name"],"navigation":[4],"wide":[4],"tabs":[1],"_tabs":[32]},[[0,"keydown","handleKeyDown"]]]]],["tttx-checkbox-group.cjs",[[1,"tttx-checkbox-group"]]],["tttx-checkbox-group-caption.cjs",[[4,"tttx-checkbox-group-caption"]]],["tttx-checkbox-group-heading.cjs",[[4,"tttx-checkbox-group-heading"]]],["tttx-form.cjs",[[1,"tttx-form",{"formschema":[1025],"data":[1032],"submit":[64]}]]],["tttx-keyvalue-block.cjs",[[1,"tttx-keyvalue-block",{"keyvalues":[1],"horizontal":[4],"spacedout":[4],"_elements":[32]}]]],["tttx-loading-spinner.cjs",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-percentage-bar.cjs",[[2,"tttx-percentage-bar",{"percentage":[8],"thresholds":[1],"color":[1],"min":[1],"labelid":[1],"_percentage":[32],"_ranges":[32],"_min":[32]}]]],["tttx-qrcode.cjs",[[1,"tttx-qrcode",{"link":[1025],"size":[1026]}]]],["tttx-tag.cjs",[[1,"tttx-tag",{"text":[1],"color":[1],"textColor":[1,"text-color"]}]]],["tttx-textarea.cjs",[[2,"tttx-textarea",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"rows":[2],"textareaautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"disabled":[4],"maxlength":[8],"name":[1],"placeholder":[1],"readonly":[8],"required":[4],"value":[1032]}]]],["tttx-icon.cjs",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]],["tttx-standalone-input.cjs",[[2,"tttx-standalone-input",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"iconleft":[1],"iconleftcolor":[1],"iconright":[1],"iconrightcolor":[1],"inputicon":[1],"inputiconcolor":[1],"inline":[4],"inputautocapitalize":[1],"inputautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"autocomplete":[1],"checked":[4],"disabled":[4],"max":[8],"maxlength":[8],"min":[8],"minlength":[8],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[8],"required":[4],"step":[8],"type":[1],"value":[1032]}]]],["tttx-filter_4.cjs",[[1,"tttx-filter",{"filterKey":[1,"filter-key"],"filterOptions":[1,"filter-options"],"showSelectAll":[4,"show-select-all"],"showSearchField":[4,"show-search-field"],"showOptionIcons":[4,"show-option-icons"],"filterButtonStyle":[1,"filter-button-style"],"filterHeader":[1,"filter-header"],"defaultFilterOptions":[1,"default-filter-options"],"popoverWidth":[1,"popover-width"],"showPopover":[32],"displayedFilterSettings":[32],"selectedFilters":[32],"filterSearchTerm":[32],"allSelected":[32]},[[0,"closeFilter","handleCloseFilter"]]],[1,"tttx-list",{"data":[1025],"name":[1],"_data":[32]}],[1,"tttx-sorter",{"sorterKey":[1,"sorter-key"],"defaultSortDirection":[1,"default-sort-direction"],"fieldOptionsData":[1,"field-options-data"],"defaultOption":[1,"default-option"],"selectedField":[32],"sortDirection":[32],"dropdownExpand":[32],"dropdownOptions":[32]},[[0,"closeSorter","handleCloseSorter"]]],[1,"tttx-toolbar",{"border":[4],"viewSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-button.cjs",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"iconcolor":[1025],"design":[1]}]]]], options);
17
+ return index.bootstrapLazy([["tttx-data-pattern.cjs",[[1,"tttx-data-pattern",{"data":[1],"sorteroptions":[1],"filteroptions":[1],"filterheader":[1]}]]],["tttx-multiselect-box.cjs",[[1,"tttx-multiselect-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"htmlVisibleValue":[4,"html-visible-value"],"visibleValue":[1,"visible-value"],"open":[32],"unsavedSelectedItems":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-dialog-box.cjs",[[1,"tttx-dialog-box",{"data":[1025],"size":[1],"open":[1028],"allowOverflow":[4,"allow-overflow"],"elementSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-select-box.cjs",[[1,"tttx-select-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"selectedValue":[1,"selected-value"],"open":[32],"selectedItem":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-tree-view.cjs",[[1,"tttx-tree-view",{"data":[1040],"treeData":[32],"selectedId":[32]}]]],["tttx-checkbox.cjs",[[0,"tttx-checkbox",{"checkboxId":[1,"checkbox-id"],"label":[1],"inline":[4],"indeterminate":[4],"checked":[4]}]]],["tttx-dialog.cjs",[[1,"tttx-dialog",{"header":[1],"type":[1],"size":[1],"open":[4],"allowOverflow":[4,"allow-overflow"],"closeEnabled":[4,"close-enabled"],"elementSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-expander.cjs",[[1,"tttx-expander",{"name":[1],"open":[4],"lefticon":[1],"lefticoncolor":[1],"isExpanded":[32]}]]],["tttx-tabs.cjs",[[2,"tttx-tabs",{"tabsName":[1,"tabs-name"],"navigation":[4],"wide":[4],"tabs":[1],"_tabs":[32]},[[0,"keydown","handleKeyDown"]]]]],["tttx-checkbox-group.cjs",[[1,"tttx-checkbox-group"]]],["tttx-checkbox-group-caption.cjs",[[4,"tttx-checkbox-group-caption"]]],["tttx-checkbox-group-heading.cjs",[[4,"tttx-checkbox-group-heading"]]],["tttx-form.cjs",[[1,"tttx-form",{"formschema":[1025],"data":[1032],"submit":[64]}]]],["tttx-keyvalue-block.cjs",[[1,"tttx-keyvalue-block",{"keyvalues":[1],"horizontal":[4],"spacedout":[4],"_elements":[32]}]]],["tttx-loading-spinner.cjs",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-percentage-bar.cjs",[[2,"tttx-percentage-bar",{"percentage":[8],"thresholds":[1],"color":[1],"min":[1],"labelid":[1],"_percentage":[32],"_ranges":[32],"_min":[32]}]]],["tttx-qrcode.cjs",[[1,"tttx-qrcode",{"link":[1025],"size":[1026]}]]],["tttx-tag.cjs",[[1,"tttx-tag",{"text":[1],"color":[1],"textColor":[1,"text-color"]}]]],["tttx-textarea.cjs",[[2,"tttx-textarea",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"rows":[2],"textareaautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"disabled":[4],"maxlength":[8],"name":[1],"placeholder":[1],"readonly":[8],"required":[4],"value":[1032]}]]],["tttx-icon.cjs",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]],["tttx-standalone-input.cjs",[[2,"tttx-standalone-input",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"iconleft":[1],"iconleftcolor":[1],"iconright":[1],"iconrightcolor":[1],"inputicon":[1],"inputiconcolor":[1],"inline":[4],"inputautocapitalize":[1],"inputautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"autocomplete":[1],"checked":[4],"disabled":[4],"max":[8],"maxlength":[8],"min":[8],"minlength":[8],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[8],"required":[4],"step":[8],"type":[1],"value":[1032]}]]],["tttx-filter_4.cjs",[[1,"tttx-filter",{"filterKey":[1,"filter-key"],"filterOptions":[1,"filter-options"],"showSelectAll":[4,"show-select-all"],"showSearchField":[4,"show-search-field"],"showOptionIcons":[4,"show-option-icons"],"filterButtonStyle":[1,"filter-button-style"],"filterHeader":[1,"filter-header"],"defaultFilterOptions":[1,"default-filter-options"],"popoverWidth":[1,"popover-width"],"showPopover":[32],"displayedFilterSettings":[32],"selectedFilters":[32],"filterSearchTerm":[32],"allSelected":[32]},[[0,"closeFilter","handleCloseFilter"]]],[1,"tttx-list",{"data":[1025],"name":[1],"_data":[32]}],[1,"tttx-sorter",{"sorterKey":[1,"sorter-key"],"defaultSortDirection":[1,"default-sort-direction"],"fieldOptionsData":[1,"field-options-data"],"defaultOption":[1,"default-option"],"selectedField":[32],"sortDirection":[32],"dropdownExpand":[32],"dropdownOptions":[32]},[[0,"closeSorter","handleCloseSorter"]]],[1,"tttx-toolbar",{"border":[4],"viewSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-button.cjs",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"iconcolor":[1025],"design":[1]}]]]], options);
18
18
  });
19
19
  };
20
20
 
@@ -0,0 +1,81 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ const index = require('./index-992a9fb3.js');
6
+
7
+ const ICON_TYPES = {
8
+ critical: { iconName: 'report', iconColor: 'red' },
9
+ info: { iconName: 'info', iconColor: 'blue' },
10
+ success: { iconName: 'check_circle', iconColor: 'green' },
11
+ warning: { iconName: 'warning', iconColor: 'orange' },
12
+ };
13
+
14
+ const tttxDialogCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.material-symbols-rounded{font-family:\"Material Symbols Rounded\", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}h3{margin-block-start:0em;margin-block-end:0em}.dialog-box{background-color:#ffffff;border:1px solid #d5d5d5;border-radius:4px;box-shadow:0px 1px 5px #1111114d;padding:0}.dialog-box.small{width:400px;min-height:200px}.dialog-box.regular{width:600px;min-height:200px}.dialog-box.large{width:900px;min-height:200px}.dialog-box.mobile{max-width:424px;width:calc(100vw - 20px)}.overflow-visible{overflow:visible}.overflow-hidden{overflow:hidden}dialog::backdrop{background-color:#75757580}.clickable{cursor:pointer}.contents{display:flex;flex-direction:column;min-height:inherit}.padding{padding:8px 16px}.align-right{margin-left:auto;display:flex}.header{border-bottom:1px solid #d5d5d5;display:flex;flex-direction:row;align-items:center;height:36px}.title{font-size:18;font-weight:500;font-family:\"Roboto\", serif}.icon{padding-right:8px;width:24px;height:24px}.icon-close{margin-left:auto;padding-top:3px;width:24px;height:24px}.body-content{font-size:16;font-weight:400;font-family:\"Roboto\", serif}.body{text-overflow:ellipsis;padding:16px}.footer{display:flex;flex-direction:row;margin-top:auto;border-top:1px solid #d5d5d5;height:36px}::slotted([slot=buttons]){display:flex;gap:8px}.header.info{border-bottom:1px solid #1479c6}.header.success{border-bottom:1px solid #a2bb31}.header.warning{border-bottom:1px solid #f59500}.header.critical{border-bottom:1px solid #dc0000}";
15
+
16
+ const TttxDialog = class {
17
+ constructor(hostRef) {
18
+ index.registerInstance(this, hostRef);
19
+ this.closeButtonClick = index.createEvent(this, "closeButtonClick", 6);
20
+ this.header = undefined;
21
+ this.type = undefined;
22
+ this.size = 'regular';
23
+ this.open = false;
24
+ this.allowOverflow = false;
25
+ this.closeEnabled = true;
26
+ this.elementSize = undefined;
27
+ }
28
+ handleResize() {
29
+ if (window.innerWidth < 698) {
30
+ this.elementSize = 'mobile';
31
+ }
32
+ else {
33
+ this.elementSize = this.size;
34
+ }
35
+ }
36
+ preventCancelOnDialog(event) {
37
+ event.preventDefault();
38
+ }
39
+ componentDidLoad() {
40
+ this.dialog.addEventListener('cancel', this.preventCancelOnDialog);
41
+ }
42
+ onCloseClickHandler() {
43
+ this.closeButtonClick.emit();
44
+ }
45
+ headerIconDetails(iconEnabled) {
46
+ if (!iconEnabled)
47
+ return { iconName: undefined, iconColor: undefined };
48
+ return ICON_TYPES[this.type];
49
+ }
50
+ renderHeader() {
51
+ const iconEnabled = typeof this.type !== 'undefined';
52
+ const { iconName, iconColor } = this.headerIconDetails(iconEnabled);
53
+ return (index.h("div", { class: `padding header ${this.type || ''}` }, iconEnabled && index.h("tttx-icon", { class: "icon", icon: iconName, color: iconColor }), index.h("h3", { class: "title" }, this.header), this.closeEnabled && (index.h("div", { class: "align-right close-button", onClick: () => this.onCloseClickHandler() }, index.h("tttx-icon", { class: "icon-close clickable", icon: "close", color: "black" })))));
54
+ }
55
+ body() {
56
+ return (index.h("div", { class: `body ${!this.allowOverflow ? 'overflow-hidden' : ''}` }, index.h("span", { class: "body-content" }, index.h("slot", null))));
57
+ }
58
+ footer() {
59
+ if (!this.el.querySelector('[slot="buttons"]'))
60
+ return;
61
+ return (index.h("div", { class: "padding footer" }, index.h("div", { class: "align-right" }, index.h("slot", { name: "buttons" }))));
62
+ }
63
+ componentDidRender() {
64
+ if (!this.open) {
65
+ this.dialog.close();
66
+ return;
67
+ }
68
+ if (!this.dialog.open)
69
+ this.dialog.showModal();
70
+ }
71
+ componentWillLoad() {
72
+ this.handleResize();
73
+ }
74
+ render() {
75
+ return (index.h("dialog", { ref: (el) => this.dialog = el, class: `dialog-box ${this.allowOverflow ? 'overflow-visible' : ''} ${this.elementSize}` }, index.h("div", { class: "contents" }, this.renderHeader(), this.body(), this.footer())));
76
+ }
77
+ get el() { return index.getElement(this); }
78
+ };
79
+ TttxDialog.style = tttxDialogCss;
80
+
81
+ exports.tttx_dialog = TttxDialog;
@@ -17,7 +17,7 @@ const patchBrowser = () => {
17
17
  };
18
18
 
19
19
  patchBrowser().then(options => {
20
- return index.bootstrapLazy([["tttx-data-pattern.cjs",[[1,"tttx-data-pattern",{"data":[1],"sorteroptions":[1],"filteroptions":[1],"filterheader":[1]}]]],["tttx-multiselect-box.cjs",[[1,"tttx-multiselect-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"htmlVisibleValue":[4,"html-visible-value"],"visibleValue":[1,"visible-value"],"open":[32],"unsavedSelectedItems":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-dialog-box.cjs",[[1,"tttx-dialog-box",{"data":[1025],"size":[1],"open":[1028],"allowOverflow":[4,"allow-overflow"],"elementSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-select-box.cjs",[[1,"tttx-select-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"selectedValue":[1,"selected-value"],"open":[32],"selectedItem":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-tree-view.cjs",[[1,"tttx-tree-view",{"data":[1040],"treeData":[32],"selectedId":[32]}]]],["tttx-checkbox.cjs",[[0,"tttx-checkbox",{"checkboxId":[1,"checkbox-id"],"label":[1],"inline":[4],"indeterminate":[4],"checked":[4]}]]],["tttx-expander.cjs",[[1,"tttx-expander",{"name":[1],"open":[4],"lefticon":[1],"lefticoncolor":[1],"isExpanded":[32]}]]],["tttx-tabs.cjs",[[2,"tttx-tabs",{"tabsName":[1,"tabs-name"],"navigation":[4],"wide":[4],"tabs":[1],"_tabs":[32]},[[0,"keydown","handleKeyDown"]]]]],["tttx-checkbox-group.cjs",[[1,"tttx-checkbox-group"]]],["tttx-checkbox-group-caption.cjs",[[4,"tttx-checkbox-group-caption"]]],["tttx-checkbox-group-heading.cjs",[[4,"tttx-checkbox-group-heading"]]],["tttx-form.cjs",[[1,"tttx-form",{"formschema":[1025],"data":[1032],"submit":[64]}]]],["tttx-keyvalue-block.cjs",[[1,"tttx-keyvalue-block",{"keyvalues":[1],"horizontal":[4],"spacedout":[4],"_elements":[32]}]]],["tttx-loading-spinner.cjs",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-percentage-bar.cjs",[[2,"tttx-percentage-bar",{"percentage":[8],"thresholds":[1],"color":[1],"min":[1],"labelid":[1],"_percentage":[32],"_ranges":[32],"_min":[32]}]]],["tttx-qrcode.cjs",[[1,"tttx-qrcode",{"link":[1025],"size":[1026]}]]],["tttx-tag.cjs",[[1,"tttx-tag",{"text":[1],"color":[1],"textColor":[1,"text-color"]}]]],["tttx-textarea.cjs",[[2,"tttx-textarea",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"rows":[2],"textareaautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"disabled":[4],"maxlength":[8],"name":[1],"placeholder":[1],"readonly":[8],"required":[4],"value":[1032]}]]],["tttx-icon.cjs",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]],["tttx-standalone-input.cjs",[[2,"tttx-standalone-input",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"iconleft":[1],"iconleftcolor":[1],"iconright":[1],"iconrightcolor":[1],"inputicon":[1],"inputiconcolor":[1],"inline":[4],"inputautocapitalize":[1],"inputautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"autocomplete":[1],"checked":[4],"disabled":[4],"max":[8],"maxlength":[8],"min":[8],"minlength":[8],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[8],"required":[4],"step":[8],"type":[1],"value":[1032]}]]],["tttx-filter_4.cjs",[[1,"tttx-filter",{"filterKey":[1,"filter-key"],"filterOptions":[1,"filter-options"],"showSelectAll":[4,"show-select-all"],"showSearchField":[4,"show-search-field"],"showOptionIcons":[4,"show-option-icons"],"filterButtonStyle":[1,"filter-button-style"],"filterHeader":[1,"filter-header"],"defaultFilterOptions":[1,"default-filter-options"],"popoverWidth":[1,"popover-width"],"showPopover":[32],"displayedFilterSettings":[32],"selectedFilters":[32],"filterSearchTerm":[32],"allSelected":[32]},[[0,"closeFilter","handleCloseFilter"]]],[1,"tttx-list",{"data":[1025],"name":[1],"_data":[32]}],[1,"tttx-sorter",{"sorterKey":[1,"sorter-key"],"defaultSortDirection":[1,"default-sort-direction"],"fieldOptionsData":[1,"field-options-data"],"defaultOption":[1,"default-option"],"selectedField":[32],"sortDirection":[32],"dropdownExpand":[32],"dropdownOptions":[32]},[[0,"closeSorter","handleCloseSorter"]]],[1,"tttx-toolbar",{"border":[4],"viewSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-button.cjs",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"iconcolor":[1025],"design":[1]}]]]], options);
20
+ return index.bootstrapLazy([["tttx-data-pattern.cjs",[[1,"tttx-data-pattern",{"data":[1],"sorteroptions":[1],"filteroptions":[1],"filterheader":[1]}]]],["tttx-multiselect-box.cjs",[[1,"tttx-multiselect-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"htmlVisibleValue":[4,"html-visible-value"],"visibleValue":[1,"visible-value"],"open":[32],"unsavedSelectedItems":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-dialog-box.cjs",[[1,"tttx-dialog-box",{"data":[1025],"size":[1],"open":[1028],"allowOverflow":[4,"allow-overflow"],"elementSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-select-box.cjs",[[1,"tttx-select-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"selectedValue":[1,"selected-value"],"open":[32],"selectedItem":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-tree-view.cjs",[[1,"tttx-tree-view",{"data":[1040],"treeData":[32],"selectedId":[32]}]]],["tttx-checkbox.cjs",[[0,"tttx-checkbox",{"checkboxId":[1,"checkbox-id"],"label":[1],"inline":[4],"indeterminate":[4],"checked":[4]}]]],["tttx-dialog.cjs",[[1,"tttx-dialog",{"header":[1],"type":[1],"size":[1],"open":[4],"allowOverflow":[4,"allow-overflow"],"closeEnabled":[4,"close-enabled"],"elementSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-expander.cjs",[[1,"tttx-expander",{"name":[1],"open":[4],"lefticon":[1],"lefticoncolor":[1],"isExpanded":[32]}]]],["tttx-tabs.cjs",[[2,"tttx-tabs",{"tabsName":[1,"tabs-name"],"navigation":[4],"wide":[4],"tabs":[1],"_tabs":[32]},[[0,"keydown","handleKeyDown"]]]]],["tttx-checkbox-group.cjs",[[1,"tttx-checkbox-group"]]],["tttx-checkbox-group-caption.cjs",[[4,"tttx-checkbox-group-caption"]]],["tttx-checkbox-group-heading.cjs",[[4,"tttx-checkbox-group-heading"]]],["tttx-form.cjs",[[1,"tttx-form",{"formschema":[1025],"data":[1032],"submit":[64]}]]],["tttx-keyvalue-block.cjs",[[1,"tttx-keyvalue-block",{"keyvalues":[1],"horizontal":[4],"spacedout":[4],"_elements":[32]}]]],["tttx-loading-spinner.cjs",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-percentage-bar.cjs",[[2,"tttx-percentage-bar",{"percentage":[8],"thresholds":[1],"color":[1],"min":[1],"labelid":[1],"_percentage":[32],"_ranges":[32],"_min":[32]}]]],["tttx-qrcode.cjs",[[1,"tttx-qrcode",{"link":[1025],"size":[1026]}]]],["tttx-tag.cjs",[[1,"tttx-tag",{"text":[1],"color":[1],"textColor":[1,"text-color"]}]]],["tttx-textarea.cjs",[[2,"tttx-textarea",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"rows":[2],"textareaautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"disabled":[4],"maxlength":[8],"name":[1],"placeholder":[1],"readonly":[8],"required":[4],"value":[1032]}]]],["tttx-icon.cjs",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]],["tttx-standalone-input.cjs",[[2,"tttx-standalone-input",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"iconleft":[1],"iconleftcolor":[1],"iconright":[1],"iconrightcolor":[1],"inputicon":[1],"inputiconcolor":[1],"inline":[4],"inputautocapitalize":[1],"inputautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"autocomplete":[1],"checked":[4],"disabled":[4],"max":[8],"maxlength":[8],"min":[8],"minlength":[8],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[8],"required":[4],"step":[8],"type":[1],"value":[1032]}]]],["tttx-filter_4.cjs",[[1,"tttx-filter",{"filterKey":[1,"filter-key"],"filterOptions":[1,"filter-options"],"showSelectAll":[4,"show-select-all"],"showSearchField":[4,"show-search-field"],"showOptionIcons":[4,"show-option-icons"],"filterButtonStyle":[1,"filter-button-style"],"filterHeader":[1,"filter-header"],"defaultFilterOptions":[1,"default-filter-options"],"popoverWidth":[1,"popover-width"],"showPopover":[32],"displayedFilterSettings":[32],"selectedFilters":[32],"filterSearchTerm":[32],"allSelected":[32]},[[0,"closeFilter","handleCloseFilter"]]],[1,"tttx-list",{"data":[1025],"name":[1],"_data":[32]}],[1,"tttx-sorter",{"sorterKey":[1,"sorter-key"],"defaultSortDirection":[1,"default-sort-direction"],"fieldOptionsData":[1,"field-options-data"],"defaultOption":[1,"default-option"],"selectedField":[32],"sortDirection":[32],"dropdownExpand":[32],"dropdownOptions":[32]},[[0,"closeSorter","handleCloseSorter"]]],[1,"tttx-toolbar",{"border":[4],"viewSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-button.cjs",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"iconcolor":[1025],"design":[1]}]]]], options);
21
21
  });
22
22
 
23
23
  exports.setNonce = index.setNonce;
@@ -13,6 +13,7 @@
13
13
  "./components/molecules/tttx-checkbox-group/tttx-checkbox-group.js",
14
14
  "./components/molecules/tttx-checkbox-group/components/tttx-checkbox-group-caption.js",
15
15
  "./components/molecules/tttx-checkbox-group/components/tttx-checkbox-group-heading.js",
16
+ "./components/molecules/tttx-dialog/tttx-dialog.js",
16
17
  "./components/molecules/tttx-dialog-box/tttx-dialog-box.js",
17
18
  "./components/molecules/tttx-expander/tttx-expander.js",
18
19
  "./components/molecules/tttx-form/tttx-form.js",
@@ -0,0 +1,6 @@
1
+ export const ICON_TYPES = {
2
+ critical: { iconName: 'report', iconColor: 'red' },
3
+ info: { iconName: 'info', iconColor: 'blue' },
4
+ success: { iconName: 'check_circle', iconColor: 'green' },
5
+ warning: { iconName: 'warning', iconColor: 'orange' },
6
+ };
@@ -0,0 +1,147 @@
1
+ .material-symbols-rounded {
2
+ font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
3
+ }
4
+
5
+ .material-symbols-rounded {
6
+ font-family: "Material Symbols Rounded", sans-serif;
7
+ font-weight: 400;
8
+ font-style: normal;
9
+ font-size: 24px;
10
+ line-height: 1;
11
+ letter-spacing: normal;
12
+ text-transform: none;
13
+ display: inline-block;
14
+ white-space: nowrap;
15
+ word-wrap: normal;
16
+ direction: ltr;
17
+ text-rendering: optimizeLegibility;
18
+ -webkit-font-smoothing: antialiased;
19
+ color: #9e9e9e;
20
+ }
21
+
22
+ h3 {
23
+ margin-block-start: 0em;
24
+ margin-block-end: 0em;
25
+ }
26
+
27
+ .dialog-box {
28
+ background-color: #ffffff;
29
+ border: 1px solid #d5d5d5;
30
+ border-radius: 4px;
31
+ box-shadow: 0px 1px 5px #1111114d;
32
+ padding: 0;
33
+ }
34
+ .dialog-box.small {
35
+ width: 400px;
36
+ min-height: 200px;
37
+ }
38
+ .dialog-box.regular {
39
+ width: 600px;
40
+ min-height: 200px;
41
+ }
42
+ .dialog-box.large {
43
+ width: 900px;
44
+ min-height: 200px;
45
+ }
46
+ .dialog-box.mobile {
47
+ max-width: 424px;
48
+ width: calc(100vw - 20px);
49
+ }
50
+
51
+ .overflow-visible {
52
+ overflow: visible;
53
+ }
54
+
55
+ .overflow-hidden {
56
+ overflow: hidden;
57
+ }
58
+
59
+ dialog::backdrop {
60
+ background-color: #75757580;
61
+ }
62
+
63
+ .clickable {
64
+ cursor: pointer;
65
+ }
66
+
67
+ .contents {
68
+ display: flex;
69
+ flex-direction: column;
70
+ min-height: inherit;
71
+ }
72
+
73
+ .padding {
74
+ padding: 8px 16px;
75
+ }
76
+
77
+ .align-right {
78
+ margin-left: auto;
79
+ display: flex;
80
+ }
81
+
82
+ .header {
83
+ border-bottom: 1px solid #d5d5d5;
84
+ display: flex;
85
+ flex-direction: row;
86
+ align-items: center;
87
+ height: 36px;
88
+ }
89
+
90
+ .title {
91
+ font-size: 18;
92
+ font-weight: 500;
93
+ font-family: "Roboto", serif;
94
+ }
95
+
96
+ .icon {
97
+ padding-right: 8px;
98
+ width: 24px;
99
+ height: 24px;
100
+ }
101
+
102
+ .icon-close {
103
+ margin-left: auto;
104
+ padding-top: 3px;
105
+ width: 24px;
106
+ height: 24px;
107
+ }
108
+
109
+ .body-content {
110
+ font-size: 16;
111
+ font-weight: 400;
112
+ font-family: "Roboto", serif;
113
+ }
114
+
115
+ .body {
116
+ text-overflow: ellipsis;
117
+ padding: 16px;
118
+ }
119
+
120
+ .footer {
121
+ display: flex;
122
+ flex-direction: row;
123
+ margin-top: auto;
124
+ border-top: 1px solid #d5d5d5;
125
+ height: 36px;
126
+ }
127
+
128
+ ::slotted([slot=buttons]) {
129
+ display: flex;
130
+ gap: 8px;
131
+ }
132
+
133
+ .header.info {
134
+ border-bottom: 1px solid #1479c6;
135
+ }
136
+
137
+ .header.success {
138
+ border-bottom: 1px solid #a2bb31;
139
+ }
140
+
141
+ .header.warning {
142
+ border-bottom: 1px solid #f59500;
143
+ }
144
+
145
+ .header.critical {
146
+ border-bottom: 1px solid #dc0000;
147
+ }
@@ -0,0 +1,218 @@
1
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
2
+ import { h } from '@stencil/core';
3
+ import { ICON_TYPES } from './icon-types';
4
+ export class TttxDialog {
5
+ constructor() {
6
+ this.header = undefined;
7
+ this.type = undefined;
8
+ this.size = 'regular';
9
+ this.open = false;
10
+ this.allowOverflow = false;
11
+ this.closeEnabled = true;
12
+ this.elementSize = undefined;
13
+ }
14
+ handleResize() {
15
+ if (window.innerWidth < 698) {
16
+ this.elementSize = 'mobile';
17
+ }
18
+ else {
19
+ this.elementSize = this.size;
20
+ }
21
+ }
22
+ preventCancelOnDialog(event) {
23
+ event.preventDefault();
24
+ }
25
+ componentDidLoad() {
26
+ this.dialog.addEventListener('cancel', this.preventCancelOnDialog);
27
+ }
28
+ onCloseClickHandler() {
29
+ this.closeButtonClick.emit();
30
+ }
31
+ headerIconDetails(iconEnabled) {
32
+ if (!iconEnabled)
33
+ return { iconName: undefined, iconColor: undefined };
34
+ return ICON_TYPES[this.type];
35
+ }
36
+ renderHeader() {
37
+ const iconEnabled = typeof this.type !== 'undefined';
38
+ const { iconName, iconColor } = this.headerIconDetails(iconEnabled);
39
+ return (h("div", { class: `padding header ${this.type || ''}` }, iconEnabled && h("tttx-icon", { class: "icon", icon: iconName, color: iconColor }), h("h3", { class: "title" }, this.header), this.closeEnabled && (h("div", { class: "align-right close-button", onClick: () => this.onCloseClickHandler() }, h("tttx-icon", { class: "icon-close clickable", icon: "close", color: "black" })))));
40
+ }
41
+ body() {
42
+ return (h("div", { class: `body ${!this.allowOverflow ? 'overflow-hidden' : ''}` }, h("span", { class: "body-content" }, h("slot", null))));
43
+ }
44
+ footer() {
45
+ if (!this.el.querySelector('[slot="buttons"]'))
46
+ return;
47
+ return (h("div", { class: "padding footer" }, h("div", { class: "align-right" }, h("slot", { name: "buttons" }))));
48
+ }
49
+ componentDidRender() {
50
+ if (!this.open) {
51
+ this.dialog.close();
52
+ return;
53
+ }
54
+ if (!this.dialog.open)
55
+ this.dialog.showModal();
56
+ }
57
+ componentWillLoad() {
58
+ this.handleResize();
59
+ }
60
+ render() {
61
+ return (h("dialog", { ref: (el) => this.dialog = el, class: `dialog-box ${this.allowOverflow ? 'overflow-visible' : ''} ${this.elementSize}` }, h("div", { class: "contents" }, this.renderHeader(), this.body(), this.footer())));
62
+ }
63
+ static get is() { return "tttx-dialog"; }
64
+ static get encapsulation() { return "shadow"; }
65
+ static get originalStyleUrls() {
66
+ return {
67
+ "$": ["tttx-dialog.scss"]
68
+ };
69
+ }
70
+ static get styleUrls() {
71
+ return {
72
+ "$": ["tttx-dialog.css"]
73
+ };
74
+ }
75
+ static get properties() {
76
+ return {
77
+ "header": {
78
+ "type": "string",
79
+ "mutable": false,
80
+ "complexType": {
81
+ "original": "string",
82
+ "resolved": "string",
83
+ "references": {}
84
+ },
85
+ "required": false,
86
+ "optional": false,
87
+ "docs": {
88
+ "tags": [],
89
+ "text": ""
90
+ },
91
+ "attribute": "header",
92
+ "reflect": false
93
+ },
94
+ "type": {
95
+ "type": "string",
96
+ "mutable": false,
97
+ "complexType": {
98
+ "original": "'info' | 'success' | 'warning' | 'critical' | undefined",
99
+ "resolved": "\"critical\" | \"info\" | \"success\" | \"warning\"",
100
+ "references": {}
101
+ },
102
+ "required": false,
103
+ "optional": false,
104
+ "docs": {
105
+ "tags": [],
106
+ "text": ""
107
+ },
108
+ "attribute": "type",
109
+ "reflect": false
110
+ },
111
+ "size": {
112
+ "type": "string",
113
+ "mutable": false,
114
+ "complexType": {
115
+ "original": "'regular' | 'mobile' | 'large' | 'small'",
116
+ "resolved": "\"large\" | \"mobile\" | \"regular\" | \"small\"",
117
+ "references": {}
118
+ },
119
+ "required": false,
120
+ "optional": false,
121
+ "docs": {
122
+ "tags": [],
123
+ "text": ""
124
+ },
125
+ "attribute": "size",
126
+ "reflect": false,
127
+ "defaultValue": "'regular'"
128
+ },
129
+ "open": {
130
+ "type": "boolean",
131
+ "mutable": false,
132
+ "complexType": {
133
+ "original": "boolean",
134
+ "resolved": "boolean",
135
+ "references": {}
136
+ },
137
+ "required": false,
138
+ "optional": false,
139
+ "docs": {
140
+ "tags": [],
141
+ "text": ""
142
+ },
143
+ "attribute": "open",
144
+ "reflect": false,
145
+ "defaultValue": "false"
146
+ },
147
+ "allowOverflow": {
148
+ "type": "boolean",
149
+ "mutable": false,
150
+ "complexType": {
151
+ "original": "boolean",
152
+ "resolved": "boolean",
153
+ "references": {}
154
+ },
155
+ "required": false,
156
+ "optional": false,
157
+ "docs": {
158
+ "tags": [],
159
+ "text": ""
160
+ },
161
+ "attribute": "allow-overflow",
162
+ "reflect": false,
163
+ "defaultValue": "false"
164
+ },
165
+ "closeEnabled": {
166
+ "type": "boolean",
167
+ "mutable": false,
168
+ "complexType": {
169
+ "original": "boolean",
170
+ "resolved": "boolean",
171
+ "references": {}
172
+ },
173
+ "required": false,
174
+ "optional": false,
175
+ "docs": {
176
+ "tags": [],
177
+ "text": ""
178
+ },
179
+ "attribute": "close-enabled",
180
+ "reflect": false,
181
+ "defaultValue": "true"
182
+ }
183
+ };
184
+ }
185
+ static get states() {
186
+ return {
187
+ "elementSize": {}
188
+ };
189
+ }
190
+ static get events() {
191
+ return [{
192
+ "method": "closeButtonClick",
193
+ "name": "closeButtonClick",
194
+ "bubbles": true,
195
+ "cancelable": false,
196
+ "composed": true,
197
+ "docs": {
198
+ "tags": [],
199
+ "text": ""
200
+ },
201
+ "complexType": {
202
+ "original": "any",
203
+ "resolved": "any",
204
+ "references": {}
205
+ }
206
+ }];
207
+ }
208
+ static get elementRef() { return "el"; }
209
+ static get listeners() {
210
+ return [{
211
+ "name": "resize",
212
+ "method": "handleResize",
213
+ "target": "window",
214
+ "capture": false,
215
+ "passive": true
216
+ }];
217
+ }
218
+ }
@@ -0,0 +1,98 @@
1
+ import { withActions } from '@storybook/addon-actions/decorator';
2
+ export default {
3
+ title: 'molecules/Dialog V2',
4
+ component: 'tttx-dialog',
5
+ argTypes: {
6
+ header: {
7
+ control: { type: 'text' },
8
+ },
9
+ type: {
10
+ control: { type: 'select' },
11
+ options: ['info', 'success', 'warning', 'critical', undefined],
12
+ },
13
+ size: {
14
+ control: { type: 'select' },
15
+ options: ['regular', 'mobile', 'large', 'small', undefined]
16
+ },
17
+ closeEnabled: {
18
+ control: { type: 'switch' }
19
+ }
20
+ },
21
+ parameters: {
22
+ actions: {
23
+ handles: ['closeButtonClick'],
24
+ },
25
+ docs: {
26
+ description: {
27
+ component: 'A second version of the dialog component, which uses slots instead of html strings.',
28
+ },
29
+ },
30
+ },
31
+ decorators: [withActions],
32
+ };
33
+ const TttxDialogStory = (args) => `
34
+ <button onclick="openDialog()">Open</button>
35
+ <tttx-dialog
36
+ id='dialog'
37
+ header='${args.header}'
38
+ close-enabled='${args.closeEnabled}'
39
+ ${args.type ? `type='${args.type}'` : ''}
40
+ ${args.size ? `size='${args.size}'` : ''}
41
+ >
42
+ This is the default dialog
43
+ <div slot="buttons">
44
+ <tttx-button design="primary">Primary</tttx-button>
45
+ <tttx-button onClick="closeDialog()">Cancel</tttx-button>
46
+ </div>
47
+ </tttx-dialog>
48
+ <script>
49
+ if(!openDialog) {
50
+ function openDialog() {
51
+ dialog.open = true;
52
+ }
53
+ }
54
+ if(!closeDialog) {
55
+ function closeDialog() {
56
+ dialog.open = false
57
+ }
58
+ }
59
+ dialog.removeEventListener('closeButtonClick', closeDialog)
60
+ dialog.addEventListener('closeButtonClick', closeDialog)
61
+ </script>
62
+ `;
63
+ export const Default = TttxDialogStory.bind({});
64
+ Default.args = {
65
+ header: 'Dialog Title',
66
+ closeEnabled: true
67
+ };
68
+ const TttxDialogWithoutFooterStory = (args) => `
69
+ <button onclick="openDialogNoFooter()">Open</button>
70
+ <tttx-dialog
71
+ id='dialogNoFooter'
72
+ header='${args.header}'
73
+ close-enabled='${args.closeEnabled}'
74
+ ${args.type ? `type='${args.type}'` : ''}
75
+ ${args.size ? `size='${args.size}'` : ''}
76
+ >
77
+ This dialog has no footer
78
+ </tttx-dialog>
79
+ <script>
80
+ if(!openDialogNoFooter) {
81
+ function openDialogNoFooter() {
82
+ dialogNoFooter.open = true;
83
+ }
84
+ }
85
+ if(!closeDialogNoFooter) {
86
+ function closeDialogNoFooter() {
87
+ dialogNoFooter.open = false
88
+ }
89
+ }
90
+ dialogNoFooter.removeEventListener('closeButtonClick', closeDialogNoFooter)
91
+ dialogNoFooter.addEventListener('closeButtonClick', closeDialogNoFooter)
92
+ </script>
93
+ `;
94
+ export const WithoutFooter = TttxDialogWithoutFooterStory.bind({});
95
+ WithoutFooter.args = {
96
+ header: 'Dialog Title',
97
+ closeEnabled: true
98
+ };
@@ -5,6 +5,7 @@ export { TttxCheckboxGroup as TttxCheckboxGroup } from '../types/components/mole
5
5
  export { TttxCheckboxGroupCaption as TttxCheckboxGroupCaption } from '../types/components/molecules/tttx-checkbox-group/components/tttx-checkbox-group-caption';
6
6
  export { TttxCheckboxGroupHeading as TttxCheckboxGroupHeading } from '../types/components/molecules/tttx-checkbox-group/components/tttx-checkbox-group-heading';
7
7
  export { TttxDataPattern as TttxDataPattern } from '../types/components/organisms/tttx-data-pattern/tttx-data-pattern';
8
+ export { TttxDialog as TttxDialog } from '../types/components/molecules/tttx-dialog/tttx-dialog';
8
9
  export { TttxDialogBox as TttxDialogBox } from '../types/components/molecules/tttx-dialog-box/tttx-dialog-box';
9
10
  export { TttxExpander as TttxExpander } from '../types/components/molecules/tttx-expander/tttx-expander';
10
11
  export { TttxFilter as TttxFilter } from '../types/components/molecules/tttx-filter/tttx-filter';
@@ -5,6 +5,7 @@ export { TttxCheckboxGroup, defineCustomElement as defineCustomElementTttxCheckb
5
5
  export { TttxCheckboxGroupCaption, defineCustomElement as defineCustomElementTttxCheckboxGroupCaption } from './tttx-checkbox-group-caption.js';
6
6
  export { TttxCheckboxGroupHeading, defineCustomElement as defineCustomElementTttxCheckboxGroupHeading } from './tttx-checkbox-group-heading.js';
7
7
  export { TttxDataPattern, defineCustomElement as defineCustomElementTttxDataPattern } from './tttx-data-pattern.js';
8
+ export { TttxDialog, defineCustomElement as defineCustomElementTttxDialog } from './tttx-dialog.js';
8
9
  export { TttxDialogBox, defineCustomElement as defineCustomElementTttxDialogBox } from './tttx-dialog-box.js';
9
10
  export { TttxExpander, defineCustomElement as defineCustomElementTttxExpander } from './tttx-expander.js';
10
11
  export { TttxFilter, defineCustomElement as defineCustomElementTttxFilter } from './tttx-filter.js';
@@ -0,0 +1,11 @@
1
+ import type { Components, JSX } from "../types/components";
2
+
3
+ interface TttxDialog extends Components.TttxDialog, HTMLElement {}
4
+ export const TttxDialog: {
5
+ prototype: TttxDialog;
6
+ new (): TttxDialog;
7
+ };
8
+ /**
9
+ * Used to define this component and all nested components recursively.
10
+ */
11
+ export const defineCustomElement: () => void;
@@ -0,0 +1,109 @@
1
+ import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
2
+ import { d as defineCustomElement$2 } from './tttx-icon2.js';
3
+
4
+ const ICON_TYPES = {
5
+ critical: { iconName: 'report', iconColor: 'red' },
6
+ info: { iconName: 'info', iconColor: 'blue' },
7
+ success: { iconName: 'check_circle', iconColor: 'green' },
8
+ warning: { iconName: 'warning', iconColor: 'orange' },
9
+ };
10
+
11
+ const tttxDialogCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.material-symbols-rounded{font-family:\"Material Symbols Rounded\", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}h3{margin-block-start:0em;margin-block-end:0em}.dialog-box{background-color:#ffffff;border:1px solid #d5d5d5;border-radius:4px;box-shadow:0px 1px 5px #1111114d;padding:0}.dialog-box.small{width:400px;min-height:200px}.dialog-box.regular{width:600px;min-height:200px}.dialog-box.large{width:900px;min-height:200px}.dialog-box.mobile{max-width:424px;width:calc(100vw - 20px)}.overflow-visible{overflow:visible}.overflow-hidden{overflow:hidden}dialog::backdrop{background-color:#75757580}.clickable{cursor:pointer}.contents{display:flex;flex-direction:column;min-height:inherit}.padding{padding:8px 16px}.align-right{margin-left:auto;display:flex}.header{border-bottom:1px solid #d5d5d5;display:flex;flex-direction:row;align-items:center;height:36px}.title{font-size:18;font-weight:500;font-family:\"Roboto\", serif}.icon{padding-right:8px;width:24px;height:24px}.icon-close{margin-left:auto;padding-top:3px;width:24px;height:24px}.body-content{font-size:16;font-weight:400;font-family:\"Roboto\", serif}.body{text-overflow:ellipsis;padding:16px}.footer{display:flex;flex-direction:row;margin-top:auto;border-top:1px solid #d5d5d5;height:36px}::slotted([slot=buttons]){display:flex;gap:8px}.header.info{border-bottom:1px solid #1479c6}.header.success{border-bottom:1px solid #a2bb31}.header.warning{border-bottom:1px solid #f59500}.header.critical{border-bottom:1px solid #dc0000}";
12
+
13
+ const TttxDialog$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
14
+ constructor() {
15
+ super();
16
+ this.__registerHost();
17
+ this.__attachShadow();
18
+ this.closeButtonClick = createEvent(this, "closeButtonClick", 6);
19
+ this.header = undefined;
20
+ this.type = undefined;
21
+ this.size = 'regular';
22
+ this.open = false;
23
+ this.allowOverflow = false;
24
+ this.closeEnabled = true;
25
+ this.elementSize = undefined;
26
+ }
27
+ handleResize() {
28
+ if (window.innerWidth < 698) {
29
+ this.elementSize = 'mobile';
30
+ }
31
+ else {
32
+ this.elementSize = this.size;
33
+ }
34
+ }
35
+ preventCancelOnDialog(event) {
36
+ event.preventDefault();
37
+ }
38
+ componentDidLoad() {
39
+ this.dialog.addEventListener('cancel', this.preventCancelOnDialog);
40
+ }
41
+ onCloseClickHandler() {
42
+ this.closeButtonClick.emit();
43
+ }
44
+ headerIconDetails(iconEnabled) {
45
+ if (!iconEnabled)
46
+ return { iconName: undefined, iconColor: undefined };
47
+ return ICON_TYPES[this.type];
48
+ }
49
+ renderHeader() {
50
+ const iconEnabled = typeof this.type !== 'undefined';
51
+ const { iconName, iconColor } = this.headerIconDetails(iconEnabled);
52
+ return (h("div", { class: `padding header ${this.type || ''}` }, iconEnabled && h("tttx-icon", { class: "icon", icon: iconName, color: iconColor }), h("h3", { class: "title" }, this.header), this.closeEnabled && (h("div", { class: "align-right close-button", onClick: () => this.onCloseClickHandler() }, h("tttx-icon", { class: "icon-close clickable", icon: "close", color: "black" })))));
53
+ }
54
+ body() {
55
+ return (h("div", { class: `body ${!this.allowOverflow ? 'overflow-hidden' : ''}` }, h("span", { class: "body-content" }, h("slot", null))));
56
+ }
57
+ footer() {
58
+ if (!this.el.querySelector('[slot="buttons"]'))
59
+ return;
60
+ return (h("div", { class: "padding footer" }, h("div", { class: "align-right" }, h("slot", { name: "buttons" }))));
61
+ }
62
+ componentDidRender() {
63
+ if (!this.open) {
64
+ this.dialog.close();
65
+ return;
66
+ }
67
+ if (!this.dialog.open)
68
+ this.dialog.showModal();
69
+ }
70
+ componentWillLoad() {
71
+ this.handleResize();
72
+ }
73
+ render() {
74
+ return (h("dialog", { ref: (el) => this.dialog = el, class: `dialog-box ${this.allowOverflow ? 'overflow-visible' : ''} ${this.elementSize}` }, h("div", { class: "contents" }, this.renderHeader(), this.body(), this.footer())));
75
+ }
76
+ get el() { return this; }
77
+ static get style() { return tttxDialogCss; }
78
+ }, [1, "tttx-dialog", {
79
+ "header": [1],
80
+ "type": [1],
81
+ "size": [1],
82
+ "open": [4],
83
+ "allowOverflow": [4, "allow-overflow"],
84
+ "closeEnabled": [4, "close-enabled"],
85
+ "elementSize": [32]
86
+ }, [[9, "resize", "handleResize"]]]);
87
+ function defineCustomElement$1() {
88
+ if (typeof customElements === "undefined") {
89
+ return;
90
+ }
91
+ const components = ["tttx-dialog", "tttx-icon"];
92
+ components.forEach(tagName => { switch (tagName) {
93
+ case "tttx-dialog":
94
+ if (!customElements.get(tagName)) {
95
+ customElements.define(tagName, TttxDialog$1);
96
+ }
97
+ break;
98
+ case "tttx-icon":
99
+ if (!customElements.get(tagName)) {
100
+ defineCustomElement$2();
101
+ }
102
+ break;
103
+ } });
104
+ }
105
+
106
+ const TttxDialog = TttxDialog$1;
107
+ const defineCustomElement = defineCustomElement$1;
108
+
109
+ export { TttxDialog, defineCustomElement };
@@ -11,7 +11,7 @@ const patchEsm = () => {
11
11
  const defineCustomElements = (win, options) => {
12
12
  if (typeof window === 'undefined') return Promise.resolve();
13
13
  return patchEsm().then(() => {
14
- return bootstrapLazy([["tttx-data-pattern",[[1,"tttx-data-pattern",{"data":[1],"sorteroptions":[1],"filteroptions":[1],"filterheader":[1]}]]],["tttx-multiselect-box",[[1,"tttx-multiselect-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"htmlVisibleValue":[4,"html-visible-value"],"visibleValue":[1,"visible-value"],"open":[32],"unsavedSelectedItems":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-dialog-box",[[1,"tttx-dialog-box",{"data":[1025],"size":[1],"open":[1028],"allowOverflow":[4,"allow-overflow"],"elementSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-select-box",[[1,"tttx-select-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"selectedValue":[1,"selected-value"],"open":[32],"selectedItem":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-tree-view",[[1,"tttx-tree-view",{"data":[1040],"treeData":[32],"selectedId":[32]}]]],["tttx-checkbox",[[0,"tttx-checkbox",{"checkboxId":[1,"checkbox-id"],"label":[1],"inline":[4],"indeterminate":[4],"checked":[4]}]]],["tttx-expander",[[1,"tttx-expander",{"name":[1],"open":[4],"lefticon":[1],"lefticoncolor":[1],"isExpanded":[32]}]]],["tttx-tabs",[[2,"tttx-tabs",{"tabsName":[1,"tabs-name"],"navigation":[4],"wide":[4],"tabs":[1],"_tabs":[32]},[[0,"keydown","handleKeyDown"]]]]],["tttx-checkbox-group",[[1,"tttx-checkbox-group"]]],["tttx-checkbox-group-caption",[[4,"tttx-checkbox-group-caption"]]],["tttx-checkbox-group-heading",[[4,"tttx-checkbox-group-heading"]]],["tttx-form",[[1,"tttx-form",{"formschema":[1025],"data":[1032],"submit":[64]}]]],["tttx-keyvalue-block",[[1,"tttx-keyvalue-block",{"keyvalues":[1],"horizontal":[4],"spacedout":[4],"_elements":[32]}]]],["tttx-loading-spinner",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-percentage-bar",[[2,"tttx-percentage-bar",{"percentage":[8],"thresholds":[1],"color":[1],"min":[1],"labelid":[1],"_percentage":[32],"_ranges":[32],"_min":[32]}]]],["tttx-qrcode",[[1,"tttx-qrcode",{"link":[1025],"size":[1026]}]]],["tttx-tag",[[1,"tttx-tag",{"text":[1],"color":[1],"textColor":[1,"text-color"]}]]],["tttx-textarea",[[2,"tttx-textarea",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"rows":[2],"textareaautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"disabled":[4],"maxlength":[8],"name":[1],"placeholder":[1],"readonly":[8],"required":[4],"value":[1032]}]]],["tttx-icon",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]],["tttx-standalone-input",[[2,"tttx-standalone-input",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"iconleft":[1],"iconleftcolor":[1],"iconright":[1],"iconrightcolor":[1],"inputicon":[1],"inputiconcolor":[1],"inline":[4],"inputautocapitalize":[1],"inputautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"autocomplete":[1],"checked":[4],"disabled":[4],"max":[8],"maxlength":[8],"min":[8],"minlength":[8],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[8],"required":[4],"step":[8],"type":[1],"value":[1032]}]]],["tttx-filter_4",[[1,"tttx-filter",{"filterKey":[1,"filter-key"],"filterOptions":[1,"filter-options"],"showSelectAll":[4,"show-select-all"],"showSearchField":[4,"show-search-field"],"showOptionIcons":[4,"show-option-icons"],"filterButtonStyle":[1,"filter-button-style"],"filterHeader":[1,"filter-header"],"defaultFilterOptions":[1,"default-filter-options"],"popoverWidth":[1,"popover-width"],"showPopover":[32],"displayedFilterSettings":[32],"selectedFilters":[32],"filterSearchTerm":[32],"allSelected":[32]},[[0,"closeFilter","handleCloseFilter"]]],[1,"tttx-list",{"data":[1025],"name":[1],"_data":[32]}],[1,"tttx-sorter",{"sorterKey":[1,"sorter-key"],"defaultSortDirection":[1,"default-sort-direction"],"fieldOptionsData":[1,"field-options-data"],"defaultOption":[1,"default-option"],"selectedField":[32],"sortDirection":[32],"dropdownExpand":[32],"dropdownOptions":[32]},[[0,"closeSorter","handleCloseSorter"]]],[1,"tttx-toolbar",{"border":[4],"viewSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"iconcolor":[1025],"design":[1]}]]]], options);
14
+ return bootstrapLazy([["tttx-data-pattern",[[1,"tttx-data-pattern",{"data":[1],"sorteroptions":[1],"filteroptions":[1],"filterheader":[1]}]]],["tttx-multiselect-box",[[1,"tttx-multiselect-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"htmlVisibleValue":[4,"html-visible-value"],"visibleValue":[1,"visible-value"],"open":[32],"unsavedSelectedItems":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-dialog-box",[[1,"tttx-dialog-box",{"data":[1025],"size":[1],"open":[1028],"allowOverflow":[4,"allow-overflow"],"elementSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-select-box",[[1,"tttx-select-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"selectedValue":[1,"selected-value"],"open":[32],"selectedItem":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-tree-view",[[1,"tttx-tree-view",{"data":[1040],"treeData":[32],"selectedId":[32]}]]],["tttx-checkbox",[[0,"tttx-checkbox",{"checkboxId":[1,"checkbox-id"],"label":[1],"inline":[4],"indeterminate":[4],"checked":[4]}]]],["tttx-dialog",[[1,"tttx-dialog",{"header":[1],"type":[1],"size":[1],"open":[4],"allowOverflow":[4,"allow-overflow"],"closeEnabled":[4,"close-enabled"],"elementSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-expander",[[1,"tttx-expander",{"name":[1],"open":[4],"lefticon":[1],"lefticoncolor":[1],"isExpanded":[32]}]]],["tttx-tabs",[[2,"tttx-tabs",{"tabsName":[1,"tabs-name"],"navigation":[4],"wide":[4],"tabs":[1],"_tabs":[32]},[[0,"keydown","handleKeyDown"]]]]],["tttx-checkbox-group",[[1,"tttx-checkbox-group"]]],["tttx-checkbox-group-caption",[[4,"tttx-checkbox-group-caption"]]],["tttx-checkbox-group-heading",[[4,"tttx-checkbox-group-heading"]]],["tttx-form",[[1,"tttx-form",{"formschema":[1025],"data":[1032],"submit":[64]}]]],["tttx-keyvalue-block",[[1,"tttx-keyvalue-block",{"keyvalues":[1],"horizontal":[4],"spacedout":[4],"_elements":[32]}]]],["tttx-loading-spinner",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-percentage-bar",[[2,"tttx-percentage-bar",{"percentage":[8],"thresholds":[1],"color":[1],"min":[1],"labelid":[1],"_percentage":[32],"_ranges":[32],"_min":[32]}]]],["tttx-qrcode",[[1,"tttx-qrcode",{"link":[1025],"size":[1026]}]]],["tttx-tag",[[1,"tttx-tag",{"text":[1],"color":[1],"textColor":[1,"text-color"]}]]],["tttx-textarea",[[2,"tttx-textarea",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"rows":[2],"textareaautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"disabled":[4],"maxlength":[8],"name":[1],"placeholder":[1],"readonly":[8],"required":[4],"value":[1032]}]]],["tttx-icon",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]],["tttx-standalone-input",[[2,"tttx-standalone-input",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"iconleft":[1],"iconleftcolor":[1],"iconright":[1],"iconrightcolor":[1],"inputicon":[1],"inputiconcolor":[1],"inline":[4],"inputautocapitalize":[1],"inputautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"autocomplete":[1],"checked":[4],"disabled":[4],"max":[8],"maxlength":[8],"min":[8],"minlength":[8],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[8],"required":[4],"step":[8],"type":[1],"value":[1032]}]]],["tttx-filter_4",[[1,"tttx-filter",{"filterKey":[1,"filter-key"],"filterOptions":[1,"filter-options"],"showSelectAll":[4,"show-select-all"],"showSearchField":[4,"show-search-field"],"showOptionIcons":[4,"show-option-icons"],"filterButtonStyle":[1,"filter-button-style"],"filterHeader":[1,"filter-header"],"defaultFilterOptions":[1,"default-filter-options"],"popoverWidth":[1,"popover-width"],"showPopover":[32],"displayedFilterSettings":[32],"selectedFilters":[32],"filterSearchTerm":[32],"allSelected":[32]},[[0,"closeFilter","handleCloseFilter"]]],[1,"tttx-list",{"data":[1025],"name":[1],"_data":[32]}],[1,"tttx-sorter",{"sorterKey":[1,"sorter-key"],"defaultSortDirection":[1,"default-sort-direction"],"fieldOptionsData":[1,"field-options-data"],"defaultOption":[1,"default-option"],"selectedField":[32],"sortDirection":[32],"dropdownExpand":[32],"dropdownOptions":[32]},[[0,"closeSorter","handleCloseSorter"]]],[1,"tttx-toolbar",{"border":[4],"viewSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"iconcolor":[1025],"design":[1]}]]]], options);
15
15
  });
16
16
  };
17
17
 
@@ -0,0 +1,77 @@
1
+ import { r as registerInstance, c as createEvent, h, g as getElement } from './index-b11965d8.js';
2
+
3
+ const ICON_TYPES = {
4
+ critical: { iconName: 'report', iconColor: 'red' },
5
+ info: { iconName: 'info', iconColor: 'blue' },
6
+ success: { iconName: 'check_circle', iconColor: 'green' },
7
+ warning: { iconName: 'warning', iconColor: 'orange' },
8
+ };
9
+
10
+ const tttxDialogCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.material-symbols-rounded{font-family:\"Material Symbols Rounded\", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}h3{margin-block-start:0em;margin-block-end:0em}.dialog-box{background-color:#ffffff;border:1px solid #d5d5d5;border-radius:4px;box-shadow:0px 1px 5px #1111114d;padding:0}.dialog-box.small{width:400px;min-height:200px}.dialog-box.regular{width:600px;min-height:200px}.dialog-box.large{width:900px;min-height:200px}.dialog-box.mobile{max-width:424px;width:calc(100vw - 20px)}.overflow-visible{overflow:visible}.overflow-hidden{overflow:hidden}dialog::backdrop{background-color:#75757580}.clickable{cursor:pointer}.contents{display:flex;flex-direction:column;min-height:inherit}.padding{padding:8px 16px}.align-right{margin-left:auto;display:flex}.header{border-bottom:1px solid #d5d5d5;display:flex;flex-direction:row;align-items:center;height:36px}.title{font-size:18;font-weight:500;font-family:\"Roboto\", serif}.icon{padding-right:8px;width:24px;height:24px}.icon-close{margin-left:auto;padding-top:3px;width:24px;height:24px}.body-content{font-size:16;font-weight:400;font-family:\"Roboto\", serif}.body{text-overflow:ellipsis;padding:16px}.footer{display:flex;flex-direction:row;margin-top:auto;border-top:1px solid #d5d5d5;height:36px}::slotted([slot=buttons]){display:flex;gap:8px}.header.info{border-bottom:1px solid #1479c6}.header.success{border-bottom:1px solid #a2bb31}.header.warning{border-bottom:1px solid #f59500}.header.critical{border-bottom:1px solid #dc0000}";
11
+
12
+ const TttxDialog = class {
13
+ constructor(hostRef) {
14
+ registerInstance(this, hostRef);
15
+ this.closeButtonClick = createEvent(this, "closeButtonClick", 6);
16
+ this.header = undefined;
17
+ this.type = undefined;
18
+ this.size = 'regular';
19
+ this.open = false;
20
+ this.allowOverflow = false;
21
+ this.closeEnabled = true;
22
+ this.elementSize = undefined;
23
+ }
24
+ handleResize() {
25
+ if (window.innerWidth < 698) {
26
+ this.elementSize = 'mobile';
27
+ }
28
+ else {
29
+ this.elementSize = this.size;
30
+ }
31
+ }
32
+ preventCancelOnDialog(event) {
33
+ event.preventDefault();
34
+ }
35
+ componentDidLoad() {
36
+ this.dialog.addEventListener('cancel', this.preventCancelOnDialog);
37
+ }
38
+ onCloseClickHandler() {
39
+ this.closeButtonClick.emit();
40
+ }
41
+ headerIconDetails(iconEnabled) {
42
+ if (!iconEnabled)
43
+ return { iconName: undefined, iconColor: undefined };
44
+ return ICON_TYPES[this.type];
45
+ }
46
+ renderHeader() {
47
+ const iconEnabled = typeof this.type !== 'undefined';
48
+ const { iconName, iconColor } = this.headerIconDetails(iconEnabled);
49
+ return (h("div", { class: `padding header ${this.type || ''}` }, iconEnabled && h("tttx-icon", { class: "icon", icon: iconName, color: iconColor }), h("h3", { class: "title" }, this.header), this.closeEnabled && (h("div", { class: "align-right close-button", onClick: () => this.onCloseClickHandler() }, h("tttx-icon", { class: "icon-close clickable", icon: "close", color: "black" })))));
50
+ }
51
+ body() {
52
+ return (h("div", { class: `body ${!this.allowOverflow ? 'overflow-hidden' : ''}` }, h("span", { class: "body-content" }, h("slot", null))));
53
+ }
54
+ footer() {
55
+ if (!this.el.querySelector('[slot="buttons"]'))
56
+ return;
57
+ return (h("div", { class: "padding footer" }, h("div", { class: "align-right" }, h("slot", { name: "buttons" }))));
58
+ }
59
+ componentDidRender() {
60
+ if (!this.open) {
61
+ this.dialog.close();
62
+ return;
63
+ }
64
+ if (!this.dialog.open)
65
+ this.dialog.showModal();
66
+ }
67
+ componentWillLoad() {
68
+ this.handleResize();
69
+ }
70
+ render() {
71
+ return (h("dialog", { ref: (el) => this.dialog = el, class: `dialog-box ${this.allowOverflow ? 'overflow-visible' : ''} ${this.elementSize}` }, h("div", { class: "contents" }, this.renderHeader(), this.body(), this.footer())));
72
+ }
73
+ get el() { return getElement(this); }
74
+ };
75
+ TttxDialog.style = tttxDialogCss;
76
+
77
+ export { TttxDialog as tttx_dialog };
package/dist/esm/tttx.js CHANGED
@@ -14,5 +14,5 @@ const patchBrowser = () => {
14
14
  };
15
15
 
16
16
  patchBrowser().then(options => {
17
- return bootstrapLazy([["tttx-data-pattern",[[1,"tttx-data-pattern",{"data":[1],"sorteroptions":[1],"filteroptions":[1],"filterheader":[1]}]]],["tttx-multiselect-box",[[1,"tttx-multiselect-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"htmlVisibleValue":[4,"html-visible-value"],"visibleValue":[1,"visible-value"],"open":[32],"unsavedSelectedItems":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-dialog-box",[[1,"tttx-dialog-box",{"data":[1025],"size":[1],"open":[1028],"allowOverflow":[4,"allow-overflow"],"elementSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-select-box",[[1,"tttx-select-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"selectedValue":[1,"selected-value"],"open":[32],"selectedItem":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-tree-view",[[1,"tttx-tree-view",{"data":[1040],"treeData":[32],"selectedId":[32]}]]],["tttx-checkbox",[[0,"tttx-checkbox",{"checkboxId":[1,"checkbox-id"],"label":[1],"inline":[4],"indeterminate":[4],"checked":[4]}]]],["tttx-expander",[[1,"tttx-expander",{"name":[1],"open":[4],"lefticon":[1],"lefticoncolor":[1],"isExpanded":[32]}]]],["tttx-tabs",[[2,"tttx-tabs",{"tabsName":[1,"tabs-name"],"navigation":[4],"wide":[4],"tabs":[1],"_tabs":[32]},[[0,"keydown","handleKeyDown"]]]]],["tttx-checkbox-group",[[1,"tttx-checkbox-group"]]],["tttx-checkbox-group-caption",[[4,"tttx-checkbox-group-caption"]]],["tttx-checkbox-group-heading",[[4,"tttx-checkbox-group-heading"]]],["tttx-form",[[1,"tttx-form",{"formschema":[1025],"data":[1032],"submit":[64]}]]],["tttx-keyvalue-block",[[1,"tttx-keyvalue-block",{"keyvalues":[1],"horizontal":[4],"spacedout":[4],"_elements":[32]}]]],["tttx-loading-spinner",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-percentage-bar",[[2,"tttx-percentage-bar",{"percentage":[8],"thresholds":[1],"color":[1],"min":[1],"labelid":[1],"_percentage":[32],"_ranges":[32],"_min":[32]}]]],["tttx-qrcode",[[1,"tttx-qrcode",{"link":[1025],"size":[1026]}]]],["tttx-tag",[[1,"tttx-tag",{"text":[1],"color":[1],"textColor":[1,"text-color"]}]]],["tttx-textarea",[[2,"tttx-textarea",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"rows":[2],"textareaautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"disabled":[4],"maxlength":[8],"name":[1],"placeholder":[1],"readonly":[8],"required":[4],"value":[1032]}]]],["tttx-icon",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]],["tttx-standalone-input",[[2,"tttx-standalone-input",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"iconleft":[1],"iconleftcolor":[1],"iconright":[1],"iconrightcolor":[1],"inputicon":[1],"inputiconcolor":[1],"inline":[4],"inputautocapitalize":[1],"inputautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"autocomplete":[1],"checked":[4],"disabled":[4],"max":[8],"maxlength":[8],"min":[8],"minlength":[8],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[8],"required":[4],"step":[8],"type":[1],"value":[1032]}]]],["tttx-filter_4",[[1,"tttx-filter",{"filterKey":[1,"filter-key"],"filterOptions":[1,"filter-options"],"showSelectAll":[4,"show-select-all"],"showSearchField":[4,"show-search-field"],"showOptionIcons":[4,"show-option-icons"],"filterButtonStyle":[1,"filter-button-style"],"filterHeader":[1,"filter-header"],"defaultFilterOptions":[1,"default-filter-options"],"popoverWidth":[1,"popover-width"],"showPopover":[32],"displayedFilterSettings":[32],"selectedFilters":[32],"filterSearchTerm":[32],"allSelected":[32]},[[0,"closeFilter","handleCloseFilter"]]],[1,"tttx-list",{"data":[1025],"name":[1],"_data":[32]}],[1,"tttx-sorter",{"sorterKey":[1,"sorter-key"],"defaultSortDirection":[1,"default-sort-direction"],"fieldOptionsData":[1,"field-options-data"],"defaultOption":[1,"default-option"],"selectedField":[32],"sortDirection":[32],"dropdownExpand":[32],"dropdownOptions":[32]},[[0,"closeSorter","handleCloseSorter"]]],[1,"tttx-toolbar",{"border":[4],"viewSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"iconcolor":[1025],"design":[1]}]]]], options);
17
+ return bootstrapLazy([["tttx-data-pattern",[[1,"tttx-data-pattern",{"data":[1],"sorteroptions":[1],"filteroptions":[1],"filterheader":[1]}]]],["tttx-multiselect-box",[[1,"tttx-multiselect-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"htmlVisibleValue":[4,"html-visible-value"],"visibleValue":[1,"visible-value"],"open":[32],"unsavedSelectedItems":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-dialog-box",[[1,"tttx-dialog-box",{"data":[1025],"size":[1],"open":[1028],"allowOverflow":[4,"allow-overflow"],"elementSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-select-box",[[1,"tttx-select-box",{"optionsData":[1,"options-data"],"label":[1],"inline":[4],"placeholder":[1],"searchEnabled":[4,"search-enabled"],"selectedValue":[1,"selected-value"],"open":[32],"selectedItem":[32],"searchTerm":[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["tttx-tree-view",[[1,"tttx-tree-view",{"data":[1040],"treeData":[32],"selectedId":[32]}]]],["tttx-checkbox",[[0,"tttx-checkbox",{"checkboxId":[1,"checkbox-id"],"label":[1],"inline":[4],"indeterminate":[4],"checked":[4]}]]],["tttx-dialog",[[1,"tttx-dialog",{"header":[1],"type":[1],"size":[1],"open":[4],"allowOverflow":[4,"allow-overflow"],"closeEnabled":[4,"close-enabled"],"elementSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-expander",[[1,"tttx-expander",{"name":[1],"open":[4],"lefticon":[1],"lefticoncolor":[1],"isExpanded":[32]}]]],["tttx-tabs",[[2,"tttx-tabs",{"tabsName":[1,"tabs-name"],"navigation":[4],"wide":[4],"tabs":[1],"_tabs":[32]},[[0,"keydown","handleKeyDown"]]]]],["tttx-checkbox-group",[[1,"tttx-checkbox-group"]]],["tttx-checkbox-group-caption",[[4,"tttx-checkbox-group-caption"]]],["tttx-checkbox-group-heading",[[4,"tttx-checkbox-group-heading"]]],["tttx-form",[[1,"tttx-form",{"formschema":[1025],"data":[1032],"submit":[64]}]]],["tttx-keyvalue-block",[[1,"tttx-keyvalue-block",{"keyvalues":[1],"horizontal":[4],"spacedout":[4],"_elements":[32]}]]],["tttx-loading-spinner",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-percentage-bar",[[2,"tttx-percentage-bar",{"percentage":[8],"thresholds":[1],"color":[1],"min":[1],"labelid":[1],"_percentage":[32],"_ranges":[32],"_min":[32]}]]],["tttx-qrcode",[[1,"tttx-qrcode",{"link":[1025],"size":[1026]}]]],["tttx-tag",[[1,"tttx-tag",{"text":[1],"color":[1],"textColor":[1,"text-color"]}]]],["tttx-textarea",[[2,"tttx-textarea",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"rows":[2],"textareaautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"disabled":[4],"maxlength":[8],"name":[1],"placeholder":[1],"readonly":[8],"required":[4],"value":[1032]}]]],["tttx-icon",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]],["tttx-standalone-input",[[2,"tttx-standalone-input",{"label":[1],"secondarylabel":[1],"showerrormsg":[4],"showerrorbubble":[4],"errormsg":[1],"iconleft":[1],"iconleftcolor":[1],"iconright":[1],"iconrightcolor":[1],"inputicon":[1],"inputiconcolor":[1],"inline":[4],"inputautocapitalize":[1],"inputautofocus":[4],"inputkeyhint":[1],"inputindex":[8],"inputtitle":[1],"autocomplete":[1],"checked":[4],"disabled":[4],"max":[8],"maxlength":[8],"min":[8],"minlength":[8],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[8],"required":[4],"step":[8],"type":[1],"value":[1032]}]]],["tttx-filter_4",[[1,"tttx-filter",{"filterKey":[1,"filter-key"],"filterOptions":[1,"filter-options"],"showSelectAll":[4,"show-select-all"],"showSearchField":[4,"show-search-field"],"showOptionIcons":[4,"show-option-icons"],"filterButtonStyle":[1,"filter-button-style"],"filterHeader":[1,"filter-header"],"defaultFilterOptions":[1,"default-filter-options"],"popoverWidth":[1,"popover-width"],"showPopover":[32],"displayedFilterSettings":[32],"selectedFilters":[32],"filterSearchTerm":[32],"allSelected":[32]},[[0,"closeFilter","handleCloseFilter"]]],[1,"tttx-list",{"data":[1025],"name":[1],"_data":[32]}],[1,"tttx-sorter",{"sorterKey":[1,"sorter-key"],"defaultSortDirection":[1,"default-sort-direction"],"fieldOptionsData":[1,"field-options-data"],"defaultOption":[1,"default-option"],"selectedField":[32],"sortDirection":[32],"dropdownExpand":[32],"dropdownOptions":[32]},[[0,"closeSorter","handleCloseSorter"]]],[1,"tttx-toolbar",{"border":[4],"viewSize":[32]},[[9,"resize","handleResize"]]]]],["tttx-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"iconcolor":[1025],"design":[1]}]]]], options);
18
18
  });
@@ -0,0 +1 @@
1
+ import{r as o,c as i,h as t,g as e}from"./p-65bb4035.js";const n={critical:{iconName:"report",iconColor:"red"},info:{iconName:"info",iconColor:"blue"},success:{iconName:"check_circle",iconColor:"green"},warning:{iconName:"warning",iconColor:"orange"}},s=class{constructor(t){o(this,t),this.closeButtonClick=i(this,"closeButtonClick",6),this.header=void 0,this.type=void 0,this.size="regular",this.open=!1,this.allowOverflow=!1,this.closeEnabled=!0,this.elementSize=void 0}handleResize(){this.elementSize=window.innerWidth<698?"mobile":this.size}preventCancelOnDialog(o){o.preventDefault()}componentDidLoad(){this.dialog.addEventListener("cancel",this.preventCancelOnDialog)}onCloseClickHandler(){this.closeButtonClick.emit()}headerIconDetails(o){return o?n[this.type]:{iconName:void 0,iconColor:void 0}}renderHeader(){const o=void 0!==this.type,{iconName:i,iconColor:e}=this.headerIconDetails(o);return t("div",{class:`padding header ${this.type||""}`},o&&t("tttx-icon",{class:"icon",icon:i,color:e}),t("h3",{class:"title"},this.header),this.closeEnabled&&t("div",{class:"align-right close-button",onClick:()=>this.onCloseClickHandler()},t("tttx-icon",{class:"icon-close clickable",icon:"close",color:"black"})))}body(){return t("div",{class:"body "+(this.allowOverflow?"":"overflow-hidden")},t("span",{class:"body-content"},t("slot",null)))}footer(){if(this.el.querySelector('[slot="buttons"]'))return t("div",{class:"padding footer"},t("div",{class:"align-right"},t("slot",{name:"buttons"})))}componentDidRender(){this.open?this.dialog.open||this.dialog.showModal():this.dialog.close()}componentWillLoad(){this.handleResize()}render(){return t("dialog",{ref:o=>this.dialog=o,class:`dialog-box ${this.allowOverflow?"overflow-visible":""} ${this.elementSize}`},t("div",{class:"contents"},this.renderHeader(),this.body(),this.footer()))}get el(){return e(this)}};s.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.material-symbols-rounded{font-family:"Material Symbols Rounded", sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#9e9e9e}h3{margin-block-start:0em;margin-block-end:0em}.dialog-box{background-color:#ffffff;border:1px solid #d5d5d5;border-radius:4px;box-shadow:0px 1px 5px #1111114d;padding:0}.dialog-box.small{width:400px;min-height:200px}.dialog-box.regular{width:600px;min-height:200px}.dialog-box.large{width:900px;min-height:200px}.dialog-box.mobile{max-width:424px;width:calc(100vw - 20px)}.overflow-visible{overflow:visible}.overflow-hidden{overflow:hidden}dialog::backdrop{background-color:#75757580}.clickable{cursor:pointer}.contents{display:flex;flex-direction:column;min-height:inherit}.padding{padding:8px 16px}.align-right{margin-left:auto;display:flex}.header{border-bottom:1px solid #d5d5d5;display:flex;flex-direction:row;align-items:center;height:36px}.title{font-size:18;font-weight:500;font-family:"Roboto", serif}.icon{padding-right:8px;width:24px;height:24px}.icon-close{margin-left:auto;padding-top:3px;width:24px;height:24px}.body-content{font-size:16;font-weight:400;font-family:"Roboto", serif}.body{text-overflow:ellipsis;padding:16px}.footer{display:flex;flex-direction:row;margin-top:auto;border-top:1px solid #d5d5d5;height:36px}::slotted([slot=buttons]){display:flex;gap:8px}.header.info{border-bottom:1px solid #1479c6}.header.success{border-bottom:1px solid #a2bb31}.header.warning{border-bottom:1px solid #f59500}.header.critical{border-bottom:1px solid #dc0000}';export{s as tttx_dialog}
@@ -1 +1 @@
1
- import{p as e,b as t}from"./p-65bb4035.js";export{s as setNonce}from"./p-65bb4035.js";(()=>{const t=import.meta.url,o={};return""!==t&&(o.resourcesUrl=new URL(".",t).href),e(o)})().then((e=>t([["p-7f1452fb",[[1,"tttx-data-pattern",{data:[1],sorteroptions:[1],filteroptions:[1],filterheader:[1]}]]],["p-9ad58b75",[[1,"tttx-multiselect-box",{optionsData:[1,"options-data"],label:[1],inline:[4],placeholder:[1],searchEnabled:[4,"search-enabled"],htmlVisibleValue:[4,"html-visible-value"],visibleValue:[1,"visible-value"],open:[32],unsavedSelectedItems:[32],searchTerm:[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["p-bc363141",[[1,"tttx-dialog-box",{data:[1025],size:[1],open:[1028],allowOverflow:[4,"allow-overflow"],elementSize:[32]},[[9,"resize","handleResize"]]]]],["p-d3a9fc42",[[1,"tttx-select-box",{optionsData:[1,"options-data"],label:[1],inline:[4],placeholder:[1],searchEnabled:[4,"search-enabled"],selectedValue:[1,"selected-value"],open:[32],selectedItem:[32],searchTerm:[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["p-d5b6dd17",[[1,"tttx-tree-view",{data:[1040],treeData:[32],selectedId:[32]}]]],["p-61ef7773",[[0,"tttx-checkbox",{checkboxId:[1,"checkbox-id"],label:[1],inline:[4],indeterminate:[4],checked:[4]}]]],["p-87b6e5a9",[[1,"tttx-expander",{name:[1],open:[4],lefticon:[1],lefticoncolor:[1],isExpanded:[32]}]]],["p-b189ca0f",[[2,"tttx-tabs",{tabsName:[1,"tabs-name"],navigation:[4],wide:[4],tabs:[1],_tabs:[32]},[[0,"keydown","handleKeyDown"]]]]],["p-67f24d17",[[1,"tttx-checkbox-group"]]],["p-a64c9910",[[4,"tttx-checkbox-group-caption"]]],["p-80e3bd36",[[4,"tttx-checkbox-group-heading"]]],["p-e2dda35e",[[1,"tttx-form",{formschema:[1025],data:[1032],submit:[64]}]]],["p-15b7a577",[[1,"tttx-keyvalue-block",{keyvalues:[1],horizontal:[4],spacedout:[4],_elements:[32]}]]],["p-fe6c321b",[[1,"tttx-loading-spinner",{loadingMessage:[1028,"loading-message"],size:[1025]}]]],["p-be16cf2d",[[2,"tttx-percentage-bar",{percentage:[8],thresholds:[1],color:[1],min:[1],labelid:[1],_percentage:[32],_ranges:[32],_min:[32]}]]],["p-69642b71",[[1,"tttx-qrcode",{link:[1025],size:[1026]}]]],["p-e7b7d2e2",[[1,"tttx-tag",{text:[1],color:[1],textColor:[1,"text-color"]}]]],["p-34f328f9",[[2,"tttx-textarea",{label:[1],secondarylabel:[1],showerrormsg:[4],showerrorbubble:[4],errormsg:[1],rows:[2],textareaautofocus:[4],inputkeyhint:[1],inputindex:[8],inputtitle:[1],disabled:[4],maxlength:[8],name:[1],placeholder:[1],readonly:[8],required:[4],value:[1032]}]]],["p-a94f7efc",[[1,"tttx-icon",{icon:[1],color:[1]}]]],["p-93e63568",[[2,"tttx-standalone-input",{label:[1],secondarylabel:[1],showerrormsg:[4],showerrorbubble:[4],errormsg:[1],iconleft:[1],iconleftcolor:[1],iconright:[1],iconrightcolor:[1],inputicon:[1],inputiconcolor:[1],inline:[4],inputautocapitalize:[1],inputautofocus:[4],inputkeyhint:[1],inputindex:[8],inputtitle:[1],autocomplete:[1],checked:[4],disabled:[4],max:[8],maxlength:[8],min:[8],minlength:[8],name:[1],pattern:[1],placeholder:[1],readonly:[8],required:[4],step:[8],type:[1],value:[1032]}]]],["p-f27adb48",[[1,"tttx-filter",{filterKey:[1,"filter-key"],filterOptions:[1,"filter-options"],showSelectAll:[4,"show-select-all"],showSearchField:[4,"show-search-field"],showOptionIcons:[4,"show-option-icons"],filterButtonStyle:[1,"filter-button-style"],filterHeader:[1,"filter-header"],defaultFilterOptions:[1,"default-filter-options"],popoverWidth:[1,"popover-width"],showPopover:[32],displayedFilterSettings:[32],selectedFilters:[32],filterSearchTerm:[32],allSelected:[32]},[[0,"closeFilter","handleCloseFilter"]]],[1,"tttx-list",{data:[1025],name:[1],_data:[32]}],[1,"tttx-sorter",{sorterKey:[1,"sorter-key"],defaultSortDirection:[1,"default-sort-direction"],fieldOptionsData:[1,"field-options-data"],defaultOption:[1,"default-option"],selectedField:[32],sortDirection:[32],dropdownExpand:[32],dropdownOptions:[32]},[[0,"closeSorter","handleCloseSorter"]]],[1,"tttx-toolbar",{border:[4],viewSize:[32]},[[9,"resize","handleResize"]]]]],["p-61741832",[[1,"tttx-button",{notext:[4],icon:[1],iconposition:[1],iconcolor:[1025],design:[1]}]]]],e)));
1
+ import{p as e,b as t}from"./p-65bb4035.js";export{s as setNonce}from"./p-65bb4035.js";(()=>{const t=import.meta.url,o={};return""!==t&&(o.resourcesUrl=new URL(".",t).href),e(o)})().then((e=>t([["p-7f1452fb",[[1,"tttx-data-pattern",{data:[1],sorteroptions:[1],filteroptions:[1],filterheader:[1]}]]],["p-9ad58b75",[[1,"tttx-multiselect-box",{optionsData:[1,"options-data"],label:[1],inline:[4],placeholder:[1],searchEnabled:[4,"search-enabled"],htmlVisibleValue:[4,"html-visible-value"],visibleValue:[1,"visible-value"],open:[32],unsavedSelectedItems:[32],searchTerm:[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["p-bc363141",[[1,"tttx-dialog-box",{data:[1025],size:[1],open:[1028],allowOverflow:[4,"allow-overflow"],elementSize:[32]},[[9,"resize","handleResize"]]]]],["p-d3a9fc42",[[1,"tttx-select-box",{optionsData:[1,"options-data"],label:[1],inline:[4],placeholder:[1],searchEnabled:[4,"search-enabled"],selectedValue:[1,"selected-value"],open:[32],selectedItem:[32],searchTerm:[32]},[[0,"closeSelectBox","handleCloseSelectBox"],[0,"blur","handleBlur"]]]]],["p-d5b6dd17",[[1,"tttx-tree-view",{data:[1040],treeData:[32],selectedId:[32]}]]],["p-61ef7773",[[0,"tttx-checkbox",{checkboxId:[1,"checkbox-id"],label:[1],inline:[4],indeterminate:[4],checked:[4]}]]],["p-cdac34b5",[[1,"tttx-dialog",{header:[1],type:[1],size:[1],open:[4],allowOverflow:[4,"allow-overflow"],closeEnabled:[4,"close-enabled"],elementSize:[32]},[[9,"resize","handleResize"]]]]],["p-87b6e5a9",[[1,"tttx-expander",{name:[1],open:[4],lefticon:[1],lefticoncolor:[1],isExpanded:[32]}]]],["p-b189ca0f",[[2,"tttx-tabs",{tabsName:[1,"tabs-name"],navigation:[4],wide:[4],tabs:[1],_tabs:[32]},[[0,"keydown","handleKeyDown"]]]]],["p-67f24d17",[[1,"tttx-checkbox-group"]]],["p-a64c9910",[[4,"tttx-checkbox-group-caption"]]],["p-80e3bd36",[[4,"tttx-checkbox-group-heading"]]],["p-e2dda35e",[[1,"tttx-form",{formschema:[1025],data:[1032],submit:[64]}]]],["p-15b7a577",[[1,"tttx-keyvalue-block",{keyvalues:[1],horizontal:[4],spacedout:[4],_elements:[32]}]]],["p-fe6c321b",[[1,"tttx-loading-spinner",{loadingMessage:[1028,"loading-message"],size:[1025]}]]],["p-be16cf2d",[[2,"tttx-percentage-bar",{percentage:[8],thresholds:[1],color:[1],min:[1],labelid:[1],_percentage:[32],_ranges:[32],_min:[32]}]]],["p-69642b71",[[1,"tttx-qrcode",{link:[1025],size:[1026]}]]],["p-e7b7d2e2",[[1,"tttx-tag",{text:[1],color:[1],textColor:[1,"text-color"]}]]],["p-34f328f9",[[2,"tttx-textarea",{label:[1],secondarylabel:[1],showerrormsg:[4],showerrorbubble:[4],errormsg:[1],rows:[2],textareaautofocus:[4],inputkeyhint:[1],inputindex:[8],inputtitle:[1],disabled:[4],maxlength:[8],name:[1],placeholder:[1],readonly:[8],required:[4],value:[1032]}]]],["p-a94f7efc",[[1,"tttx-icon",{icon:[1],color:[1]}]]],["p-93e63568",[[2,"tttx-standalone-input",{label:[1],secondarylabel:[1],showerrormsg:[4],showerrorbubble:[4],errormsg:[1],iconleft:[1],iconleftcolor:[1],iconright:[1],iconrightcolor:[1],inputicon:[1],inputiconcolor:[1],inline:[4],inputautocapitalize:[1],inputautofocus:[4],inputkeyhint:[1],inputindex:[8],inputtitle:[1],autocomplete:[1],checked:[4],disabled:[4],max:[8],maxlength:[8],min:[8],minlength:[8],name:[1],pattern:[1],placeholder:[1],readonly:[8],required:[4],step:[8],type:[1],value:[1032]}]]],["p-f27adb48",[[1,"tttx-filter",{filterKey:[1,"filter-key"],filterOptions:[1,"filter-options"],showSelectAll:[4,"show-select-all"],showSearchField:[4,"show-search-field"],showOptionIcons:[4,"show-option-icons"],filterButtonStyle:[1,"filter-button-style"],filterHeader:[1,"filter-header"],defaultFilterOptions:[1,"default-filter-options"],popoverWidth:[1,"popover-width"],showPopover:[32],displayedFilterSettings:[32],selectedFilters:[32],filterSearchTerm:[32],allSelected:[32]},[[0,"closeFilter","handleCloseFilter"]]],[1,"tttx-list",{data:[1025],name:[1],_data:[32]}],[1,"tttx-sorter",{sorterKey:[1,"sorter-key"],defaultSortDirection:[1,"default-sort-direction"],fieldOptionsData:[1,"field-options-data"],defaultOption:[1,"default-option"],selectedField:[32],sortDirection:[32],dropdownExpand:[32],dropdownOptions:[32]},[[0,"closeSorter","handleCloseSorter"]]],[1,"tttx-toolbar",{border:[4],viewSize:[32]},[[9,"resize","handleResize"]]]]],["p-61741832",[[1,"tttx-button",{notext:[4],icon:[1],iconposition:[1],iconcolor:[1025],design:[1]}]]]],e)));
@@ -0,0 +1,18 @@
1
+ export declare const ICON_TYPES: {
2
+ critical: {
3
+ iconName: string;
4
+ iconColor: string;
5
+ };
6
+ info: {
7
+ iconName: string;
8
+ iconColor: string;
9
+ };
10
+ success: {
11
+ iconName: string;
12
+ iconColor: string;
13
+ };
14
+ warning: {
15
+ iconName: string;
16
+ iconColor: string;
17
+ };
18
+ };
@@ -0,0 +1,27 @@
1
+ import { EventEmitter } from '../../../stencil-public-runtime';
2
+ export declare class TttxDialog {
3
+ header: string;
4
+ type: 'info' | 'success' | 'warning' | 'critical' | undefined;
5
+ size: 'regular' | 'mobile' | 'large' | 'small';
6
+ open: boolean;
7
+ allowOverflow: boolean;
8
+ closeEnabled: boolean;
9
+ elementSize: 'regular' | 'mobile' | 'large' | 'small';
10
+ el: any;
11
+ closeButtonClick: EventEmitter;
12
+ handleResize(): void;
13
+ private dialog;
14
+ private preventCancelOnDialog;
15
+ componentDidLoad(): void;
16
+ onCloseClickHandler(): void;
17
+ headerIconDetails(iconEnabled: boolean): {
18
+ iconName: string;
19
+ iconColor: string;
20
+ };
21
+ renderHeader(): any;
22
+ body(): any;
23
+ footer(): any;
24
+ componentDidRender(): void;
25
+ componentWillLoad(): void;
26
+ render(): any;
27
+ }
@@ -0,0 +1,42 @@
1
+ declare const _default: {
2
+ title: string;
3
+ component: string;
4
+ argTypes: {
5
+ header: {
6
+ control: {
7
+ type: string;
8
+ };
9
+ };
10
+ type: {
11
+ control: {
12
+ type: string;
13
+ };
14
+ options: string[];
15
+ };
16
+ size: {
17
+ control: {
18
+ type: string;
19
+ };
20
+ options: string[];
21
+ };
22
+ closeEnabled: {
23
+ control: {
24
+ type: string;
25
+ };
26
+ };
27
+ };
28
+ parameters: {
29
+ actions: {
30
+ handles: string[];
31
+ };
32
+ docs: {
33
+ description: {
34
+ component: string;
35
+ };
36
+ };
37
+ };
38
+ decorators: (<T extends import("@storybook/types").Renderer>(storyFn: import("@storybook/types").PartialStoryFn<T, import("@storybook/types").Args>) => T["storyResult"])[];
39
+ };
40
+ export default _default;
41
+ export declare const Default: any;
42
+ export declare const WithoutFooter: any;
@@ -43,6 +43,14 @@ export namespace Components {
43
43
  "filteroptions": string;
44
44
  "sorteroptions": string;
45
45
  }
46
+ interface TttxDialog {
47
+ "allowOverflow": boolean;
48
+ "closeEnabled": boolean;
49
+ "header": string;
50
+ "open": boolean;
51
+ "size": 'regular' | 'mobile' | 'large' | 'small';
52
+ "type": 'info' | 'success' | 'warning' | 'critical' | undefined;
53
+ }
46
54
  interface TttxDialogBox {
47
55
  "allowOverflow": boolean;
48
56
  "data": string | DialogItems;
@@ -219,6 +227,10 @@ export interface TttxCheckboxCustomEvent<T> extends CustomEvent<T> {
219
227
  detail: T;
220
228
  target: HTMLTttxCheckboxElement;
221
229
  }
230
+ export interface TttxDialogCustomEvent<T> extends CustomEvent<T> {
231
+ detail: T;
232
+ target: HTMLTttxDialogElement;
233
+ }
222
234
  export interface TttxDialogBoxCustomEvent<T> extends CustomEvent<T> {
223
235
  detail: T;
224
236
  target: HTMLTttxDialogBoxElement;
@@ -304,6 +316,12 @@ declare global {
304
316
  prototype: HTMLTttxDataPatternElement;
305
317
  new (): HTMLTttxDataPatternElement;
306
318
  };
319
+ interface HTMLTttxDialogElement extends Components.TttxDialog, HTMLStencilElement {
320
+ }
321
+ var HTMLTttxDialogElement: {
322
+ prototype: HTMLTttxDialogElement;
323
+ new (): HTMLTttxDialogElement;
324
+ };
307
325
  interface HTMLTttxDialogBoxElement extends Components.TttxDialogBox, HTMLStencilElement {
308
326
  }
309
327
  var HTMLTttxDialogBoxElement: {
@@ -425,6 +443,7 @@ declare global {
425
443
  "tttx-checkbox-group-caption": HTMLTttxCheckboxGroupCaptionElement;
426
444
  "tttx-checkbox-group-heading": HTMLTttxCheckboxGroupHeadingElement;
427
445
  "tttx-data-pattern": HTMLTttxDataPatternElement;
446
+ "tttx-dialog": HTMLTttxDialogElement;
428
447
  "tttx-dialog-box": HTMLTttxDialogBoxElement;
429
448
  "tttx-expander": HTMLTttxExpanderElement;
430
449
  "tttx-filter": HTMLTttxFilterElement;
@@ -474,6 +493,15 @@ declare namespace LocalJSX {
474
493
  "filteroptions"?: string;
475
494
  "sorteroptions"?: string;
476
495
  }
496
+ interface TttxDialog {
497
+ "allowOverflow"?: boolean;
498
+ "closeEnabled"?: boolean;
499
+ "header"?: string;
500
+ "onCloseButtonClick"?: (event: TttxDialogCustomEvent<any>) => void;
501
+ "open"?: boolean;
502
+ "size"?: 'regular' | 'mobile' | 'large' | 'small';
503
+ "type"?: 'info' | 'success' | 'warning' | 'critical' | undefined;
504
+ }
477
505
  interface TttxDialogBox {
478
506
  "allowOverflow"?: boolean;
479
507
  "data"?: string | DialogItems;
@@ -683,6 +711,7 @@ declare namespace LocalJSX {
683
711
  "tttx-checkbox-group-caption": TttxCheckboxGroupCaption;
684
712
  "tttx-checkbox-group-heading": TttxCheckboxGroupHeading;
685
713
  "tttx-data-pattern": TttxDataPattern;
714
+ "tttx-dialog": TttxDialog;
686
715
  "tttx-dialog-box": TttxDialogBox;
687
716
  "tttx-expander": TttxExpander;
688
717
  "tttx-filter": TttxFilter;
@@ -714,6 +743,7 @@ declare module "@stencil/core" {
714
743
  "tttx-checkbox-group-caption": LocalJSX.TttxCheckboxGroupCaption & JSXBase.HTMLAttributes<HTMLTttxCheckboxGroupCaptionElement>;
715
744
  "tttx-checkbox-group-heading": LocalJSX.TttxCheckboxGroupHeading & JSXBase.HTMLAttributes<HTMLTttxCheckboxGroupHeadingElement>;
716
745
  "tttx-data-pattern": LocalJSX.TttxDataPattern & JSXBase.HTMLAttributes<HTMLTttxDataPatternElement>;
746
+ "tttx-dialog": LocalJSX.TttxDialog & JSXBase.HTMLAttributes<HTMLTttxDialogElement>;
717
747
  "tttx-dialog-box": LocalJSX.TttxDialogBox & JSXBase.HTMLAttributes<HTMLTttxDialogBoxElement>;
718
748
  "tttx-expander": LocalJSX.TttxExpander & JSXBase.HTMLAttributes<HTMLTttxExpanderElement>;
719
749
  "tttx-filter": LocalJSX.TttxFilter & JSXBase.HTMLAttributes<HTMLTttxFilterElement>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@3t-transform/threeteeui",
3
- "version": "0.2.92",
3
+ "version": "0.2.93",
4
4
  "description": "3t Design System",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/index.js",