@ntbjs/react-components 0.0.1-beta.4 → 0.0.1-beta.42

package/icons/bell.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.69 24">
+  <path fill="currentColor" d="M9.85,24a2.47,2.47,0,0,0,2.46-2.46H7.38A2.47,2.47,0,0,0,9.85,24Zm7.38-7.38V10.46c0-3.78-2-6.94-5.54-7.78V1.85A1.85,1.85,0,1,0,8,1.85v.83c-3.52.84-5.54,4-5.54,7.78v6.16L0,19.08v1.23H19.69V19.08Zm-2.46,1.23H4.92V10.46c0-3.05,1.86-5.54,4.93-5.54s4.92,2.49,4.92,5.54Z"/>
+</svg>

package/icons/check.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 18.2968">
+  <path fill="currentColor" d="M7.6271,14.4355l-5.69-5.69L0,10.67l7.6271,7.6271L24,1.9238,22.0762,0Z"/>
+</svg>

package/icons/gear.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24.67">
+  <path fill="currentColor" d="M21.17,13.55a9.57,9.57,0,0,0,.09-1.21,9.43,9.43,0,0,0-.09-1.21l2.6-2a.61.61,0,0,0,.15-.79L21.45,4a.62.62,0,0,0-.54-.3.71.71,0,0,0-.21,0L17.63,5a8.7,8.7,0,0,0-2.09-1.21L15.07.52a.59.59,0,0,0-.6-.52H9.54a.61.61,0,0,0-.61.52L8.46,3.79A9.58,9.58,0,0,0,6.38,5L3.31,3.76a.91.91,0,0,0-.23,0,.62.62,0,0,0-.53.3L.09,8.3a.61.61,0,0,0,.14.79l2.61,2a9.57,9.57,0,0,0-.09,1.21,9.85,9.85,0,0,0,.09,1.21l-2.61,2a.63.63,0,0,0-.14.79l2.46,4.27A.61.61,0,0,0,3.1,21a.52.52,0,0,0,.21,0l3.07-1.23a9.19,9.19,0,0,0,2.08,1.21l.47,3.27a.61.61,0,0,0,.61.51h4.93a.59.59,0,0,0,.6-.51l.47-3.27a9.42,9.42,0,0,0,2.09-1.21l3.07,1.23a.57.57,0,0,0,.22,0,.6.6,0,0,0,.53-.31l2.47-4.27a.62.62,0,0,0-.15-.79Zm-2.44-2.11a6.41,6.41,0,0,1,.06.9c0,.26,0,.53-.06.9l-.18,1.39,1.1.86,1.33,1L20.12,18l-1.57-.63-1.28-.51-1.11.84a7.57,7.57,0,0,1-1.54.9l-1.31.53-.2,1.39-.24,1.67H11.14l-.24-1.67-.19-1.39L9.4,18.62a7.57,7.57,0,0,1-1.52-.88l-1.12-.86-1.31.53L3.89,18,3,16.54l1.33-1,1.1-.87-.17-1.39a8.91,8.91,0,0,1-.06-.91,8.41,8.41,0,0,1,.06-.9L5.45,10l-1.1-.86L3,8.14l.87-1.49,1.56.63,1.28.52L7.85,7a6.9,6.9,0,0,1,1.54-.9l1.31-.53.19-1.4.25-1.66h1.71l.24,1.66.2,1.4,1.3.53a6.84,6.84,0,0,1,1.52.87l1.12.87,1.31-.53,1.57-.63L21,8.13l-1.32,1-1.1.86ZM12,7.4a4.94,4.94,0,1,0,4.94,4.94A4.94,4.94,0,0,0,12,7.4Zm0,7.4a2.47,2.47,0,1,1,2.47-2.46A2.47,2.47,0,0,1,12,14.8Z"/>
+</svg>

package/icons/library-add.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+  <path fill="currentColor" d="M2.4,4.8H0V21.6A2.4071,2.4071,0,0,0,2.4,24H19.2V21.6H2.4ZM21.6,0H7.2A2.4071,2.4071,0,0,0,4.8,2.4V16.8a2.4071,2.4071,0,0,0,2.4,2.4H21.6A2.4071,2.4071,0,0,0,24,16.8V2.4A2.4071,2.4071,0,0,0,21.6,0Zm0,16.8H7.2V2.4H21.6Zm-8.4-2.4h2.4V10.8h3.6V8.4H15.6V4.8H13.2V8.4H9.6v2.4h3.6Z"/>
+</svg>

