@nuralyui/input 0.0.4 → 0.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/demo/input-demo.d.ts +1 -1
  2. package/demo/input-demo.d.ts.map +1 -1
  3. package/demo/input-demo.js +109 -109
  4. package/demo/input-demo.js.map +1 -1
  5. package/input.component.d.ts +40 -21
  6. package/input.component.d.ts.map +1 -1
  7. package/input.component.js +306 -114
  8. package/input.component.js.map +1 -1
  9. package/input.style.d.ts.map +1 -1
  10. package/input.style.js +347 -95
  11. package/input.style.js.map +1 -1
  12. package/{variables.style.d.ts → input.style.variable.d.ts} +1 -1
  13. package/input.style.variable.d.ts.map +1 -0
  14. package/{variables.style.js → input.style.variable.js} +51 -26
  15. package/input.style.variable.js.map +1 -0
  16. package/{input.constant.d.ts → input.types.d.ts} +1 -1
  17. package/input.types.d.ts.map +1 -0
  18. package/input.types.js +2 -0
  19. package/input.types.js.map +1 -0
  20. package/package.json +1 -1
  21. package/react.d.ts +7 -4
  22. package/react.d.ts.map +1 -1
  23. package/react.js +9 -6
  24. package/react.js.map +1 -1
  25. package/test/hy-input_test.js +15 -15
  26. package/test/hy-input_test.js.map +1 -1
  27. package/utils/index.d.ts +8 -0
  28. package/utils/index.d.ts.map +1 -0
  29. package/utils/index.js +8 -0
  30. package/utils/index.js.map +1 -0
  31. package/utils/input-renderers.d.ts +50 -0
  32. package/utils/input-renderers.d.ts.map +1 -0
  33. package/utils/input-renderers.js +157 -0
  34. package/utils/input-renderers.js.map +1 -0
  35. package/utils/input-validation.utils.d.ts +26 -0
  36. package/utils/input-validation.utils.d.ts.map +1 -0
  37. package/utils/input-validation.utils.js +105 -0
  38. package/utils/input-validation.utils.js.map +1 -0
  39. package/input.constant.d.ts.map +0 -1
  40. package/input.constant.js +0 -2
  41. package/input.constant.js.map +0 -1
  42. package/variables.style.d.ts.map +0 -1
  43. package/variables.style.js.map +0 -1
@@ -39,10 +39,10 @@ export const styleVariables = css `
39
39
  --hybrid-input-local-number-icons-color: #000000;
40
40
  --hybrid-input-local-password-icon-padding-left: 8px;
41
41
  --hybrid-input-local-password-icon-padding-right: 8px;
42
- --hybrid-input-local-number-icons-sperator-color: #e0e0e0;
43
- --hybrid-input-local-number-icons-sperator-padding-bottom: 4px;
44
- --hybrid-input-local-number-icons-sperator-padding-left: 5px;
45
- --hybrid-input-local-number-icons-sperator-padding-right: 5px;
42
+ --hybrid-input-local-number-icons-separator-color: #e0e0e0;
43
+ --hybrid-input-local-number-icons-separator-padding-bottom: 4px;
44
+ --hybrid-input-local-number-icons-separator-padding-left: 5px;
45
+ --hybrid-input-local-number-icons-separator-padding-right: 5px;
46
46
  --hybrid-input-local-copy-icon-padding-right:5px;
47
47
 
48
48
  --hybrid-input-local-number-icons-container-width: 70px;
@@ -68,29 +68,54 @@ export const styleVariables = css `
68
68
  --hybrid-input-local-small-padding-bottom: 4px;
69
69
  --hybrid-input-local-small-padding-left: 9px;
70
70
  --hybrid-input-local-small-padding-right: 4px;
71
+
72
+ /* Prefix and Suffix styling variables */
73
+ --hybrid-input-local-prefix-color: #525252;
74
+ --hybrid-input-local-prefix-font-size: 13px;
75
+ --hybrid-input-local-prefix-padding-right: 8px;
76
+ --hybrid-input-local-suffix-color: #525252;
77
+ --hybrid-input-local-suffix-font-size: 13px;
78
+ --hybrid-input-local-suffix-padding-left: 8px;
79
+ --hybrid-input-local-disabled-prefix-suffix-color: #c6c6c6;
80
+
81
+ /* Addon Before/After styling variables */
82
+ --hybrid-input-local-addon-background-color: #e8e8e8;
83
+ --hybrid-input-local-addon-color: #525252;
84
+ --hybrid-input-local-addon-padding: 8px 12px;
71
85
  }
72
86
 
