@3t-transform/threeteeui 0.2.76 → 0.2.78

package/dist/collection/components/molecules/tttx-textarea/tttx-textarea.stories.js

@@ -0,0 +1,107 @@
+export default {
+  title: 'Molecules/Textarea',
+  component: 'tttx-textarea',
+  argTypes: {
+    label: {
+      control: { type: 'text' },
+    },
+    secondarylabel: {
+      control: { type: 'text' },
+    },
+    errormsg: {
+      control: { type: 'text' },
+    },
+    showerrorbubble: {
+      control: { type: 'boolean' },
+    },
+    showerrormsg: {
+      control: { type: 'boolean' },
+    },
+    disabled: {
+      control: { type: 'boolean' },
+    },
+    maxlength: {
+      control: { type: 'text' },
+    },
+    minlength: {
+      control: { type: 'text' },
+    },
+    name: {
+      control: { type: 'text' },
+    },
+    pattern: {
+      control: { type: 'text' },
+    },
+    placeholder: {
+      control: { type: 'text' },
+    },
+    readonly: {
+      control: { type: 'boolean' },
+    },
+    required: {
+      control: { type: 'boolean' },
+    },
+    resize: {
+      control: { type: 'boolean' },
+    },
+    rows: {
+      control: { type: 'number' },
+    },
+    value: {
+      control: { type: 'text' },
+    },
+  },
+};
+const TemplateTextarea = ({ iconleft, iconleftcolor, iconright, iconrightcolor, inputicon, inputiconcolor, label, secondarylabel, errormsg, showerrorbubble, showerrormsg, disabled, maxlength, minlength, name, pattern, placeholder, readonly, required, resize = false, rows, type, value, }) => `
+<tttx-textarea
+  iconleft="${iconleft || ''}"
+  iconleftcolor="${iconleftcolor || ''}"
+  iconright="${iconright || ''}"
+  iconrightcolor="${iconrightcolor || ''}"
+  inputicon="${inputicon || ''}"
+  inputiconcolor="${inputiconcolor || ''}"
+  label="${label}"
+  ${secondarylabel ? `secondarylabel="${secondarylabel}"` : ''}
+  errormsg="${errormsg}"
+  showerrorbubble="${showerrorbubble === false ? 'false' : 'true'}"
+  ${showerrormsg ? 'showerrormsg' : ''}
+  ${disabled ? 'disabled' : ''}
+  ${maxlength ? `maxlength=${maxlength}` : ''}
+  ${minlength ? `minlength=${minlength}` : ''}
+  ${name ? `name=${name}` : ''}
+  ${pattern ? `pattern=${pattern}` : ''}
+  ${placeholder ? `placeholder="${placeholder}"` : ''}
+  ${readonly ? 'readonly' : ''}
+  ${required ? 'required' : ''}
+  rows=${rows}
+  ${resize ? 'resize' : ''}
+  type="${type}"
+  value="${value}"  
+
+/>
+`;
+export const Textarea = TemplateTextarea.bind({});
+Textarea.args = {
+  value: '',
+  label: 'First name',
+  secondarylabel: 'First name can be up to 100 characters long',
+  maxlength: '100',
+  type: 'text',
+  errormsg: 'Please enter your first name',
+  required: false,
+  showerrormsg: false,
+  placeholder: 'Enter first name',
+};
+export const ResizableTextarea = TemplateTextarea.bind({});
+ResizableTextarea.args = {
+  value: '',
+  label: 'First name',
+  secondarylabel: 'First name can be up to 100 characters long',
+  maxlength: '100',
+  type: 'text',
+  errormsg: 'Please enter your first name',
+  required: false,
+  showerrormsg: false,
+  placeholder: 'Enter first name',
+  resize: true
+};

package/dist/components/index.d.ts

@@ -14,6 +14,7 @@ export { TttxSorter as TttxSorter } from '../types/components/molecules/tttx-sor
 export { TttxInput as TttxStandaloneInput } from '../types/components/molecules/tttx-standalone-input/tttx-standalone-input';
 export { TttxTabs as TttxTabs } from '../types/components/molecules/tttx-tabs/tttx-tabs';
 export { TttxTag as TttxTag } from '../types/components/atoms/tttx-tag/tttx-tag';
+export { TttxTextarea as TttxTextarea } from '../types/components/molecules/tttx-textarea/tttx-textarea';
 export { TttxToolbar as TttxToolbar } from '../types/components/molecules/tttx-toolbar/tttx-toolbar';
 export { TttxTreeView as TttxTreeView } from '../types/components/molecules/tttx-tree-view/tttx-tree-view';
 

package/dist/components/index.js

