@sonardigital/carbon-ui 1.1.38 → 1.1.40

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sonardigital/carbon-ui",
-  "version": "1.1.38",
+  "version": "1.1.40",
   "description": "",
   "main": "src/index.ts",
   "files": [

package/src/components/layout/Dropdown/components/DropdownItem.tsx

@@ -1,12 +1,8 @@
 import { MenuItem } from '@mui/material';
-import { useDropdown } from 'src/components/layout';
+import { useDropdown } from '../hooks';
 
-export function DropdownItem({
-   children,
-}: {
-   children: React.ReactNode;
-}): React.ReactElement {
-   const methods = useDropdown();
+export function DropdownItem({ children }: { children: React.ReactNode }): React.ReactElement {
+  const methods = useDropdown();
 
-   return <MenuItem onClick={methods.close}>{children}</MenuItem>;
+  return <MenuItem onClick={methods.close}>{children}</MenuItem>;
 }

package/src/components/layout/Dropdown/components/DropdownPopover.tsx

@@ -3,25 +3,22 @@ import React from 'react';
 import { useDropdownContext } from '../hooks/useDropdownContext';
 
 interface PopoverProviderProps extends Omit<MenuProps, 'open'> {
-   children: React.ReactNode;
+  children: React.ReactNode;
 }
 
-export function DropdownPopover({
-   children,
-   ...props
-}: PopoverProviderProps): React.ReactElement {
-   const methods = useDropdownContext();
+export function DropdownPopover({ children, ...props }: PopoverProviderProps): React.ReactElement {
+  const methods = useDropdownContext();
 
-   return (
-      <Menu
-         anchorEl={methods.anchorEl}
-         open={methods.isOpen}
-         onClose={methods.close}
-         sx={{ mt: 1, gap: 1, ...props?.sx }}
-         slots={{ transition: Collapse }}
-         {...props}
-      >
-         {children}
-      </Menu>
-   );
+  return (
+    <Menu
+      anchorEl={methods.anchorEl}
+      open={methods.isOpen}
+      onClose={methods.close}
+      sx={{ mt: 1, gap: 1, ...props?.sx }}
+      slots={{ transition: Collapse }}
+      {...props}
+    >
+      {children}
+    </Menu>
+  );
 }

package/src/components/layout/Dropdown/components/DropdownTrigger.tsx

@@ -3,36 +3,33 @@ import React from 'react';
 import { useDropdownContext } from '../hooks/useDropdownContext';
 
 interface DropdownTriggerProps {
-   children: React.ReactNode;
-   onClick?: () => void;
+  children: React.ReactNode;
+  onClick?: () => void;
 }
 
-export function DropdownTrigger({
-   children,
-   onClick,
-}: DropdownTriggerProps): React.ReactElement {
-   const { open, setAnchorEl } = useDropdownContext();
+export function DropdownTrigger({ children, onClick }: DropdownTriggerProps): React.ReactElement {
+  const { open, setAnchorEl } = useDropdownContext();
 
-   const handleClick = (event: React.MouseEvent<HTMLButtonElement>): void => {
-      if (event.detail === 0) {
-         return;
-      }
-      setAnchorEl(event.currentTarget);
-      open();
-      if (onClick) onClick();
-   };
+  const handleClick = (event: React.MouseEvent<HTMLButtonElement>): void => {
+    if (event.detail === 0) {
+      return;
+    }
+    setAnchorEl(event.currentTarget);
+    open();
+    if (onClick) onClick();
+  };
 
-   return (
-      <ButtonBase
-         sx={{
-            position: 'relative',
-            width: '100%',
-            justifyContent: 'start',
-         }}
-         disableRipple
-         onClick={handleClick}
-      >
-         {children}
-      </ButtonBase>
-   );
+  return (
+    <ButtonBase
+      sx={{
+        position: 'relative',
+        width: '100%',
+        justifyContent: 'start',
+      }}
+      disableRipple
+      onClick={handleClick}
+    >
+      {children}
+    </ButtonBase>
+  );
 }

package/src/components/layout/Dropdown/hooks/useDropdown.ts

@@ -2,21 +2,21 @@ import { useState } from 'react';
 import { DropdownContextType } from '../provider/DropdownContext';
 
 interface DropdownHookProps {
-   onClose?: () => void;
+  onClose?: () => void;
 }
 
 export const useDropdown = (props?: DropdownHookProps): DropdownContextType => {
-   const [isOpen, setIsOpen] = useState(false);
-   const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);
+  const [isOpen, setIsOpen] = useState(false);
+  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);
 
-   const toggle = (): void => setIsOpen(prev => !prev);
-   const open = (): void => {
-      setIsOpen(true);
-   };
-   const close = (): void => {
-      setIsOpen(false);
-      if (props?.onClose) props.onClose();
-   };
+  const toggle = (): void => setIsOpen((prev) => !prev);
+  const open = (): void => {
+    setIsOpen(true);
+  };
+  const close = (): void => {
+    setIsOpen(false);
+    if (props?.onClose) props.onClose();
+  };
 
-   return { isOpen, toggle, open, close, anchorEl, setAnchorEl };
+  return { isOpen, toggle, open, close, anchorEl, setAnchorEl };
 };

package/src/components/layout/Dropdown/hooks/useDropdownContext.ts

@@ -1,13 +1,11 @@
 import { useContext } from 'react';
-import DropdownContext, {
-   DropdownContextType,
-} from '../provider/DropdownContext';
+import DropdownContext, { DropdownContextType } from '../provider/DropdownContext';
 
 export const useDropdownContext = (): DropdownContextType => {
-   const context = useContext(DropdownContext);
+  const context = useContext(DropdownContext);
 
-   if (!context) {
-      throw new Error('useDropdown must be used within a DropdownProvider');
-   }
-   return context;
+  if (!context) {
+    throw new Error('useDropdown must be used within a DropdownProvider');
+  }
+  return context;
 };

package/src/components/layout/Dropdown/index.ts

@@ -1,2 +1,3 @@
 export * from './components';
 export * from './hooks';
+export * from './provider';

package/src/components/layout/Dropdown/provider/DropdownProvider.tsx

@@ -4,32 +4,25 @@ import { useDropdown } from '../hooks/useDropdown';
 import DropdownContext from '../provider/DropdownContext';
 
 interface DropdownProviderProps {
-   methods?: ReturnType<typeof useDropdown>;
-   children: React.ReactNode;
-   onClose?: () => void;
+  methods?: ReturnType<typeof useDropdown>;
+  children: React.ReactNode;
+  onClose?: () => void;
 }
 
 export function DropdownProvider({
-   methods,
-   children,
-   onClose,
+  methods,
+  children,
+  onClose,
 }: DropdownProviderProps): React.ReactElement<DropdownProviderProps> {
-   const defaultMethods = useDropdown({ onClose: onClose });
+  const defaultMethods = useDropdown({ onClose: onClose });
 
-   return (
-      <DropdownContext.Provider value={methods ?? defaultMethods}>
-         <ClickAwayListener
-            onClickAway={methods ? methods.close : defaultMethods.close}
-         >
-            <Stack
-               flexDirection="column"
-               position="relative"
-               width="auto"
-               height="auto"
-            >
-               {children}
-            </Stack>
-         </ClickAwayListener>
-      </DropdownContext.Provider>
-   );
+  return (
+    <DropdownContext.Provider value={methods ?? defaultMethods}>
+      <ClickAwayListener onClickAway={methods ? methods.close : defaultMethods.close}>
+        <Stack flexDirection="column" position="relative" width="auto" height="auto">
+          {children}
+        </Stack>
+      </ClickAwayListener>
+    </DropdownContext.Provider>
+  );
 }