@nuralyui/input 0.0.5 → 0.0.6

package/input.component.d.ts

@@ -3,13 +3,13 @@
  * Copyright 2023 Google Laabidi Aymen
  * SPDX-License-Identifier: MIT
  */
-/// <reference types="react" />
 import { LitElement, PropertyValues } from 'lit';
-import { INPUT_TYPE, INPUT_STATE, INPUT_SIZE } from './input.constant.js';
+import { INPUT_TYPE, INPUT_STATE, INPUT_SIZE } from './input.types.js';
 import '../icon/icon.component.js';
 declare const NrInputElement_base: (new (...args: any[]) => import("../../shared/dependency-mixin.js").DependencyAware) & (new (...args: any[]) => import("../../shared/theme-mixin.js").ThemeAware) & typeof LitElement;
 export declare class NrInputElement extends NrInputElement_base {
     disabled: boolean;
+    readonly: boolean;
     state: INPUT_STATE;
     value: string;
     size: INPUT_SIZE;
@@ -21,6 +21,8 @@ export declare class NrInputElement extends NrInputElement_base {
     autocomplete: string;
     withCopy: boolean;
     inputType: string;
+    hasAddonBefore: boolean;
+    hasAddonAfter: boolean;
     input: HTMLInputElement;
     /**
      * Required components that must be registered for this component to work properly
@@ -32,27 +34,30 @@ export declare class NrInputElement extends NrInputElement_base {
     connectedCallback(): void;
     willUpdate(_changedProperties: PropertyValues): void;
     updated(_changedProperties: PropertyValues): void;
-    private _increment;
-    private _decrement;
+    firstUpdated(): void;
+    /**
+     * Check initial slot content on first render
+     */
+    private _checkInitialSlotContent;
+    /**
+     * Handle slot changes to determine addon visibility
+     */
+    private _handleSlotChange;
+    /**
+     * Centralized event dispatcher to ensure consistent event structure
+     */
+    private _dispatchInputEvent;
+    private _handleKeyDown;
     private _valueChange;
-    private handleKeyDown;
+    private _focusEvent;
     private _handleIconKeydown;
-    private onCopy;
+    private _onCopy;
+    private _increment;
+    private _decrement;
+    private _togglePasswordIcon;
     private _getAriaDescribedBy;
-    private _focusEvent;
-    _togglePasswordIcon(): void;
     render(): import("lit").TemplateResult<1>;
     static styles: import("lit").CSSResult[];
 }
-declare global {
-    interface HTMLElementTagNameMap {
-        'nr-input': NrInputElement;
-    }
-    namespace JSX {
-        interface IntrinsicElements {
-            'nr-input': React.DetailedHTMLProps<React.HTMLAttributes<NrInputElement>, NrInputElement> | Partial<NrInputElement>;
-        }
-    }
-}
 export {};
 //# sourceMappingURL=input.component.d.ts.map

package/input.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.component.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.component.ts"],"names":[],"mappings":"AACA;;;;GAIG;;AAEH,OAAO,EAAE,UAAU,EAAE,cAAc,EAAiB,MAAM,KAAK,CAAC;AAGhE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,UAAU,EAAgB,MAAM,qBAAqB,CAAC;AAGxF,OAAO,2BAA2B,CAAC;;AAEnC,qBACa,cAAe,SAAQ,mBAA6B;IAG/D,QAAQ,UAAS;IAGjB,KAAK,cAAuB;IAG5B,KAAK,SAAgB;IAGrB,IAAI,aAAqB;IAGzB,IAAI,aAAmB;IAGvB,IAAI,CAAC,EAAE,MAAM,CAAC;IAGd,GAAG,CAAC,EAAE,MAAM,CAAC;IAGb,GAAG,CAAC,EAAE,MAAM,CAAC;IAGb,WAAW,SAAgB;IAG3B,YAAY,SAAS;IAGrB,QAAQ,UAAS;IAGjB,SAAS,SAAgB;IAGzB,KAAK,EAAG,gBAAgB,CAAC;IAEzB;;OAEG;IACM,kBAAkB,WAAe;IAE1C;;OAEG;IACM,iBAAiB;IAKjB,UAAU,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IASpD,OAAO,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAgB1D,OAAO,CAAC,UAAU;IAclB,OAAO,CAAC,UAAU;IAelB,OAAO,CAAC,YAAY;IAepB,OAAO,CAAC,aAAa;IAerB,OAAO,CAAC,kBAAkB;YAkBZ,MAAM;IAkBpB,OAAO,CAAC,mBAAmB;IAY3B,OAAO,CAAC,WAAW;IAYnB,mBAAmB;IAQV,MAAM;IAmFf,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"}
+{"version":3,"file":"input.component.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.component.ts"],"names":[],"mappings":"AACA;;;;GAIG;AAEH,OAAO,EAAE,UAAU,EAAE,cAAc,EAAQ,MAAM,KAAK,CAAC;AAGvD,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,UAAU,EAAgB,MAAM,kBAAkB,CAAC;AAIrF,OAAO,2BAA2B,CAAC;;AAEnC,qBACa,cAAe,SAAQ,mBAA6B;IAG/D,QAAQ,UAAS;IAGjB,QAAQ,UAAS;IAGjB,KAAK,cAAuB;IAG5B,KAAK,SAAgB;IAGrB,IAAI,aAAqB;IAGzB,IAAI,aAAmB;IAGvB,IAAI,CAAC,EAAE,MAAM,CAAC;IAGd,GAAG,CAAC,EAAE,MAAM,CAAC;IAGb,GAAG,CAAC,EAAE,MAAM,CAAC;IAGb,WAAW,SAAgB;IAG3B,YAAY,SAAS;IAGrB,QAAQ,UAAS;IAGjB,SAAS,SAAgB;IAGzB,cAAc,UAAS;IAGvB,aAAa,UAAS;IAGtB,KAAK,EAAG,gBAAgB,CAAC;IAEzB;;OAEG;IACM,kBAAkB,WAAe;IAE1C;;OAEG;IACM,iBAAiB;IAKjB,UAAU,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAiBpD,OAAO,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAgBjD,YAAY,IAAI,IAAI;IAI7B;;OAEG;IACH,OAAO,CAAC,wBAAwB;IAUhC;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAezB;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAS3B,OAAO,CAAC,cAAc;IA8CtB,OAAO,CAAC,YAAY;IAkCpB,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,kBAAkB;YAmBZ,OAAO;IAgBrB,OAAO,CAAC,UAAU;IAmBlB,OAAO,CAAC,UAAU;IAmBlB,OAAO,CAAC,mBAAmB;IAQ3B,OAAO,CAAC,mBAAmB;IAelB,MAAM;IAuDf,OAAgB,MAAM,4BAAU;CACjC"}

