@nuralyui/input 0.0.5 → 0.0.6

package/utils/input-renderers.js

@@ -0,0 +1,157 @@
+/**
+ * @license
+ * Copyright 2023 Google Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+import { html, nothing } from 'lit';
+/**
+ * Rendering utilities for input component icons and elements
+ */
+export class InputRenderUtils {
+    /**
+     * Renders prefix slot content
+     */
+    static renderPrefix() {
+        return html `
+      <div class="input-prefix">
+        <slot name="prefix"></slot>
+      </div>
+    `;
+    }
+    /**
+     * Renders suffix slot content
+     */
+    static renderSuffix() {
+        return html `
+      <div class="input-suffix">
+        <slot name="suffix"></slot>
+      </div>
+    `;
+    }
+    /**
+     * Renders addon before slot content (outside input borders)
+     * Only renders if hasAddonBefore is true
+     */
+    static renderAddonBefore(hasAddonBefore, onSlotChange) {
+        if (!hasAddonBefore)
+            return nothing;
+        return html `
+      <div class="input-addon-before">
+        <slot name="addon-before" @slotchange=${onSlotChange}></slot>
+      </div>
+    `;
+    }
+    /**
+     * Renders addon after slot content (outside input borders)
+     * Only renders if hasAddonAfter is true
+     */
+    static renderAddonAfter(hasAddonAfter, onSlotChange) {
+        if (!hasAddonAfter)
+            return nothing;
+        return html `
+      <div class="input-addon-after">
+        <slot name="addon-after" @slotchange=${onSlotChange}></slot>
+      </div>
+    `;
+    }
+    /**
+     * Renders the copy icon when withCopy is enabled
+     */
+    static renderCopyIcon(withCopy, disabled, readonly, onCopy, onKeydown) {
+        if (!withCopy)
+            return nothing;
+        return html `<hy-icon
+      name="copy"
+      type="regular"
+      id="copy-icon"
+      role="button"
+      aria-label="Copy input value"
+      tabindex="0"
+      @click=${!disabled && !readonly ? onCopy : nothing}
+      @keydown=${onKeydown}
+    ></hy-icon>`;
+    }
+    /**
+     * Renders state-based icons (warning, error)
+     */
+    static renderStateIcon(state) {
+        switch (state) {
+            case "warning" /* INPUT_STATE.Warning */:
+                return html `<hy-icon name="warning" id="warning-icon"></hy-icon>`;
+            case "error" /* INPUT_STATE.Error */:
+                return html `<hy-icon name="exclamation-circle" id="error-icon"></hy-icon>`;
+            default:
+                return nothing;
+        }
+    }
+    /**
+     * Renders the calendar icon for calendar input type
+     */
+    static renderCalendarIcon(state, type) {
+        if (state !== "default" /* INPUT_STATE.Default */ || type !== "calendar" /* INPUT_TYPE.CALENDAR */) {
+            return nothing;
+        }
+        return html `<hy-icon name="calendar" type="regular" id="calendar-icon"></hy-icon>`;
+    }
+    /**
+     * Renders password toggle icon
+     */
+    static renderPasswordIcon(type, inputType, disabled, readonly, onToggle, onKeydown) {
+        if (type !== "password" /* INPUT_TYPE.PASSWORD */)
+            return nothing;
+        if (inputType === "text" /* INPUT_TYPE.TEXT */) {
+            return html `<hy-icon
+        name="eye-slash"
+        type="regular"
+        id="password-icon"
+        role="button"
+        aria-label="Hide password"
+        tabindex="0"
+        @click=${!disabled && !readonly ? onToggle : nothing}
+        @keydown=${onKeydown}
+      ></hy-icon>`;
+        }
+        else {
+            return html `<hy-icon
+        name="eye"
+        type="regular"
+        id="password-icon"
+        role="button"
+        aria-label="Show password"
+        tabindex="0"
+        @click=${!disabled && !readonly ? onToggle : nothing}
+        @keydown=${onKeydown}
+      ></hy-icon>`;
+        }
+    }
+    /**
+     * Renders number input increment/decrement icons
+     */
+    static renderNumberIcons(type, state, disabled, readonly, onIncrement, onDecrement, onKeydown) {
+        if (type !== "number" /* INPUT_TYPE.NUMBER */)
+            return nothing;
+        return html `
+      <div id="number-icons">
+        ${state !== "default" /* INPUT_STATE.Default */ ? html `<span id="icons-separator">|</span>` : nothing}
+        <hy-icon 
+          name="minus" 
+          aria-label="Decrease value"
+          role="button"
+          tabindex="0"
+          @click=${!disabled && !readonly ? onDecrement : nothing}
+          @keydown=${onKeydown}
+        ></hy-icon>
+        <span id="icons-separator">|</span>
+        <hy-icon 
+          name="plus" 
+          aria-label="Increase value"
+          role="button"
+          tabindex="0"
+          @click=${!disabled && !readonly ? onIncrement : nothing}
+          @keydown=${onKeydown}
+        ></hy-icon>
+      </div>
+    `;
+    }
+}
+//# sourceMappingURL=input-renderers.js.map

