Merge branch 'master' of https://github.com/kazura233/react-monorepo-…

…project-template
kazura233 · Dec 9, 2023 · 45df548 · 45df548
2 parents a7ee9bd + 17dd2db
commit 45df548
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 6 deletions.
diff --git a/packages/project-mobile/src/components/aside/index.tsx b/packages/project-mobile/src/components/aside/index.tsx
@@ -9,11 +9,12 @@ const StyledAside = styled.aside`
 
 export interface IAsideProps {
   width?: string
+  style?: React.CSSProperties
 }
 
 export const Aside: React.FC<PropsWithChildren<IAsideProps>> = (props) => {
-  const { width = '300px', children } = props
-  return <StyledAside style={{ width }}>{children}</StyledAside>
+  const { width = '300px', children, style } = props
+  return <StyledAside style={{ width, ...style }}>{children}</StyledAside>
 }
 
 export default Aside
diff --git a/packages/project-mobile/src/components/container/index.tsx b/packages/project-mobile/src/components/container/index.tsx
@@ -16,11 +16,16 @@ const StyledContainer = styled.section`
 
 export interface IContainerProps {
   direction: direction
+  style?: React.CSSProperties
 }
 
 export const Container: React.FC<PropsWithChildren<IContainerProps>> = (props) => {
-  const { direction, children } = props
-  return <StyledContainer isColumn={direction === 'vertical'}>{children}</StyledContainer>
+  const { direction, children, style } = props
+  return (
+    <StyledContainer isColumn={direction === 'vertical'} style={style}>
+      {children}
+    </StyledContainer>
+  )
 }
 
 export default Container
diff --git a/packages/project-mobile/src/components/main/index.tsx b/packages/project-mobile/src/components/main/index.tsx
@@ -10,8 +10,13 @@ const StyledMain = styled.main`
   height: 100%;
 `
 
-export const Main: React.FC<PropsWithChildren<{}>> = (props) => {
-  return <StyledMain>{props.children}</StyledMain>
+export interface IMainProps {
+  style?: React.CSSProperties
+}
+
+export const Main: React.FC<PropsWithChildren<IMainProps>> = (props) => {
+  const { children, style } = props
+  return <StyledMain style={style}>{children}</StyledMain>
 }
 
 export default Main