strip out bazel, grpc

src/design-system/Intro.stories.mdx

@@ -1,7 +1,7 @@
 import { Meta } from '@storybook/addon-docs/blocks';
-import { Logotype } from 'roleypoly/src/design-system/atoms/branding';
-import { Space } from 'roleypoly/src/design-system/atoms/space';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
+import { Logotype } from 'roleypoly/design-system/atoms/branding';
+import { Space } from 'roleypoly/design-system/atoms/space';
+import { palette } from 'roleypoly/design-system/atoms/colors';
 
 <Meta title="Roleypoly Design System" />
 

src/design-system/atoms/avatar/Avatar.styled.ts

@@ -1,7 +1,7 @@
 import { AvatarProps } from './Avatar';
 import styled, { css } from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
+
+import { palette } from 'roleypoly/design-system/atoms/colors';
 
 type ContainerProps = Pick<AvatarProps, 'size'> & Pick<AvatarProps, 'deliberatelyEmpty'>;
 export const Container = styled.div<ContainerProps>`

src/design-system/atoms/avatar/BUILD.bazel

@@ -1,10 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "avatar",
-    deps = [
-        "//src/design-system/atoms/colors",
-    ],
-)

src/design-system/atoms/branding/BUILD.bazel

@@ -1,10 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "branding",
-    deps = [
-        "//src/design-system/atoms/colors",
-    ],
-)

src/design-system/atoms/branding/Branding.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
+import { palette } from 'roleypoly/design-system/atoms/colors';
 
 type LogoProps = {
     fill: string;

src/design-system/atoms/breakpoints/BUILD.bazel

@@ -1,10 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "breakpoints",
-    deps = [
-        "//src/common/utils/withContext",
-    ],
-)

src/design-system/atoms/breakpoints/Context.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { withContext } from 'roleypoly/src/common/utils/withContext';
+import { withContext } from 'roleypoly/common/utils/withContext';
 
 export type ScreenSize = {
     onSmallScreen: boolean;

src/design-system/atoms/button/BUILD.bazel

@@ -1,17 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-load("//hack/bazel/js:jest.bzl", "jest_test")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "button",
-    deps = [
-        "//src/design-system/atoms/colors",
-        "//src/design-system/atoms/fonts",
-        "//src/design-system/atoms/typography",
-    ],
-)
-
-jest_test(
-    src = ":button",
-)

src/design-system/atoms/button/Button.styled.ts

@@ -1,8 +1,7 @@
 import styled, { css } from 'styled-components';
-import { text400, text300 } from 'roleypoly/src/design-system/atoms/typography';
-import { fontCSS } from 'roleypoly/src/design-system/atoms/fonts';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
+import { text400, text300 } from 'roleypoly/design-system/atoms/typography';
+import { fontCSS } from 'roleypoly/design-system/atoms/fonts';
+import { palette } from 'roleypoly/design-system/atoms/colors';
 
 export const IconContainer = styled.div`
     margin-right: 0.6rem;

src/design-system/atoms/colors/BUILD.bazel

@@ -1,11 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "colors",
-    deps = [
-        "chroma-js",
-        "@types/chroma-js",
-    ],
-)

src/design-system/atoms/colors/colors.stories.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { palette } from './colors';
 import styled from 'styled-components';
 import chroma from 'chroma-js';
-import { AmbientSmall } from 'roleypoly/src/design-system/atoms/typography';
+import { AmbientSmall } from 'roleypoly/design-system/atoms/typography';
 
 type RatioList = {
     color1: string[];

src/design-system/atoms/colors/colors.tsx

@@ -1,5 +1,5 @@
 import { css, createGlobalStyle } from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
+
 import chroma from 'chroma-js';
 
 export const palette = {

src/design-system/atoms/dot-overlay/BUILD.bazel

@@ -1,9 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "dot-overlay",
-    deps = [
-    ],
-)

src/design-system/atoms/dot-overlay/DotOverlay.tsx

@@ -1,6 +1,5 @@
 import styled from 'styled-components';
 import * as React from 'react';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
 
 const dotOverlayBase = styled.div`
     opacity: 0.6;

src/design-system/atoms/fader/BUILD.bazel

@@ -1,9 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "fader",
-    deps = [
-    ],
-)

src/design-system/atoms/fader/Fader.stories.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { FaderOpacity, FaderSlide } from './Fader';
-import { Button } from 'roleypoly/src/design-system/atoms/button';
+import { Button } from 'roleypoly/design-system/atoms/button';
 import { action } from '@storybook/addon-actions';
 
 export default {

src/design-system/atoms/fader/Fader.tsx

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import styled from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
 
 export type FaderProps = {
     isVisible: boolean;

src/design-system/atoms/fonts/BUILD.bazel

@@ -1,10 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "fonts",
-    deps = [
-        "next",
-    ],
-)

src/design-system/atoms/fonts/fonts.stories.tsx

@@ -1,10 +1,7 @@
 import * as React from 'react';
 import { UseFontStyled } from './fonts';
 import styled from 'styled-components';
-import {
-    MediumTitle,
-    Text as TextBlock,
-} from 'roleypoly/src/design-system/atoms/typography';
+import { MediumTitle, Text as TextBlock } from 'roleypoly/design-system/atoms/typography';
 
 const resetFont = (storyFn: () => React.ReactNode) => <FontReset>{storyFn()}</FontReset>;
 

src/design-system/atoms/fonts/fonts.tsx

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import Head from 'next/head';
 import styled, { css } from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
 
 export const InjectTypekitFont = () => {
     React.useEffect(() => {

src/design-system/atoms/halfsies/BUILD.bazel

@@ -1,10 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "halfsies",
-    deps = [
-        "//src/design-system/atoms/breakpoints",
-    ],
-)

src/design-system/atoms/halfsies/Halfsies.tsx

@@ -1,6 +1,5 @@
 import styled, { css } from 'styled-components';
-import { onTablet } from 'roleypoly/src/design-system/atoms/breakpoints';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
+import { onTablet } from 'roleypoly/design-system/atoms/breakpoints';
 
 export const HalfsiesContainer = styled.div`
     display: flex;

src/design-system/atoms/hero/BUILD.bazel

@@ -1,9 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "hero",
-    deps = [
-    ],
-)

