fix: remove pseudo box page, add Box page to docs

cratebind · Dec 28, 2021 · 8017372 · 8017372
1 parent 470c615
commit 8017372
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 15 deletions.
diff --git a/docs/package.json b/docs/package.json
@@ -12,7 +12,7 @@
   "dependencies": {
     "global": "^4.4.0",
     "markdown-to-jsx": "^7.0.0",
-    "minerva-ui": "^7.1.7",
+    "minerva-ui": "^7.2.0",
     "next": "^10.0.0",
     "nextra": "^0.2.4",
     "nextra-theme-docs": "^0.1.5",

diff --git a/docs/pages/components/PseudoBox.mdx → docs/pages/components/Box.mdx b/docs/pages/components/PseudoBox.mdx → docs/pages/components/Box.mdx
@@ -1,13 +1,24 @@
----
-title: 'PseudoBox'
----
+# Box
 
-Renders a `<Box />` component with additional props for CSS pseudo selectors.
+The base component in Minerva UI, can be used to replace a `<div>` or any other element by using the `as` prop.
 
-Highly influenced by the excellent `<PseudoBox />` from [Chakra UI](https://chakra-ui.com/pseudobox).
+```js
+import { Box } from 'minera-ui';
+```
 
 ```jsx live
-<PseudoBox
+<Box>
+  <Box>Box Component</Box>
+  <Box as="span">Span Component</Box>
+</Box>
+```
+
+## Pseudo Props
+
+Pseudo selectors (prefaced by `_`) can also be used to style the component.
+
+```jsx live
+<Box
   as={Input}
   placeholder="Focus me"
   py={2}
@@ -18,13 +29,11 @@ Highly influenced by the excellent `<PseudoBox />` from [Chakra UI](https://chak
   borderWidth="2px"
   rounded="md"
   outline="none"
-  _focus={{ backgroundColor: '#fff', borderColor: 'purple' }}
+  _focus={{ background: '#fff', borderColor: 'purple' }}
 />
 ```
 
-## Props
-
-These are props related to the Pseudo Box component.
+These are pseudo class props for the Box component.
 
 | Prop           | Selector                                                                                                                                   |
 | -------------- | ------------------------------------------------------------------------------------------------------------------------------------------ |

diff --git a/docs/yarn.lock b/docs/yarn.lock
@@ -5852,10 +5852,10 @@ min-indent@^1.0.0:
   resolved "https://registry.yarnpkg.com/min-indent/-/min-indent-1.0.1.tgz#a63f681673b30571fbe8bc25686ae746eefa9869"
   integrity sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==
 
-minerva-ui@^7.1.7:
-  version "7.1.7"
-  resolved "https://registry.yarnpkg.com/minerva-ui/-/minerva-ui-7.1.7.tgz#8e4fabd1d7f9a18b639a1cce35ce1f0b250ef7af"
-  integrity sha512-pQ4h2q2tIds4VNGetb48d6kP1GACFiwBnREDwtQYBgfmqEkvVaUDsz8G0F1FuKILSAQ1G4gFgaILPZSq9aHwGg==
+minerva-ui@^7.2.0:
+  version "7.2.0"
+  resolved "https://registry.yarnpkg.com/minerva-ui/-/minerva-ui-7.2.0.tgz#8388fc05c29d1869d28114081856014442ac42d9"
+  integrity sha512-+tGs5w4UeGFkLobvJQEbaKawH2S8fEegXiLRDRoGfJ3gAxBVZg4IQH5Z1DyrFP0LqMQ9Pdk2tNZqz2C4vzS98A==
   dependencies:
     "@mdx-js/react" "^1.5.1"
     "@reach/accordion" "^0.11.2"