dalila 1.8.2 → 1.8.4

package/dist/ui/tabs.js

@@ -1,101 +0,0 @@
-import { signal, computed } from "../core/signal.js";
-import { getCurrentScope } from "../core/scope.js";
-export function createTabs(options = {}) {
-    const { initial = "", orientation = "horizontal" } = options;
-    const active = signal(initial);
-    const select = (tabId) => active.set(tabId);
-    const isActive = (tabId) => active() === tabId;
-    const handleClick = (ev) => {
-        const target = ev.target.closest("[data-tab]");
-        if (target && target.dataset.tab) {
-            select(target.dataset.tab);
-        }
-    };
-    const _attachTo = (el) => {
-        const scope = getCurrentScope();
-        // ARIA setup
-        const tabList = el.querySelector("[data-d-tag='d-tab-list'], .d-tab-list");
-        if (tabList) {
-            tabList.setAttribute("role", "tablist");
-            tabList.setAttribute("aria-orientation", orientation);
-        }
-        const tabButtons = el.querySelectorAll("[data-tab]");
-        const panels = el.querySelectorAll("[data-d-tag='d-tab-panel'], .d-tab-panel");
-        tabButtons.forEach((btn, i) => {
-            btn.setAttribute("role", "tab");
-            const tabId = btn.dataset.tab;
-            const btnId = btn.id || `d-tab-${tabId}`;
-            if (!btn.id)
-                btn.id = btnId;
-            if (panels[i]) {
-                const panelId = panels[i].id || `d-tabpanel-${tabId}`;
-                if (!panels[i].id)
-                    panels[i].id = panelId;
-                panels[i].setAttribute("role", "tabpanel");
-                panels[i].setAttribute("aria-labelledby", btnId);
-                btn.setAttribute("aria-controls", panelId);
-            }
-        });
-        const syncAria = (activeId) => {
-            tabButtons.forEach((btn, i) => {
-                const isAct = btn.dataset.tab === activeId;
-                btn.setAttribute("aria-selected", String(isAct));
-                btn.setAttribute("tabindex", isAct ? "0" : "-1");
-                if (panels[i])
-                    panels[i].setAttribute("aria-hidden", String(!isAct));
-            });
-        };
-        // Apply initial state
-        syncAria(active());
-        const unsub = active.on(syncAria);
-        // Keyboard navigation
-        const prevKey = orientation === "vertical" ? "ArrowUp" : "ArrowLeft";
-        const nextKey = orientation === "vertical" ? "ArrowDown" : "ArrowRight";
-        const onKeydown = (ev) => {
-            const tabs = Array.from(tabButtons);
-            const currentIndex = tabs.findIndex((btn) => btn.dataset.tab === active());
-            let nextIndex = -1;
-            switch (ev.key) {
-                case nextKey:
-                    ev.preventDefault();
-                    nextIndex = currentIndex < tabs.length - 1 ? currentIndex + 1 : 0;
-                    break;
-                case prevKey:
-                    ev.preventDefault();
-                    nextIndex = currentIndex > 0 ? currentIndex - 1 : tabs.length - 1;
-                    break;
-                case "Home":
-                    ev.preventDefault();
-                    nextIndex = 0;
-                    break;
-                case "End":
-                    ev.preventDefault();
-                    nextIndex = tabs.length - 1;
-                    break;
-                default:
-                    return;
-            }
-            const nextTab = tabs[nextIndex];
-            if (nextTab?.dataset.tab) {
-                select(nextTab.dataset.tab);
-                nextTab.focus();
-            }
-        };
-        if (tabList)
-            tabList.addEventListener("keydown", onKeydown);
-        if (scope) {
-            scope.onCleanup(() => {
-                unsub();
-                if (tabList)
-                    tabList.removeEventListener("keydown", onKeydown);
-            });
-        }
-    };
-    return { active, select, isActive, handleClick, _attachTo };
-}
-export function tabBindings(tabs, tabId) {
-    const tabClass = computed(() => tabs.active() === tabId ? "d-tab active" : "d-tab");
-    const selected = computed(() => tabs.active() === tabId ? "true" : "false");
-    const visible = computed(() => tabs.active() === tabId);
-    return { tabClass, selected, visible };
-}

package/dist/ui/toast.d.ts

@@ -1,3 +0,0 @@
-import type { Toast, ToastOptions, ToastVariant } from "./ui-types.js";
-export declare function createToast(options?: ToastOptions): Toast;
-export declare function toastIcon(variant: () => ToastVariant | "idle"): DocumentFragment;

package/dist/ui/toast.js

