@nuraly/lumenui 0.2.1 → 0.3.2

package/dist/src/components/textarea/controllers/validation.controller.js

@@ -0,0 +1,315 @@
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { BaseValidationController } from '@nuralyui/common/controllers';
+/**
+ * Validation controller manages all validation logic for textarea components
+ * This controller handles:
+ * - Rule-based validation (required, patterns, custom validators, etc.)
+ * - Validation timing (change, blur, submit)
+ * - Validation state management
+ * - Error and warning messages
+ * - Character count validation
+ */
+export class TextareaValidationController extends BaseValidationController {
+    constructor() {
+        super(...arguments);
+        this._validationDebounceMs = 300;
+    }
+    /**
+     * Get the validation host with extended interface
+     */
+    get validationHost() {
+        return this._host;
+    }
+    /**
+     * Get current validation result
+     */
+    get validationResult() {
+        return this._validationResult;
+    }
+    /**
+     * Set validation debounce delay
+     */
+    setValidationDebounce(ms) {
+        this._validationDebounceMs = ms;
+    }
+    /**
+     * Validate the current value against all rules (base contract)
+     */
+    validate() {
+        return __awaiter(this, void 0, void 0, function* () {
+            const result = yield this.validateTextarea();
+            return result.isValid;
+        });
+    }
+    /**
+     * Validate the current value against all rules (textarea-specific, returns full result)
+     */
+    validateTextarea(value) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const valueToValidate = value !== null && value !== void 0 ? value : this.validationHost.value;
+            const rules = this.validationHost.rules || [];
+            // Don't run validation if there are no rules
+            if (rules.length === 0) {
+                this._validationResult = undefined;
+                return {
+                    isValid: true,
+                    messages: [],
+                    level: 'success',
+                    blocking: false
+                };
+            }
+            const messages = [];
+            let hasError = false;
+            let hasWarning = false;
+            let isBlocking = false;
+            for (const rule of rules) {
+                try {
+                    const isValid = yield rule.validator(valueToValidate);
+                    if (!isValid) {
+                        messages.push(rule.message);
+                        if (rule.level === 'error' || !rule.level) {
+                            hasError = true;
+                            if (rule.blocking !== false) {
+                                isBlocking = true;
+                            }
+                        }
+                        else if (rule.level === 'warning') {
+                            hasWarning = true;
+                        }
+                    }
+                }
+                catch (error) {
+                    this.handleError(error, 'validation');
+                    messages.push(`Validation error: ${error}`);
+                    hasError = true;
+                    isBlocking = true;
+                }
+            }
+            const level = hasError ? 'error' : hasWarning ? 'warning' : 'success';
+            this._validationResult = {
+                isValid: !hasError && !hasWarning,
+                messages,
+                level,
+                blocking: isBlocking
+            };
+            // Update shared state
+            this._isValid = this._validationResult.isValid;
+            this._validationMessage = messages.join(', ');
+            this._validationState = level === 'success' ? 'valid' : level;
+            // Update host state based on validation
+            this.updateHostValidationState();
+            // Dispatch validation event
+            this.dispatchTextareaValidationEvent();
+            return this._validationResult;
+        });
+    }
+    /**
+     * Validate with debouncing
+     */
+    validateDebounced(value) {
+        return new Promise((resolve) => {
+            if (this._validationTimeout) {
+                clearTimeout(this._validationTimeout);
+            }
+            this._validationTimeout = setTimeout(() => __awaiter(this, void 0, void 0, function* () {
+                const result = yield this.validateTextarea(value);
+                resolve(result);
+            }), this._validationDebounceMs);
+        });
+    }
+    /**
+     * Validate if change validation is enabled
+     */
+    validateOnChangeIfEnabled(value) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.validationHost.validateOnChange && (this.validationHost.rules || []).length > 0) {
+                return yield this.validateDebounced(value);
+            }
+            return undefined;
+        });
+    }
+    /**
+     * Validate if blur validation is enabled
+     */
+    validateOnBlurIfEnabled(value) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.validationHost.validateOnBlur && (this.validationHost.rules || []).length > 0) {
+                return yield this.validateTextarea(value);
+            }
+            return undefined;
+        });
+    }
+    /**
+     * Clear validation state
+     */
+    clearValidation() {
+        this._validationResult = undefined;
+        this._isValid = true;
+        this._validationMessage = '';
+        this._validationState = 'pristine';
+        if (this._validationTimeout) {
+            clearTimeout(this._validationTimeout);
+            this._validationTimeout = undefined;
+        }
+        // Reset state to default if it was set by validation
+        if (this.validationHost.state !== "default" /* TEXTAREA_STATE.Default */) {
+            this.validationHost.state = "default" /* TEXTAREA_STATE.Default */;
+            this.requestUpdate();
+        }
+        this.dispatchTextareaValidationEvent();
+    }
+    /**
+     * Check if the current value is valid according to validation rules
+     */
+    isCurrentlyValid() {
+        var _a, _b;
+        return (_b = (_a = this._validationResult) === null || _a === void 0 ? void 0 : _a.isValid) !== null && _b !== void 0 ? _b : true;
+    }
+    /**
+     * Check if validation is blocking (prevents form submission)
+     */
+    isBlocking() {
+        var _a, _b;
+        return (_b = (_a = this._validationResult) === null || _a === void 0 ? void 0 : _a.blocking) !== null && _b !== void 0 ? _b : false;
+    }
+    /**
+     * Get validation messages
+     */
+    getValidationMessages() {
+        var _a, _b;
+        return (_b = (_a = this._validationResult) === null || _a === void 0 ? void 0 : _a.messages) !== null && _b !== void 0 ? _b : [];
+    }
+    /**
+     * Add a validation rule to the host
+     */
+    addRule(rule) {
+        const rules = this.validationHost.rules || [];
+        rules.push(rule);
+        this.validationHost.rules = rules;
+        this.requestUpdate();
+    }
+    /**
+     * Remove a validation rule from the host
+     */
+    removeRule(predicate) {
+        const rules = this.validationHost.rules || [];
+        this.validationHost.rules = rules.filter(rule => !predicate(rule));
+        this.requestUpdate();
+    }
+    /**
+     * Remove all validation rules
+     */
+    clearRules() {
+        this.validationHost.rules = [];
+        this.clearValidation();
+    }
+    /**
+     * Create a required field validation rule
+     */
+    static createRequiredRule(message = 'This field is required') {
+        return {
+            validator: (value) => value.trim().length > 0,
+            message,
+            level: 'error',
+            blocking: true
+        };
+    }
+    /**
+     * Create a minimum length validation rule
+     */
+    static createMinLengthRule(minLength, message) {
+        return {
+            validator: (value) => value.length >= minLength,
+            message: message || `Minimum ${minLength} characters required`,
+            level: 'error',
+            blocking: true
+        };
+    }
+    /**
+     * Create a maximum length validation rule
+     */
+    static createMaxLengthRule(maxLength, message) {
+        return {
+            validator: (value) => value.length <= maxLength,
+            message: message || `Maximum ${maxLength} characters allowed`,
+            level: 'error',
+            blocking: true
+        };
+    }
+    /**
+     * Create a pattern validation rule
+     */
+    static createPatternRule(pattern, message) {
+        return {
+            validator: (value) => pattern.test(value),
+            message,
+            level: 'error',
+            blocking: true
+        };
+    }
+    /**
+     * Update host validation state based on validation result
+     */
+    updateHostValidationState() {
+        if (!this._validationResult)
+            return;
+        const { level } = this._validationResult;
+        if (level === 'error') {
+            this.validationHost.state = "error" /* TEXTAREA_STATE.Error */;
+        }
+        else if (level === 'warning') {
+            this.validationHost.state = "warning" /* TEXTAREA_STATE.Warning */;
+        }
+        else if (this.validationHost.rules.length > 0) {
+            // Only set success state if we have validation rules
+            this.validationHost.state = "success" /* TEXTAREA_STATE.Success */;
+        }
+        this.requestUpdate();
+    }
+    /**
+     * Dispatch textarea-specific validation event (standardized to nr-validation)
+     */
+    dispatchTextareaValidationEvent() {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        const detail = {
+            isValid: (_b = (_a = this._validationResult) === null || _a === void 0 ? void 0 : _a.isValid) !== null && _b !== void 0 ? _b : true,
+            validationMessage: (_d = (_c = this._validationResult) === null || _c === void 0 ? void 0 : _c.messages.join(', ')) !== null && _d !== void 0 ? _d : '',
+            errors: (_f = (_e = this._validationResult) === null || _e === void 0 ? void 0 : _e.messages.filter(() => { var _a; return ((_a = this._validationResult) === null || _a === void 0 ? void 0 : _a.level) === 'error'; })) !== null && _f !== void 0 ? _f : [],
+            warnings: (_h = (_g = this._validationResult) === null || _g === void 0 ? void 0 : _g.messages.filter(() => { var _a; return ((_a = this._validationResult) === null || _a === void 0 ? void 0 : _a.level) === 'warning'; })) !== null && _h !== void 0 ? _h : [],
+            validationResult: this._validationResult || {
+                isValid: true,
+                messages: [],
+                level: 'success',
+                blocking: false
+            }
+        };
+        this.safeExecute(() => this.dispatchEvent(new CustomEvent('nr-validation', {
+            detail,
+            bubbles: true,
+            composed: true
+        })), 'dispatchValidationEvent');
+    }
+    /**
+     * Cleanup on disconnect
+     */
+    hostDisconnected() {
+        if (this._validationTimeout) {
+            clearTimeout(this._validationTimeout);
+            this._validationTimeout = undefined;
+        }
+    }
+}
+//# sourceMappingURL=validation.controller.js.map