src/design-system/atoms/hero/Hero.tsx

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import styled from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
 
 type HeroContainerProps = {
     topSpacing: number;

src/design-system/atoms/key-events/BUILD.bazel

@@ -1,9 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "key-events",
-    deps = [
-    ],
-)

src/design-system/atoms/popover/BUILD.bazel

@@ -1,14 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "popover",
-    deps = [
-        "react-icons",
-        "//src/design-system/atoms/breakpoints",
-        "//src/design-system/atoms/colors",
-        "//src/design-system/atoms/key-events",
-        "//src/design-system/atoms/timings",
-    ],
-)

src/design-system/atoms/popover/Popover.stories.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Button } from 'roleypoly/src/design-system/atoms/button';
+import { Button } from 'roleypoly/design-system/atoms/button';
 import { Popover as PopoverComponent } from './Popover';
 
 export default {

src/design-system/atoms/popover/Popover.styled.ts

@@ -1,8 +1,7 @@
-import { onSmallScreen, onTablet } from 'roleypoly/src/design-system/atoms/breakpoints';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
-import { transitions } from 'roleypoly/src/design-system/atoms/timings';
+import { onSmallScreen, onTablet } from 'roleypoly/design-system/atoms/breakpoints';
+import { palette } from 'roleypoly/design-system/atoms/colors';
+import { transitions } from 'roleypoly/design-system/atoms/timings';
 import styled, { css } from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
 
 type PopoverStyledProps = {
     active: boolean;

src/design-system/atoms/popover/Popover.tsx

@@ -6,7 +6,7 @@ import {
     PopoverHeadCloser,
     PopoverContent,
 } from './Popover.styled';
-import { globalOnKeyUp } from 'roleypoly/src/design-system/atoms/key-events';
+import { globalOnKeyUp } from 'roleypoly/design-system/atoms/key-events';
 import { IoMdClose } from 'react-icons/io';
 
 type PopoverProps = {

src/design-system/atoms/role/BUILD.bazel

@@ -1,24 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-load("//hack/bazel/js:jest.bzl", "jest_test")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "role",
-    deps = [
-        "chroma-js",
-        "react-icons",
-        "//src/design-system/atoms/colors",
-        "//src/design-system/atoms/timings",
-        "//src/design-system/shared-types",
-        "//src/rpc/shared",
-        "@types/chroma-js",
-    ],
-)
-
-jest_test(
-    src = ":role",
-    deps = [
-        "//src/design-system/shared-types",
-    ],
-)

src/design-system/atoms/role/Role.spec.tsx

@@ -1,5 +1,5 @@
 import { shallow } from 'enzyme';
-import { roleCategory } from 'roleypoly/src/design-system/shared-types/storyData';
+import { roleCategory } from 'roleypoly/common/types/storyData';
 import * as React from 'react';
 import { Role } from './Role';
 

src/design-system/atoms/role/Role.stories.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Role as RoleComponent } from './Role';
-import { roleCategory } from '../../shared-types/storyData';
-import { withColors } from 'roleypoly/src/design-system/atoms/colors/withColors';
+import { roleCategory } from 'roleypoly/common/types/storyData';
+import { withColors } from 'roleypoly/design-system/atoms/colors/withColors';
 import styled from 'styled-components';
 
 export default {

src/design-system/atoms/role/Role.styled.tsx

@@ -1,7 +1,6 @@
 import styled, { css } from 'styled-components';
-import { transitions } from 'roleypoly/src/design-system/atoms/timings';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
+import { transitions } from 'roleypoly/design-system/atoms/timings';
+import { palette } from 'roleypoly/design-system/atoms/colors';
 
 export type StyledProps = {
     selected: boolean;

src/design-system/atoms/role/Role.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import { Role as RPCRole, RoleSafety } from '../../shared-types';
+import { Role as RPCRole, RoleSafety } from 'roleypoly/common/types';
 import * as styled from './Role.styled';
 import { FaCheck, FaTimes } from 'react-icons/fa';
-import { numberToChroma } from 'roleypoly/src/design-system/atoms/colors';
+import { numberToChroma } from 'roleypoly/design-system/atoms/colors';
 import chroma from 'chroma-js';
 
 type Props = {

src/design-system/atoms/space/BUILD.bazel

@@ -1,9 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "space",
-    deps = [
-    ],
-)

src/design-system/atoms/space/Space.tsx

@@ -1,5 +1,4 @@
 import styled from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
 
 export const Space = styled.div`
     height: 15px;

src/design-system/atoms/sparkle/BUILD.bazel

@@ -1,10 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "sparkle",
-    deps = [
-        "//src/design-system/atoms/colors",
-    ],
-)

src/design-system/atoms/sparkle/Sparkle.stories.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { SparkleOverlay } from './Sparkle';
-import { Button } from 'roleypoly/src/design-system/atoms/button';
-import { Hero } from 'roleypoly/src/design-system/atoms/hero';
+import { Button } from 'roleypoly/design-system/atoms/button';
+import { Hero } from 'roleypoly/design-system/atoms/hero';
 
 export default {
     title: 'Atoms/Sparkle',

src/design-system/atoms/sparkle/Sparkle.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import styled from 'styled-components';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
+import { palette } from 'roleypoly/design-system/atoms/colors';
+
 import { SparklePatternAlpha, SparklePatternBeta } from './Shapes';
 
 type Props = {

src/design-system/atoms/tab-view/BUILD.bazel

@@ -1,17 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-load("//hack/bazel/js:jest.bzl", "jest_test")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "tab-view",
-    deps = [
-        "//src/design-system/atoms/breakpoints",
-        "//src/design-system/atoms/colors",
-        "//src/design-system/atoms/timings",
-    ],
-)
-
-jest_test(
-    src = ":tab-view",
-)

src/design-system/atoms/tab-view/TabView.styled.ts

@@ -1,8 +1,7 @@
 import styled, { css } from 'styled-components';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
-import { transitions } from 'roleypoly/src/design-system/atoms/timings';
-import { onTablet } from 'roleypoly/src/design-system/atoms/breakpoints';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
+import { palette } from 'roleypoly/design-system/atoms/colors';
+import { transitions } from 'roleypoly/design-system/atoms/timings';
+import { onTablet } from 'roleypoly/design-system/atoms/breakpoints';
 
 export const TabViewStyled = styled.div``;
 

src/design-system/atoms/text-input/BUILD.bazel

@@ -1,10 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "text-input",
-    deps = [
-        "//src/design-system/atoms/colors",
-    ],
-)

src/design-system/atoms/text-input/TextInput.stories.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { TextInput, TextInputWithIcon } from './TextInput';
-import { SmallTitle } from 'roleypoly/src/design-system/atoms/typography';
+import { SmallTitle } from 'roleypoly/design-system/atoms/typography';
 import { FiKey } from 'react-icons/fi';
 
 export default {

src/design-system/atoms/text-input/TextInput.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import styled from 'styled-components';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
+import { palette } from 'roleypoly/design-system/atoms/colors';
 
 const StyledTextInput = styled.input`
     appearance: none;

src/design-system/atoms/timings/BUILD.bazel

@@ -1,7 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "timings",
-)

src/design-system/atoms/typist/BUILD.bazel

@@ -1,14 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-load("//hack/bazel/js:jest.bzl", "jest_test")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "typist",
-    deps = [
-    ],
-)
-
-jest_test(
-    src = ":typist",
-)

src/design-system/atoms/typography/BUILD.bazel

@@ -1,11 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "typography",
-    deps = [
-        "//src/design-system/atoms/colors",
-        "//src/design-system/atoms/timings",
-    ],
-)

