@actabldesign/bellhop-core 0.0.3

package/cjs/bh-input-number.cjs.entry.js

@@ -0,0 +1,307 @@
+'use strict';
+
+var index = require('./index-tZqSQc8E.js');
+var form = require('./form-9mbajZ3y.js');
+
+const bhInputNumberCss = ":host{display:block}.input-wrapper{display:flex;flex-direction:column;gap:var(--spacing-sm);width:100%;max-width:100%}.input-field{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);height:36px;width:100%;background:var(--color-white);border:1px solid var(--color-neutral-300);border-radius:var(--spacing-md);transition:all 0.2s ease-in-out;cursor:text;box-shadow:0 0 0 0px transparent;overflow:hidden;position:relative;box-sizing:border-box}.input-field.input-icon-leading{padding:var(--spacing-md) var(--spacing-lg)}.input-content{display:flex;align-items:center;gap:var(--spacing-md);flex:1;height:100%;min-width:0;max-width:100%}.leading-icon{font-size:var(--text-xl-size);color:var(--color-neutral-500);user-select:none;flex-shrink:0;cursor:default;pointer-events:auto;transition:color 0.2s ease-in-out}.input-field.input-focused .leading-icon{color:var(--color-brand-600)}.input-element{flex:1;height:100%;border:none;outline:none;background:transparent;font-family:var(--font-inter);font-weight:400;font-size:var(--text-sm-size);line-height:1.43;color:var(--color-neutral-800);min-width:60px;padding-left:var(--spacing-xs);box-shadow:none}.input-element:focus{outline:none;border:none;box-shadow:none}.input-element::placeholder{color:var(--color-neutral-500)}.input-element:disabled{cursor:not-allowed;opacity:0.5}.input-element::-webkit-outer-spin-button,.input-element::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.input-element[type='number']{-moz-appearance:textfield;appearance:textfield}.text-placeholder{color:var(--color-neutral-500)}.text-filled{color:var(--color-neutral-800)}.hint-text{font-family:var(--font-inter);font-weight:400;font-size:var(--text-sm-size);line-height:1.43;color:var(--color-neutral-600)}.input-field.input-hover{border-color:var(--color-brand-500)}.input-field.input-focused{border-color:var(--color-brand-500);box-shadow:0 0 0 1px var(--color-brand-500)}.input-field.input-disabled{opacity:0.5;cursor:not-allowed;background:var(--color-neutral-50)}.input-field.input-error{border-color:var(--color-error-300)}.input-field.input-error.input-hover{border-color:var(--color-error-500)}.input-field.input-error.input-focused{border-color:var(--color-brand-600)}.hint-text.hint-error{color:var(--color-error-600)}.prefix-text,.suffix-text{font-family:var(--font-inter);font-weight:400;font-size:var(--text-sm-size);line-height:1.43;color:var(--color-neutral-600);user-select:none;flex-shrink:0}.material-symbols-outlined{font-family:'Material Symbols Outlined';font-weight:normal;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased;font-variation-settings:'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24}@media (max-width: 768px){.input-wrapper{width:100%}}";
+
+const BhInputNumber = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.bhChange = index.createEvent(this, "bhChange");
+        this.bhFocus = index.createEvent(this, "bhFocus");
+        this.bhBlur = index.createEvent(this, "bhBlur");
+        this.bhHelpClick = index.createEvent(this, "bhHelpClick");
+        if (hostRef.$hostElement$["s-ei"]) {
+            this.internals = hostRef.$hostElement$["s-ei"];
+        }
+        else {
+            this.internals = hostRef.$hostElement$.attachInternals();
+            hostRef.$hostElement$["s-ei"] = this.internals;
+        }
+    }
+    get el() { return index.getElement(this); }
+    internals;
+    inputEl;
+    /**
+     * Whether the input is in an error state
+     */
+    error = false;
+    /**
+     * Whether the field is required
+     */
+    required = false;
+    /**
+     * Whether the input is disabled
+     */
+    disabled = false;
+    /**
+     * Whether to show the help icon
+     */
+    showHelpIcon = false;
+    /**
+     * Whether to show the leading icon
+     */
+    showLeadingIcon = false;
+    /**
+     * Whether to show the label
+     */
+    showLabel = true;
+    /**
+     * Whether to show the hint text
+     */
+    showHintText = true;
+    /**
+     * Label text for the input
+     */
+    label = 'Amount';
+    /**
+     * Placeholder text
+     */
+    placeholder = '0';
+    /**
+     * Hint text displayed below the input
+     */
+    hintText = 'Enter a numeric value.';
+    /**
+     * Leading icon name (Material Symbols)
+     */
+    leadingIcon = 'tag';
+    /**
+     * Tooltip text for the help icon
+     */
+    helpIconTooltip = 'Help';
+    /**
+     * Current numeric value
+     */
+    value = null;
+    /**
+     * Minimum allowed value
+     */
+    min = null;
+    /**
+     * Maximum allowed value
+     */
+    max = null;
+    /**
+     * Step value for increment/decrement
+     */
+    step = 1;
+    /**
+     * Text prefix before the input value
+     */
+    prefixText = '';
+    /**
+     * Text suffix after the input value
+     */
+    suffixText = '';
+    /**
+     * Width of the component
+     */
+    width = '';
+    /**
+     * Name attribute for form submission
+     */
+    name = '';
+    /**
+     * Default value for form reset
+     */
+    defaultValue = null;
+    /**
+     * Custom validation message
+     */
+    validationMessage = '';
+    internalState = 'placeholder';
+    isHovered = false;
+    isFocused = false;
+    internalValue = null;
+    hasValidationError = false;
+    /**
+     * Event emitted when the value changes
+     */
+    bhChange;
+    /**
+     * Event emitted when the input receives focus
+     */
+    bhFocus;
+    /**
+     * Event emitted when the input loses focus
+     */
+    bhBlur;
+    /**
+     * Event emitted when the help icon is clicked
+     */
+    bhHelpClick;
+    get isControlled() {
+        return this.value !== undefined && this.value !== null;
+    }
+    get currentValue() {
+        return this.isControlled ? this.value : this.internalValue;
+    }
+    watchValue(newValue) {
+        this.hasValidationError = this.isOutOfBounds(newValue);
+        this.updateInternalState(newValue);
+    }
+    componentWillLoad() {
+        if (this.value !== null && this.value !== undefined) {
+            this.internalValue = this.value;
+        }
+        this.hasValidationError = this.isOutOfBounds(this.currentValue);
+        this.updateInternalState(this.currentValue);
+    }
+    componentDidLoad() {
+        this.syncNumberFormValue();
+        form.updateValidity(this.internals, this.inputEl, this.validationMessage);
+    }
+    formResetCallback() {
+        this.value = this.defaultValue;
+        this.internalValue = this.defaultValue;
+        if (this.inputEl) {
+            this.inputEl.value = this.defaultValue !== null ? String(this.defaultValue) : '';
+        }
+        this.hasValidationError = this.isOutOfBounds(this.defaultValue);
+        this.updateInternalState(this.defaultValue);
+        this.syncNumberFormValue();
+        form.updateValidity(this.internals, this.inputEl);
+    }
+    syncNumberFormValue() {
+        if (!this.internals || !this.name)
+            return;
+        const val = this.currentValue;
+        if (val === null || val === undefined) {
+            this.internals.setFormValue(null);
+        }
+        else {
+            this.internals.setFormValue(String(val));
+        }
+    }
+    isOutOfBounds(val) {
+        if (val === null)
+            return false;
+        if (this.min !== null && val < this.min)
+            return true;
+        if (this.max !== null && val > this.max)
+            return true;
+        return false;
+    }
+    updateInternalState(val) {
+        if (val !== null && val !== undefined) {
+            this.internalState = 'filled';
+        }
+        else if (!this.isFocused && !this.isHovered) {
+            this.internalState = 'placeholder';
+        }
+    }
+    validateValue(val) {
+        if (this.min !== null && val < this.min) {
+            return this.min;
+        }
+        if (this.max !== null && val > this.max) {
+            return this.max;
+        }
+        return val;
+    }
+    updateValue(newValue, allowOutOfBounds = false) {
+        let finalValue;
+        if (newValue === null) {
+            finalValue = null;
+        }
+        else if (allowOutOfBounds) {
+            finalValue = newValue;
+        }
+        else {
+            finalValue = this.validateValue(newValue);
+        }
+        this.internalValue = finalValue;
+        this.value = finalValue;
+        this.hasValidationError = this.isOutOfBounds(finalValue);
+        this.syncNumberFormValue();
+        form.updateValidity(this.internals, this.inputEl, this.validationMessage);
+        this.bhChange.emit(finalValue);
+    }
+    handleInputChange = (event) => {
+        const input = event.target;
+        const inputValue = input.value;
+        const numericValue = inputValue === '' ? null : parseFloat(inputValue);
+        if (numericValue !== null && !isNaN(numericValue)) {
+            this.updateValue(numericValue, true);
+        }
+        else if (inputValue === '') {
+            this.updateValue(null, true);
+        }
+    };
+    increment = () => {
+        const baseValue = this.currentValue ?? 0;
+        const newValue = baseValue + this.step;
+        this.updateValue(newValue);
+    };
+    decrement = () => {
+        const baseValue = this.currentValue ?? 0;
+        const newValue = baseValue - this.step;
+        this.updateValue(newValue);
+    };
+    handleInputFocus = () => {
+        this.isFocused = true;
+        this.internalState = 'focused';
+        this.bhFocus.emit();
+    };
+    handleInputBlur = () => {
+        this.isFocused = false;
+        this.updateInternalState(this.currentValue);
+        this.bhBlur.emit();
+    };
+    handleMouseEnter = () => {
+        if (!this.isFocused) {
+            this.isHovered = true;
+            this.internalState = 'hover';
+        }
+    };
+    handleMouseLeave = () => {
+        this.isHovered = false;
+        if (!this.isFocused) {
+            this.updateInternalState(this.currentValue);
+        }
+    };
+    handleHelpIconClick = () => {
+        this.bhHelpClick.emit();
+    };
+    getValidationErrorMessage() {
+        if (!this.hasValidationError || this.currentValue === null)
+            return '';
+        if (this.min !== null && this.max !== null) {
+            return `Enter a number between ${this.min} and ${this.max}.`;
+        }
+        if (this.min !== null && this.currentValue < this.min) {
+            return `Value must be at least ${this.min}`;
+        }
+        if (this.max !== null && this.currentValue > this.max) {
+            return `Value must be no more than ${this.max}`;
+        }
+        return '';
+    }
+    render() {
+        const showError = this.error || this.hasValidationError;
+        const displayHintText = showError && this.hasValidationError ? this.getValidationErrorMessage() : this.hintText;
+        const inputFieldClasses = {
+            'input-field': true,
+            'input-hover': this.internalState === 'hover' || this.isHovered,
+            'input-focused': this.internalState === 'focused' || this.isFocused,
+            'input-error': showError,
+            'input-disabled': this.disabled,
+            'input-icon-leading': this.showLeadingIcon,
+        };
+        const textColorClass = this.currentValue !== null && this.currentValue !== undefined ? 'text-filled' : 'text-placeholder';
+        const wrapperStyle = this.width ? { width: this.width } : {};
+        const isDecrementDisabled = this.disabled || (this.min !== null && this.currentValue !== null && this.currentValue <= this.min);
+        const isIncrementDisabled = this.disabled || (this.max !== null && this.currentValue !== null && this.currentValue >= this.max);
+        return (index.h("div", { key: 'e575b1982af49b05d43e26107d0e6f0259693309', class: "input-wrapper", style: wrapperStyle }, index.h("bh-label", { key: 'a6ba247e1aa8faf69882624964e24994237f9b99', label: this.showLabel ? this.label : '', required: this.required, showHelpIcon: this.showHelpIcon, helpIconTooltip: this.helpIconTooltip, disabled: this.disabled, onBhHelpClick: this.handleHelpIconClick }, index.h("div", { key: '2e518017ed3e16bfb0109f67f0b97fdc4088da10', class: inputFieldClasses, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, index.h("div", { key: 'ae95010994de4d51220e085abe345b0fe3693e9f', class: "input-content" }, this.showLeadingIcon && (index.h("span", { key: 'f5a4c54ff0d2bbe6e125d86f47587b16be34595a', class: "leading-icon material-symbols-outlined" }, this.leadingIcon)), this.prefixText && index.h("span", { key: 'd361eac479f123fe971f661a68a2bb0248f41c82', class: "prefix-text" }, this.prefixText), index.h("input", { key: 'a7c1b3d4dc7c0a97532dbc9bf52ad00f4466e93e', ref: (el) => (this.inputEl = el), type: "number", name: this.name, value: this.currentValue ?? '', placeholder: this.placeholder, disabled: this.disabled, required: this.required, class: `input-element ${textColorClass}`, onInput: this.handleInputChange, onFocus: this.handleInputFocus, onBlur: this.handleInputBlur, min: this.min ?? undefined, max: this.max ?? undefined, step: this.step }), this.suffixText && index.h("span", { key: '0f45089745e92275fa5fef6539dea724aa75ca64', class: "suffix-text" }, this.suffixText), index.h("bh-button-icon", { key: 'cf8f2059727fc00b0640e01ae39182dd6e434ab6', hierarchy: "tertiary", size: "xs", iconName: "remove", disabled: isDecrementDisabled, onClick: this.decrement, "aria-label": "Decrease value" }), index.h("bh-button-icon", { key: '59cc6e617af95da7ee44a7fac4aa04505432d88a', hierarchy: "tertiary", size: "xs", iconName: "add", disabled: isIncrementDisabled, onClick: this.increment, "aria-label": "Increase value" })))), this.showHintText && displayHintText && (index.h("div", { key: '387bb2b4602cf09f2a1942d1b082b2604548b5a2', class: { 'hint-text': true, 'hint-error': showError } }, displayHintText))));
+    }
+    static get formAssociated() { return true; }
+    static get watchers() { return {
+        "value": ["watchValue"]
+    }; }
+};
+BhInputNumber.style = bhInputNumberCss;
+
+exports.bh_input_number = BhInputNumber;
+//# sourceMappingURL=bh-input-number.entry.cjs.js.map