package/utils/input-renderers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-renderers.js","sourceRoot":"","sources":["../../../../src/components/input/utils/input-renderers.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Google Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport { html, TemplateResult, nothing } from 'lit';\nimport { INPUT_TYPE, INPUT_STATE } from '../input.types.js';\n\n/**\n * Rendering utilities for input component icons and elements\n */\nexport class InputRenderUtils {\n\n  /**\n   * Renders prefix slot content\n   */\n  static renderPrefix(): TemplateResult {\n    return html`\n      <div class=\"input-prefix\">\n        <slot name=\"prefix\"></slot>\n      </div>\n    `;\n  }\n\n  /**\n   * Renders suffix slot content  \n   */\n  static renderSuffix(): TemplateResult {\n    return html`\n      <div class=\"input-suffix\">\n        <slot name=\"suffix\"></slot>\n      </div>\n    `;\n  }\n\n  /**\n   * Renders addon before slot content (outside input borders)\n   * Only renders if hasAddonBefore is true\n   */\n  static renderAddonBefore(hasAddonBefore: boolean, onSlotChange: (e: Event) => void): TemplateResult | typeof nothing {\n    if (!hasAddonBefore) return nothing;\n    \n    return html`\n      <div class=\"input-addon-before\">\n        <slot name=\"addon-before\" @slotchange=${onSlotChange}></slot>\n      </div>\n    `;\n  }\n\n  /**\n   * Renders addon after slot content (outside input borders)  \n   * Only renders if hasAddonAfter is true\n   */\n  static renderAddonAfter(hasAddonAfter: boolean, onSlotChange: (e: Event) => void): TemplateResult | typeof nothing {\n    if (!hasAddonAfter) return nothing;\n    \n    return html`\n      <div class=\"input-addon-after\">\n        <slot name=\"addon-after\" @slotchange=${onSlotChange}></slot>\n      </div>\n    `;\n  }\n\n  /**\n   * Renders the copy icon when withCopy is enabled\n   */\n  static renderCopyIcon(\n    withCopy: boolean,\n    disabled: boolean,\n    readonly: boolean,\n    onCopy: () => void,\n    onKeydown: (e: KeyboardEvent) => void\n  ): TemplateResult | typeof nothing {\n    if (!withCopy) return nothing;\n    \n    return 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=${!disabled && !readonly ? onCopy : nothing}\n      @keydown=${onKeydown}\n    ></hy-icon>`;\n  }\n\n  /**\n   * Renders state-based icons (warning, error)\n   */\n  static renderStateIcon(state: string): TemplateResult | typeof nothing {\n    switch (state) {\n      case INPUT_STATE.Warning:\n        return html`<hy-icon name=\"warning\" id=\"warning-icon\"></hy-icon>`;\n      case INPUT_STATE.Error:\n        return html`<hy-icon name=\"exclamation-circle\" id=\"error-icon\"></hy-icon>`;\n      default:\n        return nothing;\n    }\n  }\n\n  /**\n   * Renders the calendar icon for calendar input type\n   */\n  static renderCalendarIcon(\n    state: string,\n    type: string\n  ): TemplateResult | typeof nothing {\n    if (state !== INPUT_STATE.Default || type !== INPUT_TYPE.CALENDAR) {\n      return nothing;\n    }\n    \n    return html`<hy-icon name=\"calendar\" type=\"regular\" id=\"calendar-icon\"></hy-icon>`;\n  }\n\n  /**\n   * Renders password toggle icon\n   */\n  static renderPasswordIcon(\n    type: string,\n    inputType: string,\n    disabled: boolean,\n    readonly: boolean,\n    onToggle: () => void,\n    onKeydown: (e: KeyboardEvent) => void\n  ): TemplateResult | typeof nothing {\n    if (type !== INPUT_TYPE.PASSWORD) return nothing;\n    \n    if (inputType === INPUT_TYPE.TEXT) {\n      return 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=${!disabled && !readonly ? onToggle : nothing}\n        @keydown=${onKeydown}\n      ></hy-icon>`;\n    } else {\n      return 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=${!disabled && !readonly ? onToggle : nothing}\n        @keydown=${onKeydown}\n      ></hy-icon>`;\n    }\n  }\n\n  /**\n   * Renders number input increment/decrement icons\n   */\n  static renderNumberIcons(\n    type: string,\n    state: string,\n    disabled: boolean,\n    readonly: boolean,\n    onIncrement: () => void,\n    onDecrement: () => void,\n    onKeydown: (e: KeyboardEvent) => void\n  ): TemplateResult | typeof nothing {\n    if (type !== INPUT_TYPE.NUMBER) return nothing;\n    \n    return html`\n      <div id=\"number-icons\">\n        ${state !== INPUT_STATE.Default ? html`<span id=\"icons-separator\">|</span>` : nothing}\n        <hy-icon \n          name=\"minus\" \n          aria-label=\"Decrease value\"\n          role=\"button\"\n          tabindex=\"0\"\n          @click=${!disabled && !readonly ? onDecrement : nothing}\n          @keydown=${onKeydown}\n        ></hy-icon>\n        <span id=\"icons-separator\">|</span>\n        <hy-icon \n          name=\"plus\" \n          aria-label=\"Increase value\"\n          role=\"button\"\n          tabindex=\"0\"\n          @click=${!disabled && !readonly ? onIncrement : nothing}\n          @keydown=${onKeydown}\n        ></hy-icon>\n      </div>\n    `;\n  }\n}\n"]}