package/dist/src/components/timepicker/controllers/formatting.controller.d.ts

@@ -0,0 +1,93 @@
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+import { TimeValue, TimeFormat, TimePeriod } from '../timepicker.types.js';
+import { TimePickerHost, TimeFormattingController } from '../interfaces/timepicker.interface.js';
+/**
+ * Controller for handling time formatting logic
+ */
+export declare class TimePickerFormattingController implements TimeFormattingController {
+    private host;
+    constructor(host: TimePickerHost);
+    /**
+     * Format time for display (user-facing format)
+     */
+    formatForDisplay(time: TimeValue): string;
+    /**
+     * Format time for input field value
+     */
+    formatForInput(time: TimeValue): string;
+    /**
+     * Parse input value to TimeValue
+     */
+    parseInputValue(value: string): TimeValue | null;
+    /**
+     * Get time format pattern for the current configuration
+     */
+    getFormatPattern(): string;
+    /**
+     * Get placeholder text for input field
+     */
+    getPlaceholder(): string;
+    /**
+     * Format time component with leading zeros
+     */
+    formatTimeComponent(value: number, length?: number): string;
+    /**
+     * Format hours based on current format
+     */
+    formatHours(hours: number): string;
+    /**
+     * Format minutes with leading zero
+     */
+    formatMinutes(minutes: number): string;
+    /**
+     * Format seconds with leading zero
+     */
+    formatSeconds(seconds: number): string;
+    /**
+     * Get period (AM/PM) for 12-hour format
+     */
+    getPeriod(hours: number): TimePeriod;
+    /**
+     * Format time parts separately
+     */
+    formatTimeParts(time: TimeValue): {
+        hours: string;
+        minutes: string;
+        seconds: string;
+        period?: TimePeriod;
+    };
+    /**
+     * Parse time parts from string
+     */
+    parseTimeParts(timeString: string): {
+        hours?: number;
+        minutes?: number;
+        seconds?: number;
+        period?: TimePeriod;
+    } | null;
+    /**
+     * Get time separator character
+     */
+    getTimeSeparator(): string;
+    /**
+     * Check if format is valid
+     */
+    isValidFormat(_format: string): boolean;
+    /**
+     * Get format examples
+     */
+    getFormatExamples(): string[];
+    /**
+     * Convert between formats
+     */
+    convertFormat(timeString: string, fromFormat: TimeFormat, toFormat: TimeFormat): string | null;
+    /**
+     * Get human-readable time description
+     */
+    getTimeDescription(time: TimeValue): string;
+}
+//# sourceMappingURL=formatting.controller.d.ts.map