@@ -14,5 +14,6 @@ export { TttxSorter, defineCustomElement as defineCustomElementTttxSorter } from
 export { TttxStandaloneInput, defineCustomElement as defineCustomElementTttxStandaloneInput } from './tttx-standalone-input.js';
 export { TttxTabs, defineCustomElement as defineCustomElementTttxTabs } from './tttx-tabs.js';
 export { TttxTag, defineCustomElement as defineCustomElementTttxTag } from './tttx-tag.js';
+export { TttxTextarea, defineCustomElement as defineCustomElementTttxTextarea } from './tttx-textarea.js';
 export { TttxToolbar, defineCustomElement as defineCustomElementTttxToolbar } from './tttx-toolbar.js';
 export { TttxTreeView, defineCustomElement as defineCustomElementTttxTreeView } from './tttx-tree-view.js';

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

@@ -72,10 +72,13 @@ const TttxMultiselectBox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     }
     return h("div", null, this.visibleValue);
   }
+  optionFoundInSearchTerm(option) {
+    return option.label.toLowerCase().indexOf(this.searchTerm.toLowerCase()) === -1;
+  }
   dropdownOption(option) {
     // This is tested in e2e tests
     /* istanbul ignore next */
-    const hideOption = this.searchEnabled && option.label.toLowerCase().indexOf(this.searchTerm.toLowerCase()) === -1;
+    const hideOption = this.searchEnabled && this.optionFoundInSearchTerm(option);
     const checkboxIcon = option.selected ? 'check_box' : 'check_box_outline_blank';
     const checkboxColor = option.selected ? 'blue' : 'grey';
     if (option.html) {
@@ -102,7 +105,7 @@ const TttxMultiselectBox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     if (this.searchEnabled)
       dropdownMenuMaxHeight += 52;
     if (bottomPosY + dropdownMenuMaxHeight > window.innerHeight) {
-      this.bodyOffset = { bottom: '16px', position: 'fixed', width: `${dropdownSelector.offsetWidth}px` };
+      this.bodyOffset = { top: `${window.innerHeight - (dropdownMenuMaxHeight + 16)}px`, position: 'fixed', width: `${dropdownSelector.offsetWidth}px` };
     }
     else {
       this.bodyOffset = {};

package/dist/components/tttx-textarea.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface TttxTextarea extends Components.TttxTextarea, HTMLElement {}
+export const TttxTextarea: {
+  prototype: TttxTextarea;
+  new (): TttxTextarea;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/tttx-textarea.js

@@ -0,0 +1,90 @@
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+
+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}.textarea-container.sc-tttx-textarea{position:relative}textarea.sc-tttx-textarea{font-family:\"Roboto\", serif;box-sizing:border-box;width:100%;padding:9px 16px;font-size:16px;line-height:19px;border:1px solid #d5d5d5;border-radius:4px;margin-top:8px;resize:none}textarea.no-label.sc-tttx-textarea{margin-top:0}textarea.sc-tttx-textarea~.errorBubble.sc-tttx-textarea{font-size:14px;line-height:16px;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}textarea.sc-tttx-textarea~.errorBubble.sc-tttx-textarea:not(.visible){display:none}textarea.sc-tttx-textarea~.errorBubble.sc-tttx-textarea span.sc-tttx-textarea{color:#dc0000;font-size:16px;margin-right:4px}.secondarylabel.sc-tttx-textarea{color:#757575;font-size:14px;line-height:16px;font-weight:normal;display:flex;margin-top:4px}.optional.sc-tttx-textarea{color:#757575;font-weight:normal}";
+
+const TttxTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.valueChanged = createEvent(this, "valueChanged", 7);
+    this.focusChanged = createEvent(this, "focusChanged", 7);
+    this.blurChanged = createEvent(this, "blurChanged", 7);
+    this.invalidChanged = createEvent(this, "invalidChanged", 7);
+    this.label = undefined;
+    this.secondarylabel = undefined;
+    this.showerrormsg = undefined;
+    this.showerrorbubble = true;
+    this.errormsg = undefined;
+    this.rows = undefined;
+    this.textareaautofocus = undefined;
+    this.inputkeyhint = undefined;
+    this.inputindex = undefined;
+    this.inputtitle = undefined;
+    this.disabled = undefined;
+    this.maxlength = undefined;
+    this.name = undefined;
+    this.placeholder = undefined;
+    this.readonly = undefined;
+    this.required = undefined;
+    this.value = undefined;
+  }
+  handleChange(event) {
+    const target = event.target;
+    this.value = target.value;
+    this.valueChanged.emit(target.value);
+  }
+  handleFocus(event) {
+    const target = event.target;
+    this.focusChanged.emit(target.value);
+  }
+  handleBlur(event) {
+    const target = event.target;
+    this.blurChanged.emit(target.value);
+  }
+  handleInvalid(event) {
+    event.preventDefault();
+    const target = event.target;
+    this.invalidChanged.emit(target.value);
+  }
+  render() {
+    const classNames = [this.showerrormsg ? 'invalid' : '', !this.label && this.required ? 'no-label' : ''].join(' ');
+    return (h(Host, null, h("label", null, this.label, !this.required ? h("span", { class: "optional" }, "\u00A0(optional)") : '', h("div", { class: "textarea-container" }, h("textarea", { rows: this.rows, class: classNames, autofocus: this.textareaautofocus, enterkeyhint: this.inputkeyhint, tabindex: this.inputindex, title: this.inputtitle, disabled: this.disabled, maxlength: this.maxlength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, value: this.value, onBlur: this.handleBlur.bind(this), onFocus: this.handleFocus.bind(this), onInput: this.handleChange.bind(this), onInvalid: this.handleInvalid.bind(this) }), this.secondarylabel && h("span", { class: "secondarylabel" }, this.secondarylabel), this.showerrorbubble && (h("span", { class: ['errorBubble', this.showerrormsg && this.errormsg ? 'visible' : ''].join(' ') }, h("span", { class: "material-symbols-rounded validationicon" }, "warning"), " ", this.errormsg))))));
+  }
+  static get style() { return tttxTextareaCss; }
+}, [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]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["tttx-textarea"];
+  components.forEach(tagName => { switch (tagName) {
+    case "tttx-textarea":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, TttxTextarea$1);
+      }
+      break;
+  } });
+}
+
+const TttxTextarea = TttxTextarea$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { TttxTextarea, defineCustomElement };

