goobs-frontend 0.7.67 → 0.7.69

package/src/components/StyledComponent/adornment/index.tsx

@@ -1,125 +0,0 @@
-import React from 'react'
-import { InputAdornment, Button, Box } from '@mui/material'
-import SearchIcon from '../../Icons/Search'
-import ShowHideEyeIcon from '../../Icons/ShowHideEye'
-import DownArrowFilledIcon from '../../Icons/DownArrowFilled'
-
-/**
- * Props interface for the Adornment components
- */
-export interface AdornmentProps {
-  componentvariant: string
-  iconcolor?: string
-  passwordVisible?: boolean
-  togglePasswordVisibility?: () => void
-  marginRight?: number | string
-  handleIncrement?: () => void
-  handleDecrement?: () => void
-}
-
-/**
- * StartAdornment component renders the start adornment for the input component.
- * @param props The props for the StartAdornment component.
- * @returns The start adornment component or null.
- */
-export const StartAdornment: React.FC<AdornmentProps> = props => {
-  const { componentvariant, iconcolor } = props
-  // Render the search icon for the search bar variant
-  if (componentvariant === 'searchbar') {
-    return (
-      <InputAdornment position="start">
-        <SearchIcon color={iconcolor} />
-      </InputAdornment>
-    )
-  }
-  return null
-}
-
-/**
- * EndAdornment component renders the end adornment for the input component.
- * @param props The props for the EndAdornment component.
- * @returns The end adornment component or null.
- */
-export const EndAdornment: React.FC<AdornmentProps> = props => {
-  const {
-    componentvariant,
-    passwordVisible,
-    togglePasswordVisibility,
-    handleIncrement,
-    handleDecrement,
-  } = props
-
-  const adornmentStyle = {
-    cursor: 'pointer',
-  }
-
-  // Render the show/hide eye icon for the password variant
-  if (componentvariant === 'password') {
-    return (
-      <InputAdornment
-        position="end"
-        onClick={togglePasswordVisibility}
-        style={adornmentStyle}
-      >
-        <ShowHideEyeIcon visible={passwordVisible} />
-      </InputAdornment>
-    )
-  }
-  // Render the down arrow icon for the dropdown variant
-  else if (componentvariant === 'dropdown') {
-    return (
-      <InputAdornment position="end" style={adornmentStyle}>
-        <DownArrowFilledIcon />
-      </InputAdornment>
-    )
-  }
-  // Render the increment/decrement buttons for the splitbutton variant
-  else if (componentvariant === 'splitbutton') {
-    return (
-      <InputAdornment position="end">
-        <Button
-          sx={{
-            minWidth: '20px',
-            padding: 0,
-            height: '100%',
-            borderLeft: '1px solid #c4c4c4',
-            borderRadius: '0 4px 4px 0',
-            backgroundColor: '#f0f0f0',
-            color: 'black',
-            '&:hover': {
-              backgroundColor: '#e0e0e0',
-            },
-          }}
-        >
-          <Box
-            sx={{
-              display: 'flex',
-              flexDirection: 'column',
-              alignItems: 'center',
-            }}
-          >
-            <Box
-              sx={{ fontSize: '10px', lineHeight: 1, cursor: 'pointer' }}
-              onClick={handleIncrement}
-            >
-              ▲
-            </Box>
-            <Box
-              sx={{ fontSize: '10px', lineHeight: 1, cursor: 'pointer' }}
-              onClick={handleDecrement}
-            >
-              ▼
-            </Box>
-          </Box>
-        </Button>
-      </InputAdornment>
-    )
-  }
-  // Render an empty end adornment for the search bar variant
-  else if (componentvariant === 'searchbar') {
-    return (
-      <InputAdornment position="end" style={adornmentStyle}></InputAdornment>
-    )
-  }
-  return null
-}

package/src/components/StyledComponent/hooks/useDropdown.tsx

