@nuraly/lumenui 0.2.1 → 0.3.2

package/dist/src/components/timepicker/test/timepicker_test.js

@@ -0,0 +1,218 @@
+/**
+ * @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 { html, fixture, expect, aTimeout } from '@open-wc/testing';
+import { TimeFormat, TimePickerSize, TimePickerVariant } from '../timepicker.types.js';
+suite('NrTimePickerElement', () => {
+    let element;
+    setup(() => __awaiter(void 0, void 0, void 0, function* () {
+        element = yield fixture(html `<nr-timepicker></nr-timepicker>`);
+    }));
+    suite('Basic functionality', () => {
+        test('should render successfully', () => {
+            expect(element).to.exist;
+            expect(element.tagName).to.equal('NR-TIMEPICKER');
+        });
+        test('should have default properties', () => {
+            expect(element.format).to.equal(TimeFormat.TwentyFourHour);
+            expect(element.showSeconds).to.be.false;
+            expect(element.disabled).to.be.false;
+            expect(element.readonly).to.be.false;
+            expect(element.required).to.be.false;
+        });
+        test('should have empty initial value', () => {
+            expect(element.value).to.equal('');
+        });
+    });
+    suite('Time format handling', () => {
+        test('should handle 24-hour format by default', () => __awaiter(void 0, void 0, void 0, function* () {
+            element.value = '14:30';
+            yield element.updateComplete;
+            expect(element.value).to.equal('14:30');
+        }));
+        test('should handle 12-hour format', () => __awaiter(void 0, void 0, void 0, function* () {
+            element.format = TimeFormat.TwelveHour;
+            element.value = '2:30 PM';
+            yield element.updateComplete;
+            expect(element.value).to.equal('2:30 PM');
+        }));
+        test('should format time with seconds when enabled', () => __awaiter(void 0, void 0, void 0, function* () {
+            element.showSeconds = true;
+            element.value = '14:30:45';
+            yield element.updateComplete;
+            expect(element.value).to.equal('14:30:45');
+        }));
+    });
+    suite('Time validation', () => {
+        test('should validate time within min/max range', () => __awaiter(void 0, void 0, void 0, function* () {
+            element.minTime = '09:00';
+            element.maxTime = '17:00';
+            yield element.updateComplete;
+            // Valid time within range
+            element.value = '12:00';
+            yield element.updateComplete;
+            expect(element.value).to.equal('12:00');
+        }));
+        test('should reject invalid time formats', () => __awaiter(void 0, void 0, void 0, function* () {
+            const invalidValue = 'invalid-time';
+            element.value = invalidValue;
+            yield element.updateComplete;
+            // Should not set invalid value
+            expect(element.value).to.not.equal(invalidValue);
+        }));
+    });
+    suite('Clock functionality', () => {
+        test('should open and close clock', () => __awaiter(void 0, void 0, void 0, function* () {
+            var _a, _b, _c;
+            // Check initial state via DOM
+            let dropdown = (_a = element.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.time-picker__dropdown--open');
+            expect(dropdown).to.not.exist;
+            element.open();
+            yield element.updateComplete;
+            dropdown = (_b = element.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('.time-picker__dropdown--open');
+            expect(dropdown).to.exist;
+            element.close();
+            yield element.updateComplete;
+            dropdown = (_c = element.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('.time-picker__dropdown--open');
+            expect(dropdown).to.not.exist;
+        }));
+        test('should toggle clock state via trigger button', () => __awaiter(void 0, void 0, void 0, function* () {
+            var _a, _b, _c, _d;
+            const trigger = (_a = element.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.time-picker__trigger');
+            // Initially closed
+            let dropdown = (_b = element.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('.time-picker__dropdown--open');
+            expect(dropdown).to.not.exist;
+            // Click to open
+            trigger.click();
+            yield element.updateComplete;
+            dropdown = (_c = element.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('.time-picker__dropdown--open');
+            expect(dropdown).to.exist;
+            // Click to close
+            trigger.click();
+            yield element.updateComplete;
+            dropdown = (_d = element.shadowRoot) === null || _d === void 0 ? void 0 : _d.querySelector('.time-picker__dropdown--open');
+            expect(dropdown).to.not.exist;
+        }));
+    });
+    suite('Time manipulation', () => {
+        test('should clear time value', () => __awaiter(void 0, void 0, void 0, function* () {
+            element.value = '12:00';
+            yield element.updateComplete;
+            element.clear();
+            yield element.updateComplete;
+            expect(element.value).to.equal('');
+        }));
+        test('should set current time', () => __awaiter(void 0, void 0, void 0, function* () {
+            element.setToNow();
+            yield element.updateComplete;
+            // Should have some value after setting to now
+            expect(element.value).to.not.equal('');
+            // Basic format check for 24-hour format
+            expect(element.value).to.match(/^\d{1,2}:\d{2}$/);
+        }));
+    });
+    suite('Event handling', () => {
+        test('should dispatch time-change event', () => __awaiter(void 0, void 0, void 0, function* () {
+            let eventFired = false;
+            let eventDetail = null;
+            element.addEventListener('nr-time-change', (e) => {
+                const customEvent = e;
+                eventFired = true;
+                eventDetail = customEvent.detail;
+            });
+            element.value = '15:30';
+            yield element.updateComplete;
+            // Allow time for event to be dispatched
+            yield aTimeout(10);
+            expect(eventFired).to.be.true;
+            expect(eventDetail).to.exist;
+        }));
+        test('should dispatch clock open/close events', () => __awaiter(void 0, void 0, void 0, function* () {
+            let openEventFired = false;
+            let closeEventFired = false;
+            element.addEventListener('nr-clock-open', () => {
+                openEventFired = true;
+            });
+            element.addEventListener('nr-clock-close', () => {
+                closeEventFired = true;
+            });
+            element.open();
+            yield element.updateComplete;
+            yield aTimeout(10);
+            expect(openEventFired).to.be.true;
+            element.close();
+            yield element.updateComplete;
+            yield aTimeout(10);
+            expect(closeEventFired).to.be.true;
+        }));
+    });
+    suite('Accessibility', () => {
+        test('should have proper ARIA attributes', () => __awaiter(void 0, void 0, void 0, function* () {
+            var _a;
+            element.label = 'Select Time';
+            element.required = true;
+            yield element.updateComplete;
+            const input = (_a = element.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('input');
+            expect(input).to.exist;
+            expect(input === null || input === void 0 ? void 0 : input.getAttribute('required')).to.exist;
+        }));
+        test('should support disabled state', () => __awaiter(void 0, void 0, void 0, function* () {
+            var _a;
+            element.disabled = true;
+            yield element.updateComplete;
+            const input = (_a = element.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('input');
+            expect(input === null || input === void 0 ? void 0 : input.hasAttribute('disabled')).to.be.true;
+        }));
+        test('should support readonly state', () => __awaiter(void 0, void 0, void 0, function* () {
+            var _a;
+            element.readonly = true;
+            yield element.updateComplete;
+            const input = (_a = element.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('input');
+            expect(input === null || input === void 0 ? void 0 : input.hasAttribute('readonly')).to.be.true;
+        }));
+    });
+    suite('Size and variant attributes', () => {
+        test('should apply size attribute to host', () => __awaiter(void 0, void 0, void 0, function* () {
+            element.size = TimePickerSize.Large;
+            yield element.updateComplete;
+            expect(element.hasAttribute('size')).to.be.true;
+            expect(element.getAttribute('size')).to.equal('large');
+        }));
+        test('should apply variant attribute to host', () => __awaiter(void 0, void 0, void 0, function* () {
+            element.variant = TimePickerVariant.Outlined;
+            yield element.updateComplete;
+            expect(element.hasAttribute('variant')).to.be.true;
+            expect(element.getAttribute('variant')).to.equal('outlined');
+        }));
+    });
+    suite('Controller integration', () => {
+        test('should have selection controller', () => {
+            // Access private controller for testing (cast to any to bypass TypeScript)
+            const controller = element.selectionController;
+            expect(controller).to.exist;
+            expect(typeof controller.selectTime).to.equal('function');
+        });
+        test('should have validation controller', () => {
+            const controller = element.validationController;
+            expect(controller).to.exist;
+            expect(typeof controller.validateConstraints).to.equal('function');
+        });
+        test('should have formatting controller', () => {
+            const controller = element.formattingController;
+            expect(controller).to.exist;
+            expect(typeof controller.formatForDisplay).to.equal('function');
+        });
+    });
+});
+//# sourceMappingURL=timepicker_test.js.map

package/dist/src/components/timepicker/utils/time.utils.d.ts

@@ -0,0 +1,87 @@
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+import { TimeValue, TimePeriod, TimeFormat } from '../timepicker.types.js';
+/**
+ * Time utility functions for time picker component
+ */
+export declare class TimeUtils {
+    /**
+     * Create a new TimeValue object
+     */
+    static createTimeValue(hours: number, minutes: number, seconds?: number, period?: TimePeriod): TimeValue;
+    /**
+     * Parse time string to TimeValue
+     */
+    static parseTimeString(timeString: string, format?: TimeFormat): TimeValue | null;
+    /**
+     * Parse 24-hour format time string
+     */
+    private static parse24HourTime;
+    /**
+     * Parse 12-hour format time string
+     */
+    private static parse12HourTime;
+    /**
+     * Format TimeValue to string
+     */
+    static formatTimeValue(time: TimeValue, format?: TimeFormat, showSeconds?: boolean): string;
+    /**
+     * Format time in 24-hour format
+     */
+    private static format24HourTime;
+    /**
+     * Format time in 12-hour format
+     */
+    private static format12HourTime;
+    /**
+     * Get current time as TimeValue
+     */
+    static getCurrentTime(): TimeValue;
+    /**
+     * Compare two TimeValue objects
+     */
+    static compareTime(time1: TimeValue, time2: TimeValue): number;
+    /**
+     * Check if two TimeValue objects are equal
+     */
+    static isTimeEqual(time1: TimeValue, time2: TimeValue): boolean;
+    /**
+     * Validate 24-hour time components
+     */
+    private static isValidTime24;
+    /**
+     * Validate 12-hour time components
+     */
+    private static isValidTime12;
+    /**
+     * Add time to a TimeValue
+     */
+    static addTime(time: TimeValue, hoursToAdd: number, minutesToAdd: number, secondsToAdd?: number): TimeValue;
+    /**
+     * Generate time options for dropdowns
+     */
+    static generateTimeOptions(interval?: number, format?: TimeFormat, showSeconds?: boolean): Array<{
+        value: string;
+        label: string;
+    }>;
+    /**
+     * Round time to nearest interval
+     */
+    static roundToInterval(time: TimeValue, intervalMinutes: number): TimeValue;
+    /**
+     * Check if time is within range
+     */
+    static isTimeInRange(time: TimeValue, minTime: TimeValue | null, maxTime: TimeValue | null): boolean;
+    /**
+     * Convert Date object to TimeValue
+     */
+    static dateToTimeValue(date: Date): TimeValue;
+    /**
+     * Convert TimeValue to Date object (using current date)
+     */
+    static timeValueToDate(time: TimeValue, baseDate?: Date): Date;
+}
+//# sourceMappingURL=time.utils.d.ts.map

