ngxsmk-datepicker 2.3.1 → 2.4.0

package/docs/FEATURE_SCOPING.md

@@ -1,60 +0,0 @@
-# Feature scoping: Enhanced Localization & Enhanced Time Selection
-
-**Last updated:** May 2, 2026 · Aligns with [ROADMAP.md](../../../ROADMAP.md) (Current Focus).
-
-This document defines **concrete inputs and behaviors** for roadmap items *Enhanced Localization* and *Enhanced Time Selection* so implementations can proceed without API ambiguity. Until shipped, treat these as **design proposals**; minor renames may occur in minor releases with changelog notes.
-
----
-
-## Enhanced Localization
-
-### Existing building blocks
-
-- `@Input() locale: string` — BCP 47 locale tag.
-- `@Input() displayFormat` / `dateFormatPattern` — custom format strings (see README).
-- `@Input() weekStart` — override first day of week.
-- `@Input() rtl` — explicit RTL override.
-
-### Proposed additions (backlog)
-
-| Input | Type | Purpose |
-|-------|------|---------|
-| `numberingSystem` | `'latn' \| 'arab' \| 'arabext' \| ... \| undefined` | Pass-through to `Intl` / formatting where supported; `undefined` = locale default. |
-| `calendarPreference` | `'gregory' \| 'iso8601' \| undefined` | Opt-in calendar system for display (browser capability dependent). |
-| `currencyDisplayForAddons` | `'symbol' \| 'narrowSymbol' \| 'code'` | If future price/booking templates show currency beside dates. |
-
-### Non-input work
-
-- Expand **preset format tokens** documentation table (mirror Angular `DatePipe` where aligned).
-- Optional **`Intl.NumberFormat`** wrapper for footer chips / custom templates.
-
----
-
-## Enhanced Time Selection
-
-### Existing building blocks
-
-- `@Input() showTime`, `showSeconds`, `use24Hour`, `minuteInterval`, `secondInterval`
-- `@Input() timezone` — IANA zone for “today” and conversions ([timezone.utils](../src/lib/utils/timezone.utils.ts))
-- `@Input() timeRangeMode` — paired times in range mode
-- `@Input() mobileTimePickerStyle`
-
-### Proposed additions (backlog)
-
-| Input | Type | Purpose |
-|-------|------|---------|
-| `timeZoneDisplay` | `'short' \| 'long' \| 'shortOffset' \| 'longOffset'` | How zone appears next to time when `timezone` is set (Intl-dependent). |
-| `showTimezoneSelector` | `boolean` | Future: opt-in UI to pick among a bounded list of zones (requires design). |
-| `timeStepRounding` | `'floor' \| 'ceil' \| 'nearest'` | When snapping typed times to `minuteInterval`. |
-
-### Behaviors to clarify in docs
-
-- **Range + time**: document ordering of date vs. time commit when `showTime` is true (single source of truth in component today).
-- **DST transitions**: document that normalization uses the configured `timezone` utilities.
-
----
-
-## Versioning
-
-- New `@Input()` names land in **minor** releases with defaults preserving current behavior.
-- Breaking renames only in **major** releases per [MIGRATION.md](../../../MIGRATION.md).

package/docs/IONIC_TESTING.md

