@kubit-ui-web/react-components
Version:
Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience
54 lines • 1.78 kB
JavaScript
import { OptionStateType } from '../types/state';
const getState = (disabled, focused, selected, multiSelected, hover, filling) => {
if (disabled) {
return OptionStateType.DISABLED;
}
if (focused) {
return OptionStateType.FOCUS;
}
if (selected) {
if (multiSelected) {
return hover ? OptionStateType.MULTIPLE_SELECTED_HOVER : OptionStateType.MULTIPLE_SELECTED;
}
return hover ? OptionStateType.SELECTED_HOVER : OptionStateType.SELECTED;
}
if (hover) {
return OptionStateType.HOVER;
}
if (filling) {
return OptionStateType.FILLING;
}
return OptionStateType.DEFAULT;
};
/**
* @description
* function to get the indexes of the highlighted chars
*/
export const getHighlightedIndexes = (label, labelCharsHighlighted) => {
let firstHighlightedIndex = 0;
let lastHighlightedIndex = 0;
if (labelCharsHighlighted) {
const labelLowerCase = label.toLocaleLowerCase();
const charsHightlightedLowerCase = labelCharsHighlighted.toLocaleLowerCase();
if (labelLowerCase.includes(charsHightlightedLowerCase)) {
firstHighlightedIndex = labelLowerCase.indexOf(charsHightlightedLowerCase);
lastHighlightedIndex = firstHighlightedIndex + labelCharsHighlighted.length;
}
}
return { firstHighlightedIndex, lastHighlightedIndex };
};
/**
* @description
* function to get the state of the option
* @param {boolean | undefined} disabled
* @param {boolean | undefined} selected
* @param {boolean | undefined} multiSelected
* @param {boolean} hover
* @param {boolean} filling
* @returns {OptionStateType}
* @export
* @function
* @name getState
*/
export { getState };
//# sourceMappingURL=option.utils.js.map