package/cjs/bh-input-number.entry.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bh-input-number.entry.cjs.js","sources":["src/components/bh-input-number/bh-input-number.css?tag=bh-input-number&encapsulation=shadow","src/components/bh-input-number/bh-input-number.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n/* Base Input Wrapper */\n.input-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-sm);\n  width: 100%;\n  max-width: 100%;\n}\n\n/* Input Field Container */\n.input-field {\n  display: flex;\n  align-items: center;\n  gap: var(--spacing-md);\n  padding: var(--spacing-md);\n  height: 36px;\n  width: 100%;\n  background: var(--color-white);\n  border: 1px solid var(--color-neutral-300);\n  border-radius: var(--spacing-md);\n  transition: all 0.2s ease-in-out;\n  cursor: text;\n  box-shadow: 0 0 0 0px transparent;\n  overflow: hidden;\n  position: relative;\n  box-sizing: border-box;\n}\n\n.input-field.input-icon-leading {\n  padding: var(--spacing-md) var(--spacing-lg);\n}\n\n/* Input Content */\n.input-content {\n  display: flex;\n  align-items: center;\n  gap: var(--spacing-md);\n  flex: 1;\n  height: 100%;\n  min-width: 0;\n  max-width: 100%;\n}\n\n/* Leading Icon */\n.leading-icon {\n  font-size: var(--text-xl-size);\n  color: var(--color-neutral-500);\n  user-select: none;\n  flex-shrink: 0;\n  cursor: default;\n  pointer-events: auto;\n  transition: color 0.2s ease-in-out;\n}\n\n.input-field.input-focused .leading-icon {\n  color: var(--color-brand-600);\n}\n\n/* Input Element */\n.input-element {\n  flex: 1;\n  height: 100%;\n  border: none;\n  outline: none;\n  background: transparent;\n  font-family: var(--font-inter);\n  font-weight: 400;\n  font-size: var(--text-sm-size);\n  line-height: 1.43;\n  color: var(--color-neutral-800);\n  min-width: 60px;\n  padding-left: var(--spacing-xs);\n  box-shadow: none;\n}\n\n.input-element:focus {\n  outline: none;\n  border: none;\n  box-shadow: none;\n}\n\n.input-element::placeholder {\n  color: var(--color-neutral-500);\n}\n\n.input-element:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n/* Hide default number input spinners */\n.input-element::-webkit-outer-spin-button,\n.input-element::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\n.input-element[type='number'] {\n  -moz-appearance: textfield;\n  appearance: textfield;\n}\n\n/* Text States */\n.text-placeholder {\n  color: var(--color-neutral-500);\n}\n\n.text-filled {\n  color: var(--color-neutral-800);\n}\n\n/* Hint Text */\n.hint-text {\n  font-family: var(--font-inter);\n  font-weight: 400;\n  font-size: var(--text-sm-size);\n  line-height: 1.43;\n  color: var(--color-neutral-600);\n}\n\n/* Input States */\n.input-field.input-hover {\n  border-color: var(--color-brand-500);\n}\n\n.input-field.input-focused {\n  border-color: var(--color-brand-500);\n  box-shadow: 0 0 0 1px var(--color-brand-500);\n}\n\n.input-field.input-disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n  background: var(--color-neutral-50);\n}\n\n.input-field.input-error {\n  border-color: var(--color-error-300);\n}\n\n.input-field.input-error.input-hover {\n  border-color: var(--color-error-500);\n}\n\n.input-field.input-error.input-focused {\n  border-color: var(--color-brand-600);\n}\n\n.hint-text.hint-error {\n  color: var(--color-error-600);\n}\n\n/* Prefix and Suffix */\n.prefix-text,\n.suffix-text {\n  font-family: var(--font-inter);\n  font-weight: 400;\n  font-size: var(--text-sm-size);\n  line-height: 1.43;\n  color: var(--color-neutral-600);\n  user-select: none;\n  flex-shrink: 0;\n}\n\n/* Material Symbols Support */\n.material-symbols-outlined {\n  font-family: 'Material Symbols Outlined';\n  font-weight: normal;\n  font-style: normal;\n  font-size: 24px;\n  line-height: 1;\n  letter-spacing: normal;\n  text-transform: none;\n  display: inline-block;\n  white-space: nowrap;\n  word-wrap: normal;\n  direction: ltr;\n  -webkit-font-feature-settings: 'liga';\n  -webkit-font-smoothing: antialiased;\n  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;\n}\n\n/* Responsive Adjustments */\n@media (max-width: 768px) {\n  .input-wrapper {\n    width: 100%;\n  }\n}\n","import { Component, Prop, State, Event, EventEmitter, Element, h, Watch, AttachInternals } from '@stencil/core';\nimport { updateValidity } from '../../utils/form';\n\nexport type InputNumberState = 'placeholder' | 'filled' | 'hover' | 'focused';\n\n@Component({\n  tag: 'bh-input-number',\n  styleUrl: 'bh-input-number.css',\n  shadow: true,\n  formAssociated: true,\n})\nexport class BhInputNumber {\n  @Element() el!: HTMLElement;\n  @AttachInternals() internals!: ElementInternals;\n\n  private inputEl?: HTMLInputElement;\n\n  /**\n   * Whether the input is in an error state\n   */\n  @Prop() error: boolean = false;\n\n  /**\n   * Whether the field is required\n   */\n  @Prop() required: boolean = false;\n\n  /**\n   * Whether the input is disabled\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * Whether to show the help icon\n   */\n  @Prop() showHelpIcon: boolean = false;\n\n  /**\n   * Whether to show the leading icon\n   */\n  @Prop() showLeadingIcon: boolean = false;\n\n  /**\n   * Whether to show the label\n   */\n  @Prop() showLabel: boolean = true;\n\n  /**\n   * Whether to show the hint text\n   */\n  @Prop() showHintText: boolean = true;\n\n  /**\n   * Label text for the input\n   */\n  @Prop() label: string = 'Amount';\n\n  /**\n   * Placeholder text\n   */\n  @Prop() placeholder: string = '0';\n\n  /**\n   * Hint text displayed below the input\n   */\n  @Prop() hintText: string = 'Enter a numeric value.';\n\n  /**\n   * Leading icon name (Material Symbols)\n   */\n  @Prop() leadingIcon: string = 'tag';\n\n  /**\n   * Tooltip text for the help icon\n   */\n  @Prop() helpIconTooltip: string = 'Help';\n\n  /**\n   * Current numeric value\n   */\n  @Prop({ mutable: true }) value: number | null = null;\n\n  /**\n   * Minimum allowed value\n   */\n  @Prop() min: number | null = null;\n\n  /**\n   * Maximum allowed value\n   */\n  @Prop() max: number | null = null;\n\n  /**\n   * Step value for increment/decrement\n   */\n  @Prop() step: number = 1;\n\n  /**\n   * Text prefix before the input value\n   */\n  @Prop() prefixText: string = '';\n\n  /**\n   * Text suffix after the input value\n   */\n  @Prop() suffixText: string = '';\n\n  /**\n   * Width of the component\n   */\n  @Prop() width: string = '';\n\n  /**\n   * Name attribute for form submission\n   */\n  @Prop() name: string = '';\n\n  /**\n   * Default value for form reset\n   */\n  @Prop() defaultValue: number | null = null;\n\n  /**\n   * Custom validation message\n   */\n  @Prop() validationMessage: string = '';\n\n  @State() internalState: InputNumberState = 'placeholder';\n  @State() isHovered: boolean = false;\n  @State() isFocused: boolean = false;\n  @State() internalValue: number | null = null;\n  @State() hasValidationError: boolean = false;\n\n  /**\n   * Event emitted when the value changes\n   */\n  @Event() bhChange!: EventEmitter<number | null>;\n\n  /**\n   * Event emitted when the input receives focus\n   */\n  @Event() bhFocus!: EventEmitter<void>;\n\n  /**\n   * Event emitted when the input loses focus\n   */\n  @Event() bhBlur!: EventEmitter<void>;\n\n  /**\n   * Event emitted when the help icon is clicked\n   */\n  @Event() bhHelpClick!: EventEmitter<void>;\n\n  private get isControlled(): boolean {\n    return this.value !== undefined && this.value !== null;\n  }\n\n  private get currentValue(): number | null {\n    return this.isControlled ? this.value : this.internalValue;\n  }\n\n  @Watch('value')\n  watchValue(newValue: number | null) {\n    this.hasValidationError = this.isOutOfBounds(newValue);\n    this.updateInternalState(newValue);\n  }\n\n  componentWillLoad() {\n    if (this.value !== null && this.value !== undefined) {\n      this.internalValue = this.value;\n    }\n    this.hasValidationError = this.isOutOfBounds(this.currentValue);\n    this.updateInternalState(this.currentValue);\n  }\n\n  componentDidLoad() {\n    this.syncNumberFormValue();\n    updateValidity(this.internals, this.inputEl, this.validationMessage);\n  }\n\n  formResetCallback() {\n    this.value = this.defaultValue;\n    this.internalValue = this.defaultValue;\n    if (this.inputEl) {\n      this.inputEl.value = this.defaultValue !== null ? String(this.defaultValue) : '';\n    }\n    this.hasValidationError = this.isOutOfBounds(this.defaultValue);\n    this.updateInternalState(this.defaultValue);\n    this.syncNumberFormValue();\n    updateValidity(this.internals, this.inputEl);\n  }\n\n  private syncNumberFormValue() {\n    if (!this.internals || !this.name) return;\n    const val = this.currentValue;\n    if (val === null || val === undefined) {\n      this.internals.setFormValue(null);\n    } else {\n      this.internals.setFormValue(String(val));\n    }\n  }\n\n  private isOutOfBounds(val: number | null): boolean {\n    if (val === null) return false;\n    if (this.min !== null && val < this.min) return true;\n    if (this.max !== null && val > this.max) return true;\n    return false;\n  }\n\n  private updateInternalState(val: number | null) {\n    if (val !== null && val !== undefined) {\n      this.internalState = 'filled';\n    } else if (!this.isFocused && !this.isHovered) {\n      this.internalState = 'placeholder';\n    }\n  }\n\n  private validateValue(val: number): number {\n    if (this.min !== null && val < this.min) {\n      return this.min;\n    }\n    if (this.max !== null && val > this.max) {\n      return this.max;\n    }\n    return val;\n  }\n\n  private updateValue(newValue: number | null, allowOutOfBounds = false) {\n    let finalValue: number | null;\n\n    if (newValue === null) {\n      finalValue = null;\n    } else if (allowOutOfBounds) {\n      finalValue = newValue;\n    } else {\n      finalValue = this.validateValue(newValue);\n    }\n\n    this.internalValue = finalValue;\n    this.value = finalValue;\n    this.hasValidationError = this.isOutOfBounds(finalValue);\n    this.syncNumberFormValue();\n    updateValidity(this.internals, this.inputEl, this.validationMessage);\n    this.bhChange.emit(finalValue);\n  }\n\n  private handleInputChange = (event: Event) => {\n    const input = event.target as HTMLInputElement;\n    const inputValue = input.value;\n    const numericValue = inputValue === '' ? null : parseFloat(inputValue);\n\n    if (numericValue !== null && !isNaN(numericValue)) {\n      this.updateValue(numericValue, true);\n    } else if (inputValue === '') {\n      this.updateValue(null, true);\n    }\n  };\n\n  private increment = () => {\n    const baseValue = this.currentValue ?? 0;\n    const newValue = baseValue + this.step;\n    this.updateValue(newValue);\n  };\n\n  private decrement = () => {\n    const baseValue = this.currentValue ?? 0;\n    const newValue = baseValue - this.step;\n    this.updateValue(newValue);\n  };\n\n  private handleInputFocus = () => {\n    this.isFocused = true;\n    this.internalState = 'focused';\n    this.bhFocus.emit();\n  };\n\n  private handleInputBlur = () => {\n    this.isFocused = false;\n    this.updateInternalState(this.currentValue);\n    this.bhBlur.emit();\n  };\n\n  private handleMouseEnter = () => {\n    if (!this.isFocused) {\n      this.isHovered = true;\n      this.internalState = 'hover';\n    }\n  };\n\n  private handleMouseLeave = () => {\n    this.isHovered = false;\n    if (!this.isFocused) {\n      this.updateInternalState(this.currentValue);\n    }\n  };\n\n  private handleHelpIconClick = () => {\n    this.bhHelpClick.emit();\n  };\n\n  private getValidationErrorMessage(): string {\n    if (!this.hasValidationError || this.currentValue === null) return '';\n\n    if (this.min !== null && this.max !== null) {\n      return `Enter a number between ${this.min} and ${this.max}.`;\n    }\n\n    if (this.min !== null && this.currentValue < this.min) {\n      return `Value must be at least ${this.min}`;\n    }\n\n    if (this.max !== null && this.currentValue > this.max) {\n      return `Value must be no more than ${this.max}`;\n    }\n\n    return '';\n  }\n\n  render() {\n    const showError = this.error || this.hasValidationError;\n    const displayHintText = showError && this.hasValidationError ? this.getValidationErrorMessage() : this.hintText;\n\n    const inputFieldClasses = {\n      'input-field': true,\n      'input-hover': this.internalState === 'hover' || this.isHovered,\n      'input-focused': this.internalState === 'focused' || this.isFocused,\n      'input-error': showError,\n      'input-disabled': this.disabled,\n      'input-icon-leading': this.showLeadingIcon,\n    };\n\n    const textColorClass = this.currentValue !== null && this.currentValue !== undefined ? 'text-filled' : 'text-placeholder';\n    const wrapperStyle = this.width ? { width: this.width } : {};\n\n    const isDecrementDisabled = this.disabled || (this.min !== null && this.currentValue !== null && this.currentValue <= this.min);\n    const isIncrementDisabled = this.disabled || (this.max !== null && this.currentValue !== null && this.currentValue >= this.max);\n\n    return (\n      <div class=\"input-wrapper\" style={wrapperStyle}>\n        <bh-label\n          label={this.showLabel ? this.label : ''}\n          required={this.required}\n          showHelpIcon={this.showHelpIcon}\n          helpIconTooltip={this.helpIconTooltip}\n          disabled={this.disabled}\n          onBhHelpClick={this.handleHelpIconClick}\n        >\n          <div\n            class={inputFieldClasses}\n            onMouseEnter={this.handleMouseEnter}\n            onMouseLeave={this.handleMouseLeave}\n          >\n            <div class=\"input-content\">\n              {this.showLeadingIcon && (\n                <span class=\"leading-icon material-symbols-outlined\">\n                  {this.leadingIcon}\n                </span>\n              )}\n              {this.prefixText && <span class=\"prefix-text\">{this.prefixText}</span>}\n              <input\n                ref={(el) => (this.inputEl = el)}\n                type=\"number\"\n                name={this.name}\n                value={this.currentValue ?? ''}\n                placeholder={this.placeholder}\n                disabled={this.disabled}\n                required={this.required}\n                class={`input-element ${textColorClass}`}\n                onInput={this.handleInputChange}\n                onFocus={this.handleInputFocus}\n                onBlur={this.handleInputBlur}\n                min={this.min ?? undefined}\n                max={this.max ?? undefined}\n                step={this.step}\n              />\n              {this.suffixText && <span class=\"suffix-text\">{this.suffixText}</span>}\n              <bh-button-icon\n                hierarchy=\"tertiary\"\n                size=\"xs\"\n                iconName=\"remove\"\n                disabled={isDecrementDisabled}\n                onClick={this.decrement}\n                aria-label=\"Decrease value\"\n              />\n              <bh-button-icon\n                hierarchy=\"tertiary\"\n                size=\"xs\"\n                iconName=\"add\"\n                disabled={isIncrementDisabled}\n                onClick={this.increment}\n                aria-label=\"Increase value\"\n              />\n            </div>\n          </div>\n        </bh-label>\n        {this.showHintText && displayHintText && (\n          <div class={{ 'hint-text': true, 'hint-error': showError }}>\n            {displayHintText}\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n"],"names":["updateValidity","h"],"mappings":"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"}

package/cjs/bh-input-password.cjs.entry.js

@@ -0,0 +1,182 @@
+'use strict';
+
+var index = require('./index-tZqSQc8E.js');
+var form = require('./form-9mbajZ3y.js');
+
+const bhInputPasswordCss = ":host{display:block;font-family:var(--font-inter, 'Inter', -apple-system, BlinkMacSystemFont, sans-serif)}.input-wrapper{display:flex;flex-direction:column;gap:var(--spacing-sm, 8px);width:100%}.input-container{display:flex;align-items:center;gap:var(--spacing-md, 12px);padding:var(--spacing-md, 12px);height:36px;width:100%;background:var(--color-white, #FFFFFF);border:1px solid var(--color-neutral-300, #D0D5DD);border-radius:var(--spacing-md, 8px);transition:all 0.2s ease-in-out;cursor:text;box-sizing:border-box}.input-container.input-container-with-leading{padding:var(--spacing-md, 12px) var(--spacing-lg, 16px)}.input-container.input-container-hover{border-color:var(--color-brand-500, #7F56D9)}.input-container.input-container-focused{border-color:var(--color-brand-500, #7F56D9);box-shadow:0 0 0 1px var(--color-brand-500, #7F56D9)}.input-container.input-container-disabled{opacity:0.5;cursor:not-allowed;background:var(--color-neutral-50, #F9FAFB)}.input-container.input-container-error{border-color:var(--color-error-300, #FDA29B)}.input-container.input-container-error.input-container-hover{border-color:var(--color-error-500, #F05250)}.input-container.input-container-error.input-container-focused{border-color:var(--color-brand-600, #6941C6)}.input-content{display:flex;align-items:center;gap:var(--spacing-md, 12px);flex:1;height:100%;min-width:0}.input-element{flex:1;height:100%;border:none;outline:none;background:transparent;font-family:inherit;font-weight:400;font-size:var(--text-sm-size, 14px);line-height:1.43;color:var(--color-neutral-800, #1D2939);min-width:60px;padding:0}.input-element:focus{outline:none;border:none;box-shadow:none}.input-element::placeholder{color:var(--color-neutral-500, #667085)}.input-element:disabled{cursor:not-allowed}.leading-icon{font-size:var(--text-xl-size, 20px);color:var(--color-neutral-500, #667085);user-select:none;flex-shrink:0;cursor:default;transition:color 0.2s ease-in-out}.input-container-focused .leading-icon{color:var(--color-brand-600, #6941C6)}.visibility-toggle{font-size:var(--text-xl-size, 20px);color:var(--color-neutral-400, #98A2B3);cursor:pointer;user-select:none;flex-shrink:0;transition:color 0.2s ease-in-out}.visibility-toggle:hover{color:var(--color-neutral-600, #475467)}.input-container-disabled .visibility-toggle{cursor:not-allowed;pointer-events:none}.hint-text{font-family:inherit;font-weight:400;font-size:var(--text-sm-size, 14px);line-height:1.43;color:var(--color-neutral-600, #475467)}.hint-text.hint-error{color:var(--color-error-600, #DC2626)}.material-symbols-outlined{font-family:'Material Symbols Outlined';font-weight:normal;font-style:normal;font-size:20px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;font-feature-settings:'liga';-webkit-font-smoothing:antialiased;font-variation-settings:'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24}";
+
+const BhInputPassword = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.bhInput = index.createEvent(this, "bhInput");
+        this.bhFocus = index.createEvent(this, "bhFocus");
+        this.bhBlur = index.createEvent(this, "bhBlur");
+        this.bhHelpClick = index.createEvent(this, "bhHelpClick");
+        this.bhVisibilityToggle = index.createEvent(this, "bhVisibilityToggle");
+        if (hostRef.$hostElement$["s-ei"]) {
+            this.internals = hostRef.$hostElement$["s-ei"];
+        }
+        else {
+            this.internals = hostRef.$hostElement$.attachInternals();
+            hostRef.$hostElement$["s-ei"] = this.internals;
+        }
+    }
+    internals;
+    inputEl;
+    /**
+     * The label for the input
+     */
+    label = 'Password';
+    /**
+     * Placeholder text
+     */
+    placeholder = 'Enter your password';
+    /**
+     * Hint text shown below the input
+     */
+    hintText = '';
+    /**
+     * Whether to show the label
+     */
+    showLabel = true;
+    /**
+     * Whether to show hint text
+     */
+    showHintText = true;
+    /**
+     * Whether to show the help icon
+     */
+    showHelpIcon = false;
+    /**
+     * Whether to show a leading icon
+     */
+    showLeadingIcon = true;
+    /**
+     * Whether the field has an error
+     */
+    error = false;
+    /**
+     * Whether the input is disabled
+     */
+    disabled = false;
+    /**
+     * Whether the field is required
+     */
+    required = false;
+    /**
+     * Tooltip text for the help icon
+     */
+    helpIconTooltip = 'Password requirements';
+    /**
+     * Leading icon name (Material Symbols)
+     */
+    leadingIcon = 'lock';
+    /**
+     * The input value
+     */
+    value = '';
+    /**
+     * Name attribute for form submission
+     */
+    name = '';
+    /**
+     * Default value for form reset
+     */
+    defaultValue = '';
+    /**
+     * Custom validation message
+     */
+    validationMessage = '';
+    /**
+     * Track focus state
+     */
+    isFocused = false;
+    /**
+     * Track hover state
+     */
+    isHovered = false;
+    /**
+     * Track password visibility
+     */
+    showPassword = false;
+    /**
+     * Emitted when the value changes
+     */
+    bhInput;
+    /**
+     * Emitted when the input gains focus
+     */
+    bhFocus;
+    /**
+     * Emitted when the input loses focus
+     */
+    bhBlur;
+    /**
+     * Emitted when the help icon is clicked
+     */
+    bhHelpClick;
+    /**
+     * Emitted when visibility is toggled
+     */
+    bhVisibilityToggle;
+    componentDidLoad() {
+        form.syncFormValue(this);
+        form.updateValidity(this.internals, this.inputEl, this.validationMessage);
+    }
+    formResetCallback() {
+        this.value = this.defaultValue;
+        if (this.inputEl) {
+            this.inputEl.value = this.defaultValue;
+        }
+        form.syncFormValue(this);
+        form.updateValidity(this.internals, this.inputEl);
+    }
+    handleInput = (event) => {
+        const target = event.target;
+        this.value = target.value;
+        this.bhInput.emit(this.value);
+        form.syncFormValue(this);
+        form.updateValidity(this.internals, this.inputEl, this.validationMessage);
+    };
+    handleFocus = () => {
+        this.isFocused = true;
+        this.bhFocus.emit();
+    };
+    handleBlur = () => {
+        this.isFocused = false;
+        this.bhBlur.emit();
+    };
+    handleMouseEnter = () => {
+        if (!this.isFocused) {
+            this.isHovered = true;
+        }
+    };
+    handleMouseLeave = () => {
+        this.isHovered = false;
+    };
+    togglePasswordVisibility = () => {
+        if (!this.disabled) {
+            this.showPassword = !this.showPassword;
+            this.bhVisibilityToggle.emit(this.showPassword);
+        }
+    };
+    handleHelpClick = () => {
+        this.bhHelpClick.emit();
+    };
+    render() {
+        const containerClasses = {
+            'input-container': true,
+            'input-container-focused': this.isFocused,
+            'input-container-hover': this.isHovered && !this.isFocused,
+            'input-container-error': this.error,
+            'input-container-disabled': this.disabled,
+            'input-container-with-leading': this.showLeadingIcon,
+        };
+        return (index.h("div", { key: '65214ad4e72bfdf75610edcac9c3f5723ea87446', class: "input-wrapper", part: "wrapper" }, index.h("bh-label", { key: 'a7bfffd4d1221aba3ea7642b3589869724d50286', label: this.showLabel ? this.label : '', required: this.required, showHelpIcon: this.showHelpIcon, helpIconTooltip: this.helpIconTooltip, disabled: this.disabled, onBhHelpClick: this.handleHelpClick }, index.h("div", { key: '2879a7616747302fbd432321db764a6e63548dae', class: containerClasses, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, index.h("div", { key: '11ef311fc118a7595cb210fac70fda53599756a2', class: "input-content" }, this.showLeadingIcon && (index.h("span", { key: '805a132b4411f3b4016ea522701ac419915e0e88', class: "material-symbols-outlined leading-icon" }, this.leadingIcon)), index.h("input", { key: '0c4f69d29acb824ccf7fd23dc11b4b4d6385a38b', ref: (el) => (this.inputEl = el), type: this.showPassword ? 'text' : 'password', class: "input-element", name: this.name, value: this.value, placeholder: this.placeholder, disabled: this.disabled, required: this.required, "aria-label": this.label, "aria-describedby": this.showHintText && this.hintText ? 'hint-text' : undefined, "aria-invalid": String(this.error), onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, part: "input" })), index.h("span", { key: 'ce8f1bd6a95110b76a573e0f65ec43a7cfe6846b', class: "material-symbols-outlined visibility-toggle", onClick: this.togglePasswordVisibility, title: this.showPassword ? 'Hide password' : 'Show password' }, this.showPassword ? 'visibility_off' : 'visibility'))), this.showHintText && this.hintText && (index.h("div", { key: 'cd3f626bd84d01bcda347e2844c7150a474d91eb', class: { 'hint-text': true, 'hint-error': this.error }, id: "hint-text" }, this.hintText))));
+    }
+    static get formAssociated() { return true; }
+};
+BhInputPassword.style = bhInputPasswordCss;
+
+exports.bh_input_password = BhInputPassword;
+//# sourceMappingURL=bh-input-password.entry.cjs.js.map

