@lostmyname/components - npm Package Compare versions

Comparing version 0.0.1 to 0.0.2

gulpfile.js

@@ -12,3 +12,2 @@ 'use strict';
 var imageCache = path.join(buildPath, 'src_cache');
-var testMode = false;
 
@@ -20,7 +19,7 @@ function getTask(name, options) {
 
-  // if (typeof options.rev !== 'boolean') {
-  //   options.rev = true;
-  // }
+  if (typeof options.rev !== 'boolean') {
+    options.rev = true;
+  }
 
-  // options.manifest = buildPath;
+  options.manifest = buildPath;
 
@@ -50,4 +49,22 @@ return loadLmnTask(name, options);
 
+var compOpts = {
+  src: './src/components/components.js',
+  dest: path.join(buildPath, 'components.js'),
+  react: true,
+  jquery: false,
+  paths: [
+    './node_modules',
+    './src/helpers',
+    './src/components/atoms',
+    './src/components/molecules',
+    './src/components/layouts'
+  ]
+};
+
+var compOptsWatch = _.assign({}, compOpts, { watch: true });
+
 gulp.task('js', gulp.series('js-quality', getTask('browserify', jsOpts)));
 gulp.task('js-watch', getTask('browserify', jsOptsWatch));
+gulp.task('all-components', gulp.series('js-quality', getTask('browserify', compOpts)));
+gulp.task('all-components-watch', getTask('browserify', compOptsWatch));
 
@@ -92,3 +109,3 @@ gulp.task('scss', getTask('scss', {
 gulp.task('build', gulp.parallel(
-  'js',
+  'all-components',
   'images',
@@ -105,2 +122,3 @@ 'fonts',
   'js',
+  'all-components',
   'scss'
@@ -107,0 +125,0 @@ ));

package.json

 {
   "name": "@lostmyname/components",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "The home of all of Lost My Name's reusable React Components",
@@ -5,0 +5,0 @@ "main": "dist/components.js",

scripts/release.js

@@ -18,2 +18,1 @@ import path from 'path';
 rm('-rf', path.resolve('./lib'));
-exec(`cd ${sourceDir} && ${path.resolve(BIN)}/babel components.js --out-dir ${path.resolve('./dist')}`);

src/components/atoms/Logo/Logo.js

 import React from 'react';
-// import LMN from '../../../component-library';
 import SvgTag from 'SvgTag';
@@ -65,3 +64,3 @@ import { getPropTypes, getDefaultProps } from 'definitions';
     const svg = (
-      <LMN.atoms.SvgTag
+      <SvgTag
         src={src}
@@ -68,0 +67,0 @@ width={this.props.width}

src/components/atoms/RadioInput/RadioInput.js

@@ -59,3 +59,3 @@ import React from 'react';
   render: function () {
-    var props = Object.assign({}, this.props);
+    var props = this.props;
 
@@ -62,0 +62,0 @@ if (props.children) {

src/components/atoms/ValueProps/ValueProps.js

 import React from 'react';
-import { Row, Col } from '../../layouts/Grid/Grid';
+import { Row, Col } from 'Grid';
 import { getPropTypes } from 'definitions';
@@ -4,0 +4,0 @@

src/components/components.js

 import Badge from 'Badge';
-import BookLabel from './BookLabel/BookLabel';
-import Button from './Button/Button';
-import CompleteTick from './CompleteTick/CompleteTick';
-import CloudImageSrcset from './CloudImageSrcset/CloudImageSrcset';
-import HiddenFields from './HiddenFields/HiddenFields';
-import ImageSrcset from './ImageSrcset/ImageSrcset';
-import InlineLabel from './InlineLabel/InlineLabel';
-import InputCounter from './InputCounter/InputCounter';
-import List from './List/List';
-import Logo from './Logo/Logo';
-import RadioInput from './RadioInput/RadioInput';
-import Rule from './Rule/Rule';
-import Select from './Select/Select';
-import SocialIcon from './SocialIcon/SocialIcon';
+import Button from 'Button';
+import CompleteTick from 'CompleteTick';
+import CloudImageSrcset from 'CloudImageSrcset';
+import HiddenFields from 'HiddenFields';
+import ImageSrcset from 'ImageSrcset';
+import InlineLabel from 'InlineLabel';
+import InputCounter from 'InputCounter';
+import List from 'List';
+import Logo from 'Logo';
+import RadioInput from 'RadioInput';
+import Rule from 'Rule';
+import Select from 'Select';
+import SocialIcon from 'SocialIcon';
 import StarRating from 'StarRating';
@@ -22,19 +21,17 @@ import SvgTag from 'SvgTag';
 
-import ActionButtonSet from './layouts/ActionButtonSet/ActionButtonSet';
-import * as grid from './layouts/Grid/Grid';
-import * as media from './layouts/Media/Media';
+import ActionButtonSet from 'ActionButtonSet';
+import * as grid from 'Grid';
+import * as media from 'Media';
 
-import Banner from './molecules/Banner/Banner';
-import BookWidget from './molecules/BookWidget/BookWidget';
-import ButtonRadio from './molecules/ButtonRadio/ButtonRadio';
-import Divider from './molecules/Divider/Divider';
-import Flipper from './molecules/Flipper/Flipper';
-import InlineFormField from './molecules/InlineFormField/InlineFormField';
-import LabelledRadio from './molecules/LabelledRadio/LabelledRadio';
-import Modal from './molecules/Modal/Modal';
-import Panel from './molecules/Panel/Panel';
-import RealTimeValue from './molecules/RealTimeValue/RealTimeValue';
-import RelatedContentCard from './molecules/RelatedContentCard/RelatedContentCard';
-import Tooltip from './molecules/Tooltip/Tooltip';
-import ValueProp from './molecules/ValueProp/ValueProp';
+import Banner from 'Banner';
+import ButtonRadio from 'ButtonRadio';
+import Divider from 'Divider';
+import Flipper from 'Flipper';
+import InlineFormField from 'InlineFormField';
+import LabelledRadio from 'LabelledRadio';
+import Modal from 'Modal';
+import Panel from 'Panel';
+import RelatedContentCard from 'RelatedContentCard';
+import Tooltip from 'Tooltip';
+import ValueProp from 'ValueProp';
 
@@ -44,3 +41,2 @@ export default {
     Badge,
-    BookLabel,
     Button,
@@ -72,3 +68,2 @@ CompleteTick,
     Banner,
-    BookWidget,
     ButtonRadio,
@@ -81,3 +76,2 @@ Divider,
     Panel,
-    RealTimeValue,
     RelatedContentCard,
@@ -84,0 +78,0 @@ Tooltip,

src/components/layouts/ActionButtonSet/index.js

 import React from 'react';
-import { Row, Col } from '../Grid/Grid';
+import { Row, Col } from 'Grid';
 
@@ -4,0 +4,0 @@ var ActionButtonSet = React.createClass({

src/components/layouts/Grid/index.js

@@ -37,3 +37,5 @@ import React from 'react';
     return (
-      <div {...Object.assign({}, this.props, { className })}>
+      <div
+        {...this.props}
+        className={className}>
         {this.props.children}
@@ -120,3 +122,4 @@ </div>
       <div
-        {...Object.assign({}, this.props, { className })}>
+        {...this.props}
+        className={className}>
         {newChildren}
@@ -123,0 +126,0 @@ </div>

src/components/molecules/Flipper/Flipper.js

@@ -48,4 +48,3 @@ import React from 'react';
     this.state.number.forEach((number) => {
-      var $el = this.refs[`flipper-number-${number.key}`];
-
+      var $el = this[`_flipper-${number.key}`];
       if (!$el) {
@@ -91,3 +90,3 @@ return null;
         className="flipper__number"
-        ref={'flipper-number-' + key}
+        ref={this.setRef(key)}
         key={key}>
@@ -101,2 +100,7 @@ <span className="flipper__card flipper__current flipper__current--top">{current}</span>
   },
+  setRef: function (i) {
+    return function (c) {
+      this[`_flipper-${i}`] = c;
+    };
+  },
   render: function () {
@@ -103,0 +107,0 @@ let flipperNumbers = this.state.number.map((item, key) => {

src/script.js

 import React from 'react';
 import ReactDOM from 'react-dom';
-
 import Button from 'Button';
 
-const Component = () => (
-  <div>YOOOOOO</div>
-);
-
 ReactDOM.render(
@@ -11,0 +6,0 @@ <Button>

No alert changes

Improved metrics

Lines of code

3659

increased by0.36%

Worsened metrics

Total package byte prevSize

217550

decreased by-0.23%

No dependency changes