@nanahoshi/mona-ui 0.1.0

package/types/nanahoshi-mona-ui-multi-select.d.ts

@@ -0,0 +1,247 @@
+import * as _mirei_ts_collections from '@mirei/ts-collections';
+import * as _angular_core from '@angular/core';
+import { TemplateRef } from '@angular/core';
+import { FormValueControl } from '@angular/forms/signals';
+import { PreventableEvent } from '@nanahoshi/mona-ui/common';
+import * as i1 from '@nanahoshi/mona-ui/dropdowns';
+import { DropdownDataInput, DropdownPopupInput, DropdownPopupVariantInput, DropdownFieldPredicateType, DropdownFieldSelectorType } from '@nanahoshi/mona-ui/dropdowns';
+import { ListItem, ListSizeInputType } from '@nanahoshi/mona-ui/internal/list';
+import { PopupCloseEvent } from '@nanahoshi/mona-ui/popup';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantInputs } from '@nanahoshi/mona-ui/internal';
+import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
+import { VariantProps } from 'class-variance-authority';
+
+declare const multiSelectBaseThemeVariants: (theme: ThemeStyle) => (props?: ({
+    disabled?: boolean | null | undefined;
+    focused?: boolean | null | undefined;
+    invalid?: boolean | null | undefined;
+    rounded?: "none" | "small" | "medium" | "large" | "full" | null | undefined;
+    size?: "small" | "medium" | "large" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const multiSelectItemContainerThemeVariants: (theme: ThemeStyle) => (props?: ({
+    rounded?: "none" | "small" | "medium" | "large" | "full" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const multiSelectAffixContainerThemeVariants: (theme: ThemeStyle) => (props?: class_variance_authority_types.ClassProp | undefined) => string;
+declare const multiSelectIndicatorContainerThemeVariants: (theme: ThemeStyle) => (props?: ({
+    size?: "small" | "medium" | "large" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type MultiSelectBaseVariantProps = VariantProps<ReturnType<typeof multiSelectBaseThemeVariants>>;
+type MultiSelectBaseVariantInput = VariantInputs<MultiSelectBaseVariantProps>;
+type MultiSelectItemContainerVariantProps = VariantProps<ReturnType<typeof multiSelectItemContainerThemeVariants>>;
+type MultiSelectItemContainerVariantInput = VariantInputs<MultiSelectItemContainerVariantProps>;
+type MultiSelectAffixContainerVariantProps = VariantProps<ReturnType<typeof multiSelectAffixContainerThemeVariants>>;
+type MultiSelectAffixContainerVariantInput = VariantInputs<MultiSelectAffixContainerVariantProps>;
+type MultiSelectIndicatorContainerVariantProps = VariantProps<ReturnType<typeof multiSelectIndicatorContainerThemeVariants>>;
+type MultiSelectIndicatorContainerVariantInput = VariantInputs<MultiSelectIndicatorContainerVariantProps>;
+type MultiSelectVariantProps = MultiSelectBaseVariantProps & MultiSelectItemContainerVariantProps & MultiSelectAffixContainerVariantProps & MultiSelectIndicatorContainerVariantProps;
+type MultiSelectVariantInput = Omit<MultiSelectBaseVariantInput, "focused" | "invalid"> & MultiSelectItemContainerVariantInput & MultiSelectAffixContainerVariantInput & MultiSelectIndicatorContainerVariantInput;
+
+declare class MultiSelectComponent<TData = unknown> implements FormValueControl<Iterable<TData>>, MultiSelectVariantInput, DropdownDataInput<TData>, DropdownPopupInput, DropdownPopupVariantInput {
+    #private;
+    protected readonly activeDescendant: _angular_core.Signal<string | null>;
+    protected readonly affixClass: _angular_core.Signal<string>;
+    protected readonly baseClass: _angular_core.Signal<string>;
+    protected readonly expanded: _angular_core.Signal<boolean>;
+    protected readonly footerTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
+    protected readonly groupHeaderTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
+    protected readonly headerTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
+    protected readonly invalidState: _angular_core.Signal<boolean>;
+    protected readonly indicatorClass: _angular_core.Signal<string>;
+    protected readonly itemContainerClass: _angular_core.Signal<string>;
+    protected readonly itemTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
+    protected readonly listId: string;
+    protected readonly listPopupClass: _angular_core.Signal<string>;
+    protected readonly noDataTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
+    protected readonly popupTemplate: _angular_core.Signal<TemplateRef<any>>;
+    protected readonly prefixTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
+    protected readonly summaryTagTemplate: _angular_core.Signal<TemplateRef<unknown> | null>;
+    protected readonly tagCount: _angular_core.Signal<number>;
+    protected readonly tagTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
+    protected readonly selectedDataItems: _angular_core.Signal<_mirei_ts_collections.ImmutableSet<TData>>;
+    protected readonly selectedListItems: _angular_core.Signal<_mirei_ts_collections.ImmutableSet<ListItem<TData>>>;
+    protected readonly valueTextMap: _angular_core.Signal<_mirei_ts_collections.ImmutableDictionary<ListItem<TData>, string>>;
+    protected readonly visibleTagCount: _angular_core.Signal<number>;
+    /**
+     * @description Sets the aria-label attribute of the multi select component.
+     * @default ""
+     */
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    /**
+     * @description Sets the aria-labelledby attribute of the multi select component.
+     * @default ""
+     */
+    readonly ariaLabelledBy: _angular_core.InputSignal<string>;
+    /**
+     * @description Closes the popup automatically after an item is selected or deselected.
+     * @default false
+     */
+    readonly autoClose: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Renders a checkbox next to each item in the popup list to indicate its selected state.
+     * @default false
+     */
+    readonly checkboxes: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Emits when the popup is about to close. This event is preventable.
+     */
+    readonly close: _angular_core.OutputEmitterRef<PopupCloseEvent<unknown>>;
+    /**
+     * @description Emits after the popup is closed.
+     */
+    readonly closed: _angular_core.OutputEmitterRef<void>;
+    /**
+     * @description Collection of items rendered in the popup list.
+     * @default []
+     */
+    readonly data: _angular_core.InputSignal<Iterable<TData>>;
+    /**
+     * @description Disables the component, preventing the popup from opening and blocking tag removal.
+     * @default false
+     */
+    readonly disabled: _angular_core.ModelSignal<boolean>;
+    /**
+     * @description A predicate function or the name of the field that determines whether an item is disabled.
+     */
+    readonly itemDisabled: _angular_core.InputSignal<DropdownFieldPredicateType<TData>>;
+    /**
+     * @description Marks the multi select as invalid. When bound to a signal form field via `[formField]`,
+     * this is written by the `FormField` directive.
+     * @default false
+     */
+    readonly invalid: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Sets the loading state of the multi select component.
+     * @default false
+     */
+    readonly loading: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Emits when the popup is about to open. This event is preventable.
+     */
+    readonly open: _angular_core.OutputEmitterRef<PreventableEvent<Event>>;
+    /**
+     * @description Emits after the popup is opened.
+     */
+    readonly opened: _angular_core.OutputEmitterRef<void>;
+    /**
+     * @description Sets the class of the popup element.
+     * @default ""
+     */
+    readonly popupClass: _angular_core.InputSignal<string>;
+    /**
+     * @description Sets the height of the popup element.
+     * @default null
+     */
+    readonly popupHeight: _angular_core.InputSignal<ListSizeInputType>;
+    /**
+     * @description Sets the width of the popup element.
+     * @default null
+     */
+    readonly popupWidth: _angular_core.InputSignal<ListSizeInputType>;
+    /**
+     * @description Sets the readonly state of the multi select component.
+     * @default false
+     */
+    readonly readonly: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Sets the required state of the multi select component.
+     * @default false
+     */
+    readonly required: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Sets the border radius of the multi select component.
+     * @default "medium"
+     */
+    readonly rounded: _angular_core.InputSignal<"none" | "small" | "medium" | "large" | "full" | null | undefined>;
+    /**
+     * @description Renders a button that clears all selected items when at least one item is selected.
+     * @default false
+     */
+    readonly showClearButton: _angular_core.InputSignal<boolean>;
+    /**
+     * @description The size of the multi select component.
+     * @default "medium"
+     */
+    readonly size: _angular_core.InputSignal<"small" | "medium" | "large" | null | undefined>;
+    /**
+     * @description Sets the text field of the multi select component.
+     * It can be null, string, or a function that takes an item and returns a string.
+     * If null, the item itself will be used as the text representation.
+     * @default null
+     */
+    readonly textField: _angular_core.InputSignal<DropdownFieldSelectorType<TData>>;
+    /**
+     * @description Emitted when the multi select is interacted with on blur, selection, remove, or clear.
+     * The `FormField` directive listens to this to mark the field as touched.
+     */
+    readonly touch: _angular_core.OutputEmitterRef<void>;
+    /**
+     * @description Sets the touched state of the multi select. When bound to a signal form field via `[formField]`,
+     * this is written by the `FormField` directive.
+     * @default false
+     */
+    readonly touched: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Additional CSS classes merged onto the host element via `tailwind-merge`.
+     * @default ""
+     */
+    readonly userClass: _angular_core.InputSignal<string>;
+    /**
+     * @description Sets the value field of the multi select component.
+     * It can be null, string, or a function that takes an item and returns a string.
+     * If null, the item itself will be used as the value representation.
+     * @default null
+     */
+    readonly valueField: _angular_core.InputSignal<DropdownFieldSelectorType<TData>>;
+    /**
+     * @description Two-way bindable current selected values. Implements `FormValueControl<Iterable<TData>>`,
+     * enabling signal forms `[formField]` binding. When `valueField` is set, primitive field values can be
+     * written into this model to restore matching selected items.
+     * @default []
+     */
+    readonly value: _angular_core.ModelSignal<Iterable<TData>>;
+    constructor();
+    focus(): void;
+    protected onBlur(): void;
+    protected onItemSelect(): void;
+    protected onSelectedItemRemove(event: Event, listItem: ListItem<TData>): void;
+    protected onSelectedItemGroupRemove(event: Event): void;
+    protected onValueClear(event: Event): void;
+    private handleEnterKey;
+    private handlePopupPositionUpdate;
+    private initialize;
+    private setBackspaceKeySubscription;
+    private setEnterKeySubscription;
+    private setEventListeners;
+    private setSubscriptions;
+    private updateValue;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MultiSelectComponent<any>, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MultiSelectComponent<any>, "mona-multi-select", never, { "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "aria-labelledby"; "required": false; "isSignal": true; }; "autoClose": { "alias": "autoClose"; "required": false; "isSignal": true; }; "checkboxes": { "alias": "checkboxes"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "itemDisabled": { "alias": "itemDisabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "popupClass": { "alias": "popupClass"; "required": false; "isSignal": true; }; "popupHeight": { "alias": "popupHeight"; "required": false; "isSignal": true; }; "popupWidth": { "alias": "popupWidth"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "rounded": { "alias": "rounded"; "required": false; "isSignal": true; }; "showClearButton": { "alias": "showClearButton"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "textField": { "alias": "textField"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; "valueField": { "alias": "valueField"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "close": "close"; "closed": "closed"; "disabled": "disabledChange"; "open": "open"; "opened": "opened"; "touch": "touch"; "value": "valueChange"; }, ["footerTemplate", "groupHeaderTemplate", "headerTemplate", "itemTemplate", "noDataTemplate", "prefixTemplate", "tagTemplate"], never, true, [{ directive: typeof i1.DropdownDataHandlerDirective; inputs: {}; outputs: {}; }, { directive: typeof i1.DropdownListPopupHandlerDirective; inputs: {}; outputs: {}; }]>;
+}
+
+declare class MultiSelectSummaryTagDirective<TData> {
+    #private;
+    private readonly summaryTagTemplate;
+    /**
+     * @description Number of selected item tags to display before collapsing the rest into a summary tag.
+     * A negative value shows every selected item as its own tag and never renders the summary tag.
+     * @default -1
+     */
+    readonly tagCount: _angular_core.InputSignal<number>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MultiSelectSummaryTagDirective<any>, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<MultiSelectSummaryTagDirective<any>, "mona-multi-select[monaMultiSelectSummaryTag]", never, { "tagCount": { "alias": "monaMultiSelectSummaryTag"; "required": false; "isSignal": true; }; }, {}, ["summaryTagTemplate"], never, true, never>;
+}
+
+declare class MultiSelectSummaryTagTemplateDirective {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MultiSelectSummaryTagTemplateDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<MultiSelectSummaryTagTemplateDirective, "ng-template[monaMultiSelectSummaryTagTemplate]", never, {}, {}, never, never, true, never>;
+}
+
+declare class MultiSelectTagTemplateDirective {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MultiSelectTagTemplateDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<MultiSelectTagTemplateDirective, "ng-template[monaMultiSelectTagTemplate]", never, {}, {}, never, never, true, never>;
+}
+
+export { MultiSelectComponent, MultiSelectSummaryTagDirective, MultiSelectSummaryTagTemplateDirective, MultiSelectTagTemplateDirective };
+export type { MultiSelectVariantProps };

package/types/nanahoshi-mona-ui-notification.d.ts

@@ -0,0 +1,106 @@
+import * as i0 from '@angular/core';
+import { ViewContainerRef, TemplateRef, Type, ComponentRef } from '@angular/core';
+import { Observable } from 'rxjs';
+
+/**
+ * @description The screen position a notification container is anchored to.
+ */
+type NotificationPosition = "bottom" | "bottomleft" | "bottomright" | "top" | "topleft" | "topright";
+
+/**
+ * @description The semantic type of a notification, controlling its icon, color, and accessibility announcement urgency.
+ */
+type NotificationType = "error" | "info" | "success" | "warning";
+
+interface NotificationOptions {
+    /**
+     * @description The container to append the notification's container to. Defaults to `document.body` when omitted.
+     */
+    appendTo?: ViewContainerRef;
+    /**
+     * @description Whether a close button is rendered on the notification.
+     * @default true when `duration` is not set, otherwise `false`
+     */
+    closable?: boolean;
+    /**
+     * @description The accessible title/tooltip for the close button.
+     * @default "Close"
+     */
+    closeTitle?: string;
+    /**
+     * @description The notification's content. Accepts plain text, a `TemplateRef`, or a component `Type` to render.
+     */
+    content: string | TemplateRef<unknown> | Type<unknown>;
+    /**
+     * @description The time, in milliseconds, before the notification automatically closes. Omit to keep the notification open until manually closed.
+     */
+    duration?: number;
+    /**
+     * @description The notification's height. A number is treated as pixels.
+     */
+    height?: number | string;
+    /**
+     * @description A unique identifier for the notification. Reusing an `id` for the same `position` returns the existing notification instead of creating a new one.
+     * @default a generated UUID
+     */
+    id?: string;
+    /**
+     * @description The screen position the notification is anchored to.
+     * @default "topright"
+     */
+    position?: NotificationPosition;
+    /**
+     * @description Whether a countdown progress bar is displayed for a timed (`duration`) notification.
+     */
+    progressBar?: boolean;
+    /**
+     * @description The notification's title.
+     * @default a title derived from `type` (e.g. "Info", "Success", "Warning", "Error")
+     */
+    title?: string;
+    /**
+     * @description The notification's semantic type, controlling its icon, color, and accessibility announcement urgency.
+     * @default "info"
+     */
+    type?: NotificationType;
+    /**
+     * @description The notification's width. A number is treated as pixels.
+     */
+    width?: number | string;
+}
+
+interface NotificationRef {
+    /**
+     * @description Emits once the notification has finished closing and been removed.
+     */
+    readonly afterHide: Observable<void>;
+    /**
+     * @description The dynamically created content component's reference, or `null` when the notification's content is a string or `TemplateRef`, or before the component has been created.
+     */
+    readonly content: ComponentRef<unknown> | null;
+    /**
+     * @description Closes the notification.
+     */
+    hide(): void;
+}
+
+declare class NotificationService {
+    #private;
+    private notificationContainerMap;
+    private notificationContainerSubscriptions;
+    constructor();
+    hide(id: string): void;
+    hideAll(): void;
+    show(options: NotificationOptions): NotificationRef;
+    private createContainerComponent;
+    private createNotification;
+    private createNotificationContainer;
+    private getNotificationDataById;
+    private initialize;
+    private removeNotificationData;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NotificationService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<NotificationService>;
+}
+
+export { NotificationService };
+export type { NotificationOptions, NotificationPosition, NotificationRef, NotificationType };

package/types/nanahoshi-mona-ui-numeric-text-box.d.ts

@@ -0,0 +1,161 @@
+import * as _angular_core from '@angular/core';
+import { Signal, TemplateRef, ElementRef } from '@angular/core';
+import { FormValueControl } from '@angular/forms/signals';
+import { VariantInputs, Action } from '@nanahoshi/mona-ui/internal';
+import { Subject } from 'rxjs';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { ThemeStyle } from '@nanahoshi/mona-ui/theme';
+import { VariantProps } from 'class-variance-authority';
+
+declare const numericTextboxThemeVariants: (theme: ThemeStyle) => (props?: ({
+    rounded?: "full" | "large" | "medium" | "none" | "small" | null | undefined;
+    size?: "large" | "medium" | "small" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type NumericTextboxVariantProps = VariantProps<ReturnType<typeof numericTextboxThemeVariants>>;
+type NumericTextboxVariantInputs = VariantInputs<NumericTextboxVariantProps>;
+
+type Sign = "-" | "+";
+declare class NumericTextBoxComponent implements NumericTextboxVariantInputs, FormValueControl<number | null> {
+    #private;
+    protected readonly beforeInput$: Subject<InputEvent>;
+    protected readonly classes: Signal<string>;
+    protected readonly inputClasses: Signal<string>;
+    protected readonly focused: _angular_core.WritableSignal<boolean>;
+    protected readonly formattedValue: Signal<string>;
+    protected readonly invalidInput: Signal<boolean>;
+    protected readonly keydown$: Subject<KeyboardEvent>;
+    protected readonly rawInputValue: _angular_core.WritableSignal<string>;
+    protected readonly spinButtonClasses: Signal<string>;
+    protected readonly spinButtonIconSize: Signal<20 | 16 | 14>;
+    protected readonly spin$: Subject<Sign>;
+    protected readonly spinStop$: Subject<void>;
+    protected readonly prefixTemplateList: Signal<readonly TemplateRef<any>[]>;
+    protected readonly valueChange$: Subject<string>;
+    protected readonly valueTextBoxRef: Signal<ElementRef<HTMLInputElement>>;
+    protected readonly wheel$: Subject<WheelEvent>;
+    /**
+     * @description ARIA label for the input.
+     */
+    readonly ariaLabel: _angular_core.InputSignal<string | null>;
+    /**
+     * @description Number of decimals to show.
+     * @default 0
+     */
+    readonly decimals: _angular_core.InputSignal<number>;
+    /**
+     * @description Sets whether the input is disabled.
+     */
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Formats the value to be displayed in the input when the input is not focused.
+     */
+    readonly formatter: _angular_core.InputSignal<Action<number | null, string> | null>;
+    /**
+     * @description Emits when the inner input element is blurred.
+     */
+    readonly inputBlur: _angular_core.OutputEmitterRef<FocusEvent>;
+    /**
+     * @description Emits when the inner input element is focused.
+     */
+    readonly inputFocus: _angular_core.OutputEmitterRef<FocusEvent>;
+    /**
+     * @description Emits when the inner input element loses focus.
+     */
+    readonly inputFocusOut: _angular_core.OutputEmitterRef<FocusEvent>;
+    /**
+     * @description Maximum value that can be entered.
+     */
+    readonly maxValue: _angular_core.InputSignal<number | null>;
+    /**
+     * @description Minimum value that can be entered.
+     */
+    readonly minValue: _angular_core.InputSignal<number | null>;
+    /**
+     * @description Sets whether the input can be empty.
+     */
+    readonly nullable: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Sets whether the input is readonly.
+     */
+    readonly readonly: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Sets whether the input is required.
+     */
+    readonly required: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Marks the numeric text box as invalid. When bound to a signal form field via `[formField]`,
+     * this is written by the `FormField` directive.
+     * @default false
+     */
+    readonly invalid: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Sets the border radius of the input.
+     */
+    readonly rounded: _angular_core.InputSignal<"full" | "large" | "medium" | "none" | "small" | null | undefined>;
+    /**
+     * @description Sets the size of the input.
+     */
+    readonly size: _angular_core.InputSignal<"large" | "medium" | "small" | null | undefined>;
+    /**
+     * @description Sets whether the spin buttons are visible.
+     */
+    readonly spinners: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Step value to increment or decrement the value.
+     */
+    readonly step: _angular_core.InputSignal<number>;
+    /**
+     * @description Tab index of the input.
+     */
+    readonly tabindex: _angular_core.InputSignal<number>;
+    /**
+     * @description Emitted when the numeric text box is interacted with on blur, value change, or spinner update.
+     * The `FormField` directive listens to this to mark the field as touched.
+     */
+    readonly touch: _angular_core.OutputEmitterRef<void>;
+    /**
+     * @description Sets the touched state of the numeric text box. When bound to a signal form field via `[formField]`,
+     * this is written by the `FormField` directive.
+     * @default false
+     */
+    readonly touched: _angular_core.InputSignal<boolean>;
+    /**
+     * @description Additional CSS classes merged onto the host element via `tailwind-merge`.
+     * @default ""
+     */
+    readonly userClass: _angular_core.InputSignal<string>;
+    /**
+     * @description Two-way bindable current value of the numeric text box.
+     * @default null
+     */
+    readonly value: _angular_core.ModelSignal<number | null>;
+    constructor();
+    private static calculate;
+    private static getPrecision;
+    private static isNumeric;
+    decrease(): void;
+    focus(): void;
+    increase(): void;
+    onBlur(event: FocusEvent): void;
+    private correctValue;
+    private formatValueForDisplay;
+    protected applyRawValue(text: string): void;
+    private setBeforeInputSubscription;
+    private setInputFocusSubscription;
+    private setKeydownSubscription;
+    private setSpinSubscription;
+    private setSubscriptions;
+    private setValueChangeSubscription;
+    private setWheelSubscription;
+    private parseValue;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NumericTextBoxComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NumericTextBoxComponent, "mona-numeric-text-box", never, { "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "decimals": { "alias": "decimals"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "formatter": { "alias": "formatter"; "required": false; "isSignal": true; }; "maxValue": { "alias": "maxValue"; "required": false; "isSignal": true; }; "minValue": { "alias": "minValue"; "required": false; "isSignal": true; }; "nullable": { "alias": "nullable"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "rounded": { "alias": "rounded"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "spinners": { "alias": "spinners"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "tabindex": { "alias": "tabindex"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "inputBlur": "inputBlur"; "inputFocus": "inputFocus"; "inputFocusOut": "inputFocusOut"; "touch": "touch"; "value": "valueChange"; }, ["prefixTemplateList"], never, true, never>;
+}
+
+declare class NumericTextBoxPrefixTemplateDirective {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NumericTextBoxPrefixTemplateDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NumericTextBoxPrefixTemplateDirective, "ng-template[monaNumericTextBoxPrefixTemplate]", never, {}, {}, never, never, true, never>;
+}
+
+export { NumericTextBoxComponent, NumericTextBoxPrefixTemplateDirective };
+export type { NumericTextboxVariantProps };