package/icons/search.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+  <path fill="currentColor" d="M17.1527,15.0943H16.0686l-.3842-.37a8.933,8.933,0,1,0-.9606.9606l.37.3842v1.0841L21.9554,24,24,21.9554Zm-8.2333,0a6.175,6.175,0,1,1,6.1749-6.1749A6.1667,6.1667,0,0,1,8.9194,15.0943Z"/>
+</svg>

package/inputs/ActionButton/index.js

@@ -1,4 +1,10 @@
-export { A as default } from '../../ActionButton-a63b155c.js';
-import '../../defaultTheme-789305db.js';
-import 'styled-components';
-import 'react';
+'use strict';
+
+var ActionButton = require('../../ActionButton-10a681b9.js');
+require('../../defaultTheme-18d7c1ee.js');
+require('styled-components');
+require('react');
+
+
+
+module.exports = ActionButton.ActionButton;

package/inputs/Button/index.js

@@ -0,0 +1,10 @@
+'use strict';
+
+var Button = require('../../Button-6f6b4ed4.js');
+require('../../defaultTheme-18d7c1ee.js');
+require('styled-components');
+require('react');
+
+
+
+module.exports = Button.Button;

package/inputs/Checkbox/index.js

@@ -0,0 +1,11 @@
+'use strict';
+
+var Checkbox = require('../../Checkbox-791a409f.js');
+require('../../defaultTheme-18d7c1ee.js');
+require('styled-components');
+require('react');
+require('nanoid');
+
+
+
+module.exports = Checkbox.Checkbox;

package/inputs/Radio/index.js

@@ -0,0 +1,12 @@
+'use strict';
+
+var Radio = require('../../Radio-9271a4b6.js');
+require('../../defaultTheme-18d7c1ee.js');
+require('styled-components');
+require('react');
+require('nanoid');
+require('polished');
+
+
+
+module.exports = Radio.Radio;

package/inputs/TextArea/index.js

@@ -0,0 +1,12 @@
+'use strict';
+
+var TextArea = require('../../TextArea-70a74014.js');
+require('../../defaultTheme-18d7c1ee.js');
+require('styled-components');
+require('react');
+require('nanoid');
+require('lodash');
+
+
+
+module.exports = TextArea.TextArea;

package/inputs/TextInput/index.js

@@ -0,0 +1,12 @@
+'use strict';
+
+var TextInput = require('../../TextInput-1ed37e22.js');
+require('../../defaultTheme-18d7c1ee.js');
+require('styled-components');
+require('react');
+require('nanoid');
+require('lodash');
+
+
+
+module.exports = TextInput.TextInput;

package/inputs/index.js

