Repository: marigold-ui/marigold
Pull request #1973 (2022-04-08 08:07:32)

refa: re-structure system files

changeset-bot[bot]: ###  ⚠️  No Changeset found

Latest commit: be6501b497185713168357922e9f01b4785b5385

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. **If these changes should result in a version bump, you need to add a changeset.**

<details><summary>This PR includes no changesets</summary>

  When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

</details>

[Click here to learn what changesets are, and how to add one](https://github.com/changesets/changesets/blob/master/docs/adding-a-changeset.md).

[Click here if you're a maintainer who wants to add a changeset to this PR](https://github.com/marigold-ui/marigold/new/spring-cleaning-system?filename=.changeset/perfect-snails-wonder.md&value=---%0A%22%40marigold%2Fsystem%22%3A%20patch%0A---%0A%0Arefa%3A%20re-structure%20system%20files%0A)



Patch:
diff --git a/packages/system/src/Box.tsx b/packages/system/src/components/Box/Box.tsx
similarity index 95%
rename from packages/system/src/Box.tsx
rename to packages/system/src/components/Box/Box.tsx
index 660e11ad9..16d806abc 100644
--- a/packages/system/src/Box.tsx
+++ b/packages/system/src/components/Box/Box.tsx
@@ -6,9 +6,9 @@ import {
   PolymorphicComponentWithRef,
 } from '@marigold/types';
 
-import { getNormalizedStyles } from './normalize';
-import { CSSObject } from './types';
-import { ensureArrayVariant } from './variant';
+import { getNormalizedStyles } from '../../normalize';
+import { CSSObject } from '../../types/system';
+import { ensureArrayVariant } from '../../variant';
 
 export interface StyleProps
   extends Pick<
diff --git a/packages/system/src/components/Box/index.ts b/packages/system/src/components/Box/index.ts
new file mode 100644
index 000000000..305f81d78
--- /dev/null
+++ b/packages/system/src/components/Box/index.ts
@@ -0,0 +1,1 @@
+export * from './Box';
diff --git a/packages/system/src/Global.tsx b/packages/system/src/components/Global/Global.tsx
similarity index 96%
rename from packages/system/src/Global.tsx
rename to packages/system/src/components/Global/Global.tsx
index fb0eb7846..07cb500e1 100644
--- a/packages/system/src/Global.tsx
+++ b/packages/system/src/components/Global/Global.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { Global as EmotionGlobal } from '@emotion/react';
-import { useTheme } from './useTheme';
+import { useTheme } from '../../hooks';
 
 /**
  * CSS snippet and idea from:
diff --git a/packages/system/src/components/Global/index.ts b/packages/system/src/components/Global/index.ts
new file mode 100644
index 000000000..ee4ad9480
--- /dev/null
+++ b/packages/system/src/components/Global/index.ts
@@ -0,0 +1,1 @@
+export * from './Global';
diff --git a/packages/system/src/SVG.tsx b/packages/system/src/components/SVG/SVG.tsx
similarity index 91%
rename from packages/system/src/SVG.tsx
rename to packages/system/src/components/SVG/SVG.tsx
index 75fe9e435..03dc08c12 100644
--- a/packages/system/src/SVG.tsx
+++ b/packages/system/src/components/SVG/SVG.tsx
@@ -1,8 +1,8 @@
 import { jsx } from '@emotion/react';
 import { ComponentProps } from '@marigold/types';
 
-import { getNormalizedStyles } from './normalize';
-import { useTheme } from './useTheme';
+import { getNormalizedStyles } from '../../normalize';
+import { useTheme } from '../../hooks';
 
 const normalizedStyles = getNormalizedStyles('svg');
 
diff --git a/packages/system/src/components/SVG/index.ts b/packages/system/src/components/SVG/index.ts
new file mode 100644
index 000000000..fa9f23a75
--- /dev/null
+++ b/packages/system/src/components/SVG/index.ts
@@ -0,0 +1,1 @@
+export * from './SVG';
diff --git a/packages/system/src/components/index.ts b/packages/system/src/components/index.ts
new file mode 100644
index 000000000..6cd799c93
--- /dev/null
+++ b/packages/system/src/components/index.ts
@@ -0,0 +1,3 @@
+export * from './Box';
+export * from './Global';
+export * from './SVG';
diff --git a/packages/system/src/hooks/index.ts b/packages/system/src/hooks/index.ts
new file mode 100644
index 000000000..6eef44161
--- /dev/null
+++ b/packages/system/src/hooks/index.ts
@@ -0,0 +1,3 @@
+export * from './useComponentStyles';
+export * from './useResponsiveValue';
+export * from './useTheme';
diff --git a/packages/system/src/useComponentStyles.ts b/packages/system/src/hooks/useComponentStyles.ts
similarity index 98%
rename from packages/system/src/useComponentStyles.ts
rename to packages/system/src/hooks/useComponentStyles.ts
index 3b1987b73..447c2f6ba 100644
--- a/packages/system/src/useComponentStyles.ts
+++ b/packages/system/src/hooks/useComponentStyles.ts
@@ -2,7 +2,7 @@ import merge from 'deepmerge';
 import { useRef } from 'react';
 import isEqual from 'react-fast-compare';
 
-import { CSSObject } from './types';
+import { CSSObject } from '../types';
 import { useTheme } from './useTheme';
 
 // Types
diff --git a/packages/system/src/useResponsiveValue.ssr.test.tsx b/packages/system/src/hooks/useResponsiveValue.ssr.test.tsx
similarity index 100%
rename from packages/system/src/useResponsiveValue.ssr.test.tsx
rename to packages/system/src/hooks/useResponsiveValue.ssr.test.tsx
diff --git a/packages/system/src/useResponsiveValue.test.tsx b/packages/system/src/hooks/useResponsiveValue.test.tsx
similarity index 100%
rename from packages/system/src/useResponsiveValue.test.tsx
rename to packages/system/src/hooks/useResponsiveValue.test.tsx
diff --git a/packages/system/src/useResponsiveValue.ts b/packages/system/src/hooks/useResponsiveValue.ts
similarity index 95%
rename from packages/system/src/useResponsiveValue.ts
rename to packages/system/src/hooks/useResponsiveValue.ts
index 6d77d9da6..3fd4583fb 100644
--- a/packages/system/src/useResponsiveValue.ts
+++ b/packages/system/src/hooks/useResponsiveValue.ts
@@ -21,7 +21,7 @@ export const useResponsiveValue = <T>(
   defaultIndex: number = 0
 ) => {
   const { theme } = useTheme();
-  const breakpoints = theme.breakpoints || emptyBreakpoints;
+  const breakpoints: string[] = theme.breakpoints || emptyBreakpoints;
 
   if (defaultIndex < 0 || defaultIndex >= breakpoints.length) {
     throw new RangeError(
diff --git a/packages/system/src/useTheme.test.tsx b/packages/system/src/hooks/useTheme.test.tsx
similarity index 100%
rename from packages/system/src/useTheme.test.tsx
rename to packages/system/src/hooks/useTheme.test.tsx
diff --git a/packages/system/src/useTheme.tsx b/packages/system/src/hooks/useTheme.tsx
similarity index 94%
rename from packages/system/src/useTheme.tsx
rename to packages/system/src/hooks/useTheme.tsx
index 8773f18bf..62d5e8777 100644
--- a/packages/system/src/useTheme.tsx
+++ b/packages/system/src/hooks/useTheme.tsx
@@ -10,8 +10,7 @@ import {
 } from '@theme-ui/css';
 import { ThemeProvider as EmotionProvider } from '@emotion/react';
 
-import { Theme } from './theme';
-import { StyleObject } from './types';
+import { StyleObject, Theme } from '../types';
 
 /**
  * @internal
diff --git a/packages/system/src/index.ts b/packages/system/src/index.ts
index 219629ffa..612314ba6 100644
--- a/packages/system/src/index.ts
+++ b/packages/system/src/index.ts
@@ -1,9 +1,6 @@
-export * from './Box';
-export * from './Global';
-export * from './normalize';
-export * from './SVG';
-export * from './theme';
+export * from './components';
+export * from './hooks';
 export * from './types';
-export * from './useResponsiveValue';
-export * from './useTheme';
+
+export * from './normalize';
 export * from './variant';
diff --git a/packages/system/src/types/index.ts b/packages/system/src/types/index.ts
new file mode 100644
index 000000000..2a88cbb54
--- /dev/null
+++ b/packages/system/src/types/index.ts
@@ -0,0 +1,2 @@
+export * from './system';
+export * from './theme';


Test patch:
diff --git a/packages/system/src/Box.test.tsx b/packages/system/src/components/Box/Box.test.tsx
similarity index 99%
rename from packages/system/src/Box.test.tsx
rename to packages/system/src/components/Box/Box.test.tsx
index 596f9cc0a..94790b9b1 100644
--- a/packages/system/src/Box.test.tsx
+++ b/packages/system/src/components/Box/Box.test.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
-import { ThemeProvider } from './useTheme';
+import { ThemeProvider } from '../../hooks';
 import { Box, StyleProps } from './Box';
-import { normalize } from './normalize';
+import { normalize } from '../../normalize';
 
 const theme = {
   colors: {
diff --git a/packages/system/src/Global.test.tsx b/packages/system/src/components/Global/Global.test.tsx
similarity index 97%
rename from packages/system/src/Global.test.tsx
rename to packages/system/src/components/Global/Global.test.tsx
index 59c416a6f..9e7db8eab 100644
--- a/packages/system/src/Global.test.tsx
+++ b/packages/system/src/components/Global/Global.test.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import { ThemeProvider } from './useTheme';
+import { ThemeProvider } from '../../hooks';
 
 import { Global } from './Global';
 
diff --git a/packages/system/src/SVG.stories.tsx b/packages/system/src/components/SVG/SVG.stories.tsx
similarity index 100%
rename from packages/system/src/SVG.stories.tsx
rename to packages/system/src/components/SVG/SVG.stories.tsx
diff --git a/packages/system/src/SVG.test.tsx b/packages/system/src/components/SVG/SVG.test.tsx
similarity index 98%
rename from packages/system/src/SVG.test.tsx
rename to packages/system/src/components/SVG/SVG.test.tsx
index a0a1376bf..96f32448e 100644
--- a/packages/system/src/SVG.test.tsx
+++ b/packages/system/src/components/SVG/SVG.test.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
 import { SVG } from './SVG';
-import { ThemeProvider } from './useTheme';
+import { ThemeProvider } from '../../hooks';
 
 const theme = {
   sizes: {
diff --git a/packages/system/src/useComponentStyles.test.tsx b/packages/system/src/hooks/useComponentStyles.test.tsx
similarity index 99%
rename from packages/system/src/useComponentStyles.test.tsx
rename to packages/system/src/hooks/useComponentStyles.test.tsx
index 29b056fdd..a7ea6f367 100644
--- a/packages/system/src/useComponentStyles.test.tsx
+++ b/packages/system/src/hooks/useComponentStyles.test.tsx
@@ -4,7 +4,7 @@ import { renderHook } from '@testing-library/react-hooks';
 import { ThemeProvider } from './useTheme';
 
 import { useComponentStyles } from './useComponentStyles';
-import { Box } from './Box';
+import { Box } from '../components';
 
 // Setup
 // ---------------