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.
41 lines
723 B
TypeScript
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
|
|
}
|