@@ -1,4 +1,25 @@
-export { A as ActionButton } from '../ActionButton-a63b155c.js';
-import '../defaultTheme-789305db.js';
-import 'styled-components';
-import 'react';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var ActionButton = require('../ActionButton-10a681b9.js');
+var Button = require('../Button-6f6b4ed4.js');
+var Checkbox = require('../Checkbox-791a409f.js');
+var Radio = require('../Radio-9271a4b6.js');
+var TextArea = require('../TextArea-70a74014.js');
+var TextInput = require('../TextInput-1ed37e22.js');
+require('../defaultTheme-18d7c1ee.js');
+require('styled-components');
+require('react');
+require('nanoid');
+require('polished');
+require('lodash');
+
+
+
+exports.ActionButton = ActionButton.ActionButton;
+exports.Button = Button.Button;
+exports.Checkbox = Checkbox.Checkbox;
+exports.Radio = Radio.Radio;
+exports.TextArea = TextArea.TextArea;
+exports.TextInput = TextInput.TextInput;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ntbjs/react-components",
-  "version": "0.0.1-beta.4",
+  "version": "0.0.1-beta.42",
   "description": "NTBs common front-end design utilities and React components.",
   "scripts": {
     "build": "cross-env NODE_ENV=production rollup -c",
@@ -33,13 +33,13 @@
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@babel/preset-react": "^7.13.13",
     "@rollup/plugin-babel": "^5.3.0",
-    "@rollup/plugin-commonjs": "^18.0.0",
-    "@rollup/plugin-node-resolve": "^11.2.1",
-    "@storybook/addon-actions": "^6.2.9",
-    "@storybook/addon-docs": "^6.2.9",
-    "@storybook/addon-essentials": "^6.2.9",
-    "@storybook/addon-links": "^6.2.9",
-    "@storybook/react": "^6.2.9",
+    "@rollup/plugin-commonjs": "^19.0.0",
+    "@rollup/plugin-node-resolve": "^13.0.0",
+    "@storybook/addon-actions": "^6.3.4",
+    "@storybook/addon-docs": "^6.3.4",
+    "@storybook/addon-essentials": "^6.3.4",
+    "@storybook/addon-links": "^6.3.4",
+    "@storybook/react": "^6.3.4",
     "@svgr/rollup": "^5.5.0",
     "@svgr/webpack": "^5.5.0",
     "@testing-library/jest-dom": "^5.12.0",
@@ -50,31 +50,34 @@
     "colors": "^1.4.0",
     "cross-env": "^7.0.3",
     "eslint": "^7.24.0",
-    "eslint-plugin-react": "^7.23.2",
+    "eslint-plugin-react": "^7.24.0",
     "identity-obj-proxy": "^3.0.0",
-    "jest": "^26.6.3",
-    "postcss": "^8.2.12",
+    "jest": "^27.0.4",
+    "postcss": "^8.3.0",
     "prop-types": "^15.7.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "rollup": "^2.45.2",
+    "rollup": "^2.50.6",
     "rollup-plugin-copy": "^3.3.0",
     "rollup-plugin-delete": "^2.0.0",
-    "rollup-plugin-multi-input": "^1.2.0",
+    "rollup-plugin-multi-input": "^1.3.1",
     "rollup-plugin-peer-deps-external": "^2.2.0",
     "rollup-plugin-postcss": "^4.0.0",
     "rollup-plugin-scss": "^2.6.1",
     "rollup-plugin-url": "^3.0.1",
-    "sass": "^1.32.11",
+    "sass": "^1.34.1",
     "sass-loader": "^10.1.1",
-    "storybook-dark-mode": "^1.0.7",
+    "storybook-dark-mode": "^1.0.8",
     "url-loader": "^4.1.1"
   },
   "dependencies": {
     "@restart/hooks": "^0.3.26",
     "@tippyjs/react": "^4.2.5",
     "lodash": "^4.17.21",
+    "nanoid": "^3.1.25",
+    "polished": "^4.1.3",
     "react-lazy-load-image-component": "^1.5.1",
-    "styled-components": "^5.2.3"
+    "resize-observer-polyfill": "^1.5.1",
+    "styled-components": "^5.3.1"
   }
 }

package/ssr/index.js

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styled = require('styled-components');
+
+
+
+Object.defineProperty(exports, 'ServerStyleSheet', {
+	enumerable: true,
+	get: function () {
+		return styled.ServerStyleSheet;
+	}
+});

package/styles/config.scss

