unified docs

dfee · Dec 22, 2018 · 18df6a7 · 18df6a7
1 parent 6db27a9
commit 18df6a7
Show file tree

Hide file tree

Showing 91 changed files with 3,194 additions and 332 deletions.
diff --git a/.storybook/preview-head.html b/.storybook/preview-head.html
diff --git a/.storybook/storybook.sass b/.storybook/storybook.sass
diff --git a/README.md b/README.md
@@ -7,7 +7,7 @@
 
 `rbx` is a comprehensive library of React components for [Bulma 0.7.2](http://bulma.io).
 
-🔥 **All components have exhaustive** [storybook examples](https://dfee.github.io/rbx).
+🔥 **[Read the docs](https://dfee.github.io/rbx/stories)**.
 
 🙃 _I'll wait, go check them out!_
 
@@ -50,76 +50,13 @@ export const goHomeLink = (
 );
 ```
 
-For styling, each component imports its own sass file.
-Thus, you can reduce your css total file size by only including the styles that you will use.
-To enable this, configure your [Webpack](https://webpack.github.io/) to handle sass files.
-
-While some components may slightly differ from the Bulma API, these changes are usually minimal.
-
-#### Base
-
-| Item    | Storybook                                                            | Bulma Documentation |
-| ------- | -------------------------------------------------------------------- | ------------------- |
-| Generic | [Stories](https://dfee.github.io/rbx/?selectedKind=Extras%2FGeneric) | N/A                 |
-
-#### Components
-
-| Item       | Storybook                                                                   | Bulma Documentation                                                    |
-| ---------- | --------------------------------------------------------------------------- | ---------------------------------------------------------------------- |
-| Breadcrumb | [Stories](https://dfee.github.io/rbx/?selectedKind=Components%2FBreadcrumb) | [Documentation](http://bulma.io/documentation/components/breadcrumb/)  |
-| Card       | [Stories](https://dfee.github.io/rbx/?selectedKind=Components%2FCard)       | [Documentation](http://bulma.io/documentation/components/card/)        |
-| Dropdown   | [Stories](https://dfee.github.io/rbx/?selectedKind=Components%2FDropdown)   | [Documentation](http://bulma.io/documentation/components/dropdown/)    |
-| Level      | [Stories](https://dfee.github.io/rbx/?selectedKind=Components%2FLevel)      | [Documentation](http://bulma.io/documentation/layout/level/)           |
-| List       | [Stories](https://dfee.github.io/rbx/?selectedKind=Components%2FList)       | [Documentation](http://bulma.io/documentation/components/list/)        |
-| Media      | [Stories](https://dfee.github.io/rbx/?selectedKind=Components%2FMedia)      | [Documentation](http://bulma.io/documentation/layout/media-object/)    |
-| Menu       | [Stories](https://dfee.github.io/rbx/?selectedKind=Components%2FMenu)       | [Documentation](http://bulma.io/documentation/components/menu/)        |
-| Message    | [Stories](https://dfee.github.io/rbx/?selectedKind=Components%2FMessage)    | [Documentation](http://bulma.io/documentation/components/message/)     |
-| Modal      | [Stories](https://dfee.github.io/rbx/?selectedKind=Components%2FModal)      | [Documentation](http://bulma.io/documentation/components/modal/)       |
-| Navbar     | [Stories](https://dfee.github.io/rbx/?selectedKind=Components%2FNavbar)     | [Documentation](https://bulma.io/documentation/components/navbar/)     |
-| Pagination | [Stories](https://dfee.github.io/rbx/?selectedKind=Components%2FPagination) | [Documentation](https://bulma.io/documentation/components/pagination/) |
-| Panel      | [Stories](https://dfee.github.io/rbx/?selectedKind=Components%2FPanel)      | [Documentation](https://bulma.io/documentation/components/panel/)      |
-| Tabs       | [Stories](https://dfee.github.io/rbx/?selectedKind=Components%2FTabs)       | [Documentation](https://bulma.io/documentation/components/tabs/)       |
-
-#### Elements
-
-| Item         | Storybook                                                                   | Bulma Documentation                                                   |
-| ------------ | --------------------------------------------------------------------------- | --------------------------------------------------------------------- |
-| Box          | [Stories](https://dfee.github.io/rbx/?selectedKind=Elements%2FBox)          | [Documentation](http://bulma.io/documentation/elements/box/)          |
-| Button       | [Stories](https://dfee.github.io/rbx/?selectedKind=Elements%2FButton)       | [Documentation](http://bulma.io/documentation/elements/button/)       |
-| Container    | [Stories](https://dfee.github.io/rbx/?selectedKind=Elements%2FContainer)    | [Documentation](http://bulma.io/documentation/layout/container/)      |
-| Content      | [Stories](https://dfee.github.io/rbx/?selectedKind=Elements%2FContent)      | [Documentation](http://bulma.io/documentation/elements/content/)      |
-| Form         | [Stories](https://dfee.github.io/rbx/?selectedKind=Elements%2FForm)         | [Documentation](http://bulma.io/documentation/form/general/)          |
-| Icon         | [Stories](https://dfee.github.io/rbx/?selectedKind=Elements%2FIcon)         | [Documentation](http://bulma.io/documentation/elements/icon/)         |
-| Image        | [Stories](https://dfee.github.io/rbx/?selectedKind=Elements%2FImage)        | [Documentation](http://bulma.io/documentation/elements/image/)        |
-| Notification | [Stories](https://dfee.github.io/rbx/?selectedKind=Elements%2FNotification) | [Documentation](http://bulma.io/documentation/elements/notification/) |
-| Other        | [Stories](https://dfee.github.io/rbx/?selectedKind=Elements%2FOther)        | N/A                                                                   |
-| Progress     | [Stories](https://dfee.github.io/rbx/?selectedKind=Elements%2FProgress)     | [Documentation](http://bulma.io/documentation/elements/progress/)     |
-| Table        | [Stories](https://dfee.github.io/rbx/?selectedKind=Elements%2FTable)        | [Documentation](http://bulma.io/documentation/elements/table/)        |
-| Tag          | [Stories](https://dfee.github.io/rbx/?selectedKind=Elements%2FTag)          | [Documentation](http://bulma.io/documentation/elements/tag/)          |
-| Title        | [Stories](https://dfee.github.io/rbx/?selectedKind=Elements%2FTitle)        | [Documentation](http://bulma.io/documentation/elements/title/)        |
-
-#### Grid
-
-| Item    | Storybook                                                          | Bulma Documentation                                          |
-| ------- | ------------------------------------------------------------------ | ------------------------------------------------------------ |
-| Columns | [Stories](https://dfee.github.io/rbx/?selectedKind=Grid%2FColumns) | [Documentation](http://bulma.io/documentation/columns/)      |
-| Tiles   | [Stories](https://dfee.github.io/rbx/?selectedKind=Grid%2FTiles)   | [Documentation](http://bulma.io/documentation/layout/tiles/) |
-
-#### Layout
-
-| Item    | Storybook                                                            | Bulma Documentation                                            |
-| ------- | -------------------------------------------------------------------- | -------------------------------------------------------------- |
-| Footer  | [Stories](https://dfee.github.io/rbx/?selectedKind=Layout%2FFooter)  | [Documentation](http://bulma.io/documentation/layout/footer/)  |
-| Hero    | [Stories](https://dfee.github.io/rbx/?selectedKind=Layout%2FHero)    | [Documentation](http://bulma.io/documentation/layout/hero/)    |
-| Section | [Stories](https://dfee.github.io/rbx/?selectedKind=Layout%2FSection) | [Documentation](http://bulma.io/documentation/layout/section/) |
-
 ### Customize Bulma
 
 To override the variables set by Bulma, install Bulma (`npm install bulma@0.7.2`), and [follow the Bulma instructions](https://bulma.io/documentation/customize/variables/).
 
 You will also need to import `rbx/rbx.sass` as it contains any pertinent bug fixes for Bulma.
 
-A minimal example of `style.sass` might look like:
+A minimal example of `App.sass` might look like:
 
 ```sass
 $primary: #61dafb
@@ -128,7 +65,7 @@ $primary: #61dafb
 @import "../src/index.sass"
 ```
 
-Then, import this file into the root of your project.
+Then, import this file somewhere in your project.
 
 #### Create React App
 
@@ -143,3 +80,7 @@ Finally, import this stylesheet somewhere in your CRA app.
 ```js
 import "./App.sass";
 ```
+
+#### Prior Art
+
+This package was forked from [`react-bulma-components`](https://github.com/couds/react-bulma-components`), and re-written in its entirety to support the latest version of Bulma, use TypeScript, and fix many outstanding bugs.
diff --git a/docs/README.md b/docs/README.md
@@ -0,0 +1,13 @@
+### Running
+
+`npm run docs:core:dev`
+`npm run docs:storybook:dev`
+
+### Build
+
+`npm run docs:core:build`
+`npm run docs:storybook:build`
+
+### Deploy
+
+`npm run docs:deploy`
diff --git a/docs/build/3252ba9b23a6f5fe57e2ec4344d44f5f.png b/docs/build/3252ba9b23a6f5fe57e2ec4344d44f5f.png
diff --git a/docs/build/351a648ac3de7a72bd8c2030e27397be.png b/docs/build/351a648ac3de7a72bd8c2030e27397be.png
diff --git a/docs/build/3f93e32492872851dabc63fbb25f72ed.png b/docs/build/3f93e32492872851dabc63fbb25f72ed.png
diff --git a/docs/build/479f560be06df35f8fa1657bd898bea6.png b/docs/build/479f560be06df35f8fa1657bd898bea6.png
diff --git a/docs/build/952d66ec8f1b7a5bfc49441f0bf287de.png b/docs/build/952d66ec8f1b7a5bfc49441f0bf287de.png
diff --git a/docs/build/ec99d3aeec97b15db761cf0a17d6e796.png b/docs/build/ec99d3aeec97b15db761cf0a17d6e796.png
diff --git a/docs/build/index.html b/docs/build/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+    <title>rbx</title>
+  </head>
+
+  <body>
+    <div id="root"></div>
+  <script type="text/javascript" src="index_bundle.js"></script></body>
+</html>
diff --git a/docs/build/index_bundle.js b/docs/build/index_bundle.js
diff --git a/docs/build/stories/favicon.ico b/docs/build/stories/favicon.ico
diff --git a/docs/build/stories/iframe.html b/docs/build/stories/iframe.html
@@ -0,0 +1,60 @@
+<!doctype html><html><head><meta charset="utf-8"><title>Storybook</title><base target="_parent"><style>:not(.sb-show-main) > .sb-main,
+  :not(.sb-show-nopreview) > .sb-nopreview,
+  :not(.sb-show-errordisplay) > .sb-errordisplay {
+      display: none;
+  }
+
+  .sb-wrapper {
+    position: fixed;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    padding: 20px;
+    font-family: -apple-system, ".SFNSText-Regular", "San Francisco", Roboto, "Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif;
+    -webkit-font-smoothing: antialiased;
+  }
+
+  .sb-heading {
+    font-size: 20px;
+    font-weight: 600;
+    letter-spacing: 0.2px;
+    margin: 10px 0;
+  }
+
+  .sb-nopreview {
+    display: flex;
+    align-content: center;
+    justify-content: center;
+  }
+
+  .sb-nopreview_main {
+    margin: auto;
+    padding: 30px;
+    border-radius: 10px;
+    background: rgba(0,0,0,0.03);
+  }
+
+  .sb-nopreview_heading {
+    text-align: center;
+  }
+
+  .sb-errordisplay {
+    background-color: rgb(187, 49, 49);
+    color: #FFF;
+  }
+
+  .sb-errordisplay_code {
+    font-size: 14px;
+    width: 100vw;
+    overflow: auto;
+  }</style><script>try {
+    if (window.parent !== window) {
+      window.__REACT_DEVTOOLS_GLOBAL_HOOK__ = window.parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
+      window.__VUE_DEVTOOLS_GLOBAL_HOOK__ = window.parent.__VUE_DEVTOOLS_GLOBAL_HOOK__;
+    }
+  } catch (e) {
+    console.warn('unable to connect to parent frame for connecting dev tools');
+  }</script></head><body><div class="sb-nopreview sb-wrapper"><div class="sb-nopreview_main"><h1 class="sb-nopreview_heading sb-heading">No Preview</h1><p>Sorry, but you either have no stories or none are selected somehow.</p><ul><li>Please check the storybook config.</li><li>Try reloading the page.</li></ul></div></div><div class="sb-errordisplay sb-wrapper"><div id="error-message" class="sb-heading"></div><pre class="sb-errordisplay_code">
+    <code id="error-stack"></code>
+  </pre></div><div id="root"></div><script src="runtime~main.2b854572e8074941f064.bundle.js"></script><script src="vendors~main.2b854572e8074941f064.bundle.js"></script><script src="main.2b854572e8074941f064.bundle.js"></script></body></html>
diff --git a/docs/build/stories/index.html b/docs/build/stories/index.html
@@ -0,0 +1,14 @@
+<!doctype html><html><head><meta charset="utf-8"><title>Storybook</title><style>html, body {
+    overflow: hidden;
+    height: 100%;
+    width: 100%;
+    margin: 0;
+    padding: 0;
+  }</style><script>try {
+    if (window.parent !== window) {
+      window.__REACT_DEVTOOLS_GLOBAL_HOOK__ = window.parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
+      window.__VUE_DEVTOOLS_GLOBAL_HOOK__ = window.parent.__VUE_DEVTOOLS_GLOBAL_HOOK__;
+    }
+  } catch (e) {
+    console.warn('unable to connect to parent frame for connecting dev tools');
+  }</script></head><body><div id="root"></div><script src="/sb_dll/storybook_ui_dll.js"></script><script src="runtime~main.3aaa912fd37e258bb4b5.bundle.js"></script><script src="vendors~main.6c70f324856d25f69079.bundle.js"></script><script src="main.8bc300f2eb455dc70e47.bundle.js"></script></body></html>
diff --git a/docs/build/stories/main.2b854572e8074941f064.bundle.js b/docs/build/stories/main.2b854572e8074941f064.bundle.js
diff --git a/docs/build/stories/main.2b854572e8074941f064.bundle.js.map b/docs/build/stories/main.2b854572e8074941f064.bundle.js.map
diff --git a/docs/build/stories/main.8bc300f2eb455dc70e47.bundle.js b/docs/build/stories/main.8bc300f2eb455dc70e47.bundle.js
diff --git a/docs/build/stories/runtime~main.2b854572e8074941f064.bundle.js b/docs/build/stories/runtime~main.2b854572e8074941f064.bundle.js