make chungking-core standalone (#150)

.eslintignore

@@ -0,0 +1 @@
+dist/

.github/workflows/ci.yml

@@ -13,6 +13,7 @@ jobs:
     steps:
       - uses: actions/checkout@v2
       - run: yarn install --immutable
+      - run: yarn run compile
       - uses: actions/cache@v1
         id: cache-build
         with:

.gitignore

@@ -4,6 +4,7 @@
 
 # Build directory
 .next/
+dist/
 
 # Files generated by next-on-netlify command
 /out_publish/

.yarnrc.yml

@@ -3,5 +3,7 @@ nodeLinker: node-modules
 plugins:
   - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
     spec: "@yarnpkg/plugin-interactive-tools"
+  - path: .yarn/plugins/@yarnpkg/plugin-workspace-tools.cjs
+    spec: "@yarnpkg/plugin-workspace-tools"
 
 yarnPath: .yarn/releases/yarn-berry.cjs

components/layout/Container.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import { css } from '@emotion/core'
 import styled from '@emotion/styled'
-import { mediaQueries, widths } from '../chungking-core'
+import { mediaQueries, widths } from '@resir014/chungking-react'
 
 export type ContainerSizes = 'md' | 'lg' | 'xl' | 'fluid'
 

components/layout/Content.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { Box } from '../chungking-core'
+import { Box } from '@resir014/chungking-react'
 
 interface ContentProps {
   className?: string

components/layout/Footer.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import styled from '@emotion/styled'
 
-import { space, colors, mediaQueries, Stack, Box, Text } from '../chungking-core'
+import { space, colors, mediaQueries, Stack, Box, Text } from '@resir014/chungking-react'
 import Container from './Container'
 
 import CCLogo from '~/assets/images/cc-by-nc-sa.svg'

components/layout/Masthead/Masthead.tsx

@@ -2,7 +2,7 @@ import * as React from 'react'
 import styled from '@emotion/styled'
 import Link from 'next/link'
 
-import { mediaQueries, colors, widths, Text, breakpoints, space } from '~/components/chungking-core'
+import { mediaQueries, colors, widths, Text, breakpoints, space } from '@resir014/chungking-react'
 import { MenuProps } from '~/types/default'
 
 import MastheadNav from './MastheadNav'

components/layout/Masthead/MastheadNav.tsx

@@ -5,7 +5,7 @@ import { useRouter } from 'next/router'
 import { css } from '@emotion/core'
 import clsx from 'clsx'
 
-import { Text } from '~/components/chungking-core'
+import { Text } from '@resir014/chungking-react'
 import { MenuItem } from '~/types/default'
 import { MastheadLinkStyles } from './styled'
 

components/layout/Masthead/styled.ts

@@ -1,6 +1,6 @@
 import { css } from '@emotion/core'
 import { transparentize } from 'polished'
-import { space, colors, mediaQueries } from '../../chungking-core'
+import { space, colors, mediaQueries } from '@resir014/chungking-react'
 
 export const MastheadLinkStyles = css`
   display: block;

components/layout/Page.tsx

@@ -1,11 +1,11 @@
 import * as React from 'react'
 import Head from 'next/head'
 import { NextSeo } from 'next-seo'
+import { Box } from '@resir014/chungking-react'
 
 import menuItems from '~/_data/menuItems.json'
 import siteMetadata from '~/_data/siteMetadata.json'
 
-import { Box } from '../chungking-core'
 import { Masthead } from './Masthead'
 import Footer from './Footer'
 import { SiteMetadata } from '~/types/default'

components/ui/Divider.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import { css } from '@emotion/core'
 import styled from '@emotion/styled'
-import { colors, space } from '../chungking-core'
+import { colors, space } from '@resir014/chungking-react'
 
 interface DividerProps {
   className?: string

components/ui/HeaderDivider.tsx

@@ -1,5 +1,5 @@
 import styled from '@emotion/styled'
-import { colors, space } from '../chungking-core'
+import { colors, space } from '@resir014/chungking-react'
 
 const HeaderDivider = styled('hr')`
   width: 100%;

components/ui/LiveCTALink.tsx

@@ -1,7 +1,7 @@
 import Link from 'next/link'
 import * as React from 'react'
 
-import { Box, Text, UnstyledAnchor, Color } from '../chungking-core'
+import { Box, Text, UnstyledAnchor, Color } from '@resir014/chungking-react'
 
 interface LiveCTAProps {
   backgroundColor?: Color | string

lib/htmr-transform.tsx

@@ -1,10 +1,9 @@
 import * as React from 'react'
 import { css } from '@emotion/core'
-import Image from 'next/image'
 import Link from 'next/link'
 import { HtmrOptions } from 'htmr/src/types'
 
-import { Anchor, Box, BoxProps, ResponsiveIframe, MessageBox, ResponsiveWrapper } from '~/components/chungking-core'
+import { Anchor, Box, BoxProps, ResponsiveIframe, MessageBox, ResponsiveWrapper } from '@resir014/chungking-react'
 import { H1, H2, H3, H4, H5, H6, P, UL, OL, LI, Blockquote, InlineCode, CodeBlock, Figure } from '~/modules/markdown'
 
 const htmrTransform: HtmrOptions['transform'] = {
@@ -46,22 +45,7 @@ const htmrTransform: HtmrOptions['transform'] = {
     }
 
     if (src) {
-      if (src.substr(0, 4) === 'http') {
-        return <img loading="lazy" className={className} src={src} alt={alt?.toString()} crossOrigin={crossOrigin} {...rest} />
-      }
-
-      return (
-        <Image
-          loading="lazy"
-          className={className}
-          src={src}
-          alt={alt?.toString()}
-          crossOrigin={crossOrigin}
-          unoptimized
-          unsized
-          {...rest}
-        />
-      )
+      return <img loading="lazy" className={className} src={src} alt={alt?.toString()} crossOrigin={crossOrigin} {...rest} />
     }
 
     return null

modules/bookmarks/BookmarkList.tsx

@@ -1,6 +1,6 @@
 import { css } from '@emotion/core'
 import * as React from 'react'
-import { Stack, StackProps } from '~/components/chungking-core'
+import { Stack, StackProps } from '@resir014/chungking-react'
 import { BaseBookmarkProps } from '~/types/posts'
 import BookmarkListItem from './BookmarkListItem'
 

modules/bookmarks/BookmarkListItem.tsx

@@ -1,7 +1,7 @@
 import { css } from '@emotion/core'
 import { transparentize } from 'polished'
 import * as React from 'react'
-import { Anchor, Box, Text, BoxProps, colors, Heading } from '~/components/chungking-core'
+import { Anchor, Box, Text, BoxProps, colors, Heading } from '@resir014/chungking-react'
 import { BaseBookmarkProps } from '~/types/posts'
 
 interface BookmarkListItemProps extends BoxProps {

modules/design/ColorSpecs.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { colors } from '~/components/chungking-core'
+import { colors } from '@resir014/chungking-react'
 import { H2, H3 } from '../markdown'
 import ColorSwatch from './components/ColorSwatch'
 

modules/design/ComponentSpecs.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { Box, Badge, Button, MessageBox, Paragraph, Anchor, Inline } from '~/components/chungking-core'
+import { Box, Badge, Button, MessageBox, Paragraph, Anchor, Inline } from '@resir014/chungking-react'
 import { H2, H3, H4 } from '../markdown'
 import ComponentSpecimen from './components/ComponentSpecimen'
 

modules/design/TypographySpecs.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { Heading, Text, Anchor, Paragraph } from '~/components/chungking-core'
+import { Heading, Text, Anchor, Paragraph } from '@resir014/chungking-react'
 import { Blockquote, H2, H3, InlineCode, LI, OL, UL } from '../markdown'
 import ComponentSpecimen from './components/ComponentSpecimen'
 

modules/design/components/ColorSwatch.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import styled from '@emotion/styled'
-import { colors, shadows } from '~/components/chungking-core'
+import { colors, shadows } from '@resir014/chungking-react'
 
 interface ColorSwatchProps {
   color: string

modules/design/components/ComponentSpecimen.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { Stack, StackProps } from '~/components/chungking-core'
+import { Stack, StackProps } from '@resir014/chungking-react'
 
 interface ComponentSpecimenProps extends StackProps {
   className?: string

modules/design/components/TypographySpecimen.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import styled from '@emotion/styled'
 import { css } from '@emotion/core'
-import { fonts } from '../../../components/chungking-core'
+import { fonts } from '@resir014/chungking-react'
 
 interface ColorSwatchProps {
   weight?: number

modules/home/HomepageContent.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import styled from '@emotion/styled'
 
-import { space } from '../../components/chungking-core'
+import { space } from '@resir014/chungking-react'
 
 const StyledHomepageContent = styled('main')`
   display: block;

modules/home/HomepageSection.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { Box, BoxProps } from '~/components/chungking-core'
+import { Box, BoxProps } from '@resir014/chungking-react'
 
 interface HomepageSectionProps extends BoxProps {
   className?: string

modules/home/HomepageSectionDescription.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react'
 
-import { Paragraph } from '~/components/chungking-core'
+import { Paragraph } from '@resir014/chungking-react'
 
 interface HomepageSectionDescriptionProps {
   className?: string

modules/home/HomepageSectionFooter.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { Box } from '~/components/chungking-core'
+import { Box } from '@resir014/chungking-react'
 
 interface HomepageSectionProps {
   className?: string

modules/home/HomepageSectionHeader.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { Stack, StackProps, Text } from '~/components/chungking-core'
+import { Stack, StackProps, Text } from '@resir014/chungking-react'
 import HomepageSectionTitle from './HomepageSectionTitle'
 
 interface HomepageSectionHeaderProps extends StackProps {

modules/home/HomepageSectionTitle.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { Heading, HeadingProps } from '~/components/chungking-core'
+import { Heading, HeadingProps } from '@resir014/chungking-react'
 
 interface HomepageSectionTitleProps extends HeadingProps {
   className?: string

modules/linktree/LinktreeCard.tsx

@@ -1,6 +1,6 @@
 import { css } from '@emotion/core'
 import * as React from 'react'
-import { Anchor, Box, BoxProps, colors } from '~/components/chungking-core'
+import { Anchor, Box, BoxProps, colors } from '@resir014/chungking-react'
 import { LinktreeItem } from '~/types/default'
 
 interface LinktreeCardProps extends BoxProps {

modules/linktree/LinktreeList.tsx

@@ -1,6 +1,6 @@
 import { css } from '@emotion/core'
 import * as React from 'react'
-import { Stack, StackProps } from '~/components/chungking-core'
+import { Stack, StackProps } from '@resir014/chungking-react'
 
 type LinktreeListProps = StackProps
 

modules/live/LiveBanner.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react'
 
-import { Box } from '~/components/chungking-core'
+import { Box } from '@resir014/chungking-react'
 
 import LiveEmbeddablePlayer from './LiveEmbeddablePlayer'
 import LiveStreamStatus from './LiveStreamStatus'

modules/live/LiveBannerHero.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import { darken } from 'polished'
 
-import { colors, widths, Box } from '~/components/chungking-core'
+import { colors, widths, Box } from '@resir014/chungking-react'
 import BackgroundPattern from '~/assets/images/architect.svg'
 
 interface LiveBannerHeroProps {

modules/live/LiveEmbeddablePlayer.tsx

@@ -1,7 +1,7 @@
 import { css } from '@emotion/core'
 import { hsl, parseToHsl } from 'polished'
 import * as React from 'react'
-import { Box, colors, ResponsiveIframe, ResponsiveWrapper, Text } from '~/components/chungking-core'
+import { Box, colors, ResponsiveIframe, ResponsiveWrapper, Text } from '@resir014/chungking-react'
 import { useTwitchData } from '~/lib/twitch-api'
 
 interface LiveEmbeddablePlayerProps {

modules/live/LiveStreamStatus.tsx

@@ -1,6 +1,6 @@
 import { css } from '@emotion/core'
 import * as React from 'react'
-import { Anchor, Box, Heading, MessageBox, Paragraph, Skeleton, Text } from '~/components/chungking-core'
+import { Anchor, Box, Heading, MessageBox, Paragraph, Skeleton, Text } from '@resir014/chungking-react'
 import { useTwitchData } from '~/lib/twitch-api'
 
 interface LiveStreamStatusProps {

modules/markdown/BodyElements.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import { css } from '@emotion/core'
 
-import { Paragraph, ParagraphProps, Text, TextProps, Box, BoxProps, Stack, colors, space, shadows } from '~/components/chungking-core'
+import { Paragraph, ParagraphProps, Text, TextProps, Box, BoxProps, Stack, colors, space, shadows } from '@resir014/chungking-react'
 
 interface WithStylesProps {
   className?: string

modules/markdown/Headings.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { Heading } from '~/components/chungking-core'
+import { Heading } from '@resir014/chungking-react'
 
 export const H1: React.FC = ({ children }) => (
   <Heading as="h1" variant={900} mt={0} mb="md">

modules/notes/NoteListItem.tsx

@@ -4,7 +4,7 @@ import Link from 'next/link'
 import { css } from '@emotion/core'
 import convert from 'htmr'
 
-import { Stack, StackProps, Heading } from '~/components/chungking-core'
+import { Stack, StackProps, Heading } from '@resir014/chungking-react'
 import { BasePostProps } from '~/types/posts'
 import htmrTransform from '~/lib/htmr-transform'
 import PostMeta from '../posts/PostMeta'

modules/photos/FeaturedPhoto.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { StackProps } from '~/components/chungking-core'
+import { StackProps } from '@resir014/chungking-react'
 import { BasePhotoProps } from '~/types/posts'
 import PhotoListItem from './PhotoListItem'
 

modules/photos/PhotoListItem.tsx

@@ -2,7 +2,7 @@ import clsx from 'clsx'
 import Link from 'next/link'
 import * as React from 'react'
 import convert from 'htmr'
-import { Box, Stack, StackProps, UnstyledAnchor } from '~/components/chungking-core'
+import { Box, Stack, StackProps, UnstyledAnchor } from '@resir014/chungking-react'
 import { BasePhotoProps } from '~/types/posts'
 import htmrTransform from '~/lib/htmr-transform'
 import { PostMeta } from '../posts'

modules/photos/PhotoPostBody.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react'
 import convert from 'htmr'
+import { Box, Stack } from '@resir014/chungking-react'
 
 import htmrTransform from '~/lib/htmr-transform'
-import { Box, Stack } from '~/components/chungking-core'
 import { Container, ContainerSizes } from '~/components/layout'
 import PhotoWrapper from './PhotoWrapper'
 

modules/photos/PhotoWrapper.tsx

@@ -1,6 +1,5 @@
-import Image from 'next/image'
 import * as React from 'react'
-import { BoxProps } from '~/components/chungking-core'
+import { Box, BoxProps } from '@resir014/chungking-react'
 import { Figure } from '../markdown'
 
 interface PhotoWrapperProps extends BoxProps {
@@ -9,8 +8,8 @@ interface PhotoWrapperProps extends BoxProps {
 
 const PhotoWrapper: React.FC<PhotoWrapperProps> = ({ image, ...rest }) => {
   return (
-    <Figure my={0} overflow="hidden" {...rest}>
-      <Image className="u-photo" loading="lazy" src={image} alt="Photo Post" unsized unoptimized />
+    <Figure my={0} {...rest}>
+      <Box as="img" className="u-photo" loading="lazy" src={image} alt="Photo Post" />
     </Figure>
   )
 }

modules/posts/PostBody.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react'
 import convert from 'htmr'
+import { Anchor, Box, MessageBox, Paragraph, Space, Stack } from '@resir014/chungking-react'
 
 import htmrTransform from '~/lib/htmr-transform'
-import { Anchor, Box, MessageBox, Paragraph, Space, Stack } from '~/components/chungking-core'
 import { Container, ContainerSizes } from '~/components/layout'
 import { SyndicationFormat } from '~/types/default'
 import { LI, UL } from '../markdown'