@@ -1,148 +0,0 @@
-# Ionic Integration Testing Guide
-
-**Last updated:** June 3, 2026 - **Current stable:** v2.3.1
-
-This document provides comprehensive testing instructions for verifying ngxsmk-datepicker compatibility with Ionic Framework.
-
-## Automated Tests
-
-### E2E Tests
-
-Run the Ionic integration E2E tests:
-
-```bash
-npm run e2e -- e2e/ionic-integration.spec.ts
-```
-
-### Test Coverage
-
-The E2E tests cover:
-- Focus management
-- Keyboard behavior
-- ion-modal integration
-- ion-popover integration
-- Scroll behavior
-- SSR compatibility
-- Safe area insets
-
-## Manual Testing
-
-See `e2e/ionic-test-manual.md` for detailed manual testing instructions.
-
-## Test Components
-
-### Using the Test Component
-
-1. **Add to your Ionic app**:
-   ```typescript
-   import { IonicTestComponent } from './ionic-test/ionic-test.component';
-   
-   @Component({
-     imports: [IonicTestComponent],
-     template: '<app-ionic-test></app-ionic-test>'
-   })
-   ```
-
-2. **Add route**:
-   ```typescript
-   { path: 'ionic-test', component: IonicTestComponent }
-   ```
-
-3. **Navigate to test page** and follow manual testing guide
-
-## Test Scenarios Summary
-
-### ✅ Focus Management
-- **Test**: Verify focus trapping doesn't conflict with Ionic
-- **Status**: Automated + Manual testing required
-- **Files**: `e2e/ionic-integration.spec.ts` (Focus Management section)
-
-### ✅ Keyboard Behavior
-- **Test**: Verify keyboard show/hide on iOS and Android
-- **Status**: Automated + Manual testing required
-- **Files**: `e2e/ionic-integration.spec.ts` (Keyboard Behavior section)
-
-### ✅ ion-modal Integration
-- **Test**: Verify datepicker works inside Ionic modals
-- **Status**: Automated + Manual testing required
-- **Files**: `e2e/ionic-integration.spec.ts` (ion-modal Integration section)
-
-### ✅ ion-popover Integration
-- **Test**: Verify datepicker works inside Ionic popovers
-- **Status**: Automated + Manual testing required
-- **Files**: `e2e/ionic-integration.spec.ts` (ion-popover Integration section)
-
-### ✅ Scroll Behavior
-- **Test**: Verify scrolling works correctly in ion-content
-- **Status**: Automated + Manual testing required
-- **Files**: `e2e/ionic-integration.spec.ts` (Scroll Behavior section)
-
-### ✅ SSR Compatibility
-- **Test**: Verify server-side rendering works with Ionic
-- **Status**: Automated + Manual testing required
-- **Files**: `e2e/ionic-integration.spec.ts` (SSR Compatibility section)
-
-## Running Tests
-
-### All Tests
-```bash
-npm run e2e
-```
-
-### Specific Test File
-```bash
-npx playwright test e2e/ionic-integration.spec.ts
-```
-
-### Specific Test
-```bash
-npx playwright test e2e/ionic-integration.spec.ts -g "Focus Management"
-```
-
-### Mobile Viewport
-```bash
-npx playwright test e2e/ionic-integration.spec.ts --project="Mobile Chrome"
-```
-
-### iOS Safari
-```bash
-npx playwright test e2e/ionic-integration.spec.ts --project="Mobile Safari"
-```
-
-## Test Results
-
-After running tests, check:
-- Test report: `test-results/`
-- Screenshots: `test-results/` (on failure)
-- Videos: `test-results/` (on failure)
-- HTML report: `playwright-report/`
-
-## Continuous Integration
-
-Add to your CI pipeline:
-
-```yaml
-# .github/workflows/test-ionic.yml
-name: Ionic Integration Tests
-
-on: [push, pull_request]
-
-jobs:
-  test:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
-      - run: npm install
-      - run: npm run e2e -- e2e/ionic-integration.spec.ts
-```
-
-## Next Steps
-
-1. **Run automated tests** to verify basic functionality
-2. **Perform manual testing** on real devices
-3. **Test in your Ionic app** with real use cases
-4. **Report issues** with detailed information
-
-
-

package/docs/REFACTOR_PLAN.md

@@ -1,38 +0,0 @@
-# Refactor plan: thin `NgxsmkDatepickerComponent`
-
-**Last updated:** May 2, 2026
-
-This plan operationalizes [IMPROVEMENT_REPORT.md](../../IMPROVEMENT_REPORT.md) items **1.1**–**1.6** without blocking feature work. Phases are incremental and test-backed.
-
-## Goals
-
-- Move orchestration of calendar **generation** and **month arrays** behind `CalendarGenerationService` (already exists—expand responsibilities).
-- Move **input ↔ model** normalization boundaries closer to `DatepickerParsingService` / a thin `InputFacade`.
-- Keep **public `@Input` / `@Output` API** stable unless explicitly versioned.
-
-## Phase 1 — Boundaries only (low risk)
-
-1. List public methods on `NgxsmkDatepickerComponent` that only delegate to `CalendarGenerationService`; replace with direct service calls from tests where duplicated.
-2. Ensure `generateCalendar()` becomes a thin orchestrator: **invalidate revision signals → assign `multiCalendarMonths` → CD**.
-
-## Phase 2 — Extract pure builders
-
-1. Move `buildCalendarMonths` logic that does not need component closure into `CalendarGenerationService` with explicit parameters (`firstDayOfWeek`, `syncScroll`, `count`).
-2. Unit-test service methods in isolation with Jasmine.
-
-## Phase 3 — Parsing facade
-
-1. Route typed-input updates through `DatepickerParsingService` + single `applyUserInput()` private method on the component.
-2. Reduce branching between native picker vs. text input vs. inline.
-
-## Phase 4 — Touch / positioning (optional)
-
-1. Confirm `TouchGestureHandlerService` and `PopoverPositioningService` own all DOM measurements; component emits intents only.
-
-## Verification
-
-- `npm run test` (ngxsmk-datepicker project)
-- `npm run e2e` with demo-app smoke + playground scenarios
-- Bundle size check script if touching public exports
-
-See also [FEATURE_SCOPING.md](./FEATURE_SCOPING.md) for upcoming API additions.

package/docs/SEO.md

