chore: restructure project into yarn workspaces, remove next

packages/design-system/molecules/reset-submit/ResetSubmit.spec.tsx

@@ -0,0 +1,23 @@
+import { Button } from '@roleypoly/design-system/atoms/button';
+import { shallow } from 'enzyme';
+import * as React from 'react';
+import { ResetSubmit } from './ResetSubmit';
+
+const onReset = jest.fn();
+const onSubmit = jest.fn();
+
+it('calls onReset when reset is clicked', () => {
+    const view = shallow(<ResetSubmit onSubmit={onSubmit} onReset={onReset} />);
+
+    view.find(Button).at(0).simulate('click');
+
+    expect(onReset).toBeCalled();
+});
+
+it('calls onSubmit when submit is clicked', () => {
+    const view = shallow(<ResetSubmit onSubmit={onSubmit} onReset={onReset} />);
+
+    view.find(Button).at(1).simulate('click');
+
+    expect(onSubmit).toBeCalled();
+});

packages/design-system/molecules/reset-submit/ResetSubmit.stories.tsx

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { ResetSubmit } from './ResetSubmit';
+
+export default {
+    title: 'Molecules',
+    component: ResetSubmit,
+};
+
+export const ResetAndSubmit = (args) => <ResetSubmit {...args} />;

packages/design-system/molecules/reset-submit/ResetSubmit.styled.ts

@@ -0,0 +1,19 @@
+import { onSmallScreen } from '@roleypoly/design-system/atoms/breakpoints';
+import styled from 'styled-components';
+
+export const Buttons = styled.div`
+    display: flex;
+    flex-wrap: wrap;
+`;
+
+export const Left = styled.div`
+    flex: 0;
+    ${onSmallScreen`
+    flex: 1 1 100%; 
+    order: 2;
+  `}
+`;
+
+export const Right = styled.div`
+    flex: 1;
+`;

packages/design-system/molecules/reset-submit/ResetSubmit.tsx

@@ -0,0 +1,42 @@
+import { onSmallScreen } from '@roleypoly/design-system/atoms/breakpoints';
+import { Button } from '@roleypoly/design-system/atoms/button';
+import * as React from 'react';
+import { MdRestore } from 'react-icons/md';
+import styled from 'styled-components';
+
+type Props = {
+    onSubmit: () => void;
+    onReset: () => void;
+};
+
+const Buttons = styled.div`
+    display: flex;
+    flex-wrap: wrap;
+`;
+
+const Left = styled.div`
+    flex: 0;
+    ${onSmallScreen`
+    flex: 1 1 100%; 
+    order: 2;
+  `}
+`;
+
+const Right = styled.div`
+    flex: 1;
+`;
+
+export const ResetSubmit = (props: Props) => {
+    return (
+        <Buttons>
+            <Left>
+                <Button color="muted" icon={<MdRestore />} onClick={props.onReset}>
+                    Reset
+                </Button>
+            </Left>
+            <Right>
+                <Button onClick={props.onSubmit}>Submit</Button>
+            </Right>
+        </Buttons>
+    );
+};

packages/design-system/molecules/reset-submit/index.ts

@@ -0,0 +1 @@
+export * from './ResetSubmit';