src/design-system/atoms/typography/mdx.tsx

@@ -1,5 +1,5 @@
 import styled from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
+
 import { Link, Text, text600, text700, text800, text900 } from './typography';
 
 export const mdxComponents = {

src/design-system/atoms/typography/typography.tsx

@@ -1,7 +1,6 @@
 import styled, { css } from 'styled-components';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
-import { transitions } from 'roleypoly/src/design-system/atoms/timings';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
+import { palette } from 'roleypoly/design-system/atoms/colors';
+import { transitions } from 'roleypoly/design-system/atoms/timings';
 
 const reset = css`
     margin: 0;

src/design-system/molecules/demo-discord/BUILD.bazel

@@ -1,12 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "demo-discord",
-    deps = [
-        "//src/design-system/atoms/colors",
-        "//src/design-system/atoms/typist",
-        "//src/design-system/shared-types",
-    ],
-)

src/design-system/molecules/demo-discord/DemoDiscord.styled.ts

@@ -1,6 +1,6 @@
 import styled, { keyframes } from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
+
+import { palette } from 'roleypoly/design-system/atoms/colors';
 
 export const Base = styled.div`
     background-color: ${palette.discord100};

src/design-system/molecules/demo-discord/DemoDiscord.tsx

@@ -8,8 +8,8 @@ import {
     Line,
     InputTextAlignment,
 } from './DemoDiscord.styled';
-import { demoData } from 'roleypoly/src/design-system/shared-types/demoData';
-import { Typist } from 'roleypoly/src/design-system/atoms/typist';
+import { demoData } from 'roleypoly/common/types/demoData';
+import { Typist } from 'roleypoly/design-system/atoms/typist';
 
 export const DemoDiscord = () => {
     const time = new Date();

src/design-system/molecules/demo-picker/BUILD.bazel

@@ -1,11 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "demo-picker",
-    deps = [
-        "//src/design-system/atoms/role",
-        "//src/design-system/shared-types",
-    ],
-)

src/design-system/molecules/demo-picker/DemoPicker.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import { Role } from 'roleypoly/src/design-system/atoms/role';
-import { Role as RPCRole } from 'roleypoly/src/design-system/shared-types';
+import { Role } from 'roleypoly/design-system/atoms/role';
+import { Role as RPCRole } from 'roleypoly/common/types';
 import styled from 'styled-components';
-import { demoData } from 'roleypoly/src/design-system/shared-types/demoData';
+import { demoData } from 'roleypoly/common/types/demoData';
 
 const Container = styled.div`
     display: flex;

src/design-system/molecules/error-banner/BUILD.bazel

@@ -1,12 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "error-banner",
-    deps = [
-        "//src/design-system/atoms/breakpoints",
-        "//src/design-system/atoms/colors",
-        "//src/design-system/atoms/typography",
-    ],
-)

src/design-system/molecules/error-banner/ErrorBanner.styled.ts

@@ -1,7 +1,6 @@
-import { onSmallScreen } from 'roleypoly/src/design-system/atoms/breakpoints';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
-import { text300, text500, text700 } from 'roleypoly/src/design-system/atoms/typography';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
+import { onSmallScreen } from 'roleypoly/design-system/atoms/breakpoints';
+import { palette } from 'roleypoly/design-system/atoms/colors';
+import { text300, text500, text700 } from 'roleypoly/design-system/atoms/typography';
 import styled, { css } from 'styled-components';
 
 export const ErrorWrapper = styled.div`

src/design-system/molecules/footer/BUILD.bazel

@@ -1,13 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "footer",
-    deps = [
-        "react-icons",
-        "//src/design-system/atoms/colors",
-        "//src/design-system/atoms/timings",
-        "//src/design-system/atoms/typography",
-    ],
-)