package/dist/esm/loader.js

@@ -11,7 +11,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return bootstrapLazy([["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]}]]],["tttx-filter",[[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"]]]]],["tttx-list",[[1,"tttx-list",{"data":[1025],"name":[1],"_data":[32]}]]],["tttx-sorter",[[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"]]]]],["tttx-tabs",[[2,"tttx-tabs",{"tabsName":[1,"tabs-name"],"navigation":[4],"wide":[4],"tabs":[1],"_tabs":[32]},[[0,"keydown","handleKeyDown"]]]]],["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-qrcode",[[1,"tttx-qrcode",{"link":[1025],"size":[1026]}]]],["tttx-tag",[[1,"tttx-tag",{"text":[1],"color":[1]}]]],["tttx-toolbar",[[1,"tttx-toolbar",{"border":[4],"viewSize":[32]},[[9,"resize","handleResize"]]]]],["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-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"iconcolor":[1025],"design":[1]}]]]], options);
+  return bootstrapLazy([["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]}]]],["tttx-filter",[[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"]]]]],["tttx-list",[[1,"tttx-list",{"data":[1025],"name":[1],"_data":[32]}]]],["tttx-sorter",[[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"]]]]],["tttx-tabs",[[2,"tttx-tabs",{"tabsName":[1,"tabs-name"],"navigation":[4],"wide":[4],"tabs":[1],"_tabs":[32]},[[0,"keydown","handleKeyDown"]]]]],["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-qrcode",[[1,"tttx-qrcode",{"link":[1025],"size":[1026]}]]],["tttx-tag",[[1,"tttx-tag",{"text":[1],"color":[1]}]]],["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-toolbar",[[1,"tttx-toolbar",{"border":[4],"viewSize":[32]},[[9,"resize","handleResize"]]]]],["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-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"iconcolor":[1025],"design":[1]}]]]], options);
   });
 };
 

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

@@ -68,10 +68,13 @@ const TttxMultiselectBox = class {
     }
     return h("div", null, this.visibleValue);
   }