@@ -9,6 +9,7 @@ $colors: (
   'emerald-300': #bfe0d5,
   'emerald-200': #f3f9f7,
   'gray-900': #141313,
+  'gray-800': #272727,
   'gray-700': #323232,
   'gray-600': #505050,
   'gray-500': #767676,

package/styles/utils/colors.scss

@@ -1,4 +1,4 @@
-@import 'src/styles/config';
+@import '../config';
 
 @function color($name) {
   @if map-has-key($colors, $name) {

package/widgets/AssetGallery/index.js

@@ -1,9 +1,24 @@
-export { A as default } from '../../AssetGallery-2e86f16a.js';
-import '../../defaultTheme-789305db.js';
-import 'styled-components';
-import 'react';
-import 'lodash';
-import 'react-lazy-load-image-component';
-import '../../ActionButton-a63b155c.js';
-import '../../Tooltip-609bad98.js';
-import '@tippyjs/react';
+'use strict';
+
+var AssetGallery = require('../../AssetGallery-b52dbb14.js');
+require('../../defaultTheme-18d7c1ee.js');
+require('styled-components');
+require('react');
+require('lodash');
+require('resize-observer-polyfill');
+require('react-lazy-load-image-component');
+require('../../ActionButton-10a681b9.js');
+require('../../Button-6f6b4ed4.js');
+require('../../Checkbox-791a409f.js');
+require('nanoid');
+require('../../Radio-9271a4b6.js');
+require('polished');
+require('../../TextArea-70a74014.js');
+require('../../TextInput-1ed37e22.js');
+require('../../Popover-0ff13419.js');
+require('@tippyjs/react');
+require('../../Tooltip-85e7d561.js');
+
+
+
+module.exports = AssetGallery.AssetGallery;

package/widgets/index.js

@@ -1,9 +1,26 @@
-export { A as AssetGallery } from '../AssetGallery-2e86f16a.js';
-import '../defaultTheme-789305db.js';
-import 'styled-components';
-import 'react';
-import 'lodash';
-import 'react-lazy-load-image-component';
-import '../ActionButton-a63b155c.js';
-import '../Tooltip-609bad98.js';
-import '@tippyjs/react';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var AssetGallery = require('../AssetGallery-b52dbb14.js');
+require('../defaultTheme-18d7c1ee.js');
+require('styled-components');
+require('react');
+require('lodash');
+require('resize-observer-polyfill');
+require('react-lazy-load-image-component');
+require('../ActionButton-10a681b9.js');
+require('../Button-6f6b4ed4.js');
+require('../Checkbox-791a409f.js');
+require('nanoid');
+require('../Radio-9271a4b6.js');
+require('polished');
+require('../TextArea-70a74014.js');
+require('../TextInput-1ed37e22.js');
+require('../Popover-0ff13419.js');
+require('@tippyjs/react');
+require('../Tooltip-85e7d561.js');
+
+
+
+exports.AssetGallery = AssetGallery.AssetGallery;

package/ActionButton-a63b155c.js

@@ -1,31 +0,0 @@
-import { a as applyDefaultTheme, _ as _taggedTemplateLiteral, b as _objectWithoutProperties, c as _extends, p as propTypes } from './defaultTheme-789305db.js';
-import React__default from 'react';
-import styled from 'styled-components';
-
-var _templateObject;
-var ActionButton$1 = styled.button.attrs(applyDefaultTheme)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  height: 40px;\n  width: 40px;\n  border: 0;\n  color: inherit;\n  background-color: transparent;\n  ", "\n  background-position: center;\n  background-repeat: no-repeat;\n  background-size: 0 0;\n  transition: background-size 250ms ease;\n  cursor: pointer;\n\n  :hover:not(:disabled) {\n    background-size: 200% 200%;\n\n    svg {\n      ", ";\n    }\n  }\n\n  &:disabled {\n    opacity: 0.5;\n    color: inherit;\n    cursor: not-allowed;\n  }\n\n  svg {\n    width: 100%;\n    max-height: 20px;\n    max-width: 20px;\n    pointer-events: none;\n    transition: color 250ms;\n  }\n"])), function (props) {
-  return props.theme.themeProp('background-image', "radial-gradient(circle at center, ".concat(props.theme.getColor('gray-600'), " 50%, transparent 50%)"), "radial-gradient(circle at center, ".concat(props.theme.getColor('gray-200'), " 50%, transparent 50%)"));
-}, function (props) {
-  return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-700'));
-});
-
-var ActionButton = React__default.forwardRef(function ActionButton(_ref, forwardedRef) {
-  var icon = _ref.icon,
-      disabled = _ref.disabled,
-      onClick = _ref.onClick,
-      props = _objectWithoutProperties(_ref, ["icon", "disabled", "onClick"]);
-
-  return React__default.createElement(ActionButton$1, _extends({
-    ref: forwardedRef,
-    disabled: disabled,
-    onClick: onClick
-  }, props), icon);
-});
-ActionButton.propTypes = process.env.NODE_ENV !== "production" ? {
-  icon: propTypes.element.isRequired,
-  disabled: propTypes.bool,
-  onClick: propTypes.func.isRequired
-} : {};
-ActionButton.defaultProps = {};
-
-export { ActionButton as A };