From f21d3cfdfd8dd392b345df176155bc75c35c5504 Mon Sep 17 00:00:00 2001
From: Frida Erdal <31915755+pomfrida@users.noreply.github.com>
Date: Fri, 30 Oct 2020 15:25:07 +0100
Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20=20Popover=20story=20to=20?=
=?UTF-8?q?Typescript=20(#797)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
* ♻️ JSX to TSX
* ♻️ Popover default story with controls
* 🔥 PopoverItem removed from export
PopoverItem is just for internal use, not needed elsewhere
* ♻️ Rename function
* 🔥 Removed comments
Want to fix these errors instead
* ♻️ Type React.SyntheticEvent (generic for events) on event handlers
Cleared lint warnings
* 🚨 Fixed linter warnings in story
* ♻️ Open Popover via control AND anchor (story)
* ♻️ Props name changed in test
* ♻️ Export merged types
---
...opover.stories.jsx => Popover.stories.tsx} | 164 +++++++-----------
.../core-react/src/Popover/Popover.test.tsx | 9 +-
libraries/core-react/src/Popover/Popover.tsx | 89 +++++-----
.../core-react/src/Popover/PopoverItem.tsx | 8 +-
libraries/core-react/src/Popover/index.ts | 9 +-
libraries/core-react/src/index.ts | 2 +-
6 files changed, 123 insertions(+), 158 deletions(-)
rename apps/storybook-react/stories/{Popover.stories.jsx => Popover.stories.tsx} (75%)
diff --git a/apps/storybook-react/stories/Popover.stories.jsx b/apps/storybook-react/stories/Popover.stories.tsx
similarity index 75%
rename from apps/storybook-react/stories/Popover.stories.jsx
rename to apps/storybook-react/stories/Popover.stories.tsx
index 7462b28f4f..0ec12fe2a8 100644
--- a/apps/storybook-react/stories/Popover.stories.jsx
+++ b/apps/storybook-react/stories/Popover.stories.tsx
@@ -1,18 +1,13 @@
import React from 'react'
-import { withKnobs, select, text } from '@storybook/addon-knobs'
import styled from 'styled-components'
import {
Typography,
Button,
- Avatar,
- Chip,
- TextField,
- Search,
- Icon,
Popover,
+ PopoverProps,
Card,
} from '@equinor/eds-core-react'
-import catImg from '../images/cat.jpg'
+import { Meta, Story } from '@storybook/react'
const { PopoverAnchor, PopoverTitle, PopoverContent } = Popover
const { CardActions } = Card
@@ -36,18 +31,70 @@ const TextWrapper = styled.div`
export default {
title: 'Components/Popover',
component: Popover,
- decorators: [withKnobs],
+ subcomponents: {
+ PopoverAnchor,
+ PopoverTitle,
+ PopoverContent,
+ CardActions,
+ },
+ argTypes: {
+ placement: {
+ control: {
+ type: 'select',
+ options: [
+ 'topLeft',
+ 'top',
+ 'topRight',
+ 'rightTop',
+ 'right',
+ 'rightBottom',
+ 'bottomLeft',
+ 'bottom',
+ 'bottomRight',
+ 'leftTop',
+ 'left',
+ 'leftBottom',
+ ],
+ },
+ },
+ },
+} as Meta
+
+export const Default: Story