Files
payload/packages/richtext-slate/src/field/providers/LeafButtonProvider.tsx
Jacob Fletcher 355bd12c61 chore: infer React context providers and prefer use (#11669)
As of [React 19](https://react.dev/blog/2024/12/05/react-19), context
providers no longer require the `<MyContext.Provider>` syntax and can be
rendered as `<MyContext>` directly. This will be deprecated in future
versions of React, which is now being caught by the
[`@eslint-react/no-context-provider`](https://eslint-react.xyz/docs/rules/no-context-provider)
ESLint rule.

Similarly, the [`use`](https://react.dev/reference/react/use) API is now
preferred over `useContext` because it is more flexible, for example
they can be called within loops and conditional statements. See the
[`@eslint-react/no-use-context`](https://eslint-react.xyz/docs/rules/no-use-context)
ESLint rule for more details.
2025-03-12 15:48:20 -04:00

41 lines
723 B
TypeScript

'use client'
import React from 'react'
import type { LoadedSlateFieldProps } from '../types.js'
type LeafButtonContextType = {
fieldProps: LoadedSlateFieldProps
path: string
schemaPath: string
}
const LeafButtonContext = React.createContext<LeafButtonContextType>({
fieldProps: {} as any,
path: '',
schemaPath: '',
})
export const LeafButtonProvider: React.FC<
{
children: React.ReactNode
} & LeafButtonContextType
> = (props) => {
const { children, ...rest } = props
return (
<LeafButtonContext
value={{
...rest,
}}
>
{children}
</LeafButtonContext>
)
}
export const useLeafButton = () => {
const path = React.use(LeafButtonContext)
return path
}