+  optionFoundInSearchTerm(option) {
+    return option.label.toLowerCase().indexOf(this.searchTerm.toLowerCase()) === -1;
+  }
   dropdownOption(option) {
     // This is tested in e2e tests
     /* istanbul ignore next */
-    const hideOption = this.searchEnabled && option.label.toLowerCase().indexOf(this.searchTerm.toLowerCase()) === -1;
+    const hideOption = this.searchEnabled && this.optionFoundInSearchTerm(option);
     const checkboxIcon = option.selected ? 'check_box' : 'check_box_outline_blank';
     const checkboxColor = option.selected ? 'blue' : 'grey';
     if (option.html) {
@@ -98,7 +101,7 @@ const TttxMultiselectBox = class {
     if (this.searchEnabled)
       dropdownMenuMaxHeight += 52;
     if (bottomPosY + dropdownMenuMaxHeight > window.innerHeight) {
-      this.bodyOffset = { bottom: '16px', position: 'fixed', width: `${dropdownSelector.offsetWidth}px` };
+      this.bodyOffset = { top: `${window.innerHeight - (dropdownMenuMaxHeight + 16)}px`, position: 'fixed', width: `${dropdownSelector.offsetWidth}px` };
     }
     else {
       this.bodyOffset = {};

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

@@ -0,0 +1,55 @@
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-6a372ea6.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}.textarea-container.sc-tttx-textarea{position:relative}textarea.sc-tttx-textarea{font-family:\"Roboto\", serif;box-sizing:border-box;width:100%;padding:9px 16px;font-size:16px;line-height:19px;border:1px solid #d5d5d5;border-radius:4px;margin-top:8px;resize:none}textarea.no-label.sc-tttx-textarea{margin-top:0}textarea.sc-tttx-textarea~.errorBubble.sc-tttx-textarea{font-size:14px;line-height:16px;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}textarea.sc-tttx-textarea~.errorBubble.sc-tttx-textarea:not(.visible){display:none}textarea.sc-tttx-textarea~.errorBubble.sc-tttx-textarea span.sc-tttx-textarea{color:#dc0000;font-size:16px;margin-right:4px}.secondarylabel.sc-tttx-textarea{color:#757575;font-size:14px;line-height:16px;font-weight:normal;display:flex;margin-top:4px}.optional.sc-tttx-textarea{color:#757575;font-weight:normal}";
+
+const TttxTextarea = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.valueChanged = createEvent(this, "valueChanged", 7);
+    this.focusChanged = createEvent(this, "focusChanged", 7);
+    this.blurChanged = createEvent(this, "blurChanged", 7);
+    this.invalidChanged = createEvent(this, "invalidChanged", 7);
+    this.label = undefined;
+    this.secondarylabel = undefined;
+    this.showerrormsg = undefined;
+    this.showerrorbubble = true;
+    this.errormsg = undefined;
+    this.rows = undefined;
+    this.textareaautofocus = undefined;
+    this.inputkeyhint = undefined;
+    this.inputindex = undefined;
+    this.inputtitle = undefined;
+    this.disabled = undefined;
+    this.maxlength = undefined;
+    this.name = undefined;
+    this.placeholder = undefined;
+    this.readonly = undefined;
+    this.required = undefined;
+    this.value = undefined;
+  }
+  handleChange(event) {
+    const target = event.target;
+    this.value = target.value;
+    this.valueChanged.emit(target.value);
+  }
+  handleFocus(event) {
+    const target = event.target;
+    this.focusChanged.emit(target.value);
+  }
+  handleBlur(event) {
+    const target = event.target;
+    this.blurChanged.emit(target.value);
+  }
+  handleInvalid(event) {
+    event.preventDefault();
+    const target = event.target;
+    this.invalidChanged.emit(target.value);
+  }
+  render() {
+    const classNames = [this.showerrormsg ? 'invalid' : '', !this.label && this.required ? 'no-label' : ''].join(' ');
+    return (h(Host, null, h("label", null, this.label, !this.required ? h("span", { class: "optional" }, "\u00A0(optional)") : '', h("div", { class: "textarea-container" }, h("textarea", { rows: this.rows, class: classNames, autofocus: this.textareaautofocus, enterkeyhint: this.inputkeyhint, tabindex: this.inputindex, title: this.inputtitle, disabled: this.disabled, maxlength: this.maxlength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, value: this.value, onBlur: this.handleBlur.bind(this), onFocus: this.handleFocus.bind(this), onInput: this.handleChange.bind(this), onInvalid: this.handleInvalid.bind(this) }), this.secondarylabel && h("span", { class: "secondarylabel" }, this.secondarylabel), this.showerrorbubble && (h("span", { class: ['errorBubble', this.showerrormsg && this.errormsg ? 'visible' : ''].join(' ') }, h("span", { class: "material-symbols-rounded validationicon" }, "warning"), " ", this.errormsg))))));
+  }
+};
+TttxTextarea.style = tttxTextareaCss;
+
+export { TttxTextarea as tttx_textarea };

package/dist/esm/tttx.js

@@ -14,5 +14,5 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return bootstrapLazy([["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]}]]],["tttx-filter",[[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"]]]]],["tttx-list",[[1,"tttx-list",{"data":[1025],"name":[1],"_data":[32]}]]],["tttx-sorter",[[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"]]]]],["tttx-tabs",[[2,"tttx-tabs",{"tabsName":[1,"tabs-name"],"navigation":[4],"wide":[4],"tabs":[1],"_tabs":[32]},[[0,"keydown","handleKeyDown"]]]]],["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-qrcode",[[1,"tttx-qrcode",{"link":[1025],"size":[1026]}]]],["tttx-tag",[[1,"tttx-tag",{"text":[1],"color":[1]}]]],["tttx-toolbar",[[1,"tttx-toolbar",{"border":[4],"viewSize":[32]},[[9,"resize","handleResize"]]]]],["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-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"iconcolor":[1025],"design":[1]}]]]], options);
+  return bootstrapLazy([["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]}]]],["tttx-filter",[[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"]]]]],["tttx-list",[[1,"tttx-list",{"data":[1025],"name":[1],"_data":[32]}]]],["tttx-sorter",[[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"]]]]],["tttx-tabs",[[2,"tttx-tabs",{"tabsName":[1,"tabs-name"],"navigation":[4],"wide":[4],"tabs":[1],"_tabs":[32]},[[0,"keydown","handleKeyDown"]]]]],["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-qrcode",[[1,"tttx-qrcode",{"link":[1025],"size":[1026]}]]],["tttx-tag",[[1,"tttx-tag",{"text":[1],"color":[1]}]]],["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-toolbar",[[1,"tttx-toolbar",{"border":[4],"viewSize":[32]},[[9,"resize","handleResize"]]]]],["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-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"iconcolor":[1025],"design":[1]}]]]], options);
 });