package/utils/input-validation.utils.d.ts

@@ -0,0 +1,26 @@
+/**
+ * @license
+ * Copyright 2023 Google Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+/**
+ * Validation utilities for input components
+ */
+export declare class InputValidationUtils {
+    /**
+     * Validates numeric properties (min, max, step) to ensure they are valid numbers
+     */
+    static validateNumericProperties(type: string, min?: string, max?: string, step?: string): void;
+    /**
+     * Prevents non-numeric characters from being typed in number inputs
+     */
+    static preventNonNumericInput(keyDownEvent: KeyboardEvent, min?: string): void;
+    /**
+     * Validates a numeric value against min/max constraints
+     */
+    static validateNumericValue(value: string, min?: string, max?: string): {
+        isValid: boolean;
+        warnings: string[];
+    };
+}
+//# sourceMappingURL=input-validation.utils.d.ts.map

package/utils/input-validation.utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-validation.utils.d.ts","sourceRoot":"","sources":["../../../../src/components/input/utils/input-validation.utils.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAIH;;GAEG;AACH,qBAAa,oBAAoB;IAE/B;;OAEG;IACH,MAAM,CAAC,yBAAyB,CAC9B,IAAI,EAAE,MAAM,EACZ,GAAG,CAAC,EAAE,MAAM,EACZ,GAAG,CAAC,EAAE,MAAM,EACZ,IAAI,CAAC,EAAE,MAAM,GACZ,IAAI;IAiBP;;OAEG;IACH,MAAM,CAAC,sBAAsB,CAC3B,YAAY,EAAE,aAAa,EAC3B,GAAG,CAAC,EAAE,MAAM,GACX,IAAI;IAyDP;;OAEG;IACH,MAAM,CAAC,oBAAoB,CACzB,KAAK,EAAE,MAAM,EACb,GAAG,CAAC,EAAE,MAAM,EACZ,GAAG,CAAC,EAAE,MAAM,GACX;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,QAAQ,EAAE,MAAM,EAAE,CAAA;KAAE;CA0B5C"}

package/utils/input-validation.utils.js

