@semantic-components/ui 0.11.0 → 0.12.0

package/index.d.ts

@@ -46,3 +46,4 @@ export * from './lib/components/command';
 export * from './lib/components/collapsible';
 export * from './lib/components/sidebar';
 export * from './lib/components/autocomplete';
+export * from './lib/components/time-picker';

package/lib/components/calendar/calendar.d.ts

@@ -1,24 +1,33 @@
 import { OnInit } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
 import { WeekDayName } from './util';
 import * as i0 from "@angular/core";
-export declare class ScCalendar implements OnInit {
+export declare class ScCalendar implements OnInit, ControlValueAccessor {
+    private readonly _cdr;
     class: import("@angular/core").InputSignal<string>;
     classes: import("@angular/core").Signal<string>;
     private readonly localeId;
+    date: import("@angular/core").Signal<Date>;
     year: import("@angular/core").WritableSignal<number>;
     month: import("@angular/core").WritableSignal<number>;
     weekDaysNames: import("@angular/core").WritableSignal<WeekDayName[]>;
     monthYear: import("@angular/core").Signal<string>;
     monthDays: import("@angular/core").Signal<string[]>;
     firstDayMonth: import("@angular/core").Signal<number>;
-    selectedDay: import("@angular/core").WritableSignal<string>;
-    ngOnInit(): void;
-    init(): void;
+    value: import("@angular/core").ModelSignal<string>;
     setSelectedDay(day: string): void;
+    _onChange: (value: string) => void;
+    _onTouched: () => void;
+    writeValue(value: string): void;
+    registerOnChange(fn: (value: string) => void): void;
+    registerOnTouched(fn: () => void): void;
+    private readonly _disabledByCva;
+    setDisabledState?(isDisabled: boolean): void;
+    ngOnInit(): void;
     private setLocaleDayNames;
     private getFirstDayOfWeek;
     setMonthYear(n: number): void;
     twoDigits(n: number): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<ScCalendar, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ScCalendar, "sc-calendar", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScCalendar, "sc-calendar", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
 }

package/lib/components/date-picker/date-input.d.ts

@@ -0,0 +1,9 @@
+import * as i0 from "@angular/core";
+export declare class ScDateInput {
+    private readonly el;
+    private readonly dateFormatRegExp;
+    previousKey: string;
+    onKeyDown(event: KeyboardEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScDateInput, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ScDateInput, "[scDateInput]", never, {}, {}, never, never, true, never>;
+}

package/lib/components/date-picker/date-picker.d.ts

@@ -1,13 +1,9 @@
-import { OnInit, OutputEmitterRef } from '@angular/core';
+import { OutputEmitterRef } from '@angular/core';
 import * as i0 from "@angular/core";
-export declare class ScDatePicker implements OnInit {
+export declare class ScDatePicker {
     class: import("@angular/core").InputSignal<string>;
     classes: import("@angular/core").Signal<string>;
-    private host;
-    private readonly localeId;
-    dateFormatPattern: import("@angular/core").WritableSignal<string>;
-    ngOnInit(): void;
-    getDateFormatPattern(localeId: string): string;
+    private readonly host;
     private readonly _injector;
     private readonly _dir;
     private readonly _overlay;

package/lib/components/hover-card/hover-card-trigger-for.d.ts

@@ -1,13 +1,13 @@
 import { OnDestroy, TemplateRef } from '@angular/core';
 import * as i0 from "@angular/core";
 export declare class ScHoverCardTriggerFor implements OnDestroy {
-    private element;
-    private overlay;
-    private viewContainer;
+    private readonly element;
+    private readonly overlay;
+    private readonly viewContainer;
     readonly scHoverCardTriggerFor: import("@angular/core").InputSignal<TemplateRef<unknown>>;
     private overlayRef;
-    showTooltip(): void;
-    hideTooltip(): void;
+    showCard(): void;
+    hideCard(): void;
     ngOnDestroy(): void;
     private attachTooltip;
     private getPositionStrategy;

package/lib/components/input/input.d.ts

@@ -1,4 +1,5 @@
 import * as i0 from "@angular/core";
+export declare const scInputStyles: import("@angular/core").WritableSignal<string>;
 export declare class ScInput {
     class: import("@angular/core").InputSignal<string>;
     classes: import("@angular/core").Signal<string>;

package/lib/components/sidebar/sidebar.d.ts

@@ -1,8 +1,7 @@
-import { BreakpointObserver } from '@angular/cdk/layout';
 import { ScSidebarState } from './sidebar-state';
 import * as i0 from "@angular/core";
 export declare class ScSidebar {
-    private observer;
+    private readonly observer;
     sidebarState: ScSidebarState;
     class: import("@angular/core").InputSignal<string>;
     classes: import("@angular/core").Signal<string>;
@@ -14,7 +13,7 @@ export declare class ScSidebar {
     state: import("@angular/core").Signal<"expanded" | "collapsed">;
     classes1: import("@angular/core").WritableSignal<string>;
     classes2: import("@angular/core").WritableSignal<string>;
-    constructor(observer: BreakpointObserver);
+    constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<ScSidebar, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ScSidebar, "sc-sidebar", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; "side": { "alias": "side"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }

package/lib/components/time-picker/index.d.ts

@@ -0,0 +1 @@
+export * from './time-picker';

package/lib/components/time-picker/time-option.d.ts

@@ -0,0 +1,28 @@
+import { Highlightable } from '@angular/cdk/a11y';
+import * as i0 from "@angular/core";
+export declare class ScTimeOption implements Highlightable {
+    /** The unique ID of the option. */
+    id: import("@angular/core").WritableSignal<string>;
+    class: import("@angular/core").InputSignal<string>;
+    _class: import("@angular/core").Signal<string>;
+    _active: import("@angular/core").WritableSignal<boolean>;
+    _selected: import("@angular/core").WritableSignal<boolean>;
+    readonly _disabledByInput: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    readonly _disabled: import("@angular/core").Signal<boolean>;
+    value: import("@angular/core").InputSignal<string | undefined>;
+    setActiveStyles(): void;
+    setInactiveStyles(): void;
+    disabled: boolean | undefined;
+    getLabel?(): string;
+    private readonly _element;
+    /** Gets the host DOM element. */
+    _getHostElement(): HTMLElement;
+    /** Selects the option. */
+    select(): void;
+    /** Deselects the option. */
+    deselect(): void;
+    onClick(): void;
+    selected: import("@angular/core").OutputEmitterRef<string | undefined>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScTimeOption, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScTimeOption, "sc-time-option", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; "_disabledByInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "selected": "selected"; }, never, ["*"], true, never>;
+}

package/lib/components/time-picker/time-picker-input.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+export declare class ScTimePickerInput {
+    class: import("@angular/core").InputSignal<string>;
+    classes: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScTimePickerInput, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ScTimePickerInput, "[scTimePickerInput]", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/lib/components/time-picker/time-picker.d.ts

@@ -0,0 +1,97 @@
+import { InputSignal, OnDestroy, OutputEmitterRef, Signal, TemplateRef } from '@angular/core';
+import { ScTimeOption } from './time-option';
+import * as i0 from "@angular/core";
+/**
+ * Time selection option that can be displayed within a `mat-timepicker`.
+ */
+export interface MatTimepickerOption<D = unknown> {
+    /** Date value of the option. */
+    value: D;
+    /** Label to show to the user. */
+    label: string;
+}
+/** Event emitted when a value is selected in the timepicker. */
+export interface MatTimepickerSelected<D> {
+    value: D;
+}
+export declare class ScTimePicker implements OnDestroy {
+    class: InputSignal<string>;
+    classes: Signal<string>;
+    private readonly _overlay;
+    private readonly _dir;
+    private readonly _viewContainerRef;
+    private readonly _injector;
+    private readonly _isOpen;
+    private readonly _activeDescendant;
+    private readonly _input;
+    private _overlayRef;
+    private _portal;
+    private readonly _optionsCacheKey;
+    private readonly _localeChanges;
+    private _onOpenRender;
+    protected _panelTemplate: Signal<TemplateRef<unknown>>;
+    protected _timeOptions: readonly MatTimepickerOption<string>[];
+    protected _options: Signal<readonly ScTimeOption[]>;
+    private readonly _keyManager;
+    /**
+     * Interval between each option in the timepicker. The value can either be an amount of
+     * seconds (e.g. 90) or a number with a unit (e.g. 45m). Supported units are `s` for seconds,
+     * `m` for minutes or `h` for hours.
+     */
+    /**
+     * Array of pre-defined options that the user can select from, as an alternative to using the
+     * `interval` input. An error will be thrown if both `options` and `interval` are specified.
+     */
+    readonly options: InputSignal<readonly MatTimepickerOption<string>[] | null>;
+    /** Whether the timepicker is open. */
+    readonly isOpen: Signal<boolean>;
+    /** Emits when the user selects a time. */
+    readonly selected: OutputEmitterRef<MatTimepickerSelected<string>>;
+    /** Emits when the timepicker is opened. */
+    readonly opened: OutputEmitterRef<void>;
+    /** Emits when the timepicker is closed. */
+    readonly closed: OutputEmitterRef<void>;
+    /** ID of the active descendant option. */
+    readonly activeDescendant: Signal<string | null>;
+    /** Unique ID of the timepicker's panel */
+    readonly panelId: string;
+    /** Whether ripples within the timepicker should be disabled. */
+    /** ARIA label for the timepicker panel. */
+    readonly ariaLabel: InputSignal<string | null>;
+    /** ID of the label element for the timepicker panel. */
+    readonly ariaLabelledby: InputSignal<string | null>;
+    /** Whether the timepicker is currently disabled. */
+    readonly disabled: Signal<boolean>;
+    constructor();
+    /** Opens the timepicker. */
+    open(): void;
+    /** Closes the timepicker. */
+    close(): void;
+    /** Registers an input with the timepicker. */
+    ngOnDestroy(): void;
+    /** Selects a specific time value. */
+    protected _selectValue(value: string): void;
+    /** Gets the value of the `aria-labelledby` attribute. */
+    protected _getAriaLabelledby(): string | null;
+    /** Creates an overlay reference for the timepicker panel. */
+    private _getOverlayRef;
+    /** Generates the list of options from which the user can select.. */
+    private _generateOptions;
+    /**
+     * Synchronizes the internal state of the component based on a specific selected date.
+     * @param value Currently selected date.
+     * @param options Options rendered out in the timepicker.
+     * @param fallback Option to set as active if no option is selected.
+     */
+    private _syncSelectedState;
+    /** Handles keyboard events while the overlay is open. */
+    private _handleKeydown;
+    /** Sets up the logic that updates the timepicker when the locale changes. */
+    private _handleLocaleChanges;
+    /**
+     * Sets up the logic that updates the timepicker when the state of the connected input changes.
+     */
+    private _handleInputStateChanges;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScTimePicker, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScTimePicker, "sc-time-picker", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "ariaLabelledby": { "alias": "aria-labelledby"; "required": false; "isSignal": true; }; }, { "selected": "selected"; "opened": "opened"; "closed": "closed"; }, never, never, true, never>;
+}

package/lib/utils/css.d.ts

@@ -0,0 +1,2 @@
+import { type ClassValue } from 'clsx';
+export declare function cn(...inputs: ClassValue[]): string;

package/lib/utils/index.d.ts

@@ -1,2 +1,2 @@
-import { type ClassValue } from 'clsx';
-export declare function cn(...inputs: ClassValue[]): string;
+export * from './css';
+export * from './settings';

package/lib/utils/settings.d.ts

@@ -0,0 +1,9 @@
+import * as i0 from "@angular/core";
+export declare class ScSettings {
+    dateFormatPattern: import("@angular/core").WritableSignal<string>;
+    private readonly localeId;
+    constructor();
+    getDateFormatPattern(localeId: string): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScSettings, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ScSettings>;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@semantic-components/ui",
-  "version": "0.11.0",
+  "version": "0.12.0",
   "private": false,
   "publishConfig": {
     "access": "public"