package/dist/tttx/p-5f1f699d.entry.js

@@ -0,0 +1 @@
+import{r as o,c as t,h as i,H as s,g as e}from"./p-3f1b6013.js";import{p as n,d}from"./p-5ed38d61.js";import"./p-112455b1.js";const r=class{constructor(i){o(this,i),this.selectItemEvent=t(this,"selectItemEvent",7),this.toggleOpen=t(this,"toggleOpen",7),this.changesApplied=t(this,"changesApplied",7),this.bodyOffset={},this.optionsData=null,this.label=void 0,this.inline=void 0,this.placeholder="",this.searchEnabled=void 0,this.htmlVisibleValue=void 0,this.visibleValue=void 0,this.open=!1,this.unsavedSelectedItems=void 0,this.searchTerm=""}handleCloseSelectBox(){this.open=!1}handleBlur(){this.open=!1,this.toggleOpen.emit(!1)}safelyCloneArray(o){return JSON.parse(JSON.stringify(o))}onDropdownClicked(){this.open=!this.open,this.searchTerm="",this.calculateDropdownMenuOffset(),this.toggleOpen.emit(this.open)}onCancel(){this.open=!1,this.unsavedSelectedItems=this.safelyCloneArray(this._optionsData),this.toggleOpen.emit(!1)}applyChanges(){this.open=!1,this.changesApplied.emit(this.safelyCloneArray(this.unsavedSelectedItems))}onItemSelected(o){const t=this.unsavedSelectedItems.findIndex((t=>t.value===o.value));this.unsavedSelectedItems[t]=Object.assign(Object.assign({},o),{selected:!o.selected}),this.unsavedSelectedItems=[...this.unsavedSelectedItems],this.selectItemEvent.emit(o)}dropdownSelectorContent(){if(!this._optionsData.find((o=>o.selected)))return i("div",{class:"placeholder"},this.placeholder);if(this.htmlVisibleValue){const o=n.sanitize(this.visibleValue,d);return i("div",{class:"dropdown-selector-html-content",innerHTML:o})}return i("div",null,this.visibleValue)}optionFoundInSearchTerm(o){return-1===o.label.toLowerCase().indexOf(this.searchTerm.toLowerCase())}dropdownOption(o){const t=this.searchEnabled&&this.optionFoundInSearchTerm(o),s=o.selected?"check_box":"check_box_outline_blank",e=o.selected?"blue":"grey";if(o.html){const r=n.sanitize(o.html,d);return i("div",{class:`dropdown-option ${t?"hidden":""} ${o.selected?"selected":""}`,onClick:this.onItemSelected.bind(this,o),key:o.label},i("tttx-icon",{icon:s,color:e,class:"checkbox-icon"}),i("div",{innerHTML:r}))}return i("div",{class:`dropdown-option ${t?"hidden":""} ${o.selected?"selected":""}`,onClick:this.onItemSelected.bind(this,o),key:o.label},i("tttx-icon",{icon:s,color:e,class:"checkbox-icon"}),i("div",{class:"plaintext-option"},o.label))}handleSearchInput(o){this.searchTerm=o.target.value}calculateDropdownMenuOffset(){const o=this.el.shadowRoot.querySelector(".dropdown-selector"),t=o.getBoundingClientRect().bottom;let i=Math.min(288,36*this._optionsData.length)+45+8;this.searchEnabled&&(i+=52),this.bodyOffset=t+i>window.innerHeight?{top:window.innerHeight-(i+16)+"px",position:"fixed",width:`${o.offsetWidth}px`}:{}}render(){if(!this.optionsData)return;this._optionsData="string"==typeof this.optionsData?JSON.parse(this.optionsData):this.optionsData,this.unsavedSelectedItems||(this.unsavedSelectedItems=this.safelyCloneArray(this._optionsData));const o=this.open?"expand_less":"expand_more";return i(s,{class:this.inline?"inline":"block"},this.label&&i("div",{class:"label"},this.label),i("div",{tabindex:"0",class:"dropdown-container"},i("div",{class:"dropdown-selector",onClick:this.onDropdownClicked.bind(this)},this.dropdownSelectorContent(),i("div",{class:"dropdown-selector-chevron"},i("tttx-icon",{icon:o,color:"black"}))),this.open&&i("div",{class:"dropdown-body-container"},i("div",{class:"dropdown-body",style:Object.assign({},this.bodyOffset)},this.searchEnabled&&i("div",{class:"searchbox"},i("tttx-standalone-input",{type:"text",label:"",required:!0,showerrorbubble:!1,iconleft:"search",onInput:this.handleSearchInput.bind(this),inline:!0})),i("div",{class:"dropdown-options-list"},this.unsavedSelectedItems.map((o=>this.dropdownOption(o)))),i("div",{class:"footer"},i("tttx-button",{design:"primary",onClick:this.applyChanges.bind(this)},"Apply"),i("tttx-button",{onClick:this.onCancel.bind(this)},"Cancel"))))))}get el(){return e(this)}};r.style='.material-symbols-rounded{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}:host{display:flex;gap:4px}.label{font-size:16px;font-style:normal;font-weight:500;line-height:normal}:host(.inline) .label{padding-top:8px}:host(.block){flex-direction:column}.dropdown-container{display:grid;position:relative;display:flex;flex-direction:column;width:100%}.dropdown-container:focus-visible{outline:none}.dropdown-container:focus .dropdown-selector{border:1px solid #1479c6}.dropdown-selector,.dropdown-body{display:flex;border-radius:4px;background-color:white}.dropdown-selector{grid-row:1;align-items:center;gap:8px;padding:6px 8px 6px 16px;cursor:pointer;border:1px solid #d5d5d5}.dropdown-selector-chevron{margin-left:auto;height:24px}.dropdown-selector-chevron>tttx-icon{cursor:pointer}.dropdown-selector-html-content{display:flex;gap:8px;flex-wrap:wrap}.dropdown-body-container{grid-row:2;position:relative}.dropdown-body{position:absolute;display:flex;position:absolute;flex-direction:column;box-shadow:0px 1px 5px #1111114D;padding-bottom:8px;border:1px solid #d5d5d5;width:100%}.dropdown-options-list{display:flex;flex-direction:column;overflow-y:auto;scrollbar-gutter:stable;max-height:288px}.dropdown-option{padding:6px 8px 6px 16px;cursor:pointer;display:flex;gap:8px}.dropdown-option .checkbox-icon{height:24px}.dropdown-option .plaintext-option{line-height:24px}.dropdown-option:hover{background-color:#1111110d}.dropdown-option:active,.dropdown-option.selected{background-color:#ebfbfc}.placeholder{color:#9e9e9e}.searchbox{padding:8px 16px 8px 16px;height:52px;box-sizing:border-box}.searchbox tttx-standalone-input{margin-top:-4px}.hidden{display:none}.footer{display:flex;gap:8px;flex-direction:row-reverse;padding:8px 16px 0 16px;border-top:1px solid #d5d5d5}';export{r as tttx_multiselect_box}

