ngxsmk-datepicker 3.0.1-beta.1 → 3.0.3

package/CHANGELOG.md

@@ -2,13 +2,33 @@
 
 All notable changes to this project will be documented in this file.
 
-**Last updated:** July 11, 2026 - **Current stable:** v2.4.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ## [Unreleased]
 
+## [3.0.3] - 2026-07-29
+
+### Added
+
+- **Option to disable responsive layout**: Added `[responsive]` input on `ngxsmk-datepicker` (and `responsive?: boolean` in `DatepickerConfig`), defaulting to `true`. When set to `false`, viewport-based `@media (max-width: ...)` overrides are disabled, enabling fixed-size inline/embedded usage without viewport width affecting layout ([#299](https://github.com/NGXSMK/ngxsmk-datepicker/issues/299)).
+- **Adjacent Month Days (`[showOtherMonths]`)**: Added `[showOtherMonths]` input option to display trailing and leading days from adjacent months in the 6-row calendar grid.
+- **Enhanced WCAG 1.3.1 Weekday Headers**: Added `role="columnheader"` and localized full day name `aria-label`s on weekday header cells for screen reader accessibility.
+- **Range Selection ARIA Announcements**: Added dynamic ARIA live region announcements (`startDateSelected`) when selecting range start dates.
+
+### Fixed
+
+- **Year & Period Selection Logic**: Fixed year mode full-range selection, range disablement for `minDate`/`maxDate`, auto-close behavior in period modes (`year`, `month`, `quarter`, `week`), and UI selection highlighting.
+- **Date-Time Preservation on Selection**: Preserved existing time (hours/minutes) when selecting a new date in date+time mode ([#30181](https://github.com/angular/components/issues/30181)).
+- **DST Hour Mapping**: Fixed Luxon / Intl timezone hour mapping edge cases during Daylight Saving Time (DST) spring-forward/fall-back transitions ([#31803](https://github.com/angular/components/issues/31803)).
+- **iOS Safari Background Scroll Lock**: Added automatic body scroll lock (`.ngxsmk-scroll-locked`) when popover overlay is open on touch devices ([#14938](https://github.com/angular/components/issues/14938)).
+- **External Reset Selection Clearing**: Ensured memoized cell selection highlights clear immediately when external form value resets to `null` while calendar is open ([#29877](https://github.com/angular/components/issues/29877)).
+- **Responsive CSS overrides & specificity**: Dropped `!important` flags from responsive `@media` rules in `datepicker.css` and scoped them under `.ngxsmk-datepicker-wrapper:not(.ngxsmk-no-responsive)` ([#299](https://github.com/NGXSMK/ngxsmk-datepicker/issues/299)).
+
+## [3.0.2] - 2026-07-24
+
 ### Added
 
 - **`ng add ngxsmk-datepicker` schematic**: installs the package, adds the missing `luxon` peer

package/MIGRATION.md

@@ -2,11 +2,11 @@
 
 This document provides migration instructions for upgrading between major versions of ngxsmk-datepicker.
 
-**Last updated:** July 11, 2026 - **Current stable:** v2.4.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 ## Table of Contents
 
-- [v2.4.0 → next release](#v240---next-release)
+- [v2.4.0 → v3.0.3](#v240---v302)
 - [v2.2.15 → v2.3.1](#v2215---v231)
 - [v2.2.7 → v2.2.11](#v227---v228)
 - [v2.2.6 → v2.2.7](#v226---v227)
@@ -60,7 +60,7 @@ This document provides migration instructions for upgrading between major versio
 - [v1.8.0 → v1.9.0](#v180---v190)
 - [v1.7.0 → v1.8.0](#v170---v180)
 
-## v2.4.0 → next release
+## v2.4.0 → v3.0.3
 
 ### Changes
 

package/README.md

@@ -28,15 +28,15 @@
 
 ---
 
-**Last updated:** July 24, 2026 - **Current stable:** v3.0.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 ### **Overview**
 
 **ngxsmk-datepicker** is a high-performance, enterprise-ready date and range picker engineered for the modern Angular ecosystem (v17+). Built from the ground up with **Angular Signals**, it delivers a seamless, zoneless-ready experience for both desktop and mobile (Ionic) applications.
 
-> **Stable Release**: `v3.0.0` is the current stable release with compiled `fesm2022` output and type declarations.
+> **Stable Release**: `v3.0.3` is the current stable release with compiled `fesm2022` output and type declarations.
 >
-> **Stable line**: v2.3.x includes side-by-side **`calendars`**, **natural language input**, searchable **timezone selection dropdown UI**, dynamic range presets, and warning range highlighting. Versions **2.0.10** and **2.0.11** were broken and have been **unpublished**; use **v2.1.1+** or current **v3.0.0** on npm.
+> **Stable line**: v2.3.x includes side-by-side **`calendars`**, **natural language input**, searchable **timezone selection dropdown UI**, dynamic range presets, and warning range highlighting. Versions **2.0.10** and **2.0.11** were broken and have been **unpublished**; use **v2.1.1+** or current **v3.0.3** on npm.
 
 ---
 
@@ -78,6 +78,8 @@
 ### **Advanced Functionality**
 
 - 📅 **Google Calendar Sync**: Built-in support for seamlessly syncing and displaying events natively from Google Calendar.
+- 🗓️ **Adjacent Month Days (`showOtherMonths`)**: Display trailing and leading days from adjacent months in the calendar grid.
+- 📐 **Responsive Control (`[responsive]`)**: Disable viewport max-width responsive overrides for fixed-width container embedding (#299).
 - 🌐 **8-Language i18n**: Full localization for `en`, `de`, `es`, `sv`, `ko`, `zh`, `ja`, and `fr`.
 - 🔢 **ISO Week Numbers**: Optional week-number column via `[showWeekNumbers]`.
 - ⌨️ **Guided Input Masking**: `[inputMask]` auto-inserts separators as users type (e.g. `12` → `12/`).
@@ -91,16 +93,23 @@
 
 ## Why this library?
 
-Use **ngxsmk-datepicker** when you want a focused **date / range picker** with strong **mobile**, **i18n**, **timezone**, and **SSR** story on **Angular 17+**, without adopting a full Material UI stack. It is a **standalone** component with **Luxon** as the single date peer (plus Angular).
+Use **ngxsmk-datepicker** when you want an enterprise-grade **date / range picker** with strong **mobile**, **i18n**, **timezone**, **Ionic**, and **SSR** support on **Angular 17–22+**, without adopting a heavy Material UI stack or legacy Day.js dependencies.
 
-| | ngxsmk-datepicker | Angular Material datepicker |
-| --- | --- | --- |
-| **Fit** | Picker-first; optional Material/CDK peers for overlays only | Part of Material; best when you already use Material forms & CDK |
-| **Peer deps** | Angular + **Luxon** | **@angular/material** + **@angular/cdk** |
-| **Forms** | Template-driven, Reactive Forms, Signals; **Signal Forms** (`[field]`) on Angular 21+ | Reactive + template-driven; integrates with Material form field |
-| **Stack** | Tree-shakable package aimed at picker scenarios | Broader design system and bundle footprint |
+### Feature Comparison Matrix
 
-This is **not** a drop-in replacement for every Material datepicker API; choose based on whether you need **Material’s form-field ecosystem** or a **standalone picker** you can theme and ship with **zoneless** / **SSR** setups. See the [live demo](https://ngxsmk.github.io/ngxsmk-datepicker/) and [COMPATIBILITY](https://github.com/NGXSMK/ngxsmk-datepicker/blob/main/projects/ngxsmk-datepicker/docs/COMPATIBILITY.md) for details.
+| Feature / Capability | ngxsmk-datepicker | Angular Material datepicker | vlio20/angular-datepicker |
+| --- | --- | --- | --- |
+| **Angular 17–22+ Signals Engine** | ⚡ Native Signals (0% Zone.js) | ⚠️ RxJS / Legacy ChangeDetector | ❌ Legacy Angular 15-18 |
+| **Standalone Component & Zero CDK** | ✅ Yes (Lightweight ~127KB) | ❌ Requires `@angular/material` + `@angular/cdk` | ⚠️ Requires legacy CDK |
+| **Mobile & Touch (Ionic 7/8+)** | 📱 Built-in Touch & Safe Area Insets | ⚠️ Mobile UI requires custom CSS | ❌ Poor Mobile / iOS support |
+| **Date-Time Preservation (#30181)** | ✅ Preserves hours/minutes on click | ❌ Resets time on date click | ❌ No native time preservation |
+| **Adjacent Month Days (`showOtherMonths`)** | ✅ Built-in input | ⚠️ Not supported natively | ⚠️ Partial support |
+| **Fixed Container Control (`[responsive]`)** | ✅ Built-in input (#299) | ❌ Not supported | ❌ Not supported |
+| **Signal Forms Native (`[field]`)** | ✅ Built-in (Angular 21+) | ❌ Not supported | ❌ Not supported |
+| **Google Calendar Sync & Multi-Calendars** | ✅ Built-in | ❌ Requires custom code | ❌ Not supported |
+| **SSR / Hydration Safety** | ✅ 100% Guarded (`DOCUMENT`) | ⚠️ Requires CDK SSR overlays | ❌ Window access errors |
+
+This is **not** a heavy UI framework; it is a **standalone datepicker** engineered for maximum performance, accessibility, and theming flexibility. See the [live demo](https://ngxsmk.github.io/ngxsmk-datepicker/) and [COMPATIBILITY](https://github.com/NGXSMK/ngxsmk-datepicker/blob/main/projects/ngxsmk-datepicker/docs/COMPATIBILITY.md) for details.
 
 ## **🌐 Discoverability**
 
@@ -177,7 +186,7 @@ ng add ngxsmk-datepicker
 The `ng add` schematic installs the package, adds the `luxon` peer dependency if it is missing, and prints a getting-started snippet. Plain npm works too:
 
 ```bash
-npm install ngxsmk-datepicker@3.0.0
+npm install ngxsmk-datepicker@3.0.3
 ```
 
 ### Alternative installation
@@ -186,12 +195,12 @@ You can install without npm using any of these methods (peer dependencies must s
 
 | Method | Command |
 |--------|--------|
-| **Yarn** | `yarn add ngxsmk-datepicker@3.0.0` |
-| **pnpm** | `pnpm add ngxsmk-datepicker@3.0.0` |
-| **Bun** | `bun add ngxsmk-datepicker@3.0.0` |
-| **From Git** | `npm install github:NGXSMK/ngxsmk-datepicker#v3.0.0` (requires the repo to have built output or you build from source) |
+| **Yarn** | `yarn add ngxsmk-datepicker@3.0.3` |
+| **pnpm** | `pnpm add ngxsmk-datepicker@3.0.3` |
+| **Bun** | `bun add ngxsmk-datepicker@3.0.3` |
+| **From Git** | `npm install github:NGXSMK/ngxsmk-datepicker#v3.0.3` (requires the repo to have built output or you build from source) |
 | **Local path** | Build the library in the repo (`npx ng build ngxsmk-datepicker`), then `npm install /path/to/ngxsmk-datepicker/dist/ngxsmk-datepicker` |
-| **CDN (ESM)** | Use [unpkg](https://unpkg.com/ngxsmk-datepicker@3.0.0/) or [jsDelivr](https://cdn.jsdelivr.net/npm/ngxsmk-datepicker@3.0.0/) in your bundler or import map; peer dependencies (Angular, etc.) must be installed in your app. |
+| **CDN (ESM)** | Use [unpkg](https://unpkg.com/ngxsmk-datepicker@3.0.3/) or [jsDelivr](https://cdn.jsdelivr.net/npm/ngxsmk-datepicker@3.0.3/) in your bundler or import map; peer dependencies (Angular, etc.) must be installed in your app. |
 
 For all options and caveats, see [docs/INSTALLATION.md](docs/INSTALLATION.md).
 
@@ -919,7 +928,7 @@ We welcome and appreciate contributions from the community! Whether it's reporti
 
 ## **📄 Changelog**
 
-**Recent:** Use **v3.0.0** on npm. The v2.3.x line adds side-by-side multi-calendar layouts, natural language typing, timezone selector UI dropdown, warning style selections, and strict TypeScript/AOT stability. Versions 2.0.10 and 2.0.11 are unpublished; use v2.1.1+ or **v3.0.0**.
+**Recent:** Use **v3.0.3** on npm. The v2.3.x line adds side-by-side multi-calendar layouts, natural language typing, timezone selector UI dropdown, warning style selections, and strict TypeScript/AOT stability. Versions 2.0.10 and 2.0.11 are unpublished; use v2.1.1+ or **v3.0.3**.
 
 For the full list of changes, see [CHANGELOG.md](https://github.com/NGXSMK/ngxsmk-datepicker/blob/main/CHANGELOG.md).
 

package/docs/API.md

@@ -2,7 +2,7 @@
 
 This document describes the stable public API of ngxsmk-datepicker with comprehensive real-world examples. APIs marked as **stable** are guaranteed to remain backward-compatible within the same major version. APIs marked as **experimental** may change in future releases.
 
-**Version**: 3.0.0+ (includes unreleased `main` additions) | **Last updated**: July 24, 2026
+**Version**: 3.0.3+ (includes unreleased `main` additions) | **Last updated**: July 24, 2026
 
 ## Stable vs experimental
 
@@ -60,6 +60,8 @@ import { NgxsmkDatepickerComponent } from 'ngxsmk-datepicker';
 | `locale` | `string` | `'en-US'` | Stable | Locale for formatting | `locale="de-DE"` or `[locale]="'fr-FR'"` |
 | `theme` | `'light' \| 'dark'` | `'light'` | Stable | Color theme | `[theme]="'dark'"` |
 | `inline` | `boolean \| 'always' \| 'auto'` | `false` | Stable | Inline display mode | `[inline]="true"` or `inline="auto"` |
+| `showOtherMonths` | `boolean` | `false` | Stable | Display trailing and leading days from adjacent months in the 6-row calendar grid | `[showOtherMonths]="true"` |
+| `responsive` | `boolean` | `true` | Stable | Enable/disable viewport max-width responsive layout rules | `[responsive]="false"` |
 | `showTime` | `boolean` | `false` | Stable | Show time selection | `[showTime]="true"` |
 | `timeOnly` | `boolean` | `false` | Stable | Display time picker only (no calendar). Automatically enables `showTime`. | `[timeOnly]="true"` |
 | `allowTyping` | `boolean` | `false` | Stable | Enable manual typing in the input field. Required for native validation. | `[allowTyping]="true"` |

package/docs/COMPATIBILITY.md

@@ -1,6 +1,6 @@
-# Version Compatibility Matrix
+# Version Compatibility Matrix
 
-**Last updated:** July 24, 2026 - **Current stable:** v3.0.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 This document provides comprehensive compatibility information for `ngxsmk-datepicker` across different Angular versions, Zone.js configurations, and SSR/CSR setups.
 

package/docs/INTEGRATION.md

@@ -1,6 +1,6 @@
-# Integration Guides
+# Integration Guides
 
-**Last updated:** July 24, 2026 - **Current stable:** v3.0.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 This document provides integration examples for using ngxsmk-datepicker with popular frameworks and libraries.
 

package/docs/IONIC_INTEGRATION.md

@@ -1,6 +1,6 @@
-# Ionic Framework Integration Guide
+# Ionic Framework Integration Guide
 
-**Last updated:** July 24, 2026 - **Current stable:** v3.0.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 This guide provides step-by-step instructions for integrating ngxsmk-datepicker with Ionic Angular applications.
 

package/docs/LOCALE-GUIDE.md

@@ -1,6 +1,6 @@
-# Locale Packs & i18n Contributor Guide
+# Locale Packs & i18n Contributor Guide
 
-**Last updated:** July 24, 2026 - **Current stable:** v3.0.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 Guide for adding locale support and contributing translations to ngxsmk-datepicker.
 

package/docs/PLUGIN-ARCHITECTURE.md

@@ -1,6 +1,6 @@
-# Plugin Architecture
+# Plugin Architecture
 
-**Last updated:** July 24, 2026 - **Current stable:** v3.0.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 ngxsmk-datepicker features a powerful **plugin architecture** that allows you to extend and customize the component's behavior without modifying its core code. This architecture is built on a **hook-based system** that provides extension points throughout the component's lifecycle.
 

package/docs/SSR-EXAMPLE.md

@@ -1,6 +1,6 @@
-# Server-Side Rendering (SSR) Example
+# Server-Side Rendering (SSR) Example
 
-**Last updated:** July 24, 2026 - **Current stable:** v3.0.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 Complete example demonstrating ngxsmk-datepicker with Angular Universal (SSR).
 

package/docs/THEME-TOKENS.md

@@ -1,6 +1,6 @@
-# Theme Tokens & CSS Custom Properties
+# Theme Tokens & CSS Custom Properties
 
-**Last updated:** July 24, 2026 - **Current stable:** v3.0.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 Complete reference for all CSS custom properties (CSS variables) available in ngxsmk-datepicker.
 

package/docs/TIMEZONE.md

@@ -1,6 +1,6 @@
-# Timezone Support
+# Timezone Support
 
-**Last updated:** July 24, 2026 - **Current stable:** v3.0.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 ## Overview
 

package/docs/extension-points.md

@@ -1,6 +1,6 @@
-# Extension Points and Hooks
+# Extension Points and Hooks
 
-**Last updated:** July 24, 2026 - **Current stable:** v3.0.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 ngxsmk-datepicker provides comprehensive extension points through the `hooks` input, allowing you to customize rendering, validation, keyboard shortcuts, formatting, and event handling.
 

package/docs/signal-forms.md

@@ -1,6 +1,6 @@
-# Signal Forms Integration
+# Signal Forms Integration
 
-**Last updated:** July 24, 2026 - **Current stable:** v3.0.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 This guide covers using ngxsmk-datepicker with Angular 21+ Signal Forms API.
 

package/docs/signals.md

@@ -1,6 +1,6 @@
-# Signals Integration Guide
+# Signals Integration Guide
 
-**Last updated:** July 24, 2026 - **Current stable:** v3.0.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 ngxsmk-datepicker is fully compatible with Angular Signals, providing seamless integration with both traditional reactive forms and modern signal-based patterns.
 

package/docs/ssr.md

@@ -1,6 +1,6 @@
-# Server-Side Rendering (SSR) Guide
+# Server-Side Rendering (SSR) Guide
 
-**Last updated:** July 24, 2026 - **Current stable:** v3.0.0
+**Last updated:** July 29, 2026 - **Current stable:** v3.0.3
 
 ngxsmk-datepicker is fully compatible with Angular Universal and server-side rendering. This guide covers SSR setup, best practices, and troubleshooting.