@@ -0,0 +1,105 @@
+/**
+ * @license
+ * Copyright 2023 Google Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+/**
+ * Validation utilities for input components
+ */
+export class InputValidationUtils {
+    /**
+     * Validates numeric properties (min, max, step) to ensure they are valid numbers
+     */
+    static validateNumericProperties(type, min, max, step) {
+        if (type === "number" /* INPUT_TYPE.NUMBER */) {
+            if (min && isNaN(Number(min))) {
+                console.warn(`Invalid min value: "${min}" is not a valid number`);
+            }
+            if (max && isNaN(Number(max))) {
+                console.warn(`Invalid max value: "${max}" is not a valid number`);
+            }
+            if (step && isNaN(Number(step))) {
+                console.warn(`Invalid step value: "${step}" is not a valid number`);
+            }
+            if (min && max && Number(min) >= Number(max)) {
+                console.warn(`Invalid range: min value (${min}) should be less than max value (${max})`);
+            }
+        }
+    }
+    /**
+     * Prevents non-numeric characters from being typed in number inputs
+     */
+    static preventNonNumericInput(keyDownEvent, min) {
+        const key = keyDownEvent.key;
+        const target = keyDownEvent.target;
+        const currentValue = target.value;
+        const cursorPosition = target.selectionStart || 0;
+        // Allow control keys (backspace, delete, tab, escape, enter, arrow keys, etc.)
+        const allowedControlKeys = [
+            'Backspace', 'Delete', 'Tab', 'Escape', 'Enter',
+            'ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown',
+            'Home', 'End', 'PageUp', 'PageDown'
+        ];
+        // Allow Ctrl/Cmd combinations (copy, paste, select all, etc.)
+        if (keyDownEvent.ctrlKey || keyDownEvent.metaKey) {
+            return;
+        }
+        // Allow control keys
+        if (allowedControlKeys.includes(key)) {
+            return;
+        }
+        // Allow digits
+        if (/^\d$/.test(key)) {
+            return;
+        }
+        // Allow decimal point (.) only once and allow it at the beginning for values like ".5"
+        if (key === '.' || key === ',') {
+            const hasDecimal = currentValue.includes('.') || currentValue.includes(',');
+            if (!hasDecimal) {
+                return;
+            }
+        }
+        // Allow minus sign (-) only at the beginning and if min allows negative numbers
+        if (key === '-') {
+            const hasMinusSign = currentValue.includes('-');
+            const minAllowsNegative = !min || Number(min) < 0;
+            if (!hasMinusSign && cursorPosition === 0 && minAllowsNegative) {
+                return;
+            }
+        }
+        // Allow plus sign (+) only at the beginning
+        if (key === '+') {
+            const hasPlusSign = currentValue.includes('+');
+            if (!hasPlusSign && cursorPosition === 0) {
+                return;
+            }
+        }
+        // If we reach here, prevent the key input
+        keyDownEvent.preventDefault();
+    }
+    /**
+     * Validates a numeric value against min/max constraints
+     */
+    static validateNumericValue(value, min, max) {
+        const warnings = [];
+        if (!value) {
+            return { isValid: true, warnings };
+        }
+        const numericValue = Number(value);
+        if (isNaN(numericValue)) {
+            return {
+                isValid: false,
+                warnings: [`Invalid numeric value: "${value}"`]
+            };
+        }
+        // Check min/max constraints
+        if (min && numericValue < Number(min)) {
+            warnings.push(`Value ${numericValue} is below minimum ${min}`);
+        }
+        if (max && numericValue > Number(max)) {
+            warnings.push(`Value ${numericValue} is above maximum ${max}`);
+        }
+        return { isValid: true, warnings };
+    }
+}
+//# sourceMappingURL=input-validation.utils.js.map

