henrybuilt-react-library - npm Package Compare versions

Comparing version 1.0.7 to 1.0.8

example/package.json

 {
   "name": "henrybuilt-react-library-example",
-  "homepage": "https://maxhudson.github.io/henrybuilt-react-library",
-  "version": "0.0.0",
-  "license": "MIT",
+  "version": "0.1.0",
   "private": true,
+  "devDependencies": {
+    "react-scripts": "2.1.5"
+  },
   "dependencies": {
     "prop-types": "^15.6.2",
-    "react": "^16.4.1",
-    "react-dom": "^16.4.1",
-    "react-scripts": "^1.1.4",
+    "react": "^16.8.1",
+    "react-dom": "^16.8.1",
     "henrybuilt-react-library": "file:.."
@@ -17,8 +17,14 @@ },
     "build": "react-scripts build",
-    "test": "react-scripts test --env=jsdom",
+    "test": "react-scripts test",
     "eject": "react-scripts eject"
   },
   "eslintConfig": {
-    "extends": "henrybuilt"
-  }
+    "extends": "react-app"
+  },
+  "browserslist": [
+    ">0.2%",
+    "not dead",
+    "not ie <= 11",
+    "not op_mini all"
+  ]
 }

example/public/manifest.json

 {
-  "short_name": "henrybuilt-react-library",
-  "name": "henrybuilt-react-library",
-  "start_url": "./index.html",
+  "short_name": "React App",
+  "name": "Create React App Sample",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    }
+  ],
+  "start_url": ".",
   "display": "standalone",
@@ -6,0 +13,0 @@ "theme_color": "#000000",

example/src/App.js

 import React from 'react';
-import {Component, Button, TextInput} from 'henrybuilt-react-library';
+import {Component, Button, Form} from 'henrybuilt-react-library';
 
+var Example = ({title, children}) => {
+  return (
+    <div className='component-example table-row'>
+      <div className='component-example-title table-cell'>{`<${title} />`}</div>
+      <div className='component-example-component table-cell'>{children}</div>
+    </div>
+  )
+};
+
 export default class App extends Component {
@@ -8,3 +17,7 @@ constructor(props) {
 
-    this.state = {textInputValue: ''};
+    this.state = {
+      textInputValue: '',
+      radioInputValue: '2',
+      dropdownInputValue: '2'
+    };
 
@@ -23,4 +36,39 @@ this.handleTextInputChange = this.handleTextInputChange.bind(this);
       <div className='theme-light'>
-        <Button>asdf</Button>
-        <TextInput on={{change: this.handleTextInputChange}} value={this.state.textInputValue}/>
+        <div className='component-examples'>
+          <Example title='Button'>
+            <Button>Button text</Button>
+          </Example>
+          <Example title='Form.TextInput'>
+            <Form.TextInput
+              on={{change: this.handleTextInputChange}}
+              value={this.state.textInputValue}
+              label='Label'
+              placeholder='Type something...'
+            />
+          </Example>
+          <Example title='Form.RadioInput'>
+            <Form.RadioInput
+              on={{change: ({value}) => this.setState({radioInputValue: value})}}
+              value={this.state.radioInputValue}
+              label='Label'
+              options={[
+                {value: '1', title: 'Option 1'},
+                {value: '2', title: 'Option 2'}
+              ]}
+            />
+          </Example>
+          <Example title='Form.DropdownInput'>
+            <Form.DropdownInput
+              search
+              on={{change: ({value}) => this.setState({dropdownInputValue: value})}}
+              value={this.state.dropdownInputValue}
+              label='Label'
+              name='dropdown-name'
+              options={[
+                {value: '1', title: 'Option 1'},
+                {value: '2', title: 'Option 2'}
+              ]}
+            />
+          </Example>
+        </div>
       </div>
@@ -27,0 +75,0 @@ );

package.json

 {
   "name": "henrybuilt-react-library",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "",
@@ -5,0 +5,0 @@ "author": "maxhudson",

src/components/form/form.js

@@ -5,3 +5,3 @@ import {_, React, Component} from 'components';
 import TextInput from './inputs/text/text-input';
-import SelectInput from './inputs/select/select-input';
+import DropdownInput from './inputs/dropdown/dropdown-input';
 import RadioInput from './inputs/radio/radio-input';
@@ -44,3 +44,3 @@ import HiddenInput from './inputs/hidden/hidden-input';
 Form.TextInput = TextInput;
-Form.SelectInput = SelectInput;
+Form.DropdownInput = DropdownInput;
 Form.RadioInput = RadioInput;
@@ -47,0 +47,0 @@ Form.HiddenInput = HiddenInput;

src/components/form/inputs/radio/radio-input.js

@@ -11,3 +11,3 @@ import {_, React} from 'components';
     return (
-      <Group className='radio-input'>
+      <Group className='form-input radio-input'>
         {this.props.label ? <label className='label'>{this.props.label}</label> : null}
@@ -14,0 +14,0 @@ {_.map(this.props.options, ({value, title}) => (

src/components/form/inputs/text/text-input.js

@@ -32,3 +32,3 @@ import {_, React, Component} from 'components';
     return <SemanticInput
-      className='text-input'
+      className='form-input text-input'
       value={this.state.value}
@@ -35,0 +35,0 @@ onChange={this.handleChange}

src/components/tree/tree.js

@@ -0,1 +1,4 @@
+//https://github.com/react-component/tree
+//https://github.com/frontend-collective/react-sortable-tree
+
 class Tree {
@@ -2,0 +5,0 @@ // isReorderable - is reorderable across groups

src/index.js

@@ -12,3 +12,3 @@ import PropTypes from 'prop-types';
 
-import './styles.scss';
+import './styles/styles.scss';
 
@@ -15,0 +15,0 @@ export {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

8451421

increased by0.26%

Number of package files

47

increased by2.17%

Lines of code

83655

increased by0.34%

No dependency changes