src/design-system/molecules/footer/Footer.styled.ts

@@ -1,7 +1,7 @@
 import styled from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
-import { transitions } from 'roleypoly/src/design-system/atoms/timings';
+
+import { palette } from 'roleypoly/design-system/atoms/colors';
+import { transitions } from 'roleypoly/design-system/atoms/timings';
 
 export const FooterWrapper = styled.div`
     display: flex;

src/design-system/molecules/footer/Footer.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { FooterWrapper, HoverColor } from './Footer.styled';
-import { AmbientLarge } from 'roleypoly/src/design-system/atoms/typography';
+import { AmbientLarge } from 'roleypoly/design-system/atoms/typography';
 import { FaHeart } from 'react-icons/fa';
 import { Flags } from './Flags';
 

src/design-system/molecules/guild-nav/BUILD.bazel

@@ -1,17 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "guild-nav",
-    deps = [
-        "next",
-        "react-icons",
-        "react-tooltip",
-        "//src/common/utils",
-        "//src/design-system/atoms/colors",
-        "//src/design-system/atoms/timings",
-        "//src/design-system/molecules/nav-slug",
-        "//src/design-system/shared-types",
-    ],
-)

src/design-system/molecules/guild-nav/GuildNav.stories.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { GuildNav } from './GuildNav';
-import { guildEnum } from 'roleypoly/src/design-system/shared-types/storyData';
-import { PopoverBase } from 'roleypoly/src/design-system/atoms/popover/Popover.styled';
+import { guildEnum } from 'roleypoly/common/types/storyData';
+import { PopoverBase } from 'roleypoly/design-system/atoms/popover/Popover.styled';
 
 export default {
     title: 'Molecules/Guild Nav',

src/design-system/molecules/guild-nav/GuildNav.styled.ts

@@ -1,7 +1,7 @@
 import styled from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
-import { transitions } from 'roleypoly/src/design-system/atoms/timings';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
+
+import { transitions } from 'roleypoly/design-system/atoms/timings';
+import { palette } from 'roleypoly/design-system/atoms/colors';
 
 export const GuildNavItem = styled.a`
     display: flex;