@@ -1,115 +0,0 @@
-import { signal } from "../core/signal.js";
-import { getCurrentScope } from "../core/scope.js";
-import { match } from "../core/match.js";
-import { html } from "../core/html.js";
-import { validateToastOptions } from "./validate.js";
-import { isBrowser } from "./env.js";
-const VARIANT_CLASSES = {
-    success: "d-toast d-toast-success",
-    error: "d-toast d-toast-error",
-    warning: "d-toast d-toast-warning",
-    info: "d-toast d-toast-info",
-};
-const VARIANT_ICONS = {
-    success: "\u2705",
-    error: "\u274C",
-    warning: "\u26A0\uFE0F",
-    info: "\u2139\uFE0F",
-};
-const POSITION_CLASSES = {
-    "top-right": "d-toast-container d-toast-top-right",
-    "top-left": "d-toast-container d-toast-top-left",
-    "bottom-right": "d-toast-container d-toast-bottom-right",
-    "bottom-left": "d-toast-container d-toast-bottom-left",
-    "top-center": "d-toast-container d-toast-top-center",
-    "bottom-center": "d-toast-container d-toast-bottom-center",
-};
-let toastUid = 0;
-export function createToast(options = {}) {
-    validateToastOptions(options);
-    const { position = "top-right", duration: defaultDuration = 4000, maxToasts = 5, } = options;
-    const items = signal([]);
-    const activeVariant = signal("idle");
-    const containerClass = signal(POSITION_CLASSES[position] ?? POSITION_CLASSES["top-right"]);
-    const scope = getCurrentScope();
-    const timers = new Map();
-    const dismiss = (id) => {
-        const timer = timers.get(id);
-        if (timer) {
-            clearTimeout(timer);
-            timers.delete(id);
-        }
-        items.update((list) => list.filter((t) => t.id !== id));
-        if (items().length === 0)
-            activeVariant.set("idle");
-    };
-    const clear = () => {
-        timers.forEach((t) => clearTimeout(t));
-        timers.clear();
-        items.set([]);
-        activeVariant.set("idle");
-    };
-    const show = (variant, title, text, duration) => {
-        const id = `toast-${++toastUid}`;
-        const item = {
-            id,
-            variant,
-            title,
-            text,
-            variantClass: VARIANT_CLASSES[variant],
-            icon: VARIANT_ICONS[variant],
-        };
-        items.update((list) => {
-            const next = [...list, item];
-            // Enforce max toasts — remove oldest
-            while (next.length > maxToasts) {
-                const oldest = next.shift();
-                const timer = timers.get(oldest.id);
-                if (timer) {
-                    clearTimeout(timer);
-                    timers.delete(oldest.id);
-                }
-            }
-            return next;
-        });
-        activeVariant.set(variant);
-        const ms = duration ?? defaultDuration;
-        if (ms > 0) {
-            const timer = setTimeout(() => dismiss(id), ms);
-            timers.set(id, timer);
-        }
-        return id;
-    };
-    const success = (title, text) => show("success", title, text);
-    const error = (title, text) => show("error", title, text);
-    const warning = (title, text) => show("warning", title, text);
-    const info = (title, text) => show("info", title, text);
-    if (scope) {
-        scope.onCleanup(() => {
-            timers.forEach((t) => clearTimeout(t));
-            timers.clear();
-        });
-    }
-    return {
-        items,
-        activeVariant,
-        containerClass,
-        show,
-        success,
-        error,
-        warning,
-        info,
-        dismiss,
-        clear,
-    };
-}
-export function toastIcon(variant) {
-    return match(variant, {
-        success: () => html `<span class="d-toast-icon">\u2705</span>`,
-        error: () => html `<span class="d-toast-icon">\u274C</span>`,
-        warning: () => html `<span class="d-toast-icon">\u26A0\uFE0F</span>`,
-        info: () => html `<span class="d-toast-icon">\u2139\uFE0F</span>`,
-        idle: () => isBrowser ? document.createComment("no toast") : null,
-        _: () => isBrowser ? document.createComment("no toast") : null,
-    });
-}

package/dist/ui/ui-types.d.ts