package/cjs/bh-input-password.entry.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bh-input-password.entry.cjs.js","sources":["src/components/bh-input-password/bh-input-password.css?tag=bh-input-password&encapsulation=shadow","src/components/bh-input-password/bh-input-password.tsx"],"sourcesContent":[":host {\n  display: block;\n  font-family: var(--font-inter, 'Inter', -apple-system, BlinkMacSystemFont, sans-serif);\n}\n\n/* Input Wrapper */\n.input-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-sm, 8px);\n  width: 100%;\n}\n\n/* Input Container */\n.input-container {\n  display: flex;\n  align-items: center;\n  gap: var(--spacing-md, 12px);\n  padding: var(--spacing-md, 12px);\n  height: 36px;\n  width: 100%;\n  background: var(--color-white, #FFFFFF);\n  border: 1px solid var(--color-neutral-300, #D0D5DD);\n  border-radius: var(--spacing-md, 8px);\n  transition: all 0.2s ease-in-out;\n  cursor: text;\n  box-sizing: border-box;\n}\n\n.input-container.input-container-with-leading {\n  padding: var(--spacing-md, 12px) var(--spacing-lg, 16px);\n}\n\n/* Input States */\n.input-container.input-container-hover {\n  border-color: var(--color-brand-500, #7F56D9);\n}\n\n.input-container.input-container-focused {\n  border-color: var(--color-brand-500, #7F56D9);\n  box-shadow: 0 0 0 1px var(--color-brand-500, #7F56D9);\n}\n\n.input-container.input-container-disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n  background: var(--color-neutral-50, #F9FAFB);\n}\n\n.input-container.input-container-error {\n  border-color: var(--color-error-300, #FDA29B);\n}\n\n.input-container.input-container-error.input-container-hover {\n  border-color: var(--color-error-500, #F05250);\n}\n\n.input-container.input-container-error.input-container-focused {\n  border-color: var(--color-brand-600, #6941C6);\n}\n\n/* Input Content */\n.input-content {\n  display: flex;\n  align-items: center;\n  gap: var(--spacing-md, 12px);\n  flex: 1;\n  height: 100%;\n  min-width: 0;\n}\n\n/* Input Element */\n.input-element {\n  flex: 1;\n  height: 100%;\n  border: none;\n  outline: none;\n  background: transparent;\n  font-family: inherit;\n  font-weight: 400;\n  font-size: var(--text-sm-size, 14px);\n  line-height: 1.43;\n  color: var(--color-neutral-800, #1D2939);\n  min-width: 60px;\n  padding: 0;\n}\n\n.input-element:focus {\n  outline: none;\n  border: none;\n  box-shadow: none;\n}\n\n.input-element::placeholder {\n  color: var(--color-neutral-500, #667085);\n}\n\n.input-element:disabled {\n  cursor: not-allowed;\n}\n\n/* Leading Icon */\n.leading-icon {\n  font-size: var(--text-xl-size, 20px);\n  color: var(--color-neutral-500, #667085);\n  user-select: none;\n  flex-shrink: 0;\n  cursor: default;\n  transition: color 0.2s ease-in-out;\n}\n\n.input-container-focused .leading-icon {\n  color: var(--color-brand-600, #6941C6);\n}\n\n/* Visibility Toggle */\n.visibility-toggle {\n  font-size: var(--text-xl-size, 20px);\n  color: var(--color-neutral-400, #98A2B3);\n  cursor: pointer;\n  user-select: none;\n  flex-shrink: 0;\n  transition: color 0.2s ease-in-out;\n}\n\n.visibility-toggle:hover {\n  color: var(--color-neutral-600, #475467);\n}\n\n.input-container-disabled .visibility-toggle {\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n/* Hint Text */\n.hint-text {\n  font-family: inherit;\n  font-weight: 400;\n  font-size: var(--text-sm-size, 14px);\n  line-height: 1.43;\n  color: var(--color-neutral-600, #475467);\n}\n\n.hint-text.hint-error {\n  color: var(--color-error-600, #DC2626);\n}\n\n/* Material Symbols */\n.material-symbols-outlined {\n  font-family: 'Material Symbols Outlined';\n  font-weight: normal;\n  font-style: normal;\n  font-size: 20px;\n  line-height: 1;\n  letter-spacing: normal;\n  text-transform: none;\n  display: inline-block;\n  white-space: nowrap;\n  word-wrap: normal;\n  direction: ltr;\n  font-feature-settings: 'liga';\n  -webkit-font-smoothing: antialiased;\n  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;\n}\n","import { Component, Prop, State, Event, EventEmitter, h, AttachInternals } from '@stencil/core';\nimport { syncFormValue, updateValidity } from '../../utils/form';\n\n@Component({\n  tag: 'bh-input-password',\n  styleUrl: 'bh-input-password.css',\n  shadow: true,\n  formAssociated: true,\n})\nexport class BhInputPassword {\n  @AttachInternals() internals!: ElementInternals;\n\n  private inputEl?: HTMLInputElement;\n  /**\n   * The label for the input\n   */\n  @Prop() label: string = 'Password';\n\n  /**\n   * Placeholder text\n   */\n  @Prop() placeholder: string = 'Enter your password';\n\n  /**\n   * Hint text shown below the input\n   */\n  @Prop() hintText: string = '';\n\n  /**\n   * Whether to show the label\n   */\n  @Prop() showLabel: boolean = true;\n\n  /**\n   * Whether to show hint text\n   */\n  @Prop() showHintText: boolean = true;\n\n  /**\n   * Whether to show the help icon\n   */\n  @Prop() showHelpIcon: boolean = false;\n\n  /**\n   * Whether to show a leading icon\n   */\n  @Prop() showLeadingIcon: boolean = true;\n\n  /**\n   * Whether the field has an error\n   */\n  @Prop() error: boolean = false;\n\n  /**\n   * Whether the input is disabled\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * Whether the field is required\n   */\n  @Prop() required: boolean = false;\n\n  /**\n   * Tooltip text for the help icon\n   */\n  @Prop() helpIconTooltip: string = 'Password requirements';\n\n  /**\n   * Leading icon name (Material Symbols)\n   */\n  @Prop() leadingIcon: string = 'lock';\n\n  /**\n   * The input value\n   */\n  @Prop({ mutable: true }) value: string = '';\n\n  /**\n   * Name attribute for form submission\n   */\n  @Prop() name: string = '';\n\n  /**\n   * Default value for form reset\n   */\n  @Prop() defaultValue: string = '';\n\n  /**\n   * Custom validation message\n   */\n  @Prop() validationMessage: string = '';\n\n  /**\n   * Track focus state\n   */\n  @State() isFocused: boolean = false;\n\n  /**\n   * Track hover state\n   */\n  @State() isHovered: boolean = false;\n\n  /**\n   * Track password visibility\n   */\n  @State() showPassword: boolean = false;\n\n  \n  /**\n   * Emitted when the value changes\n   */\n  @Event() bhInput!: EventEmitter<string>;\n\n  /**\n   * Emitted when the input gains focus\n   */\n  @Event() bhFocus!: EventEmitter<void>;\n\n  /**\n   * Emitted when the input loses focus\n   */\n  @Event() bhBlur!: EventEmitter<void>;\n\n  /**\n   * Emitted when the help icon is clicked\n   */\n  @Event() bhHelpClick!: EventEmitter<void>;\n\n  /**\n   * Emitted when visibility is toggled\n   */\n  @Event() bhVisibilityToggle!: EventEmitter<boolean>;\n\n  componentDidLoad() {\n    syncFormValue(this);\n    updateValidity(this.internals, this.inputEl, this.validationMessage);\n  }\n\n  formResetCallback() {\n    this.value = this.defaultValue;\n    if (this.inputEl) {\n      this.inputEl.value = this.defaultValue;\n    }\n    syncFormValue(this);\n    updateValidity(this.internals, this.inputEl);\n  }\n\n  private handleInput = (event: Event): void => {\n    const target = event.target as HTMLInputElement;\n    this.value = target.value;\n    this.bhInput.emit(this.value);\n    syncFormValue(this);\n    updateValidity(this.internals, this.inputEl, this.validationMessage);\n  };\n\n  private handleFocus = (): void => {\n    this.isFocused = true;\n    this.bhFocus.emit();\n  };\n\n  private handleBlur = (): void => {\n    this.isFocused = false;\n    this.bhBlur.emit();\n  };\n\n  private handleMouseEnter = (): void => {\n    if (!this.isFocused) {\n      this.isHovered = true;\n    }\n  };\n\n  private handleMouseLeave = (): void => {\n    this.isHovered = false;\n  };\n\n  private togglePasswordVisibility = (): void => {\n    if (!this.disabled) {\n      this.showPassword = !this.showPassword;\n      this.bhVisibilityToggle.emit(this.showPassword);\n    }\n  };\n\n  private handleHelpClick = (): void => {\n    this.bhHelpClick.emit();\n  };\n\n  render() {\n    const containerClasses = {\n      'input-container': true,\n      'input-container-focused': this.isFocused,\n      'input-container-hover': this.isHovered && !this.isFocused,\n      'input-container-error': this.error,\n      'input-container-disabled': this.disabled,\n      'input-container-with-leading': this.showLeadingIcon,\n    };\n\n    return (\n      <div class=\"input-wrapper\" part=\"wrapper\">\n        <bh-label\n          label={this.showLabel ? this.label : ''}\n          required={this.required}\n          showHelpIcon={this.showHelpIcon}\n          helpIconTooltip={this.helpIconTooltip}\n          disabled={this.disabled}\n          onBhHelpClick={this.handleHelpClick}\n        >\n          <div\n            class={containerClasses}\n            onMouseEnter={this.handleMouseEnter}\n            onMouseLeave={this.handleMouseLeave}\n          >\n            <div class=\"input-content\">\n              {this.showLeadingIcon && (\n                <span class=\"material-symbols-outlined leading-icon\">\n                  {this.leadingIcon}\n                </span>\n              )}\n              <input\n                ref={(el) => (this.inputEl = el)}\n                type={this.showPassword ? 'text' : 'password'}\n                class=\"input-element\"\n                name={this.name}\n                value={this.value}\n                placeholder={this.placeholder}\n                disabled={this.disabled}\n                required={this.required}\n                aria-label={this.label}\n                aria-describedby={this.showHintText && this.hintText ? 'hint-text' : undefined}\n                aria-invalid={String(this.error)}\n                onInput={this.handleInput}\n                onFocus={this.handleFocus}\n                onBlur={this.handleBlur}\n                part=\"input\"\n              />\n            </div>\n            <span\n              class=\"material-symbols-outlined visibility-toggle\"\n              onClick={this.togglePasswordVisibility}\n              title={this.showPassword ? 'Hide password' : 'Show password'}\n            >\n              {this.showPassword ? 'visibility_off' : 'visibility'}\n            </span>\n          </div>\n        </bh-label>\n\n        {this.showHintText && this.hintText && (\n          <div\n            class={{ 'hint-text': true, 'hint-error': this.error }}\n            id=\"hint-text\"\n          >\n            {this.hintText}\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n"],"names":["syncFormValue","updateValidity","h"],"mappings":"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"}