Skip to content
This repository has been archived by the owner on Aug 18, 2020. It is now read-only.

feat(stories): add initial components and scaffolding for import from… #3

Merged
merged 20 commits into from
Feb 18, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
The table of contents is too big for display.
Diff view
Diff view
  •  
  •  
  •  
3 changes: 3 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ npm-debug.log

semantic/src/themes/*
!semantic/src/themes/default
!semantic/src/themes/tripwire
semantic/dist
# ^ must force add to prevent rev churn. release process shall force add, perhaps?
# i forsee this bothering someone in the future. sorry dude(ette)!
Expand All @@ -22,3 +23,5 @@ semantic/dist
storybook-static
.nyc_output
/docs
.out
lib
3 changes: 2 additions & 1 deletion .storybook/config.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import '../lib/styles/semantic.css'
// import '../lib/styles/semantic.css'
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i'm not sure if the build will honor sourcemaps? given that its a dev tool only, do we want min stuffs?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Swapped to non-min.

import '../semantic/dist/semantic.css'
import './styles.css'
import { configure } from '@kadira/storybook'
import { basename } from 'path'
Expand Down
55 changes: 55 additions & 0 deletions .storybook/webpack.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
const path = require('path')
const cssnext = require('postcss-cssnext')
const autoprefixer = require('autoprefixer')
const impy = require('postcss-import')
const neat = require('postcss-neat')
const rucksack = require('rucksack-css')
const PATHS = {
app: './src/stories/index.js',
dist: path.join(__dirname, 'dist')
}
module.exports = {
entry: {
javascript: PATHS.app
},
output: {
path: PATHS.dist,
publicPath: '/',
filename: 'bundle.js'
},
devServer: {
contentBase: PATHS.dist
},
eslint: {
emitWarning: true
},
watchOptions: {
poll: true
},
module: {
loaders: [
{
test: /\.(jpe?g|png|gif|svg)$/i,
loader: 'file?name=[name].[ext]'
},
{
test: /\.css?$/,
loaders: [ 'style-loader', 'css-loader?importLoaders=1', 'postcss-loader' ]

},
{
test: /\.(ttf|otf|eot|woff(2)?)(\?[a-z0-9]+)?$/,
loader: 'file-loader?name=fonts/[name].[ext]'
}
]
},
resolve: {
extensions: ['', '.js', '.jsx']
},
postcss: function () {
return {
defaults: [impy, cssnext, neat, rucksack],
cleaner: [autoprefixer({ browsers: ['last 2 version'] })]
}
}
}
5 changes: 3 additions & 2 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
// Place your settings in this file to overwrite default and user settings.
{
"eslint.enable": false
}
"standard.enable": true,
"javascript.validate.enable": false
}
15 changes: 8 additions & 7 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,14 @@ this package simply applies a custom theme over semantic-ui, re-exports react-se

## install

`npm install --save octagon`
`npm install --save octagon` or `yarn add --dev octagon`

## usage - pattern library / storybook

- clone this repository
- run `npm install` from the project directory
- `npm start`
- run `yarn` from the project directory
- run `yarn run build` from the /semantic directory
- `yarn start`

open the url shown to see the latest storybook!

Expand All @@ -36,15 +37,15 @@ octagon imports, occasionally wraps, and re-exports piece-wise components from [
## development

- clone this repository
- run `npm install`
- run `yarn`

now you're off to the races :horse_racing:! this package offers two different development modes, depending on your use case. you can run both development modes in parallel, if needed.

### component and styles development

**useful** for when you're developing styles and components for this package only. in other words, "storybook" development.

`npm run storybook-dev`
`yarn run storybook-dev`

- watches the styles project for changes and rebuilds styles on changes. refreshes the storybook UI.
- watches the react component source for changes and rebuilds components & stories on changes. refreshes the storybook UI.
Expand All @@ -53,9 +54,9 @@ now you're off to the races :horse_racing:! this package offers two different d

### react component api distribution

**useful** if you've `npm link`ed your front-end project with `octagon` and want to iterate on components without suffering the build/publish lifecycle for `octagon`.
**useful** if you've `yarn link`ed your front-end project with `octagon` and want to iterate on components without suffering the build/publish lifecycle for `octagon`.

`npm run component-api-dev`
`yarn run component-api-dev`

watches `src/` for react component changes and recompiles the distribution output (e.g. `lib/`).

Expand Down
13 changes: 0 additions & 13 deletions lib/button/Button.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/button/Button.js.map

This file was deleted.

13 changes: 0 additions & 13 deletions lib/card/Card.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/card/Card.js.map

This file was deleted.

13 changes: 0 additions & 13 deletions lib/container/Container.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/container/Container.js.map

This file was deleted.

13 changes: 0 additions & 13 deletions lib/divider/Divider.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/divider/Divider.js.map

This file was deleted.

13 changes: 0 additions & 13 deletions lib/form/Form.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/form/Form.js.map

This file was deleted.

13 changes: 0 additions & 13 deletions lib/grid/Grid.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/grid/Grid.js.map

This file was deleted.

13 changes: 0 additions & 13 deletions lib/header/Header.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/header/Header.js.map

This file was deleted.

13 changes: 0 additions & 13 deletions lib/icon/Icon.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/icon/Icon.js.map

This file was deleted.

13 changes: 0 additions & 13 deletions lib/image/Image.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/image/Image.js.map

This file was deleted.

13 changes: 0 additions & 13 deletions lib/index.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/index.js.map

This file was deleted.

20 changes: 0 additions & 20 deletions lib/input/Input.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/input/Input.js.map

This file was deleted.

13 changes: 0 additions & 13 deletions lib/item/Item.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/item/Item.js.map

This file was deleted.

13 changes: 0 additions & 13 deletions lib/list/List.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/list/List.js.map

This file was deleted.

13 changes: 0 additions & 13 deletions lib/menu/Menu.js

This file was deleted.

1 change: 0 additions & 1 deletion lib/menu/Menu.js.map

This file was deleted.

Loading