package/input.component.js

@@ -19,17 +19,19 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { LitElement, html, nothing } from 'lit';
+import { LitElement, html } from 'lit';
 import { customElement, property, query, state } from 'lit/decorators.js';
 import { styles } from './input.style.js';
-import { EMPTY_STRING } from './input.constant.js';
-import { choose } from 'lit/directives/choose.js';
+import { EMPTY_STRING } from './input.types.js';
 import { NuralyUIBaseMixin } from '../../shared/base-mixin.js';
+import { InputValidationUtils } from './utils/input-validation.utils.js';
+import { InputRenderUtils } from './utils/input-renderers.js';
 import '../icon/icon.component.js';
 let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement) {
     constructor() {
         super(...arguments);
         this.disabled = false;
+        this.readonly = false;
         this.state = "default" /* INPUT_STATE.Default */;
         this.value = EMPTY_STRING;
         this.size = "medium" /* INPUT_SIZE.Medium */;
@@ -38,6 +40,8 @@ let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement)
         this.autocomplete = 'off';
         this.withCopy = false;
         this.inputType = EMPTY_STRING;
+        this.hasAddonBefore = false;
+        this.hasAddonAfter = false;
         /**
          * Required components that must be registered for this component to work properly
          */
@@ -57,6 +61,13 @@ let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement)
                 this.value = this.min;
             }
         }
+        // Validate numeric properties when they change
+        if (_changedProperties.has('type') ||
+            _changedProperties.has('min') ||
+            _changedProperties.has('max') ||
+            _changedProperties.has('step')) {
+            InputValidationUtils.validateNumericProperties(this.type, this.min, this.max, this.step);
+        }
     }
     updated(_changedProperties) {
         if (_changedProperties.has('step') || _changedProperties.has('min') || _changedProperties.has('max')) {
@@ -77,60 +88,125 @@ let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement)
             }
         }
     }
