saurabh-table-dnd-edit 1.1.0

package/lib/components/Select/Select.js

@@ -0,0 +1,257 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, useState } from 'react';
+import './Select.scss';
+import Icon from '../Icon';
+import Typography from '../Typography';
+import classNames from 'classnames';
+import { createPortal } from 'react-dom';
+import Dropdown from './components/Dropdown';
+import { getValue } from '../../utils/getSelectOptionValue/getSelectOptionValue';
+import usePortalPosition from '../../hooks/usePortalPosition';
+import Tooltip from '../Tooltip';
+import { checkEmpty } from '../../utils/checkEmpty/checkEmpty';
+import { truncateText } from '../../utils/truncateText/truncateText';
+const Select = ({ label = 'Default Label', showLabel = true, optionsList = [], selectedOption = { label: '', value: '' }, onChange = () => { }, errorMsg = '', className = '', optionZIndex = 1500, disabled = false, showBorder = true, required = true, optionsRequired = true, selectedOptionColor = 'var(--ff-select-text-color)', labelAccessor = '', valueAccessor = '', height = 32, width = '100%', onBlur = () => { }, disableInput = false, showIcon = false, placeHolder = '', showToolTip = false, onCancelModal = () => { }, onSaveModal = () => { }, modalJSXProps = _jsx(_Fragment, {}), recurrence = false, showArrowIcon = true, showClearIcon = false, handelClear = () => { }, showOptions = { open: false, toggle: false }, tooltip = false, background = '', borderRadius = '0px', noResultsMessage, dropDownRef, dropDownHeight = 160, onSearchText, isCustomButtonDisabled = false, hasInnerClearIcon = false, }) => {
+    const selectWidth = typeof width === 'number' ? `${width}px` : width;
+    const memoizedOptionsList = useMemo(() => optionsList, [optionsList]);
+    const [showDropdownOptions, setShowDropdownOptions] = useState(false);
+    const [customRecurrence, setCustomRecurrence] = useState(false);
+    const [searchedOption, setSearchedOption] = useState({
+        searchedText: '',
+        searchedIcon: '',
+        searchedIconColor: '',
+    });
+    const { searchedText, searchedIcon, searchedIconColor } = searchedOption;
+    const [selectOptionList, setSelectOptionList] = useState([]);
+    const [dropdownPosition, setDropdownPosition] = useState({
+        positionX: 0,
+        positionY: 0,
+        width: 0,
+        fromBottom: 0,
+    });
+    const DropdownRef = useRef(null);
+    const selectWrapperRef = useRef(null);
+    const inputRef = useRef(null);
+    const selectArrowRef = useRef(null);
+    const calculatePosition = usePortalPosition(inputRef, showDropdownOptions);
+    const handleIconClick = () => {
+        if (disabled)
+            return;
+        setShowDropdownOptions(!showDropdownOptions);
+        setSearchedOption({
+            ...searchedOption,
+            searchedText: getValue(selectedOption, valueAccessor) || '',
+        });
+        setSelectOptionList(optionsList);
+        if (!showDropdownOptions && inputRef.current) {
+            inputRef.current.focus();
+        }
+    };
+    const handleChange = (event) => {
+        if (disabled)
+            return;
+        const { value } = event.target;
+        onSearchText?.(value);
+        const filteredOptions = optionsList.filter((option) => {
+            const valueData = getValue(option, valueAccessor);
+            return typeof valueData === 'string'
+                ? valueData.toLowerCase().includes(value.toLowerCase().trim())
+                : valueData === Number(value);
+        });
+        setSelectOptionList(filteredOptions);
+        setSearchedOption({
+            ...searchedOption,
+            searchedText: value,
+        });
+    };
+    const onSelectUpdatePosition = () => {
+        if (!showDropdownOptions || !DropdownRef?.current || disabled)
+            return;
+        setDropdownPosition(calculatePosition(inputRef));
+    };
+    const onSelectToggleScroll = (isEnabled) => {
+        const scrollWidth = window.innerWidth - document.documentElement.clientWidth;
+        if (isEnabled) {
+            document.body.style.paddingRight = '';
+            document.body.style.overflow = '';
+        }
+        else {
+            document.body.style.paddingRight = `${scrollWidth}px`;
+            document.body.style.overflow = 'hidden';
+        }
+    };
+    const handleFocus = () => {
+        if (disabled)
+            return;
+        setShowDropdownOptions(true);
+    };
+    useEffect(() => {
+        if (showOptions.open) {
+            setShowDropdownOptions(true);
+        }
+    }, [showOptions.toggle]);
+    const onSelectBlur = () => {
+        setShowDropdownOptions(false);
+        setDropdownPosition({
+            positionX: 0,
+            positionY: 0,
+            fromBottom: 0,
+            width: 0,
+        });
+        setSelectOptionList(optionsList);
+        if (inputRef?.current === document.activeElement) {
+            inputRef?.current?.blur();
+            setSearchedOption({
+                searchedText: getValue(selectedOption, valueAccessor) || '',
+                searchedIcon: selectedOption.iconName || '',
+                searchedIconColor: selectedOption.iconColor,
+            });
+            setCustomRecurrence(false);
+            onBlur();
+        }
+    };
+    const onSelectOptionSelector = (option) => {
+        if (disabled)
+            return;
+        const isCustomRecurrence = option?.recurrence || false;
+        setCustomRecurrence(isCustomRecurrence);
+        setSearchedOption({
+            searchedText: getValue(selectedOption, valueAccessor),
+            searchedIcon: selectedOption.iconName,
+            searchedIconColor: selectedOption.iconColor,
+        });
+        if (onChange) {
+            onChange(option);
+        }
+        if (!isCustomRecurrence) {
+            onSelectBlur();
+        }
+    };
+    const handleResizeOrScroll = () => onSelectUpdatePosition();
+    const getScrollParent = (element) => {
+        const scrollableParents = [];
+        if (!element)
+            return scrollableParents;
+        let parent = element.parentElement;
+        while (parent) {
+            const tagName = parent.tagName.toLowerCase();
+            // Skip tbody and similar non-scrollable semantic containers
+            if (tagName === 'tbody') {
+                parent = parent.parentElement;
+                continue;
+            }
+            const style = window.getComputedStyle(parent);
+            const overflowY = style.overflowY;
+            const overflowX = style.overflowX;
+            const isScrollable = (overflowY === 'auto' ||
+                overflowY === 'scroll' ||
+                overflowX === 'auto' ||
+                overflowX === 'scroll') &&
+                (parent.scrollHeight > parent.clientHeight ||
+                    parent.scrollWidth > parent.clientWidth);
+            if (isScrollable) {
+                scrollableParents.push(parent);
+            }
+            parent = parent.parentElement;
+        }
+        // as fallback also include window scroll (document.body)
+        return scrollableParents.length ? scrollableParents : [document.body];
+    };
+    useEffect(() => {
+        if (!showDropdownOptions || disabled)
+            return;
+        if (optionsRequired) {
+            onSelectToggleScroll(false);
+        }
+        onSelectUpdatePosition();
+        const scrollableParents = getScrollParent(inputRef.current);
+        window.addEventListener('resize', handleResizeOrScroll);
+        scrollableParents.forEach((parent) => {
+            parent.addEventListener('scroll', onSelectBlur);
+        });
+        return () => {
+            onSelectToggleScroll(true);
+            window.removeEventListener('resize', handleResizeOrScroll);
+            scrollableParents.forEach((parent) => {
+                parent.removeEventListener('scroll', onSelectBlur);
+            });
+        };
+    }, [showDropdownOptions]);
+    useEffect(() => {
+        setSearchedOption({
+            searchedText: getValue(selectedOption, valueAccessor),
+            searchedIcon: selectedOption.iconName,
+            searchedIconColor: selectedOption.iconColor,
+        });
+    }, [
+        selectedOption?.label,
+        selectedOption?.value,
+        selectedOption?.iconName,
+        getValue(selectedOption, valueAccessor),
+    ]);
+    useEffect(() => {
+        setSelectOptionList(memoizedOptionsList);
+    }, [memoizedOptionsList]);
+    if (showLabel) {
+        placeHolder = '';
+    }
+    const [isTruncated, setIsTruncated] = useState(false);
+    const [displaySearchedText, setDisplaySearchedText] = useState('');
+    useEffect(() => {
+        const updateTruncation = () => {
+            const input = inputRef.current;
+            if (!input)
+                return;
+            // derive properties from input
+            const styles = window.getComputedStyle(input);
+            const paddingLeft = parseFloat(styles.paddingLeft || '0');
+            const paddingRight = parseFloat(styles.paddingRight || '0');
+            const availableWidth = input.clientWidth - paddingLeft - paddingRight;
+            const fontSize = parseFloat(styles.fontSize || '12');
+            const fontFamily = styles.fontFamily;
+            const letterSpacing = parseFloat(styles.letterSpacing || '0') || 0;
+            const truncated = truncateText(searchedText, availableWidth, 'pixel', fontSize, fontFamily, letterSpacing);
+            setDisplaySearchedText(truncated);
+            setIsTruncated(truncated !== searchedText); // if different → truncated → show tooltip
+        };
+        updateTruncation();
+        window.addEventListener('resize', updateTruncation);
+        return () => {
+            window.removeEventListener('resize', updateTruncation);
+        };
+    }, [searchedText, width]);
+    const inputElement = (_jsxs(_Fragment, { children: [_jsx("input", { type: "text", ref: inputRef, id: "select-input-element", className: classNames('ff-select-inputField', {
+                    'ff-select-inputField__disabled': disabled,
+                    'ff-select-inputField__readonly': disableInput,
+                    'ff-select-inputField__icon': showIcon && !checkEmpty(searchedIcon),
+                    'ff-select-inputField__hasicon': hasInnerClearIcon,
+                }), onFocus: handleFocus, value: displaySearchedText, autoCorrect: "off", autoComplete: "off", spellCheck: "false", style: {
+                    zIndex: optionZIndex,
+                    color: selectedOptionColor,
+                }, disabled: disabled, onChange: handleChange, readOnly: disableInput, placeholder: placeHolder }), hasInnerClearIcon && (_jsx("span", { className: "ff-select-clear-icon", children: _jsx(Tooltip, { title: "Clear", children: _jsx(Icon, { name: "close", height: 16, width: 16, onClick: handelClear, hoverEffect: true, cursorType: "pointer" }) }) }))] }));
+    return (_jsxs("div", { className: `ff-select-wrapper ${className} ${showClearIcon ? 'show-clear-icon' : ''}`, ref: selectWrapperRef, style: {
+            height: `${height}px`,
+            width: `${selectWidth}`,
+            background: `${background}`,
+            borderRadius: `${borderRadius}`,
+        }, children: [_jsxs("div", { className: classNames('ff-select', {
+                    'ff-select__focus': showDropdownOptions,
+                    'ff-select__disabled': disabled,
+                    'ff-select__error': !!errorMsg,
+                    'ff-select__error__focused': !!errorMsg && showDropdownOptions,
+                    'ff-select__no_border': !showBorder,
+                }), children: [showIcon && !checkEmpty(searchedIcon) && (_jsx(Tooltip, { placement: "bottom", title: searchedText, children: _jsx(Icon, { name: searchedIcon, color: searchedIconColor, className: "ff-select-input-icon" }) })), tooltip && isTruncated ? (_jsx(Tooltip, { title: searchedText, style: { width: '100%' }, children: inputElement })) : (inputElement), optionsRequired && (_jsx("div", { ref: selectArrowRef, className: classNames('ff-select-arrows-wrapper', {
+                            'ff-select-arrows-wrapper__disabled': disabled,
+                        }), onClick: handleIconClick, children: showArrowIcon && (_jsx(Icon, { name: "arrow_down", className: "ff-select-arrows", height: 8, width: 12, color: 'var(--brand-color)', "z-index": 9999 })) })), showLabel && (_jsx(Typography, { as: "span", className: classNames('ff-select-labels', {
+                            'ff-select-labels__icon': showIcon && !checkEmpty(searchedIcon),
+                            'ff-select-labels__active': searchedText,
+                        }), fontSize: searchedText || showDropdownOptions ? 10 : 12, lineHeight: searchedText || showDropdownOptions ? '12px' : '16px', required: required, style: {
+                            maxWidth: `calc(${selectWidth} - ${hasInnerClearIcon ? '56px' : '40px'})`,
+                        }, children: label }))] }), errorMsg && (_jsx(Typography, { as: "div", lineHeight: "15px", fontSize: 10, color: "var(--error_light)", className: "ff-select-error-msg", children: errorMsg })), optionsRequired && (_jsx("div", { ref: DropdownRef, children: showDropdownOptions &&
+                    createPortal(_jsx(Dropdown, { options: selectOptionList, dropdownPosition: dropdownPosition, labelAccessor: labelAccessor, optionZIndex: optionZIndex, inputRef: inputRef, selectArrowRef: selectArrowRef, onSelectBlur: onSelectBlur, onSelectOptionSelector: onSelectOptionSelector, heightFromTop: height, selectedOption: searchedText, showIcon: showIcon, showToolTip: showToolTip, customReccurenece: customRecurrence, onSaveModal: onSaveModal, onCancelModal: () => {
+                            onCancelModal();
+                            setCustomRecurrence(false);
+                        }, modalJSXProps: modalJSXProps, recurrence: recurrence, valueAccessor: valueAccessor, showArrowIcon: showArrowIcon, showClearIcon: showClearIcon, hasInnerClearIcon: hasInnerClearIcon, noResultsMessage: noResultsMessage, ref: dropDownRef, searchedIcon: searchedIcon, dropDownHeight: dropDownHeight, isCustomButtonDisabled: isCustomButtonDisabled }), document.body) })), showClearIcon && (_jsx(Tooltip, { title: "Cancel", style: { zIndex: 99999 }, children: _jsx(Icon, { name: "close", height: 16, width: 16, onClick: handelClear, hoverEffect: true }) }))] }));
+};
+export default Select;
+//# sourceMappingURL=Select.js.map

