From f51b4e94d7e5b8881e9e96064e9c0d8ad5434fc7 Mon Sep 17 00:00:00 2001 From: Himanshu Nagrath Date: Tue, 10 Nov 2020 18:36:31 +0530 Subject: [PATCH] initial commit for nps-drawer --- src/components/nps/nps-drawer.tsx | 38 +++++++++++++++++++++++++ src/components/nps/nps.stories.tsx | 20 +++++++++++++ yarn.lock | 45 ++++++++++++++++++++++++++++++ 3 files changed, 103 insertions(+) create mode 100644 src/components/nps/nps-drawer.tsx diff --git a/src/components/nps/nps-drawer.tsx b/src/components/nps/nps-drawer.tsx new file mode 100644 index 00000000..23cfa228 --- /dev/null +++ b/src/components/nps/nps-drawer.tsx @@ -0,0 +1,38 @@ +import React from 'react' +import Drawer from 'components/drawer' +import { DrawerPlacement } from 'components/drawer/drawer' +import { NPSInput } from './nps' + +export type NPSDrawerProps = { + visible: boolean + title?: string + message?: (score: number) => React.ReactNode + onSubmit?: (score: number) => void + onDismiss?: () => void +} + +export function NPSDrawer({ + visible, + title, + message, + onSubmit, + onDismiss, +}: NPSDrawerProps) { + return ( + + + + ) +} diff --git a/src/components/nps/nps.stories.tsx b/src/components/nps/nps.stories.tsx index 8aea355c..ce5e6dc7 100644 --- a/src/components/nps/nps.stories.tsx +++ b/src/components/nps/nps.stories.tsx @@ -3,6 +3,7 @@ import { Meta } from '@storybook/react/types-6-0' import { action } from '@storybook/addon-actions' import Button from 'components/button' import { NPSInput } from './nps' +import { NPSDrawer } from './nps-drawer' export default { title: 'Survey/NPS', @@ -60,3 +61,22 @@ export function WithCustomMessage() { ) } + +export function NPSInDrawer() { + const [show, setShow] = useState(false) + + function showDrawer() { + setShow(true) + } + + function onClose() { + setShow(false) + } + + return ( + <> +