@@ -1,175 +0,0 @@
-import type { Signal } from "../core/signal.js";
-export interface DialogOptions {
-    closeOnBackdrop?: boolean;
-    closeOnEscape?: boolean;
-}
-export interface Dialog {
-    open: Signal<boolean>;
-    show(): void;
-    close(): void;
-    toggle(): void;
-    _attachTo(el: HTMLDialogElement): void;
-}
-export type DrawerSide = "right" | "left" | "bottom";
-export interface DrawerOptions extends DialogOptions {
-    side?: DrawerSide;
-}
-export interface Drawer extends Dialog {
-    side: Signal<DrawerSide>;
-}
-export type ToastVariant = "success" | "error" | "warning" | "info";
-export type ToastPosition = "top-right" | "top-left" | "bottom-right" | "bottom-left" | "top-center" | "bottom-center";
-export interface ToastItem {
-    id: string;
-    variant: ToastVariant;
-    title: string;
-    text?: string;
-    variantClass: string;
-    icon: string;
-}
-export interface ToastOptions {
-    position?: ToastPosition;
-    duration?: number;
-    maxToasts?: number;
-}
-export interface Toast {
-    items: Signal<ToastItem[]>;
-    activeVariant: Signal<ToastVariant | "idle">;
-    containerClass: Signal<string>;
-    show(variant: ToastVariant, title: string, text?: string, duration?: number): string;
-    success(title: string, text?: string): string;
-    error(title: string, text?: string): string;
-    warning(title: string, text?: string): string;
-    info(title: string, text?: string): string;
-    dismiss(id: string): void;
-    clear(): void;
-}
-export interface TabsOptions {
-    initial?: string;
-    orientation?: "horizontal" | "vertical";
-}
-export interface Tabs {
-    active: Signal<string>;
-    select(tabId: string): void;
-    isActive(tabId: string): boolean;
-    handleClick(ev: Event): void;
-    _attachTo(el: HTMLElement): void;
-}
-export interface TabBindings {
-    tabClass: Signal<string>;
-    selected: Signal<string>;
-    visible: Signal<boolean>;
-}
-export interface DropdownOptions {
-    closeOnSelect?: boolean;
-}
-export interface Dropdown {
-    open: Signal<boolean>;
-    toggle(ev?: Event): void;
-    close(): void;
-    select(ev?: Event): void;
-    _attachTo(el: HTMLElement): void;
-}
-export interface ComboboxOption {
-    value: string;
-    label: string;
-}
-export interface ComboboxOptions {
-    options: ComboboxOption[];
-    placeholder?: string;
-    name?: string;
-}
-export interface Combobox {
-    open: Signal<boolean>;
-    query: Signal<string>;
-    value: Signal<string>;
-    label: Signal<string>;
-    filtered: Signal<ComboboxOption[]>;
-    highlightedIndex: Signal<number>;
-    show(): void;
-    close(): void;
-    toggle(): void;
-    handleInput(ev: Event): void;
-    handleSelect(ev: Event): void;
-    handleKeydown(ev: KeyboardEvent): void;
-    _attachTo(el: HTMLElement): void;
-}
-export interface AccordionOptions {
-    single?: boolean;
-    initial?: string[];
-}
-export interface Accordion {
-    openItems: Signal<Set<string>>;
-    toggle(itemId: string): void;
-    open(itemId: string): void;
-    close(itemId: string): void;
-    isOpen(itemId: string): Signal<boolean>;
-    _attachTo(el: HTMLElement): void;
-}
-export interface CalendarDay {
-    date: number;
-    month: "prev" | "current" | "next";
-    fullDate: Date;
-    isToday: boolean;
-    isSelected: boolean;
-    disabled: boolean;
-}
-export interface CalendarOptions {
-    initial?: Date;
-    min?: Date;
-    max?: Date;
-    dayLabels?: string[];
-    monthLabels?: string[];
-}
-export interface Calendar {
-    year: Signal<number>;
-    month: Signal<number>;
-    selected: Signal<Date | null>;
-    title: Signal<string>;
-    days: Signal<CalendarDay[]>;
-    dayLabels: string[];
-    prev(): void;
-    next(): void;
-    select(date: Date): void;
-    handleDayClick(ev: Event): void;
-}
-export interface DropzoneOptions {
-    accept?: string;
-    multiple?: boolean;
-    maxFiles?: number;
-    maxSize?: number;
-}
-export interface Dropzone {
-    dragging: Signal<boolean>;
-    files: Signal<File[]>;
-    browse(): void;
-    handleClick(): void;
-    handleDragover(ev: DragEvent): void;
-    handleDragleave(): void;
-    handleDrop(ev: DragEvent): void;
-    _attachTo(el: HTMLElement): void;
-}
-export type PopoverPlacement = "top" | "bottom" | "left" | "right" | "top-start" | "bottom-start";
-export interface PopoverOptions {
-    placement?: PopoverPlacement;
-    gap?: number;
-    viewportPadding?: number;
-}
-export interface Popover {
-    open: Signal<boolean>;
-    placement: Signal<PopoverPlacement>;
-    show(): void;
-    hide(): void;
-    toggle(): void;
-    position(trigger: HTMLElement, popoverEl: HTMLElement): void;
-    _attachTo(trigger: HTMLElement, popoverEl: HTMLElement): void;
-}
-export interface TabsMount {
-    api: Tabs;
-    bindings: [string, string][];
-}
-export interface PopoverMount {
-    api: Popover;
-    triggerId?: string;
-    panelId?: string;
-}

package/dist/ui/ui-types.js

