refactor(CModal): move the context outside the component

mrholek · mrholek · commit 08dde3d2a98c · 2025-04-30T12:33:48.000+02:00
diff --git a/packages/coreui-react/src/components/dropdown/CDropdown.tsx b/packages/coreui-react/src/components/dropdown/CDropdown.tsx
@@ -1,17 +1,10 @@
-import React, {
-  createContext,
-  ElementType,
-  forwardRef,
-  HTMLAttributes,
-  RefObject,
-  useEffect,
-  useRef,
-  useState,
-} from 'react'
+import React, { ElementType, forwardRef, HTMLAttributes, useEffect, useRef, useState } from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 import type { Options } from '@popperjs/core'
 
+import { CDropdownContext } from './CDropdownContext'
+
 import { PolymorphicRefForwardingComponent } from '../../helpers'
 import { useForkedRef, usePopper } from '../../hooks'
 import { placementPropType } from '../../props'
@@ -169,16 +162,6 @@ export interface CDropdownProps extends HTMLAttributes<HTMLDivElement | HTMLLIEl
   visible?: boolean
 }
 
-interface ContextProps extends CDropdownProps {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  dropdownToggleRef: RefObject<any | null>
-  dropdownMenuRef: RefObject<HTMLDivElement | HTMLUListElement | null>
-  setVisible: React.Dispatch<React.SetStateAction<boolean | undefined>>
-  portal: boolean
-}
-
-export const CDropdownContext = createContext({} as ContextProps)
-
 export const CDropdown: PolymorphicRefForwardingComponent<'div', CDropdownProps> = forwardRef<
   HTMLDivElement | HTMLLIElement,
   CDropdownProps
diff --git a/packages/coreui-react/src/components/dropdown/CDropdownContext.ts b/packages/coreui-react/src/components/dropdown/CDropdownContext.ts
@@ -0,0 +1,18 @@
+import { createContext, RefObject } from 'react'
+import { Alignments } from './types'
+
+export interface CDropdownContextProps {
+  alignment?: Alignments
+  container?: DocumentFragment | Element | (() => DocumentFragment | Element | null) | null
+  dark?: boolean
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  dropdownToggleRef: RefObject<any | null>
+  dropdownMenuRef: RefObject<HTMLDivElement | HTMLUListElement | null>
+  setVisible: React.Dispatch<React.SetStateAction<boolean | undefined>>
+  popper?: boolean
+  portal?: boolean
+  variant?: 'btn-group' | 'dropdown' | 'input-group' | 'nav-item'
+  visible?: boolean
+}
+
+export const CDropdownContext = createContext({} as CDropdownContextProps)
diff --git a/packages/coreui-react/src/components/dropdown/CDropdownMenu.tsx b/packages/coreui-react/src/components/dropdown/CDropdownMenu.tsx
@@ -2,8 +2,8 @@ import React, { ElementType, forwardRef, HTMLAttributes, useContext } from 'reac
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 
-import { CDropdownContext } from './CDropdown'
 import { CConditionalPortal } from '../conditional-portal'
+import { CDropdownContext } from './CDropdownContext'
 
 import { PolymorphicRefForwardingComponent } from '../../helpers'
 import { useForkedRef } from '../../hooks'
diff --git a/packages/coreui-react/src/components/dropdown/CDropdownToggle.tsx b/packages/coreui-react/src/components/dropdown/CDropdownToggle.tsx
@@ -3,8 +3,7 @@ import PropTypes from 'prop-types'
 import classNames from 'classnames'
 
 import { CButton, CButtonProps } from '../button/CButton'
-
-import { CDropdownContext } from './CDropdown'
+import { CDropdownContext } from './CDropdownContext'
 
 import { triggerPropType } from '../../props'
 import type { Triggers } from '../../types'
