@actabldesign/bellhop-core 0.0.3

package/types/components/bh-input-number/bh-input-number.d.ts

@@ -0,0 +1,137 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type InputNumberState = 'placeholder' | 'filled' | 'hover' | 'focused';
+export declare class BhInputNumber {
+    el: HTMLElement;
+    internals: ElementInternals;
+    private inputEl?;
+    /**
+     * Whether the input is in an error state
+     */
+    error: boolean;
+    /**
+     * Whether the field is required
+     */
+    required: boolean;
+    /**
+     * Whether the input is disabled
+     */
+    disabled: boolean;
+    /**
+     * Whether to show the help icon
+     */
+    showHelpIcon: boolean;
+    /**
+     * Whether to show the leading icon
+     */
+    showLeadingIcon: boolean;
+    /**
+     * Whether to show the label
+     */
+    showLabel: boolean;
+    /**
+     * Whether to show the hint text
+     */
+    showHintText: boolean;
+    /**
+     * Label text for the input
+     */
+    label: string;
+    /**
+     * Placeholder text
+     */
+    placeholder: string;
+    /**
+     * Hint text displayed below the input
+     */
+    hintText: string;
+    /**
+     * Leading icon name (Material Symbols)
+     */
+    leadingIcon: string;
+    /**
+     * Tooltip text for the help icon
+     */
+    helpIconTooltip: string;
+    /**
+     * Current numeric value
+     */
+    value: number | null;
+    /**
+     * Minimum allowed value
+     */
+    min: number | null;
+    /**
+     * Maximum allowed value
+     */
+    max: number | null;
+    /**
+     * Step value for increment/decrement
+     */
+    step: number;
+    /**
+     * Text prefix before the input value
+     */
+    prefixText: string;
+    /**
+     * Text suffix after the input value
+     */
+    suffixText: string;
+    /**
+     * Width of the component
+     */
+    width: string;
+    /**
+     * Name attribute for form submission
+     */
+    name: string;
+    /**
+     * Default value for form reset
+     */
+    defaultValue: number | null;
+    /**
+     * Custom validation message
+     */
+    validationMessage: string;
+    internalState: InputNumberState;
+    isHovered: boolean;
+    isFocused: boolean;
+    internalValue: number | null;
+    hasValidationError: boolean;
+    /**
+     * Event emitted when the value changes
+     */
+    bhChange: EventEmitter<number | null>;
+    /**
+     * Event emitted when the input receives focus
+     */
+    bhFocus: EventEmitter<void>;
+    /**
+     * Event emitted when the input loses focus
+     */
+    bhBlur: EventEmitter<void>;
+    /**
+     * Event emitted when the help icon is clicked
+     */
+    bhHelpClick: EventEmitter<void>;
+    private get isControlled();
+    private get currentValue();
+    watchValue(newValue: number | null): void;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    formResetCallback(): void;
+    private syncNumberFormValue;
+    private isOutOfBounds;
+    private updateInternalState;
+    private validateValue;
+    private updateValue;
+    private handleInputChange;
+    private increment;
+    private decrement;
+    private handleInputFocus;
+    private handleInputBlur;
+    private handleMouseEnter;
+    private handleMouseLeave;
+    private handleHelpIconClick;
+    private getValidationErrorMessage;
+    render(): any;
+}

package/types/components/bh-input-password/bh-input-password.d.ts

