tyrell-components 1.0.0-RC11 → 1.0.0-RC13

package/lib/components/dropdown.d.ts

@@ -1,424 +0,0 @@
-/**
- * TyDropdown Web Component
- * PORTED FROM: clj/ty/components/dropdown.cljs
- *
- * A semantic dropdown component with:
- * - Desktop mode with smart positioning
- * - Mobile mode with full-screen modal
- * - Search and filtering capabilities
- * - Keyboard navigation
- * - Form association for native form submission
- * - Rich option support (option, ty-option, ty-tag)
- *
- * @example
- * ```html
- * <!-- Basic dropdown -->
- * <ty-dropdown label="Country" placeholder="Select country" required>
- *   <option value="us">United States</option>
- *   <option value="uk">United Kingdom</option>
- *   <option value="ca">Canada</option>
- * </ty-dropdown>
- *
- * <!-- With rich options -->
- * <ty-dropdown label="User">
- *   <ty-option value="1">
- *     <div class="flex items-center gap-2">
- *       <img src="avatar1.jpg" class="w-8 h-8 rounded-full" />
- *       <span>John Doe</span>
- *     </div>
- *   </ty-option>
- * </ty-dropdown>
- *
- * <!-- External search (parent owns filtering, dropdown emits `search` events) -->
- * <ty-dropdown label="Search API" external-search debounce="300">
- *   <option value="1">Result 1</option>
- * </ty-dropdown>
- * ```
- */
-import type { Flavor, Size } from '../types/common.js';
-import { TyComponent } from '../base/ty-component.js';
-import type { PropertyChange } from '../utils/property-manager.js';
-/**
- * Option data structure
- */
-interface OptionData {
-    value: string;
-    text: string;
-    element: HTMLElement;
-}
-/**
- * Component state structure
- */
-interface DropdownState {
-    open: boolean;
-    search: string;
-    highlightedIndex: number;
-    filteredOptions: OptionData[];
-    currentValue: string | null;
-    mode: 'desktop' | 'mobile';
-}
-/**
- * Ty Dropdown Component
- */
-export declare class TyDropdown extends TyComponent<DropdownState> {
-    protected static properties: {
-        value: {
-            type: "string";
-            visual: boolean;
-            formValue: boolean;
-            emitChange: boolean;
-            default: string;
-        };
-        name: {
-            type: "string";
-            default: string;
-        };
-        placeholder: {
-            type: "string";
-            visual: boolean;
-            default: string;
-        };
-        label: {
-            type: "string";
-            visual: boolean;
-            default: string;
-        };
-        disabled: {
-            type: "boolean";
-            visual: boolean;
-            default: boolean;
-        };
-        readonly: {
-            type: "boolean";
-            visual: boolean;
-            default: boolean;
-        };
-        required: {
-            type: "boolean";
-            visual: boolean;
-            default: boolean;
-        };
-        externalSearch: {
-            type: "boolean";
-            visual: boolean;
-            default: boolean;
-            aliases: {
-                'external-search': boolean;
-            };
-        };
-        clearable: {
-            type: "boolean";
-            visual: boolean;
-            default: boolean;
-            aliases: {
-                'not-clearable': boolean;
-            };
-        };
-        size: {
-            type: "string";
-            visual: boolean;
-            default: string;
-            validate: (v: any) => boolean;
-            coerce: (v: any) => any;
-        };
-        flavor: {
-            type: "string";
-            visual: boolean;
-            default: string;
-            validate: (v: any) => boolean;
-            coerce: (v: any) => any;
-        };
-        debounce: {
-            type: "number";
-            default: number;
-            validate: (v: any) => boolean;
-            coerce: (v: any) => number;
-        };
-        loading: {
-            type: "boolean";
-            visual: boolean;
-            default: boolean;
-        };
-    };
-    private _value;
-    private _placeholder;
-    private _label;
-    private _disabled;
-    private _readonly;
-    private _required;
-    private _externalSearch;
-    private _clearable;
-    private _loading;
-    private _size;
-    private _state;
-    private _scrollLockId;
-    private _stubClickHandler;
-    private _outsideClickHandler;
-    private _optionClickHandler;
-    private _searchInputHandler;
-    private _blockSearchClick;
-    private _keyboardHandler;
-    private _clearClickHandler;
-    private _debounce;
-    private _searchDebounceTimer;
-    private _optionsScrollbar;
-    private _childObserver;
-    constructor();
-    render(): void;
-    /**
-     * Called when component is connected to DOM
-     * TyComponent handles property capture automatically
-     */
-    protected onConnect(): void;
-    /**
-     * Called when component is disconnected from DOM
-     * Clean up event listeners and timers
-     */
-    protected onDisconnect(): void;
-    /**
-     * Re-establish the visual selection (selected attribute + slot clone) for the
-     * current value, when the matching option exists in children but isn't yet
-     * marked. Called from the children MutationObserver — covers the case where
-     * a consumer swaps options dynamically (external-search refresh) and wipes
-     * out the previous selection's marker + clone in the process.
-     *
-     * Idempotent — bails when nothing to do, so it's safe to call from the
-     * MutationObserver callback even when the trigger was our own clone work.
-     */
-    private redisplaySelected;
-    /**
-     * Called when properties change
-     * Handle state synchronization BEFORE render
-     */
-    protected onPropertiesChanged(changes: PropertyChange[]): void;
-    /**
-     * Toggle the loading visual state on the open popup.
-     * Replaces the options list with a centered spinner; search input stays usable.
-     * Pulls the latest registered loader SVG on each call so registry changes
-     * take effect on the next loading toggle.
-     */
-    private applyLoadingState;
-    /**
-     * Get the form value for this component
-     * TyComponent calls this automatically when formValue property changes
-     */
-    protected getFormValue(): FormDataEntryValue | null;
-    /**
-     * Parse dropdown value (single string)
-     */
-    private parseValue;
-    /**
-     * Initialize component state from attributes
-     */
-    private initializeState;
-    /**
-     * Update placeholder text in existing rendered HTML
-     * Called when placeholder changes after initial render
-     */
-    private updatePlaceholderInDOM;
-    /**
-     * Update form value via ElementInternals
-     */
-    /**
-     * Get all option elements from slot
-     * Supports: <option>, <ty-option>, <ty-tag>
-     */
-    private getOptions;
-    /**
-     * Extract value and text from option element
-     */
-    private getOptionData;
-    /**
-     * Clear all selections
-     */
-    private clearSelection;
-    /**
-     * Select an option
-     */
-    private selectOption;
-    /**
-     * Sync selected option based on current value
-     */
-    private syncSelectedOption;
-    /**
-     * Update component value attribute for consistency
-     */
-    private updateComponentValue;
-    /**
-     * Update selection display (show/hide placeholder)
-     */
-    private updateSelectionDisplay;
-    private updateClearButton;
-    /**
-     * Dispatch change event
-     */
-    private dispatchChangeEvent;
-    private filterOptions;
-    private updateOptionVisibility;
-    /**
-     * Clear all option highlights
-     */
-    private clearHighlights;
-    private highlightOption;
-    /**
-     * Setup event listeners
-     */
-    private setupDesktopEventListeners;
-    /**
-     * Lock scroll with consistent ID generation
-     */
-    private lockDropdownScroll;
-    /**
-     * Unlock scroll using stored ID
-     */
-    private unlockDropdownScroll;
-    /**
-     * Initialize options state when opening dropdown/modal
-     * @param highlightSelected - Whether to highlight the currently selected option
-     */
-    private initializeOptionsState;
-    /**
-     * Base stub click handler - validates state then calls open callback
-     * @param e - Click event
-     * @param openCallback - Function to call to open (desktop or mobile)
-     */
-    private handleStubClickBase;
-    /**
-     * Base option click handler - finds option, selects it, then calls close callback
-     * @param e - Click event
-     * @param closeCallback - Function to call to close (desktop or mobile)
-     */
-    private handleOptionClickBase;
-    /**
-     * Base clear click handler - clears selection and optionally closes
-     * @param e - Click event
-     * @param closeCallback - Optional function to call to close (mobile only)
-     */
-    private handleClearClickBase;
-    /**
-     * Calculate and set dropdown position with smart direction detection
-     */
-    private calculateDesktopPosition;
-    /**
-     * Open dropdown dialog
-     */
-    private openDesktopDropdown;
-    /**
-     * Close dropdown dialog
-     */
-    private closeDesktopDropdown;
-    /**
-     * Handle outside click to close dropdown
-     */
-    private handleDesktopOutsideClick;
-    /**
-     * Handle search input changes
-     */
-    private handleSearchInput;
-    /**
-     * Block search input click from bubbling
-     * Prevents search input clicks from triggering outside click handler
-     */
-    private blockSearchClick;
-    /**
-     * Dispatch search event for external search handling
-     * With optional debounce support
-     */
-    private dispatchSearchEvent;
-    /**
-     * Fire the actual search event
-     */
-    private fireSearchEvent;
-    /**
-     * Dispatch lifecycle events for popup open/close.
-     * On open with external-search, also fire a `search` event with an empty
-     * query so consumers have a clean hook to reset/refetch the option list —
-     * fixes the "stale filtered options on reopen" UX issue.
-     */
-    private fireOpenEvent;
-    private fireCloseEvent;
-    /**
-     * Handle keyboard navigation
-     */
-    private handleDesktopKeyboard;
-    /**
-     * Handle stub click - open dropdown
-     */
-    private handleDesktopStubClick;
-    /**
-     * Handle option click - select option and close
-     */
-    private handleDesktopOptionClick;
-    /**
-     * Handle clear button click - clear selection
-     * CRITICAL: Must prevent dropdown from opening!
-     */
-    private handleDesktopClearClick;
-    private _setupOptionsScrollbar;
-    private _destroyOptionsScrollbar;
-    /**
-     * Build CSS class list for stub
-     */
-    private buildStubClasses;
-    /**
-     * Render desktop mode with dialog
-     */
-    private renderDesktop;
-    /**
-     * Render mobile mode with full-screen modal
-     */
-    private renderMobile;
-    /**
-     * Setup event listeners for mobile mode
-     */
-    private setupMobileEventListeners;
-    /**
-     * Handle mobile stub click - open modal
-     */
-    private handleMobileStubClick;
-    /**
-     * Handle mobile option click - select and close
-     */
-    private handleMobileOptionClick;
-    /**
-     * Handle clear click in mobile modal
-     */
-    private handleMobileClearClick;
-    /**
-       * Open mobile modal
-       */
-    private openMobileModal;
-    /**
-     * Close mobile modal
-     */
-    private closeMobileModal;
-    get value(): string;
-    set value(v: string);
-    get name(): string;
-    set name(v: string);
-    get placeholder(): string;
-    set placeholder(v: string);
-    get label(): string;
-    set label(v: string);
-    get disabled(): boolean;
-    set disabled(v: boolean);
-    get readonly(): boolean;
-    set readonly(v: boolean);
-    get required(): boolean;
-    set required(v: boolean);
-    get externalSearch(): boolean;
-    set externalSearch(v: boolean);
-    get clearable(): boolean;
-    set clearable(v: boolean);
-    get loading(): boolean;
-    set loading(v: boolean);
-    get size(): Size;
-    set size(v: Size);
-    get flavor(): Flavor;
-    set flavor(v: Flavor);
-    get debounce(): number;
-    set debounce(v: number);
-    get form(): HTMLFormElement | null;
-}
-export {};
-//# sourceMappingURL=dropdown.d.ts.map

package/lib/components/dropdown.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../src/components/dropdown.ts"],"names":[],"mappings":"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"}