@cas-smartdesign/lit-input 7.1.5 → 7.2.1

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.
Files changed (7) hide show
  1. package/dist/docs/doc.mjs +103 -53
  2. package/dist/input-with-externals.js +26 -23
  3. package/dist/input-with-externals.js.map +3 -3
  4. package/dist/input.d.ts +5 -1
  5. package/dist/input.mjs +72 -49
  6. package/dist/input.mjs.map +1 -1
  7. package/package.json +3 -3
package/dist/input.d.ts CHANGED
@@ -43,6 +43,9 @@ export default class SDInput extends LitElement {
43
43
  name: string;
44
44
  inactive: boolean;
45
45
  autocomplete: AutoFill;
46
+ min: string;
47
+ max: string;
48
+ pattern: string;
46
49
  private _inputElement;
47
50
  private _initialized;
48
51
  private _needsAutocompletedCheck;
@@ -68,9 +71,10 @@ export default class SDInput extends LitElement {
68
71
  setSelectionRange(start: number, end: number): void;
69
72
  static get styles(): import("lit").CSSResult[];
70
73
  render(): TemplateResult;
71
- protected updated(_changedProperties: PropertyValues): void;
74
+ protected updated(changedProperties: PropertyValues): void;
72
75
  update(changedProperties: PropertyValues): void;
73
76
  protected fireValueChange(immediate?: boolean): void;
77
+ private updateFormValidity;
74
78
  private shouldFloat;
75
79
  protected setFormValue(value: string | File | FormData): void;
76
80
  protected formResetCallback(): void;
package/dist/input.mjs CHANGED
@@ -1,12 +1,12 @@
1
- import { LitElement as f, css as b, unsafeCSS as g, html as d, nothing as y } from "lit";
1
+ import { LitElement as f, css as b, unsafeCSS as y, html as d, nothing as g } from "lit";
2
2
  import { property as a } from "lit/decorators/property.js";
3
- import { ifDefined as r } from "lit/directives/if-defined.js";
3
+ import { ifDefined as n } from "lit/directives/if-defined.js";
4
4
  import { ValidationLevel as m } from "@cas-smartdesign/field-validation-message";
5
- const x = ":host{display:inline-flex;position:relative;cursor:text;font-family:Segoe UI,Lucida Sans,Arial,sans-serif;font-size:16px;color:#111;contain:layout style;flex-direction:column}:host([hidden]),:host([type=hidden]){display:none!important}:host([effective-disabled]){opacity:.6;cursor:default;filter:grayscale(100%)}:host([effective-disabled]) .unfocused-line,:host([effective-disabled]) .focused-line{border-bottom-style:dashed}:host(:not([effective-disabled]):focus) .focused-line,:host(:not([effective-disabled])[focused]) .focused-line{transform:none;transition:transform .25s}:host(:not([effective-disabled]):focus) .label.float,:host(:not([effective-disabled])[focused]) .label.float{color:var(--sd-input-focused-color, #1467ba)}:host([inactive]) .input{pointer-events:none}:host([effective-disabled]:focus),:host([effective-disabled][focused]){box-shadow:0 0 0 1px #111}:host(:not([effective-disabled])[validationlevel]) .focused-line{transform:none;transition:transform .25s}:host([validationlevel=warn i]) .focused-line{border-bottom-color:var(--sd-input-validation-color, #555555)}:host([validationlevel=warn i]) .label,:host([validationlevel=warn i]) .validation-message{color:var(--sd-input-validation-color, #555555)!important}:host([validationlevel=suggest i]) .focused-line{border-bottom-color:var(--sd-input-validation-color, #bf8800)}:host([validationlevel=suggest i]) .label,:host([validationlevel=suggest i]) .validation-message{color:var(--sd-input-validation-color, #bf8800)!important}:host([validationlevel=error i]) .focused-line{border-bottom-color:var(--sd-input-validation-color, #cc0017)}:host([validationlevel=error i]) .label,:host([validationlevel=error i]) .validation-message{color:var(--sd-input-validation-color, #cc0017)!important}:host([validationlevel=warn]) .focused-line{border-bottom-color:var(--sd-input-validation-color, #555555)}:host([validationlevel=warn]) .label,:host([validationlevel=warn]) .validation-message{color:var(--sd-input-validation-color, #555555)!important}:host([validationlevel=suggest]) .focused-line{border-bottom-color:var(--sd-input-validation-color, #bf8800)}:host([validationlevel=suggest]) .label,:host([validationlevel=suggest]) .validation-message{color:var(--sd-input-validation-color, #bf8800)!important}:host([validationlevel=error]) .focused-line{border-bottom-color:var(--sd-input-validation-color, #cc0017)}:host([validationlevel=error]) .label,:host([validationlevel=error]) .validation-message{color:var(--sd-input-validation-color, #cc0017)!important}.validation-message-wrapper{position:relative}.validation-message{position:absolute;left:0;right:0}.label.float{transform:translateY(-75%) scale(.75);width:133%}.label:not(.float){max-width:100%}.floated-label-placeholder{height:20px;width:100%}.label{position:absolute;top:0;left:0;line-height:24px;pointer-events:none;color:var(--sd-input-color, #767676);transition:transform .25s,width .25s;transform-origin:left top}.input-wrapper{position:relative;display:flex;flex-direction:row;align-items:center;background-color:var(--input-wrapper-background-color)}:host([extended-prefix]:focus-within:not([effective-disabled])) .input-wrapper{flex-direction:column;align-items:baseline}:host([extended-prefix]:focus-within:not([effective-disabled])) .input-container{width:100%}:host([extended-prefix]:not(:focus-within)) .input-container,:host([extended-prefix][effective-disabled]) .input-container{width:0px}.input-container{line-height:var(--sd-input-line-height, 24px);flex:1 1 auto}.input{width:100%;background:var(--sd-input-background, transparent);font-family:inherit;font-size:inherit;text-align:inherit;color:inherit;border:none;outline:none;resize:none;padding-left:0;padding-right:0}.input:-webkit-autofill{animation-name:onautofillstart}.input:not(:-webkit-autofill){animation-name:onautofillcancel}@keyframes onautofillstart{0%{outline:none}}@keyframes onautofillcancel{0%{outline:none}}.label,input.input,.validation-message{text-overflow:ellipsis;overflow-x:hidden;white-space:nowrap}.input::-ms-clear{display:none}.input::placeholder{color:var(--sd-input-color, #767676)}.input:-ms-input-placeholder{color:var(--sd-input-color, #767676)}.input::-ms-input-placeholder{color:var(--sd-input-color, #767676)}.underline{height:2px;width:100%;position:relative}.unfocused-line,.focused-line{position:absolute;top:0;right:0;bottom:0;left:0}.unfocused-line{border-bottom:1px solid var(--sd-input-underline-color, #959595)}.focused-line{border-bottom:2px solid var(--sd-input-focused-color, #1467ba);transform-origin:center center;transform:scale3d(0,1,1)}.prefix,.suffix{display:flex;flex-wrap:nowrap;max-width:100%}.prefix ::slotted(*),.suffix ::slotted(*){display:flex}";
6
- var w = Object.defineProperty, E = Object.getOwnPropertyDescriptor, o = (u, t, e, s) => {
7
- for (var n = s > 1 ? void 0 : s ? E(t, e) : t, h = u.length - 1, p; h >= 0; h--)
8
- (p = u[h]) && (n = (s ? p(t, e, n) : p(n)) || n);
9
- return s && n && w(t, e, n), n;
5
+ const x = ":host{display:inline-flex;position:relative;cursor:text;font-family:Segoe UI,Lucida Sans,Arial,sans-serif;font-size:16px;color:#111;contain:layout style;flex-direction:column}:host([hidden]),:host([type=hidden]){display:none!important}:host([effective-disabled]){opacity:.6;cursor:default;filter:grayscale(100%)}:host([effective-disabled]) .unfocused-line,:host([effective-disabled]) .focused-line{border-bottom-style:dashed}:host(:not([effective-disabled]):focus) .focused-line,:host(:not([effective-disabled])[focused]) .focused-line{transform:none;transition:transform .25s}:host(:not([effective-disabled]):focus) .label.float,:host(:not([effective-disabled])[focused]) .label.float{color:var(--sd-input-focused-color, #1467ba)}:host([inactive]) .input{pointer-events:none}:host([effective-disabled]:focus),:host([effective-disabled][focused]){box-shadow:0 0 0 1px #111}:host(:not([effective-disabled])[validationlevel]) .focused-line,:host(:not([effective-disabled]):invalid) .focused-line{transform:none;transition:transform .25s}:host([validationlevel=warn i]) .focused-line{border-bottom-color:var(--sd-input-validation-color, #555555)}:host([validationlevel=warn i]) .label,:host([validationlevel=warn i]) .validation-message{color:var(--sd-input-validation-color, #555555)!important}:host([validationlevel=suggest i]) .focused-line{border-bottom-color:var(--sd-input-validation-color, #bf8800)}:host([validationlevel=suggest i]) .label,:host([validationlevel=suggest i]) .validation-message{color:var(--sd-input-validation-color, #bf8800)!important}:host([validationlevel=error i]) .focused-line,:host(:not([validationlevel]):invalid) .focused-line{border-bottom-color:var(--sd-input-validation-color, #cc0017)}:host([validationlevel=error i]) .label,:host([validationlevel=error i]) .validation-message,:host(:not([validationlevel]):invalid) .label,:host(:not([validationlevel]):invalid) .validation-message{color:var(--sd-input-validation-color, #cc0017)!important}.validation-message-wrapper{position:relative}.validation-message{position:absolute;left:0;right:0}.label.float{transform:translateY(-75%) scale(.75);width:133%}.label:not(.float){max-width:100%}.floated-label-placeholder{height:20px;width:100%}.label{position:absolute;top:0;left:0;line-height:24px;pointer-events:none;color:var(--sd-input-color, #767676);transition:transform .25s,width .25s;transform-origin:left top}.input-wrapper{position:relative;display:flex;flex-direction:row;align-items:center;background-color:var(--input-wrapper-background-color)}:host([extended-prefix]:focus-within:not([effective-disabled])) .input-wrapper{flex-direction:column;align-items:baseline}:host([extended-prefix]:focus-within:not([effective-disabled])) .input-container{width:100%}:host([extended-prefix]:not(:focus-within)) .input-container,:host([extended-prefix][effective-disabled]) .input-container{width:0px}.input-container{line-height:var(--sd-input-line-height, 24px);flex:1 1 auto}.input{width:100%;background:var(--sd-input-background, transparent);font-family:inherit;font-size:inherit;text-align:inherit;color:inherit;border:none;outline:none;resize:none;padding-left:0;padding-right:0}.input:-webkit-autofill{animation-name:onautofillstart}.input:not(:-webkit-autofill){animation-name:onautofillcancel}@keyframes onautofillstart{0%{outline:none}}@keyframes onautofillcancel{0%{outline:none}}.label,input.input,.validation-message{text-overflow:ellipsis;overflow-x:hidden;white-space:nowrap}.input::placeholder{color:var(--sd-input-color, #767676)}.underline{height:2px;width:100%;position:relative}.unfocused-line,.focused-line{position:absolute;top:0;right:0;bottom:0;left:0}.unfocused-line{border-bottom:1px solid var(--sd-input-underline-color, #959595)}.focused-line{border-bottom:2px solid var(--sd-input-focused-color, #1467ba);transform-origin:center center;transform:scale3d(0,1,1)}.prefix,.suffix{display:flex;flex-wrap:nowrap;max-width:100%}.prefix ::slotted(*),.suffix ::slotted(*){display:flex}";
6
+ var w = Object.defineProperty, E = Object.getOwnPropertyDescriptor, s = (u, t, e, o) => {
7
+ for (var r = o > 1 ? void 0 : o ? E(t, e) : t, h = u.length - 1, p; h >= 0; h--)
8
+ (p = u[h]) && (r = (o ? p(t, e, r) : p(r)) || r);
9
+ return o && r && w(t, e, r), r;
10
10
  };
11
11
  const $ = "sd-lit-input", v = "delegatesFocus" in window.ShadowRoot.prototype;
12
12
  let _ = 0;
@@ -21,18 +21,20 @@ const i = (l = class extends f {
21
21
  super.connectedCallback(), this.hasAttribute("tabIndex") || (this.tabIndex = 0);
22
22
  }
23
23
  firstUpdated(t) {
24
- super.firstUpdated(t), this.initAutocompleted(this.inputElement), this.updateInitialValue(), this.hasAttribute("disabled") && (this.disabled = !0), this.inputElement.oninput = (e) => {
24
+ super.firstUpdated(t), this.initAutocompleted(this.inputElement), this.updateInitialValue(), this.updateFormValidity(), this.hasAttribute("disabled") && (this.disabled = !0), this.inputElement.oninput = (e) => {
25
25
  this.autocompleted = e.inputType === "insertReplacementText" || !("data" in e), this.currentText = this.inputElement.value, this.fireValueChange(!0);
26
26
  }, this.inputElement.onchange = () => this.fireValueChange(), v || (this.inputElement.onfocus = () => this.setAttribute("focused", ""), this.inputElement.onblur = () => this.removeAttribute("focused"), this.addEventListener("focus", (e) => {
27
27
  e.target === this && this.inputElement.focus();
28
- })), this.addEventListener("keydown", (e) => {
29
- var s, n;
30
- e.key == "Enter" && ((n = (s = this._internals) == null ? void 0 : s.form) == null || n.requestSubmit());
28
+ })), this.inputElement.addEventListener("keyup", () => {
29
+ this.updateFormValidity();
30
+ }), this.addEventListener("keydown", (e) => {
31
+ var o, r;
32
+ e.key == "Enter" && ((r = (o = this._internals) == null ? void 0 : o.form) == null || r.requestSubmit());
31
33
  }), this._initialized = !0;
32
34
  }
33
35
  initAutocompleted(t) {
34
- const e = (s) => {
35
- /^onautofillstart(-sd-lit-input-\d+|\s?)$/.test(s.animationName) ? this.autocompleted = !0 : /^onautofillcancel(-sd-lit-input-\d+|\s?)$/.test(s.animationName) && (this.autocompleted = !1);
36
+ const e = (o) => {
37
+ /^onautofillstart(-sd-lit-input-\d+|\s?)$/.test(o.animationName) ? this.autocompleted = !0 : /^onautofillcancel(-sd-lit-input-\d+|\s?)$/.test(o.animationName) && (this.autocompleted = !1);
36
38
  };
37
39
  this.activeShadyDOM ? (this._needsAutocompletedCheck = !0, this.activeShadyDOM.nativeMethods.addEventListener.call(t, "animationstart", e)) : t.addEventListener("animationstart", e);
38
40
  }
@@ -76,19 +78,21 @@ const i = (l = class extends f {
76
78
  static get styles() {
77
79
  return [
78
80
  b`
79
- ${g(x)}
81
+ ${y(x)}
80
82
  `
81
83
  ];
82
84
  }
83
85
  render() {
86
+ var o;
84
87
  let t;
88
+ const e = this.validationMessage || ((o = this.inputElement) == null ? void 0 : o.validationMessage);
85
89
  return this.rows === 1 ? t = d`
86
90
  <input
87
91
  id=${this._inputId}
88
92
  class="input"
89
93
  .type=${this.type}
90
- placeholder=${r(this.placeholder || void 0)}
91
- name=${r(this.name || void 0)}
94
+ placeholder=${n(this.placeholder || void 0)}
95
+ name=${n(this.name || void 0)}
92
96
  aria-disabled=${this.effectiveDisabled}
93
97
  autocomplete=${this.autocomplete}
94
98
  ?disabled=${this.inactive}
@@ -96,15 +100,18 @@ const i = (l = class extends f {
96
100
  ?required=${this.required}
97
101
  maxlength=${this.maxlength > 0 ? this.maxlength : l.DEFAULT_MAX_LENGTH}
98
102
  aria-describedby=${this._validationMessageId}
99
- aria-invalid=${r(!!this.validationMessage || void 0)}
100
- aria-label=${r(this.sdAriaLabel || void 0)}
103
+ aria-invalid=${n(!!e || void 0)}
104
+ aria-label=${n(this.sdAriaLabel || void 0)}
105
+ min=${n(this.min || void 0)}
106
+ max=${n(this.max || void 0)}
107
+ pattern=${n(this.pattern || void 0)}
101
108
  />
102
109
  ` : t = d`
103
110
  <textarea
104
111
  id=${this._inputId}
105
112
  class="input"
106
- placeholder=${r(this.placeholder || void 0)}
107
- name=${r(this.name || void 0)}
113
+ placeholder=${n(this.placeholder || void 0)}
114
+ name=${n(this.name || void 0)}
108
115
  aria-disabled=${this.effectiveDisabled}
109
116
  autocomplete=${this.autocomplete}
110
117
  ?disabled=${this.inactive}
@@ -113,11 +120,11 @@ const i = (l = class extends f {
113
120
  maxlength=${this.maxlength > 0 ? this.maxlength : l.DEFAULT_MAX_LENGTH}
114
121
  rows=${this.rows}
115
122
  aria-describedby=${this._validationMessageId}
116
- aria-invalid=${r(!!this.validationMessage || void 0)}
117
- aria-label=${r(this.sdAriaLabel || void 0)}
123
+ aria-invalid=${n(!!e || void 0)}
124
+ aria-label=${n(this.sdAriaLabel || void 0)}
118
125
  ></textarea>
119
126
  `, d`
120
- ${this.label ? d` <div class="floated-label-placeholder" aria-hidden="true">&nbsp;</div> ` : y}
127
+ ${this.label ? d` <div class="floated-label-placeholder" aria-hidden="true">&nbsp;</div> ` : g}
121
128
  <div class="input-wrapper">
122
129
  <span class="prefix"><slot name="prefix"></slot></span>
123
130
  <div class="input-container" style="position:${this.shouldFloat() ? "static" : "relative"};">
@@ -135,11 +142,11 @@ const i = (l = class extends f {
135
142
  <div class="focused-line"></div>
136
143
  </div>
137
144
  <div class="validation-message-wrapper" aria-hidden="true">
138
- ${this.validationMessage && d`
145
+ ${e && d`
139
146
  <sd-field-validation-message
140
147
  id=${this._validationMessageId}
141
148
  class="validation-message"
142
- .message=${this.validationMessage}
149
+ .message=${e}
143
150
  .icon=${this.validationIconSrc}
144
151
  .level=${this.validationLevel}
145
152
  >
@@ -154,11 +161,11 @@ const i = (l = class extends f {
154
161
  this.autocompleted = this.autocompleted || !!this.shadowRoot.querySelector(":-webkit-autofill");
155
162
  } catch {
156
163
  }
157
- }, 0);
164
+ }, 0), this.rows > 1 && ((t.has("min") || t.has("max") || t.has("pattern")) && console.warn("min, max & pattern attributes are not supported with multiple rows configuration."), this.type != "text" && console.warn(`type: ${this.type} is not supported with multiple rows configuration.`));
158
165
  }
159
166
  update(t) {
160
- var e, s;
161
- if (super.update(t), t.has("validationMessage") && (this.validationMessage ? (this.validationLevel || (this.validationLevel = m.Error), (e = this._internals) == null || e.setValidity({ customError: !0 }, this.validationMessage)) : (this.validationLevel = null, (s = this._internals) == null || s.setValidity({}))), this._initialized && t.has("rows"))
167
+ var e, o;
168
+ if (super.update(t), t.has("validationMessage") && (this.validationMessage ? (this.validationLevel || (this.validationLevel = m.Error), (e = this._internals) == null || e.setValidity({ customError: !0 }, this.validationMessage)) : (this.validationLevel = null, (o = this._internals) == null || o.setValidity(this.inputElement.validity, this.inputElement.validationMessage))), this._initialized && t.has("rows"))
162
169
  throw Error("rows attribute cannot be changed after the input is attached to the DOM");
163
170
  }
164
171
  fireValueChange(t) {
@@ -166,10 +173,17 @@ const i = (l = class extends f {
166
173
  new CustomEvent(`${t ? "immediate-" : ""}value-change`, {
167
174
  detail: { value: this.value }
168
175
  })
169
- ), this.setFormValue(this.value);
176
+ ), this.setFormValue(this.value), this.updateFormValidity();
177
+ }
178
+ updateFormValidity() {
179
+ if (this.validationMessage == null) {
180
+ this._internals.setValidity(this.inputElement.validity, this.inputElement.validationMessage);
181
+ const t = this.shadowRoot.querySelector("sd-field-validation-message");
182
+ this.requestUpdate("validationMessage", t == null ? null : t.message);
183
+ }
170
184
  }
171
185
  shouldFloat() {
172
- return this.alwaysFloatLabel || this.currentText || this.placeholder || this.autocompleted;
186
+ return this.alwaysFloatLabel || this.currentText || this.placeholder || this.autocompleted || this.type === "date";
173
187
  }
174
188
  setFormValue(t) {
175
189
  var e;
@@ -191,19 +205,19 @@ const i = (l = class extends f {
191
205
  ...f.shadowRootOptions,
192
206
  delegatesFocus: v
193
207
  }, l);
194
- o([
208
+ s([
195
209
  a({ type: String, reflect: !0 })
196
210
  ], i.prototype, "label", 2);
197
- o([
211
+ s([
198
212
  a({ type: String, attribute: !0 })
199
213
  ], i.prototype, "validationMessage", 2);
200
- o([
214
+ s([
201
215
  a({ type: String, attribute: !0 })
202
216
  ], i.prototype, "validationIconSrc", 2);
203
- o([
217
+ s([
204
218
  a({ type: m, attribute: !0, reflect: !0 })
205
219
  ], i.prototype, "validationLevel", 2);
206
- o([
220
+ s([
207
221
  a({
208
222
  type: String,
209
223
  hasChanged(u, t) {
@@ -211,48 +225,57 @@ o([
211
225
  }
212
226
  })
213
227
  ], i.prototype, "currentText", 2);
214
- o([
228
+ s([
215
229
  a({ type: Boolean, attribute: !0 })
216
230
  ], i.prototype, "alwaysFloatLabel", 2);
217
- o([
231
+ s([
218
232
  a({ type: Boolean, attribute: !0 })
219
233
  ], i.prototype, "autocompleted", 2);
220
- o([
234
+ s([
221
235
  a({ type: Number, attribute: !0 })
222
236
  ], i.prototype, "rows", 2);
223
- o([
237
+ s([
224
238
  a({ type: Boolean, reflect: !0, attribute: "effective-disabled" })
225
239
  ], i.prototype, "effectiveDisabled", 2);
226
- o([
240
+ s([
227
241
  a({ type: Boolean, reflect: !0, attribute: "extended-prefix" })
228
242
  ], i.prototype, "extendedPrefix", 2);
229
- o([
243
+ s([
230
244
  a({ type: String, reflect: !0 })
231
245
  ], i.prototype, "type", 2);
232
- o([
246
+ s([
233
247
  a({ type: String, reflect: !0 })
234
248
  ], i.prototype, "placeholder", 2);
235
- o([
249
+ s([
236
250
  a({ type: String, reflect: !0 })
237
251
  ], i.prototype, "sdAriaLabel", 2);
238
- o([
252
+ s([
239
253
  a({ type: Number, reflect: !0 })
240
254
  ], i.prototype, "maxlength", 2);
241
- o([
255
+ s([
242
256
  a({ type: Boolean, reflect: !0 })
243
257
  ], i.prototype, "readonly", 2);
244
- o([
258
+ s([
245
259
  a({ type: Boolean, reflect: !0 })
246
260
  ], i.prototype, "required", 2);
247
- o([
261
+ s([
248
262
  a({ type: String, reflect: !0 })
249
263
  ], i.prototype, "name", 2);
250
- o([
264
+ s([
251
265
  a({ type: Boolean, reflect: !0 })
252
266
  ], i.prototype, "inactive", 2);
253
- o([
267
+ s([
254
268
  a({ type: String, attribute: !0 })
255
269
  ], i.prototype, "autocomplete", 2);
270
+ s([
271
+ a({ type: String, attribute: !0 })
272
+ ], i.prototype, "min", 2);
273
+ s([
274
+ a({ type: String, attribute: !0 })
275
+ ], i.prototype, "max", 2);
276
+ s([
277
+ a({ type: String, attribute: !0 })
278
+ ], i.prototype, "pattern", 2);
256
279
  let c = i;
257
280
  customElements.get(c.ID) || customElements.define(c.ID, c);
258
281
  export {
package/dist/input.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"input.mjs","sources":["../input.ts"],"sourcesContent":["import { LitElement, html, PropertyValues, unsafeCSS, TemplateResult, css, nothing } from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { ValidationLevel } from \"@cas-smartdesign/field-validation-message\";\n\nconst TAG_NAME = \"sd-lit-input\";\n\ndeclare global {\n interface HTMLElementTagNameMap {\n [TAG_NAME]: SDInput;\n }\n}\n\nimport style from \"./style.scss?inline\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst delegatesFocus = \"delegatesFocus\" in (window as any).ShadowRoot.prototype;\n\nlet idCounter = 0;\n\nexport interface IValueChangeEvent {\n value: string;\n}\n\nexport interface CustomEventMap extends HTMLElementEventMap {\n \"immediate-value-change\": CustomEvent<IValueChangeEvent>;\n \"value-change\": CustomEvent<IValueChangeEvent>;\n}\n\nexport default interface SDInput {\n addEventListener<K extends keyof CustomEventMap>(\n event: K,\n listener: ((this: this, ev: CustomEventMap[K]) => unknown) | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n removeEventListener<K extends keyof CustomEventMap>(\n type: K,\n listener: (this: this, ev: CustomEventMap[K]) => unknown,\n options?: boolean | EventListenerOptions,\n ): void;\n removeEventListener(\n type: string,\n listener: EventListenerOrEventListenerObject,\n options?: boolean | EventListenerOptions,\n ): void;\n dispatchEvent<EventType extends CustomEventMap[keyof CustomEventMap]>(event: EventType): boolean;\n}\n\nexport default class SDInput extends LitElement {\n public static readonly ID: string = TAG_NAME;\n private static readonly DEFAULT_MAX_LENGTH: number = 524288;\n static formAssociated = true;\n\n @property({ type: String, reflect: true })\n public label: string;\n @property({ type: String, attribute: true })\n public validationMessage: string;\n @property({ type: String, attribute: true })\n public validationIconSrc: string;\n @property({ type: ValidationLevel, attribute: true, reflect: true })\n public validationLevel: ValidationLevel;\n @property({\n type: String,\n hasChanged(value, oldValue) {\n return oldValue != undefined && oldValue != value;\n },\n })\n public currentText;\n @property({ type: Boolean, attribute: true })\n public alwaysFloatLabel: boolean;\n @property({ type: Boolean, attribute: true })\n public autocompleted: boolean;\n @property({ type: Number, attribute: true })\n public rows = 1;\n @property({ type: Boolean, reflect: true, attribute: \"effective-disabled\" })\n public effectiveDisabled: boolean = false;\n @property({ type: Boolean, reflect: true, attribute: \"extended-prefix\" })\n public extendedPrefix: boolean;\n\n // delegated settings to input\n @property({ type: String, reflect: true })\n public type = \"text\";\n @property({ type: String, reflect: true })\n public placeholder: string;\n @property({ type: String, reflect: true })\n public sdAriaLabel: string;\n @property({ type: Number, reflect: true })\n public maxlength: number;\n @property({ type: Boolean, reflect: true })\n public readonly: boolean;\n @property({ type: Boolean, reflect: true })\n public required: boolean;\n @property({ type: String, reflect: true })\n public name: string;\n @property({ type: Boolean, reflect: true })\n public inactive: boolean;\n @property({ type: String, attribute: true })\n public autocomplete: AutoFill = \"off\";\n\n private _inputElement: HTMLInputElement;\n private _initialized: boolean;\n private _needsAutocompletedCheck: boolean;\n private _validationMessageId: string;\n private _inputId: string;\n private _internals: ElementInternals;\n private _initialValue: string;\n\n static shadowRootOptions: ShadowRootInit = {\n ...LitElement.shadowRootOptions,\n delegatesFocus,\n };\n\n constructor() {\n super();\n const nextIdNumber = idCounter++;\n this._validationMessageId = SDInput.ID + \"_message_\" + nextIdNumber;\n this._inputId = SDInput.ID + \"_input_\" + nextIdNumber;\n if (this.attachInternals && !this.activeShadyDOM) {\n this._internals = this.attachInternals();\n }\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n if (!this.hasAttribute(\"tabIndex\")) {\n this.tabIndex = 0;\n }\n }\n\n protected firstUpdated(changedProperties: PropertyValues): void {\n super.firstUpdated(changedProperties);\n this.initAutocompleted(this.inputElement);\n this.updateInitialValue();\n\n if (this.hasAttribute(\"disabled\")) {\n this.disabled = true;\n }\n\n this.inputElement.oninput = (event: InputEvent) => {\n this.autocompleted = \"insertReplacementText\" === event.inputType || !(\"data\" in event);\n this.currentText = this.inputElement.value;\n this.fireValueChange(true);\n };\n this.inputElement.onchange = () => this.fireValueChange();\n if (!delegatesFocus) {\n // Provide a limited \"delegatesFocus\" behavior where it is not supported.\n // Note that clicking on non-focusable elements inside the shadow root\n // does not focus the first focusable element as it would have been expected.\n this.inputElement.onfocus = () => this.setAttribute(\"focused\", \"\");\n this.inputElement.onblur = () => this.removeAttribute(\"focused\");\n this.addEventListener(\"focus\", (event) => {\n if (event.target === this) {\n this.inputElement.focus();\n }\n });\n }\n this.addEventListener(\"keydown\", (event) => {\n if (event.key == \"Enter\") {\n this._internals?.form?.requestSubmit();\n }\n });\n this._initialized = true;\n }\n\n private initAutocompleted(target: HTMLElement) {\n const listener = (event) => {\n if (/^onautofillstart(-sd-lit-input-\\d+|\\s?)$/.test(event.animationName)) {\n this.autocompleted = true;\n } else if (/^onautofillcancel(-sd-lit-input-\\d+|\\s?)$/.test(event.animationName)) {\n this.autocompleted = false;\n }\n };\n if (this.activeShadyDOM) {\n this._needsAutocompletedCheck = true;\n this.activeShadyDOM.nativeMethods.addEventListener.call(target, \"animationstart\", listener);\n } else {\n target.addEventListener(\"animationstart\", listener);\n }\n }\n\n private get activeShadyDOM(): { nativeMethods } | null {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const shadyDOM = (window as any).ShadyDOM;\n return shadyDOM && shadyDOM.inUse ? shadyDOM : null;\n }\n\n private updateInitialValue(): void {\n if (typeof this.currentText !== \"undefined\") {\n this.value = this.currentText;\n } else {\n this.value = this.getAttribute(\"value\");\n }\n if (this.value) {\n this.currentText = this.inputElement.value;\n }\n this._initialValue = this.value;\n }\n\n public get disabled(): boolean {\n return this.hasAttribute(\"disabled\");\n }\n\n public set disabled(disabled: boolean) {\n if (disabled) {\n this.setAttribute(\"disabled\", \"\");\n } else {\n this.removeAttribute(\"disabled\");\n }\n if (!this._internals) {\n this.effectiveDisabled = disabled;\n }\n }\n\n // It is public as hacking around due to IE 11 is a common task to do.\n public get inputElement(): HTMLInputElement {\n if (this.shadowRoot && !this._inputElement) {\n this._inputElement = this.shadowRoot.querySelector(\".input\");\n }\n return this._inputElement;\n }\n\n public get value(): string {\n return this.inputElement && this.inputElement.value;\n }\n\n public set value(newValue: string) {\n this.currentText = newValue || \"\";\n if (this.inputElement) {\n this.inputElement.value = this.currentText;\n }\n this.setFormValue(this.currentText);\n }\n\n public get selectionStart(): number {\n return this.inputElement ? this.inputElement.selectionStart : 0;\n }\n\n public focus(): void {\n if (this.inputElement) {\n this.inputElement.focus();\n } else {\n super.focus();\n }\n }\n\n public select(): void {\n if (this.inputElement) {\n this.inputElement.select();\n }\n }\n\n public setSelectionRange(start: number, end: number): void {\n this.updateComplete.then(() => {\n if (this.inputElement) {\n this.inputElement.setSelectionRange(start, end);\n }\n });\n }\n\n static get styles() {\n return [\n css`\n ${unsafeCSS(style)}\n `,\n ];\n }\n\n public render(): TemplateResult {\n let inputPart;\n if (this.rows === 1) {\n inputPart = html`\n <input\n id=${this._inputId}\n class=\"input\"\n .type=${this.type}\n placeholder=${ifDefined(this.placeholder || undefined)}\n name=${ifDefined(this.name || undefined)}\n aria-disabled=${this.effectiveDisabled}\n autocomplete=${this.autocomplete}\n ?disabled=${this.inactive}\n ?readonly=${this.readonly || this.effectiveDisabled}\n ?required=${this.required}\n maxlength=${this.maxlength > 0 ? this.maxlength : SDInput.DEFAULT_MAX_LENGTH}\n aria-describedby=${this._validationMessageId}\n aria-invalid=${ifDefined(!!this.validationMessage || undefined)}\n aria-label=${ifDefined(this.sdAriaLabel || undefined)}\n />\n `;\n } else {\n inputPart = html`\n <textarea\n id=${this._inputId}\n class=\"input\"\n placeholder=${ifDefined(this.placeholder || undefined)}\n name=${ifDefined(this.name || undefined)}\n aria-disabled=${this.effectiveDisabled}\n autocomplete=${this.autocomplete}\n ?disabled=${this.inactive}\n ?readonly=${this.readonly || this.effectiveDisabled}\n ?required=${this.required}\n maxlength=${this.maxlength > 0 ? this.maxlength : SDInput.DEFAULT_MAX_LENGTH}\n rows=${this.rows}\n aria-describedby=${this._validationMessageId}\n aria-invalid=${ifDefined(!!this.validationMessage || undefined)}\n aria-label=${ifDefined(this.sdAriaLabel || undefined)}\n ></textarea>\n `;\n }\n return html`\n ${this.label ? html` <div class=\"floated-label-placeholder\" aria-hidden=\"true\">&nbsp;</div> ` : nothing}\n <div class=\"input-wrapper\">\n <span class=\"prefix\"><slot name=\"prefix\"></slot></span>\n <div class=\"input-container\" style=\"position:${this.shouldFloat() ? \"static\" : \"relative\"};\">\n ${this.label &&\n html`\n <label for=\"${this._inputId}\" class=\"label ${this.shouldFloat() ? \"float\" : \"\"}\"\n >${this.label}</label\n >\n `}\n ${inputPart}\n </div>\n <span class=\"suffix\"><slot name=\"suffix\"></slot></span>\n </div>\n <div class=\"underline\" aria-hidden=\"true\">\n <div class=\"unfocused-line\"></div>\n <div class=\"focused-line\"></div>\n </div>\n <div class=\"validation-message-wrapper\" aria-hidden=\"true\">\n ${this.validationMessage &&\n html`\n <sd-field-validation-message\n id=${this._validationMessageId}\n class=\"validation-message\"\n .message=${this.validationMessage}\n .icon=${this.validationIconSrc}\n .level=${this.validationLevel}\n >\n </sd-field-validation-message>\n `}\n </div>\n `;\n }\n\n protected updated(_changedProperties: PropertyValues): void {\n super.updated(_changedProperties);\n if (this._needsAutocompletedCheck && !this.autocompleted) {\n setTimeout(() => {\n try {\n // In certain cases there is no animation event dispatched even if the animation itself is done (it is visible also in dev tools) when an autofill is done.\n this.autocompleted = this.autocompleted || !!this.shadowRoot.querySelector(\":-webkit-autofill\");\n } catch (ignored) {\n // the above used selector is not supported for example in Firefox\n }\n }, 0);\n }\n }\n\n public update(changedProperties: PropertyValues): void {\n super.update(changedProperties);\n if (changedProperties.has(\"validationMessage\")) {\n if (this.validationMessage) {\n if (!this.validationLevel) {\n this.validationLevel = ValidationLevel.Error;\n }\n this._internals?.setValidity({ customError: true }, this.validationMessage);\n } else {\n this.validationLevel = null;\n this._internals?.setValidity({});\n }\n }\n if (this._initialized && changedProperties.has(\"rows\")) {\n throw Error(\"rows attribute cannot be changed after the input is attached to the DOM\");\n }\n }\n\n protected fireValueChange(immediate?: boolean): void {\n this.dispatchEvent(\n new CustomEvent<IValueChangeEvent>(`${immediate ? \"immediate-\" : \"\"}value-change`, {\n detail: { value: this.value },\n }),\n );\n this.setFormValue(this.value);\n }\n\n private shouldFloat() {\n return this.alwaysFloatLabel || this.currentText || this.placeholder || this.autocompleted;\n }\n\n protected setFormValue(value: string | File | FormData) {\n this._internals?.setFormValue(value);\n }\n\n protected formResetCallback() {\n this.value = this._initialValue;\n }\n\n protected formDisabledCallback(disabled: boolean) {\n this.effectiveDisabled = disabled || this.hasAttribute(\"disabled\");\n }\n\n protected formAssociatedCallback(_form: HTMLFormElement) {\n this._needsAutocompletedCheck = true;\n }\n\n protected formStateRestoreCallback(state: File | string | FormData | null, reason: unknown) {\n if (typeof state == \"string\") {\n this.value = state;\n }\n }\n}\n\nif (!customElements.get(SDInput.ID)) {\n customElements.define(SDInput.ID, SDInput);\n}\n"],"names":["TAG_NAME","delegatesFocus","idCounter","_SDInput","_a","LitElement","nextIdNumber","changedProperties","event","_b","target","listener","shadyDOM","disabled","newValue","start","end","css","unsafeCSS","style","inputPart","html","ifDefined","nothing","_changedProperties","ValidationLevel","immediate","value","_form","state","reason","__decorateClass","property","oldValue","SDInput"],"mappings":"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"}
1
+ {"version":3,"file":"input.mjs","sources":["../input.ts"],"sourcesContent":["import { LitElement, html, PropertyValues, unsafeCSS, TemplateResult, css, nothing } from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { ValidationLevel } from \"@cas-smartdesign/field-validation-message\";\n\nconst TAG_NAME = \"sd-lit-input\";\n\ndeclare global {\n interface HTMLElementTagNameMap {\n [TAG_NAME]: SDInput;\n }\n}\n\nimport style from \"./style.scss?inline\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst delegatesFocus = \"delegatesFocus\" in (window as any).ShadowRoot.prototype;\n\nlet idCounter = 0;\n\nexport interface IValueChangeEvent {\n value: string;\n}\n\nexport interface CustomEventMap extends HTMLElementEventMap {\n \"immediate-value-change\": CustomEvent<IValueChangeEvent>;\n \"value-change\": CustomEvent<IValueChangeEvent>;\n}\n\nexport default interface SDInput {\n addEventListener<K extends keyof CustomEventMap>(\n event: K,\n listener: ((this: this, ev: CustomEventMap[K]) => unknown) | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n removeEventListener<K extends keyof CustomEventMap>(\n type: K,\n listener: (this: this, ev: CustomEventMap[K]) => unknown,\n options?: boolean | EventListenerOptions,\n ): void;\n removeEventListener(\n type: string,\n listener: EventListenerOrEventListenerObject,\n options?: boolean | EventListenerOptions,\n ): void;\n dispatchEvent<EventType extends CustomEventMap[keyof CustomEventMap]>(event: EventType): boolean;\n}\n\nexport default class SDInput extends LitElement {\n public static readonly ID: string = TAG_NAME;\n private static readonly DEFAULT_MAX_LENGTH: number = 524288;\n static formAssociated = true;\n\n @property({ type: String, reflect: true })\n public label: string;\n @property({ type: String, attribute: true })\n public validationMessage: string;\n @property({ type: String, attribute: true })\n public validationIconSrc: string;\n @property({ type: ValidationLevel, attribute: true, reflect: true })\n public validationLevel: ValidationLevel;\n @property({\n type: String,\n hasChanged(value, oldValue) {\n return oldValue != undefined && oldValue != value;\n },\n })\n public currentText;\n @property({ type: Boolean, attribute: true })\n public alwaysFloatLabel: boolean;\n @property({ type: Boolean, attribute: true })\n public autocompleted: boolean;\n @property({ type: Number, attribute: true })\n public rows = 1;\n @property({ type: Boolean, reflect: true, attribute: \"effective-disabled\" })\n public effectiveDisabled: boolean = false;\n @property({ type: Boolean, reflect: true, attribute: \"extended-prefix\" })\n public extendedPrefix: boolean;\n\n // delegated settings to input\n @property({ type: String, reflect: true })\n public type = \"text\";\n @property({ type: String, reflect: true })\n public placeholder: string;\n @property({ type: String, reflect: true })\n public sdAriaLabel: string;\n @property({ type: Number, reflect: true })\n public maxlength: number;\n @property({ type: Boolean, reflect: true })\n public readonly: boolean;\n @property({ type: Boolean, reflect: true })\n public required: boolean;\n @property({ type: String, reflect: true })\n public name: string;\n @property({ type: Boolean, reflect: true })\n public inactive: boolean;\n @property({ type: String, attribute: true })\n public autocomplete: AutoFill = \"off\";\n @property({ type: String, attribute: true })\n public min: string;\n @property({ type: String, attribute: true })\n public max: string;\n @property({ type: String, attribute: true })\n public pattern: string;\n\n private _inputElement: HTMLInputElement;\n private _initialized: boolean;\n private _needsAutocompletedCheck: boolean;\n private _validationMessageId: string;\n private _inputId: string;\n private _internals: ElementInternals;\n private _initialValue: string;\n\n static shadowRootOptions: ShadowRootInit = {\n ...LitElement.shadowRootOptions,\n delegatesFocus,\n };\n\n constructor() {\n super();\n const nextIdNumber = idCounter++;\n this._validationMessageId = SDInput.ID + \"_message_\" + nextIdNumber;\n this._inputId = SDInput.ID + \"_input_\" + nextIdNumber;\n if (this.attachInternals && !this.activeShadyDOM) {\n this._internals = this.attachInternals();\n }\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n if (!this.hasAttribute(\"tabIndex\")) {\n this.tabIndex = 0;\n }\n }\n\n protected firstUpdated(changedProperties: PropertyValues): void {\n super.firstUpdated(changedProperties);\n this.initAutocompleted(this.inputElement);\n this.updateInitialValue();\n this.updateFormValidity();\n\n if (this.hasAttribute(\"disabled\")) {\n this.disabled = true;\n }\n\n this.inputElement.oninput = (event: InputEvent) => {\n this.autocompleted = \"insertReplacementText\" === event.inputType || !(\"data\" in event);\n this.currentText = this.inputElement.value;\n this.fireValueChange(true);\n };\n this.inputElement.onchange = () => this.fireValueChange();\n if (!delegatesFocus) {\n // Provide a limited \"delegatesFocus\" behavior where it is not supported.\n // Note that clicking on non-focusable elements inside the shadow root\n // does not focus the first focusable element as it would have been expected.\n this.inputElement.onfocus = () => this.setAttribute(\"focused\", \"\");\n this.inputElement.onblur = () => this.removeAttribute(\"focused\");\n this.addEventListener(\"focus\", (event) => {\n if (event.target === this) {\n this.inputElement.focus();\n }\n });\n }\n // An input with 'type: date' may not dispatch change or input events in partially filled state\n this.inputElement.addEventListener(\"keyup\", () => {\n this.updateFormValidity();\n });\n this.addEventListener(\"keydown\", (event) => {\n if (event.key == \"Enter\") {\n this._internals?.form?.requestSubmit();\n }\n });\n this._initialized = true;\n }\n\n private initAutocompleted(target: HTMLElement) {\n const listener = (event) => {\n if (/^onautofillstart(-sd-lit-input-\\d+|\\s?)$/.test(event.animationName)) {\n this.autocompleted = true;\n } else if (/^onautofillcancel(-sd-lit-input-\\d+|\\s?)$/.test(event.animationName)) {\n this.autocompleted = false;\n }\n };\n if (this.activeShadyDOM) {\n this._needsAutocompletedCheck = true;\n this.activeShadyDOM.nativeMethods.addEventListener.call(target, \"animationstart\", listener);\n } else {\n target.addEventListener(\"animationstart\", listener);\n }\n }\n\n private get activeShadyDOM(): { nativeMethods } | null {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const shadyDOM = (window as any).ShadyDOM;\n return shadyDOM && shadyDOM.inUse ? shadyDOM : null;\n }\n\n private updateInitialValue(): void {\n if (typeof this.currentText !== \"undefined\") {\n this.value = this.currentText;\n } else {\n this.value = this.getAttribute(\"value\");\n }\n if (this.value) {\n this.currentText = this.inputElement.value;\n }\n this._initialValue = this.value;\n }\n\n public get disabled(): boolean {\n return this.hasAttribute(\"disabled\");\n }\n\n public set disabled(disabled: boolean) {\n if (disabled) {\n this.setAttribute(\"disabled\", \"\");\n } else {\n this.removeAttribute(\"disabled\");\n }\n if (!this._internals) {\n this.effectiveDisabled = disabled;\n }\n }\n\n // It is public as hacking around due to IE 11 is a common task to do.\n public get inputElement(): HTMLInputElement {\n if (this.shadowRoot && !this._inputElement) {\n this._inputElement = this.shadowRoot.querySelector(\".input\");\n }\n return this._inputElement;\n }\n\n public get value(): string {\n return this.inputElement && this.inputElement.value;\n }\n\n public set value(newValue: string) {\n this.currentText = newValue || \"\";\n if (this.inputElement) {\n this.inputElement.value = this.currentText;\n }\n this.setFormValue(this.currentText);\n }\n\n public get selectionStart(): number {\n return this.inputElement ? this.inputElement.selectionStart : 0;\n }\n\n public focus(): void {\n if (this.inputElement) {\n this.inputElement.focus();\n } else {\n super.focus();\n }\n }\n\n public select(): void {\n if (this.inputElement) {\n this.inputElement.select();\n }\n }\n\n public setSelectionRange(start: number, end: number): void {\n this.updateComplete.then(() => {\n if (this.inputElement) {\n this.inputElement.setSelectionRange(start, end);\n }\n });\n }\n\n static get styles() {\n return [\n css`\n ${unsafeCSS(style)}\n `,\n ];\n }\n\n public render(): TemplateResult {\n let inputPart;\n const valMessage = this.validationMessage || this.inputElement?.validationMessage;\n if (this.rows === 1) {\n inputPart = html`\n <input\n id=${this._inputId}\n class=\"input\"\n .type=${this.type}\n placeholder=${ifDefined(this.placeholder || undefined)}\n name=${ifDefined(this.name || undefined)}\n aria-disabled=${this.effectiveDisabled}\n autocomplete=${this.autocomplete}\n ?disabled=${this.inactive}\n ?readonly=${this.readonly || this.effectiveDisabled}\n ?required=${this.required}\n maxlength=${this.maxlength > 0 ? this.maxlength : SDInput.DEFAULT_MAX_LENGTH}\n aria-describedby=${this._validationMessageId}\n aria-invalid=${ifDefined(!!valMessage || undefined)}\n aria-label=${ifDefined(this.sdAriaLabel || undefined)}\n min=${ifDefined(this.min || undefined)}\n max=${ifDefined(this.max || undefined)}\n pattern=${ifDefined(this.pattern || undefined)}\n />\n `;\n } else {\n inputPart = html`\n <textarea\n id=${this._inputId}\n class=\"input\"\n placeholder=${ifDefined(this.placeholder || undefined)}\n name=${ifDefined(this.name || undefined)}\n aria-disabled=${this.effectiveDisabled}\n autocomplete=${this.autocomplete}\n ?disabled=${this.inactive}\n ?readonly=${this.readonly || this.effectiveDisabled}\n ?required=${this.required}\n maxlength=${this.maxlength > 0 ? this.maxlength : SDInput.DEFAULT_MAX_LENGTH}\n rows=${this.rows}\n aria-describedby=${this._validationMessageId}\n aria-invalid=${ifDefined(!!valMessage || undefined)}\n aria-label=${ifDefined(this.sdAriaLabel || undefined)}\n ></textarea>\n `;\n }\n\n return html`\n ${this.label ? html` <div class=\"floated-label-placeholder\" aria-hidden=\"true\">&nbsp;</div> ` : nothing}\n <div class=\"input-wrapper\">\n <span class=\"prefix\"><slot name=\"prefix\"></slot></span>\n <div class=\"input-container\" style=\"position:${this.shouldFloat() ? \"static\" : \"relative\"};\">\n ${this.label &&\n html`\n <label for=\"${this._inputId}\" class=\"label ${this.shouldFloat() ? \"float\" : \"\"}\"\n >${this.label}</label\n >\n `}\n ${inputPart}\n </div>\n <span class=\"suffix\"><slot name=\"suffix\"></slot></span>\n </div>\n <div class=\"underline\" aria-hidden=\"true\">\n <div class=\"unfocused-line\"></div>\n <div class=\"focused-line\"></div>\n </div>\n <div class=\"validation-message-wrapper\" aria-hidden=\"true\">\n ${valMessage &&\n html`\n <sd-field-validation-message\n id=${this._validationMessageId}\n class=\"validation-message\"\n .message=${valMessage}\n .icon=${this.validationIconSrc}\n .level=${this.validationLevel}\n >\n </sd-field-validation-message>\n `}\n </div>\n `;\n }\n\n protected updated(changedProperties: PropertyValues): void {\n super.updated(changedProperties);\n if (this._needsAutocompletedCheck && !this.autocompleted) {\n setTimeout(() => {\n try {\n // In certain cases there is no animation event dispatched even if the animation itself is done (it is visible also in dev tools) when an autofill is done.\n this.autocompleted = this.autocompleted || !!this.shadowRoot.querySelector(\":-webkit-autofill\");\n } catch (ignored) {\n // the above used selector is not supported for example in Firefox\n }\n }, 0);\n }\n if (this.rows > 1) {\n if (changedProperties.has(\"min\") || changedProperties.has(\"max\") || changedProperties.has(\"pattern\")) {\n console.warn(\"min, max & pattern attributes are not supported with multiple rows configuration.\");\n }\n if (\"text\" != this.type) {\n console.warn(`type: ${this.type} is not supported with multiple rows configuration.`);\n }\n }\n }\n\n public update(changedProperties: PropertyValues): void {\n super.update(changedProperties);\n if (changedProperties.has(\"validationMessage\")) {\n if (this.validationMessage) {\n if (!this.validationLevel) {\n this.validationLevel = ValidationLevel.Error;\n }\n this._internals?.setValidity({ customError: true }, this.validationMessage);\n } else {\n this.validationLevel = null;\n this._internals?.setValidity(this.inputElement.validity, this.inputElement.validationMessage);\n }\n }\n if (this._initialized && changedProperties.has(\"rows\")) {\n throw Error(\"rows attribute cannot be changed after the input is attached to the DOM\");\n }\n }\n\n protected fireValueChange(immediate?: boolean): void {\n this.dispatchEvent(\n new CustomEvent<IValueChangeEvent>(`${immediate ? \"immediate-\" : \"\"}value-change`, {\n detail: { value: this.value },\n }),\n );\n this.setFormValue(this.value);\n this.updateFormValidity();\n }\n\n private updateFormValidity() {\n if (this.validationMessage == null) {\n this._internals.setValidity(this.inputElement.validity, this.inputElement.validationMessage);\n const valMessageEl = this.shadowRoot.querySelector(\"sd-field-validation-message\");\n this.requestUpdate(\"validationMessage\", valMessageEl == null ? null : valMessageEl.message);\n }\n }\n\n private shouldFloat() {\n return (\n this.alwaysFloatLabel || this.currentText || this.placeholder || this.autocompleted || this.type === \"date\"\n );\n }\n\n protected setFormValue(value: string | File | FormData) {\n this._internals?.setFormValue(value);\n }\n\n protected formResetCallback() {\n this.value = this._initialValue;\n }\n\n protected formDisabledCallback(disabled: boolean) {\n this.effectiveDisabled = disabled || this.hasAttribute(\"disabled\");\n }\n\n protected formAssociatedCallback(_form: HTMLFormElement) {\n this._needsAutocompletedCheck = true;\n }\n\n protected formStateRestoreCallback(state: File | string | FormData | null, reason: unknown) {\n if (typeof state == \"string\") {\n this.value = state;\n }\n }\n}\n\nif (!customElements.get(SDInput.ID)) {\n customElements.define(SDInput.ID, SDInput);\n}\n"],"names":["TAG_NAME","delegatesFocus","idCounter","_SDInput","_a","LitElement","nextIdNumber","changedProperties","event","_b","target","listener","shadyDOM","disabled","newValue","start","end","css","unsafeCSS","style","inputPart","valMessage","html","ifDefined","nothing","ValidationLevel","immediate","valMessageEl","value","_form","state","reason","__decorateClass","property","oldValue","SDInput"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cas-smartdesign/lit-input",
3
- "version": "7.1.5",
3
+ "version": "7.2.1",
4
4
  "description": "An input element based on LitElement & material components",
5
5
  "main": "dist/input-with-externals.js",
6
6
  "module": "dist/input.mjs",
@@ -11,9 +11,9 @@
11
11
  "@cas-smartdesign/field-validation-message": "^5.0.2"
12
12
  },
13
13
  "devDependencies": {
14
- "@cas-smartdesign/styles": "^3.6.2",
14
+ "@cas-smartdesign/element-preview": "^0.2.2",
15
15
  "@cas-smartdesign/license-generator": "^1.6.3",
16
- "@cas-smartdesign/element-preview": "^0.2.2"
16
+ "@cas-smartdesign/styles": "^3.6.2"
17
17
  },
18
18
  "files": [
19
19
  "dist",