@@ -0,0 +1,111 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class BhInputPassword {
+    internals: ElementInternals;
+    private inputEl?;
+    /**
+     * The label for the input
+     */
+    label: string;
+    /**
+     * Placeholder text
+     */
+    placeholder: string;
+    /**
+     * Hint text shown below the input
+     */
+    hintText: string;
+    /**
+     * Whether to show the label
+     */
+    showLabel: boolean;
+    /**
+     * Whether to show hint text
+     */
+    showHintText: boolean;
+    /**
+     * Whether to show the help icon
+     */
+    showHelpIcon: boolean;
+    /**
+     * Whether to show a leading icon
+     */
+    showLeadingIcon: boolean;
+    /**
+     * Whether the field has an error
+     */
+    error: boolean;
+    /**
+     * Whether the input is disabled
+     */
+    disabled: boolean;
+    /**
+     * Whether the field is required
+     */
+    required: boolean;
+    /**
+     * Tooltip text for the help icon
+     */
+    helpIconTooltip: string;
+    /**
+     * Leading icon name (Material Symbols)
+     */
+    leadingIcon: string;
+    /**
+     * The input value
+     */
+    value: string;
+    /**
+     * Name attribute for form submission
+     */
+    name: string;
+    /**
+     * Default value for form reset
+     */
+    defaultValue: string;
+    /**
+     * Custom validation message
+     */
+    validationMessage: string;
+    /**
+     * Track focus state
+     */
+    isFocused: boolean;
+    /**
+     * Track hover state
+     */
+    isHovered: boolean;
+    /**
+     * Track password visibility
+     */
+    showPassword: boolean;
+    /**
+     * Emitted when the value changes
+     */
+    bhInput: EventEmitter<string>;
+    /**
+     * Emitted when the input gains focus
+     */
+    bhFocus: EventEmitter<void>;
+    /**
+     * Emitted when the input loses focus
+     */
+    bhBlur: EventEmitter<void>;
+    /**
+     * Emitted when the help icon is clicked
+     */
+    bhHelpClick: EventEmitter<void>;
+    /**
+     * Emitted when visibility is toggled
+     */
+    bhVisibilityToggle: EventEmitter<boolean>;
+    componentDidLoad(): void;
+    formResetCallback(): void;
+    private handleInput;
+    private handleFocus;
+    private handleBlur;
+    private handleMouseEnter;
+    private handleMouseLeave;
+    private togglePasswordVisibility;
+    private handleHelpClick;
+    render(): any;
+}

package/types/components/bh-input-text/bh-input-text.d.ts

@@ -0,0 +1,126 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class BhInputText {
+    internals: ElementInternals;
+    private inputEl?;
+    /**
+     * The label for the input
+     */
+    label: string;
+    /**
+     * Placeholder text
+     */
+    placeholder: string;
+    /**
+     * Hint text shown below the input
+     */
+    hintText: string;
+    /**
+     * Whether to show the label
+     */
+    showLabel: boolean;
+    /**
+     * Whether to show hint text
+     */
+    showHintText: boolean;
+    /**
+     * Whether to show the help icon
+     */
+    showHelpIcon: boolean;
+    /**
+     * Whether to show a leading icon
+     */
+    showLeadingIcon: boolean;
+    /**
+     * Whether to show a trailing icon
+     */
+    showTrailingIcon: boolean;
+    /**
+     * Whether the field has an error
+     */
+    error: boolean;
+    /**
+     * Whether the input is disabled
+     */
+    disabled: boolean;
+    /**
+     * Whether the field is required
+     */
+    required: boolean;
+    /**
+     * Tooltip text for the help icon
+     */
+    helpIconTooltip: string;
+    /**
+     * Leading icon name (Material Symbols)
+     */
+    leadingIcon: string;
+    /**
+     * Trailing icon name (Material Symbols)
+     */
+    trailingIcon: string;
+    /**
+     * The input value
+     */
+    value: string;
+    /**
+     * Name attribute for form submission
+     */
+    name: string;
+    /**
+     * Default value for form reset
+     */
+    defaultValue: string;
+    /**
+     * Custom validation message
+     */
+    validationMessage: string;
+    /**
+     * Input type (text, email, tel, url, etc.)
+     */
+    type: string;
+    /**
+     * Width of the input (e.g., '100%', '200px')
+     */
+    width: string;
+    /**
+     * Whether the input is read-only
+     */
+    readOnly: boolean;
+    /**
+     * Visual state of the input (for programmatic control)
+     */
+    state: 'default' | 'error' | 'disabled' | 'focus' | 'filled' | 'hover';
+    /**
+     * Track focus state
+     */
+    isFocused: boolean;
+    /**
+     * Track hover state
+     */
+    isHovered: boolean;
+    /**
+     * Emitted when the value changes
+     */
+    bhInput: EventEmitter<string>;
+    /**
+     * Emitted when the input gains focus
+     */
+    bhFocus: EventEmitter<void>;
+    /**
+     * Emitted when the input loses focus
+     */
+    bhBlur: EventEmitter<void>;
+    /**
+     * Emitted when the help icon is clicked
+     */
+    bhHelpClick: EventEmitter<void>;
+    private handleInput;
+    componentDidLoad(): void;
+    formResetCallback(): void;
+    private handleFocus;
+    private handleBlur;
+    private handleMouseEnter;
+    private handleMouseLeave;
+    private handleHelpClick;
+    render(): any;
+}