package/dist/src/components/timepicker/controllers/formatting.controller.js

@@ -0,0 +1,195 @@
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+import { TimeFormat, TimePeriod } from '../timepicker.types.js';
+import { TimeUtils } from '../utils/time.utils.js';
+import { DEFAULT_TIME_FORMAT, DEFAULT_TIME_FORMAT_WITH_SECONDS, DEFAULT_12H_TIME_FORMAT, DEFAULT_12H_TIME_FORMAT_WITH_SECONDS } from '../timepicker.constants.js';
+/**
+ * Controller for handling time formatting logic
+ */
+export class TimePickerFormattingController {
+    constructor(host) {
+        this.host = host;
+    }
+    /**
+     * Format time for display (user-facing format)
+     */
+    formatForDisplay(time) {
+        const config = this.host.getConfig();
+        return TimeUtils.formatTimeValue(time, config.format, config.showSeconds);
+    }
+    /**
+     * Format time for input field value
+     */
+    formatForInput(time) {
+        // Input format is typically the same as display format
+        return this.formatForDisplay(time);
+    }
+    /**
+     * Parse input value to TimeValue
+     */
+    parseInputValue(value) {
+        const config = this.host.getConfig();
+        return TimeUtils.parseTimeString(value, config.format);
+    }
+    /**
+     * Get time format pattern for the current configuration
+     */
+    getFormatPattern() {
+        const config = this.host.getConfig();
+        if (config.format === TimeFormat.TwelveHour) {
+            return config.showSeconds ? DEFAULT_12H_TIME_FORMAT_WITH_SECONDS : DEFAULT_12H_TIME_FORMAT;
+        }
+        else {
+            return config.showSeconds ? DEFAULT_TIME_FORMAT_WITH_SECONDS : DEFAULT_TIME_FORMAT;
+        }
+    }
+    /**
+     * Get placeholder text for input field
+     */
+    getPlaceholder() {
+        const config = this.host.getConfig();
+        if (config.format === TimeFormat.TwelveHour) {
+            return config.showSeconds ? 'hh:mm:ss AM/PM' : 'hh:mm AM/PM';
+        }
+        else {
+            return config.showSeconds ? 'HH:mm:ss' : 'HH:mm';
+        }
+    }
+    /**
+     * Format time component with leading zeros
+     */
+    formatTimeComponent(value, length = 2) {
+        return value.toString().padStart(length, '0');
+    }
+    /**
+     * Format hours based on current format
+     */
+    formatHours(hours) {
+        const config = this.host.getConfig();
+        if (config.format === TimeFormat.TwelveHour) {
+            let displayHours = hours;
+            if (displayHours === 0) {
+                displayHours = 12;
+            }
+            else if (displayHours > 12) {
+                displayHours -= 12;
+            }
+            return displayHours.toString();
+        }
+        else {
+            return this.formatTimeComponent(hours);
+        }
+    }
+    /**
+     * Format minutes with leading zero
+     */
+    formatMinutes(minutes) {
+        return this.formatTimeComponent(minutes);
+    }
+    /**
+     * Format seconds with leading zero
+     */
+    formatSeconds(seconds) {
+        return this.formatTimeComponent(seconds);
+    }
+    /**
+     * Get period (AM/PM) for 12-hour format
+     */
+    getPeriod(hours) {
+        return hours >= 12 ? TimePeriod.PM : TimePeriod.AM;
+    }
+    /**
+     * Format time parts separately
+     */
+    formatTimeParts(time) {
+        const config = this.host.getConfig();
+        return {
+            hours: this.formatHours(time.hours),
+            minutes: this.formatMinutes(time.minutes),
+            seconds: this.formatSeconds(time.seconds),
+            period: config.format === TimeFormat.TwelveHour ? this.getPeriod(time.hours) : undefined,
+        };
+    }
+    /**
+     * Parse time parts from string
+     */
+    parseTimeParts(timeString) {
+        const config = this.host.getConfig();
+        const parsedTime = TimeUtils.parseTimeString(timeString, config.format);
+        if (!parsedTime) {
+            return null;
+        }
+        return {
+            hours: parsedTime.hours,
+            minutes: parsedTime.minutes,
+            seconds: parsedTime.seconds,
+            period: config.format === TimeFormat.TwelveHour ? this.getPeriod(parsedTime.hours) : undefined,
+        };
+    }
+    /**
+     * Get time separator character
+     */
+    getTimeSeparator() {
+        return ':';
+    }
+    /**
+     * Check if format is valid
+     */
+    isValidFormat(_format) {
+        const testTime = TimeUtils.createTimeValue(12, 30, 45);
+        try {
+            const formatted = this.formatForDisplay(testTime);
+            const parsed = this.parseInputValue(formatted);
+            return parsed !== null;
+        }
+        catch (_a) {
+            return false;
+        }
+    }
+    /**
+     * Get format examples
+     */
+    getFormatExamples() {
+        const config = this.host.getConfig();
+        const exampleTimes = [
+            TimeUtils.createTimeValue(9, 15, 0),
+            TimeUtils.createTimeValue(14, 30, 45),
+            TimeUtils.createTimeValue(23, 59, 59),
+        ];
+        return exampleTimes.map(time => TimeUtils.formatTimeValue(time, config.format, config.showSeconds));
+    }
+    /**
+     * Convert between formats
+     */
+    convertFormat(timeString, fromFormat, toFormat) {
+        const parsedTime = TimeUtils.parseTimeString(timeString, fromFormat);
+        if (!parsedTime) {
+            return null;
+        }
+        const config = this.host.getConfig();
+        return TimeUtils.formatTimeValue(parsedTime, toFormat, config.showSeconds);
+    }
+    /**
+     * Get human-readable time description
+     */
+    getTimeDescription(time) {
+        const config = this.host.getConfig();
+        const formatted = TimeUtils.formatTimeValue(time, config.format, config.showSeconds);
+        // Add contextual information
+        const now = TimeUtils.getCurrentTime();
+        const comparison = TimeUtils.compareTime(time, now);
+        if (comparison === 0) {
+            return `${formatted} (now)`;
+        }
+        else if (comparison > 0) {
+            return `${formatted} (future)`;
+        }
+        else {
+            return `${formatted} (past)`;
+        }
+    }
+}
+//# sourceMappingURL=formatting.controller.js.map