package/dist/src/components/timepicker/utils/time.utils.js

@@ -0,0 +1,235 @@
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+import { TimePeriod, TimeFormat } from '../timepicker.types.js';
+import { TIME_BOUNDARIES } from '../timepicker.constants.js';
+/**
+ * Time utility functions for time picker component
+ */
+export class TimeUtils {
+    /**
+     * Create a new TimeValue object
+     */
+    static createTimeValue(hours, minutes, seconds = 0, period) {
+        return {
+            hours: Math.max(0, Math.min(hours, 23)),
+            minutes: Math.max(0, Math.min(minutes, 59)),
+            seconds: Math.max(0, Math.min(seconds, 59)),
+            period,
+        };
+    }
+    /**
+     * Parse time string to TimeValue
+     */
+    static parseTimeString(timeString, format = TimeFormat.TwentyFourHour) {
+        if (!(timeString === null || timeString === void 0 ? void 0 : timeString.trim())) {
+            return null;
+        }
+        const cleanTime = timeString.trim().toUpperCase();
+        if (format === TimeFormat.TwelveHour) {
+            return this.parse12HourTime(cleanTime);
+        }
+        else {
+            return this.parse24HourTime(cleanTime);
+        }
+    }
+    /**
+     * Parse 24-hour format time string
+     */
+    static parse24HourTime(timeString) {
+        const match = timeString.match(/^(\d{1,2}):(\d{2})(?::(\d{2}))?$/);
+        if (!match) {
+            return null;
+        }
+        const hours = Number.parseInt(match[1], 10);
+        const minutes = Number.parseInt(match[2], 10);
+        const seconds = match[3] ? Number.parseInt(match[3], 10) : 0;
+        if (!this.isValidTime24(hours, minutes, seconds)) {
+            return null;
+        }
+        return this.createTimeValue(hours, minutes, seconds);
+    }
+    /**
+     * Parse 12-hour format time string
+     */
+    static parse12HourTime(timeString) {
+        const match = timeString.match(/^(\d{1,2}):(\d{2})(?::(\d{2}))?\s?(AM|PM)$/);
+        if (!match) {
+            return null;
+        }
+        let hours = Number.parseInt(match[1], 10);
+        const minutes = Number.parseInt(match[2], 10);
+        const seconds = match[3] ? Number.parseInt(match[3], 10) : 0;
+        const period = match[4];
+        if (!this.isValidTime12(hours, minutes, seconds)) {
+            return null;
+        }
+        // Convert to 24-hour format for internal storage
+        if (period === TimePeriod.PM && hours !== 12) {
+            hours += 12;
+        }
+        else if (period === TimePeriod.AM && hours === 12) {
+            hours = 0;
+        }
+        return this.createTimeValue(hours, minutes, seconds, period);
+    }
+    /**
+     * Format TimeValue to string
+     */
+    static formatTimeValue(time, format = TimeFormat.TwentyFourHour, showSeconds = false) {
+        if (!time) {
+            return '';
+        }
+        if (format === TimeFormat.TwelveHour) {
+            return this.format12HourTime(time, showSeconds);
+        }
+        else {
+            return this.format24HourTime(time, showSeconds);
+        }
+    }
+    /**
+     * Format time in 24-hour format
+     */
+    static format24HourTime(time, showSeconds) {
+        const hours = time.hours.toString().padStart(2, '0');
+        const minutes = time.minutes.toString().padStart(2, '0');
+        if (showSeconds) {
+            const seconds = time.seconds.toString().padStart(2, '0');
+            return `${hours}:${minutes}:${seconds}`;
+        }
+        return `${hours}:${minutes}`;
+    }
+    /**
+     * Format time in 12-hour format
+     */
+    static format12HourTime(time, showSeconds) {
+        let hours = time.hours;
+        const minutes = time.minutes.toString().padStart(2, '0');
+        const period = hours >= 12 ? TimePeriod.PM : TimePeriod.AM;
+        // Convert to 12-hour format
+        if (hours === 0) {
+            hours = 12;
+        }
+        else if (hours > 12) {
+            hours -= 12;
+        }
+        const hoursStr = hours.toString();
+        if (showSeconds) {
+            const seconds = time.seconds.toString().padStart(2, '0');
+            return `${hoursStr}:${minutes}:${seconds} ${period}`;
+        }
+        return `${hoursStr}:${minutes} ${period}`;
+    }
+    /**
+     * Get current time as TimeValue
+     */
+    static getCurrentTime() {
+        const now = new Date();
+        return this.createTimeValue(now.getHours(), now.getMinutes(), now.getSeconds());
+    }
+    /**
+     * Compare two TimeValue objects
+     */
+    static compareTime(time1, time2) {
+        const totalSeconds1 = time1.hours * 3600 + time1.minutes * 60 + time1.seconds;
+        const totalSeconds2 = time2.hours * 3600 + time2.minutes * 60 + time2.seconds;
+        return totalSeconds1 - totalSeconds2;
+    }
+    /**
+     * Check if two TimeValue objects are equal
+     */
+    static isTimeEqual(time1, time2) {
+        return this.compareTime(time1, time2) === 0;
+    }
+    /**
+     * Validate 24-hour time components
+     */
+    static isValidTime24(hours, minutes, seconds = 0) {
+        return (hours >= TIME_BOUNDARIES.MIN_HOUR_24 &&
+            hours <= TIME_BOUNDARIES.MAX_HOUR_24 &&
+            minutes >= TIME_BOUNDARIES.MIN_MINUTE &&
+            minutes <= TIME_BOUNDARIES.MAX_MINUTE &&
+            seconds >= TIME_BOUNDARIES.MIN_SECOND &&
+            seconds <= TIME_BOUNDARIES.MAX_SECOND);
+    }
+    /**
+     * Validate 12-hour time components
+     */
+    static isValidTime12(hours, minutes, seconds = 0) {
+        return (hours >= TIME_BOUNDARIES.MIN_HOUR_12 &&
+            hours <= TIME_BOUNDARIES.MAX_HOUR_12 &&
+            minutes >= TIME_BOUNDARIES.MIN_MINUTE &&
+            minutes <= TIME_BOUNDARIES.MAX_MINUTE &&
+            seconds >= TIME_BOUNDARIES.MIN_SECOND &&
+            seconds <= TIME_BOUNDARIES.MAX_SECOND);
+    }
+    /**
+     * Add time to a TimeValue
+     */
+    static addTime(time, hoursToAdd, minutesToAdd, secondsToAdd = 0) {
+        let totalSeconds = time.hours * 3600 + time.minutes * 60 + time.seconds;
+        totalSeconds += hoursToAdd * 3600 + minutesToAdd * 60 + secondsToAdd;
+        // Handle overflow/underflow
+        totalSeconds = ((totalSeconds % 86400) + 86400) % 86400;
+        const hours = Math.floor(totalSeconds / 3600);
+        const minutes = Math.floor((totalSeconds % 3600) / 60);
+        const seconds = totalSeconds % 60;
+        return this.createTimeValue(hours, minutes, seconds);
+    }
+    /**
+     * Generate time options for dropdowns
+     */
+    static generateTimeOptions(interval = 15, format = TimeFormat.TwentyFourHour, showSeconds = false) {
+        const options = [];
+        for (let hour = 0; hour < 24; hour++) {
+            for (let minute = 0; minute < 60; minute += interval) {
+                const timeValue = this.createTimeValue(hour, minute, 0);
+                const formatted = this.formatTimeValue(timeValue, format, showSeconds);
+                options.push({
+                    value: formatted,
+                    label: formatted,
+                });
+            }
+        }
+        return options;
+    }
+    /**
+     * Round time to nearest interval
+     */
+    static roundToInterval(time, intervalMinutes) {
+        const totalMinutes = time.hours * 60 + time.minutes;
+        const roundedMinutes = Math.round(totalMinutes / intervalMinutes) * intervalMinutes;
+        const hours = Math.floor(roundedMinutes / 60) % 24;
+        const minutes = roundedMinutes % 60;
+        return this.createTimeValue(hours, minutes, time.seconds);
+    }
+    /**
+     * Check if time is within range
+     */
+    static isTimeInRange(time, minTime, maxTime) {
+        if (minTime && this.compareTime(time, minTime) < 0) {
+            return false;
+        }
+        if (maxTime && this.compareTime(time, maxTime) > 0) {
+            return false;
+        }
+        return true;
+    }
+    /**
+     * Convert Date object to TimeValue
+     */
+    static dateToTimeValue(date) {
+        return this.createTimeValue(date.getHours(), date.getMinutes(), date.getSeconds());
+    }
+    /**
+     * Convert TimeValue to Date object (using current date)
+     */
+    static timeValueToDate(time, baseDate) {
+        const date = baseDate ? new Date(baseDate) : new Date();
+        date.setHours(time.hours, time.minutes, time.seconds, 0);
+        return date;
+    }
+}
+//# sourceMappingURL=time.utils.js.map