package/types/components/bh-input-verification/bh-input-verification.d.ts

@@ -0,0 +1,79 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type InputVerificationSize = 'sm' | 'md' | 'lg';
+export type InputVerificationDigits = 4 | 6;
+export declare class BhInputVerification {
+    el: HTMLElement;
+    /**
+     * Size variant of the input fields
+     */
+    size: InputVerificationSize;
+    /**
+     * Number of digits (4 or 6)
+     */
+    digits: InputVerificationDigits;
+    /**
+     * Label text for the input
+     */
+    label: string;
+    /**
+     * Whether to show the label
+     */
+    showLabel: boolean;
+    /**
+     * Hint text displayed below the inputs
+     */
+    hintText: string;
+    /**
+     * Whether to show the hint text
+     */
+    showHintText: boolean;
+    /**
+     * Whether the input is in an error state
+     */
+    error: boolean;
+    /**
+     * Whether the input is disabled
+     */
+    disabled: boolean;
+    /**
+     * Whether the field is required
+     */
+    required: boolean;
+    /**
+     * Whether to show the separator for 6-digit codes
+     */
+    showSeparator: boolean;
+    /**
+     * Placeholder character for empty inputs
+     */
+    placeholder: string;
+    /**
+     * Width of the component
+     */
+    width: string;
+    /**
+     * Current value of the verification code
+     */
+    value: string;
+    values: string[];
+    inputRefs: HTMLInputElement[];
+    /**
+     * Event emitted when the value changes
+     */
+    bhChange: EventEmitter<string>;
+    /**
+     * Event emitted when all digits are filled
+     */
+    bhComplete: EventEmitter<string>;
+    watchValue(newValue: string): void;
+    watchDigits(): void;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    private updateValues;
+    private handleInputChange;
+    private handleKeyDown;
+    private handlePaste;
+    private handleFocus;
+    private renderInputs;
+    render(): any;
+}

package/types/components/bh-label/bh-label.d.ts

@@ -0,0 +1,54 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type LabelLayout = 'block' | 'inline' | 'inline-start' | 'inline-space-between';
+export declare class BhLabel {
+    el: HTMLElement;
+    private tooltipTimerRef?;
+    /**
+     * The label text to display
+     */
+    label: string;
+    /**
+     * Layout style for the label container
+     * - block: Label above content (default for form fields)
+     * - inline: Label next to content (label first)
+     * - inline-start: Content next to label (content first, for checkboxes/radios)
+     * - inline-space-between: Label and content on opposite ends
+     */
+    layout: LabelLayout;
+    /**
+     * The id of the form element the label is bound to.
+     * Use when the labeled element is not a child of this component.
+     */
+    for: string;
+    /**
+     * Supporting text displayed below the label (second line)
+     * for instructions or additional description
+     */
+    supportingText: string;
+    /**
+     * Whether to show the required asterisk
+     */
+    required: boolean;
+    /**
+     * Whether to show the help icon
+     */
+    showHelpIcon: boolean;
+    /**
+     * Tooltip text for the help icon
+     */
+    helpIconTooltip: string;
+    /**
+     * Whether the label is disabled
+     */
+    disabled: boolean;
+    showHelpTooltip: boolean;
+    /**
+     * Emitted when the help icon is clicked
+     */
+    bhHelpClick: EventEmitter<void>;
+    disconnectedCallback(): void;
+    private handleHelpIconMouseEnter;
+    private handleHelpIconMouseLeave;
+    private handleHelpIconClick;
+    render(): any;
+}

package/types/components/bh-loader-spinner/bh-loader-spinner.d.ts

@@ -0,0 +1,19 @@
+export type LoaderSize = 'sm' | 'md' | 'lg' | 'xl';
+export type LoaderVariant = 'default' | 'white';
+export declare class BhLoaderSpinner {
+    /** Loader size */
+    size: LoaderSize;
+    /** Loader color variant - use 'white' for dark surfaces like buttons */
+    variant: LoaderVariant;
+    /** Whether to show as overlay */
+    overlay: boolean;
+    /** Message to show in overlay mode */
+    overlayMessage: string;
+    /** Whether to show message */
+    showMessage: boolean;
+    /** Message text */
+    message: string;
+    private renderSpinner;
+    private renderMessage;
+    render(): any;
+}

