Skip to content

Commit

Permalink
feat(docz): add some improvements for default package
Browse files Browse the repository at this point in the history
  • Loading branch information
pedronauck committed Apr 15, 2018
1 parent 1a55f8b commit 51188d4
Show file tree
Hide file tree
Showing 12 changed files with 139 additions and 119 deletions.
14 changes: 10 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,11 +1,17 @@
{
"private": true,
"license": "MIT",
"scripts": {
"bs": "lerna bootstrap"
},
"devDependencies": {
"lerna": "^2.9.0",
"libundler": "^1.3.0",
"typescript": "^2.7.2",
"trash-cli": "^1.4.0"
},
"workspaces": [
"packages/*",
"examples/*"
],
"devDependencies": {
"lerna": "^2.9.0"
}
]
}
9 changes: 1 addition & 8 deletions packages/playgrodd-theme-default/.babelrc
Original file line number Diff line number Diff line change
@@ -1,13 +1,6 @@
{
"presets": [
"@babel/preset-env",
["@babel/preset-env", { "modules": false }],
"@babel/preset-react"
],
"plugins": [
["module-resolver", {
"alias": {
"playgrodd": "../../node_modules/playgrodd/dist/main/index.js"
}
}]
]
}
23 changes: 17 additions & 6 deletions packages/playgrodd-theme-default/package.json
Original file line number Diff line number Diff line change
@@ -1,18 +1,29 @@
{
"name": "playgrodd-theme-default",
"version": "0.0.1",
"main": "./dist/index.js",
"license": "MIT",
"main": "dist/index.js",
"umd:main": "dist/index.umd.js",
"module": "dist/index.m.js",
"source": "src/index.jsx",
"scripts": {
"build": "babel src --out-dir dist"
"dev": "libundler watch",
"build": "libundler build -s",
"build:prod": "yarn run build -p --hash --gzip"
},
"dependencies": {
"playgrodd": "^0.0.1"
"react": "^16.2.0",
"react-dom": "^16.2.0"
},
"peerDependencies": {
"playgrodd": "^0.0.1",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-router-dom": "^4.2.2"
},
"devDependencies": {
"@babel/cli": "^7.0.0-beta.42",
"@babel/core": "7.0.0-beta.42",
"@babel/preset-env": "^7.0.0-beta.42",
"@babel/preset-react": "^7.0.0-beta.42",
"babel-plugin-module-resolver": "^3.1.0"
"@babel/preset-react": "^7.0.0-beta.42"
}
}
11 changes: 6 additions & 5 deletions packages/playgrodd-theme-default/src/index.jsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,11 @@
import * as React from 'react'
import { Link } from 'react-router-dom'

import { Playgrodd, Preview } from 'playgrodd'
import { createTheme, Playgrodd, Preview } from 'playgrodd'

