From 39ee29b2c6d50ed836d110af71e1b42c90ff2a09 Mon Sep 17 00:00:00 2001 From: Dominic Go <18517029+dominicstop@users.noreply.github.com> Date: Tue, 5 Jul 2022 17:57:10 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=93=9D=20Docs:=20Update=20README=20-=20`C?= =?UTF-8?q?ontextMenuViewExample11`?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 3947cee..e498649 100644 --- a/README.md +++ b/README.md @@ -1584,17 +1584,19 @@ export function ContextMenuViewExample10(props) { ### `ContextMenuView` Example 11 -**Summary**: TBA +**Summary**: An example showing how to use a custom preview for the context menu.
-| Notes | -| ------------------------ | -| TBA

📝 **Note A**: | +| Notes | +| ------------------------------------------------------------ | +| 1️⃣ — The `ContextMenuView.renderPreview` render prop allows you show a custom preview when the context menu appears.

📝 **Note**: The `renderPreview` prop accepts a function that returns an element. The returned element will be used for the context menu preview. | +| 2️⃣ — The `ContextMenuView.previewConfig` is used to control the behaviours and appearance of the custom context menu preview.

In order to show the custom context menu preview, we must first set `MenuPreviewConfig.previewType` to `'CUSTOM'`. Bu default, this property is set to `'DEFAULT'`, which means that you do not want to use a custom preview.

📝 **Note A**: The `previewConfig` prop accepts a `MenuPreviewConfig` object.

📝 **Note B**: The `previewType` property accepts a `MenuPreviewType` string. You can set this to `'DEFAULT'` if you want to quickly disable the custom preview. | +| 3️⃣ — In this example, we want the custom preview to be as big as possible, so we set the `MenuPreviewConfig.previewSize` property to `'STRETCH'`.

📝 **Note**: The `previewSize` property accepts a `MenuPreviewSize` string. By default, this prop is set to `'INHERIT'`, which means to just match the size of the root view returned from `renderPreview`. |
-[🔗 Full Example](example/src/examples/ContextMenuViewExampleXX.tsx) +[🔗 Full Example](example/src/examples/ContextMenuViewExample11.tsx) ```jsx // 📝 Note: for the sake of brevity, some of the code is omitted...