@nuralyui/input 0.0.8 → 0.0.10
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/bundle.js +1277 -0
- package/input.component.d.ts +118 -26
- package/input.component.js +229 -228
- package/input.component.js.map +1 -1
- package/input.style.js +154 -0
- package/input.style.js.map +1 -1
- package/input.style.variable.js +19 -0
- package/input.style.variable.js.map +1 -1
- package/input.types.d.ts +90 -1
- package/input.types.js +73 -0
- package/input.types.js.map +1 -1
- package/package.json +16 -2
- package/demo/input-demo.d.ts +0 -19
- package/demo/input-demo.d.ts.map +0 -1
- package/demo/input-demo.js +0 -339
- package/demo/input-demo.js.map +0 -1
- package/index.d.ts.map +0 -1
- package/input.component.d.ts.map +0 -1
- package/input.style.d.ts.map +0 -1
- package/input.style.variable.d.ts.map +0 -1
- package/input.types.d.ts.map +0 -1
- package/mixins/focus-mixin.d.ts +0 -60
- package/mixins/focus-mixin.d.ts.map +0 -1
- package/mixins/focus-mixin.js +0 -65
- package/mixins/focus-mixin.js.map +0 -1
- package/mixins/index.d.ts +0 -9
- package/mixins/index.d.ts.map +0 -1
- package/mixins/index.js +0 -9
- package/mixins/index.js.map +0 -1
- package/mixins/number-mixin.d.ts +0 -51
- package/mixins/number-mixin.d.ts.map +0 -1
- package/mixins/number-mixin.js +0 -131
- package/mixins/number-mixin.js.map +0 -1
- package/mixins/selection-mixin.d.ts +0 -57
- package/mixins/selection-mixin.d.ts.map +0 -1
- package/mixins/selection-mixin.js +0 -80
- package/mixins/selection-mixin.js.map +0 -1
- package/react.d.ts.map +0 -1
- package/test/hy-input_test.d.ts +0 -2
- package/test/hy-input_test.d.ts.map +0 -1
- package/test/hy-input_test.js +0 -159
- package/test/hy-input_test.js.map +0 -1
- package/utils/index.d.ts +0 -8
- package/utils/index.d.ts.map +0 -1
- package/utils/index.js +0 -8
- package/utils/index.js.map +0 -1
- package/utils/input-renderers.d.ts +0 -54
- package/utils/input-renderers.d.ts.map +0 -1
- package/utils/input-renderers.js +0 -174
- package/utils/input-renderers.js.map +0 -1
- package/utils/input-validation.utils.d.ts +0 -26
- package/utils/input-validation.utils.d.ts.map +0 -1
- package/utils/input-validation.utils.js +0 -105
- package/utils/input-validation.utils.js.map +0 -1
- package/validation.d.ts.map +0 -1
package/mixins/focus-mixin.js
DELETED
|
@@ -1,65 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright 2023 Nuraly, Laabidi Aymen
|
|
4
|
-
* SPDX-License-Identifier: MIT
|
|
5
|
-
*/
|
|
6
|
-
/**
|
|
7
|
-
* Mixin that provides focus management capabilities to input components
|
|
8
|
-
*
|
|
9
|
-
* @param superClass - The base class to extend
|
|
10
|
-
* @returns Enhanced class with focus capabilities
|
|
11
|
-
*
|
|
12
|
-
* @example
|
|
13
|
-
* ```typescript
|
|
14
|
-
* export class MyInput extends FocusMixin(LitElement) {
|
|
15
|
-
* @query('input') input!: HTMLInputElement;
|
|
16
|
-
*
|
|
17
|
-
* handleClick() {
|
|
18
|
-
* this.focus({ selectText: true });
|
|
19
|
-
* }
|
|
20
|
-
* }
|
|
21
|
-
* ```
|
|
22
|
-
*/
|
|
23
|
-
export const FocusMixin = (superClass) => {
|
|
24
|
-
class FocusMixinClass extends superClass {
|
|
25
|
-
/**
|
|
26
|
-
* Get the input element - must be implemented by the component
|
|
27
|
-
*/
|
|
28
|
-
get inputElement() {
|
|
29
|
-
var _a;
|
|
30
|
-
// Try to get from shadowRoot first (for custom elements)
|
|
31
|
-
const shadowInput = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#input, input, textarea');
|
|
32
|
-
if (shadowInput) {
|
|
33
|
-
return shadowInput;
|
|
34
|
-
}
|
|
35
|
-
// Fallback to light DOM
|
|
36
|
-
const input = this.querySelector('input, textarea');
|
|
37
|
-
if (!input) {
|
|
38
|
-
throw new Error('FocusMixin requires an input or textarea element');
|
|
39
|
-
}
|
|
40
|
-
return input;
|
|
41
|
-
}
|
|
42
|
-
focus(options = {}) {
|
|
43
|
-
const input = this.inputElement;
|
|
44
|
-
if (input) {
|
|
45
|
-
input.focus({ preventScroll: options.preventScroll });
|
|
46
|
-
if (options.selectText) {
|
|
47
|
-
input.select();
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
blur() {
|
|
52
|
-
const input = this.inputElement;
|
|
53
|
-
if (input) {
|
|
54
|
-
input.blur();
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
isFocused() {
|
|
58
|
-
const input = this.inputElement;
|
|
59
|
-
return input ? document.activeElement === input : false;
|
|
60
|
-
}
|
|
61
|
-
}
|
|
62
|
-
// Cast return type to the superClass type passed in
|
|
63
|
-
return FocusMixinClass;
|
|
64
|
-
};
|
|
65
|
-
//# sourceMappingURL=focus-mixin.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"focus-mixin.js","sourceRoot":"","sources":["../../../../src/components/input/mixins/focus-mixin.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AA4CH;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAoC,UAAa,EAAE,EAAE;IAC7E,MAAM,eAAgB,SAAQ,UAAU;QACtC;;WAEG;QACH,IAAc,YAAY;;YACxB,yDAAyD;YACzD,MAAM,WAAW,GAAG,MAAA,IAAI,CAAC,UAAU,0CAAE,aAAa,CAAC,yBAAyB,CAA2C,CAAC;YACxH,IAAI,WAAW,EAAE;gBACf,OAAO,WAAW,CAAC;aACpB;YAED,wBAAwB;YACxB,MAAM,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC,iBAAiB,CAA2C,CAAC;YAC9F,IAAI,CAAC,KAAK,EAAE;gBACV,MAAM,IAAI,KAAK,CAAC,kDAAkD,CAAC,CAAC;aACrE;YACD,OAAO,KAAK,CAAC;QACf,CAAC;QAEQ,KAAK,CAAC,UAAwB,EAAE;YACvC,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC;YAChC,IAAI,KAAK,EAAE;gBACT,KAAK,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,OAAO,CAAC,aAAa,EAAE,CAAC,CAAC;gBAEtD,IAAI,OAAO,CAAC,UAAU,EAAE;oBACtB,KAAK,CAAC,MAAM,EAAE,CAAC;iBAChB;aACF;QACH,CAAC;QAEQ,IAAI;YACX,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC;YAChC,IAAI,KAAK,EAAE;gBACT,KAAK,CAAC,IAAI,EAAE,CAAC;aACd;QACH,CAAC;QAED,SAAS;YACP,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC;YAChC,OAAO,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,aAAa,KAAK,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC;QAC1D,CAAC;KACF;IAED,oDAAoD;IACpD,OAAO,eAAgD,CAAC;AAC1D,CAAC,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2023 Nuraly, Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport { LitElement } from 'lit';\n\ntype Constructor<T = {}> = new (...args: any[]) => T;\n\n/**\n * Options for focus behavior\n */\nexport interface FocusOptions {\n preventScroll?: boolean;\n selectText?: boolean;\n}\n\n/**\n * Options for blur behavior\n */\nexport interface BlurOptions {\n relatedTarget?: Element | null;\n}\n\n/**\n * Interface for components that support focus operations\n */\nexport interface FocusCapable {\n /**\n * Focus the input element\n * @param options - Focus options\n */\n focus(options?: FocusOptions): void;\n\n /**\n * Blur the input element\n * @param options - Blur options\n */\n blur(options?: BlurOptions): void;\n\n /**\n * Check if the input is currently focused\n * @returns True if focused\n */\n isFocused(): boolean;\n}\n\n/**\n * Mixin that provides focus management capabilities to input components\n * \n * @param superClass - The base class to extend\n * @returns Enhanced class with focus capabilities\n * \n * @example\n * ```typescript\n * export class MyInput extends FocusMixin(LitElement) {\n * @query('input') input!: HTMLInputElement;\n * \n * handleClick() {\n * this.focus({ selectText: true });\n * }\n * }\n * ```\n */\nexport const FocusMixin = <T extends Constructor<LitElement>>(superClass: T) => {\n class FocusMixinClass extends superClass implements FocusCapable {\n /**\n * Get the input element - must be implemented by the component\n */\n protected get inputElement(): HTMLInputElement | HTMLTextAreaElement {\n // Try to get from shadowRoot first (for custom elements)\n const shadowInput = this.shadowRoot?.querySelector('#input, input, textarea') as HTMLInputElement | HTMLTextAreaElement;\n if (shadowInput) {\n return shadowInput;\n }\n \n // Fallback to light DOM\n const input = this.querySelector('input, textarea') as HTMLInputElement | HTMLTextAreaElement;\n if (!input) {\n throw new Error('FocusMixin requires an input or textarea element');\n }\n return input;\n }\n\n override focus(options: FocusOptions = {}): void {\n const input = this.inputElement;\n if (input) {\n input.focus({ preventScroll: options.preventScroll });\n \n if (options.selectText) {\n input.select();\n }\n }\n }\n\n override blur(): void {\n const input = this.inputElement;\n if (input) {\n input.blur();\n }\n }\n\n isFocused(): boolean {\n const input = this.inputElement;\n return input ? document.activeElement === input : false;\n }\n }\n\n // Cast return type to the superClass type passed in\n return FocusMixinClass as Constructor<FocusCapable> & T;\n};\n"]}
|
package/mixins/index.d.ts
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright 2023 Nuraly, Laabidi Aymen
|
|
4
|
-
* SPDX-License-Identifier: MIT
|
|
5
|
-
*/
|
|
6
|
-
export { SelectionMixin, SelectionCapable } from './selection-mixin.js';
|
|
7
|
-
export { FocusMixin, FocusCapable, FocusOptions, BlurOptions } from './focus-mixin.js';
|
|
8
|
-
export { NumberMixin, NumberCapable } from './number-mixin.js';
|
|
9
|
-
//# sourceMappingURL=index.d.ts.map
|
package/mixins/index.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/input/mixins/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxE,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AACvF,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC"}
|
package/mixins/index.js
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright 2023 Nuraly, Laabidi Aymen
|
|
4
|
-
* SPDX-License-Identifier: MIT
|
|
5
|
-
*/
|
|
6
|
-
export { SelectionMixin } from './selection-mixin.js';
|
|
7
|
-
export { FocusMixin } from './focus-mixin.js';
|
|
8
|
-
export { NumberMixin } from './number-mixin.js';
|
|
9
|
-
//# sourceMappingURL=index.js.map
|
package/mixins/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/input/mixins/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,cAAc,EAAoB,MAAM,sBAAsB,CAAC;AACxE,OAAO,EAAE,UAAU,EAA2C,MAAM,kBAAkB,CAAC;AACvF,OAAO,EAAE,WAAW,EAAiB,MAAM,mBAAmB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2023 Nuraly, Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nexport { SelectionMixin, SelectionCapable } from './selection-mixin.js';\nexport { FocusMixin, FocusCapable, FocusOptions, BlurOptions } from './focus-mixin.js';\nexport { NumberMixin, NumberCapable } from './number-mixin.js';\n"]}
|
package/mixins/number-mixin.d.ts
DELETED
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright 2023 Nuraly, Laabidi Aymen
|
|
4
|
-
* SPDX-License-Identifier: MIT
|
|
5
|
-
*/
|
|
6
|
-
import { LitElement } from 'lit';
|
|
7
|
-
declare type Constructor<T = {}> = new (...args: any[]) => T;
|
|
8
|
-
/**
|
|
9
|
-
* Interface for components that support number operations
|
|
10
|
-
*/
|
|
11
|
-
export interface NumberCapable {
|
|
12
|
-
/**
|
|
13
|
-
* Increment the number value
|
|
14
|
-
*/
|
|
15
|
-
increment(): void;
|
|
16
|
-
/**
|
|
17
|
-
* Decrement the number value
|
|
18
|
-
*/
|
|
19
|
-
decrement(): void;
|
|
20
|
-
/**
|
|
21
|
-
* Set the step attribute for number inputs
|
|
22
|
-
* @param step - The step value
|
|
23
|
-
*/
|
|
24
|
-
setStep(step: string | undefined): void;
|
|
25
|
-
/**
|
|
26
|
-
* Validate if a step value is valid
|
|
27
|
-
* @param step - The step value to validate
|
|
28
|
-
* @returns True if valid
|
|
29
|
-
*/
|
|
30
|
-
isValidStep(step: string | undefined): boolean;
|
|
31
|
-
}
|
|
32
|
-
/**
|
|
33
|
-
* Mixin that provides number input capabilities to input components
|
|
34
|
-
*
|
|
35
|
-
* @param superClass - The base class to extend
|
|
36
|
-
* @returns Enhanced class with number capabilities
|
|
37
|
-
*
|
|
38
|
-
* @example
|
|
39
|
-
* ```typescript
|
|
40
|
-
* export class MyInput extends NumberMixin(LitElement) {
|
|
41
|
-
* @query('input') input!: HTMLInputElement;
|
|
42
|
-
*
|
|
43
|
-
* handleUpClick() {
|
|
44
|
-
* this.increment();
|
|
45
|
-
* }
|
|
46
|
-
* }
|
|
47
|
-
* ```
|
|
48
|
-
*/
|
|
49
|
-
export declare const NumberMixin: <T extends Constructor<LitElement>>(superClass: T) => Constructor<NumberCapable> & T;
|
|
50
|
-
export {};
|
|
51
|
-
//# sourceMappingURL=number-mixin.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"number-mixin.d.ts","sourceRoot":"","sources":["../../../../src/components/input/mixins/number-mixin.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEjC,aAAK,WAAW,CAAC,CAAC,GAAG,EAAE,IAAI,KAAK,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,CAAC,CAAC;AAErD;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,SAAS,IAAI,IAAI,CAAC;IAElB;;OAEG;IACH,SAAS,IAAI,IAAI,CAAC;IAElB;;;OAGG;IACH,OAAO,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI,CAAC;IAExC;;;;OAIG;IACH,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;CAChD;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,WAAW,sFAkHvB,CAAC"}
|
package/mixins/number-mixin.js
DELETED
|
@@ -1,131 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright 2023 Nuraly, Laabidi Aymen
|
|
4
|
-
* SPDX-License-Identifier: MIT
|
|
5
|
-
*/
|
|
6
|
-
/**
|
|
7
|
-
* Mixin that provides number input capabilities to input components
|
|
8
|
-
*
|
|
9
|
-
* @param superClass - The base class to extend
|
|
10
|
-
* @returns Enhanced class with number capabilities
|
|
11
|
-
*
|
|
12
|
-
* @example
|
|
13
|
-
* ```typescript
|
|
14
|
-
* export class MyInput extends NumberMixin(LitElement) {
|
|
15
|
-
* @query('input') input!: HTMLInputElement;
|
|
16
|
-
*
|
|
17
|
-
* handleUpClick() {
|
|
18
|
-
* this.increment();
|
|
19
|
-
* }
|
|
20
|
-
* }
|
|
21
|
-
* ```
|
|
22
|
-
*/
|
|
23
|
-
export const NumberMixin = (superClass) => {
|
|
24
|
-
class NumberMixinClass extends superClass {
|
|
25
|
-
/**
|
|
26
|
-
* Get the input element - must be implemented by the component
|
|
27
|
-
*/
|
|
28
|
-
get inputElement() {
|
|
29
|
-
var _a;
|
|
30
|
-
// Try to get from shadowRoot first (for custom elements)
|
|
31
|
-
const shadowInput = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#input, input');
|
|
32
|
-
if (shadowInput) {
|
|
33
|
-
return shadowInput;
|
|
34
|
-
}
|
|
35
|
-
// Fallback to light DOM
|
|
36
|
-
const input = this.querySelector('input');
|
|
37
|
-
if (!input) {
|
|
38
|
-
throw new Error('NumberMixin requires an input element');
|
|
39
|
-
}
|
|
40
|
-
return input;
|
|
41
|
-
}
|
|
42
|
-
/**
|
|
43
|
-
* Dispatch an input event - will be overridden by components that have _dispatchInputEvent
|
|
44
|
-
*/
|
|
45
|
-
dispatchInputEvent(eventName, detail) {
|
|
46
|
-
// Try to use the component's _dispatchInputEvent method if available
|
|
47
|
-
if ('_dispatchInputEvent' in this && typeof this._dispatchInputEvent === 'function') {
|
|
48
|
-
this._dispatchInputEvent(eventName, detail);
|
|
49
|
-
}
|
|
50
|
-
else {
|
|
51
|
-
// Fallback to standard event dispatch
|
|
52
|
-
this.dispatchEvent(new CustomEvent(eventName, {
|
|
53
|
-
detail,
|
|
54
|
-
bubbles: true,
|
|
55
|
-
composed: true
|
|
56
|
-
}));
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
increment() {
|
|
60
|
-
try {
|
|
61
|
-
const input = this.inputElement;
|
|
62
|
-
// If input has no value, set it to min or 0 before stepping
|
|
63
|
-
if (!input.value) {
|
|
64
|
-
const min = input.getAttribute('min');
|
|
65
|
-
input.value = min ? min : '0';
|
|
66
|
-
}
|
|
67
|
-
input.stepUp();
|
|
68
|
-
const newValue = input.value;
|
|
69
|
-
this.dispatchInputEvent('nr-input', {
|
|
70
|
-
value: newValue,
|
|
71
|
-
target: input,
|
|
72
|
-
action: 'increment'
|
|
73
|
-
});
|
|
74
|
-
// Update component value if it has one
|
|
75
|
-
if ('value' in this) {
|
|
76
|
-
this.value = newValue;
|
|
77
|
-
}
|
|
78
|
-
}
|
|
79
|
-
catch (error) {
|
|
80
|
-
console.warn('Failed to increment value:', error);
|
|
81
|
-
this.dispatchInputEvent('nr-increment-error', {
|
|
82
|
-
error,
|
|
83
|
-
value: this.inputElement.value,
|
|
84
|
-
target: this.inputElement
|
|
85
|
-
});
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
decrement() {
|
|
89
|
-
try {
|
|
90
|
-
const input = this.inputElement;
|
|
91
|
-
input.stepDown();
|
|
92
|
-
const newValue = input.value;
|
|
93
|
-
this.dispatchInputEvent('nr-input', {
|
|
94
|
-
value: newValue,
|
|
95
|
-
target: input,
|
|
96
|
-
action: 'decrement'
|
|
97
|
-
});
|
|
98
|
-
// Update component value if it has one
|
|
99
|
-
if ('value' in this) {
|
|
100
|
-
this.value = newValue;
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
catch (error) {
|
|
104
|
-
console.warn('Failed to decrement value:', error);
|
|
105
|
-
this.dispatchInputEvent('nr-decrement-error', {
|
|
106
|
-
error,
|
|
107
|
-
value: this.inputElement.value,
|
|
108
|
-
target: this.inputElement
|
|
109
|
-
});
|
|
110
|
-
}
|
|
111
|
-
}
|
|
112
|
-
setStep(step) {
|
|
113
|
-
const input = this.inputElement;
|
|
114
|
-
if (step && this.isValidStep(step)) {
|
|
115
|
-
input.setAttribute('step', step);
|
|
116
|
-
}
|
|
117
|
-
else {
|
|
118
|
-
input.removeAttribute('step');
|
|
119
|
-
}
|
|
120
|
-
}
|
|
121
|
-
isValidStep(step) {
|
|
122
|
-
if (!step)
|
|
123
|
-
return true;
|
|
124
|
-
const stepValue = parseFloat(step);
|
|
125
|
-
return !isNaN(stepValue) && stepValue > 0;
|
|
126
|
-
}
|
|
127
|
-
}
|
|
128
|
-
// Cast return type to the superClass type passed in
|
|
129
|
-
return NumberMixinClass;
|
|
130
|
-
};
|
|
131
|
-
//# sourceMappingURL=number-mixin.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"number-mixin.js","sourceRoot":"","sources":["../../../../src/components/input/mixins/number-mixin.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 } from 'lit';\n\ntype Constructor<T = {}> = new (...args: any[]) => T;\n\n/**\n * Interface for components that support number operations\n */\nexport interface NumberCapable {\n /**\n * Increment the number value\n */\n increment(): void;\n\n /**\n * Decrement the number value\n */\n decrement(): void;\n\n /**\n * Set the step attribute for number inputs\n * @param step - The step value\n */\n setStep(step: string | undefined): void;\n\n /**\n * Validate if a step value is valid\n * @param step - The step value to validate\n * @returns True if valid\n */\n isValidStep(step: string | undefined): boolean;\n}\n\n/**\n * Mixin that provides number input capabilities to input components\n * \n * @param superClass - The base class to extend\n * @returns Enhanced class with number capabilities\n * \n * @example\n * ```typescript\n * export class MyInput extends NumberMixin(LitElement) {\n * @query('input') input!: HTMLInputElement;\n * \n * handleUpClick() {\n * this.increment();\n * }\n * }\n * ```\n */\nexport const NumberMixin = <T extends Constructor<LitElement>>(superClass: T) => {\n class NumberMixinClass extends superClass implements NumberCapable {\n /**\n * Get the input element - must be implemented by the component\n */\n protected get inputElement(): HTMLInputElement {\n // Try to get from shadowRoot first (for custom elements)\n const shadowInput = this.shadowRoot?.querySelector('#input, input') as HTMLInputElement;\n if (shadowInput) {\n return shadowInput;\n }\n \n // Fallback to light DOM\n const input = this.querySelector('input') as HTMLInputElement;\n if (!input) {\n throw new Error('NumberMixin requires an input element');\n }\n return input;\n }\n\n /**\n * Dispatch an input event - will be overridden by components that have _dispatchInputEvent\n */\n protected dispatchInputEvent(eventName: string, detail: any): void {\n // Try to use the component's _dispatchInputEvent method if available\n if ('_dispatchInputEvent' in this && typeof (this as any)._dispatchInputEvent === 'function') {\n (this as any)._dispatchInputEvent(eventName, detail);\n } else {\n // Fallback to standard event dispatch\n this.dispatchEvent(new CustomEvent(eventName, {\n detail,\n bubbles: true,\n composed: true\n }));\n }\n }\n\n increment(): void {\n try {\n const input = this.inputElement;\n \n // If input has no value, set it to min or 0 before stepping\n if (!input.value) {\n const min = input.getAttribute('min');\n input.value = min ? min : '0';\n }\n \n input.stepUp();\n const newValue = input.value;\n \n this.dispatchInputEvent('nr-input', {\n value: newValue,\n target: input,\n action: 'increment'\n });\n \n // Update component value if it has one\n if ('value' in this) {\n (this as any).value = newValue;\n }\n } catch (error) {\n console.warn('Failed to increment value:', error);\n this.dispatchInputEvent('nr-increment-error', {\n error,\n value: this.inputElement.value,\n target: this.inputElement\n });\n }\n }\n\n decrement(): void {\n try {\n const input = this.inputElement;\n input.stepDown();\n const newValue = input.value;\n \n this.dispatchInputEvent('nr-input', {\n value: newValue,\n target: input,\n action: 'decrement'\n });\n \n // Update component value if it has one\n if ('value' in this) {\n (this as any).value = newValue;\n }\n } catch (error) {\n console.warn('Failed to decrement value:', error);\n this.dispatchInputEvent('nr-decrement-error', {\n error,\n value: this.inputElement.value,\n target: this.inputElement\n });\n }\n }\n\n setStep(step: string | undefined): void {\n const input = this.inputElement;\n if (step && this.isValidStep(step)) {\n input.setAttribute('step', step);\n } else {\n input.removeAttribute('step');\n }\n }\n\n isValidStep(step: string | undefined): boolean {\n if (!step) return true;\n const stepValue = parseFloat(step);\n return !isNaN(stepValue) && stepValue > 0;\n }\n }\n\n // Cast return type to the superClass type passed in\n return NumberMixinClass as Constructor<NumberCapable> & T;\n};\n"]}
|
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright 2023 Nuraly, Laabidi Aymen
|
|
4
|
-
* SPDX-License-Identifier: MIT
|
|
5
|
-
*/
|
|
6
|
-
import { LitElement } from 'lit';
|
|
7
|
-
declare type Constructor<T = {}> = new (...args: any[]) => T;
|
|
8
|
-
/**
|
|
9
|
-
* Interface for components that support text selection operations
|
|
10
|
-
*/
|
|
11
|
-
export interface SelectionCapable {
|
|
12
|
-
/**
|
|
13
|
-
* Select all text in the input
|
|
14
|
-
*/
|
|
15
|
-
selectAll(): void;
|
|
16
|
-
/**
|
|
17
|
-
* Select a range of text in the input
|
|
18
|
-
* @param start - Start position
|
|
19
|
-
* @param end - End position
|
|
20
|
-
*/
|
|
21
|
-
selectRange(start: number, end: number): void;
|
|
22
|
-
/**
|
|
23
|
-
* Get the current cursor position
|
|
24
|
-
* @returns The cursor position or null if not available
|
|
25
|
-
*/
|
|
26
|
-
getCursorPosition(): number | null;
|
|
27
|
-
/**
|
|
28
|
-
* Set the cursor position
|
|
29
|
-
* @param position - The position to set
|
|
30
|
-
*/
|
|
31
|
-
setCursorPosition(position: number): void;
|
|
32
|
-
/**
|
|
33
|
-
* Get the currently selected text
|
|
34
|
-
* @returns The selected text or empty string
|
|
35
|
-
*/
|
|
36
|
-
getSelectedText(): string;
|
|
37
|
-
}
|
|
38
|
-
/**
|
|
39
|
-
* Mixin that provides text selection capabilities to input components
|
|
40
|
-
*
|
|
41
|
-
* @param superClass - The base class to extend
|
|
42
|
-
* @returns Enhanced class with selection capabilities
|
|
43
|
-
*
|
|
44
|
-
* @example
|
|
45
|
-
* ```typescript
|
|
46
|
-
* export class MyInput extends SelectionMixin(LitElement) {
|
|
47
|
-
* @query('input') input!: HTMLInputElement;
|
|
48
|
-
*
|
|
49
|
-
* handleDoubleClick() {
|
|
50
|
-
* this.selectAll();
|
|
51
|
-
* }
|
|
52
|
-
* }
|
|
53
|
-
* ```
|
|
54
|
-
*/
|
|
55
|
-
export declare const SelectionMixin: <T extends Constructor<LitElement>>(superClass: T) => Constructor<SelectionCapable> & T;
|
|
56
|
-
export {};
|
|
57
|
-
//# sourceMappingURL=selection-mixin.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"selection-mixin.d.ts","sourceRoot":"","sources":["../../../../src/components/input/mixins/selection-mixin.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEjC,aAAK,WAAW,CAAC,CAAC,GAAG,EAAE,IAAI,KAAK,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,CAAC,CAAC;AAErD;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B;;OAEG;IACH,SAAS,IAAI,IAAI,CAAC;IAElB;;;;OAIG;IACH,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;IAE9C;;;OAGG;IACH,iBAAiB,IAAI,MAAM,GAAG,IAAI,CAAC;IAEnC;;;OAGG;IACH,iBAAiB,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IAE1C;;;OAGG;IACH,eAAe,IAAI,MAAM,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,cAAc,yFA8D1B,CAAC"}
|
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright 2023 Nuraly, Laabidi Aymen
|
|
4
|
-
* SPDX-License-Identifier: MIT
|
|
5
|
-
*/
|
|
6
|
-
/**
|
|
7
|
-
* Mixin that provides text selection capabilities to input components
|
|
8
|
-
*
|
|
9
|
-
* @param superClass - The base class to extend
|
|
10
|
-
* @returns Enhanced class with selection capabilities
|
|
11
|
-
*
|
|
12
|
-
* @example
|
|
13
|
-
* ```typescript
|
|
14
|
-
* export class MyInput extends SelectionMixin(LitElement) {
|
|
15
|
-
* @query('input') input!: HTMLInputElement;
|
|
16
|
-
*
|
|
17
|
-
* handleDoubleClick() {
|
|
18
|
-
* this.selectAll();
|
|
19
|
-
* }
|
|
20
|
-
* }
|
|
21
|
-
* ```
|
|
22
|
-
*/
|
|
23
|
-
export const SelectionMixin = (superClass) => {
|
|
24
|
-
class SelectionMixinClass extends superClass {
|
|
25
|
-
/**
|
|
26
|
-
* Get the input element - must be implemented by the component
|
|
27
|
-
*/
|
|
28
|
-
get inputElement() {
|
|
29
|
-
var _a;
|
|
30
|
-
// Try to get from shadowRoot first (for custom elements)
|
|
31
|
-
const shadowInput = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#input, input, textarea');
|
|
32
|
-
if (shadowInput) {
|
|
33
|
-
return shadowInput;
|
|
34
|
-
}
|
|
35
|
-
// Fallback to light DOM
|
|
36
|
-
const input = this.querySelector('input, textarea');
|
|
37
|
-
if (!input) {
|
|
38
|
-
throw new Error('SelectionMixin requires an input or textarea element');
|
|
39
|
-
}
|
|
40
|
-
return input;
|
|
41
|
-
}
|
|
42
|
-
selectAll() {
|
|
43
|
-
const input = this.inputElement;
|
|
44
|
-
if (input) {
|
|
45
|
-
input.select();
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
selectRange(start, end) {
|
|
49
|
-
const input = this.inputElement;
|
|
50
|
-
if (input && input.setSelectionRange) {
|
|
51
|
-
input.focus();
|
|
52
|
-
input.setSelectionRange(start, end);
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
getCursorPosition() {
|
|
56
|
-
const input = this.inputElement;
|
|
57
|
-
if (input && typeof input.selectionStart === 'number') {
|
|
58
|
-
return input.selectionStart;
|
|
59
|
-
}
|
|
60
|
-
return null;
|
|
61
|
-
}
|
|
62
|
-
setCursorPosition(position) {
|
|
63
|
-
const input = this.inputElement;
|
|
64
|
-
if (input && input.setSelectionRange) {
|
|
65
|
-
input.focus();
|
|
66
|
-
input.setSelectionRange(position, position);
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
getSelectedText() {
|
|
70
|
-
const input = this.inputElement;
|
|
71
|
-
if (input && input.selectionStart !== null && input.selectionEnd !== null) {
|
|
72
|
-
return input.value.substring(input.selectionStart, input.selectionEnd);
|
|
73
|
-
}
|
|
74
|
-
return '';
|
|
75
|
-
}
|
|
76
|
-
}
|
|
77
|
-
// Cast return type to the superClass type passed in
|
|
78
|
-
return SelectionMixinClass;
|
|
79
|
-
};
|
|
80
|
-
//# sourceMappingURL=selection-mixin.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"selection-mixin.js","sourceRoot":"","sources":["../../../../src/components/input/mixins/selection-mixin.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAyCH;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAoC,UAAa,EAAE,EAAE;IACjF,MAAM,mBAAoB,SAAQ,UAAU;QAC1C;;WAEG;QACH,IAAc,YAAY;;YACxB,yDAAyD;YACzD,MAAM,WAAW,GAAG,MAAA,IAAI,CAAC,UAAU,0CAAE,aAAa,CAAC,yBAAyB,CAA2C,CAAC;YACxH,IAAI,WAAW,EAAE;gBACf,OAAO,WAAW,CAAC;aACpB;YAED,wBAAwB;YACxB,MAAM,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC,iBAAiB,CAA2C,CAAC;YAC9F,IAAI,CAAC,KAAK,EAAE;gBACV,MAAM,IAAI,KAAK,CAAC,sDAAsD,CAAC,CAAC;aACzE;YACD,OAAO,KAAK,CAAC;QACf,CAAC;QAED,SAAS;YACP,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC;YAChC,IAAI,KAAK,EAAE;gBACT,KAAK,CAAC,MAAM,EAAE,CAAC;aAChB;QACH,CAAC;QAED,WAAW,CAAC,KAAa,EAAE,GAAW;YACpC,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC;YAChC,IAAI,KAAK,IAAI,KAAK,CAAC,iBAAiB,EAAE;gBACpC,KAAK,CAAC,KAAK,EAAE,CAAC;gBACd,KAAK,CAAC,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;aACrC;QACH,CAAC;QAED,iBAAiB;YACf,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC;YAChC,IAAI,KAAK,IAAI,OAAO,KAAK,CAAC,cAAc,KAAK,QAAQ,EAAE;gBACrD,OAAO,KAAK,CAAC,cAAc,CAAC;aAC7B;YACD,OAAO,IAAI,CAAC;QACd,CAAC;QAED,iBAAiB,CAAC,QAAgB;YAChC,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC;YAChC,IAAI,KAAK,IAAI,KAAK,CAAC,iBAAiB,EAAE;gBACpC,KAAK,CAAC,KAAK,EAAE,CAAC;gBACd,KAAK,CAAC,iBAAiB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;aAC7C;QACH,CAAC;QAED,eAAe;YACb,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC;YAChC,IAAI,KAAK,IAAI,KAAK,CAAC,cAAc,KAAK,IAAI,IAAI,KAAK,CAAC,YAAY,KAAK,IAAI,EAAE;gBACzE,OAAO,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,cAAc,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC;aACxE;YACD,OAAO,EAAE,CAAC;QACZ,CAAC;KACF;IAED,oDAAoD;IACpD,OAAO,mBAAwD,CAAC;AAClE,CAAC,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2023 Nuraly, Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport { LitElement } from 'lit';\n\ntype Constructor<T = {}> = new (...args: any[]) => T;\n\n/**\n * Interface for components that support text selection operations\n */\nexport interface SelectionCapable {\n /**\n * Select all text in the input\n */\n selectAll(): void;\n\n /**\n * Select a range of text in the input\n * @param start - Start position\n * @param end - End position\n */\n selectRange(start: number, end: number): void;\n\n /**\n * Get the current cursor position\n * @returns The cursor position or null if not available\n */\n getCursorPosition(): number | null;\n\n /**\n * Set the cursor position\n * @param position - The position to set\n */\n setCursorPosition(position: number): void;\n\n /**\n * Get the currently selected text\n * @returns The selected text or empty string\n */\n getSelectedText(): string;\n}\n\n/**\n * Mixin that provides text selection capabilities to input components\n * \n * @param superClass - The base class to extend\n * @returns Enhanced class with selection capabilities\n * \n * @example\n * ```typescript\n * export class MyInput extends SelectionMixin(LitElement) {\n * @query('input') input!: HTMLInputElement;\n * \n * handleDoubleClick() {\n * this.selectAll();\n * }\n * }\n * ```\n */\nexport const SelectionMixin = <T extends Constructor<LitElement>>(superClass: T) => {\n class SelectionMixinClass extends superClass implements SelectionCapable {\n /**\n * Get the input element - must be implemented by the component\n */\n protected get inputElement(): HTMLInputElement | HTMLTextAreaElement {\n // Try to get from shadowRoot first (for custom elements)\n const shadowInput = this.shadowRoot?.querySelector('#input, input, textarea') as HTMLInputElement | HTMLTextAreaElement;\n if (shadowInput) {\n return shadowInput;\n }\n \n // Fallback to light DOM\n const input = this.querySelector('input, textarea') as HTMLInputElement | HTMLTextAreaElement;\n if (!input) {\n throw new Error('SelectionMixin requires an input or textarea element');\n }\n return input;\n }\n\n selectAll(): void {\n const input = this.inputElement;\n if (input) {\n input.select();\n }\n }\n\n selectRange(start: number, end: number): void {\n const input = this.inputElement;\n if (input && input.setSelectionRange) {\n input.focus();\n input.setSelectionRange(start, end);\n }\n }\n\n getCursorPosition(): number | null {\n const input = this.inputElement;\n if (input && typeof input.selectionStart === 'number') {\n return input.selectionStart;\n }\n return null;\n }\n\n setCursorPosition(position: number): void {\n const input = this.inputElement;\n if (input && input.setSelectionRange) {\n input.focus();\n input.setSelectionRange(position, position);\n }\n }\n\n getSelectedText(): string {\n const input = this.inputElement;\n if (input && input.selectionStart !== null && input.selectionEnd !== null) {\n return input.value.substring(input.selectionStart, input.selectionEnd);\n }\n return '';\n }\n }\n\n // Cast return type to the superClass type passed in\n return SelectionMixinClass as Constructor<SelectionCapable> & T;\n};\n"]}
|
package/react.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"react.d.ts","sourceRoot":"","sources":["../../../src/components/input/react.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,eAAO,MAAM,OAAO;;;;;;EAWlB,CAAC"}
|
package/test/hy-input_test.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"hy-input_test.d.ts","sourceRoot":"","sources":["../../../../src/components/input/test/hy-input_test.ts"],"names":[],"mappings":"AAGA,OAAO,oBAAoB,CAAC"}
|
package/test/hy-input_test.js
DELETED
|
@@ -1,159 +0,0 @@
|
|
|
1
|
-
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
2
|
-
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
3
|
-
return new (P || (P = Promise))(function (resolve, reject) {
|
|
4
|
-
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
5
|
-
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
6
|
-
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
7
|
-
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
8
|
-
});
|
|
9
|
-
};
|
|
10
|
-
import { html, fixture, expect } from '@open-wc/testing';
|
|
11
|
-
import { EMPTY_STRING } from '../input.types';
|
|
12
|
-
import '../input.component';
|
|
13
|
-
suite('NrInputElement', () => {
|
|
14
|
-
test('default properties', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
15
|
-
const el = yield fixture(html `<nr-input> </nr-input>`);
|
|
16
|
-
const inputContainer = el.shadowRoot.querySelector('#input-container');
|
|
17
|
-
const input = el.shadowRoot.querySelector('input');
|
|
18
|
-
const slot = el.shadowRoot.querySelector('slot');
|
|
19
|
-
const assignedNode = slot.assignedNodes();
|
|
20
|
-
expect(el.disabled).to.be.false;
|
|
21
|
-
expect(el.state).to.equal("default" /* INPUT_STATE.Default */);
|
|
22
|
-
expect(el.value).to.equal(EMPTY_STRING);
|
|
23
|
-
expect(el.size).to.equal("medium" /* INPUT_SIZE.Medium */);
|
|
24
|
-
expect(el.type).to.equal("text" /* INPUT_TYPE.TEXT */);
|
|
25
|
-
expect(el.placeholder).to.equal(EMPTY_STRING);
|
|
26
|
-
expect(el.min).to.be.undefined;
|
|
27
|
-
expect(el.max).to.be.undefined;
|
|
28
|
-
expect(el.step).to.be.undefined;
|
|
29
|
-
expect(input).to.not.have.attribute('min');
|
|
30
|
-
expect(input).to.not.have.attribute('max');
|
|
31
|
-
expect(input).to.not.have.attribute('step');
|
|
32
|
-
expect(input.disabled).to.be.false;
|
|
33
|
-
expect(input.type).to.equal("text" /* INPUT_TYPE.TEXT */);
|
|
34
|
-
expect(input.value).to.equal(EMPTY_STRING);
|
|
35
|
-
expect(input.placeholder).to.equal(EMPTY_STRING);
|
|
36
|
-
expect(inputContainer).to.have.attribute('data-size', "medium" /* INPUT_SIZE.Medium */);
|
|
37
|
-
expect(inputContainer.querySelector('#warning-icon')).to.be.null;
|
|
38
|
-
expect(inputContainer.querySelector('#error-icon')).to.be.null;
|
|
39
|
-
expect(inputContainer.querySelector('#password-icon')).to.be.null;
|
|
40
|
-
expect(inputContainer.querySelector('#number-icons')).to.be.null;
|
|
41
|
-
expect(assignedNode.length).to.equal(0);
|
|
42
|
-
}));
|
|
43
|
-
test('input type password', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
44
|
-
const el = yield fixture(html `<nr-input type="password"> </nr-input>`);
|
|
45
|
-
const inputContainer = el.shadowRoot.querySelector('#input-container');
|
|
46
|
-
let passwordIcon = inputContainer.querySelector('#password-icon');
|
|
47
|
-
expect(inputContainer.querySelector('#number-icons')).to.be.null;
|
|
48
|
-
expect(passwordIcon).to.exist;
|
|
49
|
-
expect(passwordIcon).to.have.attribute('name', 'eye');
|
|
50
|
-
passwordIcon.click();
|
|
51
|
-
yield el.updateComplete;
|
|
52
|
-
expect(el.inputType).to.equal('text');
|
|
53
|
-
passwordIcon = inputContainer.querySelector('#password-icon');
|
|
54
|
-
expect(passwordIcon).to.have.attribute('name', 'eye-slash');
|
|
55
|
-
}));
|
|
56
|
-
suite('input type number', () => {
|
|
57
|
-
test('init number input ', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
58
|
-
const step = 5;
|
|
59
|
-
const min = 10;
|
|
60
|
-
const max = 100;
|
|
61
|
-
const el = yield fixture(html `<nr-input type="number" step=${step} min=${min} max=${max}> </nr-input>`);
|
|
62
|
-
const inputContainer = el.shadowRoot.querySelector('#input-container');
|
|
63
|
-
const input = el.shadowRoot.querySelector('input');
|
|
64
|
-
const passwordIcon = inputContainer.querySelector('#password-icon');
|
|
65
|
-
const numberIcon = inputContainer.querySelector('#number-icons');
|
|
66
|
-
expect(passwordIcon).to.be.null;
|
|
67
|
-
expect(numberIcon).to.exist;
|
|
68
|
-
expect(input).to.have.attribute('min', min.toString());
|
|
69
|
-
expect(input).to.have.attribute('max', max.toString());
|
|
70
|
-
expect(input).to.have.attribute('step', step.toString());
|
|
71
|
-
}));
|
|
72
|
-
test('increment number', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
73
|
-
const step = 5;
|
|
74
|
-
const min = 10;
|
|
75
|
-
const el = yield fixture(html `<nr-input type="number" step=${step} min=${min}> </nr-input>`);
|
|
76
|
-
const inputContainer = el.shadowRoot.querySelector('#input-container');
|
|
77
|
-
const input = el.shadowRoot.querySelector('input');
|
|
78
|
-
const numberIcon = inputContainer.querySelector('#number-icons');
|
|
79
|
-
const plusButton = numberIcon.querySelector("[name='plus']");
|
|
80
|
-
plusButton.click();
|
|
81
|
-
expect(input.value).to.equal((min + step).toString());
|
|
82
|
-
}));
|
|
83
|
-
test('decrement number', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
84
|
-
const step = 5;
|
|
85
|
-
const el = yield fixture(html `<nr-input type="number" step=${step}> </nr-input>`);
|
|
86
|
-
const inputContainer = el.shadowRoot.querySelector('#input-container');
|
|
87
|
-
const input = el.shadowRoot.querySelector('input');
|
|
88
|
-
const inputValue = input.value;
|
|
89
|
-
const numberIcon = inputContainer.querySelector('#number-icons');
|
|
90
|
-
const minusButton = numberIcon.querySelector("[name='minus']");
|
|
91
|
-
minusButton.click();
|
|
92
|
-
expect(input.value).to.equal((+inputValue - step).toString());
|
|
93
|
-
}));
|
|
94
|
-
});
|
|
95
|
-
suite('input with state', () => {
|
|
96
|
-
test('warning input', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
97
|
-
const inputState = "warning" /* INPUT_STATE.Warning */;
|
|
98
|
-
const el = yield fixture(html `<nr-input state=${inputState}> </nr-input>`);
|
|
99
|
-
const inputContainer = el.shadowRoot.querySelector('#input-container');
|
|
100
|
-
expect(inputContainer.querySelector('#warning-icon')).to.exist;
|
|
101
|
-
expect(inputContainer.querySelector('#error-icon')).to.not.exist;
|
|
102
|
-
}));
|
|
103
|
-
test('error input', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
104
|
-
const inputState = "error" /* INPUT_STATE.Error */;
|
|
105
|
-
const el = yield fixture(html `<nr-input state=${inputState}> </nr-input>`);
|
|
106
|
-
const inputContainer = el.shadowRoot.querySelector('#input-container');
|
|
107
|
-
expect(inputContainer.querySelector('#warning-icon')).to.not.exist;
|
|
108
|
-
expect(inputContainer.querySelector('#error-icon')).to.exist;
|
|
109
|
-
}));
|
|
110
|
-
});
|
|
111
|
-
suite('input with size', () => {
|
|
112
|
-
test('large input', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
113
|
-
const inputSize = "large" /* INPUT_SIZE.Large */;
|
|
114
|
-
const el = yield fixture(html `<nr-input size=${inputSize}> </nr-input>`);
|
|
115
|
-
const inputContainer = el.shadowRoot.querySelector('#input-container');
|
|
116
|
-
expect(inputContainer).to.have.attribute('data-size', inputSize);
|
|
117
|
-
}));
|
|
118
|
-
test('medium input', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
119
|
-
const inputSize = "medium" /* INPUT_SIZE.Medium */;
|
|
120
|
-
const el = yield fixture(html `<nr-input size=${inputSize}> </nr-input>`);
|
|
121
|
-
const inputContainer = el.shadowRoot.querySelector('#input-container');
|
|
122
|
-
expect(inputContainer).to.have.attribute('data-size', inputSize);
|
|
123
|
-
}));
|
|
124
|
-
});
|
|
125
|
-
test('input with placeholder', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
126
|
-
const placeholder = 'text of placeholder';
|
|
127
|
-
const el = yield fixture(html `<nr-input placeholder=${placeholder}> </nr-input>`);
|
|
128
|
-
const input = el.shadowRoot.querySelector('input');
|
|
129
|
-
expect(input).to.have.attribute('placeholder', placeholder);
|
|
130
|
-
}));
|
|
131
|
-
test('input with label', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
132
|
-
const inputLabel = 'input label';
|
|
133
|
-
const el = yield fixture(html `<nr-input> <span slot="label">${inputLabel}</span> </nr-input>`);
|
|
134
|
-
const slot = el.shadowRoot.querySelector('slot');
|
|
135
|
-
const assignedNode = slot.assignedNodes();
|
|
136
|
-
expect(assignedNode[0]).to.have.attribute('slot', 'label');
|
|
137
|
-
expect(assignedNode[0].textContent).to.equal(inputLabel);
|
|
138
|
-
}));
|
|
139
|
-
test('input with helper text', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
140
|
-
const inputHelper = 'input helper';
|
|
141
|
-
const el = yield fixture(html `<nr-input> <span slot="helper-text">${inputHelper}</span> </nr-input>`);
|
|
142
|
-
const slot = el.shadowRoot.querySelectorAll('slot');
|
|
143
|
-
const assignedNode = slot[1].assignedNodes();
|
|
144
|
-
expect(assignedNode[0]).to.have.attribute('slot', 'helper-text');
|
|
145
|
-
expect(assignedNode[0].textContent).to.equal(inputHelper);
|
|
146
|
-
}));
|
|
147
|
-
test('input disabled', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
148
|
-
const el = yield fixture(html `<nr-input disabled></nr-input>`);
|
|
149
|
-
const input = el.shadowRoot.querySelector('input');
|
|
150
|
-
expect(input.disabled).to.be.true;
|
|
151
|
-
let inputFocus = false;
|
|
152
|
-
input.addEventListener('focus', () => {
|
|
153
|
-
inputFocus = true;
|
|
154
|
-
});
|
|
155
|
-
input.focus();
|
|
156
|
-
expect(inputFocus).to.equal(false);
|
|
157
|
-
}));
|
|
158
|
-
});
|
|
159
|
-
//# sourceMappingURL=hy-input_test.js.map
|