@@ -1,150 +0,0 @@
-'use client'
-
-import { useState, useCallback } from 'react'
-import { StyledComponentProps } from '..'
-import { styled, Menu, MenuItem } from '@mui/material'
-import React from 'react'
-
-/**
- * Styled MenuItem component for the dropdown menu.
- */
-const StyledSelectMenu = styled(MenuItem)({
-  backgroundColor: 'white',
-  color: 'black',
-  '&:hover': { backgroundColor: '#63B3DD' },
-  '&[aria-selected=true]': {
-    color: 'white',
-    backgroundColor: '#9CE4F8',
-  },
-})
-
-/**
- * Custom hook for managing a dropdown component.
- *
- * @param {StyledComponentProps} props - The props passed to the StyledComponent.
- * @param {React.RefObject<HTMLDivElement>} inputBoxRef - Ref to the input box element.
- * @param {(option: string) => void} [onOptionSelect] - Optional callback function when an option is selected.
- * @returns {Object} An object containing state and handlers for the dropdown.
- */
-export const useDropdown = (
-  props: StyledComponentProps,
-  inputBoxRef: React.RefObject<HTMLDivElement>,
-  onOptionSelect?: (option: string) => void
-) => {
-  const { componentvariant, options, value, defaultOption } = props
-
-  /** State to control if the dropdown is open */
-  const [isDropdownOpen, setIsDropdownOpen] = useState(false)
-  /** State to store the anchor element for the dropdown */
-  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)
-  /** State to store the filtered options */
-  const [filteredOptions, setFilteredOptions] = useState<string[]>(
-    componentvariant === 'dropdown' && options ? [...options] : []
-  )
-  /** State to store the currently selected option */
-  const [selectedOption, setSelectedOption] = useState(() => {
-    if (value !== undefined) return value
-    if (defaultOption !== undefined) return defaultOption
-    if (options && options.length > 0) return options[0]
-    return ''
-  })
-  /** State to track if the dropdown is focused */
-  const [isDropdownFocused, setIsDropdownFocused] = useState(false)
-
-  /**
-   * Handle click on the dropdown to open/close it
-   */
-  const handleDropdownClick = useCallback(() => {
-    if (componentvariant === 'dropdown') {
-      setAnchorEl(inputBoxRef.current)
-      setIsDropdownOpen(prev => !prev)
-    }
-  }, [componentvariant, inputBoxRef])
-
-  /**
-   * Handle selection of an option from the dropdown
-   * @param {string} option - The selected option
-   */
-  const handleOptionSelect = useCallback(
-    (option: string) => {
-      setSelectedOption(option)
-      setIsDropdownOpen(false)
-      if (onOptionSelect) {
-        onOptionSelect(option)
-      }
-    },
-    [onOptionSelect]
-  )
-
-  /**
-   * Handle focus/blur of the dropdown input
-   * @param {boolean} focused - Whether the input is focused
-   */
-  const handleInputFocus = useCallback(
-    (focused: boolean) => {
-      if (componentvariant === 'dropdown') {
-        setIsDropdownFocused(focused)
-      }
-    },
-    [componentvariant]
-  )
-
-  /**
-   * Update filtered options and selected option when props change
-   */
-  const updateDropdownState = useCallback(() => {
-    if (componentvariant === 'dropdown' && options) {
-      setFilteredOptions([...options])
-    }
-    if (value !== undefined) {
-      setSelectedOption(value)
-    } else if (defaultOption !== undefined) {
-      setSelectedOption(defaultOption)
-    } else if (options && options.length > 0) {
-      setSelectedOption(options[0])
-    }
-  }, [componentvariant, options, value, defaultOption])
-
-  /**
-   * Render the dropdown menu
-   */
-  const renderMenu = (
-    <Menu
-      anchorEl={anchorEl}
-      open={isDropdownOpen}
-      onClose={() => setIsDropdownOpen(false)}
-      PaperProps={{
-        style: {
-          minWidth: inputBoxRef.current?.offsetWidth,
-        },
-      }}
-    >
-      {filteredOptions && filteredOptions.length > 0 ? (
-        filteredOptions.map((option: string) => (
-          <StyledSelectMenu
-            key={option}
-            onClick={() => handleOptionSelect(option)}
-            selected={option === selectedOption}
-          >
-            {option}
-          </StyledSelectMenu>
-        ))
-      ) : (
-        <MenuItem disabled>No Options Found</MenuItem>
-      )}
-    </Menu>
-  )
-
-  return {
-    renderMenu,
-    isDropdownOpen,
-    anchorEl,
-    filteredOptions,
-    handleDropdownClick,
-    selectedOption,
-    handleOptionSelect,
-    isDropdownFocused,
-    handleInputFocus,
-    updateDropdownState,
-  }
-}