package/dist/src/components/timepicker/controllers/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+export { TimePickerSelectionController } from './selection.controller.js';
+export { TimePickerValidationController } from './validation.controller.js';
+export { TimePickerFormattingController } from './formatting.controller.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/components/timepicker/controllers/index.js

@@ -0,0 +1,9 @@
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+export { TimePickerSelectionController } from './selection.controller.js';
+export { TimePickerValidationController } from './validation.controller.js';
+export { TimePickerFormattingController } from './formatting.controller.js';
+//# sourceMappingURL=index.js.map

package/dist/src/components/timepicker/controllers/selection.controller.d.ts

@@ -0,0 +1,72 @@
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+import { TimeValue } from '../timepicker.types.js';
+import { TimePickerHost, TimeSelectionController } from '../interfaces/timepicker.interface.js';
+/**
+ * Controller for handling time selection logic
+ */
+export declare class TimePickerSelectionController implements TimeSelectionController {
+    private host;
+    private selectedTime;
+    constructor(host: TimePickerHost);
+    /**
+     * Select a time value
+     */
+    selectTime(time: TimeValue): void;
+    /**
+     * Get currently selected time
+     */
+    getSelectedTime(): TimeValue | null;
+    /**
+     * Clear current selection
+     */
+    clearSelection(): void;
+    /**
+     * Check if a time is currently selected
+     */
+    isTimeSelected(time: TimeValue): boolean;
+    /**
+     * Set time without triggering events (for internal use)
+     */
+    setTimeInternal(time: TimeValue | null): void;
+    /**
+     * Update selected time with partial values
+     */
+    updateTime(updates: Partial<TimeValue>): void;
+    /**
+     * Increment time component
+     */
+    incrementTime(component: 'hours' | 'minutes' | 'seconds', step?: number): void;
+    /**
+     * Decrement time component
+     */
+    decrementTime(component: 'hours' | 'minutes' | 'seconds', step?: number): void;
+    /**
+     * Set time from formatted string
+     */
+    setTimeFromString(timeString: string): boolean;
+    /**
+     * Get formatted time string
+     */
+    getFormattedTime(): string;
+    /**
+     * Dispatch time change event
+     */
+    private dispatchTimeChangeEvent;
+    /**
+     * Reset to initial/default time
+     */
+    reset(): void;
+    /**
+     * Set time to current time
+     */
+    setToCurrentTime(): void;
+    /**
+     * Round current time to nearest interval
+     */
+    roundToInterval(intervalMinutes: number): void;
+}
+//# sourceMappingURL=selection.controller.d.ts.map