export const App = () => (
<Playgrodd>
export const Theme = createTheme(() => (
<div>
<h1>Default theme</h1>
<ul>
<li>
<Link to="/src/Alert">Alert</Link>
Expand All @@ -14,5 +15,5 @@ export const App = () => (
</li>
</ul>
<Preview />
</Playgrodd>
)
</div>
))
2 changes: 1 addition & 1 deletion packages/playgrodd/bin/index.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
#!/usr/bin/env node

const yargs = require('yargs')
const { server } = require('../dist/main/server')
const { server } = require('playgrodd-core')

yargs
.command(
Expand Down
53 changes: 11 additions & 42 deletions packages/playgrodd/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,75 +2,44 @@
"name": "playgrodd",
"description": "Blazing fast and zero config React components playground",
"version": "0.0.1",
"main": "./dist/main/index.jsx",
"typings": "./dist/main/index.d.ts",
"module": "./dist/module/index.jsx",
"main": "dist/index.js",
"umd:main": "dist/index.umd.js",
"module": "dist/index.m.js",
"source": "src/index.ts",
"bin": {
"playgrodd": "./bin/index.js"
},
"scripts": {
"build": "run-s clean && run-p build:*",
"build:main": "tsc -p tsconfig.json",
"build:module": "tsc -p tsconfig.module.json",
"dev": "libundler watch",
"build": "libundler build",
"build:prod": "yarn run build --compress --sourcemap",
"fix": "run-s fix:*",
"fix:prettier": "prettier \"src/**/*.{ts,tsx}\" --write",
"fix:tslint": "tslint --fix --project .",
"watch": "run-s clean build:main && run-p \"build:main -- -w\"",
"clean": "trash dist"
"fix:tslint": "tslint --fix --project ."
},
"dependencies": {
"@babel/core": "7.0.0-beta.42",
"@babel/preset-env": "^7.0.0-beta.42",
"@babel/preset-react": "^7.0.0-beta.42",
"babel-loader": "^8.0.0-beta",
"babel-polyfill": "^6.26.0",
"babel-traverse": "^6.26.0",
"babel-types": "^6.26.0",
"babylon": "^6.18.0",
"connect-history-api-fallback": "^1.5.0",
"express": "^4.16.3",
"fast-glob": "^2.2.0",
"find-up": "^2.1.0",
"history": "^4.7.2",
"html-webpack-plugin": "^3.0.7",
"invariant": "^2.2.4",
"mkdirp": "^0.5.1",
"playgrodd-core": "^0.0.1",
"prop-types": "^15.6.1",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-router-dom": "^4.2.2",
"trash": "^4.3.0",
"unstated": "^1.1.0",
"uuid": "^3.2.1",
"webpack": "^4.1.1",
"webpack-dev-server": "^3.1.1",
"webpack-hot-middleware": "^2.21.2",
"yargs": "^11.0.0"
},
"devDependencies": {
"@types/babel-traverse": "^6.25.3",
"@types/babylon": "^6.16.2",
"@types/connect-history-api-fallback": "^1.3.1",
"@types/express": "^4.11.1",
"@types/find-up": "^2.1.1",
"@types/html-webpack-plugin": "^2.30.3",
"@types/invariant": "^2.2.29",
"@types/koa": "^2.0.44",
"@types/mkdirp": "^0.5.2",
"@types/node": "^9.4.7",
"@types/react": "^16.0.40",
"@types/react-dom": "^16.0.4",
"@types/react-router-dom": "^4.2.5",
"@types/trash": "^4.3.0",
"@types/uuid": "^3.4.3",
"@types/webpack": "^4.1.1",
"@types/webpack-dev-middleware": "^2.0.1",
"@types/webpack-hot-middleware": "^2.16.3",
"@types/yargs": "^11.0.0",
"npm-run-all": "^4.1.2",
"prettier": "^1.11.1",
"trash-cli": "^1.4.0",
"tslint": "^5.9.1",
"tslint-config-prettier": "^1.10.0",
"typescript": "^2.7.2"
"@types/yargs": "^11.0.0"
}
}
33 changes: 6 additions & 27 deletions packages/playgrodd/src/components/Preview.tsx
Original file line number Diff line number Diff line change
@@ -1,35 +1,14 @@
import * as React from 'react'
import { Subscribe } from 'unstated'
import { Route } from 'react-router-dom'

import { Doc } from '../documents'
import { IComponent } from '../utils/components'
import { DocumentsContainer } from '../documents/container'

const components = __PLAYGRODD_COMPONENTS__
const loadDocument = (doc: Doc) => {
const { route }: IComponent = components[doc.getName()]
const sections = doc.getSections()

return (
<Route
exact
key={route}
path={route}
render={() =>
sections.map(({ id, title, render: Component }) => (
<React.Fragment key={id}>
{title && <h2>{title}</h2>}
<Component />
</React.Fragment>
))
}
/>
)
}
import { DocumentsContainer } from '../container'
import { IDoc } from '../documents'

export const Preview: React.SFC = () => (
<Subscribe to={[DocumentsContainer]}>
{({ state }) => state.documents.map(loadDocument)}
{({ state }) => {
const documents: IDoc[] = Object.values(state.documents)
return documents.length > 0 && documents.map(doc => doc.getName())
}}
</Subscribe>
)
20 changes: 20 additions & 0 deletions packages/playgrodd/src/components/create-theme.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import * as React from 'react'
import { Router } from 'react-router-dom'
import { createBrowserHistory, History } from 'history'
import { Provider } from 'unstated'

import { container } from '../container'

export const history: History = createBrowserHistory()

export interface ICreateTheme {
(WrappedComponent: React.ComponentType): React.ComponentType
}

export const createTheme: ICreateTheme = WrappedComponent => () => (
<Router history={history}>
<Provider inject={[container]}>
<WrappedComponent />
</Provider>
</Router>
)
29 changes: 29 additions & 0 deletions packages/playgrodd/src/container/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
import { Container } from 'unstated'
import { IDoc, IDocMap } from '../documents'

export interface DocumentState {
documents: IDocMap | undefined
}

export class DocumentsContainer extends Container<DocumentState> {
constructor() {
super()
this.state = {
documents: {},
}
}

public addDoc(doc: IDoc) {
this.setState({
documents: Object.assign({}, this.state.documents, {
[`${doc.getName()}`]: doc,
}),
})
}

public getDocuments(): IDocMap | undefined {
return this.state.documents
}
}

export const container = new DocumentsContainer()
58 changes: 33 additions & 25 deletions packages/playgrodd/src/documents/index.ts
Original file line number Diff line number Diff line change
@@ -1,10 +1,5 @@
import invariant from 'invariant'
import { v4 } from 'uuid'

export { Preview } from '../components/Preview'
export { Playgrodd } from '../components/Playgrodd'

import { container } from './container'
import * as uuid from 'uuid'
import { container } from '../container'

const isFn = (value: any): boolean => typeof value === 'function'

Expand All @@ -18,39 +13,56 @@ export interface ISection {
title?: string
}

export class Doc {
export interface IDocArgs {
name: string
}

export interface IDoc {
description(value: string): Doc
section(...args: any[]): Doc
getName(): string
getDescription(): string | null
getSections(): ISection[]
}

export interface IDocMap {
[key: string]: IDoc
}

export class Doc implements IDoc {
private _name: string
private _description: string | null
private _sections: ISection[]

constructor(name: string) {
constructor({ name }: IDocArgs) {
this._name = name
this._sections = []
this._description = null

container.add(this)
container.addDoc(this)
return this
}

// setters

description(value: string) {
public description(value: string) {
this._description = value
return this
}

section(...args: any[]) {
public section(...args: any[]) {
const [title, renderMethod] = args
const render: IRenderMethod = isFn(title) ? title : renderMethod

invariant(
!isFn(title) || !isFn(renderMethod),
'You need to set a function that will be render your sectoin'
)
if (!isFn(title) || !isFn(renderMethod)) {
throw new Error(
'You need to set a function that will render your section'
)
}

this._sections.push({
render,
id: v4(),
id: uuid.v4(),
...(title && !isFn(title) && { title }),
})

Expand All @@ -59,21 +71,17 @@ export class Doc {

// getters

public getName(): string {
public getName() {
return this._name
}

public getDescription(): string | null {
public getDescription() {
return this._description
}

public getSections(): ISection[] {
public getSections() {
return this._sections
}
}

export interface IDoc {
(name: string): Doc
}

export const doc: IDoc = name => new Doc(name)
export const doc = (name: string): Doc => new Doc({ name })
2 changes: 1 addition & 1 deletion packages/playgrodd/src/index.ts
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
export { Preview } from './components/Preview'
export { Playgrodd } from './components/Playgrodd'
export { createTheme } from './components/create-theme'
export { doc } from './documents'
Loading

0 comments on commit 51188d4

Please sign in to comment.