package/lib/components/Select/Select.js.map

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

package/lib/components/Select/components/Dropdown.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { DropdownProps } from './types';
+import './Dropdown.scss';
+declare const Dropdown: React.ForwardRefExoticComponent<DropdownProps & React.RefAttributes<HTMLDivElement>>;
+export default Dropdown;

package/lib/components/Select/components/Dropdown.js

@@ -0,0 +1,141 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useContext, useRef, forwardRef, useMemo } from 'react';
+import { dropdownDefaultCSSData } from './types';
+import './Dropdown.scss';
+import { checkEmpty } from '../../../utils/checkEmpty/checkEmpty';
+import Typography from '../../Typography';
+import { ThemeContext } from '../../ThemeProvider/ThemeProvider';
+import classNames from 'classnames';
+import { getLabel, getValue, } from '../../../utils/getSelectOptionValue/getSelectOptionValue';
+import useClickOutside from '../../../hooks/useClickOutside';
+import Icon from '../../Icon';
+import Button from '../../Button';
+import { useMergeRefs } from '../../../hooks/useMergeRefs';
+import TruncatedTooltip from '../../TruncatedTooltip';
+import { FixedSizeList } from 'react-window';
+const Dropdown = forwardRef(({ options = [], optionZIndex = 10000000, dropdownPosition, labelAccessor, onSelectOptionSelector, onSelectBlur, inputRef, selectArrowRef, heightFromTop, selectedOption, valueAccessor, showIcon = false, customReccurenece = true, onCancelModal = () => { }, onSaveModal = () => { }, recurrence = false, modalJSXProps = _jsx(_Fragment, {}), showArrowIcon = true, noResultsMessage, searchedIcon = '', dropDownHeight = 160, isCustomButtonDisabled = false, }, ref) => {
+    const themeContext = useContext(ThemeContext);
+    const currentTheme = themeContext?.currentTheme;
+    const { optionHeight, dropDownWrapperPadding } = dropdownDefaultCSSData;
+    const customRecurrenceOnBlur = customReccurenece ? () => { } : onSelectBlur;
+    const optionsWrapperRef = useRef(null);
+    const mergedRef = useMergeRefs(optionsWrapperRef, ref);
+    useClickOutside(optionsWrapperRef, customRecurrenceOnBlur, [
+        inputRef,
+        selectArrowRef,
+    ]);
+    const { positionX, positionY, fromBottom, width } = dropdownPosition;
+    const { margin, selectInputHeight } = dropdownDefaultCSSData;
+    const updateDropdownPosition = () => {
+        let dropdownContainerHeight;
+        if (checkEmpty(options)) {
+            dropdownContainerHeight = 32 + 2 * dropDownWrapperPadding;
+        }
+        else if (options?.length > 5) {
+            dropdownContainerHeight = 160;
+        }
+        else {
+            dropdownContainerHeight =
+                options.length * optionHeight + 2 * dropDownWrapperPadding;
+        }
+        if (fromBottom > dropdownContainerHeight + margin) {
+            const dynamicHeightFromTop = heightFromTop <= 25
+                ? heightFromTop + 7
+                : heightFromTop <= 32
+                    ? heightFromTop
+                    : heightFromTop <= 40
+                        ? heightFromTop - 4
+                        : heightFromTop <= 50
+                            ? heightFromTop - 9
+                            : heightFromTop - 15;
+            return {
+                left: positionX,
+                top: positionY + dynamicHeightFromTop - 10,
+                width: showIcon && !checkEmpty(searchedIcon)
+                    ? width + 70
+                    : showArrowIcon
+                        ? width + 32
+                        : width + 10,
+                zIndex: optionZIndex,
+                marginLeft: showIcon && !checkEmpty(searchedIcon) ? '-31px' : '-2px',
+            };
+        }
+        return {
+            zIndex: optionZIndex,
+            left: positionX,
+            width: showIcon ? width + 70 : showArrowIcon ? width + 32 : width + 10,
+            top: positionY - selectInputHeight - dropdownContainerHeight + 4 * margin,
+            marginLeft: showIcon ? '-29px' : '-2px',
+        };
+    };
+    const positionStyle = updateDropdownPosition();
+    const dropdownWidth = positionStyle.width;
+    const basePadding = 16;
+    const iconPadding = showIcon ? 32 : 0;
+    const effectiveContentWidth = customReccurenece
+        ? (typeof dropdownWidth === 'number' ? dropdownWidth / 2 : 0) -
+            basePadding -
+            iconPadding
+        : dropdownWidth - basePadding - iconPadding;
+    const sortedOptions = useMemo(() => {
+        if (checkEmpty(options))
+            return [];
+        return [
+            ...options.filter((option) => getValue(option, valueAccessor) === selectedOption),
+            ...options.filter((option) => getValue(option, valueAccessor) !== selectedOption),
+        ];
+    }, [options, selectedOption, valueAccessor]);
+    const getOptionLabel = (label, icon, tooltipWidth, iconColor) => {
+        if (React.isValidElement(label)) {
+            return label;
+        }
+        return (_jsxs("div", { className: "ff-select-dropdown-option-wrapper", children: [showIcon && icon && (_jsx(Icon, { name: icon, className: "ff-select-dropdown__icon", ...(iconColor && { color: iconColor }) })), _jsx(Typography, { as: "div", lineHeight: "25px", color: "var(--ff-select-text-color)", className: classNames('ff-select-dropdown-text', {
+                        'ff-select-dropdown-icon-container': showIcon,
+                    }), children: _jsx(TruncatedTooltip, { title: label, width: tooltipWidth }) })] }));
+    };
+    const onHandleCancelModal = () => {
+        onCancelModal();
+    };
+    const onHandleSaveModal = () => {
+        onSelectBlur();
+        onSaveModal();
+    };
+    // Calculate height for virtualization
+    const listHeight = useMemo(() => {
+        if (checkEmpty(options))
+            return 32;
+        if (options.length > 5)
+            return dropDownHeight;
+        return options.length * optionHeight;
+    }, [options]);
+    const renderOptionRow = ({ index, style }) => {
+        const option = sortedOptions[index];
+        if (!option)
+            return null;
+        const optionValue = getValue(option, valueAccessor);
+        const optionLabel = getLabel(option, labelAccessor);
+        const iconName = 'iconName' in option ? option.iconName : undefined;
+        const iconColor = 'iconColor' in option ? option.iconColor : undefined;
+        const isDisabled = 'disable' in option && option.disable;
+        return (_jsx("div", { className: classNames('ff-select-dropdown-option', {
+                'ff-select-dropdown-option__selected': optionValue === selectedOption,
+            }, {
+                'ff-select-dropdown-option__disabled': isDisabled,
+            }, currentTheme), style: style, onClick: () => {
+                if (isDisabled)
+                    return;
+                onSelectOptionSelector(option);
+            }, children: getOptionLabel(optionLabel, iconName, effectiveContentWidth, iconColor) }, index));
+    };
+    return (_jsxs("div", { className: classNames('ff-select-dropdown-wrapper', currentTheme, {
+            'ff-select-dropdown-modal-wrapper': recurrence,
+            'ff-select-dropdown-mini-modal-wrapper': customReccurenece,
+        }), ref: mergedRef, style: positionStyle, children: [_jsx("div", { className: classNames({
+                    'ff-select-label-minimodal-wrapper': customReccurenece,
+                }), children: !checkEmpty(options) ? (_jsx("div", { style: {
+                        padding: `${dropDownWrapperPadding}px 0`,
+                        fontSize: '12px',
+                    }, children: _jsx(FixedSizeList, { height: listHeight, width: "100%", itemCount: sortedOptions.length, itemSize: optionHeight, children: renderOptionRow }) })) : (_jsx(Typography, { textAlign: "center", as: "div", lineHeight: "32px", color: "var(--ff-select-text-color)", className: classNames('ff-select-no-option', currentTheme), children: noResultsMessage || 'No Result Found' })) }), customReccurenece && (_jsx("div", { className: "ff-select-mini-modal-wrapper", id: "ff-select-mini-id", children: _jsxs("div", { className: "ff-select-modal-wrapper", children: [_jsx(_Fragment, { children: modalJSXProps }), _jsxs("div", { className: "ff-select-mini-modal-footer", children: [_jsx(Button, { label: "Cancel", variant: "tertiary", onClick: onHandleCancelModal }), _jsx(Button, { label: "Save", variant: "primary", onClick: onHandleSaveModal, disabled: isCustomButtonDisabled })] })] }) }))] }));
+});
+export default Dropdown;
+//# sourceMappingURL=Dropdown.js.map

