@nuralyui/input 0.0.6 → 0.0.8
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.
- package/input.component.d.ts +29 -11
- package/input.component.d.ts.map +1 -1
- package/input.component.js +181 -89
- package/input.component.js.map +1 -1
- package/input.style.d.ts.map +1 -1
- package/input.style.js +128 -11
- package/input.style.js.map +1 -1
- package/input.style.variable.d.ts.map +1 -1
- package/input.style.variable.js +53 -0
- package/input.style.variable.js.map +1 -1
- package/input.types.d.ts +20 -0
- package/input.types.d.ts.map +1 -1
- package/input.types.js.map +1 -1
- package/mixins/focus-mixin.d.ts +60 -0
- package/mixins/focus-mixin.d.ts.map +1 -0
- package/mixins/focus-mixin.js +65 -0
- package/mixins/focus-mixin.js.map +1 -0
- package/mixins/index.d.ts +9 -0
- package/mixins/index.d.ts.map +1 -0
- package/mixins/index.js +9 -0
- package/mixins/index.js.map +1 -0
- package/mixins/number-mixin.d.ts +51 -0
- package/mixins/number-mixin.d.ts.map +1 -0
- package/mixins/number-mixin.js +131 -0
- package/mixins/number-mixin.js.map +1 -0
- package/mixins/selection-mixin.d.ts +57 -0
- package/mixins/selection-mixin.d.ts.map +1 -0
- package/mixins/selection-mixin.js +80 -0
- package/mixins/selection-mixin.js.map +1 -0
- package/package.json +1 -1
- package/utils/input-renderers.d.ts +4 -0
- package/utils/input-renderers.d.ts.map +1 -1
- package/utils/input-renderers.js +17 -0
- package/utils/input-renderers.js.map +1 -1
package/input.component.d.ts
CHANGED
|
@@ -1,18 +1,19 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
|
-
* Copyright 2023
|
|
3
|
+
* Copyright 2023 Nuraly, Laabidi Aymen
|
|
4
4
|
* SPDX-License-Identifier: MIT
|
|
5
5
|
*/
|
|
6
6
|
import { LitElement, PropertyValues } from 'lit';
|
|
7
|
-
import { INPUT_TYPE, INPUT_STATE, INPUT_SIZE } from './input.types.js';
|
|
8
|
-
import
|
|
9
|
-
declare
|
|
10
|
-
|
|
7
|
+
import { INPUT_TYPE, INPUT_STATE, INPUT_SIZE, INPUT_VARIANT } from './input.types.js';
|
|
8
|
+
declare const InputBaseMixin: (new (...args: any[]) => import("./mixins/number-mixin.js").NumberCapable) & (new (...args: any[]) => import("./mixins/focus-mixin.js").FocusCapable) & (new (...args: any[]) => import("./mixins/selection-mixin.js").SelectionCapable) & (new (...args: any[]) => import("../../shared/dependency-mixin.js").DependencyAware) & (new (...args: any[]) => import("../../shared/theme-mixin.js").ThemeAware) & (new (...args: any[]) => import("../../shared/event-handler-mixin.js").EventHandlerCapable) & typeof LitElement;
|
|
9
|
+
export declare class NrInputElement extends InputBaseMixin {
|
|
10
|
+
static styles: import("lit").CSSResult[];
|
|
11
11
|
disabled: boolean;
|
|
12
12
|
readonly: boolean;
|
|
13
13
|
state: INPUT_STATE;
|
|
14
14
|
value: string;
|
|
15
15
|
size: INPUT_SIZE;
|
|
16
|
+
variant: INPUT_VARIANT;
|
|
16
17
|
type: INPUT_TYPE;
|
|
17
18
|
step?: string;
|
|
18
19
|
min?: string;
|
|
@@ -20,10 +21,30 @@ export declare class NrInputElement extends NrInputElement_base {
|
|
|
20
21
|
placeholder: string;
|
|
21
22
|
autocomplete: string;
|
|
22
23
|
withCopy: boolean;
|
|
24
|
+
allowClear: boolean;
|
|
25
|
+
showCount: boolean;
|
|
26
|
+
maxLength?: number;
|
|
23
27
|
inputType: string;
|
|
24
28
|
hasAddonBefore: boolean;
|
|
25
29
|
hasAddonAfter: boolean;
|
|
26
|
-
|
|
30
|
+
focused: boolean;
|
|
31
|
+
private get _input();
|
|
32
|
+
/**
|
|
33
|
+
* Get the character count display text
|
|
34
|
+
*/
|
|
35
|
+
get characterCountDisplay(): string;
|
|
36
|
+
/**
|
|
37
|
+
* Check if character count is over the limit
|
|
38
|
+
*/
|
|
39
|
+
get isOverCharacterLimit(): boolean;
|
|
40
|
+
/**
|
|
41
|
+
* Get the input element
|
|
42
|
+
*/
|
|
43
|
+
protected get input(): HTMLInputElement;
|
|
44
|
+
/**
|
|
45
|
+
* Override inputElement getter from mixins to use our @query property
|
|
46
|
+
*/
|
|
47
|
+
protected get inputElement(): HTMLInputElement;
|
|
27
48
|
/**
|
|
28
49
|
* Required components that must be registered for this component to work properly
|
|
29
50
|
*/
|
|
@@ -43,21 +64,18 @@ export declare class NrInputElement extends NrInputElement_base {
|
|
|
43
64
|
* Handle slot changes to determine addon visibility
|
|
44
65
|
*/
|
|
45
66
|
private _handleSlotChange;
|
|
46
|
-
/**
|
|
47
|
-
* Centralized event dispatcher to ensure consistent event structure
|
|
48
|
-
*/
|
|
49
|
-
private _dispatchInputEvent;
|
|
50
67
|
private _handleKeyDown;
|
|
51
68
|
private _valueChange;
|
|
52
69
|
private _focusEvent;
|
|
70
|
+
private _blurEvent;
|
|
53
71
|
private _handleIconKeydown;
|
|
54
72
|
private _onCopy;
|
|
73
|
+
private _onClear;
|
|
55
74
|
private _increment;
|
|
56
75
|
private _decrement;
|
|
57
76
|
private _togglePasswordIcon;
|
|
58
77
|
private _getAriaDescribedBy;
|
|
59
78
|
render(): import("lit").TemplateResult<1>;
|
|
60
|
-
static styles: import("lit").CSSResult[];
|
|
61
79
|
}
|
|
62
80
|
export {};
|
|
63
81
|
//# sourceMappingURL=input.component.d.ts.map
|
package/input.component.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input.component.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.component.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"input.component.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.component.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,UAAU,EAAE,cAAc,EAAQ,MAAM,KAAK,CAAC;AAGvD,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,UAAU,EAAE,aAAa,EAAkC,MAAM,kBAAkB,CAAC;AAKtH,QAAA,MAAM,cAAc,ggBAAyE,CAAC;AAC9F,qBACa,cAAe,SAAQ,cAAc;IAChD,OAAgB,MAAM,4BAAU;IAOhC,QAAQ,UAAS;IAGjB,QAAQ,UAAS;IAGjB,KAAK,cAAuB;IAG5B,KAAK,SAAgB;IAGrB,IAAI,aAAqB;IAGzB,OAAO,gBAA4B;IAGnC,IAAI,aAAmB;IAGvB,IAAI,CAAC,EAAE,MAAM,CAAC;IAGd,GAAG,CAAC,EAAE,MAAM,CAAC;IAGb,GAAG,CAAC,EAAE,MAAM,CAAC;IAGb,WAAW,SAAgB;IAG3B,YAAY,SAAS;IAGrB,QAAQ,UAAS;IAGjB,UAAU,UAAS;IAGnB,SAAS,UAAS;IAGlB,SAAS,CAAC,EAAE,MAAM,CAAC;IAOnB,SAAS,SAAgB;IAGzB,cAAc,UAAS;IAGvB,aAAa,UAAS;IAGtB,OAAO,UAAS;IAGhB,OAAO,KAAK,MAAM,GAEjB;IAMD;;OAEG;IACH,IAAI,qBAAqB,IAAI,MAAM,CAMlC;IAED;;OAEG;IACH,IAAI,oBAAoB,IAAI,OAAO,CAElC;IAMD;;OAEG;IACH,SAAS,KAAK,KAAK,IAAI,gBAAgB,CAEtC;IAED;;OAEG;IACH,SAAS,KAAK,YAAY,IAAI,gBAAgB,CAE7C;IAMD;;OAEG;IACM,kBAAkB,WAAe;IAE1C;;OAEG;IACM,iBAAiB;IAIjB,UAAU,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAwBpD,OAAO,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAkBjD,YAAY,IAAI,IAAI;IAQ7B;;OAEG;IACH,OAAO,CAAC,wBAAwB;IAUhC;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAuBzB,OAAO,CAAC,cAAc;IAgCtB,OAAO,CAAC,YAAY;IA8CpB,OAAO,CAAC,WAAW;IA0BnB,OAAO,CAAC,UAAU;IAkBlB,OAAO,CAAC,kBAAkB;YAqBZ,OAAO;IAerB,OAAO,CAAC,QAAQ;IAgChB,OAAO,CAAC,UAAU;IAIlB,OAAO,CAAC,UAAU;IAIlB,OAAO,CAAC,mBAAmB;IAQ3B,OAAO,CAAC,mBAAmB;IAelB,MAAM;CAoEhB"}
|
package/input.component.js
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
2
1
|
/**
|
|
3
2
|
* @license
|
|
4
|
-
* Copyright 2023
|
|
3
|
+
* Copyright 2023 Nuraly, Laabidi Aymen
|
|
5
4
|
* SPDX-License-Identifier: MIT
|
|
6
5
|
*/
|
|
7
6
|
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
@@ -20,44 +19,99 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
20
19
|
});
|
|
21
20
|
};
|
|
22
21
|
import { LitElement, html } from 'lit';
|
|
23
|
-
import { customElement, property,
|
|
22
|
+
import { customElement, property, state } from 'lit/decorators.js';
|
|
24
23
|
import { styles } from './input.style.js';
|
|
25
24
|
import { EMPTY_STRING } from './input.types.js';
|
|
26
25
|
import { NuralyUIBaseMixin } from '../../shared/base-mixin.js';
|
|
27
|
-
import { InputValidationUtils } from './utils/
|
|
28
|
-
import {
|
|
29
|
-
|
|
30
|
-
let NrInputElement = class NrInputElement extends
|
|
26
|
+
import { InputValidationUtils, InputRenderUtils } from './utils/index.js';
|
|
27
|
+
import { SelectionMixin, FocusMixin, NumberMixin } from './mixins/index.js';
|
|
28
|
+
const InputBaseMixin = NumberMixin(FocusMixin(SelectionMixin(NuralyUIBaseMixin(LitElement))));
|
|
29
|
+
let NrInputElement = class NrInputElement extends InputBaseMixin {
|
|
31
30
|
constructor() {
|
|
32
31
|
super(...arguments);
|
|
32
|
+
// ========================================
|
|
33
|
+
// PROPERTIES
|
|
34
|
+
// ========================================
|
|
33
35
|
this.disabled = false;
|
|
34
36
|
this.readonly = false;
|
|
35
37
|
this.state = "default" /* INPUT_STATE.Default */;
|
|
36
38
|
this.value = EMPTY_STRING;
|
|
37
39
|
this.size = "medium" /* INPUT_SIZE.Medium */;
|
|
40
|
+
this.variant = "underlined" /* INPUT_VARIANT.Underlined */;
|
|
38
41
|
this.type = "text" /* INPUT_TYPE.TEXT */;
|
|
39
42
|
this.placeholder = EMPTY_STRING;
|
|
40
43
|
this.autocomplete = 'off';
|
|
41
44
|
this.withCopy = false;
|
|
45
|
+
this.allowClear = false;
|
|
46
|
+
this.showCount = false;
|
|
47
|
+
// ========================================
|
|
48
|
+
// STATE
|
|
49
|
+
// ========================================
|
|
42
50
|
this.inputType = EMPTY_STRING;
|
|
43
51
|
this.hasAddonBefore = false;
|
|
44
52
|
this.hasAddonAfter = false;
|
|
53
|
+
this.focused = false;
|
|
54
|
+
// ========================================
|
|
55
|
+
// LIFECYCLE METHODS
|
|
56
|
+
// ========================================
|
|
45
57
|
/**
|
|
46
58
|
* Required components that must be registered for this component to work properly
|
|
47
59
|
*/
|
|
48
|
-
this.requiredComponents = ['
|
|
60
|
+
this.requiredComponents = ['nr-icon'];
|
|
61
|
+
}
|
|
62
|
+
// Use manual query instead of @query decorator to avoid TypeScript mixin issues
|
|
63
|
+
get _input() {
|
|
64
|
+
return this.shadowRoot.querySelector('#input');
|
|
65
|
+
}
|
|
66
|
+
// ========================================
|
|
67
|
+
// COMPUTED PROPERTIES
|
|
68
|
+
// ========================================
|
|
69
|
+
/**
|
|
70
|
+
* Get the character count display text
|
|
71
|
+
*/
|
|
72
|
+
get characterCountDisplay() {
|
|
73
|
+
const currentLength = this.value.length;
|
|
74
|
+
if (this.maxLength) {
|
|
75
|
+
return `${currentLength}/${this.maxLength}`;
|
|
76
|
+
}
|
|
77
|
+
return `${currentLength}`;
|
|
78
|
+
}
|
|
79
|
+
/**
|
|
80
|
+
* Check if character count is over the limit
|
|
81
|
+
*/
|
|
82
|
+
get isOverCharacterLimit() {
|
|
83
|
+
return this.maxLength ? this.value.length > this.maxLength : false;
|
|
84
|
+
}
|
|
85
|
+
// ========================================
|
|
86
|
+
// COMPUTED PROPERTIES
|
|
87
|
+
// ========================================
|
|
88
|
+
/**
|
|
89
|
+
* Get the input element
|
|
90
|
+
*/
|
|
91
|
+
get input() {
|
|
92
|
+
return this._input;
|
|
93
|
+
}
|
|
94
|
+
/**
|
|
95
|
+
* Override inputElement getter from mixins to use our @query property
|
|
96
|
+
*/
|
|
97
|
+
get inputElement() {
|
|
98
|
+
return this._input;
|
|
49
99
|
}
|
|
50
100
|
/**
|
|
51
101
|
* Check for required dependencies when component is connected to DOM
|
|
52
102
|
*/
|
|
53
103
|
connectedCallback() {
|
|
54
104
|
super.connectedCallback();
|
|
55
|
-
this.validateDependencies();
|
|
56
105
|
}
|
|
57
106
|
willUpdate(_changedProperties) {
|
|
58
|
-
|
|
107
|
+
super.willUpdate(_changedProperties);
|
|
108
|
+
// Initialize inputType when type changes or on first render
|
|
109
|
+
if (_changedProperties.has('type') || !this.inputType) {
|
|
59
110
|
this.inputType = this.type;
|
|
60
|
-
|
|
111
|
+
}
|
|
112
|
+
// Set default value for number inputs with min
|
|
113
|
+
if (_changedProperties.has('type') || _changedProperties.has('min')) {
|
|
114
|
+
if (this.type === "number" /* INPUT_TYPE.NUMBER */ && this.min && !this.value) {
|
|
61
115
|
this.value = this.min;
|
|
62
116
|
}
|
|
63
117
|
}
|
|
@@ -70,13 +124,10 @@ let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement)
|
|
|
70
124
|
}
|
|
71
125
|
}
|
|
72
126
|
updated(_changedProperties) {
|
|
73
|
-
if (_changedProperties.has('step') || _changedProperties.has('min') || _changedProperties.has('max')) {
|
|
127
|
+
if (_changedProperties.has('step') || _changedProperties.has('min') || _changedProperties.has('max') || _changedProperties.has('maxLength')) {
|
|
74
128
|
const input = this.input;
|
|
75
129
|
if (input) {
|
|
76
|
-
|
|
77
|
-
input.setAttribute('step', this.step);
|
|
78
|
-
else
|
|
79
|
-
input.removeAttribute('step');
|
|
130
|
+
this.setStep(this.step);
|
|
80
131
|
if (this.min)
|
|
81
132
|
input.setAttribute('min', this.min);
|
|
82
133
|
else
|
|
@@ -85,12 +136,19 @@ let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement)
|
|
|
85
136
|
input.setAttribute('max', this.max);
|
|
86
137
|
else
|
|
87
138
|
input.removeAttribute('max');
|
|
139
|
+
if (this.maxLength)
|
|
140
|
+
input.setAttribute('maxlength', this.maxLength.toString());
|
|
141
|
+
else
|
|
142
|
+
input.removeAttribute('maxlength');
|
|
88
143
|
}
|
|
89
144
|
}
|
|
90
145
|
}
|
|
91
146
|
firstUpdated() {
|
|
92
147
|
this._checkInitialSlotContent();
|
|
93
148
|
}
|
|
149
|
+
// ========================================
|
|
150
|
+
// PRIVATE METHODS
|
|
151
|
+
// ========================================
|
|
94
152
|
/**
|
|
95
153
|
* Check initial slot content on first render
|
|
96
154
|
*/
|
|
@@ -116,38 +174,22 @@ let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement)
|
|
|
116
174
|
}
|
|
117
175
|
}
|
|
118
176
|
// ========================================
|
|
177
|
+
// FOCUS MANAGEMENT METHODS
|
|
178
|
+
// ========================================
|
|
179
|
+
// Focus methods are provided by InputMixin
|
|
180
|
+
// ========================================
|
|
119
181
|
// EVENT HANDLING METHODS
|
|
120
182
|
// ========================================
|
|
121
|
-
|
|
122
|
-
* Centralized event dispatcher to ensure consistent event structure
|
|
123
|
-
*/
|
|
124
|
-
_dispatchInputEvent(eventName, detail) {
|
|
125
|
-
this.dispatchEvent(new CustomEvent(eventName, {
|
|
126
|
-
detail,
|
|
127
|
-
bubbles: true
|
|
128
|
-
}));
|
|
129
|
-
}
|
|
183
|
+
// Event handling methods moved to EventHandlerMixin
|
|
130
184
|
_handleKeyDown(keyDownEvent) {
|
|
131
|
-
// Prevent all key input when readonly
|
|
132
|
-
if (this.readonly) {
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
'Home', 'End', 'PageUp', 'PageDown'
|
|
136
|
-
];
|
|
137
|
-
if (keyDownEvent.ctrlKey || keyDownEvent.metaKey) {
|
|
138
|
-
const allowedCombinations = ['KeyA', 'KeyC'];
|
|
139
|
-
if (allowedCombinations.includes(keyDownEvent.code)) {
|
|
140
|
-
return;
|
|
141
|
-
}
|
|
142
|
-
}
|
|
143
|
-
if (!allowedReadonlyKeys.includes(keyDownEvent.key)) {
|
|
144
|
-
keyDownEvent.preventDefault();
|
|
145
|
-
return;
|
|
146
|
-
}
|
|
185
|
+
// Prevent all key input when readonly - use mixin utility
|
|
186
|
+
if (this.readonly && !this.isReadonlyKeyAllowed(keyDownEvent)) {
|
|
187
|
+
keyDownEvent.preventDefault();
|
|
188
|
+
return;
|
|
147
189
|
}
|
|
148
190
|
// Handle Enter key
|
|
149
191
|
if (keyDownEvent.key === 'Enter') {
|
|
150
|
-
this.
|
|
192
|
+
this.dispatchCustomEvent('nr-enter', {
|
|
151
193
|
target: keyDownEvent.target,
|
|
152
194
|
value: this.value,
|
|
153
195
|
originalEvent: keyDownEvent
|
|
@@ -158,7 +200,7 @@ let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement)
|
|
|
158
200
|
if (this.type === "number" /* INPUT_TYPE.NUMBER */) {
|
|
159
201
|
InputValidationUtils.preventNonNumericInput(keyDownEvent, this.min);
|
|
160
202
|
if (keyDownEvent.defaultPrevented) {
|
|
161
|
-
this.
|
|
203
|
+
this.dispatchCustomEvent('nr-invalid-key', {
|
|
162
204
|
key: keyDownEvent.key,
|
|
163
205
|
target: keyDownEvent.target,
|
|
164
206
|
value: this.value,
|
|
@@ -174,40 +216,77 @@ let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement)
|
|
|
174
216
|
}
|
|
175
217
|
const target = e.target;
|
|
176
218
|
const newValue = target.value;
|
|
219
|
+
// Check character limit
|
|
220
|
+
if (this.maxLength && newValue.length > this.maxLength) {
|
|
221
|
+
this.dispatchCustomEvent('nr-character-limit-exceeded', {
|
|
222
|
+
value: newValue,
|
|
223
|
+
target: target,
|
|
224
|
+
limit: this.maxLength,
|
|
225
|
+
originalEvent: e
|
|
226
|
+
});
|
|
227
|
+
// Note: HTML maxlength attribute usually prevents this, but we dispatch event for awareness
|
|
228
|
+
}
|
|
177
229
|
if (this.type === "number" /* INPUT_TYPE.NUMBER */ && newValue) {
|
|
178
230
|
const validation = InputValidationUtils.validateNumericValue(newValue, this.min, this.max);
|
|
179
231
|
if (!validation.isValid) {
|
|
180
232
|
console.warn(validation.warnings[0]);
|
|
181
|
-
this.
|
|
233
|
+
this.dispatchValidationEvent('nr-validation-error', {
|
|
182
234
|
value: newValue,
|
|
183
235
|
target: target,
|
|
184
236
|
error: validation.warnings[0],
|
|
185
|
-
originalEvent: e
|
|
237
|
+
originalEvent: e,
|
|
238
|
+
isValid: false
|
|
186
239
|
});
|
|
187
240
|
return;
|
|
188
241
|
}
|
|
189
242
|
validation.warnings.forEach(warning => console.warn(warning));
|
|
190
243
|
}
|
|
191
244
|
this.value = newValue;
|
|
192
|
-
this.
|
|
245
|
+
this.dispatchInputEvent('nr-input', {
|
|
193
246
|
value: this.value,
|
|
194
247
|
target: target,
|
|
195
248
|
originalEvent: e
|
|
196
249
|
});
|
|
197
250
|
}
|
|
198
251
|
_focusEvent(e) {
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
252
|
+
var _a;
|
|
253
|
+
this.focused = true;
|
|
254
|
+
// Handle cursor restoration if requested
|
|
255
|
+
const input = e.target;
|
|
256
|
+
if (input.dataset.restoreCursor) {
|
|
257
|
+
const position = parseInt(input.dataset.restoreCursor, 10);
|
|
258
|
+
this.setCursorPosition(position);
|
|
259
|
+
delete input.dataset.restoreCursor;
|
|
260
|
+
}
|
|
261
|
+
const focusDetail = {
|
|
262
|
+
focused: true,
|
|
263
|
+
cursorPosition: (_a = this.getCursorPosition()) !== null && _a !== void 0 ? _a : undefined,
|
|
264
|
+
selectedText: this.getSelectedText()
|
|
265
|
+
};
|
|
266
|
+
this.dispatchFocusEvent('nr-focus', Object.assign({ target: e.target, value: this.value }, focusDetail));
|
|
267
|
+
this.dispatchFocusEvent('nr-focus-change', focusDetail);
|
|
268
|
+
}
|
|
269
|
+
_blurEvent(e) {
|
|
270
|
+
var _a;
|
|
271
|
+
this.focused = false;
|
|
272
|
+
const focusDetail = {
|
|
273
|
+
focused: false,
|
|
274
|
+
cursorPosition: (_a = this.getCursorPosition()) !== null && _a !== void 0 ? _a : undefined,
|
|
275
|
+
selectedText: this.getSelectedText()
|
|
276
|
+
};
|
|
277
|
+
this.dispatchFocusEvent('nr-blur', Object.assign({ target: e.target, value: this.value }, focusDetail));
|
|
278
|
+
this.dispatchFocusEvent('nr-focus-change', focusDetail);
|
|
203
279
|
}
|
|
204
280
|
_handleIconKeydown(keyDownEvent) {
|
|
205
|
-
if (
|
|
281
|
+
if (this.isActivationKey(keyDownEvent)) {
|
|
206
282
|
keyDownEvent.preventDefault();
|
|
207
283
|
const target = keyDownEvent.target;
|
|
208
284
|
if (target.id === 'copy-icon') {
|
|
209
285
|
this._onCopy();
|
|
210
286
|
}
|
|
287
|
+
else if (target.id === 'clear-icon') {
|
|
288
|
+
this._onClear();
|
|
289
|
+
}
|
|
211
290
|
else if (target.id === 'password-icon') {
|
|
212
291
|
this._togglePasswordIcon();
|
|
213
292
|
}
|
|
@@ -227,53 +306,47 @@ let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement)
|
|
|
227
306
|
const input = this.shadowRoot.getElementById('input');
|
|
228
307
|
input.select();
|
|
229
308
|
yield navigator.clipboard.writeText(input.value);
|
|
230
|
-
this.
|
|
309
|
+
this.dispatchActionEvent('nr-copy-success', {
|
|
310
|
+
value: input.value,
|
|
311
|
+
action: 'copy'
|
|
312
|
+
});
|
|
231
313
|
}
|
|
232
314
|
catch (error) {
|
|
233
|
-
this.
|
|
315
|
+
this.dispatchCustomEvent('nr-copy-error', { error });
|
|
234
316
|
}
|
|
235
317
|
});
|
|
236
318
|
}
|
|
319
|
+
_onClear() {
|
|
320
|
+
if (this.disabled || this.readonly) {
|
|
321
|
+
return;
|
|
322
|
+
}
|
|
323
|
+
const previousValue = this.value;
|
|
324
|
+
this.value = EMPTY_STRING;
|
|
325
|
+
// Update the input element value
|
|
326
|
+
if (this.input) {
|
|
327
|
+
this.input.value = EMPTY_STRING;
|
|
328
|
+
}
|
|
329
|
+
this.dispatchActionEvent('nr-clear', {
|
|
330
|
+
previousValue,
|
|
331
|
+
newValue: this.value,
|
|
332
|
+
target: this.input,
|
|
333
|
+
action: 'clear'
|
|
334
|
+
});
|
|
335
|
+
// Also dispatch input event for consistency
|
|
336
|
+
this.dispatchInputEvent('nr-input', {
|
|
337
|
+
value: this.value,
|
|
338
|
+
target: this.input,
|
|
339
|
+
action: 'clear'
|
|
340
|
+
});
|
|
341
|
+
}
|
|
237
342
|
// ========================================
|
|
238
343
|
// OPERATION METHODS
|
|
239
344
|
// ========================================
|
|
240
345
|
_increment() {
|
|
241
|
-
|
|
242
|
-
this.input.stepUp();
|
|
243
|
-
this.value = this.input.value;
|
|
244
|
-
this._dispatchInputEvent('nr-input', {
|
|
245
|
-
value: this.value,
|
|
246
|
-
target: this.input,
|
|
247
|
-
action: 'increment'
|
|
248
|
-
});
|
|
249
|
-
}
|
|
250
|
-
catch (error) {
|
|
251
|
-
console.warn('Failed to increment value:', error);
|
|
252
|
-
this._dispatchInputEvent('nr-increment-error', {
|
|
253
|
-
error,
|
|
254
|
-
value: this.value,
|
|
255
|
-
target: this.input
|
|
256
|
-
});
|
|
257
|
-
}
|
|
346
|
+
this.increment();
|
|
258
347
|
}
|
|
259
348
|
_decrement() {
|
|
260
|
-
|
|
261
|
-
this.input.stepDown();
|
|
262
|
-
this.value = this.input.value;
|
|
263
|
-
this._dispatchInputEvent('nr-input', {
|
|
264
|
-
value: this.value,
|
|
265
|
-
target: this.input,
|
|
266
|
-
action: 'decrement'
|
|
267
|
-
});
|
|
268
|
-
}
|
|
269
|
-
catch (error) {
|
|
270
|
-
console.warn('Failed to decrement value:', error);
|
|
271
|
-
this._dispatchInputEvent('nr-decrement-error', {
|
|
272
|
-
error,
|
|
273
|
-
value: this.value,
|
|
274
|
-
target: this.input
|
|
275
|
-
});
|
|
276
|
-
}
|
|
349
|
+
this.decrement();
|
|
277
350
|
}
|
|
278
351
|
_togglePasswordIcon() {
|
|
279
352
|
if (this.inputType === "password" /* INPUT_TYPE.PASSWORD */) {
|
|
@@ -314,10 +387,12 @@ let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement)
|
|
|
314
387
|
aria-describedby=${this._getAriaDescribedBy()}
|
|
315
388
|
@input=${this._valueChange}
|
|
316
389
|
@focus=${this._focusEvent}
|
|
390
|
+
@blur=${this._blurEvent}
|
|
317
391
|
@keydown=${this._handleKeyDown}
|
|
318
392
|
/>
|
|
319
393
|
${InputRenderUtils.renderSuffix()}
|
|
320
394
|
${InputRenderUtils.renderCopyIcon(this.withCopy, this.disabled, this.readonly, () => this._onCopy(), (e) => this._handleIconKeydown(e))}
|
|
395
|
+
${InputRenderUtils.renderClearIcon(this.allowClear, this.value, this.disabled, this.readonly, () => this._onClear(), (e) => this._handleIconKeydown(e))}
|
|
321
396
|
${InputRenderUtils.renderStateIcon(this.state)}
|
|
322
397
|
${InputRenderUtils.renderCalendarIcon(this.state, this.type)}
|
|
323
398
|
${InputRenderUtils.renderPasswordIcon(this.type, this.inputType, this.disabled, this.readonly, () => this._togglePasswordIcon(), (e) => this._handleIconKeydown(e))}
|
|
@@ -326,6 +401,11 @@ let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement)
|
|
|
326
401
|
${InputRenderUtils.renderAddonAfter(this.hasAddonAfter, (e) => this._handleSlotChange(e))}
|
|
327
402
|
</div>
|
|
328
403
|
<slot name="helper-text"></slot>
|
|
404
|
+
${this.showCount ? html `
|
|
405
|
+
<div class="character-count" ?data-over-limit=${this.isOverCharacterLimit}>
|
|
406
|
+
${this.characterCountDisplay}
|
|
407
|
+
</div>
|
|
408
|
+
` : ''}
|
|
329
409
|
`;
|
|
330
410
|
}
|
|
331
411
|
};
|
|
@@ -345,6 +425,9 @@ __decorate([
|
|
|
345
425
|
__decorate([
|
|
346
426
|
property({ type: String })
|
|
347
427
|
], NrInputElement.prototype, "size", void 0);
|
|
428
|
+
__decorate([
|
|
429
|
+
property({ type: String, reflect: true })
|
|
430
|
+
], NrInputElement.prototype, "variant", void 0);
|
|
348
431
|
__decorate([
|
|
349
432
|
property({ reflect: true })
|
|
350
433
|
], NrInputElement.prototype, "type", void 0);
|
|
@@ -366,6 +449,15 @@ __decorate([
|
|
|
366
449
|
__decorate([
|
|
367
450
|
property({ type: Boolean, reflect: true })
|
|
368
451
|
], NrInputElement.prototype, "withCopy", void 0);
|
|
452
|
+
__decorate([
|
|
453
|
+
property({ type: Boolean, reflect: true })
|
|
454
|
+
], NrInputElement.prototype, "allowClear", void 0);
|
|
455
|
+
__decorate([
|
|
456
|
+
property({ type: Boolean, reflect: true })
|
|
457
|
+
], NrInputElement.prototype, "showCount", void 0);
|
|
458
|
+
__decorate([
|
|
459
|
+
property({ type: Number })
|
|
460
|
+
], NrInputElement.prototype, "maxLength", void 0);
|
|
369
461
|
__decorate([
|
|
370
462
|
state()
|
|
371
463
|
], NrInputElement.prototype, "inputType", void 0);
|
|
@@ -376,8 +468,8 @@ __decorate([
|
|
|
376
468
|
state()
|
|
377
469
|
], NrInputElement.prototype, "hasAddonAfter", void 0);
|
|
378
470
|
__decorate([
|
|
379
|
-
|
|
380
|
-
], NrInputElement.prototype, "
|
|
471
|
+
state()
|
|
472
|
+
], NrInputElement.prototype, "focused", void 0);
|
|
381
473
|
NrInputElement = __decorate([
|
|
382
474
|
customElement('nr-input')
|
|
383
475
|
], NrInputElement);
|
package/input.component.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input.component.js","sourceRoot":"","sources":["../../../src/components/input/input.component.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/**\n * @license\n * Copyright 2023 Google Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport { LitElement, PropertyValues, html } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { styles } from './input.style.js';\nimport { INPUT_TYPE, INPUT_STATE, INPUT_SIZE, EMPTY_STRING } from './input.types.js';\nimport { NuralyUIBaseMixin } from '../../shared/base-mixin.js';\nimport { InputValidationUtils } from './utils/input-validation.utils.js';\nimport { InputRenderUtils } from './utils/input-renderers.js';\nimport '../icon/icon.component.js';\n\n@customElement('nr-input')\nexport class NrInputElement extends NuralyUIBaseMixin(LitElement) {\n\n @property({type: Boolean, reflect: true})\n disabled = false;\n\n @property({type: Boolean, reflect: true})\n readonly = false;\n\n @property({type: String, reflect: true})\n state = INPUT_STATE.Default;\n\n @property({type: String})\n value = EMPTY_STRING;\n\n @property({type: String})\n size = INPUT_SIZE.Medium;\n\n @property({reflect: true})\n type = INPUT_TYPE.TEXT;\n\n @property({type: String})\n step?: string;\n\n @property({type: String})\n min?: string;\n\n @property({type: String})\n max?: string;\n\n @property({type: String})\n placeholder = EMPTY_STRING;\n\n @property({type: String})\n autocomplete = 'off';\n\n @property({type: Boolean, reflect: true})\n withCopy = false;\n\n @state()\n inputType = EMPTY_STRING;\n\n @state()\n hasAddonBefore = false;\n\n @state()\n hasAddonAfter = false;\n\n @query('#input')\n input!: HTMLInputElement;\n\n /**\n * Required components that must be registered for this component to work properly\n */\n override requiredComponents = ['hy-icon'];\n\n /**\n * Check for required dependencies when component is connected to DOM\n */\n override connectedCallback() {\n super.connectedCallback();\n this.validateDependencies();\n }\n\n override willUpdate(_changedProperties: PropertyValues): void {\n if (_changedProperties.has('type')) {\n this.inputType = this.type;\n if (this.inputType === INPUT_TYPE.NUMBER && this.min && !this.value) {\n this.value = this.min;\n }\n }\n \n // Validate numeric properties when they change\n if (_changedProperties.has('type') || \n _changedProperties.has('min') || \n _changedProperties.has('max') || \n _changedProperties.has('step')) {\n InputValidationUtils.validateNumericProperties(this.type, this.min, this.max, this.step);\n }\n }\n\n override updated(_changedProperties: PropertyValues): void {\n if (_changedProperties.has('step') || _changedProperties.has('min') || _changedProperties.has('max')) {\n const input = this.input;\n if (input) {\n if (this.step) input.setAttribute('step', this.step);\n else input.removeAttribute('step');\n \n if (this.min) input.setAttribute('min', this.min);\n else input.removeAttribute('min');\n \n if (this.max) input.setAttribute('max', this.max);\n else input.removeAttribute('max');\n }\n }\n }\n\n override firstUpdated(): void {\n this._checkInitialSlotContent();\n }\n\n /**\n * Check initial slot content on first render\n */\n private _checkInitialSlotContent(): void {\n // Check for addon-before content\n const addonBeforeElements = this.querySelectorAll('[slot=\"addon-before\"]');\n this.hasAddonBefore = addonBeforeElements.length > 0;\n\n // Check for addon-after content \n const addonAfterElements = this.querySelectorAll('[slot=\"addon-after\"]');\n this.hasAddonAfter = addonAfterElements.length > 0;\n }\n\n /**\n * Handle slot changes to determine addon visibility\n */\n private _handleSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n const slotName = slot.name;\n \n if (slotName === 'addon-before') {\n this.hasAddonBefore = slot.assignedElements().length > 0;\n } else if (slotName === 'addon-after') {\n this.hasAddonAfter = slot.assignedElements().length > 0;\n }\n }\n\n // ========================================\n // EVENT HANDLING METHODS\n // ========================================\n\n /**\n * Centralized event dispatcher to ensure consistent event structure\n */\n private _dispatchInputEvent(eventName: string, detail: any): void {\n this.dispatchEvent(\n new CustomEvent(eventName, {\n detail,\n bubbles: true\n })\n );\n }\n\n private _handleKeyDown(keyDownEvent: KeyboardEvent) {\n // Prevent all key input when readonly\n if (this.readonly) {\n const allowedReadonlyKeys = [\n 'Tab', 'Escape', 'ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown',\n 'Home', 'End', 'PageUp', 'PageDown'\n ];\n \n if (keyDownEvent.ctrlKey || keyDownEvent.metaKey) {\n const allowedCombinations = ['KeyA', 'KeyC'];\n if (allowedCombinations.includes(keyDownEvent.code)) {\n return;\n }\n }\n \n if (!allowedReadonlyKeys.includes(keyDownEvent.key)) {\n keyDownEvent.preventDefault();\n return;\n }\n }\n\n // Handle Enter key\n if (keyDownEvent.key === 'Enter') {\n this._dispatchInputEvent('nr-enter', {\n target: keyDownEvent.target,\n value: this.value,\n originalEvent: keyDownEvent\n });\n return;\n }\n\n // Prevent non-numeric input for number type\n if (this.type === INPUT_TYPE.NUMBER) {\n InputValidationUtils.preventNonNumericInput(keyDownEvent, this.min);\n \n if (keyDownEvent.defaultPrevented) {\n this._dispatchInputEvent('nr-invalid-key', {\n key: keyDownEvent.key,\n target: keyDownEvent.target,\n value: this.value,\n originalEvent: keyDownEvent\n });\n }\n }\n }\n\n private _valueChange(e: Event) {\n if (this.readonly) {\n e.preventDefault();\n return;\n }\n\n const target = e.target as HTMLInputElement;\n const newValue = target.value;\n \n if (this.type === INPUT_TYPE.NUMBER && newValue) {\n const validation = InputValidationUtils.validateNumericValue(newValue, this.min, this.max);\n \n if (!validation.isValid) {\n console.warn(validation.warnings[0]);\n this._dispatchInputEvent('nr-validation-error', {\n value: newValue,\n target: target,\n error: validation.warnings[0],\n originalEvent: e\n });\n return;\n }\n \n validation.warnings.forEach(warning => console.warn(warning));\n }\n \n this.value = newValue;\n this._dispatchInputEvent('nr-input', {\n value: this.value, \n target: target,\n originalEvent: e \n });\n }\n\n private _focusEvent(e: Event) {\n this._dispatchInputEvent('nr-focus', {\n target: e.target,\n value: this.value\n });\n }\n\n private _handleIconKeydown(keyDownEvent: KeyboardEvent) {\n if (keyDownEvent.key === 'Enter' || keyDownEvent.key === ' ') {\n keyDownEvent.preventDefault();\n const target = keyDownEvent.target as HTMLElement;\n \n if (target.id === 'copy-icon') {\n this._onCopy();\n } else if (target.id === 'password-icon') {\n this._togglePasswordIcon();\n } else if (target.closest('#number-icons')) {\n if (target.getAttribute('name') === 'plus') {\n this._increment();\n } else if (target.getAttribute('name') === 'minus') {\n this._decrement();\n }\n }\n }\n }\n\n private async _onCopy() {\n try {\n const input = this.shadowRoot!.getElementById('input')! as HTMLInputElement;\n input.select();\n await navigator.clipboard.writeText(input.value);\n \n this._dispatchInputEvent('nr-copy-success', { value: input.value });\n } catch (error) {\n this._dispatchInputEvent('nr-copy-error', { error });\n }\n }\n\n // ========================================\n // OPERATION METHODS\n // ========================================\n\n private _increment() {\n try {\n this.input.stepUp();\n this.value = this.input.value;\n this._dispatchInputEvent('nr-input', {\n value: this.value, \n target: this.input,\n action: 'increment'\n });\n } catch (error) {\n console.warn('Failed to increment value:', error);\n this._dispatchInputEvent('nr-increment-error', {\n error,\n value: this.value,\n target: this.input\n });\n }\n }\n\n private _decrement() {\n try {\n this.input.stepDown();\n this.value = this.input.value;\n this._dispatchInputEvent('nr-input', {\n value: this.value, \n target: this.input,\n action: 'decrement'\n });\n } catch (error) {\n console.warn('Failed to decrement value:', error);\n this._dispatchInputEvent('nr-decrement-error', {\n error,\n value: this.value,\n target: this.input\n });\n }\n }\n\n private _togglePasswordIcon() {\n if (this.inputType === INPUT_TYPE.PASSWORD) {\n this.inputType = INPUT_TYPE.TEXT;\n } else if (this.inputType === INPUT_TYPE.TEXT && this.type === INPUT_TYPE.PASSWORD) {\n this.inputType = INPUT_TYPE.PASSWORD;\n }\n }\n\n private _getAriaDescribedBy(): string {\n const describedBy: string[] = [];\n \n const helperSlot = this.shadowRoot?.querySelector('slot[name=\"helper-text\"]');\n if (helperSlot && (helperSlot as HTMLSlotElement).assignedNodes().length > 0) {\n describedBy.push('helper-text');\n }\n \n return describedBy.join(' ') || '';\n }\n\n // ========================================\n // RENDER METHODS\n // ========================================\n\n override render() {\n return html`\n <slot name=\"label\"></slot>\n <div class=\"input-wrapper\" data-theme=\"${this.currentTheme}\">\n ${InputRenderUtils.renderAddonBefore(this.hasAddonBefore, (e: Event) => this._handleSlotChange(e))}\n <div data-size=${this.size} id=\"input-container\">\n ${InputRenderUtils.renderPrefix()}\n <input\n id=\"input\"\n .disabled=${this.disabled}\n .readOnly=${this.readonly}\n .value=${this.value}\n .placeholder=${this.placeholder}\n .type=\"${this.inputType}\"\n .autocomplete=${this.autocomplete}\n aria-invalid=${this.state === INPUT_STATE.Error ? 'true' : 'false'}\n aria-describedby=${this._getAriaDescribedBy()}\n @input=${this._valueChange}\n @focus=${this._focusEvent}\n @keydown=${this._handleKeyDown}\n />\n ${InputRenderUtils.renderSuffix()}\n ${InputRenderUtils.renderCopyIcon(\n this.withCopy,\n this.disabled,\n this.readonly,\n () => this._onCopy(),\n (e: KeyboardEvent) => this._handleIconKeydown(e)\n )}\n ${InputRenderUtils.renderStateIcon(this.state)}\n ${InputRenderUtils.renderCalendarIcon(this.state, this.type)}\n ${InputRenderUtils.renderPasswordIcon(\n this.type,\n this.inputType,\n this.disabled,\n this.readonly,\n () => this._togglePasswordIcon(),\n (e: KeyboardEvent) => this._handleIconKeydown(e)\n )}\n ${InputRenderUtils.renderNumberIcons(\n this.type,\n this.state,\n this.disabled,\n this.readonly,\n () => this._increment(),\n () => this._decrement(),\n (e: KeyboardEvent) => this._handleIconKeydown(e)\n )}\n </div>\n ${InputRenderUtils.renderAddonAfter(this.hasAddonAfter, (e: Event) => this._handleSlotChange(e))}\n </div>\n <slot name=\"helper-text\"></slot>\n `;\n }\n\n static override styles = styles;\n}\n\n"]}
|
|
1
|
+
{"version":3,"file":"input.component.js","sourceRoot":"","sources":["../../../src/components/input/input.component.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Nuraly, Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport { LitElement, PropertyValues, html } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { styles } from './input.style.js';\nimport { INPUT_TYPE, INPUT_STATE, INPUT_SIZE, INPUT_VARIANT, EMPTY_STRING, FocusChangeEvent } from './input.types.js';\nimport { NuralyUIBaseMixin } from '../../shared/base-mixin.js';\nimport { InputValidationUtils, InputRenderUtils } from './utils/index.js';\nimport { SelectionMixin, FocusMixin, NumberMixin } from './mixins/index.js';\n\nconst InputBaseMixin = NumberMixin(FocusMixin(SelectionMixin(NuralyUIBaseMixin(LitElement))));\n@customElement('nr-input')\nexport class NrInputElement extends InputBaseMixin {\n static override styles = styles;\n\n // ========================================\n // PROPERTIES\n // ========================================\n\n @property({type: Boolean, reflect: true})\n disabled = false;\n\n @property({type: Boolean, reflect: true})\n readonly = false;\n\n @property({type: String, reflect: true})\n state = INPUT_STATE.Default;\n\n @property({type: String})\n value = EMPTY_STRING;\n\n @property({type: String})\n size = INPUT_SIZE.Medium;\n\n @property({type: String, reflect: true})\n variant = INPUT_VARIANT.Underlined;\n\n @property({reflect: true})\n type = INPUT_TYPE.TEXT;\n\n @property({type: String})\n step?: string;\n\n @property({type: String})\n min?: string;\n\n @property({type: String})\n max?: string;\n\n @property({type: String})\n placeholder = EMPTY_STRING;\n\n @property({type: String})\n autocomplete = 'off';\n\n @property({type: Boolean, reflect: true})\n withCopy = false;\n\n @property({type: Boolean, reflect: true})\n allowClear = false;\n\n @property({type: Boolean, reflect: true})\n showCount = false;\n\n @property({type: Number})\n maxLength?: number;\n\n // ========================================\n // STATE\n // ========================================\n\n @state()\n inputType = EMPTY_STRING;\n\n @state()\n hasAddonBefore = false;\n\n @state()\n hasAddonAfter = false;\n\n @state()\n focused = false;\n\n // Use manual query instead of @query decorator to avoid TypeScript mixin issues\n private get _input(): HTMLInputElement {\n return this.shadowRoot!.querySelector('#input') as HTMLInputElement;\n }\n\n // ========================================\n // COMPUTED PROPERTIES\n // ========================================\n\n /**\n * Get the character count display text\n */\n get characterCountDisplay(): string {\n const currentLength = this.value.length;\n if (this.maxLength) {\n return `${currentLength}/${this.maxLength}`;\n }\n return `${currentLength}`;\n }\n\n /**\n * Check if character count is over the limit\n */\n get isOverCharacterLimit(): boolean {\n return this.maxLength ? this.value.length > this.maxLength : false;\n }\n\n // ========================================\n // COMPUTED PROPERTIES\n // ========================================\n\n /**\n * Get the input element\n */\n protected get input(): HTMLInputElement {\n return this._input;\n }\n\n /**\n * Override inputElement getter from mixins to use our @query property\n */\n protected get inputElement(): HTMLInputElement {\n return this._input;\n }\n\n // ========================================\n // LIFECYCLE METHODS\n // ========================================\n\n /**\n * Required components that must be registered for this component to work properly\n */\n override requiredComponents = ['nr-icon'];\n\n /**\n * Check for required dependencies when component is connected to DOM\n */\n override connectedCallback() {\n super.connectedCallback();\n }\n\n override willUpdate(_changedProperties: PropertyValues): void {\n super.willUpdate(_changedProperties);\n\n // Initialize inputType when type changes or on first render\n if (_changedProperties.has('type') || !this.inputType) {\n this.inputType = this.type;\n }\n\n // Set default value for number inputs with min\n if (_changedProperties.has('type') || _changedProperties.has('min')) {\n if (this.type === INPUT_TYPE.NUMBER && this.min && !this.value) {\n this.value = this.min;\n }\n }\n\n // Validate numeric properties when they change\n if (_changedProperties.has('type') || \n _changedProperties.has('min') || \n _changedProperties.has('max') || \n _changedProperties.has('step')) {\n InputValidationUtils.validateNumericProperties(this.type, this.min, this.max, this.step);\n }\n }\n\n override updated(_changedProperties: PropertyValues): void {\n if (_changedProperties.has('step') || _changedProperties.has('min') || _changedProperties.has('max') || _changedProperties.has('maxLength')) {\n const input = this.input;\n if (input) {\n this.setStep(this.step);\n \n if (this.min) input.setAttribute('min', this.min);\n else input.removeAttribute('min');\n \n if (this.max) input.setAttribute('max', this.max);\n else input.removeAttribute('max');\n\n if (this.maxLength) input.setAttribute('maxlength', this.maxLength.toString());\n else input.removeAttribute('maxlength');\n }\n }\n }\n\n override firstUpdated(): void {\n this._checkInitialSlotContent();\n }\n\n // ========================================\n // PRIVATE METHODS\n // ========================================\n\n /**\n * Check initial slot content on first render\n */\n private _checkInitialSlotContent(): void {\n // Check for addon-before content\n const addonBeforeElements = this.querySelectorAll('[slot=\"addon-before\"]');\n this.hasAddonBefore = addonBeforeElements.length > 0;\n\n // Check for addon-after content \n const addonAfterElements = this.querySelectorAll('[slot=\"addon-after\"]');\n this.hasAddonAfter = addonAfterElements.length > 0;\n }\n\n /**\n * Handle slot changes to determine addon visibility\n */\n private _handleSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n const slotName = slot.name;\n \n if (slotName === 'addon-before') {\n this.hasAddonBefore = slot.assignedElements().length > 0;\n } else if (slotName === 'addon-after') {\n this.hasAddonAfter = slot.assignedElements().length > 0;\n }\n }\n\n // ========================================\n // FOCUS MANAGEMENT METHODS\n // ========================================\n\n // Focus methods are provided by InputMixin\n\n // ========================================\n // EVENT HANDLING METHODS\n // ========================================\n\n // Event handling methods moved to EventHandlerMixin\n\n private _handleKeyDown(keyDownEvent: KeyboardEvent): void {\n // Prevent all key input when readonly - use mixin utility\n if (this.readonly && !this.isReadonlyKeyAllowed(keyDownEvent)) {\n keyDownEvent.preventDefault();\n return;\n }\n\n // Handle Enter key\n if (keyDownEvent.key === 'Enter') {\n this.dispatchCustomEvent('nr-enter', {\n target: keyDownEvent.target,\n value: this.value,\n originalEvent: keyDownEvent\n });\n return;\n }\n\n // Prevent non-numeric input for number type\n if (this.type === INPUT_TYPE.NUMBER) {\n InputValidationUtils.preventNonNumericInput(keyDownEvent, this.min);\n \n if (keyDownEvent.defaultPrevented) {\n this.dispatchCustomEvent('nr-invalid-key', {\n key: keyDownEvent.key,\n target: keyDownEvent.target,\n value: this.value,\n originalEvent: keyDownEvent\n });\n }\n }\n }\n\n private _valueChange(e: Event): void {\n if (this.readonly) {\n e.preventDefault();\n return;\n }\n\n const target = e.target as HTMLInputElement;\n const newValue = target.value;\n \n // Check character limit\n if (this.maxLength && newValue.length > this.maxLength) {\n this.dispatchCustomEvent('nr-character-limit-exceeded', {\n value: newValue,\n target: target,\n limit: this.maxLength,\n originalEvent: e\n });\n // Note: HTML maxlength attribute usually prevents this, but we dispatch event for awareness\n }\n \n if (this.type === INPUT_TYPE.NUMBER && newValue) {\n const validation = InputValidationUtils.validateNumericValue(newValue, this.min, this.max);\n \n if (!validation.isValid) {\n console.warn(validation.warnings[0]);\n this.dispatchValidationEvent('nr-validation-error', {\n value: newValue,\n target: target,\n error: validation.warnings[0],\n originalEvent: e,\n isValid: false\n });\n return;\n }\n \n validation.warnings.forEach(warning => console.warn(warning));\n }\n \n this.value = newValue;\n this.dispatchInputEvent('nr-input', {\n value: this.value, \n target: target,\n originalEvent: e \n });\n }\n\n private _focusEvent(e: Event): void {\n this.focused = true;\n \n // Handle cursor restoration if requested\n const input = e.target as HTMLInputElement;\n if (input.dataset.restoreCursor) {\n const position = parseInt(input.dataset.restoreCursor, 10);\n this.setCursorPosition(position);\n delete input.dataset.restoreCursor;\n }\n \n const focusDetail: FocusChangeEvent = {\n focused: true,\n cursorPosition: this.getCursorPosition() ?? undefined,\n selectedText: this.getSelectedText()\n };\n \n this.dispatchFocusEvent('nr-focus', {\n target: e.target,\n value: this.value,\n ...focusDetail\n });\n \n this.dispatchFocusEvent('nr-focus-change', focusDetail);\n }\n\n private _blurEvent(e: Event): void {\n this.focused = false;\n \n const focusDetail: FocusChangeEvent = {\n focused: false,\n cursorPosition: this.getCursorPosition() ?? undefined,\n selectedText: this.getSelectedText()\n };\n \n this.dispatchFocusEvent('nr-blur', {\n target: e.target,\n value: this.value,\n ...focusDetail\n });\n \n this.dispatchFocusEvent('nr-focus-change', focusDetail);\n }\n\n private _handleIconKeydown(keyDownEvent: KeyboardEvent): void {\n if (this.isActivationKey(keyDownEvent)) {\n keyDownEvent.preventDefault();\n const target = keyDownEvent.target as HTMLElement;\n \n if (target.id === 'copy-icon') {\n this._onCopy();\n } else if (target.id === 'clear-icon') {\n this._onClear();\n } else if (target.id === 'password-icon') {\n this._togglePasswordIcon();\n } else if (target.closest('#number-icons')) {\n if (target.getAttribute('name') === 'plus') {\n this._increment();\n } else if (target.getAttribute('name') === 'minus') {\n this._decrement();\n }\n }\n }\n }\n\n private async _onCopy(): Promise<void> {\n try {\n const input = this.shadowRoot!.getElementById('input')! as HTMLInputElement;\n input.select();\n await navigator.clipboard.writeText(input.value);\n \n this.dispatchActionEvent('nr-copy-success', { \n value: input.value,\n action: 'copy'\n });\n } catch (error) {\n this.dispatchCustomEvent('nr-copy-error', { error });\n }\n }\n\n private _onClear(): void {\n if (this.disabled || this.readonly) {\n return;\n }\n\n const previousValue = this.value;\n this.value = EMPTY_STRING;\n \n // Update the input element value\n if (this.input) {\n this.input.value = EMPTY_STRING;\n }\n\n this.dispatchActionEvent('nr-clear', {\n previousValue,\n newValue: this.value,\n target: this.input,\n action: 'clear'\n });\n\n // Also dispatch input event for consistency\n this.dispatchInputEvent('nr-input', {\n value: this.value,\n target: this.input,\n action: 'clear'\n });\n }\n\n // ========================================\n // OPERATION METHODS\n // ========================================\n\n private _increment(): void {\n this.increment();\n }\n\n private _decrement(): void {\n this.decrement();\n }\n\n private _togglePasswordIcon(): void {\n if (this.inputType === INPUT_TYPE.PASSWORD) {\n this.inputType = INPUT_TYPE.TEXT;\n } else if (this.inputType === INPUT_TYPE.TEXT && this.type === INPUT_TYPE.PASSWORD) {\n this.inputType = INPUT_TYPE.PASSWORD;\n }\n }\n\n private _getAriaDescribedBy(): string {\n const describedBy: string[] = [];\n \n const helperSlot = this.shadowRoot?.querySelector('slot[name=\"helper-text\"]');\n if (helperSlot && (helperSlot as HTMLSlotElement).assignedNodes().length > 0) {\n describedBy.push('helper-text');\n }\n \n return describedBy.join(' ') || '';\n }\n\n // ========================================\n // RENDER METHODS\n // ========================================\n\n override render() {\n return html`\n <slot name=\"label\"></slot>\n <div class=\"input-wrapper\" data-theme=\"${this.currentTheme}\">\n ${InputRenderUtils.renderAddonBefore(this.hasAddonBefore, (e: Event) => this._handleSlotChange(e))}\n <div data-size=${this.size} id=\"input-container\">\n ${InputRenderUtils.renderPrefix()}\n <input\n id=\"input\"\n .disabled=${this.disabled}\n .readOnly=${this.readonly}\n .value=${this.value}\n .placeholder=${this.placeholder}\n .type=\"${this.inputType}\"\n .autocomplete=${this.autocomplete}\n aria-invalid=${this.state === INPUT_STATE.Error ? 'true' : 'false'}\n aria-describedby=${this._getAriaDescribedBy()}\n @input=${this._valueChange}\n @focus=${this._focusEvent}\n @blur=${this._blurEvent}\n @keydown=${this._handleKeyDown}\n />\n ${InputRenderUtils.renderSuffix()}\n ${InputRenderUtils.renderCopyIcon(\n this.withCopy,\n this.disabled,\n this.readonly,\n () => this._onCopy(),\n (e: KeyboardEvent) => this._handleIconKeydown(e)\n )}\n ${InputRenderUtils.renderClearIcon(\n this.allowClear,\n this.value,\n this.disabled,\n this.readonly,\n () => this._onClear(),\n (e: KeyboardEvent) => this._handleIconKeydown(e)\n )}\n ${InputRenderUtils.renderStateIcon(this.state)}\n ${InputRenderUtils.renderCalendarIcon(this.state, this.type)}\n ${InputRenderUtils.renderPasswordIcon(\n this.type,\n this.inputType,\n this.disabled,\n this.readonly,\n () => this._togglePasswordIcon(),\n (e: KeyboardEvent) => this._handleIconKeydown(e)\n )}\n ${InputRenderUtils.renderNumberIcons(\n this.type,\n this.state,\n this.disabled,\n this.readonly,\n () => this._increment(),\n () => this._decrement(),\n (e: KeyboardEvent) => this._handleIconKeydown(e)\n )}\n </div>\n ${InputRenderUtils.renderAddonAfter(this.hasAddonAfter, (e: Event) => this._handleSlotChange(e))}\n </div>\n <slot name=\"helper-text\"></slot>\n ${this.showCount ? html`\n <div class=\"character-count\" ?data-over-limit=${this.isOverCharacterLimit}>\n ${this.characterCountDisplay}\n </div>\n ` : ''}\n `;\n }\n}\n\n"]}
|