package/dist/tttx/p-9c3f730f.entry.js

@@ -0,0 +1 @@
+import{r as t,c as i,h as s,H as e}from"./p-3f1b6013.js";const a=class{constructor(s){t(this,s),this.valueChanged=i(this,"valueChanged",7),this.focusChanged=i(this,"focusChanged",7),this.blurChanged=i(this,"blurChanged",7),this.invalidChanged=i(this,"invalidChanged",7),this.label=void 0,this.secondarylabel=void 0,this.showerrormsg=void 0,this.showerrorbubble=!0,this.errormsg=void 0,this.rows=void 0,this.textareaautofocus=void 0,this.inputkeyhint=void 0,this.inputindex=void 0,this.inputtitle=void 0,this.disabled=void 0,this.maxlength=void 0,this.name=void 0,this.placeholder=void 0,this.readonly=void 0,this.required=void 0,this.value=void 0}handleChange(t){const i=t.target;this.value=i.value,this.valueChanged.emit(i.value)}handleFocus(t){this.focusChanged.emit(t.target.value)}handleBlur(t){this.blurChanged.emit(t.target.value)}handleInvalid(t){t.preventDefault(),this.invalidChanged.emit(t.target.value)}render(){const t=[this.showerrormsg?"invalid":"",!this.label&&this.required?"no-label":""].join(" ");return s(e,null,s("label",null,this.label,this.required?"":s("span",{class:"optional"}," (optional)"),s("div",{class:"textarea-container"},s("textarea",{rows:this.rows,class:t,autofocus:this.textareaautofocus,enterkeyhint:this.inputkeyhint,tabindex:this.inputindex,title:this.inputtitle,disabled:this.disabled,maxlength:this.maxlength,name:this.name,placeholder:this.placeholder,readonly:this.readonly,required:this.required,value:this.value,onBlur:this.handleBlur.bind(this),onFocus:this.handleFocus.bind(this),onInput:this.handleChange.bind(this),onInvalid:this.handleInvalid.bind(this)}),this.secondarylabel&&s("span",{class:"secondarylabel"},this.secondarylabel),this.showerrorbubble&&s("span",{class:["errorBubble",this.showerrormsg&&this.errormsg?"visible":""].join(" ")},s("span",{class:"material-symbols-rounded validationicon"},"warning")," ",this.errormsg))))}};a.style='.material-symbols-rounded.sc-tttx-textarea{font-variation-settings:"FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24}.sc-tttx-textarea-h{display:block}.textarea-container.sc-tttx-textarea{position:relative}textarea.sc-tttx-textarea{font-family:"Roboto", serif;box-sizing:border-box;width:100%;padding:9px 16px;font-size:16px;line-height:19px;border:1px solid #d5d5d5;border-radius:4px;margin-top:8px;resize:none}textarea.no-label.sc-tttx-textarea{margin-top:0}textarea.sc-tttx-textarea~.errorBubble.sc-tttx-textarea{font-size:14px;line-height:16px;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}textarea.sc-tttx-textarea~.errorBubble.sc-tttx-textarea:not(.visible){display:none}textarea.sc-tttx-textarea~.errorBubble.sc-tttx-textarea span.sc-tttx-textarea{color:#dc0000;font-size:16px;margin-right:4px}.secondarylabel.sc-tttx-textarea{color:#757575;font-size:14px;line-height:16px;font-weight:normal;display:flex;margin-top:4px}.optional.sc-tttx-textarea{color:#757575;font-weight:normal}';export{a as tttx_textarea}

