@bloc-ui/date-picker 0.0.1

package/README.md

@@ -0,0 +1,117 @@
+# @bloc-ui/date-picker
+
+> **Latest:** v0.0.1
+
+Date picker component with calendar dropdown for Angular — part of the [Bloc UI](https://github.com/debasish1996/BLOC-UI) component library. Supports template-driven and reactive forms, min/max date enforcement, and customisable display format.
+
+**[Live Documentation & Demos](https://debasish1996.github.io/BLOC-UI/)**
+
+> **Tip:** You can also install [`@bloc-ui/kit`](https://www.npmjs.com/package/@bloc-ui/kit) to get this package along with every other Bloc UI component in a single import.
+
+---
+
+## Installation
+
+```bash
+npm install @bloc-ui/date-picker
+```
+
+**Peer dependencies:** `@angular/common`, `@angular/core`, and `@angular/forms` ≥ 21.
+
+---
+
+## Usage
+
+```ts
+import { BlocDatePickerComponent, BlocDatePickerModule } from '@bloc-ui/date-picker';
+```
+
+### Basic
+
+```html
+<bloc-date-picker /> <bloc-date-picker placeholder="Pick a date" />
+```
+
+### With ngModel
+
+```html
+<bloc-date-picker [(ngModel)]="selectedDate" />
+```
+
+### With Reactive Forms
+
+```html
+<bloc-date-picker [formControl]="dateCtrl" />
+```
+
+### Sizes
+
+```html
+<bloc-date-picker size="sm" /> <bloc-date-picker size="lg" />
+```
+
+### Min / Max
+
+```html
+<bloc-date-picker [minDate]="minDate" [maxDate]="maxDate" />
+```
+
+---
+
+## `BlocDatePickerComponent` inputs
+
+| Input         | Type                   | Default         | Description             |
+| ------------- | ---------------------- | --------------- | ----------------------- |
+| `size`        | `'sm' \| 'md' \| 'lg'` | `'md'`          | Density preset          |
+| `placeholder` | `string`               | `'Select date'` | Input placeholder text  |
+| `format`      | `string`               | `'yyyy-MM-dd'`  | Display format          |
+| `disabled`    | `boolean`              | `false`         | Disable the picker      |
+| `minDate`     | `Date \| null`         | `null`          | Minimum selectable date |
+| `maxDate`     | `Date \| null`         | `null`          | Maximum selectable date |
+
+---
+
+## CSS tokens
+
+| Token                                | Fallback                       | Description              |
+| ------------------------------------ | ------------------------------ | ------------------------ |
+| `--bloc-date-picker-padding`         | `8px 36px 8px 12px`            | Input padding            |
+| `--bloc-date-picker-font-size`       | `0.875rem`                     | Input font size          |
+| `--bloc-date-picker-radius`          | `6px`                          | Input border radius      |
+| `--bloc-date-picker-color`           | `#374151`                      | Input text colour        |
+| `--bloc-date-picker-bg`              | `#ffffff`                      | Input background         |
+| `--bloc-date-picker-border`          | `var(--bloc-border, #d1d5db)`  | Input border colour      |
+| `--bloc-date-picker-focus-border`    | `var(--bloc-primary, #6b7280)` | Focus border colour      |
+| `--bloc-date-picker-focus-ring`      | `rgba(107,114,128,0.2)`        | Focus ring colour        |
+| `--bloc-date-picker-placeholder`     | `#9ca3af`                      | Placeholder colour       |
+| `--bloc-date-picker-icon-color`      | `#9ca3af`                      | Calendar icon colour     |
+| `--bloc-date-picker-z-index`         | `100`                          | Dropdown z-index         |
+| `--bloc-date-picker-dropdown-bg`     | `#ffffff`                      | Dropdown background      |
+| `--bloc-date-picker-dropdown-border` | `var(--bloc-border, #d1d5db)`  | Dropdown border          |
+| `--bloc-date-picker-dropdown-shadow` | `0 4px 16px rgba(0,0,0,0.1)`   | Dropdown shadow          |
+| `--bloc-date-picker-day-color`       | `#374151`                      | Day text colour          |
+| `--bloc-date-picker-day-hover-bg`    | `#f3f4f6`                      | Day hover background     |
+| `--bloc-date-picker-today-border`    | `var(--bloc-primary, #6b7280)` | Today border colour      |
+| `--bloc-date-picker-selected-bg`     | `var(--bloc-primary, #6b7280)` | Selected day background  |
+| `--bloc-date-picker-selected-color`  | `#ffffff`                      | Selected day text colour |
+
+---
+
+## Accessibility
+
+- Input sets `aria-expanded` and `aria-haspopup="dialog"` for the calendar dropdown.
+- Dropdown uses `role="dialog"` with `aria-label="Date picker"`.
+- Closes on <kbd>Escape</kbd> key and outside click.
+- Calendar includes a "Today" button for quick navigation.
+
+---
+
+## Theming
+
+All visual tokens (`--bloc-primary`, `--bloc-surface`, colour scales, dark-mode) are provided by the optional [`@bloc-ui/theme`](https://www.npmjs.com/package/@bloc-ui/theme) package. The date picker works without it — neutral fallbacks are applied automatically.
+
+---
+
+## License
+
+MIT

package/fesm2022/bloc-ui-date-picker.mjs

@@ -0,0 +1,355 @@
+import * as i0 from '@angular/core';
+import { inject, ElementRef, input, signal, computed, forwardRef, HostListener, Component, NgModule } from '@angular/core';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+
+const DAYS_OF_WEEK = ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'];
+/**
+ * Date picker component with calendar dropdown.
+ *
+ * ```html
+ * <bloc-date-picker [(ngModel)]="selectedDate" />
+ * <bloc-date-picker [formControl]="dateCtrl" placeholder="Choose date" />
+ * ```
+ */
+class BlocDatePickerComponent {
+    _el = inject((ElementRef));
+    /** Preset size. Defaults to `'md'`. */
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Placeholder text for the input. */
+    placeholder = input('Select date', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /** Date format for display. Defaults to `'yyyy-MM-dd'`. */
+    format = input('yyyy-MM-dd', ...(ngDevMode ? [{ debugName: "format" }] : /* istanbul ignore next */ []));
+    /** Disable the date picker via template binding. */
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /** Minimum selectable date. */
+    minDate = input(null, ...(ngDevMode ? [{ debugName: "minDate" }] : /* istanbul ignore next */ []));
+    /** Maximum selectable date. */
+    maxDate = input(null, ...(ngDevMode ? [{ debugName: "maxDate" }] : /* istanbul ignore next */ []));
+    weekdays = DAYS_OF_WEEK;
+    /** Currently selected date. */
+    _selectedDate = signal(null, ...(ngDevMode ? [{ debugName: "_selectedDate" }] : /* istanbul ignore next */ []));
+    /** Whether the calendar dropdown is open. */
+    isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+    /** The month being viewed (year + month). */
+    _viewDate = signal(new Date(), ...(ngDevMode ? [{ debugName: "_viewDate" }] : /* istanbul ignore next */ []));
+    _formDisabled = signal(false, ...(ngDevMode ? [{ debugName: "_formDisabled" }] : /* istanbul ignore next */ []));
+    isDisabled = computed(() => this.disabled() || this._formDisabled(), ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
+    _onChange = () => { };
+    _onTouched = () => { };
+    displayValue = computed(() => {
+        const d = this._selectedDate();
+        if (!d)
+            return '';
+        return this._formatDate(d);
+    }, ...(ngDevMode ? [{ debugName: "displayValue" }] : /* istanbul ignore next */ []));
+    monthYearLabel = computed(() => {
+        const d = this._viewDate();
+        return d.toLocaleString('default', { month: 'long', year: 'numeric' });
+    }, ...(ngDevMode ? [{ debugName: "monthYearLabel" }] : /* istanbul ignore next */ []));
+    calendarDays = computed(() => {
+        const viewDate = this._viewDate();
+        const selected = this._selectedDate();
+        const today = new Date();
+        const min = this.minDate();
+        const max = this.maxDate();
+        const year = viewDate.getFullYear();
+        const month = viewDate.getMonth();
+        const firstOfMonth = new Date(year, month, 1);
+        const startDay = firstOfMonth.getDay();
+        const daysInMonth = new Date(year, month + 1, 0).getDate();
+        // Fill from previous month
+        const prevMonthDays = new Date(year, month, 0).getDate();
+        const days = [];
+        for (let i = startDay - 1; i >= 0; i--) {
+            const date = new Date(year, month - 1, prevMonthDays - i);
+            days.push(this._buildDay(date, false, today, selected, min, max));
+        }
+        for (let d = 1; d <= daysInMonth; d++) {
+            const date = new Date(year, month, d);
+            days.push(this._buildDay(date, true, today, selected, min, max));
+        }
+        // Fill remaining to complete 6 rows (42 cells)
+        const remaining = 42 - days.length;
+        for (let d = 1; d <= remaining; d++) {
+            const date = new Date(year, month + 1, d);
+            days.push(this._buildDay(date, false, today, selected, min, max));
+        }
+        return days;
+    }, ...(ngDevMode ? [{ debugName: "calendarDays" }] : /* istanbul ignore next */ []));
+    toggleCalendar() {
+        if (this.isDisabled())
+            return;
+        this.isOpen.update((v) => !v);
+        if (this.isOpen()) {
+            const selected = this._selectedDate();
+            if (selected) {
+                this._viewDate.set(new Date(selected.getFullYear(), selected.getMonth(), 1));
+            }
+        }
+    }
+    selectDay(day) {
+        if (day.isDisabled)
+            return;
+        this._selectedDate.set(day.date);
+        this._onChange(day.date);
+        this.isOpen.set(false);
+    }
+    prevMonth() {
+        const d = this._viewDate();
+        this._viewDate.set(new Date(d.getFullYear(), d.getMonth() - 1, 1));
+    }
+    nextMonth() {
+        const d = this._viewDate();
+        this._viewDate.set(new Date(d.getFullYear(), d.getMonth() + 1, 1));
+    }
+    goToToday() {
+        const today = new Date();
+        this._selectedDate.set(today);
+        this._viewDate.set(new Date(today.getFullYear(), today.getMonth(), 1));
+        this._onChange(today);
+        this.isOpen.set(false);
+    }
+    clear() {
+        this._selectedDate.set(null);
+        this._onChange(null);
+    }
+    _onDocClick(event) {
+        if (!this._el.nativeElement.contains(event.target)) {
+            this.isOpen.set(false);
+        }
+    }
+    _onEsc() {
+        this.isOpen.set(false);
+    }
+    // — ControlValueAccessor —
+    writeValue(val) {
+        this._selectedDate.set(val instanceof Date ? val : val ? new Date(val) : null);
+    }
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this._formDisabled.set(isDisabled);
+    }
+    // — Private helpers —
+    _buildDay(date, isCurrentMonth, today, selected, min, max) {
+        const isToday = date.getDate() === today.getDate() &&
+            date.getMonth() === today.getMonth() &&
+            date.getFullYear() === today.getFullYear();
+        const isSelected = selected
+            ? date.getDate() === selected.getDate() &&
+                date.getMonth() === selected.getMonth() &&
+                date.getFullYear() === selected.getFullYear()
+            : false;
+        let isDisabled = false;
+        if (min) {
+            const minDay = new Date(min.getFullYear(), min.getMonth(), min.getDate());
+            isDisabled = date < minDay;
+        }
+        if (max && !isDisabled) {
+            const maxDay = new Date(max.getFullYear(), max.getMonth(), max.getDate());
+            isDisabled = date > maxDay;
+        }
+        return { date, day: date.getDate(), isCurrentMonth, isToday, isSelected, isDisabled };
+    }
+    _formatDate(d) {
+        const yyyy = d.getFullYear();
+        const mm = String(d.getMonth() + 1).padStart(2, '0');
+        const dd = String(d.getDate()).padStart(2, '0');
+        return this.format()
+            .replace('yyyy', String(yyyy))
+            .replace('MM', mm)
+            .replace('dd', dd);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: BlocDatePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: BlocDatePickerComponent, isStandalone: true, selector: "bloc-date-picker", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:click": "_onDocClick($event)", "keydown.escape": "_onEsc()" }, properties: { "class.bloc-date-picker": "true", "class.bloc-date-picker--sm": "size() === \"sm\"", "class.bloc-date-picker--lg": "size() === \"lg\"", "class.bloc-date-picker--disabled": "isDisabled()", "class.bloc-date-picker--open": "isOpen()" } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => BlocDatePickerComponent),
+                multi: true,
+            },
+        ], ngImport: i0, template: `
+    <div class="bloc-date-picker__input-wrapper" (click)="toggleCalendar()">
+      <input
+        class="bloc-date-picker__input"
+        type="text"
+        readonly
+        [value]="displayValue()"
+        [placeholder]="placeholder()"
+        [disabled]="isDisabled()"
+        [attr.aria-expanded]="isOpen()"
+        aria-haspopup="dialog" />
+      <span class="bloc-date-picker__icon" aria-hidden="true">
+        <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <rect x="2" y="3" width="12" height="11" rx="1.5" stroke="currentColor" stroke-width="1.3"/>
+          <line x1="2" y1="6" x2="14" y2="6" stroke="currentColor" stroke-width="1.3"/>
+          <line x1="5" y1="1.5" x2="5" y2="4" stroke="currentColor" stroke-width="1.3" stroke-linecap="round"/>
+          <line x1="11" y1="1.5" x2="11" y2="4" stroke="currentColor" stroke-width="1.3" stroke-linecap="round"/>
+        </svg>
+      </span>
+    </div>
+
+    @if (isOpen()) {
+      <div class="bloc-date-picker__dropdown" role="dialog" aria-label="Date picker">
+        <div class="bloc-date-picker__header">
+          <button type="button" class="bloc-date-picker__nav" (click)="prevMonth()" aria-label="Previous month">
+            &#8249;
+          </button>
+          <span class="bloc-date-picker__month-year">
+            {{ monthYearLabel() }}
+          </span>
+          <button type="button" class="bloc-date-picker__nav" (click)="nextMonth()" aria-label="Next month">
+            &#8250;
+          </button>
+        </div>
+
+        <div class="bloc-date-picker__weekdays">
+          @for (day of weekdays; track day) {
+            <span class="bloc-date-picker__weekday">{{ day }}</span>
+          }
+        </div>
+
+        <div class="bloc-date-picker__days">
+          @for (day of calendarDays(); track day.date.getTime()) {
+            <button
+              type="button"
+              class="bloc-date-picker__day"
+              [class.bloc-date-picker__day--other]="!day.isCurrentMonth"
+              [class.bloc-date-picker__day--today]="day.isToday"
+              [class.bloc-date-picker__day--selected]="day.isSelected"
+              [class.bloc-date-picker__day--disabled]="day.isDisabled"
+              [disabled]="day.isDisabled"
+              (click)="selectDay(day)">
+              {{ day.day }}
+            </button>
+          }
+        </div>
+
+        <div class="bloc-date-picker__footer">
+          <button type="button" class="bloc-date-picker__today-btn" (click)="goToToday()">
+            Today
+          </button>
+          @if (_selectedDate()) {
+            <button type="button" class="bloc-date-picker__clear-btn" (click)="clear()">
+              Clear
+            </button>
+          }
+        </div>
+      </div>
+    }
+  `, isInline: true, styles: [":host{display:inline-block;position:relative;font-family:inherit}.bloc-date-picker__input-wrapper{display:flex;align-items:center;cursor:pointer;position:relative}.bloc-date-picker__input{appearance:none;border-width:1px;border-style:solid;font-family:inherit;cursor:pointer;outline:none;width:100%;box-sizing:border-box;padding:var(--bloc-date-picker-padding, 8px 36px 8px 12px);font-size:var(--bloc-date-picker-font-size, .875rem);border-radius:var(--bloc-date-picker-radius, 6px);transition:border-color .15s ease}:where(.bloc-date-picker__input){color:var(--bloc-date-picker-color, #374151);background-color:var(--bloc-date-picker-bg, #ffffff);border-color:var(--bloc-date-picker-border, var(--bloc-border, #d1d5db))}:where(.bloc-date-picker__input:focus){border-color:var(--bloc-date-picker-focus-border, var(--bloc-primary, #6b7280));box-shadow:0 0 0 2px var(--bloc-date-picker-focus-ring, rgba(107, 114, 128, .2))}:where(.bloc-date-picker__input::placeholder){color:var(--bloc-date-picker-placeholder, #9ca3af)}.bloc-date-picker__icon{position:absolute;right:10px;top:50%;transform:translateY(-50%);pointer-events:none;display:flex;align-items:center}:where(.bloc-date-picker__icon){color:var(--bloc-date-picker-icon-color, #9ca3af)}:host.bloc-date-picker--disabled{opacity:.5;pointer-events:none}:host.bloc-date-picker--disabled .bloc-date-picker__input{cursor:not-allowed}.bloc-date-picker__dropdown{position:absolute;top:calc(100% + 4px);left:0;z-index:var(--bloc-date-picker-z-index, 100);min-width:280px;border-width:1px;border-style:solid;border-radius:var(--bloc-date-picker-dropdown-radius, 8px);padding:12px;animation:bloc-dp-in .15s ease}:where(.bloc-date-picker__dropdown){background-color:var(--bloc-date-picker-dropdown-bg, #ffffff);border-color:var(--bloc-date-picker-dropdown-border, var(--bloc-border, #d1d5db));box-shadow:var(--bloc-date-picker-dropdown-shadow, 0 4px 16px rgba(0, 0, 0, .1))}.bloc-date-picker__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.bloc-date-picker__month-year{font-weight:600;font-size:.875rem}:where(.bloc-date-picker__month-year){color:var(--bloc-date-picker-header-color, #374151)}.bloc-date-picker__nav{appearance:none;background:transparent;border:none;cursor:pointer;font-size:1.25rem;line-height:1;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:background-color .1s ease}:where(.bloc-date-picker__nav){color:var(--bloc-date-picker-nav-color, #6b7280)}:where(.bloc-date-picker__nav):hover{background-color:var(--bloc-date-picker-nav-hover-bg, #f3f4f6)}.bloc-date-picker__weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:0;margin-bottom:4px}.bloc-date-picker__weekday{font-size:.75rem;font-weight:600;text-align:center;padding:4px 0;-webkit-user-select:none;user-select:none}:where(.bloc-date-picker__weekday){color:var(--bloc-date-picker-weekday-color, #9ca3af)}.bloc-date-picker__days{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.bloc-date-picker__day{appearance:none;background:transparent;border:none;cursor:pointer;font-family:inherit;font-size:.8125rem;width:32px;height:32px;display:flex;align-items:center;justify-content:center;margin:0 auto;border-radius:var(--bloc-date-picker-day-radius, 6px);transition:background-color .1s ease,color .1s ease}:where(.bloc-date-picker__day){color:var(--bloc-date-picker-day-color, #374151)}:where(.bloc-date-picker__day):hover:not(:disabled){background-color:var(--bloc-date-picker-day-hover-bg, #f3f4f6)}.bloc-date-picker__day--other{opacity:.35}.bloc-date-picker__day--today{font-weight:700;border:1px solid var(--bloc-date-picker-today-border, var(--bloc-primary, #6b7280))}.bloc-date-picker__day--selected{background-color:var(--bloc-date-picker-selected-bg, var(--bloc-primary, #6b7280))!important;color:var(--bloc-date-picker-selected-color, #ffffff)!important;font-weight:600}.bloc-date-picker__day--disabled{cursor:not-allowed;opacity:.3}.bloc-date-picker__footer{display:flex;justify-content:space-between;margin-top:8px;padding-top:8px;border-top:1px solid var(--bloc-date-picker-footer-border, var(--bloc-border, #d1d5db))}.bloc-date-picker__today-btn,.bloc-date-picker__clear-btn{appearance:none;background:transparent;border:none;cursor:pointer;font-family:inherit;font-size:.8125rem;font-weight:500;padding:4px 8px;border-radius:4px;transition:background-color .1s ease}:where(.bloc-date-picker__today-btn){color:var(--bloc-date-picker-action-color, var(--bloc-primary, #6b7280))}:where(.bloc-date-picker__today-btn):hover{background-color:var(--bloc-date-picker-action-hover-bg, #f3f4f6)}:where(.bloc-date-picker__clear-btn){color:var(--bloc-date-picker-clear-color, #9ca3af)}:where(.bloc-date-picker__clear-btn):hover{background-color:var(--bloc-date-picker-action-hover-bg, #f3f4f6);color:var(--bloc-date-picker-clear-hover-color, #374151)}:host.bloc-date-picker--sm .bloc-date-picker__input{padding:var(--bloc-date-picker-padding, 6px 32px 6px 10px);font-size:var(--bloc-date-picker-font-size, .8125rem)}:host.bloc-date-picker--lg .bloc-date-picker__input{padding:var(--bloc-date-picker-padding, 12px 40px 12px 14px);font-size:var(--bloc-date-picker-font-size, 1rem)}@keyframes bloc-dp-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: BlocDatePickerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bloc-date-picker', standalone: true, template: `
+    <div class="bloc-date-picker__input-wrapper" (click)="toggleCalendar()">
+      <input
+        class="bloc-date-picker__input"
+        type="text"
+        readonly
+        [value]="displayValue()"
+        [placeholder]="placeholder()"
+        [disabled]="isDisabled()"
+        [attr.aria-expanded]="isOpen()"
+        aria-haspopup="dialog" />
+      <span class="bloc-date-picker__icon" aria-hidden="true">
+        <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <rect x="2" y="3" width="12" height="11" rx="1.5" stroke="currentColor" stroke-width="1.3"/>
+          <line x1="2" y1="6" x2="14" y2="6" stroke="currentColor" stroke-width="1.3"/>
+          <line x1="5" y1="1.5" x2="5" y2="4" stroke="currentColor" stroke-width="1.3" stroke-linecap="round"/>
+          <line x1="11" y1="1.5" x2="11" y2="4" stroke="currentColor" stroke-width="1.3" stroke-linecap="round"/>
+        </svg>
+      </span>
+    </div>
+
+    @if (isOpen()) {
+      <div class="bloc-date-picker__dropdown" role="dialog" aria-label="Date picker">
+        <div class="bloc-date-picker__header">
+          <button type="button" class="bloc-date-picker__nav" (click)="prevMonth()" aria-label="Previous month">
+            &#8249;
+          </button>
+          <span class="bloc-date-picker__month-year">
+            {{ monthYearLabel() }}
+          </span>
+          <button type="button" class="bloc-date-picker__nav" (click)="nextMonth()" aria-label="Next month">
+            &#8250;
+          </button>
+        </div>
+
+        <div class="bloc-date-picker__weekdays">
+          @for (day of weekdays; track day) {
+            <span class="bloc-date-picker__weekday">{{ day }}</span>
+          }
+        </div>
+
+        <div class="bloc-date-picker__days">
+          @for (day of calendarDays(); track day.date.getTime()) {
+            <button
+              type="button"
+              class="bloc-date-picker__day"
+              [class.bloc-date-picker__day--other]="!day.isCurrentMonth"
+              [class.bloc-date-picker__day--today]="day.isToday"
+              [class.bloc-date-picker__day--selected]="day.isSelected"
+              [class.bloc-date-picker__day--disabled]="day.isDisabled"
+              [disabled]="day.isDisabled"
+              (click)="selectDay(day)">
+              {{ day.day }}
+            </button>
+          }
+        </div>
+
+        <div class="bloc-date-picker__footer">
+          <button type="button" class="bloc-date-picker__today-btn" (click)="goToToday()">
+            Today
+          </button>
+          @if (_selectedDate()) {
+            <button type="button" class="bloc-date-picker__clear-btn" (click)="clear()">
+              Clear
+            </button>
+          }
+        </div>
+      </div>
+    }
+  `, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => BlocDatePickerComponent),
+                            multi: true,
+                        },
+                    ], host: {
+                        '[class.bloc-date-picker]': 'true',
+                        '[class.bloc-date-picker--sm]': 'size() === "sm"',
+                        '[class.bloc-date-picker--lg]': 'size() === "lg"',
+                        '[class.bloc-date-picker--disabled]': 'isDisabled()',
+                        '[class.bloc-date-picker--open]': 'isOpen()',
+                    }, styles: [":host{display:inline-block;position:relative;font-family:inherit}.bloc-date-picker__input-wrapper{display:flex;align-items:center;cursor:pointer;position:relative}.bloc-date-picker__input{appearance:none;border-width:1px;border-style:solid;font-family:inherit;cursor:pointer;outline:none;width:100%;box-sizing:border-box;padding:var(--bloc-date-picker-padding, 8px 36px 8px 12px);font-size:var(--bloc-date-picker-font-size, .875rem);border-radius:var(--bloc-date-picker-radius, 6px);transition:border-color .15s ease}:where(.bloc-date-picker__input){color:var(--bloc-date-picker-color, #374151);background-color:var(--bloc-date-picker-bg, #ffffff);border-color:var(--bloc-date-picker-border, var(--bloc-border, #d1d5db))}:where(.bloc-date-picker__input:focus){border-color:var(--bloc-date-picker-focus-border, var(--bloc-primary, #6b7280));box-shadow:0 0 0 2px var(--bloc-date-picker-focus-ring, rgba(107, 114, 128, .2))}:where(.bloc-date-picker__input::placeholder){color:var(--bloc-date-picker-placeholder, #9ca3af)}.bloc-date-picker__icon{position:absolute;right:10px;top:50%;transform:translateY(-50%);pointer-events:none;display:flex;align-items:center}:where(.bloc-date-picker__icon){color:var(--bloc-date-picker-icon-color, #9ca3af)}:host.bloc-date-picker--disabled{opacity:.5;pointer-events:none}:host.bloc-date-picker--disabled .bloc-date-picker__input{cursor:not-allowed}.bloc-date-picker__dropdown{position:absolute;top:calc(100% + 4px);left:0;z-index:var(--bloc-date-picker-z-index, 100);min-width:280px;border-width:1px;border-style:solid;border-radius:var(--bloc-date-picker-dropdown-radius, 8px);padding:12px;animation:bloc-dp-in .15s ease}:where(.bloc-date-picker__dropdown){background-color:var(--bloc-date-picker-dropdown-bg, #ffffff);border-color:var(--bloc-date-picker-dropdown-border, var(--bloc-border, #d1d5db));box-shadow:var(--bloc-date-picker-dropdown-shadow, 0 4px 16px rgba(0, 0, 0, .1))}.bloc-date-picker__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.bloc-date-picker__month-year{font-weight:600;font-size:.875rem}:where(.bloc-date-picker__month-year){color:var(--bloc-date-picker-header-color, #374151)}.bloc-date-picker__nav{appearance:none;background:transparent;border:none;cursor:pointer;font-size:1.25rem;line-height:1;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:background-color .1s ease}:where(.bloc-date-picker__nav){color:var(--bloc-date-picker-nav-color, #6b7280)}:where(.bloc-date-picker__nav):hover{background-color:var(--bloc-date-picker-nav-hover-bg, #f3f4f6)}.bloc-date-picker__weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:0;margin-bottom:4px}.bloc-date-picker__weekday{font-size:.75rem;font-weight:600;text-align:center;padding:4px 0;-webkit-user-select:none;user-select:none}:where(.bloc-date-picker__weekday){color:var(--bloc-date-picker-weekday-color, #9ca3af)}.bloc-date-picker__days{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.bloc-date-picker__day{appearance:none;background:transparent;border:none;cursor:pointer;font-family:inherit;font-size:.8125rem;width:32px;height:32px;display:flex;align-items:center;justify-content:center;margin:0 auto;border-radius:var(--bloc-date-picker-day-radius, 6px);transition:background-color .1s ease,color .1s ease}:where(.bloc-date-picker__day){color:var(--bloc-date-picker-day-color, #374151)}:where(.bloc-date-picker__day):hover:not(:disabled){background-color:var(--bloc-date-picker-day-hover-bg, #f3f4f6)}.bloc-date-picker__day--other{opacity:.35}.bloc-date-picker__day--today{font-weight:700;border:1px solid var(--bloc-date-picker-today-border, var(--bloc-primary, #6b7280))}.bloc-date-picker__day--selected{background-color:var(--bloc-date-picker-selected-bg, var(--bloc-primary, #6b7280))!important;color:var(--bloc-date-picker-selected-color, #ffffff)!important;font-weight:600}.bloc-date-picker__day--disabled{cursor:not-allowed;opacity:.3}.bloc-date-picker__footer{display:flex;justify-content:space-between;margin-top:8px;padding-top:8px;border-top:1px solid var(--bloc-date-picker-footer-border, var(--bloc-border, #d1d5db))}.bloc-date-picker__today-btn,.bloc-date-picker__clear-btn{appearance:none;background:transparent;border:none;cursor:pointer;font-family:inherit;font-size:.8125rem;font-weight:500;padding:4px 8px;border-radius:4px;transition:background-color .1s ease}:where(.bloc-date-picker__today-btn){color:var(--bloc-date-picker-action-color, var(--bloc-primary, #6b7280))}:where(.bloc-date-picker__today-btn):hover{background-color:var(--bloc-date-picker-action-hover-bg, #f3f4f6)}:where(.bloc-date-picker__clear-btn){color:var(--bloc-date-picker-clear-color, #9ca3af)}:where(.bloc-date-picker__clear-btn):hover{background-color:var(--bloc-date-picker-action-hover-bg, #f3f4f6);color:var(--bloc-date-picker-clear-hover-color, #374151)}:host.bloc-date-picker--sm .bloc-date-picker__input{padding:var(--bloc-date-picker-padding, 6px 32px 6px 10px);font-size:var(--bloc-date-picker-font-size, .8125rem)}:host.bloc-date-picker--lg .bloc-date-picker__input{padding:var(--bloc-date-picker-padding, 12px 40px 12px 14px);font-size:var(--bloc-date-picker-font-size, 1rem)}@keyframes bloc-dp-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}\n"] }]
+        }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], format: [{ type: i0.Input, args: [{ isSignal: true, alias: "format", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], minDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "minDate", required: false }] }], maxDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDate", required: false }] }], _onDocClick: [{
+                type: HostListener,
+                args: ['document:click', ['$event']]
+            }], _onEsc: [{
+                type: HostListener,
+                args: ['keydown.escape']
+            }] } });
+
+class BlocDatePickerModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: BlocDatePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.5", ngImport: i0, type: BlocDatePickerModule, imports: [BlocDatePickerComponent], exports: [BlocDatePickerComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: BlocDatePickerModule });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: BlocDatePickerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [BlocDatePickerComponent],
+                    exports: [BlocDatePickerComponent],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { BlocDatePickerComponent, BlocDatePickerModule };
+//# sourceMappingURL=bloc-ui-date-picker.mjs.map

package/fesm2022/bloc-ui-date-picker.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"bloc-ui-date-picker.mjs","sources":["../../../projects/bloc-ui-date-picker/src/date-picker.component.ts","../../../projects/bloc-ui-date-picker/src/date-picker.module.ts","../../../projects/bloc-ui-date-picker/src/bloc-ui-date-picker.ts"],"sourcesContent":["import {\r\n    Component,\r\n    computed,\r\n    ElementRef,\r\n    forwardRef,\r\n    HostListener,\r\n    inject,\r\n    input,\r\n    signal,\r\n} from '@angular/core';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\n\r\nconst DAYS_OF_WEEK = ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'];\r\n\r\ninterface CalendarDay {\r\n    date: Date;\r\n    day: number;\r\n    isCurrentMonth: boolean;\r\n    isToday: boolean;\r\n    isSelected: boolean;\r\n    isDisabled: boolean;\r\n}\r\n\r\n/**\r\n * Date picker component with calendar dropdown.\r\n *\r\n * ```html\r\n * <bloc-date-picker [(ngModel)]=\"selectedDate\" />\r\n * <bloc-date-picker [formControl]=\"dateCtrl\" placeholder=\"Choose date\" />\r\n * ```\r\n */\r\n@Component({\r\n    selector: 'bloc-date-picker',\r\n    standalone: true,\r\n    template: `\r\n    <div class=\"bloc-date-picker__input-wrapper\" (click)=\"toggleCalendar()\">\r\n      <input\r\n        class=\"bloc-date-picker__input\"\r\n        type=\"text\"\r\n        readonly\r\n        [value]=\"displayValue()\"\r\n        [placeholder]=\"placeholder()\"\r\n        [disabled]=\"isDisabled()\"\r\n        [attr.aria-expanded]=\"isOpen()\"\r\n        aria-haspopup=\"dialog\" />\r\n      <span class=\"bloc-date-picker__icon\" aria-hidden=\"true\">\r\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n          <rect x=\"2\" y=\"3\" width=\"12\" height=\"11\" rx=\"1.5\" stroke=\"currentColor\" stroke-width=\"1.3\"/>\r\n          <line x1=\"2\" y1=\"6\" x2=\"14\" y2=\"6\" stroke=\"currentColor\" stroke-width=\"1.3\"/>\r\n          <line x1=\"5\" y1=\"1.5\" x2=\"5\" y2=\"4\" stroke=\"currentColor\" stroke-width=\"1.3\" stroke-linecap=\"round\"/>\r\n          <line x1=\"11\" y1=\"1.5\" x2=\"11\" y2=\"4\" stroke=\"currentColor\" stroke-width=\"1.3\" stroke-linecap=\"round\"/>\r\n        </svg>\r\n      </span>\r\n    </div>\r\n\r\n    @if (isOpen()) {\r\n      <div class=\"bloc-date-picker__dropdown\" role=\"dialog\" aria-label=\"Date picker\">\r\n        <div class=\"bloc-date-picker__header\">\r\n          <button type=\"button\" class=\"bloc-date-picker__nav\" (click)=\"prevMonth()\" aria-label=\"Previous month\">\r\n            &#8249;\r\n          </button>\r\n          <span class=\"bloc-date-picker__month-year\">\r\n            {{ monthYearLabel() }}\r\n          </span>\r\n          <button type=\"button\" class=\"bloc-date-picker__nav\" (click)=\"nextMonth()\" aria-label=\"Next month\">\r\n            &#8250;\r\n          </button>\r\n        </div>\r\n\r\n        <div class=\"bloc-date-picker__weekdays\">\r\n          @for (day of weekdays; track day) {\r\n            <span class=\"bloc-date-picker__weekday\">{{ day }}</span>\r\n          }\r\n        </div>\r\n\r\n        <div class=\"bloc-date-picker__days\">\r\n          @for (day of calendarDays(); track day.date.getTime()) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"bloc-date-picker__day\"\r\n              [class.bloc-date-picker__day--other]=\"!day.isCurrentMonth\"\r\n              [class.bloc-date-picker__day--today]=\"day.isToday\"\r\n              [class.bloc-date-picker__day--selected]=\"day.isSelected\"\r\n              [class.bloc-date-picker__day--disabled]=\"day.isDisabled\"\r\n              [disabled]=\"day.isDisabled\"\r\n              (click)=\"selectDay(day)\">\r\n              {{ day.day }}\r\n            </button>\r\n          }\r\n        </div>\r\n\r\n        <div class=\"bloc-date-picker__footer\">\r\n          <button type=\"button\" class=\"bloc-date-picker__today-btn\" (click)=\"goToToday()\">\r\n            Today\r\n          </button>\r\n          @if (_selectedDate()) {\r\n            <button type=\"button\" class=\"bloc-date-picker__clear-btn\" (click)=\"clear()\">\r\n              Clear\r\n            </button>\r\n          }\r\n        </div>\r\n      </div>\r\n    }\r\n  `,\r\n    styleUrl: './date-picker.component.scss',\r\n    providers: [\r\n        {\r\n            provide: NG_VALUE_ACCESSOR,\r\n            useExisting: forwardRef(() => BlocDatePickerComponent),\r\n            multi: true,\r\n        },\r\n    ],\r\n    host: {\r\n        '[class.bloc-date-picker]': 'true',\r\n        '[class.bloc-date-picker--sm]': 'size() === \"sm\"',\r\n        '[class.bloc-date-picker--lg]': 'size() === \"lg\"',\r\n        '[class.bloc-date-picker--disabled]': 'isDisabled()',\r\n        '[class.bloc-date-picker--open]': 'isOpen()',\r\n    },\r\n})\r\nexport class BlocDatePickerComponent implements ControlValueAccessor {\r\n    private readonly _el = inject(ElementRef<HTMLElement>);\r\n\r\n    /** Preset size. Defaults to `'md'`. */\r\n    readonly size = input<'sm' | 'md' | 'lg'>('md');\r\n\r\n    /** Placeholder text for the input. */\r\n    readonly placeholder = input<string>('Select date');\r\n\r\n    /** Date format for display. Defaults to `'yyyy-MM-dd'`. */\r\n    readonly format = input<string>('yyyy-MM-dd');\r\n\r\n    /** Disable the date picker via template binding. */\r\n    readonly disabled = input<boolean>(false);\r\n\r\n    /** Minimum selectable date. */\r\n    readonly minDate = input<Date | null>(null);\r\n\r\n    /** Maximum selectable date. */\r\n    readonly maxDate = input<Date | null>(null);\r\n\r\n    readonly weekdays = DAYS_OF_WEEK;\r\n\r\n    /** Currently selected date. */\r\n    readonly _selectedDate = signal<Date | null>(null);\r\n\r\n    /** Whether the calendar dropdown is open. */\r\n    readonly isOpen = signal<boolean>(false);\r\n\r\n    /** The month being viewed (year + month). */\r\n    readonly _viewDate = signal<Date>(new Date());\r\n\r\n    private readonly _formDisabled = signal<boolean>(false);\r\n    readonly isDisabled = computed(() => this.disabled() || this._formDisabled());\r\n\r\n    private _onChange: (val: Date | null) => void = () => { };\r\n    _onTouched: () => void = () => { };\r\n\r\n    readonly displayValue = computed(() => {\r\n        const d = this._selectedDate();\r\n        if (!d) return '';\r\n        return this._formatDate(d);\r\n    });\r\n\r\n    readonly monthYearLabel = computed(() => {\r\n        const d = this._viewDate();\r\n        return d.toLocaleString('default', { month: 'long', year: 'numeric' });\r\n    });\r\n\r\n    readonly calendarDays = computed<CalendarDay[]>(() => {\r\n        const viewDate = this._viewDate();\r\n        const selected = this._selectedDate();\r\n        const today = new Date();\r\n        const min = this.minDate();\r\n        const max = this.maxDate();\r\n\r\n        const year = viewDate.getFullYear();\r\n        const month = viewDate.getMonth();\r\n\r\n        const firstOfMonth = new Date(year, month, 1);\r\n        const startDay = firstOfMonth.getDay();\r\n        const daysInMonth = new Date(year, month + 1, 0).getDate();\r\n\r\n        // Fill from previous month\r\n        const prevMonthDays = new Date(year, month, 0).getDate();\r\n        const days: CalendarDay[] = [];\r\n\r\n        for (let i = startDay - 1; i >= 0; i--) {\r\n            const date = new Date(year, month - 1, prevMonthDays - i);\r\n            days.push(this._buildDay(date, false, today, selected, min, max));\r\n        }\r\n\r\n        for (let d = 1; d <= daysInMonth; d++) {\r\n            const date = new Date(year, month, d);\r\n            days.push(this._buildDay(date, true, today, selected, min, max));\r\n        }\r\n\r\n        // Fill remaining to complete 6 rows (42 cells)\r\n        const remaining = 42 - days.length;\r\n        for (let d = 1; d <= remaining; d++) {\r\n            const date = new Date(year, month + 1, d);\r\n            days.push(this._buildDay(date, false, today, selected, min, max));\r\n        }\r\n\r\n        return days;\r\n    });\r\n\r\n    toggleCalendar(): void {\r\n        if (this.isDisabled()) return;\r\n        this.isOpen.update((v) => !v);\r\n        if (this.isOpen()) {\r\n            const selected = this._selectedDate();\r\n            if (selected) {\r\n                this._viewDate.set(new Date(selected.getFullYear(), selected.getMonth(), 1));\r\n            }\r\n        }\r\n    }\r\n\r\n    selectDay(day: CalendarDay): void {\r\n        if (day.isDisabled) return;\r\n        this._selectedDate.set(day.date);\r\n        this._onChange(day.date);\r\n        this.isOpen.set(false);\r\n    }\r\n\r\n    prevMonth(): void {\r\n        const d = this._viewDate();\r\n        this._viewDate.set(new Date(d.getFullYear(), d.getMonth() - 1, 1));\r\n    }\r\n\r\n    nextMonth(): void {\r\n        const d = this._viewDate();\r\n        this._viewDate.set(new Date(d.getFullYear(), d.getMonth() + 1, 1));\r\n    }\r\n\r\n    goToToday(): void {\r\n        const today = new Date();\r\n        this._selectedDate.set(today);\r\n        this._viewDate.set(new Date(today.getFullYear(), today.getMonth(), 1));\r\n        this._onChange(today);\r\n        this.isOpen.set(false);\r\n    }\r\n\r\n    clear(): void {\r\n        this._selectedDate.set(null);\r\n        this._onChange(null);\r\n    }\r\n\r\n    @HostListener('document:click', ['$event'])\r\n    _onDocClick(event: MouseEvent): void {\r\n        if (!this._el.nativeElement.contains(event.target as Node)) {\r\n            this.isOpen.set(false);\r\n        }\r\n    }\r\n\r\n    @HostListener('keydown.escape')\r\n    _onEsc(): void {\r\n        this.isOpen.set(false);\r\n    }\r\n\r\n    // — ControlValueAccessor —\r\n\r\n    writeValue(val: unknown): void {\r\n        this._selectedDate.set(val instanceof Date ? val : val ? new Date(val as string) : null);\r\n    }\r\n\r\n    registerOnChange(fn: (val: Date | null) => void): void {\r\n        this._onChange = fn;\r\n    }\r\n\r\n    registerOnTouched(fn: () => void): void {\r\n        this._onTouched = fn;\r\n    }\r\n\r\n    setDisabledState(isDisabled: boolean): void {\r\n        this._formDisabled.set(isDisabled);\r\n    }\r\n\r\n    // — Private helpers —\r\n\r\n    private _buildDay(\r\n        date: Date,\r\n        isCurrentMonth: boolean,\r\n        today: Date,\r\n        selected: Date | null,\r\n        min: Date | null,\r\n        max: Date | null,\r\n    ): CalendarDay {\r\n        const isToday =\r\n            date.getDate() === today.getDate() &&\r\n            date.getMonth() === today.getMonth() &&\r\n            date.getFullYear() === today.getFullYear();\r\n        const isSelected = selected\r\n            ? date.getDate() === selected.getDate() &&\r\n            date.getMonth() === selected.getMonth() &&\r\n            date.getFullYear() === selected.getFullYear()\r\n            : false;\r\n\r\n        let isDisabled = false;\r\n        if (min) {\r\n            const minDay = new Date(min.getFullYear(), min.getMonth(), min.getDate());\r\n            isDisabled = date < minDay;\r\n        }\r\n        if (max && !isDisabled) {\r\n            const maxDay = new Date(max.getFullYear(), max.getMonth(), max.getDate());\r\n            isDisabled = date > maxDay;\r\n        }\r\n\r\n        return { date, day: date.getDate(), isCurrentMonth, isToday, isSelected, isDisabled };\r\n    }\r\n\r\n    private _formatDate(d: Date): string {\r\n        const yyyy = d.getFullYear();\r\n        const mm = String(d.getMonth() + 1).padStart(2, '0');\r\n        const dd = String(d.getDate()).padStart(2, '0');\r\n\r\n        return this.format()\r\n            .replace('yyyy', String(yyyy))\r\n            .replace('MM', mm)\r\n            .replace('dd', dd);\r\n    }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { BlocDatePickerComponent } from './date-picker.component';\r\n\r\n@NgModule({\r\n    imports: [BlocDatePickerComponent],\r\n    exports: [BlocDatePickerComponent],\r\n})\r\nexport class BlocDatePickerModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "@bloc-ui/date-picker",
+  "version": "0.0.1",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/debasish1996/BLOC-UI.git",
+    "directory": "projects/bloc-ui-date-picker"
+  },
+  "peerDependencies": {
+    "@angular/common": "^21.2.0",
+    "@angular/core": "^21.2.0",
+    "@angular/forms": "^21.2.0"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
+  "sideEffects": false,
+  "module": "fesm2022/bloc-ui-date-picker.mjs",
+  "typings": "types/bloc-ui-date-picker.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./types/bloc-ui-date-picker.d.ts",
+      "default": "./fesm2022/bloc-ui-date-picker.mjs"
+    }
+  }
+}

package/types/bloc-ui-date-picker.d.ts

@@ -0,0 +1,72 @@
+import * as _angular_core from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+
+interface CalendarDay {
+    date: Date;
+    day: number;
+    isCurrentMonth: boolean;
+    isToday: boolean;
+    isSelected: boolean;
+    isDisabled: boolean;
+}
+/**
+ * Date picker component with calendar dropdown.
+ *
+ * ```html
+ * <bloc-date-picker [(ngModel)]="selectedDate" />
+ * <bloc-date-picker [formControl]="dateCtrl" placeholder="Choose date" />
+ * ```
+ */
+declare class BlocDatePickerComponent implements ControlValueAccessor {
+    private readonly _el;
+    /** Preset size. Defaults to `'md'`. */
+    readonly size: _angular_core.InputSignal<"sm" | "md" | "lg">;
+    /** Placeholder text for the input. */
+    readonly placeholder: _angular_core.InputSignal<string>;
+    /** Date format for display. Defaults to `'yyyy-MM-dd'`. */
+    readonly format: _angular_core.InputSignal<string>;
+    /** Disable the date picker via template binding. */
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    /** Minimum selectable date. */
+    readonly minDate: _angular_core.InputSignal<Date | null>;
+    /** Maximum selectable date. */
+    readonly maxDate: _angular_core.InputSignal<Date | null>;
+    readonly weekdays: string[];
+    /** Currently selected date. */
+    readonly _selectedDate: _angular_core.WritableSignal<Date | null>;
+    /** Whether the calendar dropdown is open. */
+    readonly isOpen: _angular_core.WritableSignal<boolean>;
+    /** The month being viewed (year + month). */
+    readonly _viewDate: _angular_core.WritableSignal<Date>;
+    private readonly _formDisabled;
+    readonly isDisabled: _angular_core.Signal<boolean>;
+    private _onChange;
+    _onTouched: () => void;
+    readonly displayValue: _angular_core.Signal<string>;
+    readonly monthYearLabel: _angular_core.Signal<string>;
+    readonly calendarDays: _angular_core.Signal<CalendarDay[]>;
+    toggleCalendar(): void;
+    selectDay(day: CalendarDay): void;
+    prevMonth(): void;
+    nextMonth(): void;
+    goToToday(): void;
+    clear(): void;
+    _onDocClick(event: MouseEvent): void;
+    _onEsc(): void;
+    writeValue(val: unknown): void;
+    registerOnChange(fn: (val: Date | null) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    private _buildDay;
+    private _formatDate;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BlocDatePickerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<BlocDatePickerComponent, "bloc-date-picker", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "format": { "alias": "format"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+declare class BlocDatePickerModule {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BlocDatePickerModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<BlocDatePickerModule, never, [typeof BlocDatePickerComponent], [typeof BlocDatePickerComponent]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<BlocDatePickerModule>;
+}
+
+export { BlocDatePickerComponent, BlocDatePickerModule };