@density/ui-modal - npm Package Compare versions

Comparing version 0.0.4 to 0.0.5

dist/index.js

@@ -6,2 +6,3 @@
 exports.default = Modal;
+exports.ModalClose = ModalClose;
 
@@ -31,1 +32,11 @@ var _react = require("react");
 
+function ModalClose(_ref2) {
+  var onClick = _ref2.onClick;
+
+  return React.createElement(
+    "span",
+    { className: "modal-close", onClick: onClick },
+    "\xD7"
+  );
+}
+

dist/story.js

@@ -12,5 +12,5 @@ 'use strict';
 
-var _ = require('./');
+var _index = require('./index');
 
-var _2 = _interopRequireDefault(_);
+var _index2 = _interopRequireDefault(_index);
 
@@ -29,3 +29,3 @@ var _card = require('../card');
     _react2.default.createElement(
-      _2.default,
+      _index2.default,
       { onClickBackdrop: (0, _addonActions.action)('backdrop click') },
@@ -48,3 +48,28 @@ _react2.default.createElement(
   );
+}).addWithInfo('With a close button', function () {
+  return _react2.default.createElement(
+    'div',
+    null,
+    'foo',
+    _react2.default.createElement(
+      _index2.default,
+      { onClickBackdrop: (0, _addonActions.action)('backdrop click') },
+      _react2.default.createElement(
+        _card2.default,
+        null,
+        _react2.default.createElement(
+          _card.CardHeader,
+          null,
+          'Foo',
+          _react2.default.createElement(_index.ModalClose, { onClick: (0, _addonActions.action)('close button click') })
+        ),
+        _react2.default.createElement(
+          _card.CardBody,
+          null,
+          'Bar'
+        )
+      )
+    )
+  );
 });
 

index.js

@@ -8,1 +8,5 @@ import * as React from 'react';
 }
+
+export function ModalClose({onClick}) {
+  return <span className="modal-close" onClick={onClick}>&times;</span>;
+}

package.json

 {
   "name": "@density/ui-modal",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "description": "Modal popup component",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

story.js

@@ -6,4 +6,4 @@ import React from 'react';
 import './styles.scss';
-import Modal from './';
 
+import Modal, { ModalClose } from './index';
 import Card, { CardHeader, CardBody } from '../card';
@@ -24,1 +24,15 @@
   ))
+  .addWithInfo('With a close button', () => (
+    <div>
+      foo
+      <Modal onClickBackdrop={action('backdrop click')}>
+        <Card>
+          <CardHeader>
+            Foo
+            <ModalClose onClick={action('close button click')} />
+          </CardHeader>
+          <CardBody>Bar</CardBody>
+        </Card>
+      </Modal>
+    </div>
+  ))

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

6730

increased by35.3%

Lines of code

163

increased by50.93%

No dependency changes