-    _increment() {
-        this.input.stepUp();
-        this.value = this.input.value; // Sync the property
-        this.dispatchEvent(new CustomEvent('nr-input', {
-            detail: {
-                value: this.value,
-                target: this.input,
-                action: 'increment'
-            },
-            bubbles: true
-        }));
+    firstUpdated() {
+        this._checkInitialSlotContent();
     }
-    _decrement() {
-        this.input.stepDown();
-        this.value = this.input.value; // Sync the property
-        this.dispatchEvent(new CustomEvent('nr-input', {
-            detail: {
-                value: this.value,
-                target: this.input,
-                action: 'decrement'
-            },
-            bubbles: true
-        }));
+    /**
+     * Check initial slot content on first render
+     */
+    _checkInitialSlotContent() {
+        // Check for addon-before content
+        const addonBeforeElements = this.querySelectorAll('[slot="addon-before"]');
+        this.hasAddonBefore = addonBeforeElements.length > 0;
+        // Check for addon-after content  
+        const addonAfterElements = this.querySelectorAll('[slot="addon-after"]');
+        this.hasAddonAfter = addonAfterElements.length > 0;
     }
-    _valueChange(e) {
-        const target = e.target;
-        this.value = target.value;
-        this.dispatchEvent(new CustomEvent('nr-input', {
-            detail: {
-                value: this.value,
-                target: target,
-                originalEvent: e
-            },
+    /**
+     * Handle slot changes to determine addon visibility
+     */
+    _handleSlotChange(e) {
+        const slot = e.target;
+        const slotName = slot.name;
+        if (slotName === 'addon-before') {
+            this.hasAddonBefore = slot.assignedElements().length > 0;
+        }
+        else if (slotName === 'addon-after') {
+            this.hasAddonAfter = slot.assignedElements().length > 0;
+        }
+    }
+    // ========================================
+    // EVENT HANDLING METHODS
+    // ========================================
+    /**
+     * Centralized event dispatcher to ensure consistent event structure
+     */
+    _dispatchInputEvent(eventName, detail) {
+        this.dispatchEvent(new CustomEvent(eventName, {
+            detail,
             bubbles: true
         }));
     }
-    handleKeyDown(keyDownEvent) {
+    _handleKeyDown(keyDownEvent) {
+        // Prevent all key input when readonly
+        if (this.readonly) {
+            const allowedReadonlyKeys = [
+                'Tab', 'Escape', 'ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown',
+                'Home', 'End', 'PageUp', 'PageDown'
+            ];
+            if (keyDownEvent.ctrlKey || keyDownEvent.metaKey) {
+                const allowedCombinations = ['KeyA', 'KeyC'];
+                if (allowedCombinations.includes(keyDownEvent.code)) {
+                    return;
+                }
+            }
+            if (!allowedReadonlyKeys.includes(keyDownEvent.key)) {
+                keyDownEvent.preventDefault();
+                return;
+            }
+        }
+        // Handle Enter key
         if (keyDownEvent.key === 'Enter') {
-            this.dispatchEvent(new CustomEvent('nr-enter', {
-                detail: {
+            this._dispatchInputEvent('nr-enter', {
+                target: keyDownEvent.target,
+                value: this.value,
+                originalEvent: keyDownEvent
+            });
+            return;
+        }
+        // Prevent non-numeric input for number type
+        if (this.type === "number" /* INPUT_TYPE.NUMBER */) {
+            InputValidationUtils.preventNonNumericInput(keyDownEvent, this.min);
+            if (keyDownEvent.defaultPrevented) {
+                this._dispatchInputEvent('nr-invalid-key', {
+                    key: keyDownEvent.key,
                     target: keyDownEvent.target,
                     value: this.value,
                     originalEvent: keyDownEvent
-                },
-                bubbles: true
-            }));
+                });
+            }
+        }
+    }
+    _valueChange(e) {
+        if (this.readonly) {
+            e.preventDefault();
+            return;
         }
+        const target = e.target;
+        const newValue = target.value;
+        if (this.type === "number" /* INPUT_TYPE.NUMBER */ && newValue) {
+            const validation = InputValidationUtils.validateNumericValue(newValue, this.min, this.max);
+            if (!validation.isValid) {
+                console.warn(validation.warnings[0]);
+                this._dispatchInputEvent('nr-validation-error', {
+                    value: newValue,
+                    target: target,
+                    error: validation.warnings[0],
+                    originalEvent: e
+                });
+                return;
+            }
+            validation.warnings.forEach(warning => console.warn(warning));
+        }
+        this.value = newValue;
+        this._dispatchInputEvent('nr-input', {
+            value: this.value,
+            target: target,
+            originalEvent: e
+        });
+    }
+    _focusEvent(e) {
+        this._dispatchInputEvent('nr-focus', {
+            target: e.target,
+            value: this.value
+        });
     }
     _handleIconKeydown(keyDownEvent) {
         if (keyDownEvent.key === 'Enter' || keyDownEvent.key === ' ') {
             keyDownEvent.preventDefault();
             const target = keyDownEvent.target;
             if (target.id === 'copy-icon') {
-                this.onCopy();
+                this._onCopy();
             }
             else if (target.id === 'password-icon') {
                 this._togglePasswordIcon();
@@ -145,43 +221,59 @@ let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement)
             }
         }
     }
-    onCopy() {
+    _onCopy() {
         return __awaiter(this, void 0, void 0, function* () {
             try {
                 const input = this.shadowRoot.getElementById('input');
                 input.select();
                 yield navigator.clipboard.writeText(input.value);
-                this.dispatchEvent(new CustomEvent('nr-copy-success', {
-                    detail: { value: input.value },
-                    bubbles: true
-                }));
+                this._dispatchInputEvent('nr-copy-success', { value: input.value });
             }
             catch (error) {
-                this.dispatchEvent(new CustomEvent('nr-copy-error', {
-                    detail: { error },
-                    bubbles: true
-                }));
+                this._dispatchInputEvent('nr-copy-error', { error });
             }
         });
     }
-    _getAriaDescribedBy() {
-        var _a;
-        const describedBy = [];
-        // Check if helper text slot has content
-        const helperSlot = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot[name="helper-text"]');
-        if (helperSlot && helperSlot.assignedNodes().length > 0) {
-            describedBy.push('helper-text');
+    // ========================================
+    // OPERATION METHODS
+    // ========================================
+    _increment() {
+        try {
+            this.input.stepUp();
+            this.value = this.input.value;
+            this._dispatchInputEvent('nr-input', {
+                value: this.value,
+                target: this.input,
+                action: 'increment'
+            });
+        }
+        catch (error) {
+            console.warn('Failed to increment value:', error);
+            this._dispatchInputEvent('nr-increment-error', {
+                error,
+                value: this.value,
+                target: this.input
+            });
         }
-        return describedBy.join(' ') || '';
     }
-    _focusEvent(e) {
-        this.dispatchEvent(new CustomEvent('nr-focus', {
-            detail: {
-                target: e.target,
-                value: this.value
-            },
-            bubbles: true
-        }));
+    _decrement() {
+        try {
+            this.input.stepDown();
+            this.value = this.input.value;
+            this._dispatchInputEvent('nr-input', {
+                value: this.value,
+                target: this.input,
+                action: 'decrement'
+            });
+        }
+        catch (error) {
+            console.warn('Failed to decrement value:', error);
+            this._dispatchInputEvent('nr-decrement-error', {
+                error,
+                value: this.value,
+                target: this.input
+            });
+        }
     }
     _togglePasswordIcon() {
         if (this.inputType === "password" /* INPUT_TYPE.PASSWORD */) {
@@ -191,82 +283,47 @@ let NrInputElement = class NrInputElement extends NuralyUIBaseMixin(LitElement)
             this.inputType = "password" /* INPUT_TYPE.PASSWORD */;
         }
     }
+    _getAriaDescribedBy() {
+        var _a;
+        const describedBy = [];
+        const helperSlot = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot[name="helper-text"]');
+        if (helperSlot && helperSlot.assignedNodes().length > 0) {
+            describedBy.push('helper-text');
+        }
+        return describedBy.join(' ') || '';
+    }
+    // ========================================
+    // RENDER METHODS
+    // ========================================
     render() {
         return html `
       <slot name="label"></slot>
-      <div data-size=${this.size} id="input-container">
-        <input
-          id="input"
-          .disabled=${this.disabled}
-          .value=${this.value}
-          .placeholder=${this.placeholder}
-          .type="${this.inputType}"
-          .autocomplete=${this.autocomplete}
-          aria-invalid=${this.state === "error" /* INPUT_STATE.Error */ ? 'true' : 'false'}
-          aria-describedby=${this._getAriaDescribedBy()}
-          @input=${this._valueChange}
-          @focus=${this._focusEvent}
-          @keydown=${this.handleKeyDown}
-        />
-        ${this.withCopy
-            ? html `<hy-icon
-            name="copy"
-            type="regular"
-            id="copy-icon"
-            role="button"
-            aria-label="Copy input value"
-            tabindex="0"
-            @click=${!this.disabled ? this.onCopy : nothing}
-            @keydown=${this._handleIconKeydown}
-          ></hy-icon>`
-            : nothing}
-        ${choose(this.state, [
-            ["default" /* INPUT_STATE.Default */, () => undefined],
-            ["warning" /* INPUT_STATE.Warning */, () => html `<hy-icon name="warning" id="warning-icon"></hy-icon>`],
-            ["error" /* INPUT_STATE.Error */, () => html `<hy-icon name="exclamation-circle" id="error-icon"></hy-icon>`],
-        ])}
-        ${this.state == "default" /* INPUT_STATE.Default */ && this.type == "calendar" /* INPUT_TYPE.CALENDAR */
-            ? html `<hy-icon name="calendar" type="regular" id="calendar-icon"></hy-icon>`
-            : nothing}
-        ${this.type == "password" /* INPUT_TYPE.PASSWORD */
-            ? choose(this.inputType, [
-                [
-                    "text" /* INPUT_TYPE.TEXT */,
-                    () => html `<hy-icon
-                  name="eye-slash"
-                  type="regular"
-                  id="password-icon"
-                  role="button"
-                  aria-label="Hide password"
-                  tabindex="0"
-                  @click=${!this.disabled ? this._togglePasswordIcon : nothing}
-                  @keydown=${this._handleIconKeydown}
-                ></hy-icon>`,
-                ],
-                [
-                    "password" /* INPUT_TYPE.PASSWORD */,
-                    () => html `<hy-icon
-                  name="eye"
-                  type="regular"
-                  id="password-icon"
-                  role="button"
-                  aria-label="Show password"
-                  tabindex="0"
-                  @click=${!this.disabled ? this._togglePasswordIcon : nothing}
-                  @keydown=${this._handleIconKeydown}
-                ></hy-icon>`,
-                ],
-            ])
-            : this.type == "number" /* INPUT_TYPE.NUMBER */
-                ? html `
-              <div id="number-icons">
-                ${this.state != "default" /* INPUT_STATE.Default */ ? html `<span id="icons-separator">|</span>` : nothing}
-                <hy-icon name="minus" @click=${!this.disabled ? this._decrement : nothing}></hy-icon>
-                <span id="icons-separator">|</span>
-                <hy-icon name="plus" @click=${!this.disabled ? this._increment : nothing}></hy-icon>
-              </div>
-            `
-                : nothing}
+      <div class="input-wrapper" data-theme="${this.currentTheme}">
+        ${InputRenderUtils.renderAddonBefore(this.hasAddonBefore, (e) => this._handleSlotChange(e))}
+        <div data-size=${this.size} id="input-container">
+          ${InputRenderUtils.renderPrefix()}
+          <input
+            id="input"
+            .disabled=${this.disabled}
+            .readOnly=${this.readonly}
+            .value=${this.value}
+            .placeholder=${this.placeholder}
+            .type="${this.inputType}"
+            .autocomplete=${this.autocomplete}
+            aria-invalid=${this.state === "error" /* INPUT_STATE.Error */ ? 'true' : 'false'}
+            aria-describedby=${this._getAriaDescribedBy()}
+            @input=${this._valueChange}
+            @focus=${this._focusEvent}
+            @keydown=${this._handleKeyDown}
+          />
+          ${InputRenderUtils.renderSuffix()}
+          ${InputRenderUtils.renderCopyIcon(this.withCopy, this.disabled, this.readonly, () => this._onCopy(), (e) => this._handleIconKeydown(e))}
+          ${InputRenderUtils.renderStateIcon(this.state)}
+          ${InputRenderUtils.renderCalendarIcon(this.state, this.type)}
+          ${InputRenderUtils.renderPasswordIcon(this.type, this.inputType, this.disabled, this.readonly, () => this._togglePasswordIcon(), (e) => this._handleIconKeydown(e))}
+          ${InputRenderUtils.renderNumberIcons(this.type, this.state, this.disabled, this.readonly, () => this._increment(), () => this._decrement(), (e) => this._handleIconKeydown(e))}
+        </div>
+        ${InputRenderUtils.renderAddonAfter(this.hasAddonAfter, (e) => this._handleSlotChange(e))}
       </div>
       <slot name="helper-text"></slot>
     `;
@@ -276,6 +333,9 @@ NrInputElement.styles = styles;
 __decorate([
     property({ type: Boolean, reflect: true })
 ], NrInputElement.prototype, "disabled", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], NrInputElement.prototype, "readonly", void 0);
 __decorate([
     property({ type: String, reflect: true })
 ], NrInputElement.prototype, "state", void 0);
@@ -309,6 +369,12 @@ __decorate([
 __decorate([
     state()
 ], NrInputElement.prototype, "inputType", void 0);
+__decorate([
+    state()
+], NrInputElement.prototype, "hasAddonBefore", void 0);
+__decorate([
+    state()
+], NrInputElement.prototype, "hasAddonAfter", void 0);
 __decorate([
     query('#input')
 ], NrInputElement.prototype, "input", void 0);

package/input.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.component.js","sourceRoot":"","sources":["../../../src/components/input/input.component.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/**\n * @license\n * Copyright 2023 Google Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport { LitElement, PropertyValues, html, nothing } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { styles } from './input.style.js';\nimport { INPUT_TYPE, INPUT_STATE, INPUT_SIZE, EMPTY_STRING } from './input.constant.js';\nimport { choose } from 'lit/directives/choose.js';\nimport { NuralyUIBaseMixin } from '../../shared/base-mixin.js';\nimport '../icon/icon.component.js';\n\n@customElement('nr-input')\nexport class NrInputElement extends NuralyUIBaseMixin(LitElement) {\n\n  @property({type: Boolean, reflect: true})\n  disabled = false;\n\n  @property({type: String, reflect: true})\n  state = INPUT_STATE.Default;\n\n  @property({type: String})\n  value = EMPTY_STRING;\n\n  @property({type: String})\n  size = INPUT_SIZE.Medium;\n\n  @property({reflect: true})\n  type = INPUT_TYPE.TEXT;\n\n  @property({type: String})\n  step?: string;\n\n  @property({type: String})\n  min?: string;\n\n  @property({type: String})\n  max?: string;\n\n  @property({type: String})\n  placeholder = EMPTY_STRING;\n\n  @property({type: String})\n  autocomplete = 'off';\n\n  @property({type: Boolean, reflect: true})\n  withCopy = false;\n\n  @state()\n  inputType = EMPTY_STRING;\n\n  @query('#input')\n  input!: HTMLInputElement;\n\n  /**\n   * Required components that must be registered for this component to work properly\n   */\n  override requiredComponents = ['hy-icon'];\n\n  /**\n   * Check for required dependencies when component is connected to DOM\n   */\n  override connectedCallback() {\n    super.connectedCallback();\n    this.validateDependencies();\n  }\n\n  override willUpdate(_changedProperties: PropertyValues): void {\n    if (_changedProperties.has('type')) {\n      this.inputType = this.type;\n      if (this.inputType === INPUT_TYPE.NUMBER && this.min && !this.value) {\n        this.value = this.min;\n      }\n    }\n  }\n\n  override updated(_changedProperties: PropertyValues): void {\n    if (_changedProperties.has('step') || _changedProperties.has('min') || _changedProperties.has('max')) {\n      const input = this.input;\n      if (input) {\n        if (this.step) input.setAttribute('step', this.step);\n        else input.removeAttribute('step');\n        \n        if (this.min) input.setAttribute('min', this.min);\n        else input.removeAttribute('min');\n        \n        if (this.max) input.setAttribute('max', this.max);\n        else input.removeAttribute('max');\n      }\n    }\n  }\n\n  private _increment() {\n    this.input.stepUp();\n    this.value = this.input.value; // Sync the property\n    this.dispatchEvent(\n      new CustomEvent('nr-input', {\n        detail: { \n          value: this.value, \n          target: this.input,\n          action: 'increment'\n        },\n        bubbles: true\n      })\n    );\n  }\n  private _decrement() {\n    this.input.stepDown();\n    this.value = this.input.value; // Sync the property\n    this.dispatchEvent(\n      new CustomEvent('nr-input', {\n        detail: { \n          value: this.value, \n          target: this.input,\n          action: 'decrement'\n        },\n        bubbles: true\n      })\n    );\n  }\n\n  private _valueChange(e: Event) {\n    const target = e.target as HTMLInputElement;\n    this.value = target.value;\n    \n    this.dispatchEvent(\n      new CustomEvent('nr-input', {\n        detail: { \n          value: this.value, \n          target: target,\n          originalEvent: e \n        },\n        bubbles: true\n      })\n    );\n  }\n  private handleKeyDown(keyDownEvent: KeyboardEvent) {\n    if (keyDownEvent.key === 'Enter') {\n      this.dispatchEvent(\n        new CustomEvent('nr-enter', {\n          detail: {\n            target: keyDownEvent.target,\n            value: this.value,\n            originalEvent: keyDownEvent\n          },\n          bubbles: true\n        })\n      );\n    }\n  }\n\n  private _handleIconKeydown(keyDownEvent: KeyboardEvent) {\n    if (keyDownEvent.key === 'Enter' || keyDownEvent.key === ' ') {\n      keyDownEvent.preventDefault();\n      const target = keyDownEvent.target as HTMLElement;\n      \n      if (target.id === 'copy-icon') {\n        this.onCopy();\n      } else if (target.id === 'password-icon') {\n        this._togglePasswordIcon();\n      } else if (target.closest('#number-icons')) {\n        if (target.getAttribute('name') === 'plus') {\n          this._increment();\n        } else if (target.getAttribute('name') === 'minus') {\n          this._decrement();\n        }\n      }\n    }\n  }\n  private async onCopy() {\n    try {\n      const input = this.shadowRoot!.getElementById('input')! as HTMLInputElement;\n      input.select();\n      await navigator.clipboard.writeText(input.value);\n      \n      this.dispatchEvent(new CustomEvent('nr-copy-success', {\n        detail: { value: input.value },\n        bubbles: true\n      }));\n    } catch (error) {\n      this.dispatchEvent(new CustomEvent('nr-copy-error', {\n        detail: { error },\n        bubbles: true\n      }));\n    }\n  }\n\n  private _getAriaDescribedBy(): string {\n    const describedBy: string[] = [];\n    \n    // Check if helper text slot has content\n    const helperSlot = this.shadowRoot?.querySelector('slot[name=\"helper-text\"]');\n    if (helperSlot && (helperSlot as HTMLSlotElement).assignedNodes().length > 0) {\n      describedBy.push('helper-text');\n    }\n    \n    return describedBy.join(' ') || '';\n  }\n\n  private _focusEvent(e: Event) {\n    this.dispatchEvent(\n      new CustomEvent('nr-focus', {\n        detail: {\n          target: e.target,\n          value: this.value\n        },\n        bubbles: true\n      })\n    );\n  }\n\n  _togglePasswordIcon() {\n    if (this.inputType === INPUT_TYPE.PASSWORD) {\n      this.inputType = INPUT_TYPE.TEXT;\n    } else if (this.inputType === INPUT_TYPE.TEXT && this.type === INPUT_TYPE.PASSWORD) {\n      this.inputType = INPUT_TYPE.PASSWORD;\n    }\n  }\n\n  override render() {\n    return html`\n      <slot name=\"label\"></slot>\n      <div data-size=${this.size} id=\"input-container\">\n        <input\n          id=\"input\"\n          .disabled=${this.disabled}\n          .value=${this.value}\n          .placeholder=${this.placeholder}\n          .type=\"${this.inputType}\"\n          .autocomplete=${this.autocomplete}\n          aria-invalid=${this.state === INPUT_STATE.Error ? 'true' : 'false'}\n          aria-describedby=${this._getAriaDescribedBy()}\n          @input=${this._valueChange}\n          @focus=${this._focusEvent}\n          @keydown=${this.handleKeyDown}\n        />\n        ${this.withCopy\n          ? html`<hy-icon\n            name=\"copy\"\n            type=\"regular\"\n            id=\"copy-icon\"\n            role=\"button\"\n            aria-label=\"Copy input value\"\n            tabindex=\"0\"\n            @click=${!this.disabled ? this.onCopy : nothing}\n            @keydown=${this._handleIconKeydown}\n          ></hy-icon>`\n          : nothing}\n        ${choose(this.state, [\n          [INPUT_STATE.Default, () => undefined],\n          [INPUT_STATE.Warning, () => html`<hy-icon name=\"warning\" id=\"warning-icon\"></hy-icon>`],\n          [INPUT_STATE.Error, () => html`<hy-icon name=\"exclamation-circle\" id=\"error-icon\"></hy-icon>`],\n        ])}\n        ${this.state == INPUT_STATE.Default && this.type == INPUT_TYPE.CALENDAR\n          ? html`<hy-icon name=\"calendar\" type=\"regular\" id=\"calendar-icon\"></hy-icon>`\n          : nothing}\n        ${this.type == INPUT_TYPE.PASSWORD\n          ? choose(this.inputType, [\n            [\n              INPUT_TYPE.TEXT,\n              () =>\n                html`<hy-icon\n                  name=\"eye-slash\"\n                  type=\"regular\"\n                  id=\"password-icon\"\n                  role=\"button\"\n                  aria-label=\"Hide password\"\n                  tabindex=\"0\"\n                  @click=${!this.disabled ? this._togglePasswordIcon : nothing}\n                  @keydown=${this._handleIconKeydown}\n                ></hy-icon>`,\n            ],\n            [\n              INPUT_TYPE.PASSWORD,\n              () =>\n                html`<hy-icon\n                  name=\"eye\"\n                  type=\"regular\"\n                  id=\"password-icon\"\n                  role=\"button\"\n                  aria-label=\"Show password\"\n                  tabindex=\"0\"\n                  @click=${!this.disabled ? this._togglePasswordIcon : nothing}\n                  @keydown=${this._handleIconKeydown}\n                ></hy-icon>`,\n            ],\n          ])\n          : this.type == INPUT_TYPE.NUMBER\n            ? html`\n              <div id=\"number-icons\">\n                ${this.state != INPUT_STATE.Default ? html`<span id=\"icons-separator\">|</span>` : nothing}\n                <hy-icon name=\"minus\" @click=${!this.disabled ? this._decrement : nothing}></hy-icon>\n                <span id=\"icons-separator\">|</span>\n                <hy-icon name=\"plus\" @click=${!this.disabled ? this._increment : nothing}></hy-icon>\n              </div>\n            `\n            : nothing}\n      </div>\n      <slot name=\"helper-text\"></slot>\n    `;\n  }\n\n  static override styles = styles;\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nr-input': NrInputElement;\n  }\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      'nr-input':\n        | React.DetailedHTMLProps<React.HTMLAttributes<NrInputElement>, NrInputElement>\n        | Partial<NrInputElement>;\n    }\n  }\n}"]}
+{"version":3,"file":"input.component.js","sourceRoot":"","sources":["../../../src/components/input/input.component.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/**\n * @license\n * Copyright 2023 Google Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport { LitElement, PropertyValues, html } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { styles } from './input.style.js';\nimport { INPUT_TYPE, INPUT_STATE, INPUT_SIZE, EMPTY_STRING } from './input.types.js';\nimport { NuralyUIBaseMixin } from '../../shared/base-mixin.js';\nimport { InputValidationUtils } from './utils/input-validation.utils.js';\nimport { InputRenderUtils } from './utils/input-renderers.js';\nimport '../icon/icon.component.js';\n\n@customElement('nr-input')\nexport class NrInputElement extends NuralyUIBaseMixin(LitElement) {\n\n  @property({type: Boolean, reflect: true})\n  disabled = false;\n\n  @property({type: Boolean, reflect: true})\n  readonly = false;\n\n  @property({type: String, reflect: true})\n  state = INPUT_STATE.Default;\n\n  @property({type: String})\n  value = EMPTY_STRING;\n\n  @property({type: String})\n  size = INPUT_SIZE.Medium;\n\n  @property({reflect: true})\n  type = INPUT_TYPE.TEXT;\n\n  @property({type: String})\n  step?: string;\n\n  @property({type: String})\n  min?: string;\n\n  @property({type: String})\n  max?: string;\n\n  @property({type: String})\n  placeholder = EMPTY_STRING;\n\n  @property({type: String})\n  autocomplete = 'off';\n\n  @property({type: Boolean, reflect: true})\n  withCopy = false;\n\n  @state()\n  inputType = EMPTY_STRING;\n\n  @state()\n  hasAddonBefore = false;\n\n  @state()\n  hasAddonAfter = false;\n\n  @query('#input')\n  input!: HTMLInputElement;\n\n  /**\n   * Required components that must be registered for this component to work properly\n   */\n  override requiredComponents = ['hy-icon'];\n\n  /**\n   * Check for required dependencies when component is connected to DOM\n   */\n  override connectedCallback() {\n    super.connectedCallback();\n    this.validateDependencies();\n  }\n\n  override willUpdate(_changedProperties: PropertyValues): void {\n    if (_changedProperties.has('type')) {\n      this.inputType = this.type;\n      if (this.inputType === INPUT_TYPE.NUMBER && this.min && !this.value) {\n        this.value = this.min;\n      }\n    }\n    \n    // Validate numeric properties when they change\n    if (_changedProperties.has('type') || \n        _changedProperties.has('min') || \n        _changedProperties.has('max') || \n        _changedProperties.has('step')) {\n      InputValidationUtils.validateNumericProperties(this.type, this.min, this.max, this.step);\n    }\n  }\n\n  override updated(_changedProperties: PropertyValues): void {\n    if (_changedProperties.has('step') || _changedProperties.has('min') || _changedProperties.has('max')) {\n      const input = this.input;\n      if (input) {\n        if (this.step) input.setAttribute('step', this.step);\n        else input.removeAttribute('step');\n        \n        if (this.min) input.setAttribute('min', this.min);\n        else input.removeAttribute('min');\n        \n        if (this.max) input.setAttribute('max', this.max);\n        else input.removeAttribute('max');\n      }\n    }\n  }\n\n  override firstUpdated(): void {\n    this._checkInitialSlotContent();\n  }\n\n  /**\n   * Check initial slot content on first render\n   */\n  private _checkInitialSlotContent(): void {\n    // Check for addon-before content\n    const addonBeforeElements = this.querySelectorAll('[slot=\"addon-before\"]');\n    this.hasAddonBefore = addonBeforeElements.length > 0;\n\n    // Check for addon-after content  \n    const addonAfterElements = this.querySelectorAll('[slot=\"addon-after\"]');\n    this.hasAddonAfter = addonAfterElements.length > 0;\n  }\n\n  /**\n   * Handle slot changes to determine addon visibility\n   */\n  private _handleSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    const slotName = slot.name;\n    \n    if (slotName === 'addon-before') {\n      this.hasAddonBefore = slot.assignedElements().length > 0;\n    } else if (slotName === 'addon-after') {\n      this.hasAddonAfter = slot.assignedElements().length > 0;\n    }\n  }\n\n  // ========================================\n  // EVENT HANDLING METHODS\n  // ========================================\n\n  /**\n   * Centralized event dispatcher to ensure consistent event structure\n   */\n  private _dispatchInputEvent(eventName: string, detail: any): void {\n    this.dispatchEvent(\n      new CustomEvent(eventName, {\n        detail,\n        bubbles: true\n      })\n    );\n  }\n\n  private _handleKeyDown(keyDownEvent: KeyboardEvent) {\n    // Prevent all key input when readonly\n    if (this.readonly) {\n      const allowedReadonlyKeys = [\n        'Tab', 'Escape', 'ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown',\n        'Home', 'End', 'PageUp', 'PageDown'\n      ];\n      \n      if (keyDownEvent.ctrlKey || keyDownEvent.metaKey) {\n        const allowedCombinations = ['KeyA', 'KeyC'];\n        if (allowedCombinations.includes(keyDownEvent.code)) {\n          return;\n        }\n      }\n      \n      if (!allowedReadonlyKeys.includes(keyDownEvent.key)) {\n        keyDownEvent.preventDefault();\n        return;\n      }\n    }\n\n    // Handle Enter key\n    if (keyDownEvent.key === 'Enter') {\n      this._dispatchInputEvent('nr-enter', {\n        target: keyDownEvent.target,\n        value: this.value,\n        originalEvent: keyDownEvent\n      });\n      return;\n    }\n\n    // Prevent non-numeric input for number type\n    if (this.type === INPUT_TYPE.NUMBER) {\n      InputValidationUtils.preventNonNumericInput(keyDownEvent, this.min);\n      \n      if (keyDownEvent.defaultPrevented) {\n        this._dispatchInputEvent('nr-invalid-key', {\n          key: keyDownEvent.key,\n          target: keyDownEvent.target,\n          value: this.value,\n          originalEvent: keyDownEvent\n        });\n      }\n    }\n  }\n\n  private _valueChange(e: Event) {\n    if (this.readonly) {\n      e.preventDefault();\n      return;\n    }\n\n    const target = e.target as HTMLInputElement;\n    const newValue = target.value;\n    \n    if (this.type === INPUT_TYPE.NUMBER && newValue) {\n      const validation = InputValidationUtils.validateNumericValue(newValue, this.min, this.max);\n      \n      if (!validation.isValid) {\n        console.warn(validation.warnings[0]);\n        this._dispatchInputEvent('nr-validation-error', {\n          value: newValue,\n          target: target,\n          error: validation.warnings[0],\n          originalEvent: e\n        });\n        return;\n      }\n      \n      validation.warnings.forEach(warning => console.warn(warning));\n    }\n    \n    this.value = newValue;\n    this._dispatchInputEvent('nr-input', {\n      value: this.value, \n      target: target,\n      originalEvent: e \n    });\n  }\n\n  private _focusEvent(e: Event) {\n    this._dispatchInputEvent('nr-focus', {\n      target: e.target,\n      value: this.value\n    });\n  }\n\n  private _handleIconKeydown(keyDownEvent: KeyboardEvent) {\n    if (keyDownEvent.key === 'Enter' || keyDownEvent.key === ' ') {\n      keyDownEvent.preventDefault();\n      const target = keyDownEvent.target as HTMLElement;\n      \n      if (target.id === 'copy-icon') {\n        this._onCopy();\n      } else if (target.id === 'password-icon') {\n        this._togglePasswordIcon();\n      } else if (target.closest('#number-icons')) {\n        if (target.getAttribute('name') === 'plus') {\n          this._increment();\n        } else if (target.getAttribute('name') === 'minus') {\n          this._decrement();\n        }\n      }\n    }\n  }\n\n  private async _onCopy() {\n    try {\n      const input = this.shadowRoot!.getElementById('input')! as HTMLInputElement;\n      input.select();\n      await navigator.clipboard.writeText(input.value);\n      \n      this._dispatchInputEvent('nr-copy-success', { value: input.value });\n    } catch (error) {\n      this._dispatchInputEvent('nr-copy-error', { error });\n    }\n  }\n\n  // ========================================\n  // OPERATION METHODS\n  // ========================================\n\n  private _increment() {\n    try {\n      this.input.stepUp();\n      this.value = this.input.value;\n      this._dispatchInputEvent('nr-input', {\n        value: this.value, \n        target: this.input,\n        action: 'increment'\n      });\n    } catch (error) {\n      console.warn('Failed to increment value:', error);\n      this._dispatchInputEvent('nr-increment-error', {\n        error,\n        value: this.value,\n        target: this.input\n      });\n    }\n  }\n\n  private _decrement() {\n    try {\n      this.input.stepDown();\n      this.value = this.input.value;\n      this._dispatchInputEvent('nr-input', {\n        value: this.value, \n        target: this.input,\n        action: 'decrement'\n      });\n    } catch (error) {\n      console.warn('Failed to decrement value:', error);\n      this._dispatchInputEvent('nr-decrement-error', {\n        error,\n        value: this.value,\n        target: this.input\n      });\n    }\n  }\n\n  private _togglePasswordIcon() {\n    if (this.inputType === INPUT_TYPE.PASSWORD) {\n      this.inputType = INPUT_TYPE.TEXT;\n    } else if (this.inputType === INPUT_TYPE.TEXT && this.type === INPUT_TYPE.PASSWORD) {\n      this.inputType = INPUT_TYPE.PASSWORD;\n    }\n  }\n\n  private _getAriaDescribedBy(): string {\n    const describedBy: string[] = [];\n    \n    const helperSlot = this.shadowRoot?.querySelector('slot[name=\"helper-text\"]');\n    if (helperSlot && (helperSlot as HTMLSlotElement).assignedNodes().length > 0) {\n      describedBy.push('helper-text');\n    }\n    \n    return describedBy.join(' ') || '';\n  }\n\n  // ========================================\n  // RENDER METHODS\n  // ========================================\n\n  override render() {\n    return html`\n      <slot name=\"label\"></slot>\n      <div class=\"input-wrapper\" data-theme=\"${this.currentTheme}\">\n        ${InputRenderUtils.renderAddonBefore(this.hasAddonBefore, (e: Event) => this._handleSlotChange(e))}\n        <div data-size=${this.size} id=\"input-container\">\n          ${InputRenderUtils.renderPrefix()}\n          <input\n            id=\"input\"\n            .disabled=${this.disabled}\n            .readOnly=${this.readonly}\n            .value=${this.value}\n            .placeholder=${this.placeholder}\n            .type=\"${this.inputType}\"\n            .autocomplete=${this.autocomplete}\n            aria-invalid=${this.state === INPUT_STATE.Error ? 'true' : 'false'}\n            aria-describedby=${this._getAriaDescribedBy()}\n            @input=${this._valueChange}\n            @focus=${this._focusEvent}\n            @keydown=${this._handleKeyDown}\n          />\n          ${InputRenderUtils.renderSuffix()}\n          ${InputRenderUtils.renderCopyIcon(\n            this.withCopy,\n            this.disabled,\n            this.readonly,\n            () => this._onCopy(),\n            (e: KeyboardEvent) => this._handleIconKeydown(e)\n          )}\n          ${InputRenderUtils.renderStateIcon(this.state)}\n          ${InputRenderUtils.renderCalendarIcon(this.state, this.type)}\n          ${InputRenderUtils.renderPasswordIcon(\n            this.type,\n            this.inputType,\n            this.disabled,\n            this.readonly,\n            () => this._togglePasswordIcon(),\n            (e: KeyboardEvent) => this._handleIconKeydown(e)\n          )}\n          ${InputRenderUtils.renderNumberIcons(\n            this.type,\n            this.state,\n            this.disabled,\n            this.readonly,\n            () => this._increment(),\n            () => this._decrement(),\n            (e: KeyboardEvent) => this._handleIconKeydown(e)\n          )}\n        </div>\n        ${InputRenderUtils.renderAddonAfter(this.hasAddonAfter, (e: Event) => this._handleSlotChange(e))}\n      </div>\n      <slot name=\"helper-text\"></slot>\n    `;\n  }\n\n  static override styles = styles;\n}\n\n"]}

package/input.style.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.style.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.style.ts"],"names":[],"mappings":"AA0VA,eAAO,MAAM,MAAM,2BAA+C,CAAC"}
+{"version":3,"file":"input.style.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.style.ts"],"names":[],"mappings":"AAycA,eAAO,MAAM,MAAM,2BAA+C,CAAC"}