package/types/components/bh-logo-box/bh-logo-box.d.ts

@@ -0,0 +1,28 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { BhProduct } from '../bh-product-switcher/bh-product-switcher';
+export type LogoType = 'actabl' | 'al' | 'he' | 'ps' | 'tr';
+export declare class BhLogoBox {
+    /**
+     * Type of logo to display
+     */
+    logoType: LogoType;
+    /**
+     * Array of products to display in the switcher
+     */
+    products: BhProduct[];
+    /**
+     * Event emitted when a product is selected
+     */
+    bhProductSelect: EventEmitter<BhProduct>;
+    isOpen: boolean;
+    anchorPosition: {
+        top: number;
+        left: number;
+    };
+    private logoActiveRef?;
+    private handleLogoClick;
+    private handleClose;
+    private handleProductSelect;
+    private getLogoSrc;
+    render(): any;
+}

package/types/components/bh-modal/bh-modal.d.ts

@@ -0,0 +1,23 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type ModalWidth = 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
+export declare class BhModal {
+    /**
+     * Whether the modal is visible
+     */
+    visible: boolean;
+    /**
+     * Whether to show the backdrop overlay
+     */
+    overlay: boolean;
+    /**
+     * Preset width of the modal: sm (400px), md (480px), lg (520px), xl (640px), xxl (688px)
+     */
+    width: ModalWidth;
+    /**
+     * Emitted when the modal is closed (overlay click or close button)
+     */
+    bhClose: EventEmitter<void>;
+    private handleClose;
+    private handleOverlayClick;
+    render(): any;
+}

package/types/components/bh-modal-actions/bh-modal-actions.d.ts

@@ -0,0 +1,38 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type ModalActionsType = 'fill' | 'right-aligned';
+export declare class BhModalActions {
+    /**
+     * Layout type for the actions:
+     * - 'fill': Buttons take full width
+     * - 'right-aligned': Buttons aligned to the right with optional left content slot
+     */
+    type: ModalActionsType;
+    /**
+     * Whether to show destructive styling on primary button
+     */
+    destructive: boolean;
+    /**
+     * Primary/destructive action button label
+     */
+    primaryLabel: string;
+    /**
+     * Secondary action button label
+     */
+    secondaryLabel: string;
+    /**
+     * Whether to show the divider line above actions
+     */
+    divider: boolean;
+    /**
+     * Emitted when the primary/destructive action button is clicked
+     */
+    bhPrimaryAction: EventEmitter<void>;
+    /**
+     * Emitted when the secondary action button is clicked
+     */
+    bhSecondaryAction: EventEmitter<void>;
+    private handlePrimaryAction;
+    private handleSecondaryAction;
+    private renderButtons;
+    render(): any;
+}

package/types/components/bh-modal-header/bh-modal-header.d.ts

@@ -0,0 +1,45 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class BhModalHeader {
+    /**
+     * Modal title (required)
+     */
+    modalTitle: string;
+    /**
+     * Modal description/supporting text
+     */
+    description?: string;
+    /**
+     * Icon name for the featured icon (Material Symbols)
+     */
+    icon?: string;
+    /**
+     * Color theme for the featured icon
+     */
+    iconColor: 'brand' | 'gray' | 'error' | 'warning' | 'success' | 'highlight';
+    /**
+     * Whether to show the featured icon
+     */
+    showIcon: boolean;
+    /**
+     * Whether to show the close button
+     */
+    showCloseButton: boolean;
+    /**
+     * Header alignment type
+     */
+    type: 'left-aligned' | 'center-aligned' | 'horizontal-left-aligned';
+    /**
+     * Whether to show padding at the bottom
+     */
+    paddingBottom: boolean;
+    /**
+     * Whether to show the divider line
+     */
+    divider: boolean;
+    /**
+     * Emitted when the close button is clicked
+     */
+    bhClose: EventEmitter<void>;
+    private handleClose;
+    render(): any;
+}