{"componentChunkName":"component---src-templates-post-template-js","path":"/en-US/feedback/feedback","result":{"data":{"current":{"frontmatter":{"title":"Feedback","order":89,"brief":"Quick feedback component","icon":"doc-feedback"},"fields":{"type":"feedback"},"tableOfContents":{"items":[{"url":"#demos","title":"Demos","items":[{"url":"#how-to-import","title":"How to import"},{"url":"#basic-usage","title":"Basic usage"},{"url":"#text-type","title":"Text type"},{"url":"#single-choice-feedback","title":"Single choice feedback"},{"url":"#multiple-choice-feedback","title":"Multiple choice feedback"},{"url":"#customized-feedback-content","title":"Customized feedback content"},{"url":"#modal","title":"Modal"},{"url":"#feedback-completion-tips","title":"Feedback completion tips"}]},{"url":"#api-reference","title":"API reference"}]},"body":"var _excluded = [\"components\"];\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nfunction _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }\nfunction _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }\n/* @jsxRuntime classic */\n/* @jsx mdx */\n\nvar _frontmatter = {\n  \"localeCode\": \"en-US\",\n  \"order\": 89,\n  \"category\": \"Basic\",\n  \"title\": \"Feedback\",\n  \"icon\": \"doc-feedback\",\n  \"brief\": \"Quick feedback component\",\n  \"showNew\": true\n};\nvar layoutProps = {\n  _frontmatter: _frontmatter\n};\nvar MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n  var components = _ref.components,\n    props = _objectWithoutProperties(_ref, _excluded);\n  return mdx(MDXLayout, _extends({}, layoutProps, props, {\n    components: components,\n    mdxType: \"MDXLayout\"\n  }), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"Demos\"), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"How to import\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Feedback Supported since 2.85.0.\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"import\",\n    \"import\": true\n  }, \"import { Feedback } from '@douyinfe/semi-ui';\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"Basic usage\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Use \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"visible\"), \" to set whether to display or not. The default feedback display content is in emoji form. The currently selected content can be obtained through \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"onValueChange\"), \".\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React, { useState, useCallback } from 'react';\\nimport { Feedback, Button } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const [visible, setVisible] = useState(false);\\n    const handleOk = useCallback(() => setVisible(false), []);\\n    const handleCancel = useCallback(() => setVisible(false), []);\\n    const onValueChange = useCallback((value) => {\\n        console.log('emoji value', value);\\n    });\\n\\n    return (<>\\n        <Button onClick={() => setVisible(!visible)} >\\n            Show feedback: Popup, emoji\\n        </Button>\\n        <Feedback\\n            title=\\\"What is your rating of this product?\\\"\\n            visible={visible}\\n            onOk={handleOk}\\n            onCancel={handleCancel}\\n            onValueChange={onValueChange}\\n        />\\n    </>);\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"Text type\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Set \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"type\"), \" to \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"text\"), \" to get feedback in the form of a multi-line input box, and set the parameters of the multi-line input box through \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"textAreaProps\"), \".\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React, { useState, useCallback } from 'react';\\nimport { Feedback, Button } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const [visible, setVisible] = useState(false);\\n    const handleOk = useCallback(() => setVisible(false), []);\\n    const handleCancel = useCallback(() => setVisible(false), []);\\n\\n    return (<>\\n        <Button onClick={() => setVisible(!visible)} >\\n            Show feedback: Popup, text\\n        </Button>\\n        <Feedback\\n            type=\\\"text\\\"\\n            textAreaProps={{ maxCount: 200 }}\\n            title=\\\"What is your suggestion of this product?\\\"\\n            visible={visible}\\n            onOk={handleOk}\\n            onCancel={handleCancel}\\n        />\\n    </>);\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"Single choice feedback\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Set \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"type\"), \" to \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"radio\"), \" to get feedback in the form of a single selection, and set the parameters of the radio selection through \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"radioGroupProps\"), \".\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React, { useState, useCallback } from 'react';\\nimport { Feedback, Button } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const [visible, setVisible] = useState(false);\\n    const handleOk = useCallback(() => setVisible(false), []);\\n    const handleCancel = useCallback(() => setVisible(false), []);\\n\\n    return (<>\\n        <Button onClick={() => setVisible(!visible)} >\\n            Show feedback: Popup, radio\\n        </Button>\\n        <Feedback\\n            type=\\\"radio\\\"\\n            radioGroupProps={{\\n                options: ['Guest', 'Developer', 'Maintainer'],\\n            }}\\n            title=\\\"What is your role?\\\"\\n            visible={visible}\\n            onOk={handleOk}\\n            onCancel={handleCancel}\\n        />\\n    </>);\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"Multiple choice feedback\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Set \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"type\"), \" to \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"checkbox\"), \" to obtain feedback in the form of multiple selections, and set the parameters of the multi selection through \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"checkboxGroupProps\"), \".\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React, { useState, useCallback } from 'react';\\nimport { Feedback, Button } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const [visible, setVisible] = useState(false);\\n    const handleOk = useCallback(() => setVisible(false), []);\\n    const handleCancel = useCallback(() => setVisible(false), []);\\n\\n    return (<>\\n        <Button onClick={() => setVisible(!visible)} >\\n            Show feedback: Popup, checkbox\\n        </Button>\\n        <Feedback\\n            type=\\\"checkbox\\\"\\n            checkboxGroupProps={{\\n                options: ['Douyin', ' Huoshan', 'doubao']\\n            }}\\n            title=\\\"Which products you choose?\\\"\\n            visible={visible}\\n            onOk={handleOk}\\n            onCancel={handleCancel}\\n        />\\n    </>);\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"Customized feedback content\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Set \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"type\"), \" to \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"custom\"), \" to obtain feedback in the form of multiple selections, and set the feedback content through \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"renderContent\"), \". When using custom feedback, you need to control whether the submit button is disabled or not. Users can set it through \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"okButtonProps\"), \".\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React, { useState, useCallback } from 'react';\\nimport { Feedback, Button, TextArea } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const [visible, setVisible] = useState(false);\\n    const [value, setValue] = useState(value);\\n    const handleOk = useCallback(() => setVisible(false), []);\\n    const handleCancel = useCallback(() => setVisible(false), []);\\n    const onTextAreaChange = useCallback((value) => {\\n        setValue(value);\\n    }, []);\\n    const renderContent = useCallback(() => {\\n        return <>\\n            <span>This is a custom content</span>\\n            <TextArea\\n                value={value}\\n                onChange={onTextAreaChange}\\n            />\\n        </>;\\n    }, [onTextAreaChange]);\\n\\n    return (<>\\n        <Button onClick={() => setVisible(!visible)} >\\n            Show Feedback: Popup, custom\\n        </Button>\\n        <Feedback\\n            type=\\\"custom\\\"\\n            title=\\\"What is your suggestion?\\\"\\n            okButtonProps={{ disabled: !Boolean(value) }}\\n            visible={visible}\\n            onOk={handleOk}\\n            onCancel={handleCancel}\\n            renderContent={renderContent}\\n        />\\n    </>);\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"Modal\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"The form of feedback can be passed through \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"mode\"), \", the default is \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"popup\"), \", set to \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"modal\"), \" to get the display in the form of modal dialog box.\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React, { useState, useCallback } from 'react';\\nimport { Feedback, Button } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const [visible, setVisible] = useState(false);\\n    const handleOk = useCallback(() => setVisible(false), []);\\n    const handleCancel = useCallback(() => setVisible(false), []);\\n    const onValueChange = useCallback((value) => {\\n        console.log('emoji value', value);\\n    });\\n\\n    return (<>\\n        <Button onClick={() => setVisible(!visible)} >\\n            Show: Modal, emoji\\n        </Button>\\n        <Feedback\\n            mode=\\\"modal\\\"\\n            title=\\\"Why did you choose this rating?\\\"\\n            visible={visible}\\n            onOk={handleOk}\\n            onCancel={handleCancel}\\n            onValueChange={onValueChange}\\n        />\\n    </>);\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"Feedback completion tips\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"After the feedback is completed, you can switch to display information to remind the user that the feedback has been completed.\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React, { useState, useCallback, useMemo } from 'react';\\nimport { Feedback, Button, Empty, TextArea } from '@douyinfe/semi-ui';\\nimport { IllustrationSuccess, IllustrationSuccessDark } from '@douyinfe/semi-illustrations';\\n\\n() => {\\n    const [visible1, setVisible1] = useState(false);\\n    const [value1, setValue1] = useState('');\\n    const [showThanks1, setShowThanks1] = useState(false);\\n\\n    const [visible2, setVisible2] = useState(false);\\n    const [value2, setValue2] = useState('');\\n    const [showThanks2, setShowThanks2] = useState(false);\\n\\n    const handleOk1 = useCallback(() => {\\n        setShowThanks1(true);\\n        setTimeout(() => {\\n            setVisible1(false);\\n            setTimeout(() => {\\n                setShowThanks1(false);\\n            }, 200);\\n        }, 1500); \\n    }, []);\\n\\n    const hideFeedback1 = useCallback(() => {\\n        setVisible1(false);\\n    }, []);\\n\\n    const onTextAreaChange1 = useCallback((value) => {\\n        setValue1(value);\\n    }, []);\\n\\n    const handleOk2 = useCallback(() => {\\n        setShowThanks2(true);\\n        setTimeout(() => {\\n            setVisible2(false);\\n            setTimeout(() => {\\n                setShowThanks2(false);\\n            }, 200);\\n        }, 1500); \\n    }, []);\\n\\n    const hideFeedback2 = useCallback(() => {\\n        setVisible2(false);\\n    }, []);\\n\\n    const onTextAreaChange2 = useCallback((value) => {\\n        setValue2(value);\\n    }, []);\\n\\n    const showThankProps = useMemo(() => ({ title: ' ', footer: null }), []);\\n\\n    return <div>\\n        <Button onClick={() => setVisible1(!visible1)} >\\n            Open Feedback: Popup, Custom\\n        </Button>\\n        <Feedback\\n            visible={visible1}\\n            onOk={handleOk1}\\n            onCancel={hideFeedback1}\\n            okButtonProps={{\\n                disabled: !Boolean(value1),\\n            }}\\n            title=\\\"What is your feedback on this product?\\\"\\n            type='custom'\\n            {...(showThanks1 ? showThankProps : {})}\\n            renderContent={() => {\\n                return showThanks1 ? <>\\n                    <Empty\\n                        image={<IllustrationSuccess style={{ width: 150, height: 150 }} />}\\n                        darkModeImage={<IllustrationSuccessDark style={{ width: 150, height: 150 }} />}\\n                        description={'Thanks for your feedback'}\\n                        style={{ padding: 30 }}\\n                    />\\n                </> : <>\\n                    <span>This is a custom content</span>\\n                    <TextArea\\n                        onChange={onTextAreaChange1}\\n                    />\\n                </>;\\n            }}\\n        />\\n        <br /><br />\\n        <Button onClick={() => setVisible2(!visible2)} >\\n            Open Feedback: Modal, Custom\\n        </Button>\\n        <Feedback\\n            visible={visible2}\\n            onOk={handleOk2}\\n            onCancel={hideFeedback2}\\n            okButtonProps={{\\n                disabled: !Boolean(value2),\\n            }}\\n            title=\\\"What is your feedback on this product?\\\"\\n            type='custom'\\n            mode='modal'\\n            {...(showThanks2 ? showThankProps : {})}\\n            renderContent={() => {\\n                return showThanks2 ? <>\\n                    <Empty\\n                        image={<IllustrationSuccess style={{ width: 150, height: 150 }} />}\\n                        darkModeImage={<IllustrationSuccessDark style={{ width: 150, height: 150 }} />}\\n                        description={'Thanks for your feedback'}\\n                        style={{ padding: 30 }}\\n                    />\\n                </> : <>\\n                    <span>This is a custom content</span>\\n                    <TextArea\\n                        onChange={onTextAreaChange2}\\n                    />\\n                </>;\\n            }}\\n        />\\n    </div>;\\n};\\n\"))), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"API reference\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"In addition to the parameters listed below, when \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"mode\"), \" is \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"modal\"), \", FeedbackProps also supports the parameters in \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https:/lf3-static.semi.design/obj/semi-tos/semi_main/zh-CN/show/modal#Modal\"\n  }, \"ModalProps\"), \".\\nWhen \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"mode\"), \" is \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"popup\"), \", FeedbackProps also supports the parameters in \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https:/lf3-static.semi.design/obj/semi-tos/semi_main/zh-CN/show/sidesheet#API%20%E5%8F%82%E8%80%83\"\n  }, \"SideSheetProps\")), mdx(\"table\", {\n    parentName: \"section\"\n  }, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Properties\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Instructions\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"type\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Default\"))), mdx(\"tbody\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"cancelButtonProps\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Set the parameters for the cancel button\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, mdx(\"a\", {\n    parentName: \"td\",\n    \"href\": \"https:/lf3-static.semi.design/obj/semi-tos/semi_main/zh-CN/basic/button#Button\"\n  }, \"ButtonProps\")), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"-\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"checkboxGroupProps\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Set parameters for multiple selections\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, mdx(\"a\", {\n    parentName: \"td\",\n    \"href\": \"https:/lf3-static.semi.design/obj/semi-tos/semi_main/en-US/input/checkbox#Checkbox%20Group\"\n  }, \"CheckBoxGroupProps\")), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"-\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"radioGroupProps\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Set radio parameters\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, mdx(\"a\", {\n    parentName: \"td\",\n    \"href\": \"https:/lf3-static.semi.design/obj/semi-tos/semi_main/en-US/input/radio#RadioGroup\"\n  }, \"RadioGroupProps\")), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"-\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"renderContent\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Customized feedback content display\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"(content: ReactNode) => ReactNode\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"-\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"ModalProps\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"When mode is modal, it is used to set modal parameters.\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"ModalProps\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"-\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"mode\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Display mode, supports popup and modal\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"popup\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"okButtonProps\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Set the parameters of the submit button. For example, when customizing content, set disabled in okButtonProps to disable submission\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, mdx(\"a\", {\n    parentName: \"td\",\n    \"href\": \"https:/lf3-static.semi.design/obj/semi-tos/semi_main/zh-CN/input/input#Button\"\n  }, \"ButtonProps\")), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"-\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onCancel\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Cancel callback, the parameter is the shutdown function, and it will automatically close after the promise is resolved.\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"(e: any) => void \", \"|\", \" Promise<any\", \">\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"-\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onOk\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Click OK callback, the parameter is the closing function, and it will automatically close after the promise is resolved.\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"(e: any) => void \", \"|\", \" Promise<any\", \">\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"-\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onValueChange\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Callback when feedback content changes\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"(value: string \", \"|\", \" string[] \", \"|\", \" Object)\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"SideSheetProps\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"When modal is popup, it is used to set the parameters of the internal SideSheet\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"SideSheetProps\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"-\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"type\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Type of feedback content, supports text, emoji, radio, checkbox, custom\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"emoji\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"textAreaProps\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Set parameters of multi-line input box\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, mdx(\"a\", {\n    parentName: \"td\",\n    \"href\": \"https:/lf3-static.semi.design/obj/semi-tos/semi_main/en-US/input/input#TextArea\"\n  }, \"TextAreaProps\")), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"-\"))))));\n}\n;\nMDXContent.isMDXComponent = true;"}},"pageContext":{"slug":"en-US/feedback/feedback","next":{"fields":{"slug":"zh-CN/feedback/feedback"},"id":"eb182460-84f5-56e2-b378-6ae29435b717","frontmatter":{"title":"Feedback 反馈","localeCode":"zh-CN","icon":"doc-feedback","showNew":true}},"previous":{"fields":{"slug":"zh-CN/feedback/notification"},"id":"87ea5b27-bb7d-5eec-9dc7-dfa2a947d845","frontmatter":{"title":"Notification 通知","localeCode":"zh-CN","icon":"doc-notification","showNew":null}}}},"staticQueryHashes":["1348983216229725","1477422646229725","3245198693229725","417590761229725","63159454229725"]}