package/dist/src/components/toast/bundle.js

@@ -331,13 +331,13 @@ import{css as t,html as e,nothing as o,LitElement as s}from"lit";import{property
  * @license
  * Copyright 2023 Nuraly, Laabidi Aymen
  * SPDX-License-Identifier: MIT
- */,d=t=>class extends t{constructor(){super(...arguments),this.handleSystemThemeChange=()=>{this.closest("[data-theme]")||document.documentElement.hasAttribute("data-theme")||this.requestUpdate()}}connectedCallback(){super.connectedCallback(),this.setupThemeObserver(),this.setupDesignSystemObserver(),this.setupSystemThemeListener()}disconnectedCallback(){var t,e,o;super.disconnectedCallback(),null===(t=this.themeObserver)||void 0===t||t.disconnect(),null===(e=this.designSystemObserver)||void 0===e||e.disconnect(),null===(o=this.mediaQuery)||void 0===o||o.removeEventListener("change",this.handleSystemThemeChange)}get currentTheme(){var t,e;const o=(null===(t=this.closest("[data-theme]"))||void 0===t?void 0:t.getAttribute("data-theme"))||document.documentElement.getAttribute("data-theme");return o||((null===(e=window.matchMedia)||void 0===e?void 0:e.call(window,"(prefers-color-scheme: dark)").matches)?"dark":"light")}get currentDesignSystem(){var t;const e=(null===(t=this.closest("[design-system]"))||void 0===t?void 0:t.getAttribute("design-system"))||document.documentElement.getAttribute("design-system");return"carbon"===e?e:"default"}setupThemeObserver(){this.themeObserver=new MutationObserver(()=>{this.requestUpdate()}),this.themeObserver.observe(document.documentElement,{attributes:!0,attributeFilter:["data-theme"]})}setupDesignSystemObserver(){this.designSystemObserver=new MutationObserver(()=>{this.requestUpdate()}),this.designSystemObserver.observe(document.documentElement,{attributes:!0,attributeFilter:["design-system"]})}setupSystemThemeListener(){window.matchMedia&&(this.mediaQuery=window.matchMedia("(prefers-color-scheme: dark)"),this.mediaQuery.addEventListener("change",this.handleSystemThemeChange))}},h=()=>{var t;return void 0!==globalThis.litElementVersions||"undefined"!=typeof process&&"development"===(null===(t=process.env)||void 0===t?void 0:t.NODE_ENV)||"undefined"!=typeof window&&("localhost"===window.location.hostname||"127.0.0.1"===window.location.hostname)},u=t=>class extends t{constructor(){super(...arguments),this.requiredComponents=[]}validateDependencies(){if(h())for(const t of this.requiredComponents)if(!this.isComponentAvailable(t))throw new Error(`Required component "${t}" is not registered. Please import and register the component before using ${this.tagName.toLowerCase()}. Example: import '@nuralyui/${t}';`)}validateDependenciesWithHandler(t){if(!h())return!0;let e=!0;for(const o of this.requiredComponents)if(!this.isComponentAvailable(o)){e=!1;const s=new Error(`Required component "${o}" is not registered. Please import and register the component before using ${this.tagName.toLowerCase()}.`);t?t(o,s):console.error(s.message)}return e}isComponentAvailable(t){return!!customElements.get(t)}getMissingDependencies(){return this.requiredComponents.filter(t=>!this.isComponentAvailable(t))}areDependenciesAvailable(){return this.requiredComponents.every(t=>this.isComponentAvailable(t))}addRequiredComponent(t){this.requiredComponents.includes(t)||this.requiredComponents.push(t)}removeRequiredComponent(t){const e=this.requiredComponents.indexOf(t);e>-1&&this.requiredComponents.splice(e,1)}},m=t=>class extends t{dispatchCustomEvent(t,e){this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0}))}dispatchEventWithMetadata(t,e){var o;const s=Object.assign(Object.assign({},e),{timestamp:Date.now(),componentName:(null===(o=this.tagName)||void 0===o?void 0:o.toLowerCase())||"unknown"});this.dispatchCustomEvent(t,s)}dispatchInputEvent(t,e){const o=Object.assign({target:e.target||this,value:e.value,originalEvent:e.originalEvent},e);this.dispatchCustomEvent(t,o)}dispatchFocusEvent(t,e){const o=Object.assign({target:e.target||this,value:e.value,focused:e.focused,cursorPosition:e.cursorPosition,selectedText:e.selectedText},e);this.dispatchCustomEvent(t,o)}dispatchValidationEvent(t,e){var o;const s=Object.assign({target:e.target||this,value:e.value,isValid:null!==(o=e.isValid)&&void 0!==o&&o,error:e.error},e);this.dispatchCustomEvent(t,s)}dispatchActionEvent(t,e){const o=Object.assign({target:e.target||this,action:e.action,previousValue:e.previousValue,newValue:e.newValue},e);this.dispatchCustomEvent(t,o)}isReadonlyKeyAllowed(t){if(t.ctrlKey||t.metaKey){return["KeyA","KeyC"].includes(t.code)}return["Tab","Escape","ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End","PageUp","PageDown"].includes(t.key)}isActivationKey(t){return"Enter"===t.key||" "===t.key}},f=new Set,p=new Map;
+ */,d=t=>class extends t{constructor(){super(...arguments),this.handleSystemThemeChange=()=>{this.closest("[data-theme]")||document.documentElement.hasAttribute("data-theme")||this.requestUpdate()}}connectedCallback(){super.connectedCallback(),this.setupThemeObserver(),this.setupDesignSystemObserver(),this.setupSystemThemeListener()}disconnectedCallback(){var t,e,o;super.disconnectedCallback(),null===(t=this.themeObserver)||void 0===t||t.disconnect(),null===(e=this.designSystemObserver)||void 0===e||e.disconnect(),null===(o=this.mediaQuery)||void 0===o||o.removeEventListener("change",this.handleSystemThemeChange)}get currentTheme(){var t,e;const o=(null===(t=this.closest("[data-theme]"))||void 0===t?void 0:t.getAttribute("data-theme"))||document.documentElement.getAttribute("data-theme");return o||((null===(e=window.matchMedia)||void 0===e?void 0:e.call(window,"(prefers-color-scheme: dark)").matches)?"dark":"light")}get currentDesignSystem(){var t;const e=(null===(t=this.closest("[design-system]"))||void 0===t?void 0:t.getAttribute("design-system"))||document.documentElement.getAttribute("design-system");return"carbon"===e?e:"default"}setupThemeObserver(){this.themeObserver=new MutationObserver(()=>{this.requestUpdate()}),this.themeObserver.observe(document.documentElement,{attributes:!0,attributeFilter:["data-theme"]})}setupDesignSystemObserver(){this.designSystemObserver=new MutationObserver(()=>{this.requestUpdate()}),this.designSystemObserver.observe(document.documentElement,{attributes:!0,attributeFilter:["design-system"]})}setupSystemThemeListener(){window.matchMedia&&(this.mediaQuery=window.matchMedia("(prefers-color-scheme: dark)"),this.mediaQuery.addEventListener("change",this.handleSystemThemeChange))}},h=()=>{var t;return void 0!==globalThis.litElementVersions||"undefined"!=typeof process&&"development"===(null===(t=process.env)||void 0===t?void 0:t.NODE_ENV)||"undefined"!=typeof window&&("localhost"===window.location.hostname||"127.0.0.1"===window.location.hostname)},u=t=>class extends t{constructor(){super(...arguments),this.requiredComponents=[]}validateDependencies(){if(h())for(const t of this.requiredComponents)if(!this.isComponentAvailable(t))throw new Error(`Required component "${t}" is not registered. Please import and register the component before using ${this.tagName.toLowerCase()}. Example: import '@nuralyui/${t}';`)}validateDependenciesWithHandler(t){if(!h())return!0;let e=!0;for(const o of this.requiredComponents)if(!this.isComponentAvailable(o)){e=!1;const s=new Error(`Required component "${o}" is not registered. Please import and register the component before using ${this.tagName.toLowerCase()}.`);t?t(o,s):console.error(s.message)}return e}isComponentAvailable(t){return!!customElements.get(t)}getMissingDependencies(){return this.requiredComponents.filter(t=>!this.isComponentAvailable(t))}areDependenciesAvailable(){return this.requiredComponents.every(t=>this.isComponentAvailable(t))}addRequiredComponent(t){this.requiredComponents.includes(t)||this.requiredComponents.push(t)}removeRequiredComponent(t){const e=this.requiredComponents.indexOf(t);e>-1&&this.requiredComponents.splice(e,1)}},m=t=>class extends t{dispatchCustomEvent(t,e){this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0}))}dispatchEventWithMetadata(t,e){var o;const s=Object.assign(Object.assign({},e),{timestamp:Date.now(),componentName:(null===(o=this.tagName)||void 0===o?void 0:o.toLowerCase())||"unknown"});this.dispatchCustomEvent(t,s)}dispatchInputEvent(t,e){const o=Object.assign({target:e.target||this,value:e.value,originalEvent:e.originalEvent},e);this.dispatchCustomEvent(t,o)}dispatchFocusEvent(t,e){const o=Object.assign({target:e.target||this,value:e.value,focused:e.focused,cursorPosition:e.cursorPosition,selectedText:e.selectedText},e);this.dispatchCustomEvent(t,o)}dispatchValidationEvent(t,e){var o;const s=Object.assign({target:e.target||this,value:e.value,isValid:null!==(o=e.isValid)&&void 0!==o&&o,error:e.error},e);this.dispatchCustomEvent(t,s)}dispatchActionEvent(t,e){const o=Object.assign({target:e.target||this,action:e.action,previousValue:e.previousValue,newValue:e.newValue},e);this.dispatchCustomEvent(t,o)}isReadonlyKeyAllowed(t){if(t.ctrlKey||t.metaKey){return["KeyA","KeyC"].includes(t.code)}return["Tab","Escape","ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End","PageUp","PageDown"].includes(t.key)}isActivationKey(t){return"Enter"===t.key||" "===t.key}},p=new Set,f=new Map;
 /**
  * @license
  * Copyright 2023 Nuraly, Laabidi Aymen
  * SPDX-License-Identifier: MIT
  */
