@3t-transform/threeteeui 0.2.116 → 0.2.118

package/dist/cjs/{index-992a9fb3.js → index-fdc30724.js}

@@ -1789,16 +1789,12 @@ const setContentReference = (elm) => {
 const disconnectedCallback = (elm) => {
     if ((plt.$flags$ & 1 /* PLATFORM_FLAGS.isTmpDisconnected */) === 0) {
         const hostRef = getHostRef(elm);
-        const instance = hostRef.$lazyInstance$ ;
         {
             if (hostRef.$rmListeners$) {
                 hostRef.$rmListeners$.map((rmListener) => rmListener());
                 hostRef.$rmListeners$ = undefined;
             }
         }
-        {
-            safeCall(instance, 'disconnectedCallback');
-        }
     }
 };
 const bootstrapLazy = (lazyBundles, options = {}) => {

package/dist/cjs/loader.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 /*
  Stencil Client Patch Esm v2.22.3 | MIT Licensed | https://stenciljs.com

package/dist/cjs/tttx-button.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxButtonCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}button{cursor:pointer}.button{font-family:Roboto, serif;box-sizing:border-box;height:36px;min-width:36px;padding:0;margin:0;background:transparent;color:#212121;border:1px solid #c8c8c8;border-radius:4px;text-transform:uppercase;display:flex;justify-content:left;align-items:center;font-size:14px;font-weight:500}.button-content{display:block;padding:0 16px}.icon-left,.icon-right{margin-top:4px}.iconleft{padding-left:8px}.iconleft .button-content{padding-left:4px}.iconright{padding-right:8px}.iconright .button-content{padding-right:4px}.notext{padding:0 6px}.button:active{background:rgba(17, 17, 17, 0.2);border:1px solid #d5d5d5}.primary{background:#1479c6;border:1px solid #1479c6;color:white}.primary:active{background:#1464a2;border:1px solid #1464a2}.borderless{background:transparent;border:none;color:#212121}.borderless:active{background:rgba(17, 17, 17, 0.2);border:none}.borderless-circle{background:transparent;border:none;color:#212121;border-radius:50%}.borderless-circle:active{border:none}.borderless-circle:focus{border-color:transparent}.danger{background:#dc0000;border:1px solid #dc0000;color:white}.danger:active{background:#b00000;border:1px solid #b00000}.disabled{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:active{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}@media (hover: hover){.button:hover{background:rgba(17, 17, 17, 0.1);border:1px solid #d5d5d5}.primary:hover{background:#146eb3;border:1px solid #146eb3}.borderless:hover{background:rgba(17, 17, 17, 0.1);border:none}.borderless-circle:hover{background:rgba(17, 17, 17, 0.1);border:none}.danger:hover{background:#c60000;border:1px solid #c60000}.disabled:hover{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}}:host{display:inline-block}tttx-icon{cursor:inherit}.spacingleft{margin-left:8px}";
 

package/dist/cjs/tttx-checkbox-group-caption.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxCheckboxGroupCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.tttx-checkbox-group{display:flex;flex-direction:column}.tttx-checkbox-group__caption{color:#757575;font-family:\"Roboto\", sans-serif;font-size:14px;font-weight:normal;line-height:18.752px;margin-bottom:4px}.tttx-checkbox-group__heading{color:#212121;font-family:\"Roboto\", sans-serif;font-size:16px;font-weight:500;line-height:16.408px;margin-bottom:4px}";
 

package/dist/cjs/tttx-checkbox-group-heading.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxCheckboxGroupCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.tttx-checkbox-group{display:flex;flex-direction:column}.tttx-checkbox-group__caption{color:#757575;font-family:\"Roboto\", sans-serif;font-size:14px;font-weight:normal;line-height:18.752px;margin-bottom:4px}.tttx-checkbox-group__heading{color:#212121;font-family:\"Roboto\", sans-serif;font-size:16px;font-weight:500;line-height:16.408px;margin-bottom:4px}";
 

package/dist/cjs/tttx-checkbox-group.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxCheckboxGroupCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.tttx-checkbox-group{display:flex;flex-direction:column}.tttx-checkbox-group__caption{color:#757575;font-family:\"Roboto\", sans-serif;font-size:14px;font-weight:normal;line-height:18.752px;margin-bottom:4px}.tttx-checkbox-group__heading{color:#212121;font-family:\"Roboto\", sans-serif;font-size:16px;font-weight:500;line-height:16.408px;margin-bottom:4px}";
 

package/dist/cjs/tttx-checkbox.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxCheckboxCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.tttx-checkbox{padding:8px;display:flex;justify-content:flex-start;font-size:16px;align-items:center;font-weight:normal;line-height:18.752px}.tttx-checkbox tttx-icon{height:24px}.tttx-checkbox.--inline{display:inline-flex}.tttx-checkbox__input{display:none}.tttx-checkbox__label{margin-left:8px;padding-right:0;color:#212121;font-weight:normal}";
 

package/dist/cjs/tttx-data-pattern.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxDataPatternCss = ":host{display:block}";
 

package/dist/cjs/tttx-dialog-box.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 const domsanitiser_options = require('./domsanitiser.options-32e670aa.js');
 require('./_commonjsHelpers-537d719a.js');
 
@@ -13,6 +13,9 @@ const TttxDialogBox = class {
     index.registerInstance(this, hostRef);
     this.closeButtonClick = index.createEvent(this, "closeButtonClick", 6);
     this.buttonClick = index.createEvent(this, "buttonClick", 7);
+    this.emitDialogClose = () => {
+      this.closeButtonClick.emit();
+    };
     this.data = undefined;
     this.size = 'regular';
     this.open = false;
@@ -28,37 +31,25 @@ const TttxDialogBox = class {
     }
   }
   componentDidRender() {
-    if (!this.dialog())
+    if (!this.dialog)
       return;
+    this.dialog.removeEventListener('close', this.emitDialogClose);
+    this.dialog.addEventListener('close', this.emitDialogClose);
     if (!this.open) {
-      this.dialog().close();
+      this.dialog.close();
       return;
     }
     // istanbul ignore next
-    if (!this.dialog().open)
-      this.dialog().showModal();
-  }
-  preventCancelOnDialog(event) {
-    event.preventDefault();
-  }
-  componentDidLoad() {
-    var _a;
-    (_a = this.dialog()) === null || _a === void 0 ? void 0 : _a.addEventListener('cancel', this.preventCancelOnDialog);
-  }
-  disconnectedCallback() {
-    var _a;
-    (_a = this.dialog()) === null || _a === void 0 ? void 0 : _a.removeEventListener('cancel', this.preventCancelOnDialog);
+    if (!this.dialog.open)
+      this.dialog.showModal();
   }
   onCloseClickHandler() {
     this.open = false;
-    this.closeButtonClick.emit({ close: true });
+    this.dialog.close();
   }
   onButtonClickHandler(index) {
     this.buttonClick.emit({ buttonNumber: index, buttonClicked: true });
   }
-  dialog() {
-    return this.el.shadowRoot.querySelector('dialog');
-  }
   renderHeader(header) {
     const title = header.title;
     const iconName = header.iconName;
@@ -101,7 +92,7 @@ const TttxDialogBox = class {
     else {
       this._data = this.data;
     }
-    return (index.h("dialog", { class: `dialog-box ${this.allowOverflow ? 'overflow-visible' : ''} ${this.elementSize}` }, index.h("div", { class: "contents" }, index.h("div", { class: `dialog-box-padding dialog-box-header-box ${this._data.type || ''}` }, this.renderHeader(this._data.header)), index.h("div", { class: "dialog-box-padding dialog-box-body-box" }, this.renderContent(this._data.body)), index.h("div", { class: "dialog-box-padding dialog-box-footer-box" }, this.renderFooter(this._data.footer)))));
+    return (index.h("dialog", { ref: (el) => this.dialog = el, class: `dialog-box ${this.allowOverflow ? 'overflow-visible' : ''} ${this.elementSize}` }, index.h("div", { class: "contents" }, index.h("div", { class: `dialog-box-padding dialog-box-header-box ${this._data.type || ''}` }, this.renderHeader(this._data.header)), index.h("div", { class: "dialog-box-padding dialog-box-body-box" }, this.renderContent(this._data.body)), index.h("div", { class: "dialog-box-padding dialog-box-footer-box" }, this.renderFooter(this._data.footer)))));
   }
   get el() { return index.getElement(this); }
 };

package/dist/cjs/tttx-dialog.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const ICON_TYPES = {
   critical: { iconName: 'report', iconColor: 'red' },
@@ -33,14 +33,14 @@ const TttxDialog = class {
       this.elementSize = this.size;
     }
   }
-  preventCancelOnDialog(event) {
-    event.preventDefault();
+  emitDialogClose() {
+    this.closeButtonClick.emit();
   }
   componentDidLoad() {
-    this.dialog.addEventListener('cancel', this.preventCancelOnDialog);
+    this.dialog.addEventListener('close', this.emitDialogClose.bind(this));
   }
   onCloseClickHandler() {
-    this.closeButtonClick.emit();
+    this.dialog.close();
   }
   headerIconDetails(iconEnabled) {
     if (!iconEnabled)

package/dist/cjs/tttx-expander.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxExpanderCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}:host{display:block}.expander{border-bottom:1px solid #d5d5d5}.expander[open] .panel .open{display:initial}.expander[open] .panel .closed{display:none}.expander:not([open]) .panel .open{display:none}.expander:not([open]) .panel .closed{display:initial}.expander .panel{display:flex;gap:4px;height:36px;align-items:center;justify-content:space-between;cursor:pointer;user-select:none}.expander .panel .panel-frame{display:flex;gap:4px;height:36px;align-items:center}.expander .panel .panel-frame .name{font-size:16px;font-weight:500;color:#212121}.expander .panel .left-icons,.expander .panel .expand-button{display:flex;height:36px;width:36px;align-items:center;justify-content:center}.expander .panel .left-icons>tttx-icon,.expander .panel .expand-button>tttx-icon{height:24px;cursor:inherit}.expander .content{margin-top:8px;margin-bottom:8px}";
 

package/dist/cjs/tttx-filter_4.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 const domsanitiser_options = require('./domsanitiser.options-32e670aa.js');
 require('./_commonjsHelpers-537d719a.js');
 

package/dist/cjs/tttx-form.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 const domsanitiser_options = require('./domsanitiser.options-32e670aa.js');
 require('./_commonjsHelpers-537d719a.js');
 
@@ -283,7 +283,8 @@ const TttxForm = class {
     select.style.display = 'none';
     tttxSelect.addEventListener('selectItemEvent', function (ev) {
       select.value = ev.detail.value;
-      select.onblur({ target: select });
+      select.onblur({ target: select }); // triggers validator
+      select.onchange({ target: select }); // triggers dataChanged event
     });
     return { input: select, overlay: fragment };
   }

package/dist/cjs/tttx-icon.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxIconCss = ".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}:host{display:inline-block;cursor:default;user-select:none}.icon-size{width:24px;height:24px}.tooltip{background:#ffffff;color:#343434;font-weight:bold;padding:8px 16px;font-size:13px;border-radius:4px;box-shadow:0 0 5px 1px rgba(0, 0, 0, 0.3);display:none}.tooltip[data-show]{display:block}.arrow,.arrow::before{position:absolute;width:8px;height:8px;background:inherit}.arrow{visibility:hidden}.arrow::before{visibility:visible;content:\"\";transform:rotate(45deg)}.tooltip[data-popper-placement^=top]>.arrow{bottom:-4px}.tooltip[data-popper-placement^=bottom]>.arrow{top:-4px}.tooltip[data-popper-placement^=left]>.arrow{right:-4px}.tooltip[data-popper-placement^=right]>.arrow{left:-4px}.red{color:#dc0000}.darkred{color:#A20000}.orange{color:#f59500}.blue{color:#1479c6}.green{color:#a2bb31}.gray{color:#757575}.black{color:#212121}.white{color:white}";
 

package/dist/cjs/tttx-keyvalue-block.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxKeyvalueBlockCss = ":host{display:block}dl{margin:0;padding:0;font-family:\"Roboto\", sans-serif;cursor:default}dt{font-weight:400;font-size:16px;margin-bottom:4px}dt,dt.subTitle{color:#757575}dt.mainTitle{color:#212121}dt,dd{overflow-wrap:anywhere}dd{margin:0;font-weight:400;font-size:16px;color:#212121}dd:not(:last-child){margin-bottom:16px}dl.spacedout,dl.horizontal{display:flex;flex-direction:row;width:100%}dl.spacedout{justify-content:space-between}dl.horizontal div{flex-grow:1}@media (max-width: 769px){dl.horizontal{flex-wrap:wrap}dl.horizontal div{width:50%;max-width:50% !important}}@media (max-width: 600px){dl.horizontal div{width:100%;max-width:100% !important}}";
 

package/dist/cjs/tttx-loading-spinner.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxLoadingSpinnerCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.loading-box{display:flex;align-items:center;justify-content:center}.loading-text{font-size:16px;font-weight:400;padding-top:10px;text-align:center}.spinner{border:solid #1479c6;border-bottom-color:#d5d5d5;border-radius:50%;position:relative;box-sizing:border-box;animation:rotation 1s linear infinite}.spinner.small{height:20px;width:20px;border-width:4px}.spinner.large{height:60px;width:60px;border-width:8px}@keyframes rotation{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}";
 

package/dist/cjs/tttx-multiselect-box.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 const domsanitiser_options = require('./domsanitiser.options-32e670aa.js');
 require('./_commonjsHelpers-537d719a.js');
 

package/dist/cjs/tttx-percentage-bar.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxPercentageBarCss = ".sc-tttx-percentage-bar-h{display:block}.progress.sc-tttx-percentage-bar{width:100%;background-color:#dbdbdb}.progress.sc-tttx-percentage-bar .bar.sc-tttx-percentage-bar{height:20px}";
 

package/dist/cjs/tttx-qrcode.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 const _commonjsHelpers = require('./_commonjsHelpers-537d719a.js');
 
 var qrcode_min = _commonjsHelpers.createCommonjsModule(function (module, exports) {

package/dist/cjs/tttx-select-box.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 const domsanitiser_options = require('./domsanitiser.options-32e670aa.js');
 require('./_commonjsHelpers-537d719a.js');
 

package/dist/cjs/tttx-standalone-input.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxStandaloneInputCss = ".material-symbols-rounded.sc-tttx-standalone-input{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.material-symbols-rounded.sc-tttx-standalone-input{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}label.sc-tttx-standalone-input{font-weight:500;font-size:16px;line-height:18.752px;color:#212121}label.sc-tttx-standalone-input .optional.sc-tttx-standalone-input{color:#757575;font-weight:normal}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input{position:relative}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input .left-icons.sc-tttx-standalone-input,label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input .right-icons.sc-tttx-standalone-input{display:flex;position:absolute;height:24px;gap:8px}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input .left-icons.sc-tttx-standalone-input tttx-icon.sc-tttx-standalone-input,label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input .right-icons.sc-tttx-standalone-input tttx-icon.sc-tttx-standalone-input{height:24px;width:24px}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input .left-icons.sc-tttx-standalone-input{left:8px}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input .right-icons.sc-tttx-standalone-input{right:8px}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input input.sc-tttx-standalone-input,label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input textarea.sc-tttx-standalone-input{color:#212121;box-sizing:border-box;border:1px solid #d5d5d5;border-radius:4px;padding:0;padding-left:16px;padding-right:16px;margin-top:4px}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input input.has-input-icon.sc-tttx-standalone-input,label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input textarea.has-input-icon.sc-tttx-standalone-input{padding-left:40px}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input input.has-input-icon.has-left-icon.sc-tttx-standalone-input,label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input textarea.has-input-icon.has-left-icon.sc-tttx-standalone-input{padding-left:72px}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input input.has-left-icon.sc-tttx-standalone-input,label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input textarea.has-left-icon.sc-tttx-standalone-input{padding-left:40px}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input input.has-right-icon.sc-tttx-standalone-input,label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input textarea.has-right-icon.sc-tttx-standalone-input{padding-right:40px}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input input.invalid.sc-tttx-standalone-input,label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input textarea.invalid.sc-tttx-standalone-input{border:1px solid #dc0000}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input input.sc-tttx-standalone-input:not([type=submit]),label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input textarea.sc-tttx-standalone-input:not([type=submit]){font-family:\"Roboto\", serif;width:100%;height:36px;font-size:16px;line-height:18.752px}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input input[type=radio].sc-tttx-standalone-input,label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input textarea[type=radio].sc-tttx-standalone-input{width:20px;height:20px}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input input[type=date].sc-tttx-standalone-input,label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input textarea[type=date].sc-tttx-standalone-input{background:white;display:block;min-width:calc(100% - 18px);line-height:37px}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input input[readonly].sc-tttx-standalone-input,label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input textarea[readonly].sc-tttx-standalone-input{cursor:default;pointer-events:none;user-select:none;color:gray}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input input.sc-tttx-standalone-input:focus,label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input textarea.sc-tttx-standalone-input:focus{border-color:#1479c6}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input input.sc-tttx-standalone-input:focus-visible,label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input textarea.sc-tttx-standalone-input:focus-visible{outline:none}label.sc-tttx-standalone-input .outer-container.sc-tttx-standalone-input textarea.sc-tttx-standalone-input{padding:8px;height:auto;min-height:100px;resize:vertical}label.sc-tttx-standalone-input .outer-container.inputBlock.sc-tttx-standalone-input{display:flex;align-items:center;line-height:21px}label.sc-tttx-standalone-input .outer-container.inputBlock.sc-tttx-standalone-input .left-icons.sc-tttx-standalone-input,label.sc-tttx-standalone-input .outer-container.inputBlock.sc-tttx-standalone-input .right-icons.sc-tttx-standalone-input{margin-top:4px}label.sc-tttx-standalone-input .outer-container.inputBlock.readonly.sc-tttx-standalone-input{pointer-events:none;user-select:none;color:gray}label.sc-tttx-standalone-input .outer-container.inputBlock.radioBlock.sc-tttx-standalone-input{display:block}label.sc-tttx-standalone-input .outer-container.inputInline.sc-tttx-standalone-input{display:flex;white-space:nowrap;align-items:center;margin:0}label.sc-tttx-standalone-input .outer-container.inputInline.sc-tttx-standalone-input input.sc-tttx-standalone-input{margin-top:0}label.sc-tttx-standalone-input .secondarylabel.sc-tttx-standalone-input{color:#757575;font-size:14px;line-height:16.408px;font-weight:normal;display:flex;margin-top:4px}label.sc-tttx-standalone-input .errorBubble.sc-tttx-standalone-input{position:relative;font-size:14px;line-height:16.408px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000;display:flex;align-content:center;align-items:center;justify-items:center;margin-top:4px}label.sc-tttx-standalone-input .errorBubble.sc-tttx-standalone-input:not(.visible){display:none}label.sc-tttx-standalone-input .errorBubble.sc-tttx-standalone-input span.sc-tttx-standalone-input{color:#dc0000;font-size:16px;margin-right:4px}.material-symbols-rounded.sc-tttx-standalone-input{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}.sc-tttx-standalone-input-h{display:block}";
 

package/dist/cjs/tttx-tabs.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 const domsanitiser_options = require('./domsanitiser.options-32e670aa.js');
 require('./_commonjsHelpers-537d719a.js');
 

package/dist/cjs/tttx-tag.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxTagCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}button{cursor:pointer}.button{font-family:Roboto, serif;box-sizing:border-box;height:36px;min-width:36px;padding:0;margin:0;background:transparent;color:#212121;border:1px solid #c8c8c8;border-radius:4px;text-transform:uppercase;display:flex;justify-content:left;align-items:center;font-size:14px;font-weight:500}.button-content{display:block;padding:0 16px}.icon-left,.icon-right{margin-top:4px}.iconleft{padding-left:8px}.iconleft .button-content{padding-left:4px}.iconright{padding-right:8px}.iconright .button-content{padding-right:4px}.notext{padding:0 6px}.button:active{background:rgba(17, 17, 17, 0.2);border:1px solid #d5d5d5}.primary{background:#1479c6;border:1px solid #1479c6;color:white}.primary:active{background:#1464a2;border:1px solid #1464a2}.borderless{background:transparent;border:none;color:#212121}.borderless:active{background:rgba(17, 17, 17, 0.2);border:none}.borderless-circle{background:transparent;border:none;color:#212121;border-radius:50%}.borderless-circle:active{border:none}.borderless-circle:focus{border-color:transparent}.danger{background:#dc0000;border:1px solid #dc0000;color:white}.danger:active{background:#b00000;border:1px solid #b00000}.disabled{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:active{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}@media (hover: hover){.button:hover{background:rgba(17, 17, 17, 0.1);border:1px solid #d5d5d5}.primary:hover{background:#146eb3;border:1px solid #146eb3}.borderless:hover{background:rgba(17, 17, 17, 0.1);border:none}.borderless-circle:hover{background:rgba(17, 17, 17, 0.1);border:none}.danger:hover{background:#c60000;border:1px solid #c60000}.disabled:hover{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}}:host{display:inline-block}.tag{border-radius:20px;padding:4px;font-family:\"Roboto\", sans-serif;font-size:14px;font-weight:400}.tag span{margin-left:4px;margin-right:4px}.icon{height:18px;width:18px;font-weight:400}";
 

package/dist/cjs/tttx-textarea.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 const tttxTextareaCss = ".material-symbols-rounded.sc-tttx-textarea{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.sc-tttx-textarea-h{display:block}label.sc-tttx-textarea{font-weight:500;font-size:16px;line-height:18.752px;color:#212121}label.sc-tttx-textarea .textarea-container.sc-tttx-textarea{position:relative}label.sc-tttx-textarea .textarea-container.sc-tttx-textarea textarea.sc-tttx-textarea{font-family:\"Roboto\", serif;box-sizing:border-box;width:100%;padding:9px 16px;font-size:16px;line-height:18.752px;border:1px solid #d5d5d5;border-radius:4px;margin-top:8px;resize:none}label.sc-tttx-textarea .textarea-container.sc-tttx-textarea textarea.no-label.sc-tttx-textarea{margin-top:0}label.sc-tttx-textarea .textarea-container.sc-tttx-textarea textarea.sc-tttx-textarea~.errorBubble.sc-tttx-textarea{font-size:14px;line-height:16.408px;font-weight:normal;width:100%;font-family:\"Roboto\", sans-serif;color:#dc0000;display:flex;align-content:center;align-items:center;justify-items:center;margin-top:4px}label.sc-tttx-textarea .textarea-container.sc-tttx-textarea textarea.sc-tttx-textarea~.errorBubble.sc-tttx-textarea:not(.visible){display:none}label.sc-tttx-textarea .textarea-container.sc-tttx-textarea textarea.sc-tttx-textarea~.errorBubble.sc-tttx-textarea span.sc-tttx-textarea{color:#dc0000;font-size:16px;margin-right:4px}label.sc-tttx-textarea .textarea-container.sc-tttx-textarea textarea.sc-tttx-textarea:focus{border-color:#1479c6}label.sc-tttx-textarea .textarea-container.sc-tttx-textarea textarea.sc-tttx-textarea:focus-visible{outline:none}label.sc-tttx-textarea .secondarylabel.sc-tttx-textarea{color:#757575;font-size:14px;line-height:16.408px;font-weight:normal;display:flex;margin-top:4px}label.sc-tttx-textarea .optional.sc-tttx-textarea{color:#757575;font-weight:normal}";
 

package/dist/cjs/tttx-tree-view.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 const domsanitiser_options = require('./domsanitiser.options-32e670aa.js');
 require('./_commonjsHelpers-537d719a.js');
 

package/dist/cjs/tttx.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-992a9fb3.js');
+const index = require('./index-fdc30724.js');
 
 /*
  Stencil Client Patch Browser v2.22.3 | MIT Licensed | https://stenciljs.com

package/dist/collection/components/molecules/tttx-dialog/tttx-dialog.js

@@ -19,14 +19,14 @@ export class TttxDialog {
       this.elementSize = this.size;
     }
   }
-  preventCancelOnDialog(event) {
-    event.preventDefault();
+  emitDialogClose() {
+    this.closeButtonClick.emit();
   }
   componentDidLoad() {
-    this.dialog.addEventListener('cancel', this.preventCancelOnDialog);
+    this.dialog.addEventListener('close', this.emitDialogClose.bind(this));
   }
   onCloseClickHandler() {
-    this.closeButtonClick.emit();
+    this.dialog.close();
   }
   headerIconDetails(iconEnabled) {
     if (!iconEnabled)

package/dist/collection/components/molecules/tttx-dialog-box/tttx-dialog-box.js

@@ -4,6 +4,9 @@ import * as DOMPurify from 'dompurify';
 import domSanitiserOptions from '../../../shared/domsanitiser.options';
 export class TttxDialogBox {
   constructor() {
+    this.emitDialogClose = () => {
+      this.closeButtonClick.emit();
+    };
     this.data = undefined;
     this.size = 'regular';
     this.open = false;
@@ -19,37 +22,25 @@ export class TttxDialogBox {
     }
   }
   componentDidRender() {
-    if (!this.dialog())
+    if (!this.dialog)
       return;
+    this.dialog.removeEventListener('close', this.emitDialogClose);
+    this.dialog.addEventListener('close', this.emitDialogClose);
     if (!this.open) {
-      this.dialog().close();
+      this.dialog.close();
       return;
     }
     // istanbul ignore next
-    if (!this.dialog().open)
-      this.dialog().showModal();
-  }
-  preventCancelOnDialog(event) {
-    event.preventDefault();
-  }
-  componentDidLoad() {
-    var _a;
-    (_a = this.dialog()) === null || _a === void 0 ? void 0 : _a.addEventListener('cancel', this.preventCancelOnDialog);
-  }
-  disconnectedCallback() {
-    var _a;
-    (_a = this.dialog()) === null || _a === void 0 ? void 0 : _a.removeEventListener('cancel', this.preventCancelOnDialog);
+    if (!this.dialog.open)
+      this.dialog.showModal();
   }
   onCloseClickHandler() {
     this.open = false;
-    this.closeButtonClick.emit({ close: true });
+    this.dialog.close();
   }
   onButtonClickHandler(index) {
     this.buttonClick.emit({ buttonNumber: index, buttonClicked: true });
   }
-  dialog() {
-    return this.el.shadowRoot.querySelector('dialog');
-  }
   renderHeader(header) {
     const title = header.title;
     const iconName = header.iconName;
@@ -92,7 +83,7 @@ export class TttxDialogBox {
     else {
       this._data = this.data;
     }
-    return (h("dialog", { class: `dialog-box ${this.allowOverflow ? 'overflow-visible' : ''} ${this.elementSize}` }, h("div", { class: "contents" }, h("div", { class: `dialog-box-padding dialog-box-header-box ${this._data.type || ''}` }, this.renderHeader(this._data.header)), h("div", { class: "dialog-box-padding dialog-box-body-box" }, this.renderContent(this._data.body)), h("div", { class: "dialog-box-padding dialog-box-footer-box" }, this.renderFooter(this._data.footer)))));
+    return (h("dialog", { ref: (el) => this.dialog = el, class: `dialog-box ${this.allowOverflow ? 'overflow-visible' : ''} ${this.elementSize}` }, h("div", { class: "contents" }, h("div", { class: `dialog-box-padding dialog-box-header-box ${this._data.type || ''}` }, this.renderHeader(this._data.header)), h("div", { class: "dialog-box-padding dialog-box-body-box" }, this.renderContent(this._data.body)), h("div", { class: "dialog-box-padding dialog-box-footer-box" }, this.renderFooter(this._data.footer)))));
   }
   static get is() { return "tttx-dialog-box"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/molecules/tttx-form/tttx-form.js

@@ -153,7 +153,8 @@ export class TttxForm {
     select.style.display = 'none';
     tttxSelect.addEventListener('selectItemEvent', function (ev) {
       select.value = ev.detail.value;
-      select.onblur({ target: select });
+      select.onblur({ target: select }); // triggers validator
+      select.onchange({ target: select }); // triggers dataChanged event
     });
     return { input: select, overlay: fragment };
   }

package/dist/components/tttx-dialog-box.js

@@ -12,6 +12,9 @@ const TttxDialogBox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
     this.__attachShadow();
     this.closeButtonClick = createEvent(this, "closeButtonClick", 6);
     this.buttonClick = createEvent(this, "buttonClick", 7);
+    this.emitDialogClose = () => {
+      this.closeButtonClick.emit();
+    };
     this.data = undefined;
     this.size = 'regular';
     this.open = false;
@@ -27,37 +30,25 @@ const TttxDialogBox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
     }
   }
   componentDidRender() {
-    if (!this.dialog())
+    if (!this.dialog)
       return;
+    this.dialog.removeEventListener('close', this.emitDialogClose);
+    this.dialog.addEventListener('close', this.emitDialogClose);
     if (!this.open) {
-      this.dialog().close();
+      this.dialog.close();
       return;
     }
     // istanbul ignore next
-    if (!this.dialog().open)
-      this.dialog().showModal();
-  }
-  preventCancelOnDialog(event) {
-    event.preventDefault();
-  }
-  componentDidLoad() {
-    var _a;
-    (_a = this.dialog()) === null || _a === void 0 ? void 0 : _a.addEventListener('cancel', this.preventCancelOnDialog);
-  }
-  disconnectedCallback() {
-    var _a;
-    (_a = this.dialog()) === null || _a === void 0 ? void 0 : _a.removeEventListener('cancel', this.preventCancelOnDialog);
+    if (!this.dialog.open)
+      this.dialog.showModal();
   }
   onCloseClickHandler() {
     this.open = false;
-    this.closeButtonClick.emit({ close: true });
+    this.dialog.close();
   }
   onButtonClickHandler(index) {
     this.buttonClick.emit({ buttonNumber: index, buttonClicked: true });
   }
-  dialog() {
-    return this.el.shadowRoot.querySelector('dialog');
-  }
   renderHeader(header) {
     const title = header.title;
     const iconName = header.iconName;
@@ -100,7 +91,7 @@ const TttxDialogBox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
     else {
       this._data = this.data;
     }
-    return (h("dialog", { class: `dialog-box ${this.allowOverflow ? 'overflow-visible' : ''} ${this.elementSize}` }, h("div", { class: "contents" }, h("div", { class: `dialog-box-padding dialog-box-header-box ${this._data.type || ''}` }, this.renderHeader(this._data.header)), h("div", { class: "dialog-box-padding dialog-box-body-box" }, this.renderContent(this._data.body)), h("div", { class: "dialog-box-padding dialog-box-footer-box" }, this.renderFooter(this._data.footer)))));
+    return (h("dialog", { ref: (el) => this.dialog = el, class: `dialog-box ${this.allowOverflow ? 'overflow-visible' : ''} ${this.elementSize}` }, h("div", { class: "contents" }, h("div", { class: `dialog-box-padding dialog-box-header-box ${this._data.type || ''}` }, this.renderHeader(this._data.header)), h("div", { class: "dialog-box-padding dialog-box-body-box" }, this.renderContent(this._data.body)), h("div", { class: "dialog-box-padding dialog-box-footer-box" }, this.renderFooter(this._data.footer)))));
   }
   get el() { return this; }
   static get style() { return tttxDialogBoxCss; }

package/dist/components/tttx-dialog.js

@@ -32,14 +32,14 @@ const TttxDialog$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
       this.elementSize = this.size;
     }
   }
-  preventCancelOnDialog(event) {
-    event.preventDefault();
+  emitDialogClose() {
+    this.closeButtonClick.emit();
   }
   componentDidLoad() {
-    this.dialog.addEventListener('cancel', this.preventCancelOnDialog);
+    this.dialog.addEventListener('close', this.emitDialogClose.bind(this));
   }
   onCloseClickHandler() {
-    this.closeButtonClick.emit();
+    this.dialog.close();
   }
   headerIconDetails(iconEnabled) {
     if (!iconEnabled)

package/dist/components/tttx-form.js

@@ -283,7 +283,8 @@ const TttxForm$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     select.style.display = 'none';
     tttxSelect.addEventListener('selectItemEvent', function (ev) {
       select.value = ev.detail.value;
-      select.onblur({ target: select });
+      select.onblur({ target: select }); // triggers validator
+      select.onchange({ target: select }); // triggers dataChanged event
     });
     return { input: select, overlay: fragment };
   }

package/dist/esm/{index-b11965d8.js → index-88bd2f60.js}

@@ -1767,16 +1767,12 @@ const setContentReference = (elm) => {
 const disconnectedCallback = (elm) => {
     if ((plt.$flags$ & 1 /* PLATFORM_FLAGS.isTmpDisconnected */) === 0) {
         const hostRef = getHostRef(elm);
-        const instance = hostRef.$lazyInstance$ ;
         {
             if (hostRef.$rmListeners$) {
                 hostRef.$rmListeners$.map((rmListener) => rmListener());
                 hostRef.$rmListeners$ = undefined;
             }
         }
-        {
-            safeCall(instance, 'disconnectedCallback');
-        }
     }
 };
 const bootstrapLazy = (lazyBundles, options = {}) => {

package/dist/esm/loader.js

@@ -1,5 +1,5 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-b11965d8.js';
-export { s as setNonce } from './index-b11965d8.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-88bd2f60.js';
+export { s as setNonce } from './index-88bd2f60.js';
 
 /*
  Stencil Client Patch Esm v2.22.3 | MIT Licensed | https://stenciljs.com

package/dist/esm/tttx-button.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-b11965d8.js';
+import { r as registerInstance, h, H as Host } from './index-88bd2f60.js';
 
 const tttxButtonCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}button{cursor:pointer}.button{font-family:Roboto, serif;box-sizing:border-box;height:36px;min-width:36px;padding:0;margin:0;background:transparent;color:#212121;border:1px solid #c8c8c8;border-radius:4px;text-transform:uppercase;display:flex;justify-content:left;align-items:center;font-size:14px;font-weight:500}.button-content{display:block;padding:0 16px}.icon-left,.icon-right{margin-top:4px}.iconleft{padding-left:8px}.iconleft .button-content{padding-left:4px}.iconright{padding-right:8px}.iconright .button-content{padding-right:4px}.notext{padding:0 6px}.button:active{background:rgba(17, 17, 17, 0.2);border:1px solid #d5d5d5}.primary{background:#1479c6;border:1px solid #1479c6;color:white}.primary:active{background:#1464a2;border:1px solid #1464a2}.borderless{background:transparent;border:none;color:#212121}.borderless:active{background:rgba(17, 17, 17, 0.2);border:none}.borderless-circle{background:transparent;border:none;color:#212121;border-radius:50%}.borderless-circle:active{border:none}.borderless-circle:focus{border-color:transparent}.danger{background:#dc0000;border:1px solid #dc0000;color:white}.danger:active{background:#b00000;border:1px solid #b00000}.disabled{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}.disabled:active{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}@media (hover: hover){.button:hover{background:rgba(17, 17, 17, 0.1);border:1px solid #d5d5d5}.primary:hover{background:#146eb3;border:1px solid #146eb3}.borderless:hover{background:rgba(17, 17, 17, 0.1);border:none}.borderless-circle:hover{background:rgba(17, 17, 17, 0.1);border:none}.danger:hover{background:#c60000;border:1px solid #c60000}.disabled:hover{background:#aeaeae;border:none;color:#4c4c4c;cursor:not-allowed}}:host{display:inline-block}tttx-icon{cursor:inherit}.spacingleft{margin-left:8px}";
 

package/dist/esm/tttx-checkbox-group-caption.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-b11965d8.js';
+import { r as registerInstance, h, H as Host } from './index-88bd2f60.js';
 
 const tttxCheckboxGroupCss = ".material-symbols-rounded{font-variation-settings:\"FILL\" 1, \"wght\" 400, \"GRAD\" 0, \"opsz\" 24}.tttx-checkbox-group{display:flex;flex-direction:column}.tttx-checkbox-group__caption{color:#757575;font-family:\"Roboto\", sans-serif;font-size:14px;font-weight:normal;line-height:18.752px;margin-bottom:4px}.tttx-checkbox-group__heading{color:#212121;font-family:\"Roboto\", sans-serif;font-size:16px;font-weight:500;line-height:16.408px;margin-bottom:4px}";