@3t-transform/threeteeui 0.0.21 → 0.0.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -14,7 +14,7 @@ const patchEsm = () => {
14
14
  const defineCustomElements = (win, options) => {
15
15
  if (typeof window === 'undefined') return Promise.resolve();
16
16
  return patchEsm().then(() => {
17
- return index.bootstrapLazy([["tttx-input-calendar.cjs",[[1,"tttx-input-calendar",{"months":[4],"years":[4],"showCalendar":[32],"selectedYear":[32],"selectedMonth":[32]}]]],["tttx-table.cjs",[[1,"tttx-table",{"headers":[16],"data":[16],"loading":[4],"selected":[2]},[[4,"keydown","handleKeyDown"]]]]],["tttx-list.cjs",[[1,"tttx-list",{"name":[1],"selectable":[4],"items":[32],"selectedIds":[32],"loading":[32],"lastPage":[32]},[[4,"listPageLoad","listLoadHandler"],[4,"listClearDataCache","listClearDataCacheHandler"],[4,"listActionSelectedEvent","listActionSelectedEventHandler"]]]]],["tttx-standalone-input.cjs",[[2,"tttx-standalone-input",{"label":[1],"showerrormsg":[4],"errormsg":[1],"iconleft":[1],"iconright":[1],"autocapitalize":[1],"autofocus":[4],"inputKeyhint":[1,"input-keyhint"],"inputIndex":[8,"input-index"],"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-checkbox.cjs",[[1,"tttx-checkbox",{"value":[4],"label":[1],"required":[4]}]]],["tttx-form.cjs",[[1,"tttx-form",{"formschema":[8],"submitValue":[8,"submit-value"]}]]],["tttx-keyvalue-block.cjs",[[1,"tttx-keyvalue-block",{"keyvalues":[8],"horizontal":[4]}]]],["tttx-button.cjs",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"design":[1]}]]],["tttx-loading-spinner.cjs",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-popover-content.cjs",[[1,"tttx-popover-content",{"header":[1],"body":[1],"linkcontext":[1],"linktext":[1]}]]],["tttx-icon.cjs",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]]], options);
17
+ return index.bootstrapLazy([["tttx-input-calendar.cjs",[[1,"tttx-input-calendar",{"months":[4],"years":[4],"showCalendar":[32],"selectedYear":[32],"selectedMonth":[32]}]]],["tttx-table.cjs",[[1,"tttx-table",{"headers":[16],"data":[16],"loading":[4],"selected":[2]},[[4,"keydown","handleKeyDown"]]]]],["tttx-list.cjs",[[1,"tttx-list",{"name":[1],"selectable":[4],"items":[32],"selectedIds":[32],"loading":[32],"lastPage":[32]},[[4,"listPageLoad","listLoadHandler"],[4,"listClearDataCache","listClearDataCacheHandler"],[4,"listActionSelectedEvent","listActionSelectedEventHandler"]]]]],["tttx-standalone-input.cjs",[[2,"tttx-standalone-input",{"label":[1],"showerrormsg":[4],"errormsg":[1],"iconleft":[1],"iconright":[1],"inputAutocapitalize":[1,"input-autocapitalize"],"inputAutofocus":[4,"input-autofocus"],"inputKeyhint":[1,"input-keyhint"],"inputIndex":[8,"input-index"],"inputTitle":[1,"input-title"],"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-checkbox.cjs",[[1,"tttx-checkbox",{"value":[4],"label":[1],"required":[4]}]]],["tttx-form.cjs",[[1,"tttx-form",{"formschema":[8],"submitValue":[8,"submit-value"]}]]],["tttx-keyvalue-block.cjs",[[1,"tttx-keyvalue-block",{"keyvalues":[8],"horizontal":[4]}]]],["tttx-button.cjs",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"design":[1]}]]],["tttx-loading-spinner.cjs",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-popover-content.cjs",[[1,"tttx-popover-content",{"header":[1],"body":[1],"linkcontext":[1],"linktext":[1]}]]],["tttx-icon.cjs",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]]], options);
18
18
  });
19
19
  };
20
20
 
@@ -18,10 +18,11 @@ const TttxInput = class {
18
18
  this.errormsg = undefined;
19
19
  this.iconleft = undefined;
20
20
  this.iconright = undefined;
21
- this.autocapitalize = undefined;
22
- this.autofocus = undefined;
21
+ this.inputAutocapitalize = undefined;
22
+ this.inputAutofocus = undefined;
23
23
  this.inputKeyhint = undefined;
24
24
  this.inputIndex = undefined;
25
+ this.inputTitle = undefined;
25
26
  this.autocomplete = undefined;
26
27
  this.checked = undefined;
27
28
  this.disabled = undefined;
@@ -57,7 +58,7 @@ const TttxInput = class {
57
58
  }
58
59
  render() {
59
60
  const classNames = ['standalone', this.showerrormsg ? 'invalid' : ''].join(' ');
60
- return (index.h(index.Host, null, index.h("label", { class: 'inputBlock' }, this.label, !this.required ? index.h("span", { class: "optional" }, "\u00A0(optional)") : '', this.iconleft && (index.h("div", { class: "icon-left" }, index.h("tttx-icon", { icon: this.iconleft, color: "grey" }))), index.h("input", { class: classNames, autocapitalize: this.autocapitalize, autofocus: this.autofocus, enterkeyhint: this.inputKeyhint, tabindex: this.inputIndex, autocomplete: this.autocomplete, checked: this.checked, disabled: this.disabled, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readonly: this.readonly, required: this.required, step: this.step, type: this.type, value: this.value, onBlur: this.handleBlur.bind(this), onFocus: this.handleFocus.bind(this), onInput: this.handleChange.bind(this), onInvalid: this.handleInvalid.bind(this) }), this.iconright && (index.h("div", { class: "icon-right" }, index.h("tttx-icon", { icon: this.iconright, color: "grey" }))), index.h("span", { class: ['errorBubble', this.showerrormsg && this.errormsg ? 'visible' : ''].join(' ') }, index.h("span", { class: "material-symbols-rounded validationicon" }, "warning"), " ", this.errormsg))));
61
+ return (index.h(index.Host, null, index.h("label", { class: 'inputBlock' }, this.label, !this.required ? index.h("span", { class: "optional" }, "\u00A0(optional)") : '', this.iconleft && (index.h("div", { class: "icon-left" }, index.h("tttx-icon", { icon: this.iconleft, color: "grey" }))), index.h("input", { class: classNames, autocapitalize: this.inputAutocapitalize, autofocus: this.inputAutofocus, enterkeyhint: this.inputKeyhint, tabindex: this.inputIndex, title: this.inputTitle, autocomplete: this.autocomplete, checked: this.checked, disabled: this.disabled, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readonly: this.readonly, required: this.required, step: this.step, type: this.type, value: this.value, onBlur: this.handleBlur.bind(this), onFocus: this.handleFocus.bind(this), onInput: this.handleChange.bind(this), onInvalid: this.handleInvalid.bind(this) }), this.iconright && (index.h("div", { class: "icon-right" }, index.h("tttx-icon", { icon: this.iconright, color: "grey" }))), index.h("span", { class: ['errorBubble', this.showerrormsg && this.errormsg ? 'visible' : ''].join(' ') }, index.h("span", { class: "material-symbols-rounded validationicon" }, "warning"), " ", this.errormsg))));
61
62
  }
62
63
  };
63
64
  TttxInput.style = tttxStandaloneInputCss;
@@ -17,7 +17,7 @@ const patchBrowser = () => {
17
17
  };
18
18
 
19
19
  patchBrowser().then(options => {
20
- return index.bootstrapLazy([["tttx-input-calendar.cjs",[[1,"tttx-input-calendar",{"months":[4],"years":[4],"showCalendar":[32],"selectedYear":[32],"selectedMonth":[32]}]]],["tttx-table.cjs",[[1,"tttx-table",{"headers":[16],"data":[16],"loading":[4],"selected":[2]},[[4,"keydown","handleKeyDown"]]]]],["tttx-list.cjs",[[1,"tttx-list",{"name":[1],"selectable":[4],"items":[32],"selectedIds":[32],"loading":[32],"lastPage":[32]},[[4,"listPageLoad","listLoadHandler"],[4,"listClearDataCache","listClearDataCacheHandler"],[4,"listActionSelectedEvent","listActionSelectedEventHandler"]]]]],["tttx-standalone-input.cjs",[[2,"tttx-standalone-input",{"label":[1],"showerrormsg":[4],"errormsg":[1],"iconleft":[1],"iconright":[1],"autocapitalize":[1],"autofocus":[4],"inputKeyhint":[1,"input-keyhint"],"inputIndex":[8,"input-index"],"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-checkbox.cjs",[[1,"tttx-checkbox",{"value":[4],"label":[1],"required":[4]}]]],["tttx-form.cjs",[[1,"tttx-form",{"formschema":[8],"submitValue":[8,"submit-value"]}]]],["tttx-keyvalue-block.cjs",[[1,"tttx-keyvalue-block",{"keyvalues":[8],"horizontal":[4]}]]],["tttx-button.cjs",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"design":[1]}]]],["tttx-loading-spinner.cjs",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-popover-content.cjs",[[1,"tttx-popover-content",{"header":[1],"body":[1],"linkcontext":[1],"linktext":[1]}]]],["tttx-icon.cjs",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]]], options);
20
+ return index.bootstrapLazy([["tttx-input-calendar.cjs",[[1,"tttx-input-calendar",{"months":[4],"years":[4],"showCalendar":[32],"selectedYear":[32],"selectedMonth":[32]}]]],["tttx-table.cjs",[[1,"tttx-table",{"headers":[16],"data":[16],"loading":[4],"selected":[2]},[[4,"keydown","handleKeyDown"]]]]],["tttx-list.cjs",[[1,"tttx-list",{"name":[1],"selectable":[4],"items":[32],"selectedIds":[32],"loading":[32],"lastPage":[32]},[[4,"listPageLoad","listLoadHandler"],[4,"listClearDataCache","listClearDataCacheHandler"],[4,"listActionSelectedEvent","listActionSelectedEventHandler"]]]]],["tttx-standalone-input.cjs",[[2,"tttx-standalone-input",{"label":[1],"showerrormsg":[4],"errormsg":[1],"iconleft":[1],"iconright":[1],"inputAutocapitalize":[1,"input-autocapitalize"],"inputAutofocus":[4,"input-autofocus"],"inputKeyhint":[1,"input-keyhint"],"inputIndex":[8,"input-index"],"inputTitle":[1,"input-title"],"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-checkbox.cjs",[[1,"tttx-checkbox",{"value":[4],"label":[1],"required":[4]}]]],["tttx-form.cjs",[[1,"tttx-form",{"formschema":[8],"submitValue":[8,"submit-value"]}]]],["tttx-keyvalue-block.cjs",[[1,"tttx-keyvalue-block",{"keyvalues":[8],"horizontal":[4]}]]],["tttx-button.cjs",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"design":[1]}]]],["tttx-loading-spinner.cjs",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-popover-content.cjs",[[1,"tttx-popover-content",{"header":[1],"body":[1],"linkcontext":[1],"linktext":[1]}]]],["tttx-icon.cjs",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]]], options);
21
21
  });
22
22
 
23
23
  exports.setNonce = index.setNonce;
@@ -7,10 +7,11 @@ export class TttxInput {
7
7
  this.errormsg = undefined;
8
8
  this.iconleft = undefined;
9
9
  this.iconright = undefined;
10
- this.autocapitalize = undefined;
11
- this.autofocus = undefined;
10
+ this.inputAutocapitalize = undefined;
11
+ this.inputAutofocus = undefined;
12
12
  this.inputKeyhint = undefined;
13
13
  this.inputIndex = undefined;
14
+ this.inputTitle = undefined;
14
15
  this.autocomplete = undefined;
15
16
  this.checked = undefined;
16
17
  this.disabled = undefined;
@@ -46,7 +47,7 @@ export class TttxInput {
46
47
  }
47
48
  render() {
48
49
  const classNames = ['standalone', this.showerrormsg ? 'invalid' : ''].join(' ');
49
- return (h(Host, null, h("label", { class: 'inputBlock' }, this.label, !this.required ? h("span", { class: "optional" }, "\u00A0(optional)") : '', this.iconleft && (h("div", { class: "icon-left" }, h("tttx-icon", { icon: this.iconleft, color: "grey" }))), h("input", { class: classNames, autocapitalize: this.autocapitalize, autofocus: this.autofocus, enterkeyhint: this.inputKeyhint, tabindex: this.inputIndex, autocomplete: this.autocomplete, checked: this.checked, disabled: this.disabled, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readonly: this.readonly, required: this.required, step: this.step, type: this.type, value: this.value, onBlur: this.handleBlur.bind(this), onFocus: this.handleFocus.bind(this), onInput: this.handleChange.bind(this), onInvalid: this.handleInvalid.bind(this) }), this.iconright && (h("div", { class: "icon-right" }, h("tttx-icon", { icon: this.iconright, color: "grey" }))), h("span", { class: ['errorBubble', this.showerrormsg && this.errormsg ? 'visible' : ''].join(' ') }, h("span", { class: "material-symbols-rounded validationicon" }, "warning"), " ", this.errormsg))));
50
+ return (h(Host, null, h("label", { class: 'inputBlock' }, this.label, !this.required ? h("span", { class: "optional" }, "\u00A0(optional)") : '', this.iconleft && (h("div", { class: "icon-left" }, h("tttx-icon", { icon: this.iconleft, color: "grey" }))), h("input", { class: classNames, autocapitalize: this.inputAutocapitalize, autofocus: this.inputAutofocus, enterkeyhint: this.inputKeyhint, tabindex: this.inputIndex, title: this.inputTitle, autocomplete: this.autocomplete, checked: this.checked, disabled: this.disabled, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readonly: this.readonly, required: this.required, step: this.step, type: this.type, value: this.value, onBlur: this.handleBlur.bind(this), onFocus: this.handleFocus.bind(this), onInput: this.handleChange.bind(this), onInvalid: this.handleInvalid.bind(this) }), this.iconright && (h("div", { class: "icon-right" }, h("tttx-icon", { icon: this.iconright, color: "grey" }))), h("span", { class: ['errorBubble', this.showerrormsg && this.errormsg ? 'visible' : ''].join(' ') }, h("span", { class: "material-symbols-rounded validationicon" }, "warning"), " ", this.errormsg))));
50
51
  }
51
52
  static get is() { return "tttx-standalone-input"; }
52
53
  static get encapsulation() { return "scoped"; }
@@ -147,12 +148,12 @@ export class TttxInput {
147
148
  "attribute": "iconright",
148
149
  "reflect": false
149
150
  },
150
- "autocapitalize": {
151
+ "inputAutocapitalize": {
151
152
  "type": "string",
152
153
  "mutable": false,
153
154
  "complexType": {
154
- "original": "string",
155
- "resolved": "string",
155
+ "original": "'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters'",
156
+ "resolved": "\"characters\" | \"none\" | \"off\" | \"on\" | \"sentences\" | \"words\"",
156
157
  "references": {}
157
158
  },
158
159
  "required": false,
@@ -161,10 +162,10 @@ export class TttxInput {
161
162
  "tags": [],
162
163
  "text": ""
163
164
  },
164
- "attribute": "autocapitalize",
165
+ "attribute": "input-autocapitalize",
165
166
  "reflect": false
166
167
  },
167
- "autofocus": {
168
+ "inputAutofocus": {
168
169
  "type": "boolean",
169
170
  "mutable": false,
170
171
  "complexType": {
@@ -178,7 +179,7 @@ export class TttxInput {
178
179
  "tags": [],
179
180
  "text": ""
180
181
  },
181
- "attribute": "autofocus",
182
+ "attribute": "input-autofocus",
182
183
  "reflect": false
183
184
  },
184
185
  "inputKeyhint": {
@@ -221,6 +222,23 @@ export class TttxInput {
221
222
  "attribute": "input-index",
222
223
  "reflect": false
223
224
  },
225
+ "inputTitle": {
226
+ "type": "string",
227
+ "mutable": false,
228
+ "complexType": {
229
+ "original": "string",
230
+ "resolved": "string",
231
+ "references": {}
232
+ },
233
+ "required": false,
234
+ "optional": false,
235
+ "docs": {
236
+ "tags": [],
237
+ "text": ""
238
+ },
239
+ "attribute": "input-title",
240
+ "reflect": false
241
+ },
224
242
  "autocomplete": {
225
243
  "type": "string",
226
244
  "mutable": false,
@@ -16,10 +16,11 @@ const TttxInput = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
16
16
  this.errormsg = undefined;
17
17
  this.iconleft = undefined;
18
18
  this.iconright = undefined;
19
- this.autocapitalize = undefined;
20
- this.autofocus = undefined;
19
+ this.inputAutocapitalize = undefined;
20
+ this.inputAutofocus = undefined;
21
21
  this.inputKeyhint = undefined;
22
22
  this.inputIndex = undefined;
23
+ this.inputTitle = undefined;
23
24
  this.autocomplete = undefined;
24
25
  this.checked = undefined;
25
26
  this.disabled = undefined;
@@ -55,7 +56,7 @@ const TttxInput = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
55
56
  }
56
57
  render() {
57
58
  const classNames = ['standalone', this.showerrormsg ? 'invalid' : ''].join(' ');
58
- return (h(Host, null, h("label", { class: 'inputBlock' }, this.label, !this.required ? h("span", { class: "optional" }, "\u00A0(optional)") : '', this.iconleft && (h("div", { class: "icon-left" }, h("tttx-icon", { icon: this.iconleft, color: "grey" }))), h("input", { class: classNames, autocapitalize: this.autocapitalize, autofocus: this.autofocus, enterkeyhint: this.inputKeyhint, tabindex: this.inputIndex, autocomplete: this.autocomplete, checked: this.checked, disabled: this.disabled, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readonly: this.readonly, required: this.required, step: this.step, type: this.type, value: this.value, onBlur: this.handleBlur.bind(this), onFocus: this.handleFocus.bind(this), onInput: this.handleChange.bind(this), onInvalid: this.handleInvalid.bind(this) }), this.iconright && (h("div", { class: "icon-right" }, h("tttx-icon", { icon: this.iconright, color: "grey" }))), h("span", { class: ['errorBubble', this.showerrormsg && this.errormsg ? 'visible' : ''].join(' ') }, h("span", { class: "material-symbols-rounded validationicon" }, "warning"), " ", this.errormsg))));
59
+ return (h(Host, null, h("label", { class: 'inputBlock' }, this.label, !this.required ? h("span", { class: "optional" }, "\u00A0(optional)") : '', this.iconleft && (h("div", { class: "icon-left" }, h("tttx-icon", { icon: this.iconleft, color: "grey" }))), h("input", { class: classNames, autocapitalize: this.inputAutocapitalize, autofocus: this.inputAutofocus, enterkeyhint: this.inputKeyhint, tabindex: this.inputIndex, title: this.inputTitle, autocomplete: this.autocomplete, checked: this.checked, disabled: this.disabled, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readonly: this.readonly, required: this.required, step: this.step, type: this.type, value: this.value, onBlur: this.handleBlur.bind(this), onFocus: this.handleFocus.bind(this), onInput: this.handleChange.bind(this), onInvalid: this.handleInvalid.bind(this) }), this.iconright && (h("div", { class: "icon-right" }, h("tttx-icon", { icon: this.iconright, color: "grey" }))), h("span", { class: ['errorBubble', this.showerrormsg && this.errormsg ? 'visible' : ''].join(' ') }, h("span", { class: "material-symbols-rounded validationicon" }, "warning"), " ", this.errormsg))));
59
60
  }
60
61
  static get style() { return tttxStandaloneInputCss; }
61
62
  }, [2, "tttx-standalone-input", {
@@ -64,10 +65,11 @@ const TttxInput = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
64
65
  "errormsg": [1],
65
66
  "iconleft": [1],
66
67
  "iconright": [1],
67
- "autocapitalize": [1],
68
- "autofocus": [4],
68
+ "inputAutocapitalize": [1, "input-autocapitalize"],
69
+ "inputAutofocus": [4, "input-autofocus"],
69
70
  "inputKeyhint": [1, "input-keyhint"],
70
71
  "inputIndex": [8, "input-index"],
72
+ "inputTitle": [1, "input-title"],
71
73
  "autocomplete": [1],
72
74
  "checked": [4],
73
75
  "disabled": [4],
@@ -11,7 +11,7 @@ const patchEsm = () => {
11
11
  const defineCustomElements = (win, options) => {
12
12
  if (typeof window === 'undefined') return Promise.resolve();
13
13
  return patchEsm().then(() => {
14
- return bootstrapLazy([["tttx-input-calendar",[[1,"tttx-input-calendar",{"months":[4],"years":[4],"showCalendar":[32],"selectedYear":[32],"selectedMonth":[32]}]]],["tttx-table",[[1,"tttx-table",{"headers":[16],"data":[16],"loading":[4],"selected":[2]},[[4,"keydown","handleKeyDown"]]]]],["tttx-list",[[1,"tttx-list",{"name":[1],"selectable":[4],"items":[32],"selectedIds":[32],"loading":[32],"lastPage":[32]},[[4,"listPageLoad","listLoadHandler"],[4,"listClearDataCache","listClearDataCacheHandler"],[4,"listActionSelectedEvent","listActionSelectedEventHandler"]]]]],["tttx-standalone-input",[[2,"tttx-standalone-input",{"label":[1],"showerrormsg":[4],"errormsg":[1],"iconleft":[1],"iconright":[1],"autocapitalize":[1],"autofocus":[4],"inputKeyhint":[1,"input-keyhint"],"inputIndex":[8,"input-index"],"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-checkbox",[[1,"tttx-checkbox",{"value":[4],"label":[1],"required":[4]}]]],["tttx-form",[[1,"tttx-form",{"formschema":[8],"submitValue":[8,"submit-value"]}]]],["tttx-keyvalue-block",[[1,"tttx-keyvalue-block",{"keyvalues":[8],"horizontal":[4]}]]],["tttx-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"design":[1]}]]],["tttx-loading-spinner",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-popover-content",[[1,"tttx-popover-content",{"header":[1],"body":[1],"linkcontext":[1],"linktext":[1]}]]],["tttx-icon",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]]], options);
14
+ return bootstrapLazy([["tttx-input-calendar",[[1,"tttx-input-calendar",{"months":[4],"years":[4],"showCalendar":[32],"selectedYear":[32],"selectedMonth":[32]}]]],["tttx-table",[[1,"tttx-table",{"headers":[16],"data":[16],"loading":[4],"selected":[2]},[[4,"keydown","handleKeyDown"]]]]],["tttx-list",[[1,"tttx-list",{"name":[1],"selectable":[4],"items":[32],"selectedIds":[32],"loading":[32],"lastPage":[32]},[[4,"listPageLoad","listLoadHandler"],[4,"listClearDataCache","listClearDataCacheHandler"],[4,"listActionSelectedEvent","listActionSelectedEventHandler"]]]]],["tttx-standalone-input",[[2,"tttx-standalone-input",{"label":[1],"showerrormsg":[4],"errormsg":[1],"iconleft":[1],"iconright":[1],"inputAutocapitalize":[1,"input-autocapitalize"],"inputAutofocus":[4,"input-autofocus"],"inputKeyhint":[1,"input-keyhint"],"inputIndex":[8,"input-index"],"inputTitle":[1,"input-title"],"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-checkbox",[[1,"tttx-checkbox",{"value":[4],"label":[1],"required":[4]}]]],["tttx-form",[[1,"tttx-form",{"formschema":[8],"submitValue":[8,"submit-value"]}]]],["tttx-keyvalue-block",[[1,"tttx-keyvalue-block",{"keyvalues":[8],"horizontal":[4]}]]],["tttx-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"design":[1]}]]],["tttx-loading-spinner",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-popover-content",[[1,"tttx-popover-content",{"header":[1],"body":[1],"linkcontext":[1],"linktext":[1]}]]],["tttx-icon",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]]], options);
15
15
  });
16
16
  };
17
17
 
@@ -14,10 +14,11 @@ const TttxInput = class {
14
14
  this.errormsg = undefined;
15
15
  this.iconleft = undefined;
16
16
  this.iconright = undefined;
17
- this.autocapitalize = undefined;
18
- this.autofocus = undefined;
17
+ this.inputAutocapitalize = undefined;
18
+ this.inputAutofocus = undefined;
19
19
  this.inputKeyhint = undefined;
20
20
  this.inputIndex = undefined;
21
+ this.inputTitle = undefined;
21
22
  this.autocomplete = undefined;
22
23
  this.checked = undefined;
23
24
  this.disabled = undefined;
@@ -53,7 +54,7 @@ const TttxInput = class {
53
54
  }
54
55
  render() {
55
56
  const classNames = ['standalone', this.showerrormsg ? 'invalid' : ''].join(' ');
56
- return (h(Host, null, h("label", { class: 'inputBlock' }, this.label, !this.required ? h("span", { class: "optional" }, "\u00A0(optional)") : '', this.iconleft && (h("div", { class: "icon-left" }, h("tttx-icon", { icon: this.iconleft, color: "grey" }))), h("input", { class: classNames, autocapitalize: this.autocapitalize, autofocus: this.autofocus, enterkeyhint: this.inputKeyhint, tabindex: this.inputIndex, autocomplete: this.autocomplete, checked: this.checked, disabled: this.disabled, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readonly: this.readonly, required: this.required, step: this.step, type: this.type, value: this.value, onBlur: this.handleBlur.bind(this), onFocus: this.handleFocus.bind(this), onInput: this.handleChange.bind(this), onInvalid: this.handleInvalid.bind(this) }), this.iconright && (h("div", { class: "icon-right" }, h("tttx-icon", { icon: this.iconright, color: "grey" }))), h("span", { class: ['errorBubble', this.showerrormsg && this.errormsg ? 'visible' : ''].join(' ') }, h("span", { class: "material-symbols-rounded validationicon" }, "warning"), " ", this.errormsg))));
57
+ return (h(Host, null, h("label", { class: 'inputBlock' }, this.label, !this.required ? h("span", { class: "optional" }, "\u00A0(optional)") : '', this.iconleft && (h("div", { class: "icon-left" }, h("tttx-icon", { icon: this.iconleft, color: "grey" }))), h("input", { class: classNames, autocapitalize: this.inputAutocapitalize, autofocus: this.inputAutofocus, enterkeyhint: this.inputKeyhint, tabindex: this.inputIndex, title: this.inputTitle, autocomplete: this.autocomplete, checked: this.checked, disabled: this.disabled, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readonly: this.readonly, required: this.required, step: this.step, type: this.type, value: this.value, onBlur: this.handleBlur.bind(this), onFocus: this.handleFocus.bind(this), onInput: this.handleChange.bind(this), onInvalid: this.handleInvalid.bind(this) }), this.iconright && (h("div", { class: "icon-right" }, h("tttx-icon", { icon: this.iconright, color: "grey" }))), h("span", { class: ['errorBubble', this.showerrormsg && this.errormsg ? 'visible' : ''].join(' ') }, h("span", { class: "material-symbols-rounded validationicon" }, "warning"), " ", this.errormsg))));
57
58
  }
58
59
  };
59
60
  TttxInput.style = tttxStandaloneInputCss;
package/dist/esm/tttx.js CHANGED
@@ -14,5 +14,5 @@ const patchBrowser = () => {
14
14
  };
15
15
 
16
16
  patchBrowser().then(options => {
17
- return bootstrapLazy([["tttx-input-calendar",[[1,"tttx-input-calendar",{"months":[4],"years":[4],"showCalendar":[32],"selectedYear":[32],"selectedMonth":[32]}]]],["tttx-table",[[1,"tttx-table",{"headers":[16],"data":[16],"loading":[4],"selected":[2]},[[4,"keydown","handleKeyDown"]]]]],["tttx-list",[[1,"tttx-list",{"name":[1],"selectable":[4],"items":[32],"selectedIds":[32],"loading":[32],"lastPage":[32]},[[4,"listPageLoad","listLoadHandler"],[4,"listClearDataCache","listClearDataCacheHandler"],[4,"listActionSelectedEvent","listActionSelectedEventHandler"]]]]],["tttx-standalone-input",[[2,"tttx-standalone-input",{"label":[1],"showerrormsg":[4],"errormsg":[1],"iconleft":[1],"iconright":[1],"autocapitalize":[1],"autofocus":[4],"inputKeyhint":[1,"input-keyhint"],"inputIndex":[8,"input-index"],"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-checkbox",[[1,"tttx-checkbox",{"value":[4],"label":[1],"required":[4]}]]],["tttx-form",[[1,"tttx-form",{"formschema":[8],"submitValue":[8,"submit-value"]}]]],["tttx-keyvalue-block",[[1,"tttx-keyvalue-block",{"keyvalues":[8],"horizontal":[4]}]]],["tttx-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"design":[1]}]]],["tttx-loading-spinner",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-popover-content",[[1,"tttx-popover-content",{"header":[1],"body":[1],"linkcontext":[1],"linktext":[1]}]]],["tttx-icon",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]]], options);
17
+ return bootstrapLazy([["tttx-input-calendar",[[1,"tttx-input-calendar",{"months":[4],"years":[4],"showCalendar":[32],"selectedYear":[32],"selectedMonth":[32]}]]],["tttx-table",[[1,"tttx-table",{"headers":[16],"data":[16],"loading":[4],"selected":[2]},[[4,"keydown","handleKeyDown"]]]]],["tttx-list",[[1,"tttx-list",{"name":[1],"selectable":[4],"items":[32],"selectedIds":[32],"loading":[32],"lastPage":[32]},[[4,"listPageLoad","listLoadHandler"],[4,"listClearDataCache","listClearDataCacheHandler"],[4,"listActionSelectedEvent","listActionSelectedEventHandler"]]]]],["tttx-standalone-input",[[2,"tttx-standalone-input",{"label":[1],"showerrormsg":[4],"errormsg":[1],"iconleft":[1],"iconright":[1],"inputAutocapitalize":[1,"input-autocapitalize"],"inputAutofocus":[4,"input-autofocus"],"inputKeyhint":[1,"input-keyhint"],"inputIndex":[8,"input-index"],"inputTitle":[1,"input-title"],"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-checkbox",[[1,"tttx-checkbox",{"value":[4],"label":[1],"required":[4]}]]],["tttx-form",[[1,"tttx-form",{"formschema":[8],"submitValue":[8,"submit-value"]}]]],["tttx-keyvalue-block",[[1,"tttx-keyvalue-block",{"keyvalues":[8],"horizontal":[4]}]]],["tttx-button",[[1,"tttx-button",{"notext":[4],"icon":[1],"iconposition":[1],"design":[1]}]]],["tttx-loading-spinner",[[1,"tttx-loading-spinner",{"loadingMessage":[1028,"loading-message"],"size":[1025]}]]],["tttx-popover-content",[[1,"tttx-popover-content",{"header":[1],"body":[1],"linkcontext":[1],"linktext":[1]}]]],["tttx-icon",[[1,"tttx-icon",{"icon":[1],"color":[1]}]]]], options);
18
18
  });
@@ -0,0 +1 @@
1
+ import{r as t,c as i,h as n,H as s}from"./p-07b134af.js";const o=class{constructor(n){t(this,n),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.showerrormsg=void 0,this.errormsg=void 0,this.iconleft=void 0,this.iconright=void 0,this.inputAutocapitalize=void 0,this.inputAutofocus=void 0,this.inputKeyhint=void 0,this.inputIndex=void 0,this.inputTitle=void 0,this.autocomplete=void 0,this.checked=void 0,this.disabled=void 0,this.max=void 0,this.maxlength=void 0,this.min=void 0,this.minlength=void 0,this.name=void 0,this.pattern=void 0,this.placeholder=void 0,this.readonly=void 0,this.required=void 0,this.step=void 0,this.type="text",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){this.invalidChanged.emit(t.target.value)}render(){const t=["standalone",this.showerrormsg?"invalid":""].join(" ");return n(s,null,n("label",{class:"inputBlock"},this.label,this.required?"":n("span",{class:"optional"}," (optional)"),this.iconleft&&n("div",{class:"icon-left"},n("tttx-icon",{icon:this.iconleft,color:"grey"})),n("input",{class:t,autocapitalize:this.inputAutocapitalize,autofocus:this.inputAutofocus,enterkeyhint:this.inputKeyhint,tabindex:this.inputIndex,title:this.inputTitle,autocomplete:this.autocomplete,checked:this.checked,disabled:this.disabled,max:this.max,maxlength:this.maxlength,min:this.min,minlength:this.minlength,name:this.name,pattern:this.pattern,placeholder:this.placeholder,readonly:this.readonly,required:this.required,step:this.step,type:this.type,value:this.value,onBlur:this.handleBlur.bind(this),onFocus:this.handleFocus.bind(this),onInput:this.handleChange.bind(this),onInvalid:this.handleInvalid.bind(this)}),this.iconright&&n("div",{class:"icon-right"},n("tttx-icon",{icon:this.iconright,color:"grey"})),n("span",{class:["errorBubble",this.showerrormsg&&this.errormsg?"visible":""].join(" ")},n("span",{class:"material-symbols-rounded validationicon"},"warning")," ",this.errormsg)))}};o.style='.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-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}.icon-left.sc-tttx-standalone-input,.icon-right.sc-tttx-standalone-input{flex-basis:24px}.icon-left.sc-tttx-standalone-input span.sc-tttx-standalone-input,.icon-right.sc-tttx-standalone-input span.sc-tttx-standalone-input{font-size:24px;line-height:24px;text-align:center;display:block;width:24px;height:24px;margin-top:4px}.icon-left.sc-tttx-standalone-input span.sc-tttx-standalone-input{margin-left:4px}.icon-right.sc-tttx-standalone-input span.sc-tttx-standalone-input{margin-right:4px}.icon-right.sc-tttx-standalone-input{margin-top:5px;margin-right:4px}.icon-left.sc-tttx-standalone-input{margin-top:5px;margin-left:4px}.iconleft.sc-tttx-standalone-input .input.sc-tttx-standalone-input{padding-left:4px}.iconright.sc-tttx-standalone-input .input.sc-tttx-standalone-input{padding-right:4px}.focused.sc-tttx-standalone-input{border-color:#1479c6}.errormsg.sc-tttx-standalone-input{display:flex;justify-content:center;align-items:center;float:left;margin-bottom:16px;box-sizing:border-box;background-color:transparent;height:26px;font-size:14px;border-radius:none;z-index:2;color:#dc0000}.errormsg.sc-tttx-standalone-input .validationicon.sc-tttx-standalone-input{width:16px;height:16px;font-size:16px;margin-right:4px;vertical-align:middle;color:#dc0000}.danger.sc-tttx-standalone-input{color:#dc0000}.optional.sc-tttx-standalone-input{color:#757575;font-weight:normal}label.inputBlock.sc-tttx-standalone-input{display:block;position:relative;line-height:21px}label.sc-tttx-standalone-input{font-weight:500;font-size:16px}input.sc-tttx-standalone-input:not([type=submit]){font-family:"Roboto", serif;box-sizing:border-box;width:100%;height:36px;padding:0 16px;font-size:16px;border:1px solid #d5d5d5;border-radius:4px;margin-top:4px}input[type=date].sc-tttx-standalone-input{background:white;display:block;min-width:calc(100% - 18px);line-height:37px}input.invalid.sc-tttx-standalone-input:invalid,input.standalone.invalid.sc-tttx-standalone-input{border:1px solid #dc0000}input.sc-tttx-standalone-input~.errorBubble.sc-tttx-standalone-input{min-height:27px;position:relative;font-size:14px;font-weight:normal;width:100%;font-family:"Roboto", sans-serif;color:#dc0000;display:flex;align-content:center;align-items:center;justify-items:center}input.sc-tttx-standalone-input~.errorBubble.sc-tttx-standalone-input:not(.visible){visibility:hidden}input.sc-tttx-standalone-input~.errorBubble.sc-tttx-standalone-input span.sc-tttx-standalone-input{color:#dc0000;font-size:16px;margin-right:4px;height:16px}input.invalid.sc-tttx-standalone-input:invalid~.errorBubble.sc-tttx-standalone-input{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:"Roboto", sans-serif;color:#dc0000;visibility:visible}input.sc-tttx-standalone-input:focus{border-color:#1479c6}.sc-tttx-standalone-input-h{display:block}';export{o as tttx_standalone_input}
@@ -1 +1 @@
1
- import{p as e,b as t}from"./p-07b134af.js";export{s as setNonce}from"./p-07b134af.js";(()=>{const t=import.meta.url,a={};return""!==t&&(a.resourcesUrl=new URL(".",t).href),e(a)})().then((e=>t([["p-45afb84c",[[1,"tttx-input-calendar",{months:[4],years:[4],showCalendar:[32],selectedYear:[32],selectedMonth:[32]}]]],["p-a96ca037",[[1,"tttx-table",{headers:[16],data:[16],loading:[4],selected:[2]},[[4,"keydown","handleKeyDown"]]]]],["p-a92ca87e",[[1,"tttx-list",{name:[1],selectable:[4],items:[32],selectedIds:[32],loading:[32],lastPage:[32]},[[4,"listPageLoad","listLoadHandler"],[4,"listClearDataCache","listClearDataCacheHandler"],[4,"listActionSelectedEvent","listActionSelectedEventHandler"]]]]],["p-74061060",[[2,"tttx-standalone-input",{label:[1],showerrormsg:[4],errormsg:[1],iconleft:[1],iconright:[1],autocapitalize:[1],autofocus:[4],inputKeyhint:[1,"input-keyhint"],inputIndex:[8,"input-index"],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-f579ed1e",[[1,"tttx-checkbox",{value:[4],label:[1],required:[4]}]]],["p-1b63f16a",[[1,"tttx-form",{formschema:[8],submitValue:[8,"submit-value"]}]]],["p-9536b8c4",[[1,"tttx-keyvalue-block",{keyvalues:[8],horizontal:[4]}]]],["p-68ff0f39",[[1,"tttx-button",{notext:[4],icon:[1],iconposition:[1],design:[1]}]]],["p-93763d3c",[[1,"tttx-loading-spinner",{loadingMessage:[1028,"loading-message"],size:[1025]}]]],["p-037d286f",[[1,"tttx-popover-content",{header:[1],body:[1],linkcontext:[1],linktext:[1]}]]],["p-a5808741",[[1,"tttx-icon",{icon:[1],color:[1]}]]]],e)));
1
+ import{p as t,b as e}from"./p-07b134af.js";export{s as setNonce}from"./p-07b134af.js";(()=>{const e=import.meta.url,a={};return""!==e&&(a.resourcesUrl=new URL(".",e).href),t(a)})().then((t=>e([["p-45afb84c",[[1,"tttx-input-calendar",{months:[4],years:[4],showCalendar:[32],selectedYear:[32],selectedMonth:[32]}]]],["p-a96ca037",[[1,"tttx-table",{headers:[16],data:[16],loading:[4],selected:[2]},[[4,"keydown","handleKeyDown"]]]]],["p-a92ca87e",[[1,"tttx-list",{name:[1],selectable:[4],items:[32],selectedIds:[32],loading:[32],lastPage:[32]},[[4,"listPageLoad","listLoadHandler"],[4,"listClearDataCache","listClearDataCacheHandler"],[4,"listActionSelectedEvent","listActionSelectedEventHandler"]]]]],["p-46b5551e",[[2,"tttx-standalone-input",{label:[1],showerrormsg:[4],errormsg:[1],iconleft:[1],iconright:[1],inputAutocapitalize:[1,"input-autocapitalize"],inputAutofocus:[4,"input-autofocus"],inputKeyhint:[1,"input-keyhint"],inputIndex:[8,"input-index"],inputTitle:[1,"input-title"],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-f579ed1e",[[1,"tttx-checkbox",{value:[4],label:[1],required:[4]}]]],["p-1b63f16a",[[1,"tttx-form",{formschema:[8],submitValue:[8,"submit-value"]}]]],["p-9536b8c4",[[1,"tttx-keyvalue-block",{keyvalues:[8],horizontal:[4]}]]],["p-68ff0f39",[[1,"tttx-button",{notext:[4],icon:[1],iconposition:[1],design:[1]}]]],["p-93763d3c",[[1,"tttx-loading-spinner",{loadingMessage:[1028,"loading-message"],size:[1025]}]]],["p-037d286f",[[1,"tttx-popover-content",{header:[1],body:[1],linkcontext:[1],linktext:[1]}]]],["p-a5808741",[[1,"tttx-icon",{icon:[1],color:[1]}]]]],t)));
@@ -11,8 +11,8 @@ export declare class TttxInput {
11
11
  errormsg: string;
12
12
  iconleft: string;
13
13
  iconright: string;
14
- autocapitalize: string;
15
- autofocus: boolean;
14
+ inputAutocapitalize: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';
15
+ inputAutofocus: boolean;
16
16
  /**
17
17
  * Defines what action to present for the enter key on virtual keyboards
18
18
  */
@@ -25,6 +25,7 @@ export declare class TttxInput {
25
25
  * <tttx-standalone-input inputIndex={1} />
26
26
  */
27
27
  inputIndex: string | number;
28
+ inputTitle: string;
28
29
  autocomplete: 'off' | 'on';
29
30
  checked: boolean;
30
31
  disabled: boolean;
@@ -49,14 +49,14 @@ export namespace Components {
49
49
  "linktext": string;
50
50
  }
51
51
  interface TttxStandaloneInput {
52
- "autocapitalize": string;
53
52
  "autocomplete": 'off' | 'on';
54
- "autofocus": boolean;
55
53
  "checked": boolean;
56
54
  "disabled": boolean;
57
55
  "errormsg": string;
58
56
  "iconleft": string;
59
57
  "iconright": string;
58
+ "inputAutocapitalize": 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';
59
+ "inputAutofocus": boolean;
60
60
  /**
61
61
  * tabindex - Allows the HTML elements to be focusable
62
62
  * @example <caption>In HTML (like `index.html`)</caption> <tttx-standalone-input input-index="1" />
@@ -67,6 +67,7 @@ export namespace Components {
67
67
  * Defines what action to present for the enter key on virtual keyboards
68
68
  */
69
69
  "inputKeyhint": 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
70
+ "inputTitle": string;
70
71
  "label": string;
71
72
  "max": MinMaxDates | number;
72
73
  "maxlength": string | number;
@@ -239,14 +240,14 @@ declare namespace LocalJSX {
239
240
  "linktext"?: string;
240
241
  }
241
242
  interface TttxStandaloneInput {
242
- "autocapitalize"?: string;
243
243
  "autocomplete"?: 'off' | 'on';
244
- "autofocus"?: boolean;
245
244
  "checked"?: boolean;
246
245
  "disabled"?: boolean;
247
246
  "errormsg"?: string;
248
247
  "iconleft"?: string;
249
248
  "iconright"?: string;
249
+ "inputAutocapitalize"?: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';
250
+ "inputAutofocus"?: boolean;
250
251
  /**
251
252
  * tabindex - Allows the HTML elements to be focusable
252
253
  * @example <caption>In HTML (like `index.html`)</caption> <tttx-standalone-input input-index="1" />
@@ -257,6 +258,7 @@ declare namespace LocalJSX {
257
258
  * Defines what action to present for the enter key on virtual keyboards
258
259
  */
259
260
  "inputKeyhint"?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
261
+ "inputTitle"?: string;
260
262
  "label"?: string;
261
263
  "max"?: MinMaxDates | number;
262
264
  "maxlength"?: string | number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@3t-transform/threeteeui",
3
- "version": "0.0.21",
3
+ "version": "0.0.22",
4
4
  "description": "3t Design System",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/index.js",
@@ -1 +0,0 @@
1
- import{r as t,c as i,h as n,H as s}from"./p-07b134af.js";const o=class{constructor(n){t(this,n),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.showerrormsg=void 0,this.errormsg=void 0,this.iconleft=void 0,this.iconright=void 0,this.autocapitalize=void 0,this.autofocus=void 0,this.inputKeyhint=void 0,this.inputIndex=void 0,this.autocomplete=void 0,this.checked=void 0,this.disabled=void 0,this.max=void 0,this.maxlength=void 0,this.min=void 0,this.minlength=void 0,this.name=void 0,this.pattern=void 0,this.placeholder=void 0,this.readonly=void 0,this.required=void 0,this.step=void 0,this.type="text",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){this.invalidChanged.emit(t.target.value)}render(){const t=["standalone",this.showerrormsg?"invalid":""].join(" ");return n(s,null,n("label",{class:"inputBlock"},this.label,this.required?"":n("span",{class:"optional"}," (optional)"),this.iconleft&&n("div",{class:"icon-left"},n("tttx-icon",{icon:this.iconleft,color:"grey"})),n("input",{class:t,autocapitalize:this.autocapitalize,autofocus:this.autofocus,enterkeyhint:this.inputKeyhint,tabindex:this.inputIndex,autocomplete:this.autocomplete,checked:this.checked,disabled:this.disabled,max:this.max,maxlength:this.maxlength,min:this.min,minlength:this.minlength,name:this.name,pattern:this.pattern,placeholder:this.placeholder,readonly:this.readonly,required:this.required,step:this.step,type:this.type,value:this.value,onBlur:this.handleBlur.bind(this),onFocus:this.handleFocus.bind(this),onInput:this.handleChange.bind(this),onInvalid:this.handleInvalid.bind(this)}),this.iconright&&n("div",{class:"icon-right"},n("tttx-icon",{icon:this.iconright,color:"grey"})),n("span",{class:["errorBubble",this.showerrormsg&&this.errormsg?"visible":""].join(" ")},n("span",{class:"material-symbols-rounded validationicon"},"warning")," ",this.errormsg)))}};o.style='.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-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}.icon-left.sc-tttx-standalone-input,.icon-right.sc-tttx-standalone-input{flex-basis:24px}.icon-left.sc-tttx-standalone-input span.sc-tttx-standalone-input,.icon-right.sc-tttx-standalone-input span.sc-tttx-standalone-input{font-size:24px;line-height:24px;text-align:center;display:block;width:24px;height:24px;margin-top:4px}.icon-left.sc-tttx-standalone-input span.sc-tttx-standalone-input{margin-left:4px}.icon-right.sc-tttx-standalone-input span.sc-tttx-standalone-input{margin-right:4px}.icon-right.sc-tttx-standalone-input{margin-top:5px;margin-right:4px}.icon-left.sc-tttx-standalone-input{margin-top:5px;margin-left:4px}.iconleft.sc-tttx-standalone-input .input.sc-tttx-standalone-input{padding-left:4px}.iconright.sc-tttx-standalone-input .input.sc-tttx-standalone-input{padding-right:4px}.focused.sc-tttx-standalone-input{border-color:#1479c6}.errormsg.sc-tttx-standalone-input{display:flex;justify-content:center;align-items:center;float:left;margin-bottom:16px;box-sizing:border-box;background-color:transparent;height:26px;font-size:14px;border-radius:none;z-index:2;color:#dc0000}.errormsg.sc-tttx-standalone-input .validationicon.sc-tttx-standalone-input{width:16px;height:16px;font-size:16px;margin-right:4px;vertical-align:middle;color:#dc0000}.danger.sc-tttx-standalone-input{color:#dc0000}.optional.sc-tttx-standalone-input{color:#757575;font-weight:normal}label.inputBlock.sc-tttx-standalone-input{display:block;position:relative;line-height:21px}label.sc-tttx-standalone-input{font-weight:500;font-size:16px}input.sc-tttx-standalone-input:not([type=submit]){font-family:"Roboto", serif;box-sizing:border-box;width:100%;height:36px;padding:0 16px;font-size:16px;border:1px solid #d5d5d5;border-radius:4px;margin-top:4px}input[type=date].sc-tttx-standalone-input{background:white;display:block;min-width:calc(100% - 18px);line-height:37px}input.invalid.sc-tttx-standalone-input:invalid,input.standalone.invalid.sc-tttx-standalone-input{border:1px solid #dc0000}input.sc-tttx-standalone-input~.errorBubble.sc-tttx-standalone-input{min-height:27px;position:relative;font-size:14px;font-weight:normal;width:100%;font-family:"Roboto", sans-serif;color:#dc0000;display:flex;align-content:center;align-items:center;justify-items:center}input.sc-tttx-standalone-input~.errorBubble.sc-tttx-standalone-input:not(.visible){visibility:hidden}input.sc-tttx-standalone-input~.errorBubble.sc-tttx-standalone-input span.sc-tttx-standalone-input{color:#dc0000;font-size:16px;margin-right:4px;height:16px}input.invalid.sc-tttx-standalone-input:invalid~.errorBubble.sc-tttx-standalone-input{position:relative;font-size:14px;font-weight:normal;width:100%;font-family:"Roboto", sans-serif;color:#dc0000;visibility:visible}input.sc-tttx-standalone-input:focus{border-color:#1479c6}.sc-tttx-standalone-input-h{display:block}';export{o as tttx_standalone_input}