73
- @media (prefers-color-scheme: dark) {
74
- :host {
75
- --hybrid-input-local-background-color: #393939;
76
- --hybrid-input-local-focus-border: 2px solid #ffffff;
77
- --hybrid-input-local-text-color: #ffffff;
78
- --hybrid-input-local-error-border: 2px solid #fa4d56;
79
- --hybrid-input-local-error-helper-text-color: #ffb3b8;
80
- --hybrid-input-local-disabled-background-color: #393939;
81
- --hybrid-input-local-disabled-placeholder-color: #6f6f6f;
82
- --hybrid-input-local-disabled-helper-text-color: #6f6f6f;
83
- --hybrid-input-local-disabled-label-color: #6f6f6f;
84
- --hybrid-input-local-warning-icon-color: #f0c300;
85
- --hybrid-input-local-error-icon-color: #da1e28;
86
- --hybrid-input-local-password-icon-color: #ffffff;
87
- --hybrid-input-local-number-icons-color: #ffffff;
88
- --hybrid-input-local-label-color: #c6c6c6;
89
- --hybrid-input-local-helper-text-color: #c6c6c6;
90
- --hybrid-input-local-number-icon-sperator-color: #525252;
91
- --hybrid-input-local-calendar-icon-color: #ffffff;
92
- --hybrid-input-local-copy-icon-color: #ffffff;
93
- }
87
+ /*
88
+ * These override the light theme defaults when data-theme="dark" is applied
89
+ * This provides explicit theme control via JavaScript or HTML attributes
90
+ */
91
+ .input-wrapper[data-theme="dark"] {
92
+ --hybrid-input-local-background-color: #393939;
93
+ --hybrid-input-local-focus-border: 2px solid #ffffff;
94
+ --hybrid-input-local-text-color: #ffffff;
95
+ --hybrid-input-local-error-border: 2px solid #fa4d56;
96
+ --hybrid-input-local-error-helper-text-color: #ffb3b8;
97
+ --hybrid-input-local-disabled-background-color: #393939;
98
+ --hybrid-input-local-disabled-placeholder-color: #6f6f6f;
99
+ --hybrid-input-local-disabled-helper-text-color: #6f6f6f;
100
+ --hybrid-input-local-disabled-label-color: #6f6f6f;
101
+ --hybrid-input-local-warning-icon-color: #f0c300;
102
+ --hybrid-input-local-error-icon-color: #da1e28;
103
+ --hybrid-input-local-password-icon-color: #ffffff;
104
+ --hybrid-input-local-number-icons-color: #ffffff;
105
+ --hybrid-input-local-label-color: #c6c6c6;
106
+ --hybrid-input-local-helper-text-color: #c6c6c6;
107
+ --hybrid-input-local-number-icons-separator-color: #525252;
108
+ --hybrid-input-local-calendar-icon-color: #ffffff;
109
+ --hybrid-input-local-copy-icon-color: #ffffff;
110
+
111
+ /* Dark theme prefix and suffix colors */
112
+ --hybrid-input-local-prefix-color: #c6c6c6;
113
+ --hybrid-input-local-suffix-color: #c6c6c6;
114
+ --hybrid-input-local-disabled-prefix-suffix-color: #6f6f6f;
115
+
116
+ /* Dark theme addon colors */
117
+ --hybrid-input-local-addon-background-color: #525252;
118
+ --hybrid-input-local-addon-color: #c6c6c6;
94
119
  }
95
120
  `;
96
- //# sourceMappingURL=variables.style.js.map
121
+ //# sourceMappingURL=input.style.variable.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"input.style.variable.js","sourceRoot":"","sources":["../../../src/components/input/input.style.variable.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsHhC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styleVariables = css`\n :host {\n --hybrid-input-local-background-color: #f4f4f4;\n --hybrid-input-local-text-color: #000000;\n --hybrid-input-local-font-family: Inter, ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Ubuntu, Cantarell, \"Noto Sans\", sans-serif, \"system-ui\", \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, SFProLocalRange;\n --hybrid-input-local-font-size:13px;\n --hybrid-input-local-label-color: #525252;\n --hybrid-input-local-placeholder-color: #a8a8a8;\n --hybrid-input-local-border-bottom: 2px solid #a8a8a8;\n --hybrid-input-local-border-top: 2px solid transparent;\n --hybrid-input-local-border-left: 2px solid transparent;\n --hybrid-input-local-border-right: 2px solid transparent;\n --hybrid-input-local-disabled-border-bottom: none;\n --hybrid-input-local-disabled-border-top: none;\n --hybrid-input-local-disabled-border-left: none;\n --hybrid-input-local-disabled-border-right: none;\n --hybrid-input-local-focus-border: 2px solid #0f62fe;\n --hybrid-input-local-border-radius: 0px;\n --hybrid-input-local-label-font-size: 13px;\n --hybrid-input-local-helper-text-color: #525252;\n --hybrid-input-local-helper-text-font-size: 13px;\n --hybrid-input-local-placeholder-font-size: 13px;\n --hybrid-input-label-padding-bottom: 5px;\n --hybrid-input-local-helper-text-padding-top: 5px;\n --hybrid-input-local-disabled-background-color: #f4f4f4;\n --hybrid-input-local-disabled-placeholder-color: #c6c6c6;\n --hybrid-input-local-error-helper-text-color: #da1e28;\n --hybrid-input-local-error-border: 2px solid #da1e28;\n --hybrid-input-local-warning-helper-text-color: #161616;\n --hybrid-input-local-disabled-helper-text-color: #c6c6c6;\n --hybrid-input-local-disabled-label-color: #c6c6c6;\n --hybrid-input-local-warning-icon-color: #f0c300;\n --hybrid-input-local-error-icon-color: #da1e28;\n --hybrid-input-local-password-icon-color: #000000;\n --hybrid-input-local-calendar-icon-color: #000000;\n --hybrid-input-local-copy-icon-color: #000000;\n --hybrid-input-local-disabled-icon-opacity: 0.4;\n --hybrid-input-local-number-icons-color: #000000;\n --hybrid-input-local-password-icon-padding-left: 8px;\n --hybrid-input-local-password-icon-padding-right: 8px;\n --hybrid-input-local-number-icons-separator-color: #e0e0e0;\n --hybrid-input-local-number-icons-separator-padding-bottom: 4px;\n --hybrid-input-local-number-icons-separator-padding-left: 5px;\n --hybrid-input-local-number-icons-separator-padding-right: 5px;\n --hybrid-input-local-copy-icon-padding-right:5px;\n\n --hybrid-input-local-number-icons-container-width: 70px;\n --hybrid-input-local-number-icons-container-padding-left: 5px;\n --hybrid-input-local-number-icons-container-padding-right: 5px;\n --hybrid-input-local-number-icons-width: 12px;\n --hybrid-input-local-number-icons-height: 12px;\n\n --hybrid-input-local-number-icons-padding-left: 4px;\n --hybrid-input-local-number-icons-padding-right: 4px;\n\n --hybrid-input-local-large-padding-top: 10px;\n --hybrid-input-local-large-padding-bottom: 10px;\n --hybrid-input-local-large-padding-left: 9px;\n --hybrid-input-local-large-padding-right: 4px;\n\n --hybrid-input-local-medium-padding-top: 7px;\n --hybrid-input-local-medium-padding-bottom: 7px;\n --hybrid-input-local-medium-padding-left: 9px;\n --hybrid-input-local-medium-padding-right: 4px;\n\n --hybrid-input-local-small-padding-top: 4px;\n --hybrid-input-local-small-padding-bottom: 4px;\n --hybrid-input-local-small-padding-left: 9px;\n --hybrid-input-local-small-padding-right: 4px;\n\n /* Prefix and Suffix styling variables */\n --hybrid-input-local-prefix-color: #525252;\n --hybrid-input-local-prefix-font-size: 13px;\n --hybrid-input-local-prefix-padding-right: 8px;\n --hybrid-input-local-suffix-color: #525252;\n --hybrid-input-local-suffix-font-size: 13px;\n --hybrid-input-local-suffix-padding-left: 8px;\n --hybrid-input-local-disabled-prefix-suffix-color: #c6c6c6;\n\n /* Addon Before/After styling variables */\n --hybrid-input-local-addon-background-color: #e8e8e8;\n --hybrid-input-local-addon-color: #525252;\n --hybrid-input-local-addon-padding: 8px 12px;\n }\n\n /* \n * These override the light theme defaults when data-theme=\"dark\" is applied\n * This provides explicit theme control via JavaScript or HTML attributes\n */\n .input-wrapper[data-theme=\"dark\"] {\n --hybrid-input-local-background-color: #393939;\n --hybrid-input-local-focus-border: 2px solid #ffffff;\n --hybrid-input-local-text-color: #ffffff;\n --hybrid-input-local-error-border: 2px solid #fa4d56;\n --hybrid-input-local-error-helper-text-color: #ffb3b8;\n --hybrid-input-local-disabled-background-color: #393939;\n --hybrid-input-local-disabled-placeholder-color: #6f6f6f;\n --hybrid-input-local-disabled-helper-text-color: #6f6f6f;\n --hybrid-input-local-disabled-label-color: #6f6f6f;\n --hybrid-input-local-warning-icon-color: #f0c300;\n --hybrid-input-local-error-icon-color: #da1e28;\n --hybrid-input-local-password-icon-color: #ffffff;\n --hybrid-input-local-number-icons-color: #ffffff;\n --hybrid-input-local-label-color: #c6c6c6;\n --hybrid-input-local-helper-text-color: #c6c6c6;\n --hybrid-input-local-number-icons-separator-color: #525252;\n --hybrid-input-local-calendar-icon-color: #ffffff;\n --hybrid-input-local-copy-icon-color: #ffffff;\n \n /* Dark theme prefix and suffix colors */\n --hybrid-input-local-prefix-color: #c6c6c6;\n --hybrid-input-local-suffix-color: #c6c6c6;\n --hybrid-input-local-disabled-prefix-suffix-color: #6f6f6f;\n\n /* Dark theme addon colors */\n --hybrid-input-local-addon-background-color: #525252;\n --hybrid-input-local-addon-color: #c6c6c6;\n }\n`;\n"]}
@@ -15,4 +15,4 @@ export declare const enum INPUT_TYPE {
15
15
  CALENDAR = "calendar"
16
16
  }
17
17
  export declare const EMPTY_STRING = "";
18
- //# sourceMappingURL=input.constant.d.ts.map
18
+ //# sourceMappingURL=input.types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"input.types.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.types.ts"],"names":[],"mappings":"AAAA,0BAAkB,WAAW;IAC3B,OAAO,YAAY;IACnB,KAAK,UAAU;IACf,OAAO,YAAY;CACpB;AAED,0BAAkB,UAAU;IAC1B,KAAK,UAAU;IACf,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED,0BAAkB,UAAU;IAC1B,QAAQ,aAAa;IACrB,IAAI,SAAS;IACb,MAAM,WAAW;IACjB,QAAQ,aAAa;CACtB;AAED,eAAO,MAAM,YAAY,KAAK,CAAC"}
package/input.types.js ADDED
@@ -0,0 +1,2 @@
1
+ export const EMPTY_STRING = '';
2
+ //# sourceMappingURL=input.types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"input.types.js","sourceRoot":"","sources":["../../../src/components/input/input.types.ts"],"names":[],"mappings":"AAmBA,MAAM,CAAC,MAAM,YAAY,GAAG,EAAE,CAAC","sourcesContent":["export const enum INPUT_STATE {\n Default = 'default',\n Error = 'error',\n Warning = 'warning',\n}\n\nexport const enum INPUT_SIZE {\n Large = 'large',\n Medium = 'medium',\n Small = 'small',\n}\n\nexport const enum INPUT_TYPE {\n PASSWORD = 'password',\n TEXT = 'text',\n NUMBER = 'number',\n CALENDAR = 'calendar',\n}\n\nexport const EMPTY_STRING = '';\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nuralyui/input",
3
- "version": "0.0.4",
3
+ "version": "0.0.6",
4
4
  "description": "",
5
5
  "main": "index.js",
6
6
  "type": "module",
package/react.d.ts CHANGED
@@ -1,6 +1,9 @@
1
- import { HyInputElement } from './input.component.js';
2
- export declare const HyInput: import("@lit-labs/react").ReactWebComponent<HyInputElement, {
3
- valueChange: string;
4
- focused: string;
1
+ import { NrInputElement } from './input.component.js';
2
+ export declare const NrInput: import("@lit-labs/react").ReactWebComponent<NrInputElement, {
3
+ nrInput: string;
4
+ nrFocus: string;
5
+ nrEnter: string;
6
+ nrCopySuccess: string;
7
+ nrCopyError: string;
5
8
  }>;
6
9
  //# sourceMappingURL=react.d.ts.map
package/react.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"react.d.ts","sourceRoot":"","sources":["../../../src/components/input/react.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,cAAc,EAAC,MAAM,sBAAsB,CAAC;AACpD,eAAO,MAAM,OAAO;;;EAQlB,CAAC"}
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/react.js CHANGED
@@ -1,13 +1,16 @@
1
1
  import { createComponent } from '@lit-labs/react';
2
2
  import * as React from 'react';
3
- import { HyInputElement } from './input.component.js';
4
- export const HyInput = createComponent({
5
- tagName: 'hy-input',
6
- elementClass: HyInputElement,
3
+ import { NrInputElement } from './input.component.js';
4
+ export const NrInput = createComponent({
5
+ tagName: 'nr-input',
6
+ elementClass: NrInputElement,
7
7
  react: React,
8
8
  events: {
9
- valueChange: 'valueChange',
10
- focused: 'focused'
9
+ nrInput: 'nr-input',
10
+ nrFocus: 'nr-focus',
11
+ nrEnter: 'nr-enter',
12
+ nrCopySuccess: 'nr-copy-success',
13
+ nrCopyError: 'nr-copy-error'
11
14
  },
12
15
  });
13
16
  //# sourceMappingURL=react.js.map
package/react.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"react.js","sourceRoot":"","sources":["../../../src/components/input/react.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAC,MAAM,iBAAiB,CAAC;AAChD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAC,cAAc,EAAC,MAAM,sBAAsB,CAAC;AACpD,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC;IACrC,OAAO,EAAE,UAAU;IACnB,YAAY,EAAE,cAAc;IAC5B,KAAK,EAAE,KAAK;IACZ,MAAM,EAAE;QACN,WAAW,EAAE,aAAa;QAC1B,OAAO,EAAC,SAAS;KAClB;CACF,CAAC,CAAC","sourcesContent":["import {createComponent} from '@lit-labs/react';\nimport * as React from 'react';\nimport {HyInputElement} from './input.component.js';\nexport const HyInput = createComponent({\n tagName: 'hy-input',\n elementClass: HyInputElement,\n react: React,\n events: {\n valueChange: 'valueChange',\n focused:'focused'\n },\n});\n"]}
1
+ {"version":3,"file":"react.js","sourceRoot":"","sources":["../../../src/components/input/react.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC;IACrC,OAAO,EAAE,UAAU;IACnB,YAAY,EAAE,cAAc;IAC5B,KAAK,EAAE,KAAK;IACZ,MAAM,EAAE;QACN,OAAO,EAAE,UAAU;QACnB,OAAO,EAAE,UAAU;QACnB,OAAO,EAAE,UAAU;QACnB,aAAa,EAAE,iBAAiB;QAChC,WAAW,EAAE,eAAe;KAC7B;CACF,CAAC,CAAC","sourcesContent":["import { createComponent } from '@lit-labs/react';\nimport * as React from 'react';\nimport { NrInputElement } from './input.component.js';\nexport const NrInput = createComponent({\n tagName: 'nr-input',\n elementClass: NrInputElement,\n react: React,\n events: {\n nrInput: 'nr-input',\n nrFocus: 'nr-focus',\n nrEnter: 'nr-enter',\n nrCopySuccess: 'nr-copy-success',\n nrCopyError: 'nr-copy-error'\n },\n});\n"]}
@@ -8,11 +8,11 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
8
8
  });
9
9
  };
10
10
  import { html, fixture, expect } from '@open-wc/testing';
11
- import { EMPTY_STRING } from '../input.constant';
11
+ import { EMPTY_STRING } from '../input.types';
12
12
  import '../input.component';
13
- suite('HyInputElement', () => {
13
+ suite('NrInputElement', () => {
14
14
  test('default properties', () => __awaiter(void 0, void 0, void 0, function* () {
15
- const el = yield fixture(html `<hy-input> </hy-input>`);
15
+ const el = yield fixture(html `<nr-input> </nr-input>`);
16
16
  const inputContainer = el.shadowRoot.querySelector('#input-container');
17
17
  const input = el.shadowRoot.querySelector('input');
18
18
  const slot = el.shadowRoot.querySelector('slot');
@@ -41,7 +41,7 @@ suite('HyInputElement', () => {
41
41
  expect(assignedNode.length).to.equal(0);
42
42
  }));
43
43
  test('input type password', () => __awaiter(void 0, void 0, void 0, function* () {
44
- const el = yield fixture(html `<hy-input type="password"> </hy-input>`);
44
+ const el = yield fixture(html `<nr-input type="password"> </nr-input>`);
45
45
  const inputContainer = el.shadowRoot.querySelector('#input-container');
46
46
  let passwordIcon = inputContainer.querySelector('#password-icon');
47
47
  expect(inputContainer.querySelector('#number-icons')).to.be.null;
@@ -58,7 +58,7 @@ suite('HyInputElement', () => {
58
58
  const step = 5;
59
59
  const min = 10;
60
60
  const max = 100;
61
- const el = yield fixture(html `<hy-input type="number" step=${step} min=${min} max=${max}> </hy-input>`);
61
+ const el = yield fixture(html `<nr-input type="number" step=${step} min=${min} max=${max}> </nr-input>`);
62
62
  const inputContainer = el.shadowRoot.querySelector('#input-container');
63
63
  const input = el.shadowRoot.querySelector('input');
64
64
  const passwordIcon = inputContainer.querySelector('#password-icon');
@@ -72,7 +72,7 @@ suite('HyInputElement', () => {
72
72
  test('increment number', () => __awaiter(void 0, void 0, void 0, function* () {
73
73
  const step = 5;
74
74
  const min = 10;
75
- const el = yield fixture(html `<hy-input type="number" step=${step} min=${min}> </hy-input>`);
75
+ const el = yield fixture(html `<nr-input type="number" step=${step} min=${min}> </nr-input>`);
76
76
  const inputContainer = el.shadowRoot.querySelector('#input-container');
77
77
  const input = el.shadowRoot.querySelector('input');
78
78
  const numberIcon = inputContainer.querySelector('#number-icons');
@@ -82,7 +82,7 @@ suite('HyInputElement', () => {
82
82
  }));
83
83
  test('decrement number', () => __awaiter(void 0, void 0, void 0, function* () {
84
84
  const step = 5;
85
- const el = yield fixture(html `<hy-input type="number" step=${step}> </hy-input>`);
85
+ const el = yield fixture(html `<nr-input type="number" step=${step}> </nr-input>`);
86
86
  const inputContainer = el.shadowRoot.querySelector('#input-container');
87
87
  const input = el.shadowRoot.querySelector('input');
88
88
  const inputValue = input.value;
@@ -95,14 +95,14 @@ suite('HyInputElement', () => {
95
95
  suite('input with state', () => {
96
96
  test('warning input', () => __awaiter(void 0, void 0, void 0, function* () {
97
97
  const inputState = "warning" /* INPUT_STATE.Warning */;
98
- const el = yield fixture(html `<hy-input state=${inputState}> </hy-input>`);
98
+ const el = yield fixture(html `<nr-input state=${inputState}> </nr-input>`);
99
99
  const inputContainer = el.shadowRoot.querySelector('#input-container');
100
100
  expect(inputContainer.querySelector('#warning-icon')).to.exist;
101
101
  expect(inputContainer.querySelector('#error-icon')).to.not.exist;
102
102
  }));
103
103
  test('error input', () => __awaiter(void 0, void 0, void 0, function* () {
104
104
  const inputState = "error" /* INPUT_STATE.Error */;
105
- const el = yield fixture(html `<hy-input state=${inputState}> </hy-input>`);
105
+ const el = yield fixture(html `<nr-input state=${inputState}> </nr-input>`);
106
106
  const inputContainer = el.shadowRoot.querySelector('#input-container');
107
107
  expect(inputContainer.querySelector('#warning-icon')).to.not.exist;
108
108
  expect(inputContainer.querySelector('#error-icon')).to.exist;
@@ -111,26 +111,26 @@ suite('HyInputElement', () => {
111
111
  suite('input with size', () => {
112
112
  test('large input', () => __awaiter(void 0, void 0, void 0, function* () {
113
113
  const inputSize = "large" /* INPUT_SIZE.Large */;
114
- const el = yield fixture(html `<hy-input size=${inputSize}> </hy-input>`);
114
+ const el = yield fixture(html `<nr-input size=${inputSize}> </nr-input>`);
115
115
  const inputContainer = el.shadowRoot.querySelector('#input-container');
116
116
  expect(inputContainer).to.have.attribute('data-size', inputSize);
117
117
  }));
118
118
  test('medium input', () => __awaiter(void 0, void 0, void 0, function* () {
119
119
  const inputSize = "medium" /* INPUT_SIZE.Medium */;
120
- const el = yield fixture(html `<hy-input size=${inputSize}> </hy-input>`);
120
+ const el = yield fixture(html `<nr-input size=${inputSize}> </nr-input>`);
121
121
  const inputContainer = el.shadowRoot.querySelector('#input-container');
122
122
  expect(inputContainer).to.have.attribute('data-size', inputSize);
123
123
  }));
124
124
  });
125
125
  test('input with placeholder', () => __awaiter(void 0, void 0, void 0, function* () {
126
126
  const placeholder = 'text of placeholder';
127
- const el = yield fixture(html `<hy-input placeholder=${placeholder}> </hy-input>`);
127
+ const el = yield fixture(html `<nr-input placeholder=${placeholder}> </nr-input>`);
128
128
  const input = el.shadowRoot.querySelector('input');
129
129
  expect(input).to.have.attribute('placeholder', placeholder);
130
130
  }));
131
131
  test('input with label', () => __awaiter(void 0, void 0, void 0, function* () {
132
132
  const inputLabel = 'input label';
133
- const el = yield fixture(html `<hy-input> <span slot="label">${inputLabel}</span> </hy-input>`);
133
+ const el = yield fixture(html `<nr-input> <span slot="label">${inputLabel}</span> </nr-input>`);
134
134
  const slot = el.shadowRoot.querySelector('slot');
135
135
  const assignedNode = slot.assignedNodes();
136
136
  expect(assignedNode[0]).to.have.attribute('slot', 'label');
@@ -138,14 +138,14 @@ suite('HyInputElement', () => {
138
138
  }));
139
139
  test('input with helper text', () => __awaiter(void 0, void 0, void 0, function* () {
140
140
  const inputHelper = 'input helper';
141
- const el = yield fixture(html `<hy-input> <span slot="helper-text">${inputHelper}</span> </hy-input>`);
141
+ const el = yield fixture(html `<nr-input> <span slot="helper-text">${inputHelper}</span> </nr-input>`);
142
142
  const slot = el.shadowRoot.querySelectorAll('slot');
143
143
  const assignedNode = slot[1].assignedNodes();
144
144
  expect(assignedNode[0]).to.have.attribute('slot', 'helper-text');
145
145
  expect(assignedNode[0].textContent).to.equal(inputHelper);
146
146
  }));
147
147
  test('input disabled', () => __awaiter(void 0, void 0, void 0, function* () {
148
- const el = yield fixture(html `<hy-input disabled></hy-input>`);
148
+ const el = yield fixture(html `<nr-input disabled></nr-input>`);
149
149
  const input = el.shadowRoot.querySelector('input');
150
150
  expect(input.disabled).to.be.true;
151
151
  let inputFocus = false;
@@ -1 +1 @@
1
- {"version":3,"file":"hy-input_test.js","sourceRoot":"","sources":["../../../../src/components/input/test/hy-input_test.ts"],"names":[],"mappings":"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","sourcesContent":["import {html, fixture, expect} from '@open-wc/testing';\nimport {HyInputElement} from '../input.component';\nimport {INPUT_STATE, INPUT_SIZE, INPUT_TYPE, EMPTY_STRING} from '../input.constant';\nimport '../input.component';\nimport {HyIconElement} from '../../icon';\nsuite('HyInputElement', () => {\n test('default properties', async () => {\n const el: HyInputElement = await fixture(html`<hy-input> </hy-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n const input = el.shadowRoot!.querySelector('input')!;\n const slot = el.shadowRoot!.querySelector('slot');\n const assignedNode = slot!.assignedNodes();\n expect(el.disabled).to.be.false;\n expect(el.state).to.equal(INPUT_STATE.Default);\n expect(el.value).to.equal(EMPTY_STRING);\n expect(el.size).to.equal(INPUT_SIZE.Medium);\n expect(el.type).to.equal(INPUT_TYPE.TEXT);\n expect(el.placeholder).to.equal(EMPTY_STRING);\n expect(el.min).to.be.undefined;\n expect(el.max).to.be.undefined;\n expect(el.step).to.be.undefined;\n\n expect(input).to.not.have.attribute('min');\n expect(input).to.not.have.attribute('max');\n expect(input).to.not.have.attribute('step');\n expect(input.disabled).to.be.false;\n expect(input.type).to.equal(INPUT_TYPE.TEXT);\n expect(input.value).to.equal(EMPTY_STRING);\n expect(input.placeholder).to.equal(EMPTY_STRING);\n expect(inputContainer).to.have.attribute('data-size', INPUT_SIZE.Medium);\n expect(inputContainer.querySelector('#warning-icon')).to.be.null;\n expect(inputContainer.querySelector('#error-icon')).to.be.null;\n expect(inputContainer.querySelector('#password-icon')).to.be.null;\n expect(inputContainer.querySelector('#number-icons')).to.be.null;\n expect(assignedNode.length).to.equal(0);\n });\n\n test('input type password', async () => {\n const el: HyInputElement = await fixture(html`<hy-input type=\"password\"> </hy-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n let passwordIcon: HyIconElement = inputContainer.querySelector('#password-icon')!;\n expect(inputContainer.querySelector('#number-icons')).to.be.null;\n expect(passwordIcon).to.exist;\n expect(passwordIcon).to.have.attribute('name', 'eye');\n passwordIcon.click();\n await el.updateComplete;\n expect(el.inputType).to.equal('text');\n passwordIcon = inputContainer.querySelector('#password-icon')!;\n expect(passwordIcon).to.have.attribute('name', 'eye-slash');\n });\n\n suite('input type number', () => {\n test('init number input ', async () => {\n const step = 5;\n const min = 10;\n const max = 100;\n const el: HyInputElement = await fixture(\n html`<hy-input type=\"number\" step=${step} min=${min} max=${max}> </hy-input>`\n );\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n const input = el.shadowRoot!.querySelector('input')!;\n const passwordIcon: HyIconElement = inputContainer.querySelector('#password-icon')!;\n const numberIcon = inputContainer.querySelector('#number-icons');\n expect(passwordIcon).to.be.null;\n expect(numberIcon).to.exist;\n expect(input).to.have.attribute('min', min.toString());\n expect(input).to.have.attribute('max', max.toString());\n expect(input).to.have.attribute('step', step.toString());\n });\n test('increment number', async () => {\n const step = 5;\n const min = 10;\n const el: HyInputElement = await fixture(html`<hy-input type=\"number\" step=${step} min=${min}> </hy-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n const input = el.shadowRoot!.querySelector('input')!;\n const numberIcon = inputContainer.querySelector('#number-icons');\n const plusButton: HyIconElement = numberIcon!.querySelector(\"[name='plus']\")!;\n plusButton.click();\n expect(input.value).to.equal((min + step).toString());\n });\n test('decrement number', async () => {\n const step = 5;\n const el: HyInputElement = await fixture(html`<hy-input type=\"number\" step=${step}> </hy-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n const input = el.shadowRoot!.querySelector('input')!;\n const inputValue = input.value;\n const numberIcon = inputContainer.querySelector('#number-icons');\n const minusButton: HyIconElement = numberIcon!.querySelector(\"[name='minus']\")!;\n minusButton.click();\n expect(input.value).to.equal((+inputValue - step).toString());\n });\n });\n\n suite('input with state', () => {\n test('warning input', async () => {\n const inputState = INPUT_STATE.Warning;\n const el: HyInputElement = await fixture(html`<hy-input state=${inputState}> </hy-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n expect(inputContainer.querySelector('#warning-icon')).to.exist;\n expect(inputContainer.querySelector('#error-icon')).to.not.exist;\n });\n test('error input', async () => {\n const inputState = INPUT_STATE.Error;\n const el: HyInputElement = await fixture(html`<hy-input state=${inputState}> </hy-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n expect(inputContainer.querySelector('#warning-icon')).to.not.exist;\n expect(inputContainer.querySelector('#error-icon')).to.exist;\n });\n });\n suite('input with size', () => {\n test('large input', async () => {\n const inputSize = INPUT_SIZE.Large;\n const el: HyInputElement = await fixture(html`<hy-input size=${inputSize}> </hy-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n expect(inputContainer).to.have.attribute('data-size', inputSize);\n });\n test('medium input', async () => {\n const inputSize = INPUT_SIZE.Medium;\n const el: HyInputElement = await fixture(html`<hy-input size=${inputSize}> </hy-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n expect(inputContainer).to.have.attribute('data-size', inputSize);\n });\n });\n test('input with placeholder', async () => {\n const placeholder = 'text of placeholder';\n const el: HyInputElement = await fixture(html`<hy-input placeholder=${placeholder}> </hy-input>`);\n const input = el.shadowRoot!.querySelector('input')!;\n expect(input).to.have.attribute('placeholder', placeholder);\n });\n\n test('input with label', async () => {\n const inputLabel = 'input label';\n const el: HyInputElement = await fixture(html`<hy-input> <span slot=\"label\">${inputLabel}</span> </hy-input>`);\n const slot = el.shadowRoot!.querySelector('slot');\n const assignedNode = slot!.assignedNodes();\n expect(assignedNode[0]).to.have.attribute('slot', 'label');\n expect(assignedNode[0].textContent).to.equal(inputLabel);\n });\n\n test('input with helper text', async () => {\n const inputHelper = 'input helper';\n const el: HyInputElement = await fixture(\n html`<hy-input> <span slot=\"helper-text\">${inputHelper}</span> </hy-input>`\n );\n const slot = el.shadowRoot!.querySelectorAll('slot');\n const assignedNode = slot[1].assignedNodes();\n expect(assignedNode[0]).to.have.attribute('slot', 'helper-text');\n expect(assignedNode[0].textContent).to.equal(inputHelper);\n });\n\n test('input disabled', async () => {\n const el: HyInputElement = await fixture(html`<hy-input disabled></hy-input>`);\n const input = el.shadowRoot!.querySelector('input')!;\n expect(input.disabled).to.be.true;\n let inputFocus = false;\n input.addEventListener('focus', () => {\n inputFocus = true;\n });\n input.focus();\n\n expect(inputFocus).to.equal(false);\n });\n});\n"]}
1
+ {"version":3,"file":"hy-input_test.js","sourceRoot":"","sources":["../../../../src/components/input/test/hy-input_test.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, fixture, expect } from '@open-wc/testing';\nimport { NrInputElement } from '../input.component';\nimport { INPUT_STATE, INPUT_SIZE, INPUT_TYPE, EMPTY_STRING } from '../input.types';\nimport '../input.component';\nimport { HyIconElement } from '../../icon';\nsuite('NrInputElement', () => {\n test('default properties', async () => {\n const el: NrInputElement = await fixture(html`<nr-input> </nr-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n const input = el.shadowRoot!.querySelector('input')!;\n const slot = el.shadowRoot!.querySelector('slot');\n const assignedNode = slot!.assignedNodes();\n expect(el.disabled).to.be.false;\n expect(el.state).to.equal(INPUT_STATE.Default);\n expect(el.value).to.equal(EMPTY_STRING);\n expect(el.size).to.equal(INPUT_SIZE.Medium);\n expect(el.type).to.equal(INPUT_TYPE.TEXT);\n expect(el.placeholder).to.equal(EMPTY_STRING);\n expect(el.min).to.be.undefined;\n expect(el.max).to.be.undefined;\n expect(el.step).to.be.undefined;\n\n expect(input).to.not.have.attribute('min');\n expect(input).to.not.have.attribute('max');\n expect(input).to.not.have.attribute('step');\n expect(input.disabled).to.be.false;\n expect(input.type).to.equal(INPUT_TYPE.TEXT);\n expect(input.value).to.equal(EMPTY_STRING);\n expect(input.placeholder).to.equal(EMPTY_STRING);\n expect(inputContainer).to.have.attribute('data-size', INPUT_SIZE.Medium);\n expect(inputContainer.querySelector('#warning-icon')).to.be.null;\n expect(inputContainer.querySelector('#error-icon')).to.be.null;\n expect(inputContainer.querySelector('#password-icon')).to.be.null;\n expect(inputContainer.querySelector('#number-icons')).to.be.null;\n expect(assignedNode.length).to.equal(0);\n });\n\n test('input type password', async () => {\n const el: NrInputElement = await fixture(html`<nr-input type=\"password\"> </nr-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n let passwordIcon: HyIconElement = inputContainer.querySelector('#password-icon')!;\n expect(inputContainer.querySelector('#number-icons')).to.be.null;\n expect(passwordIcon).to.exist;\n expect(passwordIcon).to.have.attribute('name', 'eye');\n passwordIcon.click();\n await el.updateComplete;\n expect(el.inputType).to.equal('text');\n passwordIcon = inputContainer.querySelector('#password-icon')!;\n expect(passwordIcon).to.have.attribute('name', 'eye-slash');\n });\n\n suite('input type number', () => {\n test('init number input ', async () => {\n const step = 5;\n const min = 10;\n const max = 100;\n const el: NrInputElement = await fixture(\n html`<nr-input type=\"number\" step=${step} min=${min} max=${max}> </nr-input>`\n );\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n const input = el.shadowRoot!.querySelector('input')!;\n const passwordIcon: HyIconElement = inputContainer.querySelector('#password-icon')!;\n const numberIcon = inputContainer.querySelector('#number-icons');\n expect(passwordIcon).to.be.null;\n expect(numberIcon).to.exist;\n expect(input).to.have.attribute('min', min.toString());\n expect(input).to.have.attribute('max', max.toString());\n expect(input).to.have.attribute('step', step.toString());\n });\n test('increment number', async () => {\n const step = 5;\n const min = 10;\n const el: NrInputElement = await fixture(html`<nr-input type=\"number\" step=${step} min=${min}> </nr-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n const input = el.shadowRoot!.querySelector('input')!;\n const numberIcon = inputContainer.querySelector('#number-icons');\n const plusButton: HyIconElement = numberIcon!.querySelector(\"[name='plus']\")!;\n plusButton.click();\n expect(input.value).to.equal((min + step).toString());\n });\n test('decrement number', async () => {\n const step = 5;\n const el: NrInputElement = await fixture(html`<nr-input type=\"number\" step=${step}> </nr-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n const input = el.shadowRoot!.querySelector('input')!;\n const inputValue = input.value;\n const numberIcon = inputContainer.querySelector('#number-icons');\n const minusButton: HyIconElement = numberIcon!.querySelector(\"[name='minus']\")!;\n minusButton.click();\n expect(input.value).to.equal((+inputValue - step).toString());\n });\n });\n\n suite('input with state', () => {\n test('warning input', async () => {\n const inputState = INPUT_STATE.Warning;\n const el: NrInputElement = await fixture(html`<nr-input state=${inputState}> </nr-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n expect(inputContainer.querySelector('#warning-icon')).to.exist;\n expect(inputContainer.querySelector('#error-icon')).to.not.exist;\n });\n test('error input', async () => {\n const inputState = INPUT_STATE.Error;\n const el: NrInputElement = await fixture(html`<nr-input state=${inputState}> </nr-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n expect(inputContainer.querySelector('#warning-icon')).to.not.exist;\n expect(inputContainer.querySelector('#error-icon')).to.exist;\n });\n });\n suite('input with size', () => {\n test('large input', async () => {\n const inputSize = INPUT_SIZE.Large;\n const el: NrInputElement = await fixture(html`<nr-input size=${inputSize}> </nr-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n expect(inputContainer).to.have.attribute('data-size', inputSize);\n });\n test('medium input', async () => {\n const inputSize = INPUT_SIZE.Medium;\n const el: NrInputElement = await fixture(html`<nr-input size=${inputSize}> </nr-input>`);\n const inputContainer = el.shadowRoot!.querySelector('#input-container')!;\n expect(inputContainer).to.have.attribute('data-size', inputSize);\n });\n });\n test('input with placeholder', async () => {\n const placeholder = 'text of placeholder';\n const el: NrInputElement = await fixture(html`<nr-input placeholder=${placeholder}> </nr-input>`);\n const input = el.shadowRoot!.querySelector('input')!;\n expect(input).to.have.attribute('placeholder', placeholder);\n });\n\n test('input with label', async () => {\n const inputLabel = 'input label';\n const el: NrInputElement = await fixture(html`<nr-input> <span slot=\"label\">${inputLabel}</span> </nr-input>`);\n const slot = el.shadowRoot!.querySelector('slot');\n const assignedNode = slot!.assignedNodes();\n expect(assignedNode[0]).to.have.attribute('slot', 'label');\n expect(assignedNode[0].textContent).to.equal(inputLabel);\n });\n\n test('input with helper text', async () => {\n const inputHelper = 'input helper';\n const el: NrInputElement = await fixture(\n html`<nr-input> <span slot=\"helper-text\">${inputHelper}</span> </nr-input>`\n );\n const slot = el.shadowRoot!.querySelectorAll('slot');\n const assignedNode = slot[1].assignedNodes();\n expect(assignedNode[0]).to.have.attribute('slot', 'helper-text');\n expect(assignedNode[0].textContent).to.equal(inputHelper);\n });\n\n test('input disabled', async () => {\n const el: NrInputElement = await fixture(html`<nr-input disabled></nr-input>`);\n const input = el.shadowRoot!.querySelector('input')!;\n expect(input.disabled).to.be.true;\n let inputFocus = false;\n input.addEventListener('focus', () => {\n inputFocus = true;\n });\n input.focus();\n\n expect(inputFocus).to.equal(false);\n });\n});\n"]}
@@ -0,0 +1,8 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2023 Google Laabidi Aymen
4
+ * SPDX-License-Identifier: MIT
5
+ */
6
+ export { InputValidationUtils } from './input-validation.utils.js';
7
+ export { InputRenderUtils } from './input-renderers.js';
8
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/input/utils/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC"}
package/utils/index.js ADDED
@@ -0,0 +1,8 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2023 Google Laabidi Aymen
4
+ * SPDX-License-Identifier: MIT
5
+ */
6
+ export { InputValidationUtils } from './input-validation.utils.js';
7
+ export { InputRenderUtils } from './input-renderers.js';
8
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/input/utils/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2023 Google Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nexport { InputValidationUtils } from './input-validation.utils.js';\nexport { InputRenderUtils } from './input-renderers.js';\n"]}
@@ -0,0 +1,50 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2023 Google Laabidi Aymen
4
+ * SPDX-License-Identifier: MIT
5
+ */
6
+ import { TemplateResult, nothing } from 'lit';
7
+ /**
8
+ * Rendering utilities for input component icons and elements
9
+ */
10
+ export declare class InputRenderUtils {
11
+ /**
12
+ * Renders prefix slot content
13
+ */
14
+ static renderPrefix(): TemplateResult;
15
+ /**
16
+ * Renders suffix slot content
17
+ */
18
+ static renderSuffix(): TemplateResult;
19
+ /**
20
+ * Renders addon before slot content (outside input borders)
21
+ * Only renders if hasAddonBefore is true
22
+ */
23
+ static renderAddonBefore(hasAddonBefore: boolean, onSlotChange: (e: Event) => void): TemplateResult | typeof nothing;
24
+ /**
25
+ * Renders addon after slot content (outside input borders)
26
+ * Only renders if hasAddonAfter is true
27
+ */
28
+ static renderAddonAfter(hasAddonAfter: boolean, onSlotChange: (e: Event) => void): TemplateResult | typeof nothing;
29
+ /**
30
+ * Renders the copy icon when withCopy is enabled
31
+ */
32
+ static renderCopyIcon(withCopy: boolean, disabled: boolean, readonly: boolean, onCopy: () => void, onKeydown: (e: KeyboardEvent) => void): TemplateResult | typeof nothing;
33
+ /**
34
+ * Renders state-based icons (warning, error)
35
+ */
36
+ static renderStateIcon(state: string): TemplateResult | typeof nothing;
37
+ /**
38
+ * Renders the calendar icon for calendar input type
39
+ */
40
+ static renderCalendarIcon(state: string, type: string): TemplateResult | typeof nothing;
41
+ /**
42
+ * Renders password toggle icon
43
+ */
44
+ static renderPasswordIcon(type: string, inputType: string, disabled: boolean, readonly: boolean, onToggle: () => void, onKeydown: (e: KeyboardEvent) => void): TemplateResult | typeof nothing;
45
+ /**
46
+ * Renders number input increment/decrement icons
47
+ */
48
+ static renderNumberIcons(type: string, state: string, disabled: boolean, readonly: boolean, onIncrement: () => void, onDecrement: () => void, onKeydown: (e: KeyboardEvent) => void): TemplateResult | typeof nothing;
49
+ }
50
+ //# sourceMappingURL=input-renderers.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"input-renderers.d.ts","sourceRoot":"","sources":["../../../../src/components/input/utils/input-renderers.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAQ,cAAc,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAGpD;;GAEG;AACH,qBAAa,gBAAgB;IAE3B;;OAEG;IACH,MAAM,CAAC,YAAY,IAAI,cAAc;IAQrC;;OAEG;IACH,MAAM,CAAC,YAAY,IAAI,cAAc;IAQrC;;;OAGG;IACH,MAAM,CAAC,iBAAiB,CAAC,cAAc,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,CAAC,EAAE,KAAK,KAAK,IAAI,GAAG,cAAc,GAAG,OAAO,OAAO;IAUpH;;;OAGG;IACH,MAAM,CAAC,gBAAgB,CAAC,aAAa,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,CAAC,EAAE,KAAK,KAAK,IAAI,GAAG,cAAc,GAAG,OAAO,OAAO;IAUlH;;OAEG;IACH,MAAM,CAAC,cAAc,CACnB,QAAQ,EAAE,OAAO,EACjB,QAAQ,EAAE,OAAO,EACjB,QAAQ,EAAE,OAAO,EACjB,MAAM,EAAE,MAAM,IAAI,EAClB,SAAS,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,GACpC,cAAc,GAAG,OAAO,OAAO;IAelC;;OAEG;IACH,MAAM,CAAC,eAAe,CAAC,KAAK,EAAE,MAAM,GAAG,cAAc,GAAG,OAAO,OAAO;IAWtE;;OAEG;IACH,MAAM,CAAC,kBAAkB,CACvB,KAAK,EAAE,MAAM,EACb,IAAI,EAAE,MAAM,GACX,cAAc,GAAG,OAAO,OAAO;IAQlC;;OAEG;IACH,MAAM,CAAC,kBAAkB,CACvB,IAAI,EAAE,MAAM,EACZ,SAAS,EAAE,MAAM,EACjB,QAAQ,EAAE,OAAO,EACjB,QAAQ,EAAE,OAAO,EACjB,QAAQ,EAAE,MAAM,IAAI,EACpB,SAAS,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,GACpC,cAAc,GAAG,OAAO,OAAO;IA4BlC;;OAEG;IACH,MAAM,CAAC,iBAAiB,CACtB,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,MAAM,EACb,QAAQ,EAAE,OAAO,EACjB,QAAQ,EAAE,OAAO,EACjB,WAAW,EAAE,MAAM,IAAI,EACvB,WAAW,EAAE,MAAM,IAAI,EACvB,SAAS,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,GACpC,cAAc,GAAG,OAAO,OAAO;CA0BnC"}
@@ -0,0 +1,157 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2023 Google Laabidi Aymen
4
+ * SPDX-License-Identifier: MIT
5
+ */
6
+ import { html, nothing } from 'lit';
7
+ /**
8
+ * Rendering utilities for input component icons and elements
9
+ */
10
+ export class InputRenderUtils {
11
+ /**
12
+ * Renders prefix slot content
13
+ */
14
+ static renderPrefix() {
15
+ return html `
16
+ <div class="input-prefix">
17
+ <slot name="prefix"></slot>
18
+ </div>
19
+ `;
20
+ }
21
+ /**
22
+ * Renders suffix slot content
23
+ */
24
+ static renderSuffix() {
25
+ return html `
26
+ <div class="input-suffix">
27
+ <slot name="suffix"></slot>
28
+ </div>
29
+ `;
30
+ }
31
+ /**
32
+ * Renders addon before slot content (outside input borders)
33
+ * Only renders if hasAddonBefore is true
34
+ */
35
+ static renderAddonBefore(hasAddonBefore, onSlotChange) {
36
+ if (!hasAddonBefore)
37
+ return nothing;
38
+ return html `
39
+ <div class="input-addon-before">
40
+ <slot name="addon-before" @slotchange=${onSlotChange}></slot>
41
+ </div>
42
+ `;
43
+ }
44
+ /**
45
+ * Renders addon after slot content (outside input borders)
46
+ * Only renders if hasAddonAfter is true
47
+ */
48
+ static renderAddonAfter(hasAddonAfter, onSlotChange) {
49
+ if (!hasAddonAfter)
50
+ return nothing;
51
+ return html `
52
+ <div class="input-addon-after">
53
+ <slot name="addon-after" @slotchange=${onSlotChange}></slot>
54
+ </div>
55
+ `;
56
+ }
57
+ /**
58
+ * Renders the copy icon when withCopy is enabled
59
+ */
60
+ static renderCopyIcon(withCopy, disabled, readonly, onCopy, onKeydown) {
61
+ if (!withCopy)
62
+ return nothing;
63
+ return html `<hy-icon
64
+ name="copy"
65
+ type="regular"
66
+ id="copy-icon"
67
+ role="button"
68
+ aria-label="Copy input value"
69
+ tabindex="0"
70
+ @click=${!disabled && !readonly ? onCopy : nothing}
71
+ @keydown=${onKeydown}
72
+ ></hy-icon>`;
73
+ }
74
+ /**
75
+ * Renders state-based icons (warning, error)
76
+ */
77
+ static renderStateIcon(state) {
78
+ switch (state) {
79
+ case "warning" /* INPUT_STATE.Warning */:
80
+ return html `<hy-icon name="warning" id="warning-icon"></hy-icon>`;
81
+ case "error" /* INPUT_STATE.Error */:
82
+ return html `<hy-icon name="exclamation-circle" id="error-icon"></hy-icon>`;
83
+ default:
84
+ return nothing;
85
+ }
86
+ }
87
+ /**
88
+ * Renders the calendar icon for calendar input type
89
+ */
90
+ static renderCalendarIcon(state, type) {
91
+ if (state !== "default" /* INPUT_STATE.Default */ || type !== "calendar" /* INPUT_TYPE.CALENDAR */) {
92
+ return nothing;
93
+ }
94
+ return html `<hy-icon name="calendar" type="regular" id="calendar-icon"></hy-icon>`;
95
+ }
96
+ /**
97
+ * Renders password toggle icon
98
+ */
99
+ static renderPasswordIcon(type, inputType, disabled, readonly, onToggle, onKeydown) {
100
+ if (type !== "password" /* INPUT_TYPE.PASSWORD */)
101
+ return nothing;
102
+ if (inputType === "text" /* INPUT_TYPE.TEXT */) {
103
+ return html `<hy-icon
104
+ name="eye-slash"
105
+ type="regular"
106
+ id="password-icon"
107
+ role="button"
108
+ aria-label="Hide password"
109
+ tabindex="0"
110
+ @click=${!disabled && !readonly ? onToggle : nothing}
111
+ @keydown=${onKeydown}
112
+ ></hy-icon>`;
113
+ }
114
+ else {
115
+ return html `<hy-icon
116
+ name="eye"
117
+ type="regular"
118
+ id="password-icon"
119
+ role="button"
120
+ aria-label="Show password"
121
+ tabindex="0"
122
+ @click=${!disabled && !readonly ? onToggle : nothing}
123
+ @keydown=${onKeydown}
124
+ ></hy-icon>`;
125
+ }
126
+ }
127
+ /**
128
+ * Renders number input increment/decrement icons
129
+ */
130
+ static renderNumberIcons(type, state, disabled, readonly, onIncrement, onDecrement, onKeydown) {
131
+ if (type !== "number" /* INPUT_TYPE.NUMBER */)
132
+ return nothing;
133
+ return html `
134
+ <div id="number-icons">
135
+ ${state !== "default" /* INPUT_STATE.Default */ ? html `<span id="icons-separator">|</span>` : nothing}
136
+ <hy-icon
137
+ name="minus"
138
+ aria-label="Decrease value"
139
+ role="button"
140
+ tabindex="0"
141
+ @click=${!disabled && !readonly ? onDecrement : nothing}
142
+ @keydown=${onKeydown}
143
+ ></hy-icon>
144
+ <span id="icons-separator">|</span>
145
+ <hy-icon
146
+ name="plus"
147
+ aria-label="Increase value"
148
+ role="button"
149
+ tabindex="0"
150
+ @click=${!disabled && !readonly ? onIncrement : nothing}
151
+ @keydown=${onKeydown}
152
+ ></hy-icon>
153
+ </div>
154
+ `;
155
+ }
156
+ }
157
+ //# sourceMappingURL=input-renderers.js.map