import { html } from 'lit';
import type NileElement from '../internal/nile-element';

/**
 * Helper class to manage virtual scroll functionality for nile-select component
 */
export class VirtualScrollHelper {
  private component: NileElement;

  constructor(component: NileElement) {
    this.component = component;
  }

  renderVirtualizedContent(): any {
    const component = this.component as any;

    return html`
      <div class="virtual-select">
        <nile-virtual-select
          .name=${component.name}
          .value=${component.value}
          .autoResize=${component.autoResize}
          .placeholder=${component.placeholder}
          .size=${component.size}
          .searchEnabled=${component.searchEnabled}
          .internalSearchPlaceHolder=${component.internalSearchPlaceHolder}
          .disableLocalSearch=${component.disableLocalSearch}
          .optionsLoading=${component.optionsLoading}
          .multiple=${component.multiple}
          .helpText=${component.helpText}
          .errorMessage=${component.errorMessage}
          .warning=${component.warning}
          .enableVisibilityEffect=${component.enableVisibilityEffect}
          .error=${component.error}
          .success=${component.success}
          .disabled=${component.disabled}
          .clearable=${component.clearable}
          .hoist=${component.hoist}
          .filled=${component.filled}
          .pill=${component.pill}
          .label=${component.label}
          .placement=${component.placement}
          .form=${component.form}
          .required=${component.required}
          .showNoResults=${component.showNoResults}
          .noResultsMessage=${component.noResultsMessage}
          .renderItemConfig=${component.renderItemConfig}
          .blockValueChange=${component.blockValueChange}
          .noWidthSync=${component.noWidthSync}
          .maxOptionsVisible=${component.maxOptionsVisible}
          .enableTabClose=${component.enableTabClose}
          .data=${component.data}
          .open=${component.open}
          .loading=${component.loading}
          .portal=${component.portal}
          .descriptionSearchEnabled=${component.descriptionSearchEnabled}
          .allowHtmlLabel=${component.allowHtmlLabel}
          .enableDescription=${component.enableDescription}
          exportparts="
            select-options,
            select-no-results,
            virtualized,
            form-control,
            form-control-label,
            form-control-input,
            combobox,
            prefix,
            display-input,
            tags,
            tag,
            clear-button,
            suffix,
            expand-icon,
            listbox,
            search,
            loader,
            footer,
            tag__content 
          "
        >
          <slot name="prefix" slot="prefix"></slot>
        </nile-virtual-select>
      </div>
    `;
  }
}
