diff --git a/.babelrc.js b/.babelrc.js index ae078bb..0a1cd16 100644 --- a/.babelrc.js +++ b/.babelrc.js @@ -1,4 +1,3 @@ module.exports = { - presets: ['next/babel'], - plugins: [['styled-components', { ssr: true }]], + plugins: ['styled-components'], }; diff --git a/.gitignore b/.gitignore index aa9032d..c3e292c 100644 --- a/.gitignore +++ b/.gitignore @@ -6,3 +6,4 @@ storybook-static worker wrangler.toml .devdbs +dist diff --git a/package.json b/package.json index 9bb6c87..f8dc05d 100644 --- a/package.json +++ b/package.json @@ -24,111 +24,47 @@ "postinstall": "is-ci || husky install", "storybook": "start-storybook -p 6006", "storybook:build": "build-storybook", + "build": "run-p -c build:*", + "build:design-system": "yarn workspace @roleypoly/design-system run build", + "build:web": "yarn workspace @roleypoly/web run build", "test": "jest", "ui": "next dev -p 6601", "ui:build": "next build", "ui:prod": "cross-env next start -p ${PORT:-3000}", "worker": "node src/backend-emulator/main.js" }, - "dependencies": { - "chroma-js": "^2.1.0", - "isomorphic-unfetch": "^3.1.0", - "ksuid": "^2.0.0", - "lodash": "^4.17.20", - "next": "^10.0.5", - "nookies": "^2.5.0", - "react": "^17.0.1", - "react-custom-scrollbars": "^4.2.1", - "react-dom": "^17.0.1", - "react-icons": "^4.1.0", - "react-is": "^17.0.1", - "react-tooltip": "^4.2.15", - "styled-components": "^5.2.1", - "styled-normalize": "^8.0.7", - "swr": "^0.4.0" - }, "devDependencies": { - "@babel/core": "^7.12.10", - "@cloudflare/workers-types": "^2.1.0", - "@icons/material": "^0.4.1", - "@peculiar/webcrypto": "^1.1.4", - "@storybook/addon-actions": "^6.1.14", - "@storybook/addon-essentials": "^6.1.14", - "@storybook/addon-links": "^6.1.14", - "@storybook/addons": "^6.1.14", - "@storybook/react": "^6.1.14", - "@storybook/theming": "^6.1.14", - "@types/chroma-js": "^2.1.3", - "@types/enzyme": "^3.10.8", - "@types/enzyme-adapter-react-16": "^1.0.6", - "@types/express": "^4.17.11", - "@types/jest": "^26.0.20", - "@types/lodash": "^4.14.167", - "@types/minimist": "^1.2.1", - "@types/node": "^14.14.31", - "@types/react": "^17.0.0", - "@types/react-custom-scrollbars": "^4.0.7", - "@types/react-dom": "^17.0.0", - "@types/styled-components": "^5.1.7", - "@types/uuid": "^8.3.0", - "@typescript-eslint/eslint-plugin": "^4.13.0", - "@typescript-eslint/eslint-plugin-tslint": "^4.13.0", - "@typescript-eslint/parser": "^4.13.0", - "@wojtekmaj/enzyme-adapter-react-17": "^0.4.1", - "babel-jest": "^26.6.3", - "babel-loader": "^8.2.2", - "babel-plugin-styled-components": "^1.12.0", - "chokidar": "^3.5.1", - "dotenv": "^8.2.0", - "enzyme": "^3.11.0", - "enzyme-to-json": "^3.6.1", - "eslint": "^7.20.0", - "eslint-config-prettier": "^7.1.0", - "eslint-plugin-import": "^2.22.1", - "eslint-plugin-jsdoc": "^32.2.0", - "eslint-plugin-react": "^7.22.0", - "husky": "^5.0.6", - "is-ci": "^2.0.0", - "jest": "^26.6.3", - "jest-cli": "^26.6.3", - "jest-environment-enzyme": "^7.1.2", - "jest-enzyme": "^7.1.2", - "jest-react-hooks-shallow": "^1.4.2", - "jest-styled-components": "^7.0.3", - "level": "^6.0.1", - "lint-staged": "^10.5.3", - "minimist": "^1.2.5", - "node-fetch": "^2.6.1", + "husky": "^5.1.3", + "lint-staged": "^10.5.4", "npm-run-all": "^4.1.5", "prettier": "^2.2.1", "prettier-plugin-organize-imports": "^1.1.1", "prettier-plugin-pkg": "^0.8.0", "prettier-plugin-sh": "^0.6.0", - "stylelint": "^13.8.0", + "stylelint": "^13.12.0", "stylelint-config-prettier": "^8.0.2", - "stylelint-config-standard": "^20.0.0", + "stylelint-config-standard": "^21.0.0", "stylelint-config-styled-components": "^0.1.1", - "stylelint-prettier": "^1.1.2", - "ts-jest": "^26.4.4", - "ts-loader": "^8.0.14", - "tsconfig-paths-webpack-plugin": "^3.3.0", - "tslint": "^6.1.3", - "typescript": "^4.1.3", - "webpack": "^4.46.0" + "stylelint-prettier": "^1.2.0", + "is-ci": "^3.0.0", + "typescript": "^4.2.3" }, "lint-staged": { "*.{ts,tsx,js,jsx}": [ - "stylelint --fix", "prettier --write" ], "*.go": [ "go fmt" ], - "*.{json,Dockerfile,sh,md,gitignore,env,mdx,yml,html}": [ + "*.{json,Dockerfile,sh,md,env,mdx,yml,html}": [ "prettier --write" ], ".husky/pre-commit": [ "prettier --write" ] - } + }, + "private": true, + "workspaces": [ + "packages/*" + ] } diff --git a/packages/design-system/.storybook/main.js b/packages/design-system/.storybook/main.js new file mode 100644 index 0000000..9d2ffc3 --- /dev/null +++ b/packages/design-system/.storybook/main.js @@ -0,0 +1,8 @@ +const path = require('path'); +const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin'); +const { NormalModuleReplacementPlugin } = require('webpack'); + +module.exports = { + stories: ['../**/*.stories.mdx', '../**/*.stories.@(js|jsx|ts|tsx)'], + addons: ['@storybook/addon-links', '@storybook/addon-essentials'], +}; diff --git a/packages/design-system/.storybook/manager.js b/packages/design-system/.storybook/manager.js new file mode 100644 index 0000000..69a5b09 --- /dev/null +++ b/packages/design-system/.storybook/manager.js @@ -0,0 +1,6 @@ +import { addons } from '@storybook/addons'; +import { roleypolyTheme } from './theme'; + +addons.setConfig({ + theme: roleypolyTheme, +}); diff --git a/packages/design-system/.storybook/mocks/next_link.tsx b/packages/design-system/.storybook/mocks/next_link.tsx new file mode 100644 index 0000000..b921931 --- /dev/null +++ b/packages/design-system/.storybook/mocks/next_link.tsx @@ -0,0 +1,8 @@ +import * as React from 'react'; + +type Props = { + children: React.ReactNode; +}; +const Link = (props: Props) => <>{props.children}; + +export default Link; diff --git a/packages/design-system/.storybook/preview-head.html b/packages/design-system/.storybook/preview-head.html new file mode 100644 index 0000000..eacccaf --- /dev/null +++ b/packages/design-system/.storybook/preview-head.html @@ -0,0 +1,39 @@ + + diff --git a/packages/design-system/.storybook/preview.js b/packages/design-system/.storybook/preview.js new file mode 100644 index 0000000..d32ed34 --- /dev/null +++ b/packages/design-system/.storybook/preview.js @@ -0,0 +1,10 @@ +import { roleypolyTheme } from './theme'; +import { mdxComponents } from '../atoms/typography/mdx'; + +export const parameters = { + actions: { argTypesRegex: '^on[A-Z].*' }, + docs: { + theme: roleypolyTheme, + components: mdxComponents, + }, +}; diff --git a/packages/design-system/.storybook/theme.js b/packages/design-system/.storybook/theme.js new file mode 100644 index 0000000..4c73525 --- /dev/null +++ b/packages/design-system/.storybook/theme.js @@ -0,0 +1,34 @@ +import { create } from '@storybook/theming'; +import { palette } from '../atoms/colors'; + +export const roleypolyTheme = create({ + base: 'dark', + + colorPrimary: palette.green400, + colorSecondary: palette.taupe200, + + // UI + appBg: palette.taupe300, + appContentBg: palette.taupe200, + appBorderColor: palette.taupe100, + appBorderRadius: 0, + + // Typography + fontBase: 'system-ui, sans-serif', + fontCode: 'monospace', + + // Text colors + textColor: palette.grey600, + textInverseColor: palette.grey100, + + // Toolbar default and active colors + barTextColor: palette.taupe500, + barSelectedColor: palette.taupe600, + barBg: palette.taupe100, + + // Form colors + inputBg: 'rgba(0,0,0,0.24)', + inputBorder: palette.taupe100, + inputTextColor: palette.grey600, + inputBorderRadius: 0, +}); diff --git a/src/design-system/Intro.stories.mdx b/packages/design-system/Intro.stories.mdx similarity index 78% rename from src/design-system/Intro.stories.mdx rename to packages/design-system/Intro.stories.mdx index ffc9fae..079d8b3 100644 --- a/src/design-system/Intro.stories.mdx +++ b/packages/design-system/Intro.stories.mdx @@ -1,7 +1,7 @@ import { Meta } from '@storybook/addon-docs/blocks'; -import { Logotype } from 'roleypoly/design-system/atoms/branding'; -import { Space } from 'roleypoly/design-system/atoms/space'; -import { palette } from 'roleypoly/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'; diff --git a/src/design-system/README.md b/packages/design-system/README.md similarity index 100% rename from src/design-system/README.md rename to packages/design-system/README.md diff --git a/src/design-system/atoms/avatar/Avatar.stories.tsx b/packages/design-system/atoms/avatar/Avatar.stories.tsx similarity index 100% rename from src/design-system/atoms/avatar/Avatar.stories.tsx rename to packages/design-system/atoms/avatar/Avatar.stories.tsx diff --git a/src/design-system/atoms/avatar/Avatar.styled.ts b/packages/design-system/atoms/avatar/Avatar.styled.ts similarity index 95% rename from src/design-system/atoms/avatar/Avatar.styled.ts rename to packages/design-system/atoms/avatar/Avatar.styled.ts index 5be8979..2f829e0 100644 --- a/src/design-system/atoms/avatar/Avatar.styled.ts +++ b/packages/design-system/atoms/avatar/Avatar.styled.ts @@ -1,4 +1,4 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; +import { palette } from '@roleypoly/design-system/atoms/colors'; import styled, { css } from 'styled-components'; import { AvatarProps } from './Avatar'; diff --git a/src/design-system/atoms/avatar/Avatar.tsx b/packages/design-system/atoms/avatar/Avatar.tsx similarity index 100% rename from src/design-system/atoms/avatar/Avatar.tsx rename to packages/design-system/atoms/avatar/Avatar.tsx diff --git a/src/design-system/atoms/avatar/avatarUtils.tsx b/packages/design-system/atoms/avatar/avatarUtils.tsx similarity index 100% rename from src/design-system/atoms/avatar/avatarUtils.tsx rename to packages/design-system/atoms/avatar/avatarUtils.tsx diff --git a/src/design-system/atoms/avatar/index.ts b/packages/design-system/atoms/avatar/index.ts similarity index 100% rename from src/design-system/atoms/avatar/index.ts rename to packages/design-system/atoms/avatar/index.ts diff --git a/src/design-system/atoms/branding/Branding.stories.tsx b/packages/design-system/atoms/branding/Branding.stories.tsx similarity index 100% rename from src/design-system/atoms/branding/Branding.stories.tsx rename to packages/design-system/atoms/branding/Branding.stories.tsx diff --git a/src/design-system/atoms/branding/Branding.tsx b/packages/design-system/atoms/branding/Branding.tsx similarity index 99% rename from src/design-system/atoms/branding/Branding.tsx rename to packages/design-system/atoms/branding/Branding.tsx index 267cc2a..c0db26e 100644 --- a/src/design-system/atoms/branding/Branding.tsx +++ b/packages/design-system/atoms/branding/Branding.tsx @@ -1,5 +1,5 @@ +import { palette } from '@roleypoly/design-system/atoms/colors'; import * as React from 'react'; -import { palette } from 'roleypoly/design-system/atoms/colors'; export type LogoProps = { fill: string; diff --git a/src/design-system/atoms/branding/BrandingOld.tsx b/packages/design-system/atoms/branding/BrandingOld.tsx similarity index 100% rename from src/design-system/atoms/branding/BrandingOld.tsx rename to packages/design-system/atoms/branding/BrandingOld.tsx diff --git a/src/design-system/atoms/branding/DynamicBranding.stories.tsx b/packages/design-system/atoms/branding/DynamicBranding.stories.tsx similarity index 96% rename from src/design-system/atoms/branding/DynamicBranding.stories.tsx rename to packages/design-system/atoms/branding/DynamicBranding.stories.tsx index 3222899..26a7193 100644 --- a/src/design-system/atoms/branding/DynamicBranding.stories.tsx +++ b/packages/design-system/atoms/branding/DynamicBranding.stories.tsx @@ -1,6 +1,6 @@ +import { Text } from '@roleypoly/design-system/atoms/typography'; import * as React from 'react'; import ReactTooltip from 'react-tooltip'; -import { Text } from 'roleypoly/design-system/atoms/typography'; import styled from 'styled-components'; import { palette } from '../colors'; import { Logomark, Logotype } from './Branding'; diff --git a/src/design-system/atoms/branding/DynamicBranding.tsx b/packages/design-system/atoms/branding/DynamicBranding.tsx similarity index 100% rename from src/design-system/atoms/branding/DynamicBranding.tsx rename to packages/design-system/atoms/branding/DynamicBranding.tsx diff --git a/src/design-system/atoms/branding/FlagBranding.stories.tsx b/packages/design-system/atoms/branding/FlagBranding.stories.tsx similarity index 100% rename from src/design-system/atoms/branding/FlagBranding.stories.tsx rename to packages/design-system/atoms/branding/FlagBranding.stories.tsx diff --git a/src/design-system/atoms/branding/FlagBranding.tsx b/packages/design-system/atoms/branding/FlagBranding.tsx similarity index 100% rename from src/design-system/atoms/branding/FlagBranding.tsx rename to packages/design-system/atoms/branding/FlagBranding.tsx diff --git a/src/design-system/atoms/branding/index.ts b/packages/design-system/atoms/branding/index.ts similarity index 100% rename from src/design-system/atoms/branding/index.ts rename to packages/design-system/atoms/branding/index.ts diff --git a/src/design-system/atoms/breakpoints/BreakpointProvider.tsx b/packages/design-system/atoms/breakpoints/BreakpointProvider.tsx similarity index 100% rename from src/design-system/atoms/breakpoints/BreakpointProvider.tsx rename to packages/design-system/atoms/breakpoints/BreakpointProvider.tsx diff --git a/src/design-system/atoms/breakpoints/Breakpoints.stories.tsx b/packages/design-system/atoms/breakpoints/Breakpoints.stories.tsx similarity index 100% rename from src/design-system/atoms/breakpoints/Breakpoints.stories.tsx rename to packages/design-system/atoms/breakpoints/Breakpoints.stories.tsx diff --git a/src/design-system/atoms/breakpoints/Breakpoints.ts b/packages/design-system/atoms/breakpoints/Breakpoints.ts similarity index 100% rename from src/design-system/atoms/breakpoints/Breakpoints.ts rename to packages/design-system/atoms/breakpoints/Breakpoints.ts diff --git a/src/design-system/atoms/breakpoints/Context.ts b/packages/design-system/atoms/breakpoints/Context.ts similarity index 89% rename from src/design-system/atoms/breakpoints/Context.ts rename to packages/design-system/atoms/breakpoints/Context.ts index 0b6054d..7c04d88 100644 --- a/src/design-system/atoms/breakpoints/Context.ts +++ b/packages/design-system/atoms/breakpoints/Context.ts @@ -1,5 +1,5 @@ import * as React from 'react'; -import { withContext } from 'roleypoly/common/utils/withContext'; +import { withContext } from '../../../../src/common/utils/withContext'; export type ScreenSize = { onSmallScreen: boolean; diff --git a/src/design-system/atoms/breakpoints/DebugTool.tsx b/packages/design-system/atoms/breakpoints/DebugTool.tsx similarity index 100% rename from src/design-system/atoms/breakpoints/DebugTool.tsx rename to packages/design-system/atoms/breakpoints/DebugTool.tsx diff --git a/src/design-system/atoms/breakpoints/index.ts b/packages/design-system/atoms/breakpoints/index.ts similarity index 100% rename from src/design-system/atoms/breakpoints/index.ts rename to packages/design-system/atoms/breakpoints/index.ts diff --git a/src/design-system/atoms/button/Button.spec.tsx b/packages/design-system/atoms/button/Button.spec.tsx similarity index 100% rename from src/design-system/atoms/button/Button.spec.tsx rename to packages/design-system/atoms/button/Button.spec.tsx diff --git a/src/design-system/atoms/button/Button.stories.tsx b/packages/design-system/atoms/button/Button.stories.tsx similarity index 100% rename from src/design-system/atoms/button/Button.stories.tsx rename to packages/design-system/atoms/button/Button.stories.tsx diff --git a/src/design-system/atoms/button/Button.styled.ts b/packages/design-system/atoms/button/Button.styled.ts similarity index 91% rename from src/design-system/atoms/button/Button.styled.ts rename to packages/design-system/atoms/button/Button.styled.ts index d0e7b1c..0b73250 100644 --- a/src/design-system/atoms/button/Button.styled.ts +++ b/packages/design-system/atoms/button/Button.styled.ts @@ -1,6 +1,6 @@ -import { palette } from 'roleypoly/design-system/atoms/colors'; -import { fontCSS } from 'roleypoly/design-system/atoms/fonts'; -import { text300, text400 } from 'roleypoly/design-system/atoms/typography'; +import { palette } from '@roleypoly/design-system/atoms/colors'; +import { fontCSS } from '@roleypoly/design-system/atoms/fonts'; +import { text300, text400 } from '@roleypoly/design-system/atoms/typography'; import styled, { css } from 'styled-components'; export const IconContainer = styled.div` diff --git a/src/design-system/atoms/button/Button.tsx b/packages/design-system/atoms/button/Button.tsx similarity index 100% rename from src/design-system/atoms/button/Button.tsx rename to packages/design-system/atoms/button/Button.tsx diff --git a/src/design-system/atoms/button/index.ts b/packages/design-system/atoms/button/index.ts similarity index 100% rename from src/design-system/atoms/button/index.ts rename to packages/design-system/atoms/button/index.ts diff --git a/src/design-system/atoms/collapse/Collapse.stories.tsx b/packages/design-system/atoms/collapse/Collapse.stories.tsx similarity index 77% rename from src/design-system/atoms/collapse/Collapse.stories.tsx rename to packages/design-system/atoms/collapse/Collapse.stories.tsx index d99f469..70611b0 100644 --- a/src/design-system/atoms/collapse/Collapse.stories.tsx +++ b/packages/design-system/atoms/collapse/Collapse.stories.tsx @@ -1,4 +1,4 @@ -import { SmallTitle } from 'roleypoly/design-system/atoms/typography'; +import { SmallTitle } from '@roleypoly/design-system/atoms/typography'; import { Collapse } from './Collapse'; export default { diff --git a/src/design-system/atoms/collapse/Collapse.tsx b/packages/design-system/atoms/collapse/Collapse.tsx similarity index 100% rename from src/design-system/atoms/collapse/Collapse.tsx rename to packages/design-system/atoms/collapse/Collapse.tsx diff --git a/src/design-system/atoms/collapse/index.ts b/packages/design-system/atoms/collapse/index.ts similarity index 100% rename from src/design-system/atoms/collapse/index.ts rename to packages/design-system/atoms/collapse/index.ts diff --git a/src/design-system/atoms/colors/colors.stories.tsx b/packages/design-system/atoms/colors/colors.stories.tsx similarity index 98% rename from src/design-system/atoms/colors/colors.stories.tsx rename to packages/design-system/atoms/colors/colors.stories.tsx index 49a21af..3dd591f 100644 --- a/src/design-system/atoms/colors/colors.stories.tsx +++ b/packages/design-system/atoms/colors/colors.stories.tsx @@ -1,6 +1,6 @@ +import { AmbientSmall } from '@roleypoly/design-system/atoms/typography'; import chroma from 'chroma-js'; import * as React from 'react'; -import { AmbientSmall } from 'roleypoly/design-system/atoms/typography'; import styled from 'styled-components'; import { palette } from './colors'; diff --git a/src/design-system/atoms/colors/colors.tsx b/packages/design-system/atoms/colors/colors.tsx similarity index 100% rename from src/design-system/atoms/colors/colors.tsx rename to packages/design-system/atoms/colors/colors.tsx diff --git a/src/design-system/atoms/colors/index.ts b/packages/design-system/atoms/colors/index.ts similarity index 100% rename from src/design-system/atoms/colors/index.ts rename to packages/design-system/atoms/colors/index.ts diff --git a/src/design-system/atoms/colors/withColors.tsx b/packages/design-system/atoms/colors/withColors.tsx similarity index 100% rename from src/design-system/atoms/colors/withColors.tsx rename to packages/design-system/atoms/colors/withColors.tsx diff --git a/src/design-system/atoms/dot-overlay/DotOverlay.stories.tsx b/packages/design-system/atoms/dot-overlay/DotOverlay.stories.tsx similarity index 100% rename from src/design-system/atoms/dot-overlay/DotOverlay.stories.tsx rename to packages/design-system/atoms/dot-overlay/DotOverlay.stories.tsx diff --git a/src/design-system/atoms/dot-overlay/DotOverlay.tsx b/packages/design-system/atoms/dot-overlay/DotOverlay.tsx similarity index 100% rename from src/design-system/atoms/dot-overlay/DotOverlay.tsx rename to packages/design-system/atoms/dot-overlay/DotOverlay.tsx diff --git a/src/design-system/atoms/dot-overlay/index.ts b/packages/design-system/atoms/dot-overlay/index.ts similarity index 100% rename from src/design-system/atoms/dot-overlay/index.ts rename to packages/design-system/atoms/dot-overlay/index.ts diff --git a/src/design-system/atoms/fader/Fader.stories.tsx b/packages/design-system/atoms/fader/Fader.stories.tsx similarity index 90% rename from src/design-system/atoms/fader/Fader.stories.tsx rename to packages/design-system/atoms/fader/Fader.stories.tsx index c8a4021..b9bd46a 100644 --- a/src/design-system/atoms/fader/Fader.stories.tsx +++ b/packages/design-system/atoms/fader/Fader.stories.tsx @@ -1,6 +1,6 @@ +import { Button } from '@roleypoly/design-system/atoms/button'; import { action } from '@storybook/addon-actions'; import * as React from 'react'; -import { Button } from 'roleypoly/design-system/atoms/button'; import { FaderOpacity, FaderSlide } from './Fader'; export default { diff --git a/src/design-system/atoms/fader/Fader.tsx b/packages/design-system/atoms/fader/Fader.tsx similarity index 100% rename from src/design-system/atoms/fader/Fader.tsx rename to packages/design-system/atoms/fader/Fader.tsx diff --git a/src/design-system/atoms/fader/index.ts b/packages/design-system/atoms/fader/index.ts similarity index 100% rename from src/design-system/atoms/fader/index.ts rename to packages/design-system/atoms/fader/index.ts diff --git a/src/design-system/atoms/feature-gate/FeatureGate.stories.tsx b/packages/design-system/atoms/feature-gate/FeatureGate.stories.tsx similarity index 80% rename from src/design-system/atoms/feature-gate/FeatureGate.stories.tsx rename to packages/design-system/atoms/feature-gate/FeatureGate.stories.tsx index 9b5cd95..bb911bc 100644 --- a/src/design-system/atoms/feature-gate/FeatureGate.stories.tsx +++ b/packages/design-system/atoms/feature-gate/FeatureGate.stories.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { FeatureFlagDecorator } from 'roleypoly/common/utils/featureFlags/react/storyDecorator'; +import { FeatureFlagDecorator } from '../../../../src/common/utils/featureFlags/react/storyDecorator'; import { FeatureGate } from './FeatureGate'; export default { diff --git a/src/design-system/atoms/feature-gate/FeatureGate.tsx b/packages/design-system/atoms/feature-gate/FeatureGate.tsx similarity index 88% rename from src/design-system/atoms/feature-gate/FeatureGate.tsx rename to packages/design-system/atoms/feature-gate/FeatureGate.tsx index 5e53acb..84ae6e4 100644 --- a/src/design-system/atoms/feature-gate/FeatureGate.tsx +++ b/packages/design-system/atoms/feature-gate/FeatureGate.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { FeatureFlag, FeatureFlagsContext, -} from 'roleypoly/common/utils/featureFlags/react'; +} from '../../../../src/common/utils/featureFlags/react'; export type FeatureGateProps = { featureFlag: FeatureFlag; diff --git a/src/design-system/atoms/feature-gate/index.ts b/packages/design-system/atoms/feature-gate/index.ts similarity index 100% rename from src/design-system/atoms/feature-gate/index.ts rename to packages/design-system/atoms/feature-gate/index.ts diff --git a/src/design-system/atoms/fonts/fonts.stories.tsx b/packages/design-system/atoms/fonts/fonts.stories.tsx similarity index 96% rename from src/design-system/atoms/fonts/fonts.stories.tsx rename to packages/design-system/atoms/fonts/fonts.stories.tsx index 6e491ca..9cc092c 100644 --- a/src/design-system/atoms/fonts/fonts.stories.tsx +++ b/packages/design-system/atoms/fonts/fonts.stories.tsx @@ -1,5 +1,8 @@ +import { + MediumTitle, + Text as TextBlock, +} from '@roleypoly/design-system/atoms/typography'; import * as React from 'react'; -import { MediumTitle, Text as TextBlock } from 'roleypoly/design-system/atoms/typography'; import styled from 'styled-components'; import { UseFontStyled } from './fonts'; diff --git a/src/design-system/atoms/fonts/fonts.tsx b/packages/design-system/atoms/fonts/fonts.tsx similarity index 92% rename from src/design-system/atoms/fonts/fonts.tsx rename to packages/design-system/atoms/fonts/fonts.tsx index 18e7030..31966ed 100644 --- a/src/design-system/atoms/fonts/fonts.tsx +++ b/packages/design-system/atoms/fonts/fonts.tsx @@ -1,4 +1,3 @@ -import Head from 'next/head'; import * as React from 'react'; import styled, { css } from 'styled-components'; @@ -7,7 +6,7 @@ export const InjectTypekitFont = () => { (window as any).Typekit.load(); }, []); return ( - + <> { as="script" />