How to use the @appbaseio/reactivecore/lib/utils/helper.getClassName function in @appbaseio/reactivecore

return isFunction(renderError) ? renderError(error) : renderError;
		}

		if (this.state.options.length === 0) {
			return null;
		}

		let highestCount = 0;
		this.state.options.forEach((item) => {
			highestCount = item.doc_count > highestCount ? item.doc_count : highestCount;
		});

		return (
			
				{this.props.title && (
					<title>
						{this.props.title}
					</title>
				)}
				
					{this.state.options.map((item) =&gt; {
						// eslint-disable-next-line
						const size = (item.doc_count / highestCount) * (max - min) + min;

						return (
							<span> this.handleClick(item.key)}
								onKeyPress={e =&gt;
									handleA11yAction(e, () =&gt; this.handleClick(item.key))
								}
								style={{ fontSize: `${size}em` }}</span>

}

			return null;
		}

		if (this.props.selectAllLabel) {
			selectAll = [
				{
					key: this.props.selectAllLabel,
				},
			];
		}
		return (
			
				{this.props.title && (
					<title>
						{this.props.title}
					</title>
				)}
				 String(item.key).trim().length)
							.map(item =&gt; ({ ...item, key: String(item.key) })),
					]}
					onChange={this.handleChange}
					selectedItem={this.state.currentValue}
					placeholder={this.props.placeholder}
					searchPlaceholder={this.props.searchPlaceholder}
					labelField="key"

render() {
		const { selectAllLabel, showCount, renderItem } = this.props;
		const { options } = this.state;

		if (!this.hasCustomRenderer && options.length === 0) {
			return this.props.renderNoResults ? this.props.renderNoResults() : null;
		}

		const listItems = this.listItems;

		const isAllChecked = this.state.currentValue === selectAllLabel;
		return (
			
				{this.props.title && (
					<title>
						{this.props.title}
					</title>
				)}
				{this.renderSearch()}
				{this.hasCustomRenderer ? (
					this.getComponent()
				) : (
					<ul role="radiogroup" aria-label="{`${this.props.componentId}-items`}">
						{selectAllLabel &amp;&amp; (
							</ul>

renderSortOptions = () => (
		<select name="sort-options">
			{this.props.sortOptions.map((sort, index) =&gt; (
				<option value="{index}">
					{sort.label}
				</option>
			))}
		</select>
	);

start: this.props.onChange ? Number(this.props.value.start) : Number(this.state.start),
			end: this.props.onChange ? Number(this.props.value.end) : Number(this.state.end),
		};

		return (
			
				
				
					
						<input aria-label="{`${this.props.componentId}-start-input`}" step="{this.props.stepValue}" value="{value.start}" type="number" name="start">
						{!this.state.isStartValid &amp;&amp; (
							<content>Input range is invalid</content>
						)}

{this.state.currentValue && this.props.showClear && (
				
					{this.renderCancelIcon()}
				
			)}
			{this.props.showVoiceSearch && (
				
			)}
			
				{this.renderIcon()}
			
		
	);

render() {
		return (
			
				{this.props.title && (
					<title>
						{this.props.title}
					</title>
				)}
				
					<span>
						{this.props.data.label}
					</span>
					<div>
						</div>

/>
											
										))}
									
								) : (
									this.renderNoSuggestion(suggestionsList)
								)}
							
						)}
						{...this.props.downShiftProps}
					/>
				) : (
					<div>
						<input value="{this.state.currentValue" placeholder="{this.props.placeholder}" aria-label="{this.props.componentId}">
						{this.renderIcons()}
					</div>

render() {
		const { selectAllLabel, showCount, renderItem } = this.props;
		const { options } = this.state;

		if (!this.hasCustomRenderer && options.length === 0) {
			return this.props.renderNoResults ? this.props.renderNoResults() : null;
		}

		const listItems = this.listItems;

		const isAllChecked = selectAllLabel ? !!this.state.currentValue[selectAllLabel] : false;

		return (
			
				{this.props.title && (
					<title>
						{this.props.title}
					</title>
				)}
				{this.renderSearch()}
				{this.hasCustomRenderer ? (
					this.getComponent()
				) : (
					<ul aria-label="{`${this.props.componentId}-items`}" role="listbox">
						{selectAllLabel ? (
							</ul>

}

		if (!this.hasCustomRenderer && this.state.options.length === 0) {
			if (this.props.renderNoResults && !this.props.isLoading) {
				return this.props.renderNoResults();
			}

			return null;
		}

		const isAllChecked = this.state.currentValue === selectAllLabel;

		return (
			
				{this.props.title && (
					<title>
						{this.props.title}
					</title>
				)}
				{this.renderSearch()}
				{this.hasCustomRenderer ? (
					this.getComponent()
				) : (
					<ul aria-label="{`${this.props.componentId}-items`}" role="radiogroup">
						{selectAllLabel ? (
							</ul>