@@ -1 +0,0 @@
-export {};

package/dist/ui/validate.d.ts

@@ -1,7 +0,0 @@
-export declare function validateDialogOptions(opts: Record<string, unknown>): void;
-export declare function validateDrawerOptions(opts: Record<string, unknown>): void;
-export declare function validateToastOptions(opts: Record<string, unknown>): void;
-export declare function validatePopoverOptions(opts: Record<string, unknown>): void;
-export declare function validateDropzoneOptions(opts: Record<string, unknown>): void;
-export declare function validateCalendarOptions(opts: Record<string, unknown>): void;
-export declare function validateComboboxOptions(opts: Record<string, unknown>): void;

package/dist/ui/validate.js

@@ -1,71 +0,0 @@
-// ── Prop Validation ─────────────────────────────────────────────────
-const VALID_TOAST_POSITIONS = new Set([
-    "top-right", "top-left", "bottom-right", "bottom-left", "top-center", "bottom-center",
-]);
-const VALID_POPOVER_PLACEMENTS = new Set([
-    "top", "bottom", "left", "right", "top-start", "bottom-start",
-]);
-const VALID_DRAWER_SIDES = new Set(["right", "left", "bottom"]);
-function warn(component, message) {
-    console.warn(`[Dalila] ${component}: ${message}`);
-}
-function warnInvalidType(component, prop, expected, got) {
-    warn(component, `"${prop}" expected ${expected}, got ${typeof got} (${String(got)})`);
-}
-export function validateDialogOptions(opts) {
-    if (opts.closeOnBackdrop !== undefined && typeof opts.closeOnBackdrop !== "boolean") {
-        warnInvalidType("createDialog", "closeOnBackdrop", "boolean", opts.closeOnBackdrop);
-    }
-    if (opts.closeOnEscape !== undefined && typeof opts.closeOnEscape !== "boolean") {
-        warnInvalidType("createDialog", "closeOnEscape", "boolean", opts.closeOnEscape);
-    }
-}
-export function validateDrawerOptions(opts) {
-    validateDialogOptions(opts);
-    if (opts.side !== undefined && !VALID_DRAWER_SIDES.has(opts.side)) {
-        warn("createDrawer", `"side" must be one of "right"|"left"|"bottom", got "${String(opts.side)}"`);
-    }
-}
-export function validateToastOptions(opts) {
-    if (opts.position !== undefined && !VALID_TOAST_POSITIONS.has(opts.position)) {
-        warn("createToast", `"position" must be a valid ToastPosition, got "${String(opts.position)}"`);
-    }
-    if (opts.duration !== undefined && (typeof opts.duration !== "number" || opts.duration < 0)) {
-        warn("createToast", `"duration" must be a number >= 0, got ${String(opts.duration)}`);
-    }
-    if (opts.maxToasts !== undefined && (typeof opts.maxToasts !== "number" || opts.maxToasts <= 0)) {
-        warn("createToast", `"maxToasts" must be a number > 0, got ${String(opts.maxToasts)}`);
-    }
-}
-export function validatePopoverOptions(opts) {
-    if (opts.placement !== undefined && !VALID_POPOVER_PLACEMENTS.has(opts.placement)) {
-        warn("createPopover", `"placement" must be a valid PopoverPlacement, got "${String(opts.placement)}"`);
-    }
-    if (opts.gap !== undefined && (typeof opts.gap !== "number" || opts.gap < 0)) {
-        warn("createPopover", `"gap" must be a number >= 0, got ${String(opts.gap)}`);
-    }
-    if (opts.viewportPadding !== undefined && (typeof opts.viewportPadding !== "number" || opts.viewportPadding < 0)) {
-        warn("createPopover", `"viewportPadding" must be a number >= 0, got ${String(opts.viewportPadding)}`);
-    }
-}
-export function validateDropzoneOptions(opts) {
-    if (opts.maxFiles !== undefined && (typeof opts.maxFiles !== "number" || opts.maxFiles <= 0)) {
-        warn("createDropzone", `"maxFiles" must be a number > 0, got ${String(opts.maxFiles)}`);
-    }
-    if (opts.maxSize !== undefined && (typeof opts.maxSize !== "number" || opts.maxSize <= 0)) {
-        warn("createDropzone", `"maxSize" must be a number > 0, got ${String(opts.maxSize)}`);
-    }
-}
-export function validateCalendarOptions(opts) {
-    const min = opts.min;
-    const max = opts.max;
-    if (min && max && min > max) {
-        warn("createCalendar", `"min" must be before "max"`);
-    }
-}
-export function validateComboboxOptions(opts) {
-    const options = opts.options;
-    if (!Array.isArray(options) || options.length === 0) {
-        warn("createCombobox", `"options" must be a non-empty array`);
-    }
-}