@brickclay-org/ui 0.0.1

package/index.d.ts

@@ -0,0 +1,343 @@
+import * as i0 from '@angular/core';
+import { OnInit, OnDestroy, OnChanges, EventEmitter, SimpleChanges, AfterViewInit, QueryList, ElementRef } from '@angular/core';
+import * as rxjs from 'rxjs';
+import * as i1 from '@angular/common';
+
+declare class BrickclayLib {
+    static ɵfac: i0.ɵɵFactoryDeclaration<BrickclayLib, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BrickclayLib, "lib-brickclay-lib", never, {}, {}, never, never, true, never>;
+}
+
+declare class CalendarManagerService {
+    private calendarInstances;
+    private closeAllSubject;
+    closeAll$: rxjs.Observable<void>;
+    /**
+     * Register a calendar instance with its close function
+     */
+    register(closeFn: () => void): () => void;
+    /**
+     * Close all calendars except the one being opened
+     */
+    closeAllExcept(exceptCloseFn: () => void): void;
+    /**
+     * Close all calendars
+     */
+    closeAll(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CalendarManagerService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<CalendarManagerService>;
+}
+
+interface CalendarRange {
+    start: Date;
+    end: Date;
+}
+interface CalendarSelection {
+    startDate: Date | null;
+    endDate: Date | null;
+    selectedDates?: Date[];
+}
+declare class CustomCalendarComponent implements OnInit, OnDestroy, OnChanges {
+    private calendarManager;
+    enableTimepicker: boolean;
+    autoApply: boolean;
+    closeOnAutoApply: boolean;
+    showCancel: boolean;
+    linkedCalendars: boolean;
+    singleDatePicker: boolean;
+    showWeekNumbers: boolean;
+    showISOWeekNumbers: boolean;
+    customRangeDirection: boolean;
+    lockStartDate: boolean;
+    position: 'center' | 'left' | 'right';
+    drop: 'up' | 'down';
+    dualCalendar: boolean;
+    showRanges: boolean;
+    timeFormat: 12 | 24;
+    enableSeconds: boolean;
+    customRanges?: Record<string, CalendarRange>;
+    multiDateSelection: boolean;
+    maxDate?: Date;
+    minDate?: Date;
+    placeholder: string;
+    opens: 'left' | 'right' | 'center';
+    inline: boolean;
+    isDisplayCrossIcon: boolean;
+    selected: EventEmitter<CalendarSelection>;
+    opened: EventEmitter<void>;
+    closed: EventEmitter<void>;
+    /**
+     * External value passed from parent. If provided, component will select these dates on init / change.
+     * Accepts { startDate: Date|null, endDate: Date|null, selectedDates?: Date[] }
+     */
+    selectedValue: CalendarSelection | null;
+    /** Optional display format for the input value. Uses moment formatting tokens. */
+    displayFormat: string;
+    show: boolean;
+    today: Date;
+    month: number;
+    year: number;
+    calendar: {
+        day: number;
+        currentMonth: boolean;
+    }[][];
+    leftMonth: number;
+    leftYear: number;
+    rightMonth: number;
+    rightYear: number;
+    leftCalendar: {
+        day: number;
+        currentMonth: boolean;
+    }[][];
+    rightCalendar: {
+        day: number;
+        currentMonth: boolean;
+    }[][];
+    startDate: Date | null;
+    endDate: Date | null;
+    selectedDates: Date[];
+    disableHighlight: boolean;
+    hoveredDate: Date | null;
+    minuteInputValues: {
+        [key: string]: string;
+    };
+    selectedHour: number;
+    selectedMinute: number;
+    selectedSecond: number;
+    selectedAMPM: 'AM' | 'PM';
+    startHour: number;
+    startMinute: number;
+    startSecond: number;
+    startAMPM: 'AM' | 'PM';
+    endHour: number;
+    endMinute: number;
+    endSecond: number;
+    endAMPM: 'AM' | 'PM';
+    openTimePickerId: string | null;
+    closePickerCounter: {
+        [key: string]: number;
+    };
+    defaultRanges: Record<string, CalendarRange>;
+    activeRange: string | null;
+    rangeOrder: string[];
+    private unregisterFn?;
+    private closeAllSubscription?;
+    private closeFn?;
+    constructor(calendarManager: CalendarManagerService);
+    onClickOutside(event: MouseEvent): void;
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnDestroy(): void;
+    checkAndSetActiveRange(): void;
+    initializeDefaultRanges(): void;
+    initializeTimeFromDate(date: Date, isStart: boolean): void;
+    toggle(): void;
+    close(): void;
+    onDateHover(day: number | null, fromRight?: boolean): void;
+    onDateLeave(): void;
+    selectDate(day: number | null, fromRight?: boolean): void;
+    handleMultiDateSelection(selected: Date): void;
+    getDateString(date: Date): string;
+    isDateInMultiSelection(year: number, month: number, day: number): boolean;
+    apply(): void;
+    cancel(): void;
+    clear(): void;
+    chooseRange(key: string): void;
+    emitSelection(): void;
+    addDays(date: Date, days: number): Date;
+    generateCalendar(): void;
+    nextMonth(): void;
+    prevMonth(): void;
+    nextLeftMonth(): void;
+    prevLeftMonth(): void;
+    nextRightMonth(): void;
+    prevRightMonth(): void;
+    initializeDual(): void;
+    generateDualCalendars(): void;
+    buildCalendar(year: number, month: number): {
+        day: number;
+        currentMonth: boolean;
+    }[][];
+    isDateSelected(year: number, month: number, day: number): boolean;
+    isDateInRange(year: number, month: number, day: number): boolean;
+    isDateDisabled(year: number, month: number, day: number): boolean;
+    isToday(year: number, month: number, day: number): boolean;
+    getDisplayValue(): string;
+    getTimeInputValue(isStart?: boolean): string;
+    getSingleTimeInputValue(): string;
+    getSingleTimePickerDisplay(): string;
+    getDualTimePickerDisplay(isStart?: boolean): string;
+    onTimePickerOpened(pickerId: string): void;
+    onTimePickerClosed(pickerId: string): void;
+    shouldClosePicker(pickerId: string): number;
+    private parsePickerTimeString;
+    onSingleTimePickerChange(time: string): void;
+    onDualTimePickerChange(time: string, isStart?: boolean): void;
+    onTimeChange(event: any, isStart?: boolean): void;
+    onSingleTimeChange(event: any): void;
+    incrementHour(isStart?: boolean): void;
+    decrementHour(isStart?: boolean): void;
+    incrementMinute(isStart?: boolean): void;
+    decrementMinute(isStart?: boolean): void;
+    toggleAMPM(isStart?: boolean): void;
+    incrementSingleHour(): void;
+    decrementSingleHour(): void;
+    incrementSingleMinute(): void;
+    decrementSingleMinute(): void;
+    toggleSingleAMPM(): void;
+    getMonthName(month: number): string;
+    onHourInput(event: any, isStart?: boolean, isSingle?: boolean): void;
+    onHourBlur(event: any, isStart?: boolean, isSingle?: boolean): void;
+    onMinuteInput(event: any, isStart?: boolean, isSingle?: boolean): void;
+    onMinuteBlur(event: any, isStart?: boolean, isSingle?: boolean): void;
+    getDisplayHour(hour: number): number;
+    getMinuteDisplayValue(isStart: boolean, isSingle: boolean): string;
+    applyTimeToDate(date: Date, isStart: boolean): void;
+    onTimeInputFocus(event: any): void;
+    formatAllMinuteInputs(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CustomCalendarComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CustomCalendarComponent, "brickclay-custom-calendar", never, { "enableTimepicker": { "alias": "enableTimepicker"; "required": false; }; "autoApply": { "alias": "autoApply"; "required": false; }; "closeOnAutoApply": { "alias": "closeOnAutoApply"; "required": false; }; "showCancel": { "alias": "showCancel"; "required": false; }; "linkedCalendars": { "alias": "linkedCalendars"; "required": false; }; "singleDatePicker": { "alias": "singleDatePicker"; "required": false; }; "showWeekNumbers": { "alias": "showWeekNumbers"; "required": false; }; "showISOWeekNumbers": { "alias": "showISOWeekNumbers"; "required": false; }; "customRangeDirection": { "alias": "customRangeDirection"; "required": false; }; "lockStartDate": { "alias": "lockStartDate"; "required": false; }; "position": { "alias": "position"; "required": false; }; "drop": { "alias": "drop"; "required": false; }; "dualCalendar": { "alias": "dualCalendar"; "required": false; }; "showRanges": { "alias": "showRanges"; "required": false; }; "timeFormat": { "alias": "timeFormat"; "required": false; }; "enableSeconds": { "alias": "enableSeconds"; "required": false; }; "customRanges": { "alias": "customRanges"; "required": false; }; "multiDateSelection": { "alias": "multiDateSelection"; "required": false; }; "maxDate": { "alias": "maxDate"; "required": false; }; "minDate": { "alias": "minDate"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "opens": { "alias": "opens"; "required": false; }; "inline": { "alias": "inline"; "required": false; }; "isDisplayCrossIcon": { "alias": "isDisplayCrossIcon"; "required": false; }; "selectedValue": { "alias": "selectedValue"; "required": false; }; "displayFormat": { "alias": "displayFormat"; "required": false; }; }, { "selected": "selected"; "opened": "opened"; "closed": "closed"; }, never, never, true, never>;
+}
+
+interface TimeConfiguration {
+    date: Date;
+    allDay: boolean;
+    startTime: string;
+    endTime: string;
+}
+interface ScheduledDateSelection {
+    mode: 'single' | 'multiple' | 'range';
+    singleDate?: {
+        startDate: Date;
+        endDate: Date;
+        allDay: boolean;
+        startTime: string;
+        endTime: string;
+    };
+    multipleDates?: TimeConfiguration[];
+    dateRange?: {
+        startDate: Date;
+        endDate: Date;
+        allDay: boolean;
+        startTime: string;
+        endTime: string;
+    };
+}
+declare class ScheduledDatePickerComponent implements OnInit {
+    timeFormat: 12 | 24;
+    enableSeconds: boolean;
+    scheduled: EventEmitter<ScheduledDateSelection>;
+    cleared: EventEmitter<void>;
+    activeTab: 'single' | 'multiple' | 'range';
+    openTimePickerId: string | null;
+    closePickerCounter: {
+        [key: string]: number;
+    };
+    singleDate: Date | null;
+    singleAllDay: boolean;
+    singleStartTime: string;
+    singleEndTime: string;
+    multipleDates: TimeConfiguration[];
+    rangeStartDate: Date | null;
+    rangeEndDate: Date | null;
+    rangeAllDay: boolean;
+    rangeStartTime: string;
+    rangeEndTime: string;
+    ngOnInit(): void;
+    onTabChange(tab: 'single' | 'multiple' | 'range'): void;
+    onTimePickerOpened(pickerId: string): void;
+    onTimePickerClosed(pickerId: string): void;
+    shouldClosePicker(pickerId: string): number;
+    onSingleDateSelected(event: CalendarSelection): void;
+    onSingleAllDayChange(): void;
+    onSingleStartTimeChange(time: string): void;
+    onSingleEndTimeChange(time: string): void;
+    updateSingleDateTimes(): void;
+    onMultipleDatesSelected(event: CalendarSelection): void;
+    onMultipleDateAllDayChange(index: number): void;
+    onMultipleDateStartTimeChange(index: number, time: string): void;
+    onMultipleDateEndTimeChange(index: number, time: string): void;
+    onRangeSelected(event: CalendarSelection): void;
+    onRangeAllDayChange(): void;
+    onRangeStartTimeChange(time: string): void;
+    onRangeEndTimeChange(time: string): void;
+    updateRangeTimes(): void;
+    parseTimeString(timeStr: string): {
+        hours: number;
+        minutes: number;
+    };
+    getDateString(date: Date): string;
+    formatDate(date: Date): string;
+    emitScheduled(): void;
+    clear(): void;
+    apply(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScheduledDatePickerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScheduledDatePickerComponent, "brickclay-scheduled-date-picker", never, { "timeFormat": { "alias": "timeFormat"; "required": false; }; "enableSeconds": { "alias": "enableSeconds"; "required": false; }; }, { "scheduled": "scheduled"; "cleared": "cleared"; }, never, never, true, never>;
+}
+
+declare class TimePickerComponent implements OnInit, OnChanges, AfterViewInit {
+    value: string;
+    label: string;
+    placeholder: string;
+    position: 'left' | 'right';
+    pickerId: string;
+    closePicker: number;
+    timeFormat: 12 | 24;
+    showSeconds: boolean;
+    timeChange: EventEmitter<string>;
+    pickerOpened: EventEmitter<string>;
+    pickerClosed: EventEmitter<string>;
+    timeScrollElements: QueryList<ElementRef>;
+    showPicker: boolean;
+    currentHour: number;
+    currentMinute: number;
+    currentAMPM: string;
+    currentSecond: number;
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    parseTimeValue(): void;
+    getHours(): number[];
+    getMinutes(): number[];
+    getSeconds(): number[];
+    getAMPMOptions(): string[];
+    parseTimeStringToComponents(timeStr: string): {
+        hour: number;
+        minute: number;
+        second: number;
+        ampm: string;
+    };
+    formatTimeFromComponents(hour: number, minute: number, second: number, ampm: string): string;
+    togglePicker(): void;
+    onHourChange(hour: number): void;
+    onMinuteChange(minute: number): void;
+    onSecondChange(second: number): void;
+    onAMPMChange(ampm: string): void;
+    updateTime(): void;
+    scrollToSelectedTimes(): void;
+    onDocumentClick(event: MouseEvent): void;
+    private previousCloseCounter;
+    ngOnChanges(changes: SimpleChanges): void;
+    onInputKeydown(event: KeyboardEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TimePickerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TimePickerComponent, "brickclay-time-picker", never, { "value": { "alias": "value"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "position": { "alias": "position"; "required": false; }; "pickerId": { "alias": "pickerId"; "required": false; }; "closePicker": { "alias": "closePicker"; "required": false; }; "timeFormat": { "alias": "timeFormat"; "required": false; }; "showSeconds": { "alias": "showSeconds"; "required": false; }; }, { "timeChange": "timeChange"; "pickerOpened": "pickerOpened"; "pickerClosed": "pickerClosed"; }, never, never, true, never>;
+}
+
+/**
+ * Optional NgModule wrapper for projects that prefer module-based usage.
+ *
+ * Note:
+ * - The components themselves are standalone, so you can also import them
+ *   directly into any standalone component without using this module.
+ * - This module is mainly for:
+ *   - Existing apps that still use feature modules
+ *   - Easier "plug-and-play" integration: import CalendarModule once and use
+ *     the three exported components anywhere in your templates.
+ */
+declare class CalendarModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CalendarModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CalendarModule, never, [typeof i1.CommonModule, typeof CustomCalendarComponent, typeof ScheduledDatePickerComponent, typeof TimePickerComponent], [typeof CustomCalendarComponent, typeof ScheduledDatePickerComponent, typeof TimePickerComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<CalendarModule>;
+}
+
+export { BrickclayLib, CalendarManagerService, CalendarModule, CustomCalendarComponent, ScheduledDatePickerComponent, TimePickerComponent };
+export type { CalendarRange, CalendarSelection, ScheduledDateSelection, TimeConfiguration };

package/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "@brickclay-org/ui",
+  "version": "0.0.1",
+  "peerDependencies": {
+    "@angular/common": ">=17.0.0 <21.0.0",
+    "@angular/core": ">=17.0.0 <21.0.0"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
+  "sideEffects": false,
+  "module": "fesm2022/brickclay-org-ui.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "default": "./fesm2022/brickclay-org-ui.mjs"
+    }
+  }
+}

package/src/lib/assets/calender/calender.svg

@@ -0,0 +1,19 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_3797_46309)">
+<path d="M14.545 5.45448V11.6363C14.545 13.8181 13.4541 15.2727 10.9086 15.2727H5.09047C2.54501 15.2727 1.4541 13.8181 1.4541 11.6363V5.45448C1.4541 3.27266 2.54501 1.81812 5.09047 1.81812H10.9086C13.4541 1.81812 14.545 3.27266 14.545 5.45448Z" stroke="#141414" stroke-width="1.2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M5.09082 0.727295V2.90911" stroke="#141414" stroke-width="1.2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M10.9092 0.727295V2.90911" stroke="#141414" stroke-width="1.2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M1.81836 5.88354H14.182" stroke="#141414" stroke-width="1.2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M10.6868 9.23619H10.6933" stroke="#141414" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M10.6868 11.4181H10.6933" stroke="#141414" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M7.99636 9.23619H8.00289" stroke="#141414" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M7.99636 11.4181H8.00289" stroke="#141414" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M5.30495 9.23644H5.31149" stroke="#141414" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M5.30495 11.4181H5.31149" stroke="#141414" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_3797_46309">
+<rect width="16" height="16" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/calender/chevron-down.svg

@@ -0,0 +1,10 @@
+<svg width="12" height="7" viewBox="0 0 12 7" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_535_3111)">
+<path d="M0.835938 1.16797L5.83593 6.16797L10.8359 1.16797" stroke="#6B7080" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_535_3111">
+<rect width="7" height="12" fill="white" transform="matrix(0 -1 1 0 0 7)"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/calender/chevron-left.svg

@@ -0,0 +1,3 @@
+<svg width="7" height="12" viewBox="0 0 7 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.83398 0.833313L0.833984 5.83331L5.83398 10.8333" stroke="#6B7080" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/src/lib/assets/calender/chevron-right.svg

@@ -0,0 +1,3 @@
+<svg width="7" height="12" viewBox="0 0 7 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0.833984 10.8333L5.83398 5.83331L0.833984 0.833313" stroke="#6B7080" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/src/lib/assets/calender/chevron-up.svg

@@ -0,0 +1,10 @@
+<svg width="12" height="7" viewBox="0 0 12 7" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_535_3113)">
+<path d="M10.8359 6.16797L5.83593 1.16797L0.835938 6.16797" stroke="#6B7080" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_535_3113">
+<rect width="7" height="12" fill="white" transform="matrix(0 -1 1 0 0 7)"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/calender/pagination-left-gray.svg

@@ -0,0 +1,3 @@
+<svg width="6" height="10" viewBox="0 0 6 10" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5 9L1 5L5 1" stroke="#B9BBC6" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/src/lib/assets/calender/pagination-right-gray.svg

@@ -0,0 +1,10 @@
+<svg width="6" height="10" viewBox="0 0 6 10" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_268_9)">
+<path d="M1 9L5 5L1 1" stroke="#B9BBC6" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_268_9">
+<rect width="6" height="10" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/calender/timer.svg

@@ -0,0 +1,4 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7 14C10.8593 14 14 10.8593 14 7C14 3.14067 10.8594 0 7 0C3.14063 0 0 3.14067 0 7C0 10.8593 3.14067 14 7 14ZM7 0.933318C10.346 0.933318 13.0667 3.65398 13.0667 7C13.0667 10.346 10.346 13.0667 7 13.0667C3.65398 13.0667 0.933318 10.346 0.933318 7C0.933318 3.65398 3.65401 0.933318 7 0.933318Z" fill="#BBBDC5"/>
+<path d="M9.04153 9.23071C9.12788 9.3007 9.23052 9.33339 9.3332 9.33339C9.47086 9.33339 9.60619 9.27272 9.69718 9.15839C9.85819 8.95772 9.82549 8.66372 9.62486 8.50271L7.46652 6.77604V3.26671C7.46652 3.01004 7.25653 2.80005 6.99986 2.80005C6.74319 2.80005 6.5332 3.01004 6.5332 3.26671V7.00006C6.5332 7.1424 6.59855 7.27539 6.7082 7.36404L9.04153 9.23071Z" fill="#BBBDC5"/>
+</svg>