-const b=t=>{class e extends t{constructor(){super(...arguments),this.t=null}createRenderRoot(){return this.constructor.useShadowDom?super.createRenderRoot():this}connectedCallback(){const t=this.constructor.useShadowDom;if(!t&&null===this.t)for(this.t=[];this.firstChild;)this.t.push(this.removeChild(this.firstChild));if(super.connectedCallback(),!t){const t=this.constructor,e=this.tagName.toLowerCase(),o=t.styles;if(o){const t=v(o);t&&function(t,e,o){var s;if(!p.has(t)){const o=new CSSStyleSheet;o.replaceSync(e),p.set(t,o)}const i=p.get(t),r=`doc:${t}`;if(f.has(r)||(document.adoptedStyleSheets=[...document.adoptedStyleSheets,i],f.add(r)),o){let e=o;for(;e;){const o=e.getRootNode();if(!(o instanceof ShadowRoot))break;{const r=`shadow:${((null===(s=o.host)||void 0===s?void 0:s.tagName)||"").toLowerCase()}:${t}`;f.has(r)||(o.adoptedStyleSheets=[...o.adoptedStyleSheets,i],f.add(r)),e=o.host}}}}(e,t,this)}}}get lightChildren(){return this.t?this.t.filter(t=>!(t instanceof Element&&t.hasAttribute("slot"))):[]}lightChildrenNamed(t){return this.t?this.t.filter(e=>e instanceof Element&&e.getAttribute("slot")===t):[]}}return e.useShadowDom=!1,e};function v(t){return Array.isArray(t)?t.map(t=>v(t)).filter(Boolean).join("\n"):t&&"string"==typeof t.cssText?t.cssText:"string"==typeof t?t:""}
+const b=t=>{class e extends t{constructor(){super(...arguments),this.t=null}createRenderRoot(){return this.constructor.useShadowDom?super.createRenderRoot():this}connectedCallback(){const t=this.constructor.useShadowDom;if(!t&&null===this.t)for(this.t=[];this.firstChild;)this.t.push(this.removeChild(this.firstChild));if(super.connectedCallback(),!t){const t=this.constructor,e=this.tagName.toLowerCase(),o=t.styles;if(o){const t=v(o);t&&function(t,e,o){var s;if(!f.has(t)){const o=new CSSStyleSheet;o.replaceSync(e),f.set(t,o)}const i=f.get(t),r=`doc:${t}`;if(p.has(r)||(document.adoptedStyleSheets=[...document.adoptedStyleSheets,i],p.add(r)),o){let e=o;for(;e;){const o=e.getRootNode();if(!(o instanceof ShadowRoot))break;{const r=`shadow:${((null===(s=o.host)||void 0===s?void 0:s.tagName)||"").toLowerCase()}:${t}`;p.has(r)||(o.adoptedStyleSheets=[...o.adoptedStyleSheets,i],p.add(r)),e=o.host}}}}(e,t,this)}}}get lightChildren(){return this.t?this.t.filter(t=>!(t instanceof Element&&t.hasAttribute("slot"))):[]}lightChildrenNamed(t){return this.t?this.t.filter(e=>e instanceof Element&&e.getAttribute("slot")===t):[]}}return e.useShadowDom=!1,e};function v(t){return Array.isArray(t)?t.map(t=>v(t)).filter(Boolean).join("\n"):t&&"string"==typeof t.cssText?t.cssText:"string"==typeof t?t:""}
 /**
  * @license
  * Copyright 2023 Nuraly, Laabidi Aymen
@@ -349,32 +349,34 @@ const b=t=>{class e extends t{constructor(){super(...arguments),this.t=null}crea
  * SPDX-License-Identifier: MIT
  */
 var x=function(t,e,o,s){for(var i,r=arguments.length,n=r<3?e:null===s?s=Object.getOwnPropertyDescriptor(e,o):s,a=t.length-1;a>=0;a--)(i=t[a])&&(n=(r<3?i(n):r>3?i(e,o,n):i(e,o))||n);return r>3&&n&&Object.defineProperty(e,o,n),n};let k=class extends((t=>u(d(m(b(t)))))(s)){constructor(){super(...arguments),this.requiredComponents=["nr-icon","nr-button"],this.position="top-right",this.maxToasts=5,this.defaultDuration=5e3,this.animation="fade",this.stack=!0,this.autoDismiss=!0,this.toasts=[],this.timeouts=new Map}show(t){var e,o,s;const i="string"==typeof t?{text:t}:t,r={id:this.generateId(),timestamp:Date.now(),text:i.text,content:i.content,type:i.type||"default",duration:null!==(e=i.duration)&&void 0!==e?e:this.defaultDuration,autoDismiss:null!==(o=i.autoDismiss)&&void 0!==o?o:this.autoDismiss,closable:null===(s=i.closable)||void 0===s||s,icon:i.icon||this.getDefaultIcon(i.type),customClass:i.customClass,button:i.button,onClose:i.onClose,onClick:i.onClick};if(this.stack?this.toasts.length>=this.maxToasts&&this.removeToast(this.toasts[0].id):this.clearAll(),this.toasts=[...this.toasts,r],this.emitToastEvent("nr-toast-show",r,"show"),r.autoDismiss&&r.duration&&r.duration>0){const t=window.setTimeout(()=>{this.removeToast(r.id)},r.duration);this.timeouts.set(r.id,t)}return r.id}success(t,e){return this.show({text:t,type:"success",duration:e})}error(t,e){return this.show({text:t,type:"error",duration:e})}warning(t,e){return this.show({text:t,type:"warning",duration:e})}info(t,e){return this.show({text:t,type:"info",duration:e})}removeToast(t){const e=this.toasts.find(e=>e.id===t);if(!e)return;e.removing=!0,this.requestUpdate();const o=this.timeouts.get(t);o&&(clearTimeout(o),this.timeouts.delete(t)),setTimeout(()=>{var o;this.toasts=this.toasts.filter(e=>e.id!==t),this.emitToastEvent("nr-toast-close",e,"close"),null===(o=e.onClose)||void 0===o||o.call(e)},300)}clearAll(){this.toasts.forEach(t=>{const e=this.timeouts.get(t.id);e&&clearTimeout(e)}),this.timeouts.clear(),this.toasts=[]}handleToastClick(t){var e;this.emitToastEvent("nr-toast-click",t,"click"),null===(e=t.onClick)||void 0===e||e.call(t)}handleCloseClick(t,e){t.stopPropagation(),this.removeToast(e.id)}getDefaultIcon(t){switch(t){case"success":return"check-circle";case"error":return"x-circle";case"warning":return"alert-triangle";case"info":return"info";default:return""}}generateId(){return`toast-${Date.now()}-${Math.random().toString(36).substr(2,9)}`}getAnimationClass(t){const e=t.removing?"out":"in";return`toast--${this.animation}-${e}`}emitToastEvent(t,e,o){this.dispatchEvent(new CustomEvent(t,{detail:{toast:e,action:o},bubbles:!0,composed:!0}))}disconnectedCallback(){super.disconnectedCallback(),this.clearAll()}render(){return e`
-      <div class="toast-container">
+      <div class="toast-container" part="container">
         ${a(this.toasts,t=>t.id,t=>this.renderToast(t))}
       </div>
     `}renderToast(t){const s={toast:!0,[`toast--${t.type}`]:!0,[this.getAnimationClass(t)]:!0,[t.customClass||""]:!!t.customClass};return e`
       <div
         class=${c(s)}
+        part="toast toast-${t.type}"
         @click=${()=>this.handleToastClick(t)}
         role="alert"
         aria-live="polite"
       >
         ${t.icon?e`
-          <div class="toast__icon">
+          <div class="toast__icon" part="icon">
             <nr-icon name=${t.icon} size="medium"></nr-icon>
           </div>
         `:o}
-        
-        <div class="toast__content">
+
+        <div class="toast__content" part="content">
           ${t.content?t.content:e`
-              <div class="toast__text">${t.text}</div>
+              <div class="toast__text" part="text">${t.text}</div>
               ${t.button?this.renderButton(t.button):o}
             `}
         </div>
-        
+
         ${t.closable?e`
           <button
             class="toast__close"
+            part="close"
             @click=${e=>this.handleCloseClick(e,t)}
             aria-label="Close notification"
             type="button"
@@ -384,7 +386,7 @@ var x=function(t,e,o,s){for(var i,r=arguments.length,n=r<3?e:null===s?s=Object.g
         `:o}
       </div>
     `}renderButton(t){return e`
-      <div class="toast__button">
+      <div class="toast__button" part="button">
         <nr-button
           type=${t.type||"default"}
           size=${t.size||"small"}

package/dist/src/components/toast/controllers/base.controller.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+import { ReactiveControllerHost } from 'lit';
+import { BaseComponentController } from '@nuralyui/common/controllers';
+/**
+ * Base interface for toast controllers
+ */
+export interface ToastControllerHost extends ReactiveControllerHost {
+    requestUpdate(): void;
+    dispatchEvent(event: Event): boolean;
+}
+/**
+ * Abstract base controller for toast component controllers
+ */
+export declare abstract class BaseToastController extends BaseComponentController<ToastControllerHost> {
+}
+//# sourceMappingURL=base.controller.d.ts.map

package/dist/src/components/toast/controllers/base.controller.js

@@ -0,0 +1,12 @@
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+import { BaseComponentController } from '@nuralyui/common/controllers';
+/**
+ * Abstract base controller for toast component controllers
+ */
+export class BaseToastController extends BaseComponentController {
+}
+//# sourceMappingURL=base.controller.js.map