| 1 |
import { createSlotFill } from '@wordpress/components'; |
| 2 |
import { useMemo } from '@wordpress/element'; |
| 3 |
import { AttributesPropsAndSetter } from '../../types'; |
| 4 |
import { decode, encode } from '../../util/code'; |
| 5 |
import { languages } from '../../util/languages'; |
| 6 |
|
| 7 |
export const SlotFactory = ({ |
| 8 |
name, |
| 9 |
attributes, |
| 10 |
setAttributes, |
| 11 |
}: AttributesPropsAndSetter & { name: string }) => { |
| 12 |
const { Slot } = useMemo(() => { |
| 13 |
return createSlotFill(name); |
| 14 |
}, [name]); |
| 15 |
return ( |
| 16 |
<Slot |
| 17 |
fillProps={{ |
| 18 |
attributes, |
| 19 |
setAttributes, |
| 20 |
languages, |
| 21 |
getCode: () => decode(attributes.code, attributes), |
| 22 |
setCode: (code: string) => |
| 23 |
setAttributes({ |
| 24 |
code: encode(code, attributes), |
| 25 |
}), |
| 26 |
}} |
| 27 |
/> |
| 28 |
); |
| 29 |
}; |
| 30 |
|