@@ -1,214 +0,0 @@
-# SEO Optimization Guide
-
-**Last updated:** June 3, 2026 - **Current stable:** v2.3.1
-
-This document outlines the SEO optimizations implemented for ngxsmk-datepicker to improve search engine visibility and discoverability.
-
-## Overview
-
-ngxsmk-datepicker has been optimized for search engines with comprehensive meta tags, structured data, semantic HTML, and proper content organization.
-
-## Implemented SEO Features
-
-### 1. Meta Tags
-
-#### Primary Meta Tags
-- **Title**: Optimized with primary keywords and brand name
-- **Description**: Compelling description with key features and benefits
-- **Keywords**: Comprehensive keyword list covering all use cases
-- **Author**: Proper attribution
-- **Robots**: Optimized for indexing and crawling
-- **Canonical URL**: Prevents duplicate content issues
-
-#### Open Graph Tags
-- Complete Open Graph implementation for social media sharing
-- Optimized images with proper dimensions
-- Multi-locale support
-- Article metadata
-
-#### Twitter Card Tags
-- Summary large image card
-- Creator attribution
-- Additional metadata labels
-
-### 2. Structured Data (Schema.org)
-
-#### SoftwareApplication Schema
-- Complete application information
-- Author and publisher details
-- Version information
-- License and repository links
-- Screenshots and descriptions
-
-#### WebPage Schema
-- Page hierarchy and breadcrumbs
-- Language specification
-- Main entity relationships
-
-#### HowTo Schema
-- Step-by-step installation guide
-- Usage instructions
-- Linked to relevant sections
-
-### 3. Technical SEO
-
-#### robots.txt
-- Proper crawl directives
-- Sitemap reference
-- Disallow rules for private areas
-
-#### sitemap.xml
-- Complete site structure
-- Priority and change frequency
-- Last modification dates
-- All important pages included
-
-#### Semantic HTML
-- Proper heading hierarchy (H1-H6)
-- ARIA labels and roles
-- Semantic HTML5 elements
-- Alt text for images
-
-### 4. Content Optimization
-
-#### README.md
-- Keyword-rich content
-- Clear headings and structure
-- Comprehensive feature list
-- Installation and usage guides
-- Code examples with proper formatting
-
-#### Documentation
-- Well-organized sections
-- Search-friendly content
-- Internal linking
-- Code examples with syntax highlighting
-
-### 5. Performance SEO
-
-#### Bundle Size
-- Lightweight bundle (~127KB)
-- Tree-shakeable exports
-- Minimal dependencies
-
-#### SSR Support
-- Server-side rendering compatible
-- Fast initial page load
-- Improved Core Web Vitals
-
-#### Accessibility
-- WCAG compliant
-- Keyboard navigation
-- Screen reader support
-- ARIA attributes
-
-## Best Practices for Users
-
-### When Using ngxsmk-datepicker in Your App
-
-1. **Add Semantic HTML**
-   ```html
-   <label for="date-input">Select Date</label>
-   <ngxsmk-datepicker
-     id="date-input"
-     [value]="selectedDate"
-     aria-label="Date picker for selecting appointment date">
-   </ngxsmk-datepicker>
-   ```
-
-2. **Use Proper Headings**
-   ```html
-   <h1>Appointment Booking</h1>
-   <h2>Select Your Preferred Date</h2>
-   <ngxsmk-datepicker [value]="date"></ngxsmk-datepicker>
-   ```
-
-3. **Provide Context**
-   ```html
-   <section aria-labelledby="date-selection-heading">
-     <h2 id="date-selection-heading">Date Selection</h2>
-     <p>Choose a date for your appointment</p>
-     <ngxsmk-datepicker [value]="date"></ngxsmk-datepicker>
-   </section>
-   ```
-
-4. **Optimize Images**
-   - Use descriptive alt text
-   - Optimize image sizes
-   - Use appropriate formats (WebP, AVIF)
-
-5. **Page Speed**
-   - Lazy load components when possible
-   - Use SSR for better initial load
-   - Minimize JavaScript bundle size
-
-## SEO Checklist
-
-- [x] Meta tags (title, description, keywords)
-- [x] Open Graph tags
-- [x] Twitter Card tags
-- [x] Structured data (Schema.org)
-- [x] robots.txt
-- [x] sitemap.xml
-- [x] Canonical URLs
-- [x] Semantic HTML
-- [x] ARIA labels
-- [x] Alt text for images
-- [x] Proper heading hierarchy
-- [x] Mobile-friendly design
-- [x] Fast page load times
-- [x] SSR compatibility
-- [x] Accessibility features
-
-## Monitoring and Analytics
-
-### Google Search Console
-- Monitor search performance
-- Track keyword rankings
-- Identify crawl errors
-- Submit sitemap
-
-### Google Analytics
-- Track user behavior
-- Monitor page views
-- Analyze traffic sources
-- Measure engagement
-
-### Lighthouse Scores
-- Performance: Target 90+
-- Accessibility: Target 95+
-- Best Practices: Target 90+
-- SEO: Target 95+
-
-## Future Enhancements
-
-1. **International SEO**
-   - Multi-language support
-   - Hreflang tags
-   - Localized content
-
-2. **Rich Snippets**
-   - FAQ schema
-   - Review schema
-   - Video schema
-
-3. **Content Marketing**
-   - Blog posts
-   - Tutorials
-   - Case studies
-
-4. **Link Building**
-   - Community engagement
-   - Documentation improvements
-   - Example projects
-
-## Resources
-
-- [Google Search Central](https://developers.google.com/search)
-- [Schema.org Documentation](https://schema.org/)
-- [Open Graph Protocol](https://ogp.me/)
-- [Twitter Cards](https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/abouts-cards)
-- [Web.dev SEO Guide](https://web.dev/learn/seo/)
-
-
-