@cute-widgets/base 20.0.1

package/abstract/index.d.ts

@@ -0,0 +1,327 @@
+import * as i0 from '@angular/core';
+import { ElementRef, InjectionToken, OnInit, AfterViewInit, AfterContentInit, OnChanges, OnDestroy, ChangeDetectorRef, Renderer2, SimpleChanges, Signal, EventEmitter } from '@angular/core';
+import { BooleanInput } from '@angular/cdk/coercion';
+import { Observable, Subject } from 'rxjs';
+import { RichThemeColor, LayoutBreakpoint } from '@cute-widgets/base/core';
+import { FocusableOption, ListKeyManagerOption, FocusMonitor, FocusOrigin } from '@angular/cdk/a11y';
+import { ControlValueAccessor } from '@angular/forms';
+import { BreakpointObserver, BreakpointState } from '@angular/cdk/layout';
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ */
+
+interface ThematicControl {
+    /** Theme color palette for the component. */
+    color: RichThemeColor | undefined;
+    /** Adds a linear gradient as background image to the backgrounds. */
+    gradientFill: boolean;
+    /** Default color to fall back to if no value is set. */
+    defaultColor: RichThemeColor | undefined;
+}
+interface CuteWidget extends ThematicControl {
+    id: string | undefined;
+    role: string | undefined;
+    element: Readonly<ElementRef<HTMLElement>>;
+    owner: CuteWidget | null;
+    disabled: boolean;
+    tag: any;
+    enable(): void;
+    disable(): void;
+    toggleDisabled(): void;
+    hasClass(name: string): boolean;
+    toggleClass(name: string, force?: boolean): boolean;
+    getAttribute(name: string): string | null;
+    setAttribute(name: string, value: string, namespace?: string | null | undefined): void;
+    hasAttributes(...attributes: string[]): boolean;
+    markForCheck(): void;
+}
+/** Widget's injection token */
+declare const CUTE_WIDGET: InjectionToken<CuteWidget>;
+/**
+ * This widget base class and each of its descendant should be used as a parent for classes decorated with `@Component`.
+ * Attribute directives should not extend this class and its descendants to avoid property value conflicts.
+ */
+declare abstract class CuteBaseControl implements CuteWidget, OnInit, AfterViewInit, AfterContentInit, OnChanges, OnDestroy {
+    private readonly _uniqueId;
+    protected readonly _elementRef: ElementRef<HTMLElement>;
+    protected readonly _changeDetectorRef: ChangeDetectorRef;
+    protected readonly _renderer: Renderer2;
+    /** Owner widget */
+    readonly owner: CuteWidget | null;
+    /**
+     * A list of subscribers that subscribed before the directive was initialized.
+     * Should be notified during markInitialized.
+     * Set to null after pending subscribers are notified, and should
+     * not expect to be populated after.
+     */
+    private _pendingSubscribers;
+    protected get _nativeElement(): HTMLElement;
+    /**
+     * Marks the state as initialized and notifies pending subscribers. Should be called at the end
+     * of ngOnInit.
+     */
+    protected _markInitialized(): void;
+    /** Emits and completes the subscriber stream (should only emit once). */
+    private _notifySubscriber;
+    /**
+     * Observable stream that emits when the directive initializes. If already initialized, the
+     * subscriber is stored to be notified once _markInitialized is called.
+     */
+    readonly initialized$: Observable<void>;
+    /** Whether this directive has been marked as initialized. */
+    get isInitialized(): boolean;
+    private _isInitialized;
+    /** Gets a reference to the `ElementRef` object */
+    get element(): Readonly<ElementRef<HTMLElement>>;
+    /** The element's identifier */
+    get id(): string | undefined;
+    set id(value: string | undefined);
+    private _id;
+    /** Default color, which is set when no value is set to the `color` property */
+    defaultColor: RichThemeColor | undefined;
+    /** Theme color palette for the component. */
+    get color(): RichThemeColor | undefined;
+    set color(value: RichThemeColor | undefined);
+    private _color;
+    /** Adds a linear gradient as a background image to the backgrounds */
+    gradientFill: boolean;
+    /**
+     * Makes the host element not mutable, focusable, or even submitted with the form
+     */
+    get disabled(): boolean;
+    set disabled(value: BooleanInput);
+    private _disabled;
+    /**
+     * Attached to the aria-label attribute of the host element.In most cases, aria-labelledby will
+     * take precedence so this may be omitted.
+     */
+    ariaLabel: string | null;
+    /**
+     * Users can specify the `aria-labelledby` attribute which will be forwarded to the input element
+     */
+    ariaLabelledby: string | null;
+    /**
+     * The 'aria-describedby' attribute is read after the element's label and field type.
+     */
+    ariaDescribedby: string | null;
+    /**
+     * The 'aria-description' attribute for the content of the element.
+     */
+    ariaDescription: string | null;
+    /**
+     * Provides semantic meaning to content, allowing screen readers and other tools to present and
+     * support interaction with an object
+     */
+    get role(): string | undefined;
+    set role(value: string | undefined);
+    private _role;
+    /** Any arbitrary user data */
+    tag: any;
+    /** Returns the unique id for the visual hidden input control */
+    protected get inputId(): string;
+    protected constructor();
+    /**
+     * Sets the type of mouse cursor using a keyword, or load a specific icon to use.
+     * @param cursor A mouse cursor keyword or icon
+     * @returns The current mouse cursor
+     */
+    /**
+     * Whether the option is disabled. Can be overridden in descendant classes
+     * @returns Current disabled state
+     */
+    protected getDisabledState(): boolean;
+    /**
+     * Changes the `disabled` status of the component. Can be overridden in descendant classes
+     * @param newState New boolean for `disabled` state
+     * @param emitEvent Emit state change event
+     * @returns Change result
+     */
+    protected setDisabledState(newState: BooleanInput, emitEvent?: boolean): boolean;
+    /**
+     * Sets a new color value. Can be overridden in descendant classes.
+     * @param value New `ThemeColor` value
+     * @returns Old color value
+     */
+    protected setColor(value: RichThemeColor | undefined): RichThemeColor | undefined;
+    /**
+     * Returns an element's unique identifier that, if not empty, is assigned to `id` property as a default value.
+     * Must be overridden in the descendant classes.
+     * @abstract
+     */
+    protected abstract generateId(): string;
+    /** Returns the root owner widget if it exists */
+    getRootOwner(): CuteWidget | null;
+    /** Sets a property on a target element using the current Renderer implementation. */
+    setProperty(key: string, value: unknown): void;
+    /** Returns the value of a specified attribute on the component's host element. */
+    getAttribute(name: string): string | null;
+    /** Sets the value of an attribute on the component's host element */
+    setAttribute(name: string, value: string, namespace?: string | null | undefined): void;
+    /** Gets whether the component has one of the given attributes. */
+    hasAttributes(...attributes: string[]): boolean;
+    /** Adds a class to an element in the DOM. */
+    addClass(name: string): void;
+    /** Removes a class from an element in the DOM. */
+    removeClass(name: string): void;
+    /** Returns a boolean value — _true_ if the element's class list contains the given token, otherwise _false_. */
+    hasClass(name: string): boolean;
+    /**
+     * Adds a CSS class if it is not in the element's class list, otherwise remove it
+     * @param name CSS class name
+     * @param force If included, turns the toggle into a one way-only operation. If set to _false_, then the class name will only be removed, but not added. If set to _true_, then the class name will only be added, but not removed.
+     */
+    toggleClass(name: string, force?: boolean): boolean;
+    /**
+     * Returns a boolean value indicating whether a _node_ is a descendant of the current node
+     * @param node HTML element reference to test
+     * @returns A boolean value that is `true` if _node_ is contained in the current node, `false` if not.
+     * If the _node_ parameter is `null`, contains() always returns `false`.
+     */
+    contains(node: HTMLElement): boolean;
+    /** Enables the user interaction */
+    enable(): void;
+    /** Disables the user interaction */
+    disable(): void;
+    /** Explicitly marks the view as changed so that it can be checked again. */
+    markForCheck(): void;
+    /** Toggles the `disabled` state of the component */
+    toggleDisabled(): void;
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    ngAfterContentInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteBaseControl, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteBaseControl, never, never, { "id": { "alias": "id"; "required": false; }; "defaultColor": { "alias": "defaultColor"; "required": false; }; "color": { "alias": "color"; "required": false; }; "gradientFill": { "alias": "gradientFill"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "ariaLabel": { "alias": "aria-label"; "required": false; }; "ariaLabelledby": { "alias": "aria-labelledby"; "required": false; }; "ariaDescribedby": { "alias": "aria-describedby"; "required": false; }; "ariaDescription": { "alias": "aria-description"; "required": false; }; "role": { "alias": "role"; "required": false; }; "tag": { "alias": "tag"; "required": false; }; }, {}, never, never, true, never>;
+    static ngAcceptInputType_gradientFill: unknown;
+    static ngAcceptInputType_disabled: unknown;
+}
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ */
+
+interface Expandable {
+    open(): void;
+    close(): void;
+    toggle(): void;
+    expanded: boolean | Signal<boolean>;
+}
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ */
+
+declare abstract class CuteFocusableControl extends CuteBaseControl implements FocusableOption, ListKeyManagerOption {
+    protected readonly _focusMonitor: FocusMonitor;
+    /**
+     * Allows making HTML elements un/focusable (usually with the Tab key, hence the name) and
+     * determines their relative ordering for sequential focus navigation.
+     */
+    get tabIndex(): number | undefined;
+    set tabIndex(value: number | undefined);
+    private _tabIndex;
+    tabIndexChange: EventEmitter<void>;
+    protected constructor();
+    /** Set focus on this component */
+    focus(origin?: FocusOrigin, options?: FocusOptions): void;
+    /** Gets the current label of the component. Part of `ListKeyManagerOption` interface. */
+    getLabel(): string;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteFocusableControl, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteFocusableControl, never, never, { "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "tabIndexChange": "tabIndexChange"; }, never, never, true, never>;
+    static ngAcceptInputType_tabIndex: unknown;
+}
+
+declare abstract class CuteInputControl extends CuteFocusableControl implements ControlValueAccessor {
+    private _isTouched;
+    /**
+     * Emits whenever the component state changes and should cause the parent
+     * form-field to update. Implemented as part of `CuteFormFieldControl`.
+     */
+    readonly stateChanges: Subject<void>;
+    protected _onChange: (value: unknown) => void;
+    protected _onTouched: Function;
+    /** The value attribute of the native input element */
+    abstract value: any;
+    /** Name value will be applied to the input element if present */
+    name: string | null;
+    /** Whether the element's value input is required. */
+    get required(): boolean;
+    set required(newValue: BooleanInput);
+    private _required;
+    get id(): string | undefined;
+    set id(value: string | undefined);
+    protected constructor();
+    registerOnChange(fn: (value: any) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: BooleanInput, emitEvent?: boolean): boolean;
+    abstract writeValue(obj: any): void;
+    /**
+     * Mark widget gets a touched state
+     * @protected
+     */
+    protected markAsTouched(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteInputControl, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteInputControl, never, never, { "name": { "alias": "name"; "required": false; }; "required": { "alias": "required"; "required": false; }; }, {}, never, never, true, never>;
+    static ngAcceptInputType_required: unknown;
+}
+
+declare abstract class CuteInputDropdownControl extends CuteInputControl implements Expandable {
+    withShadow: boolean;
+    protected constructor();
+    /** Expandable interface */
+    abstract open(): void;
+    abstract close(): void;
+    abstract toggle(): void;
+    abstract get expanded(): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteInputDropdownControl, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteInputDropdownControl, never, never, { "withShadow": { "alias": "withShadow"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ */
+
+declare abstract class CuteLayoutControl extends CuteBaseControl {
+    protected breakpointObserver: BreakpointObserver;
+    private _subscription;
+    /** Returns CSS-class list */
+    protected get classList(): string;
+    /** Clears floated content within a container */
+    clearfix: boolean;
+    /** Symbolic name of the screen minimum width which determines how the responsive layout behaves across device or viewport sizes. */
+    breakpoint: LayoutBreakpoint | undefined;
+    /** Event that is raised when the width of viewport is changed and crosses the size of `breakpoint`'s value. */
+    breakpointState: EventEmitter<BreakpointState>;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteLayoutControl, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteLayoutControl, never, never, { "clearfix": { "alias": "clearfix"; "required": false; }; "breakpoint": { "alias": "breakpoint"; "required": false; }; }, { "breakpointState": "breakpointState"; }, never, never, true, never>;
+    static ngAcceptInputType_clearfix: unknown;
+}
+
+export { CUTE_WIDGET, CuteBaseControl, CuteFocusableControl, CuteInputControl, CuteInputDropdownControl, CuteLayoutControl };
+export type { CuteWidget, Expandable, ThematicControl };

package/alert/index.d.ts

@@ -0,0 +1,68 @@
+import * as i0 from '@angular/core';
+import { EventEmitter } from '@angular/core';
+import { CuteBaseControl } from '@cute-widgets/base/abstract';
+import * as i1 from '@angular/common';
+
+/**
+ * @license Apache-2.0
+ *
+ * Copyright (c) 2025 CuteWidgets Team. All Rights Reserved.
+ *
+ * You may not use this file except in compliance with the License
+ * that can be found at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * This code is a modification of the `@angular/material` original
+ * code licensed under MIT-style License (https://angular.dev/license).
+ */
+
+/** Alert dismiss origin. */
+type AlertDismissOrigin = "program" | "user" | "timer";
+/**
+ * Provide contextual feedback messages for typical user actions with the handful of available and flexible
+ * alert messages.
+ */
+declare class CuteAlert extends CuteBaseControl {
+    private _dismissed;
+    private _dismissTimer;
+    /** Whether the alert can be dismissed interactively. */
+    dismissible: boolean;
+    /** The time period in milliseconds after which the alert message is automatically dismissed. */
+    get duration(): number;
+    set duration(ms: number);
+    private _duration;
+    /** Whether the alert has been dismissed. */
+    get isDismissed(): boolean;
+    /** Event emitted when the alert is dismissed. */
+    dismissed: EventEmitter<AlertDismissOrigin>;
+    constructor();
+    protected generateId(): string;
+    /** Show alert. */
+    show(): void;
+    /** Dismiss the alert. */
+    hide(): void;
+    /**
+     * Hide the alert from screen.
+     * @param origin - Dismiss origin.
+     */
+    protected dismiss(origin?: AlertDismissOrigin): void;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteAlert, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CuteAlert, "cute-alert", ["cuteAlert"], { "dismissible": { "alias": "dismissible"; "required": false; }; "duration": { "alias": "duration"; "required": false; }; }, { "dismissed": "dismissed"; }, never, ["*"], true, never>;
+    static ngAcceptInputType_dismissible: unknown;
+    static ngAcceptInputType_duration: unknown;
+}
+
+declare class CuteAlertHeading {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteAlertHeading, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CuteAlertHeading, "[cuteAlertHeading]", ["cuteAlertHeading"], {}, {}, never, never, true, never>;
+}
+
+declare class CuteAlertModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CuteAlertModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CuteAlertModule, never, [typeof i1.CommonModule, typeof CuteAlert, typeof CuteAlertHeading], [typeof CuteAlert, typeof CuteAlertHeading]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<CuteAlertModule>;
+}
+
+export { CuteAlert, CuteAlertHeading, CuteAlertModule };
+export type { AlertDismissOrigin };