package/dist/tttx/tttx.esm.js

@@ -1 +1 @@
-import{p as e,b as t}from"./p-3f1b6013.js";export{s as setNonce}from"./p-3f1b6013.js";(()=>{const t=import.meta.url,o={};return""!==t&&(o.resourcesUrl=new URL(".",t).href),e(o)})().then((e=>t([["p-77fed2a6",[[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-f34bface",[[1,"tttx-dialog-box",{data:[1025],size:[1],open:[1028],allowOverflow:[4,"allow-overflow"],elementSize:[32]},[[9,"resize","handleResize"]]]]],["p-887f56cb",[[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-75c31e23",[[1,"tttx-tree-view",{data:[1040],treeData:[32]}]]],["p-c714f7c0",[[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"]]]]],["p-129df5a2",[[1,"tttx-list",{data:[1025],name:[1],_data:[32]}]]],["p-5290db99",[[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"]]]]],["p-67c342d7",[[2,"tttx-tabs",{tabsName:[1,"tabs-name"],navigation:[4],wide:[4],tabs:[1],_tabs:[32]},[[0,"keydown","handleKeyDown"]]]]],["p-b30a1025",[[1,"tttx-form",{formschema:[1025],data:[1032],submit:[64]}]]],["p-d1ff1456",[[1,"tttx-keyvalue-block",{keyvalues:[1],horizontal:[4],spacedout:[4],_elements:[32]}]]],["p-e55a967b",[[1,"tttx-loading-spinner",{loadingMessage:[1028,"loading-message"],size:[1025]}]]],["p-50cdce65",[[1,"tttx-qrcode",{link:[1025],size:[1026]}]]],["p-25acdd4c",[[1,"tttx-tag",{text:[1],color:[1]}]]],["p-c0c022cd",[[1,"tttx-toolbar",{border:[4],viewSize:[32]},[[9,"resize","handleResize"]]]]],["p-e89b053f",[[1,"tttx-icon",{icon:[1],color:[1]}]]],["p-09b92178",[[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-4ade2866",[[1,"tttx-button",{notext:[4],icon:[1],iconposition:[1],iconcolor:[1025],design:[1]}]]]],e)));
+import{p as e,b as t}from"./p-3f1b6013.js";export{s as setNonce}from"./p-3f1b6013.js";(()=>{const t=import.meta.url,o={};return""!==t&&(o.resourcesUrl=new URL(".",t).href),e(o)})().then((e=>t([["p-5f1f699d",[[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-f34bface",[[1,"tttx-dialog-box",{data:[1025],size:[1],open:[1028],allowOverflow:[4,"allow-overflow"],elementSize:[32]},[[9,"resize","handleResize"]]]]],["p-887f56cb",[[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-75c31e23",[[1,"tttx-tree-view",{data:[1040],treeData:[32]}]]],["p-c714f7c0",[[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"]]]]],["p-129df5a2",[[1,"tttx-list",{data:[1025],name:[1],_data:[32]}]]],["p-5290db99",[[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"]]]]],["p-67c342d7",[[2,"tttx-tabs",{tabsName:[1,"tabs-name"],navigation:[4],wide:[4],tabs:[1],_tabs:[32]},[[0,"keydown","handleKeyDown"]]]]],["p-b30a1025",[[1,"tttx-form",{formschema:[1025],data:[1032],submit:[64]}]]],["p-d1ff1456",[[1,"tttx-keyvalue-block",{keyvalues:[1],horizontal:[4],spacedout:[4],_elements:[32]}]]],["p-e55a967b",[[1,"tttx-loading-spinner",{loadingMessage:[1028,"loading-message"],size:[1025]}]]],["p-50cdce65",[[1,"tttx-qrcode",{link:[1025],size:[1026]}]]],["p-25acdd4c",[[1,"tttx-tag",{text:[1],color:[1]}]]],["p-9c3f730f",[[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-c0c022cd",[[1,"tttx-toolbar",{border:[4],viewSize:[32]},[[9,"resize","handleResize"]]]]],["p-e89b053f",[[1,"tttx-icon",{icon:[1],color:[1]}]]],["p-09b92178",[[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-4ade2866",[[1,"tttx-button",{notext:[4],icon:[1],iconposition:[1],iconcolor:[1025],design:[1]}]]]],e)));

package/dist/types/components/molecules/tttx-multiselect-box/tttx-multiselect-box.d.ts

@@ -31,6 +31,7 @@ export declare class TttxMultiselectBox {
   applyChanges(): void;
   onItemSelected(option: SelectItem): void;
   dropdownSelectorContent(): any;
+  optionFoundInSearchTerm(option: any): boolean;
   dropdownOption(option: SelectItem): any;
   handleSearchInput(event: InputEvent): void;
   calculateDropdownMenuOffset(): void;

package/dist/types/components/molecules/tttx-textarea/tttx-textarea.d.ts

@@ -0,0 +1,42 @@
+import { EventEmitter } from '../../../stencil-public-runtime';
+export declare class TttxTextarea {
+  label: string;
+  /**
+   * Footnote under the input field
+   */
+  secondarylabel: string;
+  showerrormsg: boolean;
+  showerrorbubble: boolean;
+  errormsg: string;
+  rows: number;
+  textareaautofocus: boolean;
+  /**
+   * Defines what action to present for the enter key on virtual keyboards
+   */
+  inputkeyhint: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
+  /**
+   * tabindex - Allows the HTML elements to be focusable
+   * @example <caption>In HTML (like `index.html`)</caption>
+   * <tttx-textarea input-index="1" />
+   * @example <caption>In TSX files</caption>
+   * <tttx-textarea inputindex={1} />
+   */
+  inputindex: string | number;
+  inputtitle: string;
+  disabled: boolean;
+  maxlength: string | number;
+  name: string;
+  placeholder: string;
+  readonly: string | boolean;
+  required: boolean;
+  value: string | number;
+  valueChanged: EventEmitter<string>;
+  handleChange(event: Event | InputEvent): void;
+  focusChanged: EventEmitter<string>;
+  handleFocus(event: Event | InputEvent): void;
+  blurChanged: EventEmitter<string>;
+  handleBlur(event: Event | InputEvent): void;
+  invalidChanged: EventEmitter<string>;
+  handleInvalid(event: Event | InputEvent): void;
+  render(): any;
+}

package/dist/types/components/molecules/tttx-textarea/tttx-textarea.stories.d.ts

@@ -0,0 +1,89 @@
+declare const _default: {
+  title: string;
+  component: string;
+  argTypes: {
+    label: {
+      control: {
+        type: string;
+      };
+    };
+    secondarylabel: {
+      control: {
+        type: string;
+      };
+    };
+    errormsg: {
+      control: {
+        type: string;
+      };
+    };
+    showerrorbubble: {
+      control: {
+        type: string;
+      };
+    };
+    showerrormsg: {
+      control: {
+        type: string;
+      };
+    };
+    disabled: {
+      control: {
+        type: string;
+      };
+    };
+    maxlength: {
+      control: {
+        type: string;
+      };
+    };
+    minlength: {
+      control: {
+        type: string;
+      };
+    };
+    name: {
+      control: {
+        type: string;
+      };
+    };
+    pattern: {
+      control: {
+        type: string;
+      };
+    };
+    placeholder: {
+      control: {
+        type: string;
+      };
+    };
+    readonly: {
+      control: {
+        type: string;
+      };
+    };
+    required: {
+      control: {
+        type: string;
+      };
+    };
+    resize: {
+      control: {
+        type: string;
+      };
+    };
+    rows: {
+      control: {
+        type: string;
+      };
+    };
+    value: {
+      control: {
+        type: string;
+      };
+    };
+  };
+};
+export default _default;
+export declare const Textarea: any;
+export declare const ResizableTextarea: any;