package/lib/components/Select/components/Dropdown.js.map

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

package/lib/components/Select/components/types.d.ts

@@ -0,0 +1,35 @@
+import { DropdownPosition, Option } from '../types';
+import { ReactNode, RefObject } from 'react';
+export interface DropdownProps {
+    options: Option[];
+    dropdownPosition: DropdownPosition;
+    dropDownHeight: number;
+    optionZIndex: number;
+    labelAccessor?: string;
+    valueAccessor?: string;
+    onSelectBlur: () => void;
+    onSelectOptionSelector: (option: Option) => void;
+    inputRef?: RefObject<HTMLInputElement>;
+    selectArrowRef?: RefObject<HTMLDivElement>;
+    heightFromTop: number;
+    selectedOption?: Option;
+    showIcon?: boolean;
+    showToolTip?: boolean;
+    customReccurenece?: boolean;
+    onCancelModal?: () => void;
+    onSaveModal?: () => void;
+    modalJSXProps?: ReactNode;
+    recurrence?: boolean;
+    showArrowIcon?: boolean;
+    showClearIcon?: boolean;
+    noResultsMessage?: string;
+    searchedIcon?: string;
+    isCustomButtonDisabled?: boolean;
+    hasInnerClearIcon?: boolean;
+}
+export declare const dropdownDefaultCSSData: {
+    margin: number;
+    optionHeight: number;
+    selectInputHeight: number;
+    dropDownWrapperPadding: number;
+};