package/utils/input-validation.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-validation.utils.js","sourceRoot":"","sources":["../../../../src/components/input/utils/input-validation.utils.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Google Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport { INPUT_TYPE } from '../input.types.js';\n\n/**\n * Validation utilities for input components\n */\nexport class InputValidationUtils {\n  \n  /**\n   * Validates numeric properties (min, max, step) to ensure they are valid numbers\n   */\n  static validateNumericProperties(\n    type: string,\n    min?: string,\n    max?: string,\n    step?: string\n  ): void {\n    if (type === INPUT_TYPE.NUMBER) {\n      if (min && isNaN(Number(min))) {\n        console.warn(`Invalid min value: \"${min}\" is not a valid number`);\n      }\n      if (max && isNaN(Number(max))) {\n        console.warn(`Invalid max value: \"${max}\" is not a valid number`);\n      }\n      if (step && isNaN(Number(step))) {\n        console.warn(`Invalid step value: \"${step}\" is not a valid number`);\n      }\n      if (min && max && Number(min) >= Number(max)) {\n        console.warn(`Invalid range: min value (${min}) should be less than max value (${max})`);\n      }\n    }\n  }\n\n  /**\n   * Prevents non-numeric characters from being typed in number inputs\n   */\n  static preventNonNumericInput(\n    keyDownEvent: KeyboardEvent,\n    min?: string\n  ): void {\n    const key = keyDownEvent.key;\n    const target = keyDownEvent.target as HTMLInputElement;\n    const currentValue = target.value;\n    const cursorPosition = target.selectionStart || 0;\n\n    // Allow control keys (backspace, delete, tab, escape, enter, arrow keys, etc.)\n    const allowedControlKeys = [\n      'Backspace', 'Delete', 'Tab', 'Escape', 'Enter',\n      'ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown',\n      'Home', 'End', 'PageUp', 'PageDown'\n    ];\n\n    // Allow Ctrl/Cmd combinations (copy, paste, select all, etc.)\n    if (keyDownEvent.ctrlKey || keyDownEvent.metaKey) {\n      return;\n    }\n\n    // Allow control keys\n    if (allowedControlKeys.includes(key)) {\n      return;\n    }\n\n    // Allow digits\n    if (/^\\d$/.test(key)) {\n      return;\n    }\n\n    // Allow decimal point (.) only once and allow it at the beginning for values like \".5\"\n    if (key === '.' || key === ',') {\n      const hasDecimal = currentValue.includes('.') || currentValue.includes(',');\n      if (!hasDecimal) {\n        return;\n      }\n    }\n\n    // Allow minus sign (-) only at the beginning and if min allows negative numbers\n    if (key === '-') {\n      const hasMinusSign = currentValue.includes('-');\n      const minAllowsNegative = !min || Number(min) < 0;\n      if (!hasMinusSign && cursorPosition === 0 && minAllowsNegative) {\n        return;\n      }\n    }\n\n    // Allow plus sign (+) only at the beginning\n    if (key === '+') {\n      const hasPlusSign = currentValue.includes('+');\n      if (!hasPlusSign && cursorPosition === 0) {\n        return;\n      }\n    }\n\n    // If we reach here, prevent the key input\n    keyDownEvent.preventDefault();\n  }\n\n  /**\n   * Validates a numeric value against min/max constraints\n   */\n  static validateNumericValue(\n    value: string,\n    min?: string,\n    max?: string\n  ): { isValid: boolean; warnings: string[] } {\n    const warnings: string[] = [];\n    \n    if (!value) {\n      return { isValid: true, warnings };\n    }\n\n    const numericValue = Number(value);\n    \n    if (isNaN(numericValue)) {\n      return { \n        isValid: false, \n        warnings: [`Invalid numeric value: \"${value}\"`] \n      };\n    }\n\n    // Check min/max constraints\n    if (min && numericValue < Number(min)) {\n      warnings.push(`Value ${numericValue} is below minimum ${min}`);\n    }\n    if (max && numericValue > Number(max)) {\n      warnings.push(`Value ${numericValue} is above maximum ${max}`);\n    }\n\n    return { isValid: true, warnings };\n  }\n}\n"]}

package/input.constant.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"input.constant.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.constant.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.constant.js

@@ -1,2 +0,0 @@
-export const EMPTY_STRING = '';
-//# sourceMappingURL=input.constant.js.map

package/input.constant.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"input.constant.js","sourceRoot":"","sources":["../../../src/components/input/input.constant.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/input.style.variable..d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"input.style.variable..d.ts","sourceRoot":"","sources":["../../../src/components/input/input.style.variable..ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,yBAgG1B,CAAC"}

package/input.style.variable..js.map

@@ -1 +0,0 @@
-{"version":3,"file":"input.style.variable..js","sourceRoot":"","sources":["../../../src/components/input/input.style.variable..ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AAExB,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgGhC,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\n  /* \n   * Dark theme styles using data-theme attribute on host element\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  :host([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`;\n"]}