@smilodon/core 1.3.2 → 1.3.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.umd.js CHANGED
@@ -550,13 +550,11 @@
550
550
  component = pooled.instance;
551
551
  pooled.inUse = true;
552
552
  pooled.lastUsedIndex = index;
553
- console.log(`[CustomOptionPool] Reusing component for index ${index}`);
554
553
  }
555
554
  else {
556
555
  // Create new component
557
556
  try {
558
557
  component = factory(item, index);
559
- console.log(`[CustomOptionPool] Created new component for index ${index}`);
560
558
  // Add to pool if under limit
561
559
  const pool = this._pool.get(factoryKey) || [];
562
560
  if (pool.length < this._maxPoolSize) {
@@ -605,7 +603,6 @@
605
603
  const pooled = pool.find(p => p.instance === component);
606
604
  if (pooled) {
607
605
  pooled.inUse = false;
608
- console.log(`[CustomOptionPool] Released component from index ${index}`);
609
606
  break;
610
607
  }
611
608
  }
@@ -614,7 +611,6 @@
614
611
  * Release all active components
615
612
  */
616
613
  releaseAll() {
617
- console.log(`[CustomOptionPool] Releasing ${this._activeComponents.size} active components`);
618
614
  const indices = Array.from(this._activeComponents.keys());
619
615
  indices.forEach(index => this.release(index));
620
616
  }
@@ -657,7 +653,6 @@
657
653
  clear() {
658
654
  this.releaseAll();
659
655
  this._pool.clear();
660
- console.log('[CustomOptionPool] Pool cleared');
661
656
  }
662
657
  /**
663
658
  * Get pool statistics for debugging
@@ -836,7 +831,6 @@
836
831
  });
837
832
  }
838
833
  this._mountedElements.set(index, option);
839
- console.log(`[OptionRenderer] Rendered lightweight option ${index}: ${label}`);
840
834
  return option;
841
835
  }
842
836
  /**
@@ -896,7 +890,6 @@
896
890
  }
897
891
  });
898
892
  }
899
- console.log(`[OptionRenderer] Rendered custom component option ${index}: ${label}`);
900
893
  }
901
894
  catch (error) {
902
895
  console.error(`[OptionRenderer] Failed to render custom component at index ${index}:`, error);
@@ -1494,13 +1487,10 @@
1494
1487
  this._hasError = false;
1495
1488
  this._errorMessage = '';
1496
1489
  this._boundArrowClick = null;
1497
- console.log('[EnhancedSelect] Constructor called');
1498
1490
  this._shadow = this.attachShadow({ mode: 'open' });
1499
- console.log('[EnhancedSelect] Shadow root attached:', this._shadow);
1500
1491
  this._uniqueId = `enhanced-select-${Math.random().toString(36).substr(2, 9)}`;
1501
1492
  // Merge global config with component-level config
1502
1493
  this._config = selectConfig.getConfig();
1503
- console.log('[EnhancedSelect] Config loaded');
1504
1494
  // Initialize state
1505
1495
  this._state = {
1506
1496
  isOpen: false,
@@ -1520,41 +1510,26 @@
1520
1510
  lastNotifiedResultCount: 0,
1521
1511
  isExpanded: false,
1522
1512
  };
1523
- console.log('[EnhancedSelect] State initialized');
1524
1513
  // Create DOM structure
1525
1514
  this._container = this._createContainer();
1526
- console.log('[EnhancedSelect] Container created:', this._container);
1527
1515
  this._inputContainer = this._createInputContainer();
1528
- console.log('[EnhancedSelect] Input container created');
1529
1516
  this._input = this._createInput();
1530
- console.log('[EnhancedSelect] Input created:', this._input);
1531
1517
  this._arrowContainer = this._createArrowContainer();
1532
- console.log('[EnhancedSelect] Arrow container created');
1533
1518
  this._dropdown = this._createDropdown();
1534
- console.log('[EnhancedSelect] Dropdown created');
1535
1519
  this._optionsContainer = this._createOptionsContainer();
1536
- console.log('[EnhancedSelect] Options container created');
1537
1520
  this._liveRegion = this._createLiveRegion();
1538
- console.log('[EnhancedSelect] Live region created');
1539
1521
  // Initialize styles BEFORE assembling DOM (order matters in shadow DOM)
1540
1522
  this._initializeStyles();
1541
- console.log('[EnhancedSelect] Styles initialized');
1542
1523
  this._assembleDOM();
1543
- console.log('[EnhancedSelect] DOM assembled');
1544
1524
  this._attachEventListeners();
1545
- console.log('[EnhancedSelect] Event listeners attached');
1546
1525
  this._initializeObservers();
1547
- console.log('[EnhancedSelect] Observers initialized');
1548
- console.log('[EnhancedSelect] Constructor complete, shadow DOM children:', this._shadow.children.length);
1549
1526
  }
1550
1527
  connectedCallback() {
1551
- console.log('[EnhancedSelect] connectedCallback called');
1552
1528
  // WORKAROUND: Force display style on host element for Angular compatibility
1553
1529
  // Angular's rendering seems to not apply :host styles correctly in some cases
1554
1530
  // Must be done in connectedCallback when element is attached to DOM
1555
1531
  this.style.display = 'block';
1556
1532
  this.style.width = '100%';
1557
- console.log('[EnhancedSelect] Forced host display styles');
1558
1533
  // Load initial data if server-side is enabled
1559
1534
  if (this._config.serverSide.enabled && this._config.serverSide.initialSelectedValues) {
1560
1535
  this._loadInitialSelectedItems();
@@ -1563,7 +1538,6 @@
1563
1538
  if (this._config.callbacks.onOpen) {
1564
1539
  this._config.callbacks.onOpen();
1565
1540
  }
1566
- console.log('[EnhancedSelect] connectedCallback complete');
1567
1541
  }
1568
1542
  disconnectedCallback() {
1569
1543
  // Cleanup observers
@@ -1661,43 +1635,22 @@
1661
1635
  return container;
1662
1636
  }
1663
1637
  _assembleDOM() {
1664
- console.log('[EnhancedSelect] _assembleDOM: Starting DOM assembly');
1665
- console.log('[EnhancedSelect] _assembleDOM: Elements to assemble:', {
1666
- inputContainer: !!this._inputContainer,
1667
- input: !!this._input,
1668
- arrowContainer: !!this._arrowContainer,
1669
- container: !!this._container,
1670
- dropdown: !!this._dropdown,
1671
- optionsContainer: !!this._optionsContainer,
1672
- shadow: !!this._shadow,
1673
- liveRegion: !!this._liveRegion
1674
- });
1675
1638
  this._inputContainer.appendChild(this._input);
1676
- console.log('[EnhancedSelect] _assembleDOM: Appended input to inputContainer');
1677
1639
  if (this._arrowContainer) {
1678
1640
  this._inputContainer.appendChild(this._arrowContainer);
1679
- console.log('[EnhancedSelect] _assembleDOM: Appended arrowContainer to inputContainer');
1680
1641
  }
1681
1642
  this._container.appendChild(this._inputContainer);
1682
- console.log('[EnhancedSelect] _assembleDOM: Appended inputContainer to container');
1683
1643
  this._dropdown.appendChild(this._optionsContainer);
1684
- console.log('[EnhancedSelect] _assembleDOM: Appended optionsContainer to dropdown');
1685
1644
  this._container.appendChild(this._dropdown);
1686
- console.log('[EnhancedSelect] _assembleDOM: Appended dropdown to container');
1687
1645
  this._shadow.appendChild(this._container);
1688
- console.log('[EnhancedSelect] _assembleDOM: Appended container to shadow root');
1689
1646
  if (this._liveRegion) {
1690
1647
  this._shadow.appendChild(this._liveRegion);
1691
- console.log('[EnhancedSelect] _assembleDOM: Appended liveRegion to shadow root');
1692
1648
  }
1693
- console.log('[EnhancedSelect] _assembleDOM: Shadow root children count:', this._shadow.children.length);
1694
- console.log('[EnhancedSelect] _assembleDOM: Shadow root HTML length:', this._shadow.innerHTML.length);
1695
1649
  // Set ARIA relationships
1696
1650
  const listboxId = `${this._uniqueId}-listbox`;
1697
1651
  this._dropdown.id = listboxId;
1698
1652
  this._input.setAttribute('aria-controls', listboxId);
1699
1653
  this._input.setAttribute('aria-owns', listboxId);
1700
- console.log('[EnhancedSelect] _assembleDOM: Set ARIA relationships with listboxId:', listboxId);
1701
1654
  }
1702
1655
  _initializeStyles() {
1703
1656
  const style = document.createElement('style');
@@ -2027,8 +1980,6 @@
2027
1980
  min-height: 44px;
2028
1981
  }
2029
1982
  `;
2030
- console.log('[EnhancedSelect] _initializeStyles: Created style element, content length:', style.textContent?.length || 0);
2031
- console.log('[EnhancedSelect] _initializeStyles: Shadow root children BEFORE:', this._shadow.children.length);
2032
1983
  // Insert as first child to ensure styles are processed first
2033
1984
  if (this._shadow.firstChild) {
2034
1985
  this._shadow.insertBefore(style, this._shadow.firstChild);
@@ -2036,9 +1987,6 @@
2036
1987
  else {
2037
1988
  this._shadow.appendChild(style);
2038
1989
  }
2039
- console.log('[EnhancedSelect] _initializeStyles: Style inserted, shadow root children AFTER:', this._shadow.children.length);
2040
- console.log('[EnhancedSelect] _initializeStyles: Shadow root has style element:', !!this._shadow.querySelector('style'));
2041
- console.log('[EnhancedSelect] _initializeStyles: Style sheet rules:', style.sheet?.cssRules?.length || 'NOT PARSED');
2042
1990
  }
2043
1991
  _attachEventListeners() {
2044
1992
  // Arrow click handler
@@ -2645,27 +2593,21 @@
2645
2593
  * Set items to display in the select
2646
2594
  */
2647
2595
  setItems(items) {
2648
- console.log('[EnhancedSelect] setItems called with', items?.length || 0, 'items');
2649
- console.log('[EnhancedSelect] Items:', items);
2650
2596
  const previousLength = this._state.loadedItems.length;
2651
2597
  this._state.loadedItems = items;
2652
2598
  // If grouped items exist, flatten them to items
2653
2599
  if (this._state.groupedItems.length > 0) {
2654
2600
  this._state.loadedItems = this._state.groupedItems.flatMap(group => group.options);
2655
- console.log('[EnhancedSelect] Flattened grouped items to', this._state.loadedItems.length, 'items');
2656
2601
  }
2657
2602
  const newLength = this._state.loadedItems.length;
2658
- console.log('[EnhancedSelect] State.loadedItems updated:', previousLength, '→', newLength);
2659
2603
  // When infinite scroll is active (preserveScrollPosition = true),
2660
2604
  // we need to maintain scroll position during the update
2661
2605
  if (this._state.preserveScrollPosition && this._dropdown) {
2662
2606
  const targetScrollTop = this._state.lastScrollPosition;
2663
- console.log('[EnhancedSelect] Preserving scroll position:', targetScrollTop);
2664
2607
  // Only clear loading if we actually got more items
2665
2608
  if (newLength > previousLength) {
2666
2609
  this._state.isBusy = false;
2667
2610
  }
2668
- console.log('[EnhancedSelect] Calling _renderOptions (with scroll preservation)...');
2669
2611
  this._renderOptions();
2670
2612
  // Restore the exact scrollTop we had before loading
2671
2613
  // so the previously visible items stay in place and
@@ -2685,10 +2627,8 @@
2685
2627
  else {
2686
2628
  // Normal update - just render normally
2687
2629
  this._state.isBusy = false;
2688
- console.log('[EnhancedSelect] Calling _renderOptions (normal)...');
2689
2630
  this._renderOptions();
2690
2631
  }
2691
- console.log('[EnhancedSelect] setItems complete');
2692
2632
  }
2693
2633
  /**
2694
2634
  * Set grouped items
@@ -2852,21 +2792,11 @@
2852
2792
  * Render options based on current state
2853
2793
  */
2854
2794
  _renderOptions() {
2855
- console.log('[EnhancedSelect] _renderOptions called');
2856
- console.log('[EnhancedSelect] State:', {
2857
- loadedItems: this._state.loadedItems.length,
2858
- groupedItems: this._state.groupedItems.length,
2859
- isOpen: this._state.isOpen,
2860
- isSearching: this._state.isSearching,
2861
- searchQuery: this._state.searchQuery,
2862
- isBusy: this._state.isBusy
2863
- });
2864
2795
  // Cleanup observer
2865
2796
  if (this._loadMoreTrigger && this._intersectionObserver) {
2866
2797
  this._intersectionObserver.unobserve(this._loadMoreTrigger);
2867
2798
  }
2868
2799
  // Clear options container
2869
- console.log('[EnhancedSelect] Clearing options container, previous children:', this._optionsContainer.children.length);
2870
2800
  this._optionsContainer.innerHTML = '';
2871
2801
  // Ensure dropdown only contains options container (cleanup legacy direct children)
2872
2802
  // We need to preserve optionsContainer, so we can't just clear dropdown.innerHTML
@@ -2879,7 +2809,6 @@
2879
2809
  // Ensure dropdown is visible if we are rendering options
2880
2810
  if (this._state.isOpen && this._dropdown.style.display === 'none') {
2881
2811
  this._dropdown.style.display = 'block';
2882
- console.log('[EnhancedSelect] Dropdown display set to block');
2883
2812
  }
2884
2813
  // Show searching state (exclusive state)
2885
2814
  if (this._state.isSearching) {
@@ -2887,7 +2816,6 @@
2887
2816
  searching.className = 'searching-state';
2888
2817
  searching.textContent = 'Searching...';
2889
2818
  this._optionsContainer.appendChild(searching);
2890
- console.log('[EnhancedSelect] Added searching state');
2891
2819
  return;
2892
2820
  }
2893
2821
  const getValue = this._config.serverSide.getValueFromItem || ((item) => item?.value ?? item);
@@ -2896,7 +2824,6 @@
2896
2824
  const query = this._state.searchQuery.toLowerCase();
2897
2825
  // Handle Grouped Items Rendering (when no search query)
2898
2826
  if (this._state.groupedItems.length > 0 && !query) {
2899
- console.log('[EnhancedSelect] Rendering grouped items:', this._state.groupedItems.length, 'groups');
2900
2827
  this._state.groupedItems.forEach(group => {
2901
2828
  const header = document.createElement('div');
2902
2829
  header.className = 'group-header';
@@ -2926,7 +2853,6 @@
2926
2853
  }
2927
2854
  else {
2928
2855
  // Normal rendering (flat list or filtered)
2929
- console.log('[EnhancedSelect] Rendering flat list:', this._state.loadedItems.length, 'items');
2930
2856
  let hasRenderedItems = false;
2931
2857
  this._state.loadedItems.forEach((item, index) => {
2932
2858
  // Apply filter if query exists
@@ -2943,7 +2869,6 @@
2943
2869
  hasRenderedItems = true;
2944
2870
  this._renderSingleOption(item, index, getValue, getLabel);
2945
2871
  });
2946
- console.log('[EnhancedSelect] Rendered', hasRenderedItems ? 'items' : 'no items');
2947
2872
  if (!hasRenderedItems && !this._state.isBusy) {
2948
2873
  const empty = document.createElement('div');
2949
2874
  empty.className = 'empty-state';
@@ -2954,7 +2879,6 @@
2954
2879
  empty.textContent = 'No options available';
2955
2880
  }
2956
2881
  this._optionsContainer.appendChild(empty);
2957
- console.log('[EnhancedSelect] Added empty state');
2958
2882
  }
2959
2883
  }
2960
2884
  // Append Busy Indicator if busy
@@ -2972,13 +2896,11 @@
2972
2896
  busyBucket.appendChild(message);
2973
2897
  }
2974
2898
  this._optionsContainer.appendChild(busyBucket);
2975
- console.log('[EnhancedSelect] Added busy bucket');
2976
2899
  }
2977
2900
  // Append Load More Trigger (Button or Sentinel) if enabled and not busy
2978
2901
  else if ((this._config.loadMore.enabled || this._config.infiniteScroll.enabled) && this._state.loadedItems.length > 0) {
2979
2902
  this._addLoadMoreTrigger();
2980
2903
  }
2981
- console.log('[EnhancedSelect] _renderOptions complete, optionsContainer children:', this._optionsContainer.children.length);
2982
2904
  }
2983
2905
  _renderSingleOption(item, index, getValue, getLabel) {
2984
2906
  const option = document.createElement('div');
@@ -2986,7 +2908,6 @@
2986
2908
  option.id = `${this._uniqueId}-option-${index}`;
2987
2909
  const value = getValue(item);
2988
2910
  const label = getLabel(item);
2989
- console.log('[EnhancedSelect] Rendering option', index, ':', { value, label });
2990
2911
  option.textContent = label;
2991
2912
  option.dataset.value = String(value);
2992
2913
  option.dataset.index = String(index); // Also useful for debugging/selectors
@@ -3003,7 +2924,6 @@
3003
2924
  this._selectOption(index);
3004
2925
  });
3005
2926
  this._optionsContainer.appendChild(option);
3006
- console.log('[EnhancedSelect] Option', index, 'appended to optionsContainer');
3007
2927
  }
3008
2928
  _addLoadMoreTrigger() {
3009
2929
  const container = document.createElement('div');
@@ -3836,7 +3756,6 @@
3836
3756
  const start = performance.now();
3837
3757
  const result = await fn();
3838
3758
  const duration = performance.now() - start;
3839
- console.log(`[Perf] ${label}: ${duration.toFixed(2)}ms`);
3840
3759
  return { result, duration };
3841
3760
  }
3842
3761
  /**
@@ -3846,7 +3765,6 @@
3846
3765
  const start = performance.now();
3847
3766
  const result = fn();
3848
3767
  const duration = performance.now() - start;
3849
- console.log(`[Perf] ${label}: ${duration.toFixed(2)}ms`);
3850
3768
  return { result, duration };
3851
3769
  }
3852
3770