src/design-system/molecules/guild-nav/GuildNav.tsx

@@ -2,14 +2,10 @@ import Link from 'next/link';
 import * as React from 'react';
 import { GoStar, GoZap } from 'react-icons/go';
 import ReactTooltip from 'react-tooltip';
-import { hasPermission, permissions } from 'roleypoly/src/common/utils/hasPermission';
-import { sortBy } from 'roleypoly/src/common/utils/sortBy';
-import {
-    GuildEnumeration,
-    PresentableGuild,
-    Role,
-} from 'roleypoly/src/design-system/shared-types';
-import { NavSlug } from 'roleypoly/src/design-system/molecules/nav-slug';
+import { hasPermission, permissions } from 'roleypoly/common/utils/hasPermission';
+import { sortBy } from 'roleypoly/common/utils/sortBy';
+import { GuildEnumeration, PresentableGuild, Role } from 'roleypoly/common/types';
+import { NavSlug } from 'roleypoly/design-system/molecules/nav-slug';
 import { GuildNavItem } from './GuildNav.styled';
 
 type Props = {

src/design-system/molecules/help-page-base/HelpPageBase.tsx

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import styled from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
+import { palette } from 'roleypoly/design-system/atoms/colors';
 
 export type HelpPageProps = {
     children: React.ReactNode;

src/design-system/molecules/help-page-base/storyDecorator.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { HelpPageBase } from './HelpPageBase';
-import { Content } from 'roleypoly/src/design-system/organisms/app-shell/AppShell.styled';
+import { Content } from 'roleypoly/design-system/organisms/app-shell/AppShell.styled';
 
 export const HelpStoryWrapper = (storyFn: any): React.ReactNode => (
     <Content>

src/design-system/molecules/nav-slug/BUILD.bazel

@@ -1,12 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "nav-slug",
-    deps = [
-        "react-icons",
-        "//src/design-system/atoms/avatar",
-        "//src/design-system/shared-types",
-    ],
-)

src/design-system/molecules/nav-slug/NavSlug.stories.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { NavSlug } from './NavSlug';
-import { guild } from 'roleypoly/src/design-system/shared-types/storyData';
+import { guild } from 'roleypoly/common/types/storyData';
 
 export default {
     title: 'Molecules/Server Slug',

src/design-system/molecules/nav-slug/NavSlug.styled.ts

@@ -1,5 +1,4 @@
 import styled from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
 
 export const SlugContainer = styled.div`
     display: flex;

src/design-system/molecules/nav-slug/NavSlug.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { Guild } from 'roleypoly/src/design-system/shared-types';
-import { Avatar, utils } from 'roleypoly/src/design-system/atoms/avatar';
+import { Guild } from 'roleypoly/common/types';
+import { Avatar, utils } from 'roleypoly/design-system/atoms/avatar';
 import { SlugContainer, SlugName } from './NavSlug.styled';
 import { GoOrganization } from 'react-icons/go';
 

src/design-system/molecules/picker-category/BUILD.bazel

@@ -1,13 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "picker-category",
-    deps = [
-        "react-tooltip",
-        "//src/design-system/atoms/role",
-        "//src/design-system/atoms/typography",
-        "//src/design-system/shared-types",
-    ],
-)

src/design-system/molecules/picker-category/PickerCategory.stories.tsx

@@ -3,7 +3,7 @@ import {
     roleWikiData,
     roleCategory,
     mockCategory,
-} from 'roleypoly/src/design-system/shared-types/storyData';
+} from 'roleypoly/common/types/storyData';
 import { PickerCategory } from './PickerCategory';
 
 export default {

src/design-system/molecules/picker-category/PickerCategory.styled.tsx

@@ -1,5 +1,4 @@
 import styled from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
 
 export const Head = styled.div`
     margin: 7px 5px;

src/design-system/molecules/picker-category/PickerCategory.tsx

@@ -1,12 +1,12 @@
 import * as React from 'react';
 import ReactTooltip from 'react-tooltip';
-import { Role } from 'roleypoly/src/design-system/atoms/role';
-import { AmbientLarge, LargeText } from 'roleypoly/src/design-system/atoms/typography';
+import { Role } from 'roleypoly/design-system/atoms/role';
+import { AmbientLarge, LargeText } from 'roleypoly/design-system/atoms/typography';
 import {
     Category as RPCCategory,
     Role as RPCRole,
     RoleSafety,
-} from 'roleypoly/src/design-system/shared-types';
+} from 'roleypoly/common/types';
 import styled from 'styled-components';
 import { Head, HeadSub, HeadTitle } from './PickerCategory.styled';
 

src/design-system/molecules/preauth-greeting/BUILD.bazel

@@ -1,13 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "preauth-greeting",
-    deps = [
-        "//src/design-system/atoms/avatar",
-        "//src/design-system/atoms/space",
-        "//src/design-system/atoms/typography",
-        "//src/design-system/shared-types",
-    ],
-)

src/design-system/molecules/preauth-greeting/PreauthGreeting.stories.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { PreauthGreeting } from './PreauthGreeting';
-import { guild } from 'roleypoly/src/design-system/shared-types/storyData';
+import { guild } from 'roleypoly/common/types/storyData';
 
 export default {
     title: 'Molecules/Preauth/Greeting',

src/design-system/molecules/preauth-greeting/PreauthGreeting.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import { Avatar, utils as avatarUtils } from 'roleypoly/src/design-system/atoms/avatar';
-import { Guild } from 'roleypoly/src/design-system/shared-types';
-import { AccentTitle } from 'roleypoly/src/design-system/atoms/typography';
-import { Space } from 'roleypoly/src/design-system/atoms/space';
+import { Avatar, utils as avatarUtils } from 'roleypoly/design-system/atoms/avatar';
+import { Guild } from 'roleypoly/common/types';
+import { AccentTitle } from 'roleypoly/design-system/atoms/typography';
+import { Space } from 'roleypoly/design-system/atoms/space';
 import styled from 'styled-components';
 
 type GreetingProps = {

src/design-system/molecules/preauth-secret-code/BUILD.bazel

@@ -1,25 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-load("//hack/bazel/js:jest.bzl", "jest_test")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "preauth-secret-code",
-    deps = [
-        "react-icons",
-        "//src/design-system/atoms/button",
-        "//src/design-system/atoms/fader",
-        "//src/design-system/atoms/space",
-        "//src/design-system/atoms/text-input",
-        "//src/design-system/shared-types",
-    ],
-)
-
-jest_test(
-    src = ":preauth-secret-code",
-    deps = [
-        "//src/design-system/atoms/button",
-        "//src/design-system/atoms/fader",
-        "//src/design-system/atoms/text-input",
-    ],
-)

src/design-system/molecules/preauth-secret-code/PreauthSecretCode.spec.tsx

@@ -1,12 +1,12 @@
 jest.unmock('roleypoly/src/design-system/atoms/text-input');
 jest.unmock('./PreauthSecretCode');
 
-import { Button } from 'roleypoly/src/design-system/atoms/button';
-import { TextInputWithIcon } from 'roleypoly/src/design-system/atoms/text-input';
+import { Button } from 'roleypoly/design-system/atoms/button';
+import { TextInputWithIcon } from 'roleypoly/design-system/atoms/text-input';
 import { shallow } from 'enzyme';
 import * as React from 'react';
 import { PreauthSecretCode } from './PreauthSecretCode';
-import { FaderOpacity } from 'roleypoly/src/design-system/atoms/fader';
+import { FaderOpacity } from 'roleypoly/design-system/atoms/fader';
 
 const value = 'unfathomable fishy sticks';
 const onSubmit = jest.fn();

src/design-system/molecules/preauth-secret-code/PreauthSecretCode.tsx

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { TextInputWithIcon } from 'roleypoly/src/design-system/atoms/text-input';
+import { TextInputWithIcon } from 'roleypoly/design-system/atoms/text-input';
 import { FiKey } from 'react-icons/fi';
-import { FaderOpacity } from 'roleypoly/src/design-system/atoms/fader';
-import { Button } from 'roleypoly/src/design-system/atoms/button';
-import { Space } from 'roleypoly/src/design-system/atoms/space';
+import { FaderOpacity } from 'roleypoly/design-system/atoms/fader';
+import { Button } from 'roleypoly/design-system/atoms/button';
+import { Space } from 'roleypoly/design-system/atoms/space';
 
 type PreauthProps = {
     onSubmit: (code: string) => void;

src/design-system/molecules/reset-submit/BUILD.bazel

@@ -1,20 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-load("//hack/bazel/js:jest.bzl", "jest_test")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "reset-submit",
-    deps = [
-        "react-icons",
-        "//src/design-system/atoms/breakpoints",
-        "//src/design-system/atoms/button",
-    ],
-)
-
-jest_test(
-    src = ":reset-submit",
-    deps = [
-        "//src/design-system/atoms/button",
-    ],
-)

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

@@ -1,4 +1,4 @@
-import { Button } from 'roleypoly/src/design-system/atoms/button';
+import { Button } from 'roleypoly/design-system/atoms/button';
 import { shallow } from 'enzyme';
 import * as React from 'react';
 import { ResetSubmit } from './ResetSubmit';

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

@@ -1,6 +1,6 @@
 import styled from 'styled-components';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
-import { onSmallScreen } from 'roleypoly/src/design-system/atoms/breakpoints';
+
+import { onSmallScreen } from 'roleypoly/design-system/atoms/breakpoints';
 
 export const Buttons = styled.div`
     display: flex;

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

@@ -1,5 +1,5 @@
-import { onSmallScreen } from 'roleypoly/src/design-system/atoms/breakpoints';
-import { Button } from 'roleypoly/src/design-system/atoms/button';
+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';

src/design-system/molecules/server-masthead/BUILD.bazel

@@ -1,24 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-load("//hack/bazel/js:jest.bzl", "jest_test")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "server-masthead",
-    deps = [
-        "next",
-        "react-icons",
-        "//src/design-system/atoms/avatar",
-        "//src/design-system/atoms/colors",
-        "//src/design-system/atoms/timings",
-        "//src/design-system/atoms/typography",
-        "//src/design-system/shared-types",
-    ],
-)
-
-jest_test(
-    src = ":server-masthead",
-    deps = [
-        "//src/design-system/shared-types",
-    ],
-)

src/design-system/molecules/server-masthead/ServerMasthead.spec.tsx

@@ -3,7 +3,7 @@ jest.unmock('./ServerMasthead');
 import * as React from 'react';
 import { shallow } from 'enzyme';
 import { ServerMasthead } from './ServerMasthead';
-import { guild } from 'roleypoly/src/design-system/shared-types/storyData';
+import { guild } from 'roleypoly/common/types/storyData';
 import { Editable } from './ServerMasthead.styled';
 
 it('shows Edit Server when editable is true', () => {

src/design-system/molecules/server-masthead/ServerMasthead.stories.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { ServerMasthead } from './ServerMasthead';
-import { guild } from 'roleypoly/src/design-system/shared-types/storyData';
+import { guild } from 'roleypoly/common/types/storyData';
 
 export default {
     title: 'Molecules/Server Masthead',

src/design-system/molecules/server-masthead/ServerMasthead.styled.ts

@@ -1,7 +1,6 @@
 import styled from 'styled-components';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
-import { transitions } from 'roleypoly/src/design-system/atoms/timings';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
+import { palette } from 'roleypoly/design-system/atoms/colors';
+import { transitions } from 'roleypoly/design-system/atoms/timings';
 
 export const Wrapper = styled.div`
     display: flex;

src/design-system/molecules/server-masthead/ServerMasthead.tsx

@@ -1,8 +1,8 @@
-import { Guild } from 'roleypoly/src/design-system/shared-types';
-import { Avatar, utils } from 'roleypoly/src/design-system/atoms/avatar';
-import { AccentTitle, AmbientLarge } from 'roleypoly/src/design-system/atoms/typography';
+import { Guild } from 'roleypoly/common/types';
+import { Avatar, utils } from 'roleypoly/design-system/atoms/avatar';
+import { AccentTitle, AmbientLarge } from 'roleypoly/design-system/atoms/typography';
 import Link from 'next/link';
-import { guild } from 'roleypoly/src/design-system/shared-types/storyData';
+import { guild } from 'roleypoly/common/types/storyData';
 import * as React from 'react';
 import { GoPencil } from 'react-icons/go';
 import { Editable, Icon, Name, Wrapper } from './ServerMasthead.styled';

src/design-system/molecules/user-avatar-group/BUILD.bazel

@@ -1,13 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "user-avatar-group",
-    deps = [
-        "//src/design-system/atoms/avatar",
-        "//src/design-system/atoms/breakpoints",
-        "//src/design-system/atoms/colors",
-        "//src/design-system/shared-types",
-    ],
-)

src/design-system/molecules/user-avatar-group/UserAvatarGroup.stories.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { UserAvatarGroup } from './UserAvatarGroup';
-import { user } from 'roleypoly/src/design-system/shared-types/storyData';
-import { Hero } from 'roleypoly/src/design-system/atoms/hero';
+import { user } from 'roleypoly/common/types/storyData';
+import { Hero } from 'roleypoly/design-system/atoms/hero';
 
 export default {
     title: 'Molecules/User Avatar Group',

src/design-system/molecules/user-avatar-group/UserAvatarGroup.styled.ts

@@ -1,7 +1,6 @@
 import styled, { css } from 'styled-components';
-import { onSmallScreen } from 'roleypoly/src/design-system/atoms/breakpoints';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
+import { onSmallScreen } from 'roleypoly/design-system/atoms/breakpoints';
+import { palette } from 'roleypoly/design-system/atoms/colors';
 
 export const Collapse = styled.div<{ preventCollapse: boolean }>`
     ${(props) =>

src/design-system/molecules/user-avatar-group/UserAvatarGroup.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { DiscordUser } from 'roleypoly/src/design-system/shared-types';
-import { utils, Avatar } from 'roleypoly/src/design-system/atoms/avatar';
+import { DiscordUser } from 'roleypoly/common/types';
+import { utils, Avatar } from 'roleypoly/design-system/atoms/avatar';
 import { Group, Collapse, Discriminator, GroupText } from './UserAvatarGroup.styled';
 
 type Props = {

src/design-system/molecules/user-popover/BUILD.bazel

@@ -1,16 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "user-popover",
-    deps = [
-        "next",
-        "react-icons",
-        "//src/design-system/atoms/breakpoints",
-        "//src/design-system/atoms/colors",
-        "//src/design-system/atoms/timings",
-        "//src/design-system/molecules/user-avatar-group",
-        "//src/design-system/shared-types",
-    ],
-)

src/design-system/molecules/user-popover/UserPopover.stories.tsx

@@ -1,7 +1,7 @@
-import { user } from 'roleypoly/src/design-system/shared-types/storyData';
+import { user } from 'roleypoly/common/types/storyData';
 import * as React from 'react';
 import { UserPopover as UserPopoverComponent } from './UserPopover';
-import { PopoverBase } from 'roleypoly/src/design-system/atoms/popover/Popover.styled';
+import { PopoverBase } from 'roleypoly/design-system/atoms/popover/Popover.styled';
 
 export default {
     title: 'Molecules/User Popover',

src/design-system/molecules/user-popover/UserPopover.styled.ts

@@ -1,7 +1,6 @@
 import styled from 'styled-components';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
-import { transitions } from 'roleypoly/src/design-system/atoms/timings';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
+import { palette } from 'roleypoly/design-system/atoms/colors';
+import { transitions } from 'roleypoly/design-system/atoms/timings';
 
 export const Base = styled.div`
     text-align: right;

src/design-system/molecules/user-popover/UserPopover.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { DiscordUser } from 'roleypoly/src/design-system/shared-types';
-import { UserAvatarGroup } from 'roleypoly/src/design-system/molecules/user-avatar-group';
+import { DiscordUser } from 'roleypoly/common/types';
+import { UserAvatarGroup } from 'roleypoly/design-system/molecules/user-avatar-group';
 import { Base, NavAction } from './UserPopover.styled';
 import { GoGear, GoSignOut } from 'react-icons/go';
 import Link from 'next/link';

src/design-system/organisms/app-shell/AppShell.stories.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { AppShell } from './AppShell';
-import { rpUser, guildEnum } from 'roleypoly/src/design-system/shared-types/storyData';
+import { rpUser, guildEnum } from 'roleypoly/common/types/storyData';
 
 export default {
     title: 'Organisms/App Shell',

src/design-system/organisms/app-shell/AppShell.styled.tsx

@@ -1,6 +1,5 @@
 import styled, { createGlobalStyle } from 'styled-components';
-import { palette } from 'roleypoly/src/design-system/atoms/colors';
-import * as _ from 'styled-components'; // eslint-disable-line no-duplicate-imports
+import { palette } from 'roleypoly/design-system/atoms/colors';
 
 export const Content = styled.div<{ small?: boolean }>`
     margin: 0 auto;

src/design-system/organisms/app-shell/AppShell.tsx

@@ -1,12 +1,9 @@
 import * as React from 'react';
-import * as Masthead from 'roleypoly/src/design-system/organisms/masthead';
-import {
-    RoleypolyUser,
-    GuildEnumeration,
-} from 'roleypoly/src/design-system/shared-types';
-import { Footer } from 'roleypoly/src/design-system/molecules/footer';
+import * as Masthead from 'roleypoly/design-system/organisms/masthead';
+import { RoleypolyUser, GuildEnumeration } from 'roleypoly/common/types';
+import { Footer } from 'roleypoly/design-system/molecules/footer';
 import { Content, GlobalStyles } from './AppShell.styled';
-import { GlobalStyleColors } from 'roleypoly/src/design-system/atoms/colors';
+import { GlobalStyleColors } from 'roleypoly/design-system/atoms/colors';
 import { Scrollbars } from 'react-custom-scrollbars';
 
 type AppShellProps = {

src/design-system/organisms/app-shell/BUILD.bazel

@@ -1,15 +0,0 @@
-load("//hack/bazel/js:react.bzl", "react_library")
-
-package(default_visibility = ["//visibility:public"])
-
-react_library(
-    name = "app-shell",
-    deps = [
-        "react-custom-scrollbars",
-        "//src/design-system/atoms/colors",
-        "//src/design-system/molecules/footer",
-        "//src/design-system/organisms/masthead",
-        "//src/design-system/shared-types",
-        "@types/react-custom-scrollbars",
-    ],
-)