@nuralyui/input 0.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/demo/input-demo.d.ts +19 -0
- package/demo/input-demo.d.ts.map +1 -0
- package/demo/input-demo.js +339 -0
- package/demo/input-demo.js.map +1 -0
- package/index.d.ts +3 -0
- package/index.d.ts.map +1 -0
- package/index.js +3 -0
- package/index.js.map +1 -0
- package/input.component.d.ts +43 -0
- package/input.component.d.ts.map +1 -0
- package/input.component.js +189 -0
- package/input.component.js.map +1 -0
- package/input.constant.d.ts +18 -0
- package/input.constant.d.ts.map +1 -0
- package/input.constant.js +2 -0
- package/input.constant.js.map +1 -0
- package/input.style.d.ts +2 -0
- package/input.style.d.ts.map +1 -0
- package/input.style.js +199 -0
- package/input.style.js.map +1 -0
- package/package.json +12 -0
- package/react.d.ts +6 -0
- package/react.d.ts.map +1 -0
- package/react.js +13 -0
- package/react.js.map +1 -0
- package/test/hy-input_test.d.ts +2 -0
- package/test/hy-input_test.d.ts.map +1 -0
- package/test/hy-input_test.js +159 -0
- package/test/hy-input_test.js.map +1 -0
- package/validation.d.ts +3 -0
- package/validation.d.ts.map +1 -0
- package/validation.js +3 -0
- package/validation.js.map +1 -0
- package/variables.style.d.ts +2 -0
- package/variables.style.d.ts.map +1 -0
- package/variables.style.js +96 -0
- package/variables.style.js.map +1 -0
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2023 Google Laabidi Aymen
|
|
4
|
+
* SPDX-License-Identifier: MIT
|
|
5
|
+
*/
|
|
6
|
+
import { LitElement } from 'lit';
|
|
7
|
+
import '../input.component';
|
|
8
|
+
export declare class ElButtonDemoElement extends LitElement {
|
|
9
|
+
_changeHandler(_e: unknown): void;
|
|
10
|
+
_focusHandler(_e: unknown): void;
|
|
11
|
+
enterPressedHandler(e: CustomEvent): void;
|
|
12
|
+
render(): import("lit").TemplateResult<1>;
|
|
13
|
+
}
|
|
14
|
+
declare global {
|
|
15
|
+
interface HTMLElementTagNameMap {
|
|
16
|
+
'hy-inputs-demo': ElButtonDemoElement;
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
//# sourceMappingURL=input-demo.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"input-demo.d.ts","sourceRoot":"","sources":["../../../../src/components/input/demo/input-demo.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,UAAU,EAAO,MAAM,KAAK,CAAC;AAErC,OAAO,oBAAoB,CAAC;AAC5B,qBACa,mBAAoB,SAAQ,UAAU;IACjD,cAAc,CAAC,EAAE,EAAE,OAAO;IAI1B,aAAa,CAAC,EAAE,EAAE,OAAO;IAIzB,mBAAmB,CAAC,CAAC,EAAC,WAAW;IAGxB,MAAM;CAqThB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,mBAAmB,CAAC;KACvC;CACF"}
|
|
@@ -0,0 +1,339 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2023 Google Laabidi Aymen
|
|
4
|
+
* SPDX-License-Identifier: MIT
|
|
5
|
+
*/
|
|
6
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
7
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
8
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
9
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
10
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
11
|
+
};
|
|
12
|
+
import { LitElement, html } from 'lit';
|
|
13
|
+
import { customElement } from 'lit/decorators.js';
|
|
14
|
+
import '../input.component';
|
|
15
|
+
let ElButtonDemoElement = class ElButtonDemoElement extends LitElement {
|
|
16
|
+
_changeHandler(_e) {
|
|
17
|
+
console.log(_e);
|
|
18
|
+
}
|
|
19
|
+
_focusHandler(_e) {
|
|
20
|
+
console.log('e', _e);
|
|
21
|
+
}
|
|
22
|
+
enterPressedHandler(e) {
|
|
23
|
+
console.log('e ', e.detail.value);
|
|
24
|
+
}
|
|
25
|
+
render() {
|
|
26
|
+
return html ` <div>
|
|
27
|
+
<h3>Text input</h3>
|
|
28
|
+
<hy-input
|
|
29
|
+
placeholder="Enter your FullName"
|
|
30
|
+
size="large"
|
|
31
|
+
@input=${this._changeHandler}
|
|
32
|
+
@focused=${this._focusHandler}
|
|
33
|
+
@enter-pressed=${this.enterPressedHandler}
|
|
34
|
+
>
|
|
35
|
+
<span slot="label">Large input</span>
|
|
36
|
+
<span slot="helper-text">helper</span>
|
|
37
|
+
</hy-input>
|
|
38
|
+
<br />
|
|
39
|
+
<br />
|
|
40
|
+
|
|
41
|
+
<hy-input
|
|
42
|
+
placeholder="Enter your FullName"
|
|
43
|
+
withCopy=${true}
|
|
44
|
+
size="large"
|
|
45
|
+
@input=${this._changeHandler}
|
|
46
|
+
@focused=${this._focusHandler}
|
|
47
|
+
>
|
|
48
|
+
<span slot="label">Text input with copy</span>
|
|
49
|
+
<span slot="helper-text">helper</span>
|
|
50
|
+
</hy-input>
|
|
51
|
+
<br />
|
|
52
|
+
<br />
|
|
53
|
+
<hy-input
|
|
54
|
+
placeholder="Enter your FullName"
|
|
55
|
+
size="medium"
|
|
56
|
+
@valueChange=${this._changeHandler}
|
|
57
|
+
@focused=${this._focusHandler}
|
|
58
|
+
>
|
|
59
|
+
<span slot="label">Medium input</span>
|
|
60
|
+
<span slot="helper-text">helper</span>
|
|
61
|
+
</hy-input>
|
|
62
|
+
<br />
|
|
63
|
+
<br />
|
|
64
|
+
<hy-input
|
|
65
|
+
placeholder="Enter your FullName"
|
|
66
|
+
size="small"
|
|
67
|
+
@valueChange=${this._changeHandler}
|
|
68
|
+
@focused=${this._focusHandler}
|
|
69
|
+
>
|
|
70
|
+
<span slot="label">Small input</span>
|
|
71
|
+
<span slot="helper-text">helper</span>
|
|
72
|
+
</hy-input>
|
|
73
|
+
<br />
|
|
74
|
+
<br />
|
|
75
|
+
<hy-input size="small" @valueChange=${this._changeHandler} @focused=${this._focusHandler}>
|
|
76
|
+
<span slot="label">without placeholder</span>
|
|
77
|
+
</hy-input>
|
|
78
|
+
<br />
|
|
79
|
+
<br />
|
|
80
|
+
<hy-input
|
|
81
|
+
placeholder="Enter your FullName"
|
|
82
|
+
state="error"
|
|
83
|
+
size="large"
|
|
84
|
+
@valueChange=${this._changeHandler}
|
|
85
|
+
@focused=${this._focusHandler}
|
|
86
|
+
>
|
|
87
|
+
<span slot="label">Error input</span>
|
|
88
|
+
<span slot="helper-text">Error input helper</span>
|
|
89
|
+
</hy-input>
|
|
90
|
+
<br />
|
|
91
|
+
<br />
|
|
92
|
+
<hy-input
|
|
93
|
+
placeholder="Enter your FullName"
|
|
94
|
+
state="error"
|
|
95
|
+
size="large"
|
|
96
|
+
@valueChange=${this._changeHandler}
|
|
97
|
+
@focused=${this._focusHandler}
|
|
98
|
+
>
|
|
99
|
+
<span slot="label">Error input without helper</span>
|
|
100
|
+
</hy-input>
|
|
101
|
+
<br />
|
|
102
|
+
<br />
|
|
103
|
+
<hy-input
|
|
104
|
+
placeholder="Enter your FullName"
|
|
105
|
+
state="warning"
|
|
106
|
+
size="large"
|
|
107
|
+
@valueChange=${this._changeHandler}
|
|
108
|
+
@focused=${this._focusHandler}
|
|
109
|
+
>
|
|
110
|
+
<span slot="label">Warning input</span>
|
|
111
|
+
<span slot="helper-text">Warning input helper</span>
|
|
112
|
+
</hy-input>
|
|
113
|
+
<br />
|
|
114
|
+
<br />
|
|
115
|
+
<hy-input
|
|
116
|
+
placeholder="Enter your FullName"
|
|
117
|
+
state="warning"
|
|
118
|
+
size="large"
|
|
119
|
+
@valueChange=${this._changeHandler}
|
|
120
|
+
@focused=${this._focusHandler}
|
|
121
|
+
>
|
|
122
|
+
<span slot="label">Warning input without helper</span>
|
|
123
|
+
</hy-input>
|
|
124
|
+
<br />
|
|
125
|
+
<br />
|
|
126
|
+
<hy-input
|
|
127
|
+
placeholder="Enter your FullName"
|
|
128
|
+
disabled
|
|
129
|
+
state="error"
|
|
130
|
+
size="large"
|
|
131
|
+
@valueChange=${this._changeHandler}
|
|
132
|
+
@focused=${this._focusHandler}
|
|
133
|
+
>
|
|
134
|
+
<span slot="label">disabled input error </span>
|
|
135
|
+
<span slot="helper-text">helper</span>
|
|
136
|
+
</hy-input>
|
|
137
|
+
<br />
|
|
138
|
+
<br />
|
|
139
|
+
<hy-input
|
|
140
|
+
placeholder="Enter your FullName"
|
|
141
|
+
disabled
|
|
142
|
+
state="warning"
|
|
143
|
+
size="large"
|
|
144
|
+
@valueChange=${this._changeHandler}
|
|
145
|
+
@focused=${this._focusHandler}
|
|
146
|
+
>
|
|
147
|
+
<span slot="label">disabled input warning </span>
|
|
148
|
+
<span slot="helper-text">helper</span>
|
|
149
|
+
</hy-input>
|
|
150
|
+
<br />
|
|
151
|
+
<br />
|
|
152
|
+
<hy-input
|
|
153
|
+
placeholder="Enter your FullName"
|
|
154
|
+
size="large"
|
|
155
|
+
@valueChange=${this._changeHandler}
|
|
156
|
+
@focused=${this._focusHandler}
|
|
157
|
+
>
|
|
158
|
+
<span slot="helper-text">without label</span>
|
|
159
|
+
</hy-input>
|
|
160
|
+
<br /><br />
|
|
161
|
+
<hy-input
|
|
162
|
+
placeholder="Enter your FullName"
|
|
163
|
+
size="large"
|
|
164
|
+
@valueChange=${this._changeHandler}
|
|
165
|
+
@focused=${this._focusHandler}
|
|
166
|
+
>
|
|
167
|
+
</hy-input>
|
|
168
|
+
<br /><br />
|
|
169
|
+
|
|
170
|
+
<hy-input
|
|
171
|
+
?disabled=${true}
|
|
172
|
+
placeholder="Enter your FullName"
|
|
173
|
+
size="large"
|
|
174
|
+
@valueChange=${this._changeHandler}
|
|
175
|
+
@focused=${this._focusHandler}
|
|
176
|
+
>
|
|
177
|
+
<span slot="label">Disabled input</span>
|
|
178
|
+
</hy-input>
|
|
179
|
+
|
|
180
|
+
<br /><br />
|
|
181
|
+
<hy-input
|
|
182
|
+
placeholder="Enter your FullName"
|
|
183
|
+
?disabled=${true}
|
|
184
|
+
size="large"
|
|
185
|
+
@valueChange=${this._changeHandler}
|
|
186
|
+
@focused=${this._focusHandler}
|
|
187
|
+
>
|
|
188
|
+
<span slot="label">Disabled input with label and helper</span>
|
|
189
|
+
<span slot="helper-text">helper</span>
|
|
190
|
+
</hy-input>
|
|
191
|
+
|
|
192
|
+
<br /><br />
|
|
193
|
+
<h3>Password input</h3>
|
|
194
|
+
|
|
195
|
+
<hy-input
|
|
196
|
+
placeholder="your password please"
|
|
197
|
+
size="large"
|
|
198
|
+
type="password"
|
|
199
|
+
@valueChange=${this._changeHandler}
|
|
200
|
+
@focused=${this._focusHandler}
|
|
201
|
+
>
|
|
202
|
+
<span slot="label">Password input</span>
|
|
203
|
+
</hy-input>
|
|
204
|
+
<br /><br />
|
|
205
|
+
<hy-input
|
|
206
|
+
disabled
|
|
207
|
+
placeholder="your password please"
|
|
208
|
+
size="large"
|
|
209
|
+
type="password"
|
|
210
|
+
@valueChange=${this._changeHandler}
|
|
211
|
+
@focused=${this._focusHandler}
|
|
212
|
+
>
|
|
213
|
+
<span slot="label">Password input disabled</span>
|
|
214
|
+
</hy-input>
|
|
215
|
+
<br /><br />
|
|
216
|
+
<hy-input
|
|
217
|
+
placeholder="your password please"
|
|
218
|
+
size="large"
|
|
219
|
+
type="password"
|
|
220
|
+
state="error"
|
|
221
|
+
@valueChange=${this._changeHandler}
|
|
222
|
+
@focused=${this._focusHandler}
|
|
223
|
+
>
|
|
224
|
+
<span slot="label">Password input error</span>
|
|
225
|
+
</hy-input>
|
|
226
|
+
<br /><br />
|
|
227
|
+
<hy-input
|
|
228
|
+
placeholder="your password please"
|
|
229
|
+
disabled
|
|
230
|
+
size="large"
|
|
231
|
+
type="password"
|
|
232
|
+
state="error"
|
|
233
|
+
@valueChange=${this._changeHandler}
|
|
234
|
+
@focused=${this._focusHandler}
|
|
235
|
+
>
|
|
236
|
+
<span slot="label">Password input error disabled</span>
|
|
237
|
+
</hy-input>
|
|
238
|
+
<br /><br />
|
|
239
|
+
<hy-input
|
|
240
|
+
placeholder="your password please"
|
|
241
|
+
size="large"
|
|
242
|
+
type="password"
|
|
243
|
+
state="warning"
|
|
244
|
+
@valueChange=${this._changeHandler}
|
|
245
|
+
@focused=${this._focusHandler}
|
|
246
|
+
>
|
|
247
|
+
<span slot="label">Password input warning </span>
|
|
248
|
+
</hy-input>
|
|
249
|
+
<br /><br />
|
|
250
|
+
<hy-input
|
|
251
|
+
placeholder="your password please"
|
|
252
|
+
disabled
|
|
253
|
+
size="large"
|
|
254
|
+
type="password"
|
|
255
|
+
state="warning"
|
|
256
|
+
@valueChange=${this._changeHandler}
|
|
257
|
+
@focused=${this._focusHandler}
|
|
258
|
+
>
|
|
259
|
+
<span slot="label">Password input warning disabled</span>
|
|
260
|
+
</hy-input>
|
|
261
|
+
<br /><br />
|
|
262
|
+
<h3>Number input</h3>
|
|
263
|
+
|
|
264
|
+
<hy-input
|
|
265
|
+
placeholder="Enter your age"
|
|
266
|
+
size="large"
|
|
267
|
+
type="number"
|
|
268
|
+
@valueChange=${this._changeHandler}
|
|
269
|
+
@focused=${this._focusHandler}
|
|
270
|
+
>
|
|
271
|
+
<span slot="label">Default number input </span>
|
|
272
|
+
</hy-input>
|
|
273
|
+
|
|
274
|
+
<br /><br />
|
|
275
|
+
<hy-input
|
|
276
|
+
state="error"
|
|
277
|
+
placeholder="Enter your age"
|
|
278
|
+
size="large"
|
|
279
|
+
type="number"
|
|
280
|
+
@valueChange=${this._changeHandler}
|
|
281
|
+
@focused=${this._focusHandler}
|
|
282
|
+
>
|
|
283
|
+
<span slot="label">Number input error </span>
|
|
284
|
+
</hy-input>
|
|
285
|
+
<br /><br />
|
|
286
|
+
<hy-input
|
|
287
|
+
disabled
|
|
288
|
+
state="error"
|
|
289
|
+
placeholder="Enter your age"
|
|
290
|
+
size="large"
|
|
291
|
+
type="number"
|
|
292
|
+
@valueChange=${this._changeHandler}
|
|
293
|
+
@focused=${this._focusHandler}
|
|
294
|
+
>
|
|
295
|
+
<span slot="label">Number input error disabled</span>
|
|
296
|
+
</hy-input>
|
|
297
|
+
<br /><br />
|
|
298
|
+
<hy-input
|
|
299
|
+
state="warning"
|
|
300
|
+
placeholder="Enter your age"
|
|
301
|
+
size="large"
|
|
302
|
+
type="number"
|
|
303
|
+
@valueChange=${this._changeHandler}
|
|
304
|
+
@focused=${this._focusHandler}
|
|
305
|
+
>
|
|
306
|
+
<span slot="label">Number input warning </span>
|
|
307
|
+
</hy-input>
|
|
308
|
+
<br /><br />
|
|
309
|
+
<hy-input
|
|
310
|
+
disabled
|
|
311
|
+
state="warning"
|
|
312
|
+
placeholder="Enter your age"
|
|
313
|
+
size="large"
|
|
314
|
+
type="number"
|
|
315
|
+
@valueChange=${this._changeHandler}
|
|
316
|
+
@focused=${this._focusHandler}
|
|
317
|
+
>
|
|
318
|
+
<span slot="label">Number input warning disabled </span>
|
|
319
|
+
</hy-input>
|
|
320
|
+
<br /><br />
|
|
321
|
+
<hy-input
|
|
322
|
+
min="15"
|
|
323
|
+
max="100"
|
|
324
|
+
step="25"
|
|
325
|
+
size="large"
|
|
326
|
+
type="number"
|
|
327
|
+
@valueChange=${this._changeHandler}
|
|
328
|
+
@focused=${this._focusHandler}
|
|
329
|
+
>
|
|
330
|
+
<span slot="label">Number input with steps of 25, max 100 and min 15 </span>
|
|
331
|
+
</hy-input>
|
|
332
|
+
</div>`;
|
|
333
|
+
}
|
|
334
|
+
};
|
|
335
|
+
ElButtonDemoElement = __decorate([
|
|
336
|
+
customElement('hy-inputs-demo')
|
|
337
|
+
], ElButtonDemoElement);
|
|
338
|
+
export { ElButtonDemoElement };
|
|
339
|
+
//# sourceMappingURL=input-demo.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"input-demo.js","sourceRoot":"","sources":["../../../../src/components/input/demo/input-demo.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Google Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport {LitElement, html} from 'lit';\nimport {customElement} from 'lit/decorators.js';\nimport '../input.component';\n@customElement('hy-inputs-demo')\nexport class ElButtonDemoElement extends LitElement {\n _changeHandler(_e: unknown) {\n console.log(_e);\n }\n\n _focusHandler(_e: unknown) {\n console.log('e', _e);\n }\n\n enterPressedHandler(e:CustomEvent){\n console.log('e ',e.detail.value)\n }\n override render() {\n return html` <div>\n <h3>Text input</h3>\n <hy-input\n placeholder=\"Enter your FullName\"\n size=\"large\"\n @input=${this._changeHandler}\n @focused=${this._focusHandler}\n @enter-pressed=${this.enterPressedHandler}\n >\n <span slot=\"label\">Large input</span>\n <span slot=\"helper-text\">helper</span>\n </hy-input>\n <br />\n <br />\n\n <hy-input\n placeholder=\"Enter your FullName\"\n withCopy=${true}\n size=\"large\"\n @input=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Text input with copy</span>\n <span slot=\"helper-text\">helper</span>\n </hy-input>\n <br />\n <br />\n <hy-input\n placeholder=\"Enter your FullName\"\n size=\"medium\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Medium input</span>\n <span slot=\"helper-text\">helper</span>\n </hy-input>\n <br />\n <br />\n <hy-input\n placeholder=\"Enter your FullName\"\n size=\"small\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Small input</span>\n <span slot=\"helper-text\">helper</span>\n </hy-input>\n <br />\n <br />\n <hy-input size=\"small\" @valueChange=${this._changeHandler} @focused=${this._focusHandler}>\n <span slot=\"label\">without placeholder</span>\n </hy-input>\n <br />\n <br />\n <hy-input\n placeholder=\"Enter your FullName\"\n state=\"error\"\n size=\"large\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Error input</span>\n <span slot=\"helper-text\">Error input helper</span>\n </hy-input>\n <br />\n <br />\n <hy-input\n placeholder=\"Enter your FullName\"\n state=\"error\"\n size=\"large\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Error input without helper</span>\n </hy-input>\n <br />\n <br />\n <hy-input\n placeholder=\"Enter your FullName\"\n state=\"warning\"\n size=\"large\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Warning input</span>\n <span slot=\"helper-text\">Warning input helper</span>\n </hy-input>\n <br />\n <br />\n <hy-input\n placeholder=\"Enter your FullName\"\n state=\"warning\"\n size=\"large\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Warning input without helper</span>\n </hy-input>\n <br />\n <br />\n <hy-input\n placeholder=\"Enter your FullName\"\n disabled\n state=\"error\"\n size=\"large\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">disabled input error </span>\n <span slot=\"helper-text\">helper</span>\n </hy-input>\n <br />\n <br />\n <hy-input\n placeholder=\"Enter your FullName\"\n disabled\n state=\"warning\"\n size=\"large\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">disabled input warning </span>\n <span slot=\"helper-text\">helper</span>\n </hy-input>\n <br />\n <br />\n <hy-input\n placeholder=\"Enter your FullName\"\n size=\"large\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"helper-text\">without label</span>\n </hy-input>\n <br /><br />\n <hy-input\n placeholder=\"Enter your FullName\"\n size=\"large\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n </hy-input>\n <br /><br />\n\n <hy-input\n ?disabled=${true}\n placeholder=\"Enter your FullName\"\n size=\"large\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Disabled input</span>\n </hy-input>\n\n <br /><br />\n <hy-input\n placeholder=\"Enter your FullName\"\n ?disabled=${true}\n size=\"large\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Disabled input with label and helper</span>\n <span slot=\"helper-text\">helper</span>\n </hy-input>\n\n <br /><br />\n <h3>Password input</h3>\n\n <hy-input\n placeholder=\"your password please\"\n size=\"large\"\n type=\"password\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Password input</span>\n </hy-input>\n <br /><br />\n <hy-input\n disabled\n placeholder=\"your password please\"\n size=\"large\"\n type=\"password\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Password input disabled</span>\n </hy-input>\n <br /><br />\n <hy-input\n placeholder=\"your password please\"\n size=\"large\"\n type=\"password\"\n state=\"error\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Password input error</span>\n </hy-input>\n <br /><br />\n <hy-input\n placeholder=\"your password please\"\n disabled\n size=\"large\"\n type=\"password\"\n state=\"error\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Password input error disabled</span>\n </hy-input>\n <br /><br />\n <hy-input\n placeholder=\"your password please\"\n size=\"large\"\n type=\"password\"\n state=\"warning\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Password input warning </span>\n </hy-input>\n <br /><br />\n <hy-input\n placeholder=\"your password please\"\n disabled\n size=\"large\"\n type=\"password\"\n state=\"warning\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Password input warning disabled</span>\n </hy-input>\n <br /><br />\n <h3>Number input</h3>\n\n <hy-input\n placeholder=\"Enter your age\"\n size=\"large\"\n type=\"number\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Default number input </span>\n </hy-input>\n\n <br /><br />\n <hy-input\n state=\"error\"\n placeholder=\"Enter your age\"\n size=\"large\"\n type=\"number\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Number input error </span>\n </hy-input>\n <br /><br />\n <hy-input\n disabled\n state=\"error\"\n placeholder=\"Enter your age\"\n size=\"large\"\n type=\"number\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Number input error disabled</span>\n </hy-input>\n <br /><br />\n <hy-input\n state=\"warning\"\n placeholder=\"Enter your age\"\n size=\"large\"\n type=\"number\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Number input warning </span>\n </hy-input>\n <br /><br />\n <hy-input\n disabled\n state=\"warning\"\n placeholder=\"Enter your age\"\n size=\"large\"\n type=\"number\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Number input warning disabled </span>\n </hy-input>\n <br /><br />\n <hy-input\n min=\"15\"\n max=\"100\"\n step=\"25\"\n size=\"large\"\n type=\"number\"\n @valueChange=${this._changeHandler}\n @focused=${this._focusHandler}\n >\n <span slot=\"label\">Number input with steps of 25, max 100 and min 15 </span>\n </hy-input>\n </div>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hy-inputs-demo': ElButtonDemoElement;\n }\n}\n"]}
|
package/index.d.ts
ADDED
package/index.d.ts.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/input/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC;AACrC,OAAO,KAAK,WAAW,MAAM,iBAAiB,CAAC"}
|
package/index.js
ADDED
package/index.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/input/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC;AACrC,OAAO,KAAK,WAAW,MAAM,iBAAiB,CAAC","sourcesContent":["export * from './input.component.js';\nexport * as Validations from './validation.js';"]}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2023 Google Laabidi Aymen
|
|
4
|
+
* SPDX-License-Identifier: MIT
|
|
5
|
+
*/
|
|
6
|
+
/// <reference types="react" />
|
|
7
|
+
import { LitElement, PropertyValues } from 'lit';
|
|
8
|
+
import { INPUT_TYPE, INPUT_STATE, INPUT_SIZE } from './input.constant.js';
|
|
9
|
+
export declare class HyInputElement extends LitElement {
|
|
10
|
+
disabled: boolean;
|
|
11
|
+
state: INPUT_STATE;
|
|
12
|
+
value: string;
|
|
13
|
+
size: INPUT_SIZE;
|
|
14
|
+
type: INPUT_TYPE;
|
|
15
|
+
step: string;
|
|
16
|
+
min: string;
|
|
17
|
+
max: string;
|
|
18
|
+
placeholder: string;
|
|
19
|
+
withCopy: boolean;
|
|
20
|
+
inputType: string;
|
|
21
|
+
input: HTMLInputElement;
|
|
22
|
+
willUpdate(_changedProperties: PropertyValues): void;
|
|
23
|
+
private _increment;
|
|
24
|
+
private _decrement;
|
|
25
|
+
private _valueChange;
|
|
26
|
+
private handleKeyDown;
|
|
27
|
+
private onCopy;
|
|
28
|
+
private _focusEvent;
|
|
29
|
+
_togglePasswordIcon(): void;
|
|
30
|
+
render(): import("lit").TemplateResult<1>;
|
|
31
|
+
static styles: import("lit").CSSResult[];
|
|
32
|
+
}
|
|
33
|
+
declare global {
|
|
34
|
+
interface HTMLElementTagNameMap {
|
|
35
|
+
'hy-input': HyInputElement;
|
|
36
|
+
}
|
|
37
|
+
namespace JSX {
|
|
38
|
+
interface IntrinsicElements {
|
|
39
|
+
'hy-input': React.DetailedHTMLProps<React.HTMLAttributes<HyInputElement>, HyInputElement> | Partial<HyInputElement>;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
//# sourceMappingURL=input.component.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"input.component.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.component.ts"],"names":[],"mappings":"AACA;;;;GAIG;;AAEH,OAAO,EAAC,UAAU,EAAE,cAAc,EAAgB,MAAM,KAAK,CAAC;AAG9D,OAAO,EAAC,UAAU,EAAE,WAAW,EAAE,UAAU,EAAe,MAAM,qBAAqB,CAAC;AAGtF,qBACa,cAAe,SAAQ,UAAU;IAI5C,QAAQ,UAAS;IAGjB,KAAK,cAAuB;IAG5B,KAAK,SAAgB;IAGrB,IAAI,aAAqB;IAGzB,IAAI,aAAmB;IAGvB,IAAI,EAAG,MAAM,CAAC;IAGd,GAAG,EAAG,MAAM,CAAC;IAGb,GAAG,EAAG,MAAM,CAAC;IAGb,WAAW,SAAgB;IAG3B,QAAQ,UAAS;IAGjB,SAAS,SAAgB;IAGzB,KAAK,EAAG,gBAAgB,CAAC;IAEhB,UAAU,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAO7D,OAAO,CAAC,UAAU;IAQlB,OAAO,CAAC,UAAU;IAUlB,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,aAAa;IASrB,OAAO,CAAC,MAAM;IAMd,OAAO,CAAC,WAAW;IAQnB,mBAAmB;IAKV,MAAM;IAuEf,OAAgB,MAAM,4BAAU;CACjC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,cAAc,CAAC;KAC5B;IAED,UAAU,GAAG,CAAC;QACZ,UAAU,iBAAiB;YACzB,UAAU,EACN,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,cAAc,CAAC,GAC7E,OAAO,CAAC,cAAc,CAAC,CAAC;SAC7B;KACF;CACF"}
|
|
@@ -0,0 +1,189 @@
|
|
|
1
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
2
|
+
/**
|
|
3
|
+
* @license
|
|
4
|
+
* Copyright 2023 Google Laabidi Aymen
|
|
5
|
+
* SPDX-License-Identifier: MIT
|
|
6
|
+
*/
|
|
7
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
8
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
9
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
10
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
11
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
12
|
+
};
|
|
13
|
+
import { LitElement, html, nothing } from 'lit';
|
|
14
|
+
import { customElement, property, query, state } from 'lit/decorators.js';
|
|
15
|
+
import { styles } from './input.style.js';
|
|
16
|
+
import { EMPTY_STRING } from './input.constant.js';
|
|
17
|
+
import { choose } from 'lit/directives/choose.js';
|
|
18
|
+
let HyInputElement = class HyInputElement extends LitElement {
|
|
19
|
+
constructor() {
|
|
20
|
+
// W3C standards
|
|
21
|
+
super(...arguments);
|
|
22
|
+
this.disabled = false;
|
|
23
|
+
this.state = "default" /* INPUT_STATE.Default */;
|
|
24
|
+
this.value = EMPTY_STRING;
|
|
25
|
+
this.size = "medium" /* INPUT_SIZE.Medium */;
|
|
26
|
+
this.type = "text" /* INPUT_TYPE.TEXT */;
|
|
27
|
+
this.placeholder = EMPTY_STRING;
|
|
28
|
+
this.withCopy = false;
|
|
29
|
+
this.inputType = EMPTY_STRING;
|
|
30
|
+
}
|
|
31
|
+
willUpdate(_changedProperties) {
|
|
32
|
+
if (_changedProperties.has('type')) {
|
|
33
|
+
this.inputType = this.type;
|
|
34
|
+
if (this.inputType == "number" /* INPUT_TYPE.NUMBER */)
|
|
35
|
+
if (this.min && !this.value)
|
|
36
|
+
this.value = this.min;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
_increment() {
|
|
40
|
+
this.input.stepUp();
|
|
41
|
+
this.dispatchEvent(new CustomEvent('valueChange', {
|
|
42
|
+
detail: this.input,
|
|
43
|
+
}));
|
|
44
|
+
}
|
|
45
|
+
_decrement() {
|
|
46
|
+
this.input.stepDown();
|
|
47
|
+
this.dispatchEvent(new CustomEvent('valueChange', {
|
|
48
|
+
detail: this.input,
|
|
49
|
+
}));
|
|
50
|
+
}
|
|
51
|
+
_valueChange(e) {
|
|
52
|
+
this.dispatchEvent(new CustomEvent('valueChange', {
|
|
53
|
+
detail: e.target,
|
|
54
|
+
}));
|
|
55
|
+
}
|
|
56
|
+
handleKeyDown(keyDownEvent) {
|
|
57
|
+
if (keyDownEvent.key === 'Enter') {
|
|
58
|
+
this.dispatchEvent(new CustomEvent('enter-pressed', {
|
|
59
|
+
detail: keyDownEvent.target,
|
|
60
|
+
}));
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
onCopy() {
|
|
64
|
+
const input = this.shadowRoot.getElementById('input');
|
|
65
|
+
input.select();
|
|
66
|
+
navigator.clipboard.writeText(input.value);
|
|
67
|
+
}
|
|
68
|
+
_focusEvent(e) {
|
|
69
|
+
this.dispatchEvent(new CustomEvent('focused', {
|
|
70
|
+
detail: e.target,
|
|
71
|
+
}));
|
|
72
|
+
}
|
|
73
|
+
_togglePasswordIcon() {
|
|
74
|
+
if (this.inputType == "password" /* INPUT_TYPE.PASSWORD */)
|
|
75
|
+
this.inputType = "text" /* INPUT_TYPE.TEXT */;
|
|
76
|
+
else if (this.inputType == "text" /* INPUT_TYPE.TEXT */)
|
|
77
|
+
this.inputType = "password" /* INPUT_TYPE.PASSWORD */;
|
|
78
|
+
}
|
|
79
|
+
render() {
|
|
80
|
+
return html `
|
|
81
|
+
<slot name="label"></slot>
|
|
82
|
+
<div data-size=${this.size} id="input-container">
|
|
83
|
+
<input
|
|
84
|
+
id="input"
|
|
85
|
+
.disabled=${this.disabled}
|
|
86
|
+
.value=${this.value}
|
|
87
|
+
.placeholder=${this.placeholder}
|
|
88
|
+
.step=${this.step ? this.step : nothing}
|
|
89
|
+
.min=${this.min ? this.min : nothing}
|
|
90
|
+
.max=${this.max ? this.max : nothing}
|
|
91
|
+
.type="${this.inputType}"
|
|
92
|
+
@input=${this._valueChange}
|
|
93
|
+
@focus=${this._focusEvent}
|
|
94
|
+
@keydown=${this.handleKeyDown}
|
|
95
|
+
/>
|
|
96
|
+
${this.withCopy
|
|
97
|
+
? html `<hy-icon
|
|
98
|
+
name="copy"
|
|
99
|
+
type="regular"
|
|
100
|
+
id="copy-icon"
|
|
101
|
+
@click=${!this.disabled ? this.onCopy : nothing}
|
|
102
|
+
></hy-icon>`
|
|
103
|
+
: nothing}
|
|
104
|
+
${choose(this.state, [
|
|
105
|
+
["default" /* INPUT_STATE.Default */, () => undefined],
|
|
106
|
+
["warning" /* INPUT_STATE.Warning */, () => html `<hy-icon name="warning" id="warning-icon"></hy-icon>`],
|
|
107
|
+
["error" /* INPUT_STATE.Error */, () => html `<hy-icon name="exclamation-circle" id="error-icon"></hy-icon>`],
|
|
108
|
+
])}
|
|
109
|
+
${this.state == "default" /* INPUT_STATE.Default */ && this.type == "calendar" /* INPUT_TYPE.CALENDAR */
|
|
110
|
+
? html `<hy-icon name="calendar" type="regular" id="calendar-icon"></hy-icon>`
|
|
111
|
+
: nothing}
|
|
112
|
+
${this.type == "password" /* INPUT_TYPE.PASSWORD */
|
|
113
|
+
? choose(this.inputType, [
|
|
114
|
+
[
|
|
115
|
+
"text" /* INPUT_TYPE.TEXT */,
|
|
116
|
+
() => html `<hy-icon
|
|
117
|
+
name="eye-slash"
|
|
118
|
+
type="regular"
|
|
119
|
+
id="password-icon"
|
|
120
|
+
@click=${!this.disabled ? this._togglePasswordIcon : nothing}
|
|
121
|
+
></hy-icon>`,
|
|
122
|
+
],
|
|
123
|
+
[
|
|
124
|
+
"password" /* INPUT_TYPE.PASSWORD */,
|
|
125
|
+
() => html `<hy-icon
|
|
126
|
+
name="eye"
|
|
127
|
+
type="regular"
|
|
128
|
+
id="password-icon"
|
|
129
|
+
@click=${!this.disabled ? this._togglePasswordIcon : nothing}
|
|
130
|
+
></hy-icon>`,
|
|
131
|
+
],
|
|
132
|
+
])
|
|
133
|
+
: this.type == "number" /* INPUT_TYPE.NUMBER */
|
|
134
|
+
? html `
|
|
135
|
+
<div id="number-icons">
|
|
136
|
+
${this.state != "default" /* INPUT_STATE.Default */ ? html `<span id="icons-separator">|</span>` : nothing}
|
|
137
|
+
<hy-icon name="minus" @click=${!this.disabled ? this._decrement : nothing}></hy-icon>
|
|
138
|
+
<span id="icons-separator">|</span>
|
|
139
|
+
<hy-icon name="plus" @click=${!this.disabled ? this._increment : nothing}></hy-icon>
|
|
140
|
+
</div>
|
|
141
|
+
`
|
|
142
|
+
: nothing}
|
|
143
|
+
</div>
|
|
144
|
+
<slot name="helper-text"></slot>
|
|
145
|
+
`;
|
|
146
|
+
}
|
|
147
|
+
};
|
|
148
|
+
HyInputElement.styles = styles;
|
|
149
|
+
__decorate([
|
|
150
|
+
property({ type: Boolean, reflect: true })
|
|
151
|
+
], HyInputElement.prototype, "disabled", void 0);
|
|
152
|
+
__decorate([
|
|
153
|
+
property({ type: String, reflect: true })
|
|
154
|
+
], HyInputElement.prototype, "state", void 0);
|
|
155
|
+
__decorate([
|
|
156
|
+
property({ type: String })
|
|
157
|
+
], HyInputElement.prototype, "value", void 0);
|
|
158
|
+
__decorate([
|
|
159
|
+
property({ type: String })
|
|
160
|
+
], HyInputElement.prototype, "size", void 0);
|
|
161
|
+
__decorate([
|
|
162
|
+
property({ reflect: true })
|
|
163
|
+
], HyInputElement.prototype, "type", void 0);
|
|
164
|
+
__decorate([
|
|
165
|
+
property({ type: String })
|
|
166
|
+
], HyInputElement.prototype, "step", void 0);
|
|
167
|
+
__decorate([
|
|
168
|
+
property({ type: String })
|
|
169
|
+
], HyInputElement.prototype, "min", void 0);
|
|
170
|
+
__decorate([
|
|
171
|
+
property({ type: String })
|
|
172
|
+
], HyInputElement.prototype, "max", void 0);
|
|
173
|
+
__decorate([
|
|
174
|
+
property({ type: String })
|
|
175
|
+
], HyInputElement.prototype, "placeholder", void 0);
|
|
176
|
+
__decorate([
|
|
177
|
+
property()
|
|
178
|
+
], HyInputElement.prototype, "withCopy", void 0);
|
|
179
|
+
__decorate([
|
|
180
|
+
state()
|
|
181
|
+
], HyInputElement.prototype, "inputType", void 0);
|
|
182
|
+
__decorate([
|
|
183
|
+
query('#input')
|
|
184
|
+
], HyInputElement.prototype, "input", void 0);
|
|
185
|
+
HyInputElement = __decorate([
|
|
186
|
+
customElement('hy-input')
|
|
187
|
+
], HyInputElement);
|
|
188
|
+
export { HyInputElement };
|
|
189
|
+
//# sourceMappingURL=input.component.js.map
|