package/lib/components/Select/components/types.js

@@ -0,0 +1,7 @@
+export const dropdownDefaultCSSData = {
+    margin: 6,
+    optionHeight: 32,
+    selectInputHeight: 38,
+    dropDownWrapperPadding: 0,
+};
+//# sourceMappingURL=types.js.map

package/lib/components/Select/components/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/Select/components/types.ts"],"names":[],"mappings":"AA+BA,MAAM,CAAC,MAAM,sBAAsB,GAAG;IACpC,MAAM,EAAE,CAAC;IACT,YAAY,EAAE,EAAE;IAChB,iBAAiB,EAAE,EAAE;IACrB,sBAAsB,EAAE,CAAC;CAC1B,CAAC"}

package/lib/components/Select/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Select';

package/lib/components/Select/index.js

@@ -0,0 +1,2 @@
+export { default } from './Select';
+//# sourceMappingURL=index.js.map

package/lib/components/Select/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Select/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC"}

package/lib/components/Select/types.d.ts

@@ -0,0 +1,118 @@
+import { ReactNode, RefObject } from 'react';
+export interface SelectProps {
+    label?: string;
+    showLabel?: boolean;
+    /**
+     * Provide the boolean value if arrow icon is reuired or not
+     */
+    showArrowIcon?: boolean;
+    optionsList: Option[];
+    selectedOption: Option;
+    onChange: (option: Option) => void;
+    errorMsg?: string;
+    className?: string;
+    optionZIndex?: number;
+    disabled?: boolean;
+    borderRadius?: string;
+    showBorder?: boolean;
+    required?: boolean;
+    /**
+     * optionsRequired:false prop removes options from dropdown & shows static label only
+     */
+    optionsRequired?: boolean;
+    selectedOptionColor?: string;
+    labelAccessor?: string;
+    valueAccessor?: string;
+    height?: number;
+    width?: number | string;
+    onBlur?: () => void;
+    disableInput?: boolean;
+    showIcon?: boolean;
+    iconName?: string;
+    /**
+     * Provide the placehoder for the select
+     */
+    placeHolder?: string;
+    /**
+     * Provide the boolean value if tooltip is reuired or not
+     */
+    showToolTip?: boolean;
+    /**
+     * Provide the background color for the select label on the hover state
+     */
+    labelBackgroundColor?: string;
+    /**
+     * To close the modal in the select dropdown
+     */
+    onCancelModal?: () => void;
+    /**
+     * To close the modal in the select dropdown
+     */
+    onSaveModal?: () => void;
+    /**
+     * Pass the custom Jsx for the Modal
+     */
+    modalJSXProps?: ReactNode;
+    /**
+     * Pass the recurrence boolean for the exeception cases
+     */
+    recurrence?: boolean;
+    /**
+     * Toggles the visibility of dropdown options, when called, toggles the dropdown visibility
+     */
+    showOptions?: {
+        open: boolean;
+        toggle: boolean;
+    };
+    /**
+     * Tooltip for input data
+     */
+    tooltip?: boolean;
+    /**
+     * Provide the boolean value if close icon is reuired or not
+     */
+    showClearIcon?: boolean;
+    /**
+     * Handel function for clearing the selected data
+     */
+    handelClear?: () => void;
+    /**
+     * Handle background color
+     */
+    background?: string;
+    /**
+     * No Result message
+     */
+    noResultsMessage?: string;
+    /**
+     * Ref for select option dropdown
+     */
+    dropDownRef?: RefObject<HTMLDivElement>;
+    /**
+     * handling dropdownDown height
+     */
+    dropDownHeight?: number;
+    onSearchText?: (text: string) => void;
+    isCustomButtonDisabled?: boolean;
+    hasInnerClearIcon?: boolean;
+}
+export interface DropdownPosition {
+    positionX: number;
+    positionY: number;
+    width: number;
+    fromBottom: number;
+}
+export interface SelectState {
+    isInputFocused: boolean;
+    iconColor: string;
+    isIconClick: boolean;
+    showOptions: boolean;
+    options: Option[];
+    option: string;
+    dropdownPosition: DropdownPosition;
+}
+type OptionValue = any;
+export interface Option {
+    [key: string]: OptionValue;
+}
+export {};

package/lib/components/Select/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/lib/components/Select/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/Select/types.ts"],"names":[],"mappings":""}

package/lib/components/SequentialConnectingBranch/SequentialConnectingBranch.d.ts

@@ -0,0 +1,5 @@
+import './SequentialConnectingBranch.scss';
+import { FC } from 'react';
+import { SequentialConnectingBranchProps } from './types';
+declare const SequentialConnectingBranch: FC<SequentialConnectingBranchProps>;
+export default SequentialConnectingBranch;