@devtron-labs/devtron-fe-common-lib 0.0.58-beta-22 → 0.0.58-beta-24

package/src/Shared/Components/ReactSelect/utils.tsx

@@ -1,97 +0,0 @@
-import Tippy from '@tippyjs/react'
-import { components } from 'react-select'
-import { stopPropagation } from '../../../Common'
-
-export const getCommonSelectStyle = (styleOverrides = {}) => ({
-    menuList: (base) => ({
-        ...base,
-        paddingTop: 0,
-        paddingBottom: 0,
-    }),
-    control: (base, state) => ({
-        ...base,
-        minHeight: '32px',
-        boxShadow: 'none',
-        backgroundColor: 'var(--N50)',
-        border: state.isFocused ? '1px solid var(--B500)' : '1px solid var(--N200)',
-        cursor: 'pointer',
-    }),
-    option: (base, state) => ({
-        ...base,
-        color: 'var(--N900)',
-        backgroundColor: state.isFocused ? 'var(--N100)' : 'white',
-        padding: '10px 12px',
-    }),
-    dropdownIndicator: (base, state) => ({
-        ...base,
-        color: 'var(--N400)',
-        padding: '0 8px',
-        transition: 'all .2s ease',
-        transform: state.selectProps.menuIsOpen ? 'rotate(180deg)' : 'rotate(0deg)',
-    }),
-    valueContainer: (base) => ({
-        ...base,
-        padding: '0 8px',
-        fontWeight: '400',
-    }),
-    loadingMessage: (base) => ({
-        ...base,
-        color: 'var(--N600)',
-    }),
-    noOptionsMessage: (base) => ({
-        ...base,
-        color: 'var(--N600)',
-    }),
-    ...styleOverrides,
-})
-
-const getCustomOptionBackgroundColor = (isSelected: boolean, isFocused: boolean) => {
-    if (isSelected) {
-        return 'var(--B100)'
-    }
-
-    if (isFocused) {
-        return 'var(--N50)'
-    }
-
-    return 'var(--white)'
-}
-
-export const getCustomOptionSelectionStyle =
-    (styleOverrides = {}) =>
-    (base, state) => ({
-        ...base,
-        backgroundColor: getCustomOptionBackgroundColor(state.isSelected, state.isFocused),
-        color: state.isSelected ? 'var(--B500)' : 'var(--N900)',
-        textOverflow: 'ellipsis',
-        fontWeight: '500',
-        overflow: 'hidden',
-        textAlign: 'left',
-        whiteSpace: 'nowrap',
-        cursor: 'pointer',
-        fontSize: '13px',
-        ...styleOverrides,
-    })
-
-export const SelectOption = (props: any) => {
-    const { selectProps, data, showTippy, style, placement, tippyContent, tippyClass } = props
-    selectProps.styles.option = getCustomOptionSelectionStyle(style)
-    const getOption = () => (
-        <div onClick={stopPropagation}>
-            <components.Option {...props} />
-        </div>
-    )
-
-    return showTippy ? (
-        <Tippy
-            className={tippyClass || 'default-white'}
-            arrow={false}
-            placement={placement || 'right'}
-            content={tippyContent || data.label}
-        >
-            {getOption()}
-        </Tippy>
-    ) : (
-        getOption()
-    )
-}

package/src/Shared/Components/index.ts

@@ -1,2 +0,0 @@
-export * from './APIResponseHandler'
-export * from './ReactSelect'

package/src/Shared/Helpers.tsx

@@ -1,29 +0,0 @@
-interface HighlightSearchTextProps {
-    /**
-     * The text to be highlighted
-     */
-    searchText: string
-    /**
-     * The whole text string
-     */
-    text: string
-    /**
-     * The classes to be applied to the highlighted text
-     */
-    highlightClasses?: string
-}
-
-// Disabling default export since this is a helper function and we would have to export a lot of functions in future.
-// eslint-disable-next-line import/prefer-default-export
-export const highlightSearchText = ({ searchText, text, highlightClasses }: HighlightSearchTextProps): string => {
-    if (!searchText) {
-        return text
-    }
-
-    try {
-        const regex = new RegExp(searchText, 'gi')
-        return text.replace(regex, (match) => `<span class="${highlightClasses}">${match}</span>`)
-    } catch (error) {
-        return text
-    }
-}

package/src/Shared/index.ts

@@ -1,3 +0,0 @@
-export * from './Components'
-export * from './validations'
-export * from './Helpers'

package/src/Shared/validations.tsx

@@ -1,72 +0,0 @@
-export interface ValidationResponseType {
-    isValid: boolean
-    message?: string
-}
-
-export const validateName = (name: string): ValidationResponseType => {
-    if (!/^.{3,50}$/.test(name)) {
-        return {
-            isValid: false,
-            message: 'Minimum 3 and maximum 50 characters allowed',
-        }
-    }
-
-    if (!/^[a-z0-9-._]+$/.test(name)) {
-        return {
-            isValid: false,
-            message: 'Only lowercase alphanumeric characters, -, _ or . allowed',
-        }
-    }
-
-    if (!/^(?![-._]).*[^-._]$/.test(name)) {
-        return {
-            isValid: false,
-            message: 'Cannot start/end with -, _ or .',
-        }
-    }
-
-    return {
-        isValid: true,
-    }
-}
-
-export const validateDescription = (description: string): ValidationResponseType => {
-    if (description?.length > 300) {
-        return {
-            isValid: false,
-            message: 'Maximum 300 characters are allowed',
-        }
-    }
-
-    return {
-        isValid: true,
-    }
-}
-
-export const validateRequiredPositiveNumber = (value: string | number): ValidationResponseType => {
-    if (!value) {
-        return {
-            isValid: false,
-            message: 'This field is required',
-        }
-    }
-
-    // TODO: Look if regex is available for this, since 0002 is not a valid number
-    if (!/^\d+(\.\d+)?$/.test(value.toString())) {
-        return {
-            isValid: false,
-            message: 'This field should be a valid positive number',
-        }
-    }
-
-    if (Number(value) <= 0) {
-        return {
-            isValid: false,
-            message: 'Only positive numbers are allowed',
-        }
-    }
-
-    return {
-        isValid: true,
-    }
-}