1.1.0 • Published 7 years ago
principles-ui-components v1.1.0
principles-ui-components
Supporting UI controller for Tizen TV web application, which developed base on React Framework.
Installation
npm install --save principles-ui-components
Importing
e.g.
import { BasicButton, ToolTip } from 'principles-ui-components'; // ES6
## Usage
Based on JSX, provides syntactic sugar for the React.Component.
Here is an example of using BasicButton with a React component, which also
documents the different validators provided:
```jsx
import { BasicButton, ToolTip } from 'principles-ui-components';
class MyComponent extends React.Component {
render() {
return (<BasicButton />);
}
}
## How to Depend on This Package?
For apps, we recommend putting it in `dependencies` with a caret range.
For example:
```js
"dependencies": {
"principles-ui-components": "^1.1.0"
}
And apps should configure babel-loader for this package.
module: {
loaders: [
{
test: /\.js$/,
loader: 'babel-loader',
}
]
}
## image resource issue?
This package inculde images, like controller background, loading and progress circle icon. To move the path 'images' from 'node_modules/principles-ui-components' to apps root path, at the same path with 'index.html'.
## Issue list:
1. // ImmutableJS data structures like List and Map imparts the immutability feature to only the level-1 members of the List/Map. (inside is still a standard JavaScript object)
// So, if objects inside arrays or arrays inside objects and want them too to be immutable, the choice is Immutable.fromJS.
import { is, Map, fromJS } from 'immutable';
"!(is(Map(nextProps), Map(this.props)));" change to "!(is(fromJS(nextProps),
fromJS(this.props)));"
2. // Since the release of React v15.5.0 React.PropTypes is deprecated and has moved to another library.
//"npm install prop-types"
"import { PropTypes } from 'react';" change to "import PropTypes from
'prop-types';"
3. //expect(...).to.be(...) is a syntax used by Enzyme(which is Chai), Jest uses a different Expect library.
//so expect(...).to is undefined, hence to.equal is calling equal on undefined. change it to expect(...).toEqual(...) https://facebook.github.io/jest/docs/expect.html
"expect(...).to.be(...)" change to " expect(...).toEqual(...)"
4. //remove "!(is(fromJS(nextState), fromJS(this.state)))" from "shouldComponentUpdate" when components have no state, for improve unit test branches coverage.
5. //Jest processor that prevents CSS module parse errors: -> //https://github.com/justinsisley/Jest-CSS-Modules
npm install --save-dev jest-css-modules
//Update your package.json file's jest configuration:
{
"jest": {
"moduleNameMapper": {
"\\.(css)